/* =========================================================
   BDP NAVBAR (Professional + Unique + Fully Responsive)
   ========================================================= */

:root{
  --bdp-h: 72px;
  --bdp-bg: rgba(10,12,16,.92);
  --bdp-elev: #0f1318;
  --bdp-border: rgba(255,255,255,.08);
  --bdp-border2: rgba(255,255,255,.12);
  --bdp-text: #fff;
  --bdp-muted: rgba(255,255,255,.70);
  --bdp-accent: #22c55e;
  --bdp-gold1: #fbbf24;
  --bdp-gold2: #d97706;
  --bdp-radius: 12px;
  --bdp-radius-lg: 16px;
  --bdp-shadow: 0 14px 50px rgba(0,0,0,.45);
  --bdp-tr: all .22s cubic-bezier(.2,.8,.2,1);
}

.bdp-mega__title{
    position: relative !important;
    display: inline-block !important;
}

.bdp-mega-new-tag{
    position: absolute !important;
    top: -3px !important;
    right: -45px !important;

    font-size: 10px !important;
    padding: 2px 6px !important;
    border-radius: 10px !important;

    background: linear-gradient(135deg, #ff416c, #ff4b2b) !important;
    color: #fff !important;

    font-weight: 700 !important;
    letter-spacing: .3px !important;
    line-height: 1 !important;

    animation: bdpMegaBlink 1.2s infinite !important;
    box-shadow: 0 0 8px rgba(255, 75, 43, 0.55) !important;

    /* extra safety */
    z-index: 9 !important;
    white-space: nowrap !important;
}



@keyframes bdpMegaBlink{
    0%   { opacity: 1; transform: scale(1); }
    50%  { opacity: .45; transform: scale(1.05); }
    100% { opacity: 1; transform: scale(1); }
}



/* Prevent scroll when drawer open */
html.bdp-no-scroll, body.bdp-no-scroll{ overflow: hidden !important; }

/* ===== NAV WRAPPER ===== */
.bdp-nav{
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 9999;
  background: var(--bdp-bg);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--bdp-border);
}

.bdp-nav__wrap{
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 18px;
}

.drop-down .drop-down-btn,
.drop-down .drop-down-btn *{
  color: #f7f4f4 !important;
}

.drop-down .drop-down-btn:hover,
.drop-down .drop-down-btn:hover *{
  color: #f7f4f4 !important;
}

.dashboard-sidebar .dashboard-sidebar-header {
        background-color: #000;
}

.dashboard-nav {
    background-color: #000;
}


.bdp-nav__row{
  height: var(--bdp-h);
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: 14px;
}

/* ===== LEFT ===== */
.bdp-nav__left{ min-width: 0; display:flex; align-items:center; }
.bdp-nav__brand{
  display:flex;
  align-items:center;
  text-decoration:none;
}
.bdp-nav__brand img{
  height: 36px;
  width: auto;
  max-width: 180px;
  object-fit: contain;
  filter: brightness(1.12);
}

/* ===== ICON NORMALIZE (prevents big icons) ===== */
.bdp-nav i{ line-height: 1; }
.bdp-ic i, .bdp-iconbtn i, .bdp-dd__btn i, .bdp-acc__btn i{
  font-size: 15px !important;
}

/* ===== CENTER (DESKTOP) ===== */
.bdp-nav__center{
  min-width: 0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 12px;

  /* if too many items, scroll instead of overlap */
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.bdp-nav__center::-webkit-scrollbar{ display:none; }
.bdp-nav__center > *{ flex: 0 0 auto; }

/* ===== RIGHT (DESKTOP) ===== */
.bdp-nav__right{
  display:flex;
  align-items:center;
  gap: 10px;
}

/* ===== DESKTOP/MOBILE VISIBILITY ===== */
.bdp-desktop{ display: flex; }
.bdp-mobile{ display: none; }

@media (max-width: 991.98px){
  :root{ --bdp-h: 62px; }
  .bdp-desktop{ display: none !important; }
  .bdp-mobile{ display: flex !important; }
  .bdp-nav__row{ grid-template-columns: auto 1fr auto; }
  .bdp-nav__brand img{ height: 32px; max-width: 150px; }
}

/* ===== BUTTONS ===== */
.bdp-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap: 8px;
  height: 40px;
  padding: 0 14px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  text-decoration:none;
  transition: var(--bdp-tr);
  border: 1px solid transparent;
  white-space: nowrap;
}
.bdp-btn--ghost{
  color: var(--bdp-text);
  background: rgba(255,255,255,.06);
  border-color: var(--bdp-border2);
}
.bdp-btn--ghost:hover{
  background: rgba(255,255,255,.10);
  border-color: rgba(34,197,94,.35);
  transform: translateY(-1px);
}
.bdp-btn--primary{
  color: #06110a;
  background: var(--bdp-accent);
  border-color: rgba(34,197,94,.2);
}
.bdp-btn--primary:hover{
  filter: brightness(0.95);
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(34,197,94,.22);
}
.bdp-btn--gold{
  width: 100%;
  color: #1b1203;
  background: linear-gradient(135deg,var(--bdp-gold1),var(--bdp-gold2));
}
.bdp-btn--gold:hover{ transform: translateY(-1px); }
.bdp-btn--full{ width:100%; }

