/* ==========================================================================
   DISA CHARMS — Argon Design System & Luxury Anti-Tarnish Showcase Styles
   ========================================================================== */
:root {
  --argon-primary: #4A1525;       /* Deep Velvet Burgundy */
  --argon-primary-dark: #2E0B16;
  --argon-gold: #C5A059;          /* Champagne Metallic Gold */
  --argon-gold-light: #E6C88A;
  --argon-ivory: #FAF7F2;         /* Warm Ivory Background */
  --argon-surface: #FFFFFF;
  --argon-charcoal: #1E1B18;
  --argon-whatsapp: #25D366;
  --argon-shadow: 0 15px 35px rgba(50, 50, 93, 0.08), 0 5px 15px rgba(0, 0, 0, 0.05);
  --argon-shadow-hover: 0 20px 40px rgba(74, 21, 37, 0.14), 0 8px 20px rgba(0, 0, 0, 0.08);
  --argon-radius: 0.85rem;
}

body {
  background-color: var(--argon-ivory);
  color: var(--argon-charcoal);
  font-family: 'Plus Jakarta Sans', 'Inter', -apple-system, sans-serif;
  overflow-x: hidden;
}

h1, h2, h3, h4, .font-serif-luxury {
  font-family: 'Cormorant Garamond', Georgia, serif;
}

/* Argon Glass Navbar */
.argon-navbar {
  background: rgba(250, 247, 242, 0.92);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(197, 160, 89, 0.25);
  transition: all 0.25s ease;
}

/* Argon Elevated Cards */
.argon-card {
  background: var(--argon-surface);
  border-radius: var(--argon-radius);
  border: 1px solid rgba(197, 160, 89, 0.18);
  box-shadow: var(--argon-shadow);
  transition: transform 0.28s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.28s ease;
}

.argon-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--argon-shadow-hover);
}

/* Argon Buttons */
.btn-argon-gold {
  background: linear-gradient(135deg, #C5A059 0%, #9E7B36 100%);
  color: #FFFFFF;
  border: none;
  box-shadow: 0 4px 6px rgba(50, 50, 93, 0.11), 0 1px 3px rgba(0, 0, 0, 0.08);
  transition: all 0.2s ease;
}

.btn-argon-gold:hover {
  transform: translateY(-2px);
  box-shadow: 0 7px 14px rgba(197, 160, 89, 0.35), 0 3px 6px rgba(0, 0, 0, 0.08);
  color: #FFFFFF;
}

.btn-argon-burgundy {
  background: linear-gradient(135deg, #4A1525 0%, #2E0B16 100%);
  color: #FFFFFF;
  box-shadow: 0 4px 6px rgba(74, 21, 37, 0.2);
  transition: all 0.2s ease;
}

.btn-argon-burgundy:hover {
  transform: translateY(-2px);
  box-shadow: 0 7px 14px rgba(74, 21, 37, 0.35);
  color: #E6C88A;
}

.btn-argon-whatsapp {
  background: linear-gradient(135deg, #25D366 0%, #1DA851 100%);
  color: #FFFFFF;
  font-weight: 600;
  box-shadow: 0 4px 12px rgba(37, 211, 102, 0.28);
  transition: all 0.2s ease;
}

.btn-argon-whatsapp:hover {
  transform: translateY(-2px);
  box-shadow: 0 7px 18px rgba(37, 211, 102, 0.42);
  color: #FFFFFF;
}

/* Category Pills */
.category-pill {
  white-space: nowrap;
  border: 1px solid rgba(197, 160, 89, 0.35);
  background: #FFFFFF;
  color: var(--argon-charcoal);
  padding: 0.5rem 1.1rem;
  border-radius: 9999px;
  font-size: 0.85rem;
  font-weight: 500;
  transition: all 0.2s ease;
  cursor: pointer;
}

.category-pill.active, .category-pill:hover {
  background: var(--argon-primary);
  color: #FFFFFF;
  border-color: var(--argon-primary);
  box-shadow: 0 4px 10px rgba(74, 21, 37, 0.22);
}

/* Floating WhatsApp Widget */
.floating-wa-btn {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 999;
  background: linear-gradient(135deg, #25D366 0%, #128C7E 100%);
  color: white;
  border-radius: 9999px;
  padding: 12px 20px;
  display: flex;
  align-items: center;
  gap: 10px;
  box-shadow: 0 10px 25px rgba(37, 211, 102, 0.4);
  transition: all 0.25s ease;
  text-decoration: none;
}

.floating-wa-btn:hover {
  transform: translateY(-3px) scale(1.03);
}

/* Scrollbar styling for horizontal category filter */
.no-scrollbar::-webkit-scrollbar {
  display: none;
}
.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}