:root {
      --bg-offwhite: #FAF6EF;
      --brand-cream: #F3EDE2;
      --brand-cream-border: #E8DEC8;
      --brand-cream-dark: #D9CBB7;
      --surface-white: #FFFFFF;
      --btn-primary: #ea580c;
      --btn-primary-hover: #c2410c;
      --btn-primary-active: #9a3412;
      --text-charcoal: #26140E;
      --text-muted: #6D5545;
    }
    body {
      background-color: #FAF6EF;
      color: #26140E;
      font-family: 'Plus Jakarta Sans', sans-serif;
      -webkit-tap-highlight-color: transparent;
    }
    .no-scrollbar::-webkit-scrollbar {
      display: none;
    }
    .no-scrollbar {
      -ms-overflow-style: none;
      scrollbar-width: none;
    }
    .clay-surface {
      box-shadow: 0 10px 25px -4px rgba(45, 36, 30, 0.07), 0 4px 10px -2px rgba(45, 36, 30, 0.03), inset 0 1px 1px 0 rgba(255, 255, 255, 0.95), inset 0 -2px 4px 0 rgba(45, 36, 30, 0.03);
    }
    .clay-pill-active {
      background: #ea580c;
      color: #FFFFFF;
      border: 1px solid #c2410c;
      box-shadow: 0 6px 16px -2px rgba(234, 88, 12, 0.42), inset 0 1.5px 1.5px 0 rgba(255, 255, 255, 0.75), inset 0 -2px 4px 0 rgba(84, 41, 32, 0.28);
    }
    .clay-pill-inactive {
      background: #FFFFFF;
      color: #2D241E;
      border: 1px solid rgba(229, 220, 206, 0.85);
      box-shadow: 0 4px 12px -2px rgba(45, 36, 30, 0.05), inset 0 1.5px 1.5px 0 rgba(255, 255, 255, 0.95);
    }
    .clay-pill-inactive:hover {
      background: #FDFBF7;
      border-color: #D5C8B4;
      transform: translateY(-1px);
    }
    .clay-toggle-container {
      background: #FFFFFF;
      border: 1px solid rgba(229, 220, 206, 0.85);
      box-shadow: 0 4px 12px -2px rgba(45, 36, 30, 0.05), inset 0 1.5px 1.5px 0 rgba(255, 255, 255, 0.95);
    }
    .glow-gold {
      box-shadow: 0 4px 18px 0 rgba(234, 88, 12, 0.35);
    }
    .wishlist-btn.is-wishlisted svg {
      color: #10B981 !important;
      fill: #10B981 !important;
    }