/* ===== ICON BUTTON ===== */
.bdp-iconbtn{
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background: rgba(255,255,255,.06);
  border: 1px solid var(--bdp-border2);
  color: var(--bdp-text);
  position: relative;
  transition: var(--bdp-tr);
  text-decoration:none;
}
.bdp-iconbtn:hover{
  background: rgba(255,255,255,.10);
  border-color: rgba(34,197,94,.35);
  transform: translateY(-1px);
}
.bdp-bubble{
  position:absolute;
  top: -6px;
  right: -6px;
  min-width: 18px;
  height: 18px;
  padding: 0 6px;
  border-radius: 999px;
  background: #ef4444;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  display:flex;
  align-items:center;
  justify-content:center;
}

/* ===== DROPDOWN (DESKTOP) ===== */
.bdp-dd{ position: relative; }
.bdp-dd__btn{
  height: 42px;
  display:inline-flex;
  align-items:center;
  gap: 10px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid var(--bdp-border2);
  background: rgba(255,255,255,.06);
  color: var(--bdp-text);
  cursor:pointer;
  transition: var(--bdp-tr);
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
}
.bdp-dd__btn:hover{
  background: rgba(255,255,255,.10);
  border-color: rgba(34,197,94,.35);
  transform: translateY(-1px);
}
.bdp-ic--chev{ opacity:.85; }

.bdp-dd__menu{
  position:absolute;
  top: calc(100% + 10px);
  min-width: 290px;
  padding: 14px;
  border-radius: var(--bdp-radius-lg);
  background: #0f1318;
  border: 1px solid var(--bdp-border2);
  box-shadow: var(--bdp-shadow);
  opacity:0;
  visibility:hidden;
  transform: translateY(10px);
  transition: var(--bdp-tr);
  z-index: 10050;
}
.bdp-dd__menu--start{ left:0; }
.bdp-dd.is-open > .bdp-dd__menu{
  opacity:1;
  visibility:visible;
  transform: translateY(0);
}

.bdp-dd__search{
  position: relative;
  margin-bottom: 10px;
}
.bdp-dd__search i{
  position:absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--bdp-muted);
  font-size: 13px !important;
}
.bdp-dd__search input{
  width:100%;
  height: 40px;
  border-radius: 12px;
  border: 1px solid var(--bdp-border2);
  background: rgba(0,0,0,.20);
  color: var(--bdp-text);
  padding: 0 12px 0 36px;
  outline: none;
}
.bdp-dd__search input:focus{
  border-color: rgba(34,197,94,.5);
  box-shadow: 0 0 0 3px rgba(34,197,94,.12);
}

.bdp-dd__item{
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 10px 10px;
  border-radius: 12px;
  color: var(--bdp-text);
  text-decoration:none;
  transition: var(--bdp-tr);
}
.bdp-dd__item:hover{
  background: rgba(255,255,255,.06);
  color: var(--bdp-accent);
}
.bdp-dd__sep{
  height: 1px;
  background: var(--bdp-border2);
  margin: 10px 0;
}
.bdp-dd__list{
  max-height: 280px;
  overflow:auto;
  padding-right: 4px;
}
.bdp-dd__grow{ flex: 1; }
.bdp-flag{ width: 22px; text-align:center; font-size: 18px; }

