/* ============================================================
   KALP — PDP Rainbow variant overrides
   ------------------------------------------------------------
   Loaded ONLY when ?theme=rainbow is in the URL, AFTER pdp.css.
   When loaded, inc/enqueue.php also adds body class .kalp-pdp-rainbow
   so every override here is scoped — the canonical /product/<slug>/
   URL keeps the original dark theme intact.

   Flips:
   - body bg deep-brown → cream
   - All deep-brown body text → kept; cream text → deep-brown
   - Product hero section gets rainbow-bg.png backdrop
   - Tabs section becomes translucent cream card with gold borders
   - Nutritional table flipped to light theme
   - USP row uses rainbow-bg.png backdrop
   - Related Flavours grid uses city background (3.jpg Ayodhya) with
     dark overlay so the per-flavour cards stay readable
   - Per-flavour --pdp-accent variable kept (pink/orange/gold/green
     tinting still works for the city label, name underline, price,
     CTA button hover, active tab indicator)
   ============================================================ */

/* ----- Scope all rules to .kalp-pdp-rainbow body class ----- */

body.single-product.kalp-pdp-rainbow {
    background: var(--cream) !important;
    color: var(--deep-brown) !important;
}
body.single-product.kalp-pdp-rainbow .ast-container,
body.single-product.kalp-pdp-rainbow .site-content,
body.single-product.kalp-pdp-rainbow main.kalp-pdp {
    background: var(--cream) !important;
}
.kalp-pdp-rainbow main.kalp-pdp { color: var(--deep-brown); }

/* ----- Breadcrumb ----- */
.kalp-pdp-rainbow .pdp-breadcrumb__list a {
    color: var(--gold-dark);
    opacity: 0.9;
}
.kalp-pdp-rainbow .pdp-breadcrumb__list a:hover { opacity: 1; color: var(--deep-brown); }
.kalp-pdp-rainbow .pdp-breadcrumb__list li:last-child { color: var(--deep-brown); opacity: 0.6; }
.kalp-pdp-rainbow .pdp-breadcrumb__list li::after { color: var(--deep-brown); opacity: 0.4; }

/* ----- Hero product section with rainbow gradient backdrop ----- */
.kalp-pdp-rainbow .pdp-product {
    background-image: url('/wp-content/themes/astra-child-kalp/assets/images/backgrounds/rainbow-bg.png');
    background-size: cover;
    background-position: center;
    background-color: var(--cream);
    position: relative;
}
.kalp-pdp-rainbow .pdp-product::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(255, 248, 238, 0.65);
    pointer-events: none;
}
.kalp-pdp-rainbow .pdp-product__inner { position: relative; z-index: 2; }

/* ----- Gallery: cream-tinted card ----- */
.kalp-pdp-rainbow .pdp-gallery__main {
    background: rgba(255, 255, 255, 0.55);
    border-color: rgba(201, 168, 76, 0.35);
}
.kalp-pdp-rainbow .pdp-gallery__main::before {
    opacity: 0.05;
}
.kalp-pdp-rainbow .pdp-gallery__thumb { background: rgba(255, 255, 255, 0.5); }

/* ----- Info panel — flip cream → deep-brown ----- */
.kalp-pdp-rainbow .pdp-info__name { color: var(--deep-brown); }
.kalp-pdp-rainbow .pdp-info__tagline { color: var(--pdp-accent); opacity: 1; font-weight: 500; }
.kalp-pdp-rainbow .pdp-info__desc { color: var(--deep-brown); opacity: 0.82; }
.kalp-pdp-rainbow .pdp-info__price-original { color: var(--deep-brown); opacity: 0.45; }
.kalp-pdp-rainbow .pdp-info__price-current { color: var(--pdp-accent); }

/* ----- Trust signals row ----- */
.kalp-pdp-rainbow .pdp-info__trust { border-color: rgba(201, 168, 76, 0.35); }
.kalp-pdp-rainbow .pdp-info__trust-item { color: var(--deep-brown); opacity: 0.75; }
/* item I: the inner <span> + <svg> were styled for the OLD dark PDP
   (span = var(--cream), icon = faint gold). On the rainbow LIGHT info panel
   they rendered cream-on-cream / invisible. Flip span → deep-brown text and
   icon → gold-dark at full-ish opacity. Scope wins over base pdp.css without
   !important (0,2,1 > 0,1,1). Fixes FSSAI Certified / Net Wt / Shelf Life. */
.kalp-pdp-rainbow .pdp-info__trust-item span { color: var(--deep-brown); opacity: 0.82; }
.kalp-pdp-rainbow .pdp-info__trust-item svg { color: var(--gold-dark); opacity: 0.95; }

