/* ============================================================
   RAJAGACOR — Modern Casino Luxury Theme (Gold & Black)
   Visual overlay only. Does not alter layout logic or JS.
   ============================================================ */

@import url("https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700&family=Outfit:wght@400;500;600;700&display=swap");

:root {
  --brand-50: #2a2316;
  --brand-100: #3a301c;
  --brand-500: #d4af37;
  --brand-600: #c9a227;
  --gray-900: #f3ead4;
  --gray-700: #d4c4a0;
  --gray-500: #a89472;
  --gray-300: #5a4e38;
  --gray-100: #1a1610;
  --border: rgba(212, 175, 55, 0.28);
  --gold: #d4af37;
  --gold-bright: #f0d77a;
  --gold-deep: #9a7820;
  --gold-soft: rgba(212, 175, 55, 0.16);
  --ink: #0a0908;
  --ink-2: #12100c;
  --ink-3: #1c1812;
  --cream: #f3ead4;
  --cream-dim: #cbb99a;
  --casino-card: linear-gradient(165deg, #1c1812 0%, #12100c 55%, #0e0c09 100%);
  --casino-gold: linear-gradient(135deg, #8a6a18 0%, #d4af37 38%, #f5e6a3 50%, #d4af37 62%, #8a6a18 100%);
  --casino-shadow: 0 18px 48px -18px rgba(0, 0, 0, 0.75), 0 0 0 1px rgba(212, 175, 55, 0.18);
  font-family: "Outfit", "Segoe UI", system-ui, sans-serif;
}

@media screen {
  html {
    background: var(--ink);
  }

  body {
    color: var(--cream);
    background-color: var(--ink) !important;
    background-image:
      radial-gradient(ellipse 90% 55% at 50% -10%, rgba(212, 175, 55, 0.14), transparent 58%),
      radial-gradient(ellipse 50% 40% at 100% 20%, rgba(154, 120, 32, 0.08), transparent 50%),
      radial-gradient(ellipse 40% 30% at 0% 80%, rgba(212, 175, 55, 0.06), transparent 50%),
      repeating-linear-gradient(
        135deg,
        rgba(212, 175, 55, 0.025) 0 1px,
        transparent 1px 14px
      ),
      linear-gradient(180deg, #0c0b09 0%, #0a0908 100%);
    background-attachment: fixed;
    font-family: "Outfit", "Segoe UI", system-ui, sans-serif;
  }

  a {
    color: var(--gold);
  }

  /* ---------- Topbar ---------- */
  .topbar {
    background: linear-gradient(90deg, #0a0908, #1a150c 50%, #0a0908);
    color: var(--gold-bright);
    border-bottom: 1px solid rgba(212, 175, 55, 0.25);
    letter-spacing: 0.04em;
  }
  .topbar a {
    color: var(--gold);
  }
  .topbar a:hover {
    color: var(--gold-bright);
  }

  /* ---------- Navbar ---------- */
  .navbar,
  .navbar-logo {
    background: linear-gradient(180deg, rgba(18, 16, 12, 0.96) 0%, rgba(10, 9, 8, 0.94) 100%) !important;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border-bottom: 1px solid rgba(212, 175, 55, 0.22);
    box-shadow: 0 8px 28px -12px rgba(0, 0, 0, 0.65);
  }
  .navbar::after {
    height: 2px;
    background: linear-gradient(
      90deg,
      transparent 0%,
      var(--gold-deep) 18%,
      var(--gold-bright) 50%,
      var(--gold-deep) 82%,
      transparent 100%
    );
    opacity: 1;
    box-shadow: 0 0 12px rgba(212, 175, 55, 0.45);
  }

  .search {
    background: #16130e;
    border: 1px solid rgba(212, 175, 55, 0.28);
    border-radius: 12px;
  }
  .search input {
    color: var(--cream) !important;
    background: transparent;
  }
  .search:focus-within {
    border-color: var(--gold);
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.18);
  }
  .search input,
  .nav-inner .search input {
    color: var(--cream);
    background: transparent;
  }
  .search input::placeholder,
  .nav-inner .search input::placeholder {
    color: #8a7a5c;
  }
  .search-icon-btn,
  .nav-inner .search-icon-btn {
    color: var(--gold);
  }

  .icon-btn,
  .login-btn {
    background: linear-gradient(180deg, #2a2316, #1a1610);
    border: 1px solid rgba(212, 175, 55, 0.4);
    color: var(--gold-bright);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(245, 230, 163, 0.12);
  }
  .icon-btn:hover,
  .login-btn:hover {
    background: var(--casino-gold);
    color: #1a1408;
    border-color: var(--gold-bright);
    box-shadow: 0 6px 18px -8px rgba(212, 175, 55, 0.55);
  }
  .badge {
    box-shadow: 0 2px 8px rgba(239, 68, 68, 0.4), 0 0 0 2px #12100c;
  }

  .user-dropdown {
    background: #16130e;
    border: 1px solid rgba(212, 175, 55, 0.28);
    color: var(--cream);
  }

  .mega-cats a {
    color: var(--cream-dim);
    border-radius: 8px;
  }
  .mega-cats a:hover {
    background: rgba(212, 175, 55, 0.12);
    color: var(--gold-bright);
  }
  .mega-cats a.active {
    background: var(--casino-gold);
    color: #1a1408;
  }
  .mega-cats-fade {
    background: linear-gradient(
      to left,
      rgba(10, 9, 8, 1) 0%,
      rgba(10, 9, 8, 0.85) 35%,
      transparent 100%
    ) !important;
  }
  .mm2-trigger {
    background: #1c1812;
    color: var(--gold);
    border: 1px solid rgba(212, 175, 55, 0.25);
  }
  .mega-more-btn {
    background: #1c1812;
    border-color: rgba(212, 175, 55, 0.35);
    color: var(--gold);
  }

  /* ---------- Search suggest ---------- */
  .search-suggest {
    background: #16130e;
    border: 1px solid rgba(212, 175, 55, 0.3);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45);
  }
  .suggest-item {
    border-bottom-color: rgba(212, 175, 55, 0.12);
    color: var(--cream);
  }
  .suggest-item:hover,
  .suggest-item.active,
  .search-suggest div:hover {
    background: rgba(212, 175, 55, 0.1);
  }

  /* ---------- Product detail ---------- */
  .product-single {
    --pd-border: rgba(212, 175, 55, 0.22);
    --pd-bg: #12100c;
    --pd-muted: #b8a88a;
    --pd-dark: #f3ead4;
    --pd-accent: #d4af37;
    --pd-soft: #1c1812;
    --pd-soft-border: rgba(212, 175, 55, 0.2);
    --pd-shadow: 0 16px 40px -16px rgba(0, 0, 0, 0.7);
  }

  .pd-breadcrumb {
    color: var(--cream-dim);
  }
  .pd-breadcrumb a {
    color: var(--gold);
  }
  .pd-breadcrumb .current {
    color: var(--cream);
  }

  .pd-media-card,
  .pd-info-card,
  .pd-side-card {
    background: var(--casino-card);
    border: 1px solid rgba(212, 175, 55, 0.28);
    box-shadow: var(--casino-shadow);
  }
  .pd-main-image {
    background: #0e0c09;
    border-color: rgba(212, 175, 55, 0.22);
  }
  .pd-thumb-btn {
    background: #16130e;
    border-color: rgba(212, 175, 55, 0.22);
  }
  .pd-thumb-btn:hover,
  .pd-thumb-btn.active {
    border-color: var(--gold);
    box-shadow: 0 0 0 2px rgba(212, 175, 55, 0.28);
  }

  .pd-title {
    color: var(--cream) !important;
    font-family: "Cinzel", "Times New Roman", serif;
    letter-spacing: 0.02em;
  }
  .pd-share-btn {
    color: var(--gold);
    background: transparent;
    border-color: rgba(212, 175, 55, 0.35);
  }
  .pd-price-current,
  .pd-sticky-price {
    color: var(--gold-bright) !important;
    text-shadow: 0 0 18px rgba(212, 175, 55, 0.35);
  }
  .pd-discount-badge {
    background: linear-gradient(135deg, #8b1e1e, #c0392b);
  }
  .sold-inline {
    background: rgba(212, 175, 55, 0.12);
    color: var(--cream-dim);
  }
  .stock-badge {
    background: rgba(212, 175, 55, 0.12);
    color: var(--gold);
  }
  .stock-badge.out {
    background: rgba(212, 175, 55, 0.18);
    color: var(--gold-bright);
  }
  .sku {
    color: var(--cream-dim);
  }
  .pd-short-desc,
  .pd-short-desc p,
  .pd-short-desc li {
    color: var(--cream-dim) !important;
  }
  .pd-short-desc a,
  .pd-short-desc strong {
    color: var(--gold-bright);
  }

  .paylater-promo {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.14), rgba(26, 22, 16, 0.9));
    border: 1px solid rgba(212, 175, 55, 0.28);
    color: var(--cream);
  }

  .pd-compare-btn {
    background: #16130e;
    border-color: rgba(212, 175, 55, 0.35);
    color: var(--gold);
  }
  .pd-compare-btn:hover {
    background: rgba(212, 175, 55, 0.12);
    border-color: var(--gold);
    color: var(--gold-bright);
    box-shadow: 0 2px 10px rgba(212, 175, 55, 0.2);
  }
  .compare-note {
    color: var(--cream-dim);
  }

  .btn-add-cart {
    background: var(--casino-gold) !important;
    color: #1a1408 !important;
    border: 0;
    box-shadow: 0 8px 20px -10px rgba(212, 175, 55, 0.65);
    font-weight: 700;
  }
  .btn-buy {
    background: transparent !important;
    color: var(--gold-bright) !important;
    border: 1px solid var(--gold) !important;
  }
  .btn-buy:hover {
    background: rgba(212, 175, 55, 0.12) !important;
  }
  .btn-chat-icon {
    background: #16130e;
    color: var(--gold);
    border: 1px solid rgba(212, 175, 55, 0.4);
  }
  .btn-primary,
  .add-cart {
    background: var(--casino-gold);
    color: #1a1408;
  }
  .btn-primary:hover,
  .add-cart:hover {
    filter: brightness(1.08);
  }
  .btn-outline,
  .btn-outline-primary {
    background: transparent;
    color: var(--gold);
    border: 1px solid rgba(212, 175, 55, 0.45);
  }

  .qty-label {
    color: var(--cream-dim);
  }
  #qty,
  input[type="number"]#qty {
    background: #16130e;
    border: 1px solid rgba(212, 175, 55, 0.28);
    color: var(--cream);
  }

  .pd-side-card h3,
  .inst-head h3 {
    color: var(--gold) !important;
    font-family: "Cinzel", serif;
    letter-spacing: 0.08em;
  }
  .bank-tab {
    background: #16130e !important;
    border-color: rgba(212, 175, 55, 0.28) !important;
    color: var(--cream-dim) !important;
  }
  .bank-tab.active,
  .bank-tab:hover {
    background: var(--casino-gold) !important;
    color: #1a1408 !important;
    border-color: var(--gold) !important;
    box-shadow: 0 4px 14px -6px rgba(212, 175, 55, 0.55);
  }
  .inst-disclaimer {
    color: var(--cream-dim) !important;
  }
  .inst-note {
    color: var(--gold) !important;
    background: rgba(212, 175, 55, 0.12) !important;
    border-color: rgba(212, 175, 55, 0.28) !important;
  }
  .inst-month-item {
    background: #16130e !important;
    border: 1px solid rgba(212, 175, 55, 0.22) !important;
  }
  .inst-month-item:hover {
    box-shadow: 0 8px 18px -8px rgba(212, 175, 55, 0.4) !important;
  }
  .inst-month-item:before {
    background: linear-gradient(90deg, rgba(212, 175, 55, 0.12), transparent) !important;
  }
  .tenor-badge {
    background: var(--casino-gold) !important;
    color: #1a1408 !important;
    box-shadow: 0 3px 10px -4px rgba(212, 175, 55, 0.55) !important;
  }
  .amount {
    color: var(--gold-bright) !important;
  }
  .inst-alt-banner--compact {
    background: var(--casino-gold) !important;
    color: #1a1408 !important;
  }

  .qoala-banner {
    background: var(--casino-gold) !important;
    color: #1a1408 !important;
  }
  .qoala-title,
  .qoala-subtitle {
    color: #1a1408;
  }
  .qoala-cta {
    background: rgba(10, 9, 8, 0.28) !important;
    color: #1a1408 !important;
    border-color: rgba(26, 20, 8, 0.35) !important;
  }

  /* ---------- Sticky header / related ---------- */
  .pd-sticky-header {
    background: rgba(12, 11, 9, 0.96);
    border-bottom: 1px solid rgba(212, 175, 55, 0.25);
  }
  .pd-sticky-title {
    color: var(--cream);
  }
  .pd-sticky-btn-cart {
    background: transparent !important;
    color: var(--gold) !important;
    border-color: var(--gold) !important;
  }
  .pd-sticky-btn-buy {
    background: var(--casino-gold) !important;
    color: #1a1408 !important;
    border-color: var(--gold) !important;
    box-shadow: 0 2px 10px rgba(212, 175, 55, 0.35);
  }
  .pd-sticky-btn-chat {
    background: #16130e !important;
    color: var(--gold) !important;
    border-color: rgba(212, 175, 55, 0.4) !important;
  }
  .pd-sticky-share-btn {
    background: #16130e;
    border-color: rgba(212, 175, 55, 0.3);
    color: var(--gold);
  }

  .pd-related-full {
    background: var(--casino-card);
    border: 1px solid rgba(212, 175, 55, 0.22);
    border-radius: 16px;
    box-shadow: var(--casino-shadow);
  }
  .pd-related-title {
    color: var(--gold) !important;
    font-family: "Cinzel", serif;
    letter-spacing: 0.06em;
  }
  .pd-related-card {
    background: #16130e;
    border: 1px solid rgba(212, 175, 55, 0.2);
    color: var(--cream);
  }
  .pd-related-card:hover {
    border-color: var(--gold);
    box-shadow: 0 12px 28px -12px rgba(212, 175, 55, 0.35);
  }
  .pd-related-card .thumb {
    background: #0e0c09;
  }
  .pd-related-card h3 {
    color: var(--cream) !important;
  }
  .pd-related-card .price,
  .pd-related-card .price .final {
    color: var(--gold-bright) !important;
  }
  .pd-related-card .sold {
    background: rgba(212, 175, 55, 0.12);
    color: var(--cream-dim);
  }
  .spec-chips {
    color: var(--cream-dim);
  }

  .prod-card {
    background: #16130e;
    border-color: rgba(212, 175, 55, 0.22);
    color: var(--cream);
  }
  .prod-card .img-box {
    background: #0e0c09;
  }
  .flash,
  .products {
    background: transparent;
  }

  /* ---------- Article / FAQ (overrides later inline styles) ---------- */
  .article-pro {
    background: var(--casino-card) !important;
    border: 1px solid rgba(212, 175, 55, 0.38) !important;
    box-shadow: var(--casino-shadow), 0 0 40px rgba(212, 175, 55, 0.08) !important;
    color: var(--cream) !important;
  }
  .article-pro h2,
  .article-pro h1 {
    color: var(--gold-bright) !important;
    font-family: "Cinzel", serif;
    text-align: center;
    letter-spacing: 0.03em;
  }
  .article-pro p {
    color: var(--cream-dim) !important;
  }
  .article-pro p:hover {
    color: var(--cream) !important;
    text-shadow: 0 0 10px rgba(212, 175, 55, 0.25);
  }
  .article-pro a {
    color: var(--gold) !important;
  }

  .sgt-box {
    background: var(--casino-card) !important;
    border: 1px solid rgba(212, 175, 55, 0.35) !important;
    box-shadow: var(--casino-shadow) !important;
    animation: none !important;
  }
  .sgt-title {
    color: var(--gold-bright) !important;
    font-family: "Cinzel", serif;
    letter-spacing: 0.06em;
  }
  .sgt-faq,
  .sgt-review {
    background: #16130e !important;
    border: 1px solid rgba(212, 175, 55, 0.22) !important;
    color: var(--cream-dim) !important;
  }
  .sgt-faq:hover,
  .sgt-review:hover {
    border-color: var(--gold) !important;
    box-shadow: 0 8px 24px -10px rgba(212, 175, 55, 0.35) !important;
  }
  .sgt-question {
    color: var(--cream) !important;
    position: relative;
    z-index: 2;
  }
  .sgt-answer {
    color: var(--cream-dim) !important;
    position: relative;
    z-index: 2;
  }
  .sgt-icon {
    color: var(--gold) !important;
  }
  .sgt-name {
    color: var(--gold-bright) !important;
  }
  .sgt-footer {
    color: var(--cream-dim) !important;
    border-top-color: rgba(212, 175, 55, 0.22) !important;
  }

  /* ---------- Footer ---------- */
  .site-footer.footer-compact {
    --ft-bg-0: #070605;
    --ft-bg-1: #0e0c09;
    --ft-bg-2: #16130e;
    --ft-orange: #d4af37;
    --ft-orange-dark: #9a7820;
    --ft-text: #f3ead4;
    --ft-text-sec: #cbb99a;
    --ft-text-muted: #a89472;
    --ft-glow: rgba(212, 175, 55, 0.16);
    color: var(--cream);
  }
  .site-footer.footer-compact.variant-stripes {
    background:
      repeating-linear-gradient(180deg, rgba(212, 175, 55, 0.03) 0 38px, transparent 38px 76px),
      linear-gradient(130deg, #12100c 0%, #0c0b09 60%, #070605 100%) !important;
  }
  .site-footer.footer-compact .ft-title {
    color: var(--gold) !important;
    font-family: "Cinzel", serif;
    letter-spacing: 0.12em;
  }
  .site-footer.footer-compact .ft-desc,
  .site-footer.footer-compact .ft-links a,
  .site-footer.footer-compact .ft-address,
  .site-footer.footer-compact .ft-copy {
    color: var(--cream-dim) !important;
  }
  .site-footer.footer-compact .ft-links a:hover {
    color: var(--gold-bright) !important;
    background: rgba(212, 175, 55, 0.08);
  }
  .site-footer.footer-compact .ft-wa-btn {
    background: var(--casino-gold);
    color: #1a1408;
  }
  .site-footer.footer-compact .ft-social a {
    background: rgba(212, 175, 55, 0.1);
    color: var(--gold);
  }
  .site-footer.footer-compact .ft-social a:hover {
    background: var(--casino-gold);
    color: #1a1408;
  }
  .site-footer.footer-compact .ft-bottom,
  .site-footer.footer-compact.variant-stripes .ft-bottom {
    background: #070605 !important;
  }
  .site-footer.footer-compact.variant-stripes .ft-bottom::before {
    background: linear-gradient(90deg, transparent, rgba(212, 175, 55, 0.75), transparent);
  }
  .site-footer.footer-compact .ico-s {
    background: #1c1812;
    color: var(--gold);
  }
  .ft-expand-btn {
    color: var(--gold);
    background: transparent;
    border-color: rgba(212, 175, 55, 0.3);
  }

  /* ---------- Bottom nav / FAB ---------- */
  .bottom-nav {
    background: rgba(12, 11, 9, 0.96) !important;
    border-top: 1px solid rgba(212, 175, 55, 0.28) !important;
    box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.45);
  }
  .bottom-nav-item {
    color: #a89472;
  }
  .bottom-nav-item:hover {
    color: var(--gold);
  }
  .bottom-nav-item.active {
    background: var(--casino-gold);
    color: #1a1408;
    box-shadow: 0 2px 12px rgba(212, 175, 55, 0.35);
  }
  .bottom-nav-avatar-initials {
    background: var(--casino-gold);
    color: #1a1408;
  }
  .bottom-nav-item.active .bottom-nav-avatar-initials {
    background: #1a1408;
    color: var(--gold);
  }

  .pd-mobile-fab {
    background: rgba(12, 11, 9, 0.94);
    border-top: 1px solid rgba(212, 175, 55, 0.28);
  }
  .mf-buy {
    background: var(--casino-gold) !important;
    color: #1a1408 !important;
    box-shadow: 0 4px 16px rgba(212, 175, 55, 0.3);
  }
  .mf-cart,
  .mf-chat,
  .mf-share {
    background: #16130e !important;
    color: var(--gold) !important;
    border-color: var(--gold) !important;
  }

  .pd-scroll-top {
    background: var(--casino-gold);
    color: #1a1408;
    border: 0;
    box-shadow: 0 8px 20px rgba(212, 175, 55, 0.35);
  }

  /* ---------- Modals / sheets / compare ---------- */
  .modal-dialog,
  .pd-share-modal,
  .compare-sidebar,
  .mobile-user-sheet-content {
    background: #16130e !important;
    color: var(--cream);
    border: 1px solid rgba(212, 175, 55, 0.28);
  }
  .modal-title,
  .pd-share-title,
  .compare-title,
  .mobile-user-name {
    color: var(--cream) !important;
  }
  .modal-message,
  .mobile-user-email,
  .mobile-user-sheet-item {
    color: var(--cream-dim) !important;
  }
  .modal-header,
  .pd-share-header,
  .compare-header,
  .mobile-user-sheet-header {
    border-bottom-color: rgba(212, 175, 55, 0.2) !important;
  }
  .modal-btn-primary,
  .modal-btn.modal-btn-primary {
    background: var(--casino-gold) !important;
    border-color: var(--gold) !important;
    color: #1a1408 !important;
  }
  .modal-btn-secondary {
    background: #16130e !important;
    border: 1px solid rgba(212, 175, 55, 0.35) !important;
    color: var(--gold) !important;
  }

  .stock-popover {
    background: #16130e;
    border: 1px solid rgba(212, 175, 55, 0.28);
    color: var(--cream);
  }

  /* ---------- Reviews / tabs ---------- */
  .product-tabs {
    border-bottom-color: rgba(212, 175, 55, 0.22);
  }
  .tab-btn {
    color: var(--cream-dim);
  }
  .tab-btn:hover {
    color: var(--gold-bright);
  }
  .tab-btn.active {
    color: var(--gold);
    border-bottom-color: var(--gold);
  }

  /* ---------- Misc cards / USP ---------- */
  .usp-item,
  .usp-section {
    color: var(--cream);
  }
  .usp-text h3 {
    color: var(--gold);
  }
  .usp-text p {
    color: var(--cream-dim);
  }

  .holiday-notice {
    background: linear-gradient(135deg, #1a1408 0%, #8a6a18 100%);
    border-bottom: 1px solid var(--gold);
  }

  .pa-title {
    color: var(--cream);
  }
  .pa-filter-badge,
  .pa-search {
    background: #16130e;
    border-color: rgba(212, 175, 55, 0.25);
    color: var(--cream-dim);
  }
  .pa-search input[type="text"] {
    background: transparent;
    color: var(--cream);
  }
  .pa-search button {
    background: var(--casino-gold);
    color: #1a1408;
  }

  /* Center logo image under product */
  main.product-single > img[alt="RAJAGACOR"] {
    border: 1px solid var(--gold) !important;
    box-shadow: 0 0 28px rgba(212, 175, 55, 0.28), 0 12px 32px rgba(0, 0, 0, 0.5) !important;
    background: #0e0c09;
    padding: 12px;
  }

  /* Selection */
  ::selection {
    background: rgba(212, 175, 55, 0.35);
    color: #fff8dc;
  }

  /* Scrollbar */
  * {
    scrollbar-width: thin;
    scrollbar-color: #d4af37 #12100c;
  }
  *::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }
  *::-webkit-scrollbar-track {
    background: #12100c;
  }
  *::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #d4af37, #9a7820);
    border-radius: 8px;
  }
}

@media screen and (max-width: 640px) {
  .navbar,
  .navbar-logo {
    background: linear-gradient(180deg, rgba(18, 16, 12, 0.98), rgba(10, 9, 8, 0.96)) !important;
  }
  .nav-inner .search {
    background: #16130e;
    border: 1.5px solid rgba(212, 175, 55, 0.32);
    box-shadow: none;
  }
  .nav-inner .search:focus-within {
    border-color: var(--gold);
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.16);
  }
  .navbar #userMenu .login-btn.logged-in {
    background: #1c1812;
    border-color: rgba(212, 175, 55, 0.35);
  }
  .navbar #userMenu .user-dropdown {
    background: #16130e;
    border-color: rgba(212, 175, 55, 0.3);
  }
}