/* ===== MEGA PANEL ===== */
.bdp-mega .bdp-mega__panel{
  position: fixed;
  left: 50%;
  transform: translateX(-50%) translateY(12px);
  top: calc(var(--bdp-h) + 2px);
  width: min(1200px, 92vw);
  padding: 18px;
  border-radius: var(--bdp-radius-lg);
  background: #0f1318;
  border: 1px solid var(--bdp-border2);
  box-shadow: var(--bdp-shadow);
  opacity:0;
  visibility:hidden;
  transition: var(--bdp-tr);
  z-index: 10040;
}
.bdp-mega.is-open .bdp-mega__panel{
  opacity:1;
  visibility:visible;
  transform: translateX(-50%) translateY(0);
}
.bdp-mega__grid{
  display:grid;
  grid-template-columns: 1fr 1fr 360px;
  gap: 18px;
}
@media (max-width: 1199.98px){
  .bdp-mega__grid{ grid-template-columns: 1fr 1fr; }
  .bdp-mega__promo{ grid-column: 1 / -1; }
}
.bdp-mega__head{
  font-weight: 800;
  color: var(--bdp-text);
  opacity: .9;
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 6px 2px 10px;
  border-bottom: 1px solid var(--bdp-border2);
  margin-bottom: 10px;
}
.bdp-mega__item{
  display:flex;
  align-items:center;
  gap: 12px;
  padding: 12px;
  border-radius: 14px;
  text-decoration:none;
  color: var(--bdp-text);
  background: rgba(255,255,255,.03);
  border: 1px solid transparent;
  transition: var(--bdp-tr);
}
.bdp-mega__item:hover{
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.08);
  transform: translateX(3px);
}
.bdp-mega__icon{
  width: 36px;
  height: 36px;
  border-radius: 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(34,197,94,.12);
  color: var(--bdp-accent);
}
.bdp-mega__title{ font-weight: 800; display:block; }
.bdp-mega__sub{ display:block; font-size: 12px; color: var(--bdp-muted); margin-top: 2px; }
.bdp-mega__arr{ margin-left:auto; opacity:.6; font-size: 20px !important; }
.bdp-mega__item:hover .bdp-mega__arr{ opacity: 1; color: var(--bdp-accent); }

/* Promo card */
.bdp-card{
  border-radius: 16px;
  padding: 16px;
  border: 1px solid rgba(34,197,94,.22);
  background: linear-gradient(135deg, rgba(34,197,94,.12), rgba(14,165,233,.10));
}
.bdp-badge{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(34,197,94,.18);
  color: var(--bdp-accent);
  font-weight: 800;
  font-size: 12px;
}
.bdp-card__title{ margin-top: 10px; font-size: 18px; font-weight: 900; }
.bdp-card__sub{ margin-top: 6px; color: var(--bdp-muted); font-size: 13px; line-height: 1.5; }
.bdp-list{
  list-style:none;
  padding: 10px 0 0;
  margin: 0 0 12px;
  display:flex;
  flex-direction:column;
  gap: 8px;
  color: var(--bdp-muted);
  font-weight: 600;
}
.bdp-list i{ color: var(--bdp-accent); }

/* ===== MOBILE DRAWER ===== */
.bdp-nav__mobile{
  justify-content:flex-end;
  gap: 10px;
  z-index: 10002; /* ensure clickable above brand */
}

.bdp-drawer{
  position: fixed;
  inset: 0;
  z-index: 100000;
  opacity: 0;
  visibility: hidden;
  transition: var(--bdp-tr);
}
.bdp-drawer.is-open{
  opacity: 1;
  visibility: visible;
}

.bdp-drawer__overlay{
  position:absolute;
  inset: 0;
  background: rgba(0,0,0,.70);
  backdrop-filter: blur(2px);
}

.bdp-drawer__panel{
  position:absolute;
  top: 0;
  right: 0;
  width: min(360px, 92vw);
  height: 100%;
  background: #0b0d10;
  border-left: 1px solid var(--bdp-border2);
  transform: translateX(100%);
  transition: var(--bdp-tr);
  display:flex;
  flex-direction:column;
}
.bdp-drawer.is-open .bdp-drawer__panel{ transform: translateX(0); }

.bdp-drawer__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 16px;
  border-bottom: 1px solid var(--bdp-border);
}
.bdp-drawer__brand{
  display:flex;
  align-items:center;
  gap: 10px;
  font-weight: 900;
  color: var(--bdp-text);
}
.bdp-drawer__brand img{ height: 28px; width:auto; max-width: 150px; object-fit:contain; }

.bdp-drawer__body{
  padding: 14px 14px 22px;
  
}

/* ================================
   Drawer: force solid black + fix transparency
   ================================ */

#bdpDrawer .bdp-drawer__panel{
  background: #000 !important;          /* solid black */
  opacity: 1 !important;
  z-index: 2147483647 !important;
}

#bdpDrawer .bdp-drawer__head,
#bdpDrawer .bdp-drawer__body{
  background: #000 !important;          /* solid black inside too */
}

#bdpDrawer .bdp-drawer__body{
  padding: 14px 14px 22px !important;
}

/* overlay stays behind the panel */
#bdpDrawer .bdp-drawer__overlay{
  background: rgba(0,0,0,.70) !important;
  z-index: 2147483646 !important;
}


/* Drawer links */
.bdp-drawer__link{
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 12px 12px;
  border-radius: 14px;
  text-decoration:none;
  color: var(--bdp-text);
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  transition: var(--bdp-tr);
  margin-bottom: 10px;
}
.bdp-drawer__link:hover{
  background: rgba(255,255,255,.06);
  border-color: rgba(34,197,94,.30);
  color: var(--bdp-accent);
}
.bdp-drawer__sep{
  height: 1px;
  background: var(--bdp-border2);
  margin: 12px 0;
}
.bdp-drawer__block{ margin-bottom: 10px; }

