/* ─── Variables ─────────────────────── */
:root {
  --bs-primary:        #2B2E33;
  --bs-primary-rgb:    43, 46, 51;
  --bs-secondary:      #7B7F85;
  --bs-light:          #F5F6F7;
  --bs-border-color:   #C1C4C8;
  --bs-body-color:     #2B2E33;
  --bs-body-bg:        #FFFFFF;

  --clr-lightest: #F5F6F7;
  --clr-light:    #C1C4C8;
  --clr-mid:      #7B7F85;
  --clr-dark:     #2B2E33;
  --font-heading: 'Playfair Display', Georgia, serif;
  --font-body:    'Poppins', sans-serif;
  --r:      8px;
  --r-lg:   16px;
  --sh:     0 4px 20px rgba(43,46,51,.10);
  --sh-lg:  0 12px 40px rgba(43,46,51,.14);
  --tr:     all .3s ease;
}

/* ─── Base ───────────────────────────── */
body { font-family: var(--font-body); color: var(--clr-dark); }
h1,h2,h3,h4,h5,h6 { font-family: var(--font-heading); }

/* ─── Announcement Bar ───────────────── */
/* @keyframes marquee + marquee-inner */
.announce-marquee { display: flex; animation: marquee 20s linear infinite; white-space: nowrap; padding: 8px; font-size: 0.85rem; }
@keyframes marquee { 0% { transform: translateX(100%); } 100% { transform: translateX(-100%); } }

/* ─── Navbar ─────────────────────────── */
/* scroll shadow, logo height, mega menu */
.mega-menu { min-width: 600px; }

/* ─── Mobile Bottom Nav ──────────────── */
/* body padding-bottom on mobile to avoid overlap */

/* ─── Hero Slider ────────────────────── */
/* slide transitions, text clamp(), overlay, arrows, dots */

/* ─── Product Card ───────────────────── */
/* hover lift, quick-add overlay slide-up, image zoom */
.product-card:hover { box-shadow: var(--sh-lg); transform: translateY(-3px); }
.product-card:hover img { transform: scale(1.05); }
.product-card:hover .quick-add-overlay { transform: translateY(0); }

/* ─── Category Cards ─────────────────── */
/* image overlay, hover image scale */

/* ─── Section Titles ─────────────────── */
/* decorative underline bar in #7B7F85 */

/* ─── Offer Banner ───────────────────── */
/* full-width image + overlay + centered text */

/* ─── Trust Bar ──────────────────────── */
/* dark bg, icon + text layout */

/* ─── Tabs (Colors of India) ─────────── */
/* active tab style override */

/* ─── Testimonials ───────────────────── */
/* slider transitions, quote mark */

/* ─── Countdown Timer ────────────────── */
/* number blocks, flip animation */
@keyframes flip { 0%{transform:rotateX(0)} 50%{transform:rotateX(-90deg)} 100%{transform:rotateX(0)} }

/* ─── Cart Drawer ────────────────────── */
/* free shipping progress bar */

/* ─── Search Overlay ─────────────────── */
/* fade-in, live results dropdown */

/* ─── Product Detail ─────────────────── */
/* image magnifier, gallery dots, sticky ATC bar mobile */
/* pincode result: green tick / red cross */

/* ─── Checkout ───────────────────────── */
/* progress bar steps, sticky order summary */
/* validation: invalid border, error message */

/* ─── Order Success ──────────────────── */
/* checkmark animation, confetti */
@keyframes confetti-fall { /* particles fall from top */ }

/* ─── WooCommerce Overrides ──────────── */
/* notices, buttons, forms, tabs, pagination */
.woocommerce-Button, .wc-block-components-button { 
  background: #2B2E33 !important; 
  color: #fff !important; 
}