/* ----- Tabs section — translucent cream card ----- */
.kalp-pdp-rainbow .pdp-tabs {
    background: rgba(255, 255, 255, 0.45);
    border-top: 1px solid rgba(201, 168, 76, 0.2);
    border-bottom: 1px solid rgba(201, 168, 76, 0.2);
}
.kalp-pdp-rainbow .pdp-tabs__btn {
    color: var(--deep-brown);
    opacity: 0.7;
    background: transparent !important;
    border-color: transparent !important;
}
.kalp-pdp-rainbow .pdp-tabs__btn:hover {
    color: var(--gold-dark);
    background: rgba(201, 168, 76, 0.08) !important;
}
.kalp-pdp-rainbow .pdp-tabs__btn.is-active { color: var(--pdp-accent); opacity: 1; }
.kalp-pdp-rainbow .pdp-tabs__btn[aria-selected="true"] { color: var(--pdp-accent); opacity: 1; }

.kalp-pdp-rainbow .pdp-tabs__heading { color: var(--deep-brown); }
.kalp-pdp-rainbow .pdp-tabs__text { color: var(--deep-brown); opacity: 0.85; }
.kalp-pdp-rainbow .pdp-tabs__list li { color: var(--deep-brown); opacity: 0.85; }

/* ----- Nutritional table flipped to light theme ----- */
.kalp-pdp-rainbow .pdp-nutrition__table {
    background: rgba(255, 255, 255, 0.6);
    border: 1px solid rgba(201, 168, 76, 0.3);
}
.kalp-pdp-rainbow .pdp-nutrition__table thead th {
    background: rgba(201, 168, 76, 0.12);
    color: var(--deep-brown);
    border-bottom: 1px solid rgba(201, 168, 76, 0.3);
}
.kalp-pdp-rainbow .pdp-nutrition__table tbody th,
.kalp-pdp-rainbow .pdp-nutrition__table tbody td {
    color: var(--deep-brown);
    border-bottom: 1px solid rgba(201, 168, 76, 0.15);
}
.kalp-pdp-rainbow .pdp-nutrition__note { color: var(--deep-brown); opacity: 0.65; }
.kalp-pdp-rainbow .pdp-nutrition__note a { color: var(--gold-dark); }

/* ----- Allergen callout — gold tint on cream ----- */
.kalp-pdp-rainbow .pdp-tabs__allergen {
    background: rgba(201, 168, 76, 0.08);
    border-color: rgba(201, 168, 76, 0.35);
}
.kalp-pdp-rainbow .pdp-tabs__allergen-title { color: var(--gold-dark); }
.kalp-pdp-rainbow .pdp-tabs__allergen-text { color: var(--deep-brown); opacity: 0.85; }

/* ----- Certifications row ----- */
.kalp-pdp-rainbow .pdp-tabs__cert {
    color: var(--deep-brown);
    border-color: rgba(201, 168, 76, 0.4);
    background: rgba(255, 255, 255, 0.45);
}
.kalp-pdp-rainbow .pdp-tabs__cert:hover {
    background: rgba(201, 168, 76, 0.1);
}

/* ----- USP section with rainbow-bg backdrop ----- */
.kalp-pdp-rainbow .pdp-usp {
    background-image: url('/wp-content/themes/astra-child-kalp/assets/images/backgrounds/rainbow-bg.png');
    background-size: cover;
    background-position: center;
    position: relative;
}
.kalp-pdp-rainbow .pdp-usp::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(255, 248, 238, 0.6);
    pointer-events: none;
}
.kalp-pdp-rainbow .pdp-usp__container { position: relative; z-index: 2; }
.kalp-pdp-rainbow .pdp-usp__item { color: var(--deep-brown); }
.kalp-pdp-rainbow .pdp-usp__icon { color: var(--gold-dark); }
.kalp-pdp-rainbow .pdp-usp__title { color: var(--deep-brown); }
.kalp-pdp-rainbow .pdp-usp__text { color: var(--deep-brown); opacity: 0.72; }

/* ----- Related Flavours grid — Ayodhya city backdrop + dark overlay ----- */
.kalp-pdp-rainbow .pdp-related {
    background-image: url('/wp-content/themes/astra-child-kalp/assets/images/backgrounds/3.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    position: relative;
}
.kalp-pdp-rainbow .pdp-related::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(26, 10, 3, 0.5); /* lightened 0.62 -> 0.5 to match About's overlay */
    pointer-events: none;
}
.kalp-pdp-rainbow .pdp-related__header,
.kalp-pdp-rainbow .pdp-related__grid { position: relative; z-index: 2; }
.kalp-pdp-rainbow .pdp-related__subtitle { color: var(--gold-light); }
.kalp-pdp-rainbow .pdp-related__title { color: var(--cream); }