/* Accordion (mobile) */
.bdp-acc{
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
  overflow:hidden;
  margin-bottom: 10px;
}
.bdp-acc__btn{
  width: 100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 12px 12px;
  background: transparent;
  border: 0;
  color: var(--bdp-text);
  font-weight: 800;
  cursor:pointer;
}
.bdp-acc__panel{
  max-height: 0;
  overflow:hidden;
  transition: max-height .25s ease;
  padding: 0 12px;
}
.bdp-acc.is-open .bdp-acc__panel{
  max-height: 900px;
  padding: 10px 12px 12px;
}

/* Mobile search style */
.bdp-dd__search--mobile{ margin-bottom: 8px; }
.bdp-drawer__list{ max-height: 300px; overflow:auto; padding-right: 4px; }
/* =========================================================
   FINAL FIX PATCH (put at END of file)
   Fix: big currency icon, dropdown under hero, mobile toggle z-index
   ========================================================= */

/* 1) Make sure navbar always sits above hero/sections */
.bdp-nav{
  z-index: 99999 !important;
  isolation: isolate; /* creates a clean stacking context */
}

/* 2) Mobile buttons must always be clickable */
.bdp-nav__mobile{
  position: relative !important;
  z-index: 100000 !important;
}

/* 3) Dropdown menus must render above everything */
.bdp-dd,
.bdp-mega{
  position: relative !important;
  z-index: 100001 !important;
}

.bdp-dd__menu,
.bdp-mega__panel{
  z-index: 100005 !important;
}

/* 4) IMPORTANT: if center was using overflow to avoid overlap,
      it CLIPS dropdown menus. So force overflow visible */
.bdp-nav__center{
  overflow: visible !important;
}

/* (Optional but recommended) keep desktop overlap safe WITHOUT clipping */
@media (min-width: 992px){
  .bdp-nav__center{
    min-width: 0 !important;
    flex-wrap: nowrap !important;
  }
}

/* 5) Fix currency icon being too big (currency partial overrides) */
.bdp-nav .currencies-menu i,
.bdp-nav .currencies-menu .bi,
.bdp-nav .currencies-menu .fa,
.bdp-nav .currencies-menu svg{
  font-size: 14px !important;
  width: 14px !important;
  height: 14px !important;
  line-height: 1 !important;
}

/* If currency uses flag images/icons */
.bdp-nav .currencies-menu img,
.bdp-nav .currencies-menu .flag,
.bdp-nav .currencies-menu .fi{
  width: 16px !important;
  height: 16px !important;
  object-fit: cover !important;
  border-radius: 50% !important;
}

/* 6) Dropdown position: keep it on top and not behind hero */
.bdp-dd__menu{
  position: absolute !important;
  top: calc(100% + 10px) !important;
}
/* =========================================================
   HARD OVERRIDES (put at VERY END)
   ========================================================= */

/* NAV always above everything */
#bdpNav.bdp-nav{
  position: fixed !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  z-index: 2147483647 !important; /* max practical */
  isolation: isolate !important;
}

/* If any parent uses transform, it can break stacking.
   Force navbar children to be positioned */
#bdpNav .bdp-nav__wrap,
#bdpNav .bdp-nav__row,
#bdpNav .bdp-nav__left,
#bdpNav .bdp-nav__center,
#bdpNav .bdp-nav__right,
#bdpNav .bdp-nav__mobile{
  position: relative !important;
  z-index: 2147483647 !important;
}

/* Mobile toggle MUST be clickable */
#bdpNav #bdpDrawerOpen{
  position: relative !important;
  z-index: 2147483647 !important;
  pointer-events: auto !important;
}

/* Drawer above all */
#bdpDrawer.bdp-drawer{
  z-index: 2147483647 !important;
}
#bdpDrawer .bdp-drawer__panel{
  z-index: 2147483647 !important;
}

/* Dropdowns above hero */
#bdpNav .bdp-dd__menu,
#bdpNav .bdp-mega__panel{
  z-index: 2147483647 !important;
}

/* IMPORTANT: dropdowns get clipped if center has overflow */
#bdpNav .bdp-nav__center{
  overflow: visible !important;
}

/* =========================================================
   Fix big Country/Currency “India” and “USD” icons
   Works for emoji, images, svg, spans, and flag-icon libs
   ========================================================= */

