@layer vsl-currency-menu;
@layer vsl-currency-menu {
  /* The existing currency picker only; no other menus or form controls. */
  body .feed-nav[data-vsl-social-feed-nav] #currency-dropdown-nav {
    width:320px !important; max-width:calc(100vw - 24px) !important;
    padding:8px !important; border:1px solid #eee8ed !important; border-radius:22px !important;
    background:#fff !important; box-shadow:0 14px 44px #25091d18 !important;
    font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,sans-serif !important;
    visibility:hidden; overflow-y:auto !important; overscroll-behavior:contain;
  }
  body .feed-nav[data-vsl-social-feed-nav] #currency-dropdown-nav.show { visibility:visible; }
  body .feed-nav[data-vsl-social-feed-nav] #currency-dropdown-nav .currency-option {
    display:grid !important; grid-template-columns:32px minmax(0,1fr) auto 16px !important; align-items:center !important;
    gap:12px !important; width:100% !important; min-height:52px !important; box-sizing:border-box !important;
    padding:10px 12px !important; margin:2px 0 !important; border:0 !important; border-radius:14px !important;
    background:transparent !important; color:#352d37 !important; font-weight:400 !important;
    text-align:left !important; touch-action:manipulation;
  }
  body .feed-nav[data-vsl-social-feed-nav] #currency-dropdown-nav .currency-option.selected { background:#f4edf2 !important; color:#470233 !important; }
  body .feed-nav[data-vsl-social-feed-nav] #currency-dropdown-nav .currency-option:hover { background:#f7f3f6 !important; }
  body .feed-nav[data-vsl-social-feed-nav] #currency-dropdown-nav .currency-option:focus-visible { outline:2px solid #470233 !important; outline-offset:-2px !important; }
  body .feed-nav[data-vsl-social-feed-nav] #currency-dropdown-nav .vsl-dock-flag { display:block !important; width:32px !important; height:24px !important; object-fit:cover; border-radius:5px; overflow:hidden; }
  body .feed-nav[data-vsl-social-feed-nav] #currency-dropdown-nav .vsl-dock-currency-name { display:block !important; font-size:13px !important; font-weight:400 !important; line-height:1.4 !important; min-width:0; }
  body .feed-nav[data-vsl-social-feed-nav] #currency-dropdown-nav .co-right { flex:initial !important; justify-content:flex-end !important; }
  body .feed-nav[data-vsl-social-feed-nav] #currency-dropdown-nav .co-code { font-size:11px !important; color:#7a6c78 !important; font-weight:400 !important; letter-spacing:.03em !important; }
  body .feed-nav[data-vsl-social-feed-nav] #currency-dropdown-nav .currency-option::after { content:""; width:16px; height:16px; box-sizing:border-box; border:1px solid #ded3dc; border-radius:50%; }
  body .feed-nav[data-vsl-social-feed-nav] #currency-dropdown-nav .currency-option.selected::after { content:"\2713"; display:grid; place-items:center; background:#470233; color:#fff; border-color:#470233; font-size:10px; }
  body .feed-nav[data-vsl-social-feed-nav] #currency-dropdown-nav .currency-close-btn { width:44px !important; height:44px !important; border-radius:50% !important; background:#f5f1f4 !important; font-size:23px !important; color:#470233 !important; }
  body .feed-nav[data-vsl-social-feed-nav] #currency-dropdown-nav .currency-mobile-title { font-size:16px !important; font-weight:500 !important; padding-left:0 !important; color:#352d37 !important; }
  body .feed-nav[data-vsl-social-feed-nav] #currency-dropdown-nav .currency-mobile-header { margin:0 0 6px !important; padding:2px 4px 8px !important; border-bottom:1px solid #f1ebef !important; }
  @media(max-width:900px) {
    body .feed-nav[data-vsl-social-feed-nav] #currency-dropdown-nav {
      left:12px !important; right:12px !important; top:auto !important; bottom:80px !important;
      width:auto !important; max-width:none !important; max-height:calc(100dvh - 100px) !important;
      padding:10px !important; border-radius:24px !important;
      transition:opacity .15s ease,transform .15s ease !important;
    }
    body .feed-nav[data-vsl-social-feed-nav] #currency-dropdown-nav:not(.show) { transform:translateY(12px) !important; }
  }
  @media(prefers-reduced-motion:reduce) {
    body .feed-nav[data-vsl-social-feed-nav] #currency-dropdown-nav { transition:none !important; }
  }
}
@layer vsl-mobile-icon-dock;
/* Declare first: important brand colors take precedence without changing header layout. */
@layer vsl-brand-palette {
  html body header.topbar { background:#4d0037 !important; }
  .vsl-feed-label-mobile[hidden] { display:none !important; }
  @media (max-width:967px) {
    html body header.topbar { background:#470233 !important; }
  }
  .vsl-dock-flag,.vsl-dock-selected-flag,.vsl-dock-currency-name { display:none; }
  @media (max-width:900px) {
    body .feed-nav[data-vsl-social-feed-nav] > .currency-nav-item .feed-nav-symbol,
    body .feed-nav[data-vsl-social-feed-nav] > .currency-nav-item > .feed-nav-icon { display:none !important; }
    body .feed-nav[data-vsl-social-feed-nav] > .currency-nav-item > .feed-nav-label { display:block !important; font-weight:400 !important; }
    body .feed-nav[data-vsl-social-feed-nav] .vsl-dock-selected-flag { display:flex !important; height:21px; align-items:center; }
    body .feed-nav[data-vsl-social-feed-nav] .vsl-dock-flag { display:block; width:27px; height:20px; border-radius:4px; overflow:hidden; flex-shrink:0; }
    body .feed-nav[data-vsl-social-feed-nav] .currency-dropdown-menu { padding:8px 10px calc(12px + env(safe-area-inset-bottom)) !important; border:0 !important; box-shadow:0 -8px 32px #25091d12 !important; border-radius:26px 26px 0 0 !important; max-height:80dvh !important; overflow-y:auto !important; }
    body .feed-nav[data-vsl-social-feed-nav] .currency-mobile-title { font-size:17px !important; font-weight:500 !important; }
    body .feed-nav[data-vsl-social-feed-nav] .currency-option { min-height:48px !important; margin:4px 0 !important; padding:9px 12px !important; border:0 !important; border-radius:14px !important; background:transparent !important; color:#49434d !important; font-weight:400 !important; }
    body .feed-nav[data-vsl-social-feed-nav] .currency-option.selected { background:#f3edf2 !important; color:#470233 !important; }
    body .feed-nav[data-vsl-social-feed-nav] .currency-option .co-left { display:flex !important; align-items:center !important; gap:12px !important; }
    body .feed-nav[data-vsl-social-feed-nav] .currency-option .co-symbol { display:none !important; }
    body .feed-nav[data-vsl-social-feed-nav] .currency-option .co-code { font-size:12px !important; font-weight:400 !important; }
    body .feed-nav[data-vsl-social-feed-nav] .vsl-dock-currency-name { display:inline; font-size:14px; font-weight:400; }
    body .feed-nav[data-vsl-social-feed-nav] .vsl-dock-currency-status { font-size:12px; font-weight:400; line-height:1.4; color:#470233; padding:4px 12px; }

    body .feed-nav[data-vsl-social-feed-nav] {
      position:fixed !important; left:10px !important; right:8px !important;
      bottom:calc(8px + env(safe-area-inset-bottom,0px)) !important;
      width:auto !important; max-width:none !important; margin:0 !important;
      padding:4px !important; display:grid !important;
      grid-template-columns:repeat(3,minmax(0,1fr)) !important;
      gap:3px !important; align-items:center !important; box-sizing:border-box !important;
      border:0 !important; border-radius:28px !important; background:#f3f1f5 !important;
      box-shadow:none !important; overflow:visible !important;
    }
    body .feed-nav[data-vsl-social-feed-nav] > .feed-nav-item {
      min-width:0 !important; min-height:48px !important; height:48px !important;
      display:flex !important; flex-direction:column !important; align-items:center !important;
      justify-content:center !important; gap:4px !important; padding:6px 8px !important;
      background:transparent !important; color:#77717b !important; border:0 !important;
      border-radius:24px !important; box-shadow:none !important; touch-action:manipulation;
    }
    body .feed-nav[data-vsl-social-feed-nav] > .feed-nav-item.active {
      background:#fff !important; color:#470233 !important;
    }
    body .feed-nav[data-vsl-social-feed-nav] > .feed-nav-item:not(.active):active { background:#e9dce6 !important; }
    body .feed-nav[data-vsl-social-feed-nav] .feed-nav-label {
      font-size:11px !important; line-height:1.1 !important; font-weight:400 !important;
      letter-spacing:0 !important; white-space:nowrap !important;
    }
    body .feed-nav[data-vsl-social-feed-nav] .feed-nav-label > span { font-size:inherit !important; line-height:inherit !important; font-weight:inherit !important; }
    body .feed-nav[data-vsl-social-feed-nav] .feed-nav-icon,
    body .feed-nav[data-vsl-social-feed-nav] .feed-nav-icon svg { width:21px !important; height:21px !important; flex-basis:21px !important; }
    body .feed-nav[data-vsl-social-feed-nav] .vsl-feed-label-desktop { display:none !important; }
    body .feed-nav[data-vsl-social-feed-nav] .vsl-feed-label-mobile[hidden] { display:inline !important; }
    body .feed-nav[data-vsl-social-feed-nav] > .currency-nav-item {
      display:flex !important; flex-direction:column !important; gap:4px !important; align-items:center !important; justify-content:center !important;
      width:auto !important; height:48px !important; padding:0 !important; border:0 !important;
      border-radius:24px !important; background:transparent !important; color:#77717b !important;
      box-shadow:none !important; touch-action:manipulation;
    }
    body .feed-nav[data-vsl-social-feed-nav] .feed-nav-symbol { color:#470233 !important; font-size:20px !important; }
    body .feed-nav[data-vsl-social-feed-nav] > :is(.feed-nav-item,.currency-nav-item):focus-visible { outline:2px solid #fbc848 !important; outline-offset:-2px !important; }
    body:has(.feed-nav[data-vsl-social-feed-nav]) .feed-container.active { padding-bottom:calc(86px + env(safe-area-inset-bottom,0px)) !important; }
    body.selection-mode .feed-nav[data-vsl-social-feed-nav] { display:none !important; }
  }
}

@layer vsl-mobile-icon-dock {
@media(max-width:767px) {
  body .feed-nav[data-vsl-social-feed-nav] > .feed-nav-item .feed-nav-label,
  body .feed-nav[data-vsl-social-feed-nav] > .currency-nav-item > .feed-nav-label { display:none !important; }
  body .feed-nav[data-vsl-social-feed-nav] > .feed-nav-item,
  body .feed-nav[data-vsl-social-feed-nav] > .currency-nav-item { min-height:48px !important; flex-direction:row !important; gap:0 !important; }
  body .feed-nav[data-vsl-social-feed-nav] > .feed-nav-item .feed-nav-icon { width:23px !important; height:23px !important; }
}
}
