/**
 * Customer portal — enterprise quick-commerce design system (Zepto / Blinkit tier).
 * Typography uses Admin App Look tokens only (--kf-app-font-*, --kf-app-fs-*).
 * Load after page CSS, before portal_chrome_css.
 */

:root,
body.bh-page,
body.mh-page {
    /* ── 8px spacing scale ── */
    --kf-space-0: 0;
    --kf-space-1: 4px;
    --kf-space-2: 8px;
    --kf-space-3: 12px;
    --kf-space-4: 16px;
    --kf-space-5: 20px;
    --kf-space-6: 24px;
    --kf-space-8: 32px;

    --kf-app-gutter: var(--kf-space-2);
    --kf-section-gap: var(--kf-space-2);
    --kf-stack-gap: var(--kf-space-3);
    --kf-inset-pad: var(--kf-space-4);

    /* ── Unified radii ── */
    --kf-radius-xs: 6px;
    --kf-radius-sm: 8px;
    --kf-radius-md: 12px;
    --kf-radius-lg: 16px;
    --kf-radius-xl: 20px;
    --kf-radius-2xl: 24px;
    --kf-radius-pill: 999px;

    --bh-radius-lg: var(--kf-radius-lg);
    --bh-radius-md: var(--kf-radius-md);
    --mh-radius-lg: var(--kf-radius-xl);
    --mh-radius-md: var(--kf-radius-lg);

    /* ── Elevation (micro-border + soft shadow) ── */
    --kf-elev-hairline: 0 0 0 1px rgba(15, 23, 42, 0.06);
    --kf-elev-surface: 0 1px 2px rgba(15, 23, 42, 0.04), var(--kf-elev-hairline);
    --kf-elev-card: 0 2px 10px rgba(15, 23, 42, 0.06), var(--kf-elev-hairline);
    --kf-elev-raised: 0 8px 28px rgba(15, 23, 42, 0.08), var(--kf-elev-hairline);

    --bh-shadow: var(--kf-elev-card);
    --bh-shadow-hover: var(--kf-elev-raised);
    --mh-shadow-sm: var(--kf-elev-surface);
    --mh-shadow-md: var(--kf-elev-card);
    --mh-shadow-lg: var(--kf-elev-raised);

    /* ── Typography roles (admin token math) ── */
    --kf-type-h1-size: clamp(
        calc(var(--kf-app-fs-heading, 1.0625rem) * 1.1),
        4.25vw,
        calc(var(--kf-app-fs-heading, 1.0625rem) * 1.32)
    );
    --kf-type-h1-weight: 800;
    --kf-type-h1-lh: 1.22;
    --kf-type-h1-tracking: -0.04em;

    --kf-type-h2-size: calc(var(--kf-app-fs-heading, 1.0625rem) * 1.02);
    --kf-type-h2-weight: 700;
    --kf-type-h2-lh: 1.32;
    --kf-type-h2-tracking: -0.03em;

    --kf-type-body-size: var(--kf-app-fs-body, 0.875rem);
    --kf-type-body-weight: 500;
    --kf-type-body-lh: 1.45;

    --kf-type-caption-size: var(--kf-app-fs-small, 0.75rem);
    --kf-type-caption-weight: 500;
    --kf-type-caption-lh: 1.35;

    --kf-type-label-weight: 600;
    --kf-type-label-size: var(--kf-app-fs-small, 0.75rem);

    /* Thumb-friendly minimum tap target */
    --kf-tap-min: 44px;

    /* ── Nature palette (universal portal — soft green + warm orange) ── */
    --kf-nature-green: #166534;
    --kf-nature-green-mid: #15803d;
    --kf-nature-green-pale: #dcfce7;
    --kf-nature-orange: #b45309;
    --kf-nature-orange-deep: #9a3412;
    --kf-nature-orange-pale: #ffedd5;
    --kf-nature-cream: #faf9f6;
    --kf-nature-surface: #f8fcfa;
    --kf-nature-page: #f7faf8;
    --kf-nature-page-bg: #f7faf8;
    --kf-nature-hero-bg: #f8fcfa;
    --kf-nature-hero-border: rgba(22, 101, 52, 0.1);
    --kf-nature-strip-bg: #fff9f3;
    --kf-nature-strip-border: rgba(217, 119, 6, 0.2);
    --kf-nature-strip-text: #92400e;
    --kf-nature-strip-shadow: 0 1px 6px rgba(146, 64, 14, 0.06);
    --kf-nature-title-grad: #166534;
    --kf-nature-accent-grad: #15803d;
    --kf-nature-blob-opacity: 0.32;
}

/* ── Page shell rhythm ── */
body.bh-page {
    font-family: var(--kf-app-font-family, system-ui, sans-serif);
    font-size: var(--kf-type-body-size);
    line-height: var(--kf-type-body-lh);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body.bh-page main#cph-main.cph-main,
body.mh-page main#cph-main.cph-main {
    gap: var(--kf-section-gap);
    padding-block: var(--kf-section-gap);
}

body.bh-page:not(.bh-page--embed) main#cph-main.cph-main > section,
body.bh-page:not(.bh-page--embed) main#cph-main.cph-main > header,
body.bh-page:not(.bh-page--embed) main#cph-main.cph-main > div:not([hidden]) {
    min-width: 0;
}

/* ── H1: hub / page titles (GFY shimmer title keeps size from premium layer) ── */
body.mh-page .mh-basket-hub__title:not(.mh-basket-hub__title--gfy),
body.mh-page .co-title,
body.mh-page .co-title--orders,
body.bh-page .ca-title,
body.mh-page .cw-page-head__title,
main[data-kf-nav='orders'] .co-title--orders {
    margin: 0;
    font-family: var(--kf-app-font-family, inherit);
    font-size: var(--kf-type-h1-size);
    font-weight: var(--kf-type-h1-weight);
    line-height: var(--kf-type-h1-lh);
    letter-spacing: var(--kf-type-h1-tracking);
    color: var(--bh-ink, var(--mh-ink, #0f172a));
    overflow-wrap: anywhere;
    word-break: break-word;
    text-wrap: balance;
}

body.mh-page .mh-basket-hub__title--gfy {
    margin: 0;
    font-family: var(--kf-portal-hero-title-font);
    font-size: var(--kf-portal-hero-title-size);
    font-weight: var(--kf-portal-hero-title-weight);
    line-height: var(--kf-portal-hero-title-lh);
    letter-spacing: var(--kf-portal-hero-title-tracking);
    overflow-wrap: anywhere;
    word-break: break-word;
    text-wrap: balance;
}

/* ── H2: section headings ── */
body.mh-page .cab-about__section-title,
body.mh-page .coh-activity__title,
body.mh-page .mh-carousel__eyebrow,
body.mh-page .cw-page-head__title {
    font-family: var(--kf-app-font-family, inherit);
    font-size: var(--kf-type-h2-size);
    font-weight: var(--kf-type-h2-weight);
    line-height: var(--kf-type-h2-lh);
    letter-spacing: var(--kf-type-h2-tracking);
    color: var(--bh-ink, var(--mh-ink, #0f172a));
}

/* ── Body / lead / subtitles ── */
body.mh-page .sub-hub__subtitle,
body.mh-page .coh-orders-hub__sub,
body.mh-page .shop-hub-delivery__text,
body.mh-page .cab-about__section-lead,
body.mh-page .mh-card-lead,
body.mh-page .ca-sub,
body.mh-page .cw-page-head__sub,
body.bh-page .bh-hint,
body.bh-page .bh-card-lead {
    font-family: var(--kf-app-font-family, inherit);
    font-size: var(--kf-type-body-size);
    font-weight: var(--kf-type-body-weight);
    line-height: var(--kf-type-body-lh);
    color: var(--bh-muted, var(--mh-muted, #64748b));
}

body.mh-page .mh-basket-hub__placed-line {
    font-family: var(--kf-app-font-family, inherit);
    font-size: var(--kf-type-body-size);
    font-weight: var(--kf-type-label-weight);
    line-height: var(--kf-type-body-lh);
}

/* ── Caption / labels / meta ── */
body.mh-page .mh-basket-hub__eyebrow,
body.bh-page .ca-label,
body.bh-page .bh-bar__note,
body.mh-page .kf-feed-end,
body.mh-page .kf-activity-io-hint {
    font-family: var(--kf-app-font-family, inherit);
    font-size: var(--kf-type-caption-size);
    font-weight: var(--kf-type-label-weight);
    line-height: var(--kf-type-caption-lh);
}

/* ── Hub surfaces (shared across Shop / Orders / Veggies / etc.) ── */
body.mh-page main#cph-main > .mh-basket-hub {
    border-radius: var(--kf-radius-xl);
    border: 1px solid rgba(15, 23, 42, 0.07);
    background: #ffffff;
    box-shadow: var(--kf-elev-raised);
    overflow: hidden;
}

body.mh-page .mh-basket-hub__zone--toolbar {
    padding: var(--kf-space-4) var(--kf-space-4) var(--kf-space-3);
}

body.mh-page .mh-basket-hub__zone--delivery,
body.mh-page .mh-basket-hub__zone--placed-line,
body.mh-page .mh-basket-hub__zone--pending {
    padding: var(--kf-space-4);
}

body.mh-page .mh-basket-hub__zone--basket {
    padding: var(--kf-space-3) var(--kf-space-3) var(--kf-space-4);
}

body.mh-page .mh-basket-hub__divider--soft {
    margin-inline: var(--kf-space-4);
}

/* ── Standalone sections (home greet, carousel, nudge) ── */
body.mh-page main#cph-main > .mh-greet,
body.mh-page main#cph-main > .mh-carousel,
body.mh-page main#cph-main > .mh-basket-nudge-strip,
body.mh-page main#cph-main > .mh-week,
body.mh-page main#cph-main > .mh-trust-strip {
    border-radius: var(--kf-radius-xl);
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: var(--kf-elev-card);
    overflow: hidden;
}

body.mh-page main#cph-main > .mh-greet {
    background: var(--mh-elevated, #fff);
    border-color: rgba(15, 23, 42, 0.06);
}

/* ── Product / basket cards ── */
body.bh-page .bh-card,
body.bh-page .ca-card,
body.mh-page .coh-card,
body.mh-page .wlt-tx {
    border-radius: var(--kf-radius-md);
    border: 1px solid rgba(15, 23, 42, 0.07);
    box-shadow: var(--kf-elev-surface);
    background: #fff;
}

body.bh-page .bh-card__name,
body.bh-page .bh-card__meta {
    font-family: var(--kf-app-font-family, inherit);
    font-size: var(--kf-type-body-size);
    line-height: var(--kf-type-body-lh);
}

/* ── Chips & pills ── */
body.bh-page .bh-chip,
body.bh-page .bh-trust-pill,
body.mh-page .bh-trust-pill,
body.mh-page .coh-card__pill {
    border-radius: var(--kf-radius-pill);
}

body.bh-page .bh-order-strip {
    border-radius: var(--kf-radius-md);
    padding: var(--kf-space-2) var(--kf-space-3);
}

/* ── Secondary / compact controls (primary CTAs → portal block at end of file) ── */
body.mh-page .mh-week__btn,
body.bh-page .ca-btn--inline,
body.mh-page .kf-feed-more {
    min-height: var(--kf-tap-min);
    padding: var(--kf-space-2) var(--kf-space-4);
    border-radius: var(--kf-portal-cta-radius, 0);
    font-family: var(--kf-app-font-family, inherit);
    font-size: var(--kf-type-body-size);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.02em;
    box-shadow: var(--kf-elev-surface);
}

body.bh-page .bh-bar__inner,
body.bh-page .shop-pay-bar {
    border-radius: var(--kf-radius-lg) var(--kf-radius-lg) 0 0;
    border: 1px solid rgba(15, 23, 42, 0.07);
    box-shadow: var(--kf-elev-raised);
}

/* ── Inputs ── */
body.bh-page .ca-input,
body.bh-page .bh-qty__btn,
body.bh-page .bh-qty__val {
    border-radius: var(--kf-radius-sm);
    font-family: var(--kf-app-font-family, inherit);
    font-size: var(--kf-type-body-size);
    min-height: var(--kf-tap-min);
}

body.bh-page .bh-qty {
    border-radius: var(--kf-radius-sm);
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, 0.08);
}

/* ── Header chrome ── */
body.bh-page .kph-hero {
    --kph-hero-pad-x: var(--kf-space-4);
    border-radius: 0;
    padding: calc(var(--kf-space-4) + var(--safe-t, 0px)) 0 var(--kf-space-4);
}

body.bh-page .kph-hero__top {
    padding-inline: var(--kph-hero-pad-x);
}

body.bh-page .kph-hero:has(.kph-quicktabs) {
    padding-bottom: 0;
    border-bottom: none;
}

body.bh-page .kph-wallet,
body.bh-page .kph-icon-btn,
body.mh-page .kph-wallet,
body.mh-page .kph-icon-btn {
    border-radius: 0;
    min-height: 36px;
}

body.bh-page .kph-pwa-install,
body.mh-page .kph-pwa-install {
    border-radius: 0;
    min-height: 36px;
}

body.bh-page .kph-wallet-tip {
    border-radius: 0;
    padding: var(--kf-space-3) var(--kf-space-4);
}

/* ── Modals ── */
body.bh-page .cw-modal__panel,
body.mh-page .cw-modal__panel {
    border-radius: var(--kf-radius-xl);
    box-shadow: var(--kf-elev-raised);
    border: 1px solid rgba(15, 23, 42, 0.08);
}

body.bh-page .cw-modal__btn {
    min-height: var(--kf-tap-min);
    border-radius: var(--kf-radius-md);
    font-family: var(--kf-app-font-family, inherit);
    font-size: var(--kf-type-body-size);
    font-weight: 700;
}

/* ── Flashes & toasts ── */
body.bh-page .bh-flash,
body.bh-page .ca-flash,
body.bh-page .cw-flash,
body.bh-page .bh-toast {
    border-radius: var(--kf-radius-md);
    padding: var(--kf-space-3) var(--kf-space-4);
    font-family: var(--kf-app-font-family, inherit);
    font-size: var(--kf-type-body-size);
    line-height: var(--kf-type-body-lh);
}

/* ── Bottom tab bar ── */
body.bh-page.with-login-bottom-nav .ca-lnav {
    border-radius: 0;
    box-shadow: var(--kf-elev-raised);
}

body.bh-page .ca-lnav__icon,
body.mh-page .ca-lnav__icon {
    border-radius: 0;
}

body.bh-page .ca-lnav__link--active .ca-lnav__icon,
body.bh-page .ca-lnav__link[aria-current='page'] .ca-lnav__icon,
body.mh-page .ca-lnav__link--active .ca-lnav__icon,
body.mh-page .ca-lnav__link[aria-current='page'] .ca-lnav__icon {
    border-radius: 0;
}

/* ── Orders / tables ── */
body.bh-page .co-scroll {
    border-radius: var(--kf-radius-md);
    border: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow: var(--kf-elev-surface);
    overflow: hidden;
}

body.mh-page .coh-card {
    border-radius: var(--kf-radius-md);
}

/* ── Carousel (home) ── */
body.mh-page .mh-carousel {
    border-radius: var(--kf-radius-xl);
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: var(--kf-elev-card);
}

body.mh-page .mh-carousel__dot {
    border-radius: var(--kf-radius-pill);
}

/* ── About surfaces inside hub ── */
body.mh-page .cab-surface {
    border-radius: var(--kf-radius-lg);
    border: 1px solid rgba(15, 23, 42, 0.06);
    box-shadow: var(--kf-elev-surface);
}

/* ── Prevent overlap / overflow on narrow screens ── */
body.bh-page .kph-hero__actions,
body.bh-page .mh-basket-hub__toolbar,
body.bh-page .bh-bar__inner {
    min-width: 0;
}

body.bh-page .bh-grid,
body.bh-page .mh-home-basket-module {
    min-width: 0;
}

@media (max-width: 380px) {
    body.bh-page .kph-hero {
        --kph-hero-pad-x: var(--kf-space-3);
    }

    body.mh-page .mh-basket-hub__zone--toolbar,
    body.mh-page .mh-basket-hub__zone--basket {
        padding-inline: var(--kf-space-3);
    }
}

@media (min-width: 768px) {
    body.bh-page .bh-shell,
    body.bh-page .cph-shell {
        padding-inline: var(--kf-space-3);
    }
}

/* Hub / panel — no decorative rainbow top bar or pill handle */
body.mh-page .mh-basket-hub__chrome,
body.mh-page .mh-basket-hub__grab,
.sub-start-panel__chrome,
.sub-pay-panel__chrome {
    display: none !important;
}

/* Page heroes — center-aligned eyebrow, chips, title, subtitle */
body.shop-page-unified .shop-page-hero,
body.shop-page-unified.shop-page-qc .shop-page-hero--qc,
body.orders-page-unified.orders-page-lively .orders-page-hero,
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero,
body.my-home-lively .mh-home-page-hero,
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero,
body.profile-page-lively .cprof-page-hero,
body.profile-contact-page:not(.profile-page-lively) .sub-start-panel__title,
body.cab-about-page-unified .cab-about-hero {
    text-align: center;
}

body.shop-page-unified .shop-page-hero__top,
body.shop-page-unified.shop-page-qc .shop-page-hero__top,
body.orders-page-unified.orders-page-lively .orders-page-hero__top,
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero__top,
body.my-home-lively .mh-home-page-hero__top,
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero__top,
body.profile-page-lively .cprof-page-hero__top,
body.shop-page-unified .shop-page-hero__title,
body.shop-page-unified .shop-page-hero__sub,
body.shop-page-unified.shop-page-qc .shop-page-hero__title,
body.shop-page-unified.shop-page-qc .shop-page-hero__sub,
body.orders-page-unified.orders-page-lively .orders-page-hero__title,
body.orders-page-unified.orders-page-lively .orders-page-hero__sub,
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero__title,
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero__sub,
body.my-home-lively .mh-home-page-hero__title,
body.my-home-lively .mh-home-page-hero__sub,
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero__title,
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero__sub,
body.profile-page-lively .cprof-page-hero__title,
body.profile-page-lively .cprof-page-hero__sub,
body.profile-contact-page:not(.profile-page-lively) .sub-start-panel__title-line,
body.profile-contact-page:not(.profile-page-lively) .sub-start-panel__title-accent,
body.profile-contact-page:not(.profile-page-lively) .sub-start-panel__lede,
body.cab-about-page-unified .cab-about-hero .cab-about__headline,
body.cab-about-page-unified .cab-about-hero .cab-about__headline-line,
body.cab-about-page-unified .cab-about-hero .cab-about__headline-accent {
    text-align: center;
}

body.shop-page-unified .shop-page-hero__sub,
body.shop-page-unified.shop-page-qc .shop-page-hero__sub,
body.orders-page-unified.orders-page-lively .orders-page-hero__sub,
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero__sub,
body.my-home-lively .mh-home-page-hero__sub,
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero__sub,
body.profile-page-lively .cprof-page-hero__sub,
body.profile-contact-page:not(.profile-page-lively) .sub-start-panel__lede {
    margin-left: auto;
    margin-right: auto;
}

/* ── Portal page heroes: one strip + one title (custom-veggies-basket pattern) ── */
:root,
body.bh-page,
body.mh-page {
    --kf-portal-hero-pad-y: 12px;
    --kf-portal-hero-pad-x: 16px;
    --kf-portal-hero-strip-gap: 0;
    --kf-portal-hero-min-h: 0;
    --kf-portal-hero-title-font: var(--kf-app-font-family, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
    --kf-portal-hero-title-size: clamp(0.9375rem, 3.25vw, 1.0625rem);
    --kf-portal-hero-title-weight: 700;
    --kf-portal-hero-title-lh: 1.3;
    --kf-portal-hero-title-tracking: -0.02em;
}

body.shop-page-unified .shop-page-hero,
body.shop-page-unified.shop-page-qc .shop-page-hero--qc,
body.orders-page-unified.orders-page-lively .orders-page-hero,
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero:not(.vbasket-page-hero--cat-banner),
body.custom-pick-basket-page.veggies-basket-lively .vbasket-page-hero:not(.vbasket-page-hero--cat-banner),
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero,
body.profile-page-lively .cprof-page-hero:not(.cprof-page-hero--strip),
body.cpf-page-lively .cpf-page-hero,
body.cab-about-page-unified .cab-about-hero,
body.my-home-lively.mh-home-v2-page .mh-v2-hero,
body.my-home-lively .mh-home-page-hero {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-height: var(--kf-portal-hero-min-h);
    padding: var(--kf-portal-hero-pad-y) var(--kf-portal-hero-pad-x) var(--kf-portal-hero-pad-y) !important;
    text-align: center;
    background: var(--kf-nature-hero-bg) !important;
    border-bottom-color: var(--kf-nature-hero-border) !important;
}

/* Category banner strip: half-height image, edge-to-edge (no portal hero padding) */
body.custom-pick-basket-page.veggies-basket-lively .vbasket-page__hero:has(.vbasket-page-hero--cat-banner),
body.custom-pick-basket-page.veggies-basket-lively .vbasket-page-hero.vbasket-page-hero--cat-banner,
body.custom-generic-basket-page.custom-pick-basket-page.veggies-basket-lively .vbasket-page__hero:has(.vbasket-page-hero--cat-banner),
body.custom-generic-basket-page.custom-pick-basket-page.veggies-basket-lively .vbasket-page-hero.vbasket-page-hero--cat-banner {
    display: block !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    margin: 0 !important;
    padding: 0 !important;
    min-height: 0 !important;
    text-align: left !important;
    border: none !important;
    border-radius: 0 !important;
    background: #0f172a !important;
    box-shadow: none !important;
    overflow: hidden !important;
}

body.shop-page-unified .shop-page-hero__top,
body.shop-page-unified.shop-page-qc .shop-page-hero__top,
body.orders-page-unified.orders-page-lively .orders-page-hero__top,
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero__top,
body.custom-pick-basket-page.veggies-basket-lively .vbasket-page-hero__top,
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero__top,
body.profile-page-lively .cprof-page-hero__top,
body.cpf-page-lively .cpf-page-hero__top,
body.cab-about-page-unified .cab-about-hero__top,
body.my-home-lively.mh-home-v2-page .vbasket-page-hero__top,
body.my-home-lively .mh-home-page-hero__top {
    display: none !important;
    margin: 0 !important;
}

body.shop-page-unified .shop-page-hero__chip,
body.shop-page-unified.shop-page-qc .shop-page-hero__chip,
body.shop-page-unified.shop-page-qc .shop-delivery-chip,
body.orders-page-unified.orders-page-lively .orders-page-hero__chip,
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero__chip,
body.custom-pick-basket-page.veggies-basket-lively .vbasket-page-hero__chip,
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero__chip,
body.profile-page-lively .cprof-page-hero__chip,
body.cpf-page-lively .cpf-page-hero__chip,
body.cab-about-page-unified .cab-about-hero__chip,
body.my-home-lively.mh-home-v2-page .vbasket-page-hero__chip,
body.my-home-lively .mh-home-page-hero__chip {
    display: none !important;
}

body.shop-page-unified .shop-page-hero__chip-icon,
body.orders-page-unified.orders-page-lively .orders-page-hero__chip-icon,
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero__chip-icon,
body.custom-pick-basket-page.veggies-basket-lively .vbasket-page-hero__chip-icon,
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero__chip-icon,
body.profile-page-lively .cprof-page-hero__chip-icon,
body.cpf-page-lively .cpf-page-hero__chip-icon,
body.cab-about-page-unified .cab-about-hero__chip-icon,
body.my-home-lively.mh-home-v2-page .vbasket-page-hero__chip-icon {
    font-size: 1rem;
    line-height: 1;
    flex-shrink: 0;
}

body.shop-page-unified .shop-page-hero__title,
body.shop-page-unified.shop-page-qc .shop-page-hero__title,
body.orders-page-unified.orders-page-lively .orders-page-hero__title,
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero__title,
body.custom-pick-basket-page.veggies-basket-lively .vbasket-page-hero__title,
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero__title,
body.profile-page-lively .cprof-page-hero:not(.cprof-page-hero--strip) .cprof-page-hero__title,
body.cpf-page-lively .cpf-page-hero__title,
body.cab-about-page-unified .cab-about-hero .cab-about__headline,
body.my-home-lively.mh-home-v2-page .mh-v2-hero__title,
body.my-home-lively .mh-home-page-hero__title,
body.mh-page .mh-basket-hub__title--gfy {
    position: relative;
    z-index: 1;
    margin: 0 !important;
    font-family: var(--kf-portal-hero-title-font) !important;
    font-size: var(--kf-portal-hero-title-size) !important;
    font-weight: var(--kf-portal-hero-title-weight) !important;
    letter-spacing: var(--kf-portal-hero-title-tracking) !important;
    line-height: var(--kf-portal-hero-title-lh) !important;
    text-align: center;
}

body.shop-page-unified .shop-page-hero__sub,
body.shop-page-unified.shop-page-qc .shop-page-hero__sub,
body.orders-page-unified.orders-page-lively .orders-page-hero__sub,
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero__sub,
body.custom-pick-basket-page.veggies-basket-lively .vbasket-page-hero__sub,
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero__sub,
body.profile-page-lively .cprof-page-hero__sub,
body.cpf-page-lively .cpf-page-hero__sub,
body.my-home-lively.mh-home-v2-page .mh-v2-hero__lead,
body.my-home-lively.mh-home-v2-page .mh-v2-hero__chips {
    display: none !important;
}

body.shop-page-unified .shop-page-hero__top .shop-page-hero__eyebrow:has(~ .shop-page-hero__chip),
body.orders-page-unified.orders-page-lively .orders-page-hero__top .orders-page-hero__eyebrow:has(~ .orders-page-hero__chip),
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero__top .vbasket-page-hero__eyebrow:has(~ .vbasket-page-hero__chip),
body.custom-pick-basket-page.veggies-basket-lively .vbasket-page-hero__top .vbasket-page-hero__eyebrow:has(~ .vbasket-page-hero__chip),
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero__top .sub-contact-page-hero__eyebrow:has(~ .sub-contact-page-hero__chip),
body.profile-page-lively .cprof-page-hero__top .cprof-page-hero__eyebrow:has(~ .cprof-page-hero__chip),
body.cpf-page-lively .cpf-page-hero__top .cpf-page-hero__eyebrow:has(~ .cpf-page-hero__chip) {
    display: none !important;
}

body.my-home-lively.mh-home-v2-page .mh-v2-hero__inner {
    max-width: none;
    width: 100%;
}

body.cab-about-page-unified .cab-about-hero .cab-about__headline-accent {
    display: inline;
    margin-top: 0;
}

body.shop-page-unified .shop-page-hero__title-accent,
body.orders-page-unified.orders-page-lively .orders-page-hero__title-accent,
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero__title-accent,
body.custom-pick-basket-page.veggies-basket-lively .vbasket-page-hero__title-accent,
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero__title-accent,
body.profile-page-lively .cprof-page-hero__title-accent,
body.cpf-page-lively .cpf-page-hero__title-accent,
body.my-home-lively.mh-home-v2-page .mh-v2-hero__title-accent,
body.cab-about-page-unified .cab-about-hero .cab-about__headline-accent {
    display: inline;
    color: var(--kf-nature-accent-grad);
}

body.shop-page-unified .shop-page-hero__title,
body.orders-page-unified.orders-page-lively .orders-page-hero__title,
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero__title,
body.custom-pick-basket-page.veggies-basket-lively .vbasket-page-hero__title,
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero__title,
body.profile-page-lively .cprof-page-hero:not(.cprof-page-hero--strip) .cprof-page-hero__title,
body.cpf-page-lively .cpf-page-hero__title,
body.cab-about-page-unified .cab-about-hero .cab-about__headline {
    color: var(--kf-nature-title-grad);
}

@supports not ((-webkit-background-clip: text) or (background-clip: text)) {
    body.shop-page-unified .shop-page-hero__title,
    body.orders-page-unified.orders-page-lively .orders-page-hero__title,
    body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero__title,
    body.custom-pick-basket-page.veggies-basket-lively .vbasket-page-hero__title,
    body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero__title,
    body.profile-page-lively .cprof-page-hero__title,
    body.cpf-page-lively .cpf-page-hero__title,
    body.cab-about-page-unified .cab-about-hero .cab-about__headline {
        color: var(--kf-nature-green);
        background: none;
        -webkit-text-fill-color: unset;
    }

    body.shop-page-unified .shop-page-hero__title-accent,
    body.orders-page-unified.orders-page-lively .orders-page-hero__title-accent,
    body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero__title-accent,
    body.custom-pick-basket-page.veggies-basket-lively .vbasket-page-hero__title-accent,
    body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero__title-accent,
    body.profile-page-lively .cprof-page-hero__title-accent,
    body.cpf-page-lively .cpf-page-hero__title-accent,
    body.cab-about-page-unified .cab-about-hero .cab-about__headline-accent,
    body.my-home-lively.mh-home-v2-page .mh-v2-hero__title-accent {
        color: var(--kf-nature-orange);
        background: none;
        -webkit-text-fill-color: unset;
    }
}

/* ═══ Nature theme — universal portal surfaces (reduced gradients) ═══ */
body.veggies-basket-contact-page.veggies-basket-lively,
body.custom-pick-basket-page.veggies-basket-lively,
body.shop-page-unified,
body.orders-page-unified.orders-page-lively,
body.my-home-lively.mh-home-v2-page,
body.my-home-lively.mh-page,
body.subscription-contact-page.subscription-contact-lively,
body.profile-page-lively,
body.cpf-page-lively,
body.cab-about-page-unified {
    --kf-page-bg: var(--kf-nature-page);
    --kf-earth-green: var(--kf-nature-surface);
    --bh-page: var(--kf-nature-page);
    background: var(--kf-nature-page-bg) !important;
}

body.shop-page-unified .shop-page-hero,
body.shop-page-unified.shop-page-qc .shop-page-hero--qc,
body.orders-page-unified.orders-page-lively .orders-page-hero,
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero:not(.vbasket-page-hero--cat-banner),
body.custom-pick-basket-page.veggies-basket-lively .vbasket-page-hero:not(.vbasket-page-hero--cat-banner),
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero,
body.profile-page-lively .cprof-page-hero:not(.cprof-page-hero--strip),
body.cpf-page-lively .cpf-page-hero,
body.cab-about-page-unified .cab-about-hero,
body.my-home-lively.mh-home-v2-page .mh-v2-hero,
body.my-home-lively .mh-home-page-hero {
    background: var(--kf-nature-hero-bg) !important;
    border-bottom-color: var(--kf-nature-hero-border) !important;
    box-shadow: none !important;
    padding: var(--kf-portal-hero-pad-y) var(--kf-portal-hero-pad-x) var(--kf-portal-hero-pad-y) !important;
    min-height: 0 !important;
}

/* Profile title strip — amber bar (not nature green hero) */
body.profile-page-lively .cprof-page-hero.cprof-page-hero--strip {
    background: #fef3c7 !important;
    border-bottom-color: transparent !important;
    box-shadow: none !important;
    padding: 0.4rem 0.75rem !important;
    min-height: 0 !important;
}

body.profile-page-lively .cprof-page-hero--strip .cprof-page-hero__title {
    color: #92400e !important;
    background: none !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
    -webkit-text-fill-color: #92400e !important;
    font-size: 0.95rem !important;
}

body.shop-page-unified .shop-page-hero__chip,
body.shop-page-unified.shop-page-qc .shop-page-hero__chip,
body.shop-page-unified.shop-page-qc .shop-delivery-chip,
body.orders-page-unified.orders-page-lively .orders-page-hero__chip,
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero__chip,
body.custom-pick-basket-page.veggies-basket-lively .vbasket-page-hero__chip,
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero__chip,
body.profile-page-lively .cprof-page-hero__chip,
body.cpf-page-lively .cpf-page-hero__chip,
body.cab-about-page-unified .cab-about-hero__chip,
body.my-home-lively .mh-home-page-hero__chip {
    display: none !important;
}

body.shop-page-unified .shop-page-hero__title,
body.shop-page-unified.shop-page-qc .shop-page-hero__title,
body.orders-page-unified.orders-page-lively .orders-page-hero__title,
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero__title,
body.custom-pick-basket-page.veggies-basket-lively .vbasket-page-hero__title,
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero__title,
body.profile-page-lively .cprof-page-hero:not(.cprof-page-hero--strip) .cprof-page-hero__title,
body.cpf-page-lively .cpf-page-hero__title,
body.cab-about-page-unified .cab-about-hero .cab-about__headline,
body.my-home-lively.mh-home-v2-page .mh-v2-hero__title {
    color: var(--kf-nature-title-grad) !important;
}

body.shop-page-unified .shop-page-hero__title-accent,
body.orders-page-unified.orders-page-lively .orders-page-hero__title-accent,
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero__title-accent,
body.custom-pick-basket-page.veggies-basket-lively .vbasket-page-hero__title-accent,
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero__title-accent,
body.profile-page-lively .cprof-page-hero__title-accent,
body.cpf-page-lively .cpf-page-hero__title-accent,
body.cab-about-page-unified .cab-about-hero .cab-about__headline-accent,
body.my-home-lively.mh-home-v2-page .mh-v2-hero__title-accent {
    color: var(--kf-nature-accent-grad) !important;
}

body.shop-page-unified .shop-page-hero__blob,
body.orders-page-unified.orders-page-lively .orders-page-hero__blob,
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero__blob,
body.custom-pick-basket-page.veggies-basket-lively .vbasket-page-hero__blob,
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero__blob,
body.profile-page-lively .cprof-page-hero__blob,
body.cpf-page-lively .cpf-page-hero__blob,
body.cab-about-page-unified .cab-about-hero__blob {
    opacity: var(--kf-nature-blob-opacity) !important;
}

body.my-home-lively.mh-home-v2-page .mh-v2-hero__mesh {
    opacity: 0.45;
    background:
        none;
}

/* Portal hero H1 — one font, size, and weight on every page (wins over page CSS) */
body.shop-page-unified .shop-page-hero__title,
body.shop-page-unified.shop-page-qc .shop-page-hero__title,
body.orders-page-unified.orders-page-lively .orders-page-hero__title,
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero__title,
body.custom-pick-basket-page.veggies-basket-lively .vbasket-page-hero__title,
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero__title,
body.profile-page-lively .cprof-page-hero:not(.cprof-page-hero--strip) .cprof-page-hero__title,
body.cpf-page-lively .cpf-page-hero__title,
body.cab-about-page-unified .cab-about-hero .cab-about__headline,
body.cab-about-page-unified .cab-about-hero .cab-about__headline-line,
body.cab-about-page-unified .cab-about-hero .cab-about__headline-accent,
body.my-home-lively.mh-home-v2-page .mh-v2-hero__title,
body.my-home-lively .mh-home-page-hero__title,
body.mh-page .mh-basket-hub__title--gfy,
body.mh-page .mh-basket-hub__title--gfy .mh-greet__name-accent,
body.shop-page-unified .shop-page-hero__title-accent,
body.orders-page-unified.orders-page-lively .orders-page-hero__title-accent,
body.veggies-basket-contact-page.veggies-basket-lively .vbasket-page-hero__title-accent,
body.custom-pick-basket-page.veggies-basket-lively .vbasket-page-hero__title-accent,
body.subscription-contact-page.subscription-contact-lively .sub-contact-page-hero__title-accent,
body.profile-page-lively .cprof-page-hero__title-accent,
body.cpf-page-lively .cpf-page-hero__title-accent,
body.my-home-lively.mh-home-v2-page .mh-v2-hero__title-accent {
    font-family: var(--kf-portal-hero-title-font) !important;
    font-size: var(--kf-portal-hero-title-size) !important;
    font-weight: var(--kf-portal-hero-title-weight) !important;
    line-height: var(--kf-portal-hero-title-lh) !important;
    letter-spacing: var(--kf-portal-hero-title-tracking) !important;
}

/* ── Portal primary CTA — compact square (match Add To Cart on category / cart pages) ── */
:root,
body.bh-page,
body.mh-page {
    --kf-portal-cta-max-w: 20rem;
    --kf-portal-cta-pad-y: 8px;
    --kf-portal-cta-pad-x: 14px;
    --kf-portal-cta-min-h: 40px;
    --kf-portal-cta-radius: 0;
    --kf-portal-cta-bg: #15803d;
    --kf-portal-cta-border: 1px solid rgba(21, 128, 61, 0.4);
    --kf-portal-cta-shadow:
        0 1px 0 rgba(255, 255, 255, 0.22) inset,
        0 4px 14px rgba(5, 150, 105, 0.22);
    --kf-portal-cta-font: 0.82rem;
}

body.bh-page :is(
        .sub-start-cta,
        .bh-add-cart-cta,
        .mh-greet__harvest-cta,
        a.mh-greet__harvest-cta,
        button.mh-greet__harvest-cta,
        .kf-customer-cta:not(.kf-customer-cta--secondary),
        a.kf-customer-cta:not(.kf-customer-cta--secondary),
        button.kf-customer-cta:not(.kf-customer-cta--secondary),
        .bh-bar__cta,
        .shop-hub-order__btn,
        .ca-btn:not(.ca-btn--ghost):not(.ca-btn--inline),
        .coh-empty__btn,
        .cwa-empty__btn,
        .bh-cart-empty__btn,
        .shop-promo-customize,
        .cab-about__cta-secondary,
        .sub-stop__btn,
        .sub-gate-dialog__btn-confirm,
        .wlt-balance-hero__ghost,
        .wlt-empty__btn,
        .mb-basket-foot-actions a.mb-basket-foot-actions__primary,
        .cw-modal__btn.cw-modal__btn--primary
    ),
body.mh-page :is(
        .sub-start-cta,
        .bh-add-cart-cta,
        .mh-greet__harvest-cta,
        a.mh-greet__harvest-cta,
        button.mh-greet__harvest-cta,
        .kf-customer-cta:not(.kf-customer-cta--secondary),
        a.kf-customer-cta:not(.kf-customer-cta--secondary),
        button.kf-customer-cta:not(.kf-customer-cta--secondary),
        .bh-bar__cta,
        .shop-hub-order__btn,
        .ca-btn:not(.ca-btn--ghost):not(.ca-btn--inline),
        .coh-empty__btn,
        .cwa-empty__btn,
        .bh-cart-empty__btn,
        .shop-promo-customize,
        .cab-about__cta-secondary,
        .sub-stop__btn,
        .sub-gate-dialog__btn-confirm,
        .wlt-balance-hero__ghost,
        .wlt-empty__btn,
        .mb-basket-foot-actions a.mb-basket-foot-actions__primary,
        .cw-modal__btn.cw-modal__btn--primary
    ) {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    box-sizing: border-box;
    width: auto !important;
    max-width: min(100%, var(--kf-portal-cta-max-w)) !important;
    min-height: var(--kf-portal-cta-min-h);
    margin-left: auto;
    margin-right: auto;
    padding: var(--kf-portal-cta-pad-y) var(--kf-portal-cta-pad-x) !important;
    font-family: var(--kf-app-font-family, inherit) !important;
    font-size: var(--kf-portal-cta-font) !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    letter-spacing: 0.01em;
    text-decoration: none;
    text-align: center;
    color: #fff !important;
    background: var(--kf-portal-cta-bg) !important;
    border: var(--kf-portal-cta-border) !important;
    border-radius: var(--kf-portal-cta-radius) !important;
    box-shadow: var(--kf-portal-cta-shadow) !important;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition:
        transform 0.16s ease,
        filter 0.16s ease,
        box-shadow 0.16s ease,
        opacity 0.16s ease;
}

body.bh-page :is(.sub-start-cta, .bh-add-cart-cta, .mh-greet__harvest-cta) .sub-start-cta__label,
body.mh-page :is(.sub-start-cta, .bh-add-cart-cta, .mh-greet__harvest-cta) .sub-start-cta__label {
    font-size: var(--kf-portal-cta-font) !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
}

body.bh-page :is(.sub-start-cta, .bh-add-cart-cta, .mh-greet__harvest-cta) .sub-start-cta__ico,
body.mh-page :is(.sub-start-cta, .bh-add-cart-cta, .mh-greet__harvest-cta) .sub-start-cta__ico,
body.bh-page :is(.sub-start-cta, .bh-add-cart-cta, .mh-greet__harvest-cta) .bh-add-cart-cta__cart-ico,
body.mh-page :is(.sub-start-cta, .bh-add-cart-cta, .mh-greet__harvest-cta) .bh-add-cart-cta__cart-ico {
    width: 15px;
    height: 15px;
    flex-shrink: 0;
}

body.bh-page :is(
        .mh-greet__harvest-cta-wrap,
        .bh-tier-step__cta-wrap,
        .sub-contact-panel__cta-wrap,
        .sub-hub__cta-wrap,
        .cab-about__cta-row .mh-greet__harvest-cta-wrap,
        .cprof-actions .mh-greet__harvest-cta-wrap,
        .profile-contact-form .mh-greet__harvest-cta-wrap,
        .mb-basket-foot-actions--shop-more .mh-greet__harvest-cta-wrap
    ),
body.mh-page :is(
        .mh-greet__harvest-cta-wrap,
        .bh-tier-step__cta-wrap,
        .sub-contact-panel__cta-wrap,
        .sub-hub__cta-wrap,
        .cab-about__cta-row .mh-greet__harvest-cta-wrap,
        .cprof-actions .mh-greet__harvest-cta-wrap,
        .profile-contact-form .mh-greet__harvest-cta-wrap,
        .mb-basket-foot-actions--shop-more .mh-greet__harvest-cta-wrap
    ) {
    display: flex;
    justify-content: center;
    width: auto;
    max-width: min(100%, var(--kf-portal-cta-max-w));
    margin-left: auto;
    margin-right: auto;
}

body.bh-page :is(.sub-start-cta, .mh-greet__harvest-cta, .ca-btn:not(.ca-btn--ghost)):disabled,
body.bh-page :is(.sub-start-cta, .mh-greet__harvest-cta, .ca-btn:not(.ca-btn--ghost))[aria-disabled='true'],
body.mh-page :is(.sub-start-cta, .mh-greet__harvest-cta, .ca-btn:not(.ca-btn--ghost)):disabled,
body.mh-page :is(.sub-start-cta, .mh-greet__harvest-cta, .ca-btn:not(.ca-btn--ghost))[aria-disabled='true'] {
    opacity: 0.58;
    pointer-events: none;
    filter: grayscale(0.12);
    cursor: not-allowed;
}

@media (prefers-reduced-motion: reduce) {
    body.bh-page :is(.sub-start-cta, .mh-greet__harvest-cta),
    body.mh-page :is(.sub-start-cta, .mh-greet__harvest-cta) {
        transition: filter 0.2s ease, opacity 0.2s ease;
    }
}