/* Country button flag + Currency button flag/icon */
#bdpNav .bdp-dd__btn .bdp-ic,
#bdpNav .bdp-dd__btn img,
#bdpNav .bdp-dd__btn svg,
#bdpNav .bdp-dd__btn .flag,
#bdpNav .bdp-dd__btn .fi,
#bdpNav .currencies-menu .bdp-dd__btn img,
#bdpNav .currencies-menu .bdp-dd__btn svg,
#bdpNav .currencies-menu .bdp-dd__btn .flag,
#bdpNav .currencies-menu .bdp-dd__btn .fi{
  width: 16px !important;
  height: 16px !important;
  line-height: 16px !important;
  font-size: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* If those icons are plain TEXT spans (emoji), clamp them */
#bdpNav .bdp-dd__btn .bdp-ic,
#bdpNav .currencies-menu .bdp-dd__btn .bdp-ic{
  font-size: 14px !important;
}

/* If flag uses <img> */
#bdpNav .bdp-dd__btn img,
#bdpNav .currencies-menu img{
  object-fit: cover !important;
  border-radius: 50% !important;
}

/* If currency uses <i> icons */
#bdpNav .currencies-menu i,
#bdpNav .currencies-menu .bi,
#bdpNav .currencies-menu .fa{
  font-size: 14px !important;
  line-height: 1 !important;
}
/* Currency icon styling (₹ / $) */
.custom-navbar .bdp-cur-ic{
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  line-height: 1;
  font-weight: 700;
  border-radius: 6px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.12);
}

.custom-navbar .bdp-cur-code{
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.2px;
  margin-right: 6px;
}

.custom-navbar .bdp-cur-caret{
  font-size: 14px;
  line-height: 1;
}
/* =========================================================
   BDP Currency Dropdown (matches navbar pills)
   Works with existing .drop-down plugin
   ========================================================= */

#bdpNav .bdp-currency{
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
}

/* Button (same feel as other pills) */
#bdpNav .bdp-currency .bdp-cur-btn.drop-down-btn{
  height: 42px !important;
  padding: 0 14px !important;
  border-radius: 999px !important;

  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;

  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  color: #fff !important;

  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  white-space: nowrap !important;

  cursor: pointer !important;
  transition: all .22s cubic-bezier(.2,.8,.2,1) !important;
}

#bdpNav .bdp-currency .bdp-cur-btn.drop-down-btn:hover{
  background: rgba(255,255,255,.10) !important;
  border-color: rgba(34,197,94,.35) !important;
  transform: translateY(-1px) !important;
}

/* Flag chip (colorful) */
#bdpNav .bdp-currency .bdp-cur-flag{
  width: 20px !important;
  height: 20px !important;
  border-radius: 8px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  font-size: 16px !important;
  line-height: 1 !important;

  background: linear-gradient(135deg, rgba(34,197,94,.18), rgba(14,165,233,.16)) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
}

/* Currency code text */
#bdpNav .bdp-currency .bdp-cur-code{
  font-size: 13px !important;
  font-weight: 900 !important;
  letter-spacing: .3px !important;
  opacity: .96 !important;
}

/* Caret */
#bdpNav .bdp-currency .bdp-cur-caret{
  font-size: 14px !important;
  line-height: 1 !important;
  opacity: .85 !important;
}

/* Dropdown menu */
#bdpNav .bdp-currency .bdp-cur-menu.drop-down-menu{
  min-width: 190px !important;
  padding: 10px !important;
  border-radius: 16px !important;

  background: #0f1318 !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,.55) !important;

  z-index: 2147483647 !important;
}

/* Items */
#bdpNav .bdp-currency .bdp-cur-item.drop-down-item{
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;

  padding: 10px 10px !important;
  border-radius: 12px !important;

  color: #fff !important;
  transition: all .22s cubic-bezier(.2,.8,.2,1) !important;
}

#bdpNav .bdp-currency .bdp-cur-item.drop-down-item:hover{
  background: rgba(255,255,255,.06) !important;
  color: #22c55e !important;
}

/* Active */
#bdpNav .bdp-currency .bdp-cur-item.active{
  background: rgba(34,197,94,.10) !important;
  border: 1px solid rgba(34,197,94,.18) !important;
}

/* Make sure currency icons never become huge */
#bdpNav .bdp-currency i,
#bdpNav .bdp-currency .fa,
#bdpNav .bdp-currency .bi,
#bdpNav .bdp-currency svg{
  font-size: 14px !important;
  line-height: 1 !important;
}

/* Optional: thin scrollbar if menu ever scrolls */
#bdpNav .bdp-currency .bdp-cur-menu::-webkit-scrollbar{ width: 4px; }
#bdpNav .bdp-currency .bdp-cur-menu::-webkit-scrollbar-thumb{
  background: rgba(255,255,255,.18);
  border-radius: 999px;
}

/* 1) Add space from top (gap between button and menu) */
#bdpNav .bdp-currency .bdp-cur-menu.drop-down-menu{
  margin-top: 6px !important;         /* space from top */
  top: calc(100% + 10px) !important;   /* if plugin uses top:100% */
}

#bdpNav .bdp-cur-flag,
#bdpDrawer .bdp-cur-flag{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width: 26px !important;
  min-width: 26px !important;
  height: 20px !important;
}

#bdpNav .bdp-cur-flag img,
#bdpDrawer .bdp-cur-flag img{
  width: 24px !important;
  height: 18px !important;
  object-fit: cover !important;
  border-radius: 0 !important; /* ✅ not round */
  display:block !important;
}


/* ============================================
   DRAWER OVERLAY FIX (must cover full page)
   ============================================ */

#bdpDrawer.bdp-drawer{
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483647 !important;
  pointer-events: none !important;   /* closed: no blocking */
}

#bdpDrawer.bdp-drawer.is-open{
  pointer-events: auto !important;   /* open: clickable */
}

/* Overlay + panel always above everything */
#bdpDrawer .bdp-drawer__overlay,
#bdpDrawer .bdp-drawer__panel{
  position: fixed !important;
  top: 0 !important;
  bottom: 0 !important;
}

#bdpDrawer .bdp-drawer__overlay{
  left: 0 !important;
  right: 0 !important;
  z-index: 2147483647 !important;
}

#bdpDrawer .bdp-drawer__panel{
  right: 0 !important;
  left: auto !important;
  z-index: 2147483647 !important;
}

/* IMPORTANT: neutralize transformed parents that break fixed overlays */
body.bdp-no-scroll,
html.bdp-no-scroll{
  transform: none !important;
}

body.bdp-no-scroll #app,
body.bdp-no-scroll .app,
body.bdp-no-scroll .wrapper,
body.bdp-no-scroll .page-wrapper,
body.bdp-no-scroll main{
  transform: none !important;
  filter: none !important;
}
/* ============================================
   MOBILE: mega/accordion submenu scroll
   ============================================ */
/* ==================================================
   MOBILE: scroll ONLY the opened submenu (not whole drawer)
   ================================================== */
@media (max-width: 991.98px){

  /* ✅ Reset: don't force body scroll */
  #bdpDrawer .bdp-drawer__body{
    overflow: visible !important;
  }

  /* ✅ Only the opened accordion panel should scroll */
  #bdpDrawer .bdp-acc__panel{
    overflow: hidden !important;
    max-height: 0 !important;
  }

  #bdpDrawer .bdp-acc.is-open .bdp-acc__panel{
    /* panel expands but becomes its own scroll container */
    max-height: 55vh !important;           /* adjust 45–65vh */
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  /* If your submenu is a long list inside panel */
  #bdpDrawer .bdp-acc.is-open .bdp-dd__list,
  #bdpDrawer .bdp-acc.is-open .bdp-drawer__list{
    max-height: 45vh !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
}
/* ============================================
   MOBILE: hide / thin scrollbars (submenu only)
   ============================================ */
@media (max-width: 991.98px){

  /* Targets ONLY the scrolling submenu areas */
  #bdpDrawer .bdp-acc.is-open .bdp-acc__panel,
  #bdpDrawer .bdp-acc.is-open .bdp-dd__list,
  #bdpDrawer .bdp-acc.is-open .bdp-drawer__list{
    scrollbar-width: thin;                 /* Firefox */
    scrollbar-color: rgba(255,255,255,.18) transparent;
  }

  /* Chrome/Edge/Safari */
  #bdpDrawer .bdp-acc.is-open .bdp-acc__panel::-webkit-scrollbar,
  #bdpDrawer .bdp-acc.is-open .bdp-dd__list::-webkit-scrollbar,
  #bdpDrawer .bdp-acc.is-open .bdp-drawer__list::-webkit-scrollbar{
    width: 3px;                            /* ultra thin */
    height: 3px;
  }

  #bdpDrawer .bdp-acc.is-open .bdp-acc__panel::-webkit-scrollbar-track,
  #bdpDrawer .bdp-acc.is-open .bdp-dd__list::-webkit-scrollbar-track,
  #bdpDrawer .bdp-acc.is-open .bdp-drawer__list::-webkit-scrollbar-track{
    background: transparent;
  }

  #bdpDrawer .bdp-acc.is-open .bdp-acc__panel::-webkit-scrollbar-thumb,
  #bdpDrawer .bdp-acc.is-open .bdp-dd__list::-webkit-scrollbar-thumb,
  #bdpDrawer .bdp-acc.is-open .bdp-drawer__list::-webkit-scrollbar-thumb{
    background: rgba(255,255,255,.18);
    border-radius: 999px;
  }
}