/* WooCommerce Grids (Shortcodes) */
.woocommerce ul.products {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
  padding: 0;
  list-style: none;
  margin: 2rem 0;
}
@media (min-width: 768px) {
  .woocommerce ul.products { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 992px) {
  .woocommerce ul.products { grid-template-columns: repeat(4, 1fr); }
}

.woocommerce ul.products li.product {
  margin: 0;
  position: relative;
}

.woocommerce ul.products li.product a {
  text-decoration: none;
  color: inherit;
  display: block;
}

.woocommerce ul.products li.product img {
  width: 100%;
  height: auto;
  aspect-ratio: 3/4;
  object-fit: cover;
  border-radius: 8px;
  margin-bottom: 1rem;
  border: 1px solid var(--clr-lightest);
}

.woocommerce-loop-category__title, .woocommerce-loop-product__title {
  font-family: var(--font-heading);
  font-size: 1.1rem;
  margin-bottom: 0.5rem;
  color: var(--clr-dark);
}

.woocommerce .products .price {
  font-weight: 600;
  color: var(--clr-dark);
  display: block;
  margin-bottom: 1rem;
}

.woocommerce .button.add_to_cart_button {
  background: var(--clr-dark);
  color: #fff;
  padding: 8px 16px;
  border-radius: 4px;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 1px;
}

/* Category counts in lists */
mark.count {
  background: none;
  color: var(--bs-secondary);
  font-size: 0.9rem;
  font-weight: 400;
  margin-left: 5px;
}
mark.count::before { content: "("; }
mark.count::after { content: ")"; }

/* Form and Page Overrides */
.page-content p {
  margin-bottom: 1.5rem;
}
.page-content blockquote {
  border-left: 4px solid var(--clr-mid);
  padding: 1rem 2rem;
  font-style: italic;
  font-size: 1.25rem;
  margin: 2rem 0;
  background: var(--clr-lightest);
}
.woocommerce-result-count, .woocommerce-ordering {
  display: inline-block;
  margin-bottom: 2rem;
  font-size: 0.9rem;
  color: var(--bs-secondary);
}
.woocommerce-ordering select {
  padding: 8px 16px;
  border: 1px solid var(--clr-light);
  border-radius: 4px;
  outline: none;
}
.woocommerce-info, .woocommerce-error {
  background: var(--clr-lightest);
  border-radius: 8px;
  padding: 1.5rem;
  margin-bottom: 2rem;
  border-left: 5px solid var(--clr-dark);
}

/* ─── WhatsApp Pulse ─────────────────── */
@keyframes pulse-wa { 0%,100%{box-shadow:0 4px 18px rgba(37,211,102,.4)} 50%{box-shadow:0 4px 28px rgba(37,211,102,.6)} }
.whatsapp-float { animation: pulse-wa 2.5s ease infinite; }

/* ─── Back To Top ────────────────────── */
/* show/hide transition */

/* ─── Cookie Banner ──────────────────── */
/* bottom fixed, dark bg */

/* ─── Scroll Animations ──────────────── */
.reveal {
  opacity: 0;
  transform: translateY(40px);
  transition: all 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.reveal.active {
  opacity: 1;
  transform: translateY(0);
}
.reveal-left {
  opacity: 0;
  transform: translateX(-40px);
  transition: all 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.reveal-left.active {
  opacity: 1;
  transform: translateX(0);
}
.reveal-right {
  opacity: 0;
  transform: translateX(40px);
  transition: all 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.reveal-right.active {
  opacity: 1;
  transform: translateX(0);
}
.reveal-scale {
  opacity: 0;
  transform: scale(0.9);
  transition: all 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.reveal-scale.active {
  opacity: 1;
  transform: scale(1);
}

/* ─── Carousel Adjustments ─────────── */
.carousel-indicators [data-bs-target] {
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  margin: 0 6px !important;
  border: 1px solid #2B2E33 !important;
  background-color: transparent !important;
  opacity: 0.4;
  transition: transform 0.3s ease, background-color 0.3s ease, opacity 0.3s ease !important;
}
.carousel-indicators .active {
  opacity: 1;
  background-color: #fb168b !important;
  transform: scale(1.5);
}
.carousel-control-prev, .carousel-control-next {
  width: 5%;
}
.carousel-control-prev-icon,
.carousel-control-next-icon {
  width: 1.2rem;
  height: 1.2rem;
}
.carousel-caption h1 {
  font-size: 1.8rem;
}
.carousel-caption p {
  font-size: 0.9rem !important;
}
/* Override the 44px min-height for small buttons */
.btn-compact {
  min-height: 32px !important;
  padding: 4px 12px !important;
  font-size: 0.75rem !important;
}
/* Staggered delay for child elements */
.delay-100 { transition-delay: 100ms; }
.delay-200 { transition-delay: 200ms; }
.delay-300 { transition-delay: 300ms; }
.delay-400 { transition-delay: 400ms; }
