/* ==========================================================================
   CHELPRI Luxury Garments - Master Custom Stylesheet
   Designed for Haute Couture & B2B Wholesale Garments Showcase
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&family=Playfair+Display:ital,wght@0,500;0,600;0,700;0,800;1,400;1,600&display=swap');

:root {
  --color-primary-dark: #0A1B14;
  --color-primary-forest: #102B20;
  --color-primary-subtle: #1C3C30;
  --color-gold-deep: #B58A38;
  --color-gold: #CBA24B;
  --color-gold-light: #E5C77F;
  --color-gold-pale: #FBF4E2;
  --color-cream-bg: #FDFBF7;
  --color-cream-card: #F7F3EA;
  --color-charcoal: #1C1E21;
  --color-muted: #6B7280;
  --font-serif: 'Playfair Display', Georgia, serif;
  --font-royal: 'Cormorant Garamond', Garamond, serif;
  --font-sans: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
}

/* Global Reset & Typography */
html {
  scroll-behavior: smooth;
  font-family: var(--font-sans);
  background-color: var(--color-cream-bg);
  color: var(--color-charcoal);
}

.font-serif-luxury {
  font-family: var(--font-serif);
}

.font-royal {
  font-family: var(--font-royal);
}

.font-sans-clean {
  font-family: var(--font-sans);
}

/* Luxury Gold Gradients & Borders */
.gold-gradient-text {
  background: linear-gradient(135deg, #D4AF37 0%, #F5DE88 50%, #AA822A 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.gold-gradient-bg {
  background: linear-gradient(135deg, #B58A38 0%, #D4AF37 50%, #C4983F 100%);
}

.gold-gradient-hover:hover {
  background: linear-gradient(135deg, #C4983F 0%, #E5C77F 50%, #B58A38 100%);
}

.gold-border-glow {
  border: 1px solid rgba(203, 162, 75, 0.45);
  box-shadow: 0 0 15px rgba(203, 162, 75, 0.12);
}

.gold-border-glow:hover {
  border-color: rgba(203, 162, 75, 0.85);
  box-shadow: 0 4px 25px rgba(203, 162, 75, 0.22);
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: #F4EFE6;
}
::-webkit-scrollbar-thumb {
  background: #CBA24B;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #9D7324;
}

/* Shimmer Animation for Badges and CTA */
@keyframes goldShimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

.shimmer-badge {
  background: linear-gradient(90deg, rgba(203, 162, 75, 0.15) 0%, rgba(203, 162, 75, 0.45) 50%, rgba(203, 162, 75, 0.15) 100%);
  background-size: 200% 100%;
  animation: goldShimmer 3s infinite;
}

/* Image Card Hover Zoom */
.product-card-img-wrap {
  overflow: hidden;
  position: relative;
}

.product-card-img-wrap img {
  transition: transform 0.65s cubic-bezier(0.25, 1, 0.5, 1);
}

.product-card-img-wrap:hover img {
  transform: scale(1.08);
}

/* Floating Action Pulse */
@keyframes pulseGlow {
  0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.5); }
  70% { box-shadow: 0 0 0 15px rgba(37, 211, 102, 0); }
  100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }
}

.whatsapp-pulse {
  animation: pulseGlow 2s infinite;
}

/* Modal and Drawer Transitions */
.modal-backdrop-blur {
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  background-color: rgba(10, 27, 20, 0.78);
}

/* Subtle Indian Architectural Motif Background */
.pattern-jaali {
  background-color: #FAF7F2;
  background-image: radial-gradient(#CBA24B 0.75px, transparent 0.75px), radial-gradient(#CBA24B 0.75px, #FAF7F2 0.75px);
  background-size: 30px 30px;
  background-position: 0 0, 15px 15px;
  opacity: 0.98;
}

.pattern-jaali-dark {
  background-color: #0A1B14;
  background-image: radial-gradient(rgba(203, 162, 75, 0.25) 0.65px, transparent 0.65px), radial-gradient(rgba(203, 162, 75, 0.25) 0.65px, #0A1B14 0.65px);
  background-size: 28px 28px;
  background-position: 0 0, 14px 14px;
}

/* Sticky Navbar Blur */
.header-glass {
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  background-color: rgba(253, 251, 247, 0.92);
}

.header-glass-dark {
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  background-color: rgba(10, 27, 20, 0.92);
}

/* Subtle line separator with royal diamond */
.royal-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin: 1.5rem 0;
}
.royal-divider::before,
.royal-divider::after {
  content: "";
  height: 1px;
  width: 60px;
  background: linear-gradient(90deg, transparent, #CBA24B, transparent);
}

/* Print Friendly Styles for Wholesale Inquiries */
@media print {
  .no-print {
    display: none !important;
  }
}