/* ✅ If you want FULLY hidden scrollbar (still scroll works),
   uncomment this block (best for iOS/Chrome) */
/*
@media (max-width: 991.98px){
  #bdpDrawer .bdp-acc.is-open .bdp-acc__panel::-webkit-scrollbar,
  #bdpDrawer .bdp-acc.is-open .bdp-dd__list::-webkit-scrollbar,
  #bdpDrawer .bdp-acc.is-open .bdp-drawer__list::-webkit-scrollbar{
    width: 0 !important;
    height: 0 !important;
  }
}
*/

/* =========================================================
   MOBILE: keep currency dropdown inside drawer (align right)
   ========================================================= */
@media (max-width: 991.98px){

  /* Make sure the currency dropdown is a positioned anchor inside drawer */
  #bdpDrawer .bdp-currency{
    position: relative !important;
    width: 100% !important;
  }

  /* Make the currency button fill drawer width */
  #bdpDrawer .bdp-currency .bdp-cur-btn{
    width: 100% !important;
    justify-content: space-between !important;
  }

  /* Force dropdown menu to open INSIDE drawer and align RIGHT */
  #bdpDrawer .bdp-currency .bdp-cur-menu.drop-down-menu{
    left: auto !important;
    right: 0 !important;         /* ✅ shift to right */
    width: 100% !important;      /* ✅ no overflow */
    max-width: 100% !important;
    transform: none !important;
  }

  /* If your dropdown plugin uses translate, kill it */
  #bdpDrawer .bdp-currency .drop-down-menu{
    transform: none !important;
  }
}
/* Desktop: keep flag icon, hide ISO text like "IN" if it is rendered as text */
@media (min-width: 992px){
  #bdpNav .bdp-dd__btn .bdp-flag{
    font-size: 18px !important;
    line-height: 1 !important;
  }

  /* If your flag span accidentally prints ISO text (e.g. "IN") */
  #bdpNav .bdp-dd__btn .bdp-flag:not(:has(img)):not(:has(svg)){
    /* allow emoji flag like 🇮🇳 but not plain "IN" */
  }
}

/* =========================================================
   CURRENCY PILL: HIGH CONTRAST (PURE WHITE TEXT)
   Put at VERY END of navbar.css
   ========================================================= */

/* 1) Force button text/icons to be PURE WHITE */
#bdpNav .bdp-currency .bdp-cur-btn,
#bdpNav .bdp-currency .bdp-cur-btn *{
  color: #ffffff !important;
  opacity: 1 !important;
  filter: none !important;
  text-shadow: none !important;
}

/* 2) Stronger button background + border for contrast */
#bdpNav .bdp-currency .bdp-cur-btn.drop-down-btn{
  background: rgba(255,255,255,.10) !important;     /* was .06 */
  border-color: rgba(255,255,255,.22) !important;    /* was .12 */
}

/* 3) Hover: more contrast */
#bdpNav .bdp-currency .bdp-cur-btn.drop-down-btn:hover{
  background: rgba(255,255,255,.14) !important;
  border-color: rgba(34,197,94,.55) !important;
}


/* ================================
   FIX: remove green rounded chip behind flag image
   ================================ */

/* When showing real flag images, kill the chip background */
#bdpNav .bdp-currency .bdp-cur-flag,
#bdpDrawer .bdp-currency .bdp-cur-flag{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
}

/* Ensure the flag itself is clean rectangle */
#bdpNav .bdp-cur-flag img,
#bdpDrawer .bdp-cur-flag img{
  display: block !important;
  width: 24px !important;
  height: 18px !important;
  object-fit: cover !important;
  border-radius: 0 !important; /* not round */
}





/* 5) Make emoji flag look bold and not faded */
#bdpNav .bdp-currency .bdp-cur-flag{
  font-size: 17px !important;
  line-height: 1 !important;
  filter: saturate(1.15) contrast(1.15) !important;
}

/* 6) Currency code: pure white + heavier */
#bdpNav .bdp-currency .bdp-cur-code{
  color: #ffffff !important;
  font-weight: 900 !important;
  letter-spacing: .35px !important;
  opacity: 1 !important;
}

/* 7) Caret: pure white */
#bdpNav .bdp-currency .bdp-cur-caret{
  color: #ffffff !important;
  opacity: .95 !important;
}

/* 8) Dropdown menu items: ensure readable white */
#bdpNav .bdp-currency .bdp-cur-menu.drop-down-menu,
#bdpNav .bdp-currency .bdp-cur-menu.drop-down-menu *{
  color: #ffffff !important;
  opacity: 1 !important;
}
#bdpNav .bdp-currency .bdp-cur-flag{
  -webkit-font-smoothing: auto !important;
  font-smooth: always !important;
}