/* ----- Frosted-glass flavour cards — matches the About-page .about-craft__card
   glass EXACTLY (cream 4% + blur 4px + gold-15% border; hover cream 7% + blur
   6px + gold-30% border + lift). The product image floats on the glass (no dark
   box), the flavour name + details read below. (User request, About reference.) */
.kalp-pdp-rainbow .pdp-related__card {
    background: rgba(255, 248, 238, 0.04) !important;
    -webkit-backdrop-filter: blur(4px) !important;
    backdrop-filter: blur(4px) !important;
    border: 1px solid rgba(201, 168, 76, 0.15) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    transition: all 0.3s ease !important;
}
.kalp-pdp-rainbow .pdp-related__card:hover {
    background: rgba(255, 248, 238, 0.07) !important;
    -webkit-backdrop-filter: blur(6px) !important;
    backdrop-filter: blur(6px) !important;
    border-color: rgba(201, 168, 76, 0.3) !important;
    transform: translateY(-4px) !important;
    box-shadow: none !important;
}
/* Product image sits directly on the glass — remove the dark gradient box + accent wash */
.kalp-pdp-rainbow .pdp-related__card-image { background: transparent !important; }
.kalp-pdp-rainbow .pdp-related__card-image::before { opacity: 0 !important; }
/* Text readable on the frosted glass over the (lightened) city backdrop */
.kalp-pdp-rainbow .pdp-related__card-name { color: var(--cream) !important; }
.kalp-pdp-rainbow .pdp-related__card-city { color: var(--gold-light) !important; }
.kalp-pdp-rainbow .pdp-related__card-tagline { color: var(--cream) !important; opacity: 0.82 !important; }
.kalp-pdp-rainbow .pdp-related__card-price,
.kalp-pdp-rainbow .pdp-related__card-current { color: var(--gold-light) !important; }
.kalp-pdp-rainbow .pdp-related__card-link { color: var(--gold-light) !important; }
.kalp-pdp-rainbow .pdp-related__card-link:hover { color: var(--cream) !important; }

/* ----- Quantity input + add-to-cart button (WC default markup) ----- */
.kalp-pdp-rainbow .pdp-info input[type="number"],
.kalp-pdp-rainbow .pdp-info .quantity input {
    background: rgba(255, 255, 255, 0.85) !important;
    color: var(--deep-brown) !important;
    border: 1px solid rgba(201, 168, 76, 0.45) !important;
}
/* Add-to-cart is GOLD on all flavours (matches homepage cards + cart/checkout).
   The per-flavour accent still tints the eyebrow, tagline, price + tabs. */
.kalp-pdp-rainbow .pdp-info button.single_add_to_cart_button {
    background: var(--gold) !important;
    color: var(--deep-brown) !important;
    border: 1px solid var(--gold) !important;
}
.kalp-pdp-rainbow .pdp-info button.single_add_to_cart_button:hover {
    background: var(--gold-dark) !important;
    border-color: var(--gold-dark) !important;
    color: var(--cream) !important;
}

/* ── FSSAI Regulatory block — rainbow (cream bg) override ── */
.kalp-pdp-rainbow .pdp-legal { border-top-color: rgba(201, 168, 76, 0.3); }
.kalp-pdp-rainbow .pdp-legal__label { color: var(--gold-dark); }
.kalp-pdp-rainbow .pdp-legal__company { color: var(--deep-brown); }
.kalp-pdp-rainbow .pdp-legal__text { color: var(--deep-brown); opacity: 0.8; }
.kalp-pdp-rainbow .pdp-legal__feedback { color: var(--deep-brown); opacity: 0.85; }
.kalp-pdp-rainbow .pdp-legal__contact { color: var(--deep-brown); opacity: 0.8; }
.kalp-pdp-rainbow .pdp-legal__fssai { color: var(--gold-dark); }
.kalp-pdp-rainbow .pdp-legal__fssai-mark { color: var(--gold-dark); border-color: var(--gold-dark); }
.kalp-pdp-rainbow .pdp-legal__contact a { color: var(--gold-dark); }
.kalp-pdp-rainbow .pdp-legal__contact a:hover { color: var(--chocolate, #5A2010); }

/* ── Buy Now button — gold-OUTLINE secondary beside the solid gold Add to cart.
   form.cart becomes a wrapping flex row so qty + both buttons align and wrap
   cleanly on mobile. ── */
.kalp-pdp-rainbow .pdp-info form.cart {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
}
.kalp-pdp-rainbow .pdp-info .kalp-buy-now-btn {
    background: transparent !important;
    color: var(--gold-dark) !important;
    border: 1px solid var(--gold-dark) !important;
    margin: 0 !important;
}
.kalp-pdp-rainbow .pdp-info .kalp-buy-now-btn:hover {
    background: var(--gold-dark) !important;
    border-color: var(--gold-dark) !important;
    color: var(--cream) !important;
}