/* Khuttwa — White look: white page, dark text, one wine colour on buttons, prices and badges.
   Loaded when Customize > Khuttwa – Look > Look = White. */
body.kh-light {
  background: var(--kx-bg, #fff);
  --color-background: var(--kx-bg, #fff); --gradient-background: transparent;
  --color-heading: var(--kx-ink, #141414); --color-heading-rgb: 20, 20, 20;
  --color-text: #4a4a4f; --color-text-rgb: 74, 74, 79;
  --color-link: var(--kx-ink, #141414); --color-link-hover: var(--kx-btn-2, #7d1530);
  --color-border: rgba(0, 0, 0, .1); --border-color-base: rgba(0, 0, 0, .1);
  --kx-tile: #f6f6f4; --kw-red-soft: var(--kx-btn-2, #7d1530);
  color: #4a4a4f;
}
body.kh-light.gradient, body.kh-light .gradient { background: transparent; }
.kh-light :is(h1, h2, h3, h4, b, strong) { color: inherit; }

/* buttons: one wine colour, white text */
.kh-light :is(.khs__btn, .kwp-add, .khc-btn--main, .kh-btn, .khc-empty .khc-btn, .kos-c__btn, .kbs-va, .kbr-va, .kpt__cta, .kps-all, .kd-cart, .spc-card__cart, .spc-card__go) {
  background: linear-gradient(160deg, var(--kx-btn-2), var(--kx-btn)) !important; color: #fff !important; border-color: transparent !important;
}
.kh-light :is(.khs__btn, .kwp-add, .khc-btn, .kh-btn, .kos-c__btn, .kbs-va, .kbr-va, .kps-all) i { background: #fff !important; color: var(--kx-btn) !important; }
.kh-light :is(.kh-badge--sale, .kwp-badge) { background: linear-gradient(160deg, var(--kx-btn-2), var(--kx-btn)); color: #fff; }
.kh-light :is(.pr, .kbs-p, .kmc__p, .kn-price, .kps-p) { color: var(--kx-btn-2) !important; }

/* header capsule: white glass with dark icons once it sticks; over the hero photo it keeps white icons */
.kh-light .kh2__cap.is-stuck, .kh-light .kh2:not(.kh2--over) .kh2__cap { background: rgba(255, 255, 255, .9) !important; color: var(--kx-ink, #141414); border-color: rgba(0, 0, 0, .08) !important; box-shadow: 0 14px 30px -18px rgba(0, 0, 0, .35); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
.kh-light :is(.kh2__cap.is-stuck, .kh2:not(.kh2--over) .kh2__cap) :is(.kh2__word, .kh2__btn, a, button) { color: var(--kx-ink, #141414) !important; }
.kh-light :is(.kh2__cap.is-stuck, .kh2:not(.kh2--over) .kh2__cap) .kh2__btn { background: var(--kx-soft, #f5f4f2) !important; border-color: transparent !important; }
.kh-light .kh2__n { background: var(--kx-btn-2); color: #fff; }

/* panels that were dark glass become soft light panels with dark text */
.kh-light :is(.kbb-card, .kbw__panel, .kcf-c, .kbt-c, .ksn-c, .kpc-c, .kfs__big, .kds__inf, .klb-row, .kfa-col, .kfa-pill, .k2-dc, .k2-in, .k2-wp, .kbt__more, .kcl, .kap__pill, .kap__chip, .kap--strip .kap__in) {
  background: #fff; color: var(--kx-ink, #141414); border-color: rgba(0, 0, 0, .09) !important; box-shadow: 0 10px 26px -18px rgba(0, 0, 0, .28);
}
.kh-light :is(.kbb-card__name, .kbw-pane__name, .kbw-card__name, .kcf-c__n, .kbt-c__name, .ksn-c__n, .kpc-c__n, .kbt__more b, .kcl__t, .kap) { color: var(--kx-ink, #141414) !important; }
.kh-light :is(.kbb-card__meta, .kbw-pane__meta, .kbw-card__price s, .kcl__n, .kpc-c__p, .kbt-c__price s, .ksn-c__p s, .kcf__price s, .kgw__price s) { color: #8a8a90 !important; }
.kh-light .kbb-card__logo { background: var(--kx-soft, #f5f4f2); }
.kh-light .kbb-card__av i, .kh-light .kbt__av i { border-color: #fff; }
.kh-light .kbw-card { background: #fff; border-color: rgba(0, 0, 0, .08); }
.kh-light .kbw-card__sz i { color: #555; border-color: rgba(0, 0, 0, .15); }
.kh-light .kbw-pane__dots i { background: rgba(0, 0, 0, .18); } .kh-light .kbw-pane__dots i.is-on { background: var(--kx-btn-2); }
.kh-light .kbw-card__heart { background: rgba(255, 255, 255, .9); color: #111; }
.kh-light :is(.kcf__ar, .kgw__ar, .kcl__b:not(.kcl__s)) { background: var(--kx-soft, #f5f4f2); border-color: rgba(0, 0, 0, .06); color: var(--kx-ink, #141414); }
.kh-light :is(.kcf__dots, .kgw__dots) button { background: rgba(0, 0, 0, .18); }
.kh-light .kcf.has-glow .kcf-c[data-p="0"] { box-shadow: 0 22px 40px -16px rgba(0, 0, 0, .45); }
.kh-light .kgw__word { -webkit-text-stroke-color: rgba(0, 0, 0, .35) !important; }
.kh-light .kgw__word--fill { color: rgba(0, 0, 0, .05) !important; }
.kh-light .kgw__glow { opacity: .35; }
.kh-light .kgw-p { box-shadow: 0 30px 40px -22px rgba(0, 0, 0, .45), 0 0 0 1px rgba(0, 0, 0, .06); }
.kh-light .kpc__l { color: rgba(0, 0, 0, .2); }
.kh-light .kpc__bar, .kh-light .kpz__bar { background: rgba(0, 0, 0, .08); }
.kh-light .ksw-w span { -webkit-text-stroke-color: rgba(0, 0, 0, .35); }
.kh-light .ksw__pic { border-color: #fff; }
.kh-light .ksn-c.is-on { box-shadow: 0 0 0 2px var(--kx-btn-2), 0 14px 26px -14px rgba(0, 0, 0, .4); }
.kh-light .kbt-c__num { color: rgba(0, 0, 0, .08); }
.kh-light .kpz-sl .kpz__price { color: #f3b6c4; }

/* stacked pages on white */
.kh-light .kh-sheet { background: var(--kx-bg, #fff); border-top-color: rgba(0, 0, 0, .07); box-shadow: 0 -18px 34px -14px rgba(0, 0, 0, .28); }
.kh-light .kh-sheet::before { background: rgba(0, 0, 0, .15); }
.kh-light .kh-dimmer { background: #fff; }

/* bottom bar, rail, sheets and drawers on white */
.kh-light :is(.kmn, .kmr, .kpm__panel, .kps__panel, .khc__panel, .kwq__panel, .kh-toolbar, .kcl-sheet, .k2-sheet) { background: rgba(255, 255, 255, .94) !important; color: var(--kx-ink, #141414) !important; border-color: rgba(0, 0, 0, .08) !important; box-shadow: 0 16px 34px -16px rgba(0, 0, 0, .35); }