/* Stacked list */
.bdp-promo-list{
  width:100%;
  display:grid;
  gap: 10px;
}

/* Card row */
.bdp-promo-row{
  display:flex;
  align-items:center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  text-decoration:none;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.bdp-promo-row:hover{
  transform: translateY(-1px);
  border-color: rgba(255,255,255,.20);
  box-shadow: 0 10px 26px rgba(0,0,0,.35);
}

/* Image box */
.bdp-promo-row__imgbox{
  width: 62px;
  height: 44px;
  flex: 0 0 62px;
  border-radius: 12px;
  overflow:hidden;
  background: rgba(0,0,0,.25);
  display:flex;
  align-items:center;
  justify-content:center;
}
.bdp-promo-row__imgbox img{
  width:100%;
  object-fit: contain;
  transform: scale(1.02);
  transition: transform .25s ease;
}
.bdp-promo-row:hover .bdp-promo-row__imgbox img{
  transform: scale(1.10);
}

/* Text */
.bdp-promo-row__txt{ flex:1 1 auto; min-width:0; }

.bdp-promo-row__title{
  font-weight: 900;
  font-size: .95rem;
  color: rgba(255,255,255,.95);
  display:flex;
  align-items:center;
  gap:6px;
  white-space: nowrap;
  overflow:hidden;
  text-overflow: ellipsis;
}

/* NEW badge */
.bdp-new-badge{
  font-size: .6rem;
  font-weight: 900;
  color: #fff;
  background: #ef4444;
  padding: 2px 6px;
  border-radius: 999px;
  line-height: 1;
  position: relative;
  top: -4px;                 /* slightly up */
  animation: bdpPulse 1.2s infinite;
}

/* Meta row */
.bdp-promo-row__meta{
  margin-top: 5px;
  display:flex;
  align-items:center;
  gap: 8px;
  flex-wrap:wrap;
}

.bdp-promo-row__off{
  font-size: .72rem;
  font-weight: 900;
  padding: 3px 9px;
  border-radius: 999px;
  background: rgba(34,197,94,.18);
  border: 1px solid rgba(34,197,94,.35);
  color:#22c55e;
}

/* Limited time in green */
.bdp-promo-row__sub{
  font-size: .72rem;
  color: #22c55e;
  font-weight: 700;
}

/* Animations */
@keyframes bdpBlink { 0%,100%{opacity:1} 50%{opacity:.35} }
.bdp-blink{ animation: bdpBlink 1.1s infinite; }

@keyframes bdpPulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.12); }
  100% { transform: scale(1); }
}

@media (prefers-reduced-motion: reduce){
  .bdp-blink, .bdp-new-badge{ animation:none; }
}

/* Small screens */
@media (max-width: 420px){
  .bdp-promo-row__sub{ display:none; }
  .bdp-promo-row__imgbox{
    width: 75px;
    height: 75px;
    flex: 0 0 54px;
  }
}

/* =========================================================
   DRAWER SCROLL FIX (when menu is taller than screen)
   Put at VERY END
   ========================================================= */

/* Make panel a flex column and keep header fixed */
#bdpDrawer .bdp-drawer__panel{
  display: flex !important;
  flex-direction: column !important;
  height: 100vh !important;
}

/* Header should not scroll */
#bdpDrawer .bdp-drawer__head{
  flex: 0 0 auto !important;
}

/* Body should scroll */
#bdpDrawer .bdp-drawer__body{
  flex: 1 1 auto !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  min-height: 0 !important; /* IMPORTANT for flex scroll */
  padding-bottom: 90px !important; /* space for bottom content */
}

/* Optional: thin scrollbar in drawer body */
#bdpDrawer .bdp-drawer__body{
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.18) transparent;
}
#bdpDrawer .bdp-drawer__body::-webkit-scrollbar{ width: 3px; }
#bdpDrawer .bdp-drawer__body::-webkit-scrollbar-thumb{
  background: rgba(255,255,255,.18);
  border-radius: 999px;
}
#bdpDrawer .bdp-drawer__body::-webkit-scrollbar-track{ background: transparent; }

.bdp-copyright{
  margin-top: 12px;
  text-align: center;
  font-size: 12px;
  color: rgba(255,255,255,.72);
  letter-spacing: .2px;
}

/* Cursive + different color combo (purple → pink → cyan) */
.bdp-brand-font{
  font-family: 'Great Vibes', cursive;
  font-size: 18px;
  font-weight: 400;

  background: linear-gradient(90deg, #a78bfa, #fb7185, #22d3ee);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;

  text-shadow: 0 10px 22px rgba(0,0,0,.35);
}

@media (max-width: 576px){
  .bdp-brand-font{ font-size: 17px; }
}