/* ------------------------------------------------------------------
   KA — Paper design skin (Paper file 01M0AAMKAW7GYGD2288WRSZ8C5,
   boards 02 "Qlean PDP - desktop 1440" and 03 "Qlean PDP - mobile 390").

   Loaded by sections/main-product.liquid when "KA — Paper design skin"
   is on. Every rule is scoped to .ka-skin so other product templates
   keep their own look. Values are read off the boards / the Paper
   theme-token table, not eyeballed:
     ruby #831422 · ruby-deep #5F0F1A · sunset #D44C18 · gold #E0A23C
     cream #FDF6F1 · blush #FBE9E0 · ink #1C1C1C · soft #6B6660
     rule #EFE2DA · strike #A89F98 · green #1A8F4A · Poppins 400–800
   ------------------------------------------------------------------ */

.ka-skin {
  --ka-ruby: #831422;
  --ka-ruby-deep: #5F0F1A;
  --ka-sunset: #D44C18;
  --ka-gold: #E0A23C;
  --ka-cream: #FDF6F1;
  --ka-blush: #FBE9E0;
  --ka-ink: #1C1C1C;
  --ka-soft: #6B6660;
  --ka-rule: #EFE2DA;
  --ka-strike: #A89F98;
  --ka-green: #1A8F4A;
}

/* The boards use Poppins regular for body copy; the theme's global text
   font is Poppins Light (300), so nudge the buy box back to 400. */
.ka-skin .product-info {
  font-weight: 400;
  color: var(--ka-ink);
}

/* ---------- Title / rating / subline ---------- */

.ka-skin .product-info .product-title {
  color: var(--ka-ruby);
  font-weight: 700;
  font-size: clamp(26px, 26px + 9 * (100vw - 390px) / 1050, 35px);
  line-height: 1.2;
  letter-spacing: -0.015em;
}

.ka-skin .rating-badge__stars,
.ka-skin .rating-badge__stars svg {
  color: var(--ka-gold);
}

.ka-skin .rating-badge .text-subdued {
  color: var(--ka-soft);
  font-weight: 600;
}

.ka-skin [data-block-type="text"] .prose {
  font-size: 15px;
  line-height: 1.45;
  color: var(--ka-soft);
}

/* ---------- Benefit rows (feature_with_icon as ruby checks) ---------- */

.ka-skin .feature-badge {
  padding: 0;
  gap: 12px;
  border: 0;
  background: transparent;
}

.ka-skin .feature-badge svg {
  color: var(--ka-ruby);
  flex: none;
}

.ka-skin .feature-badge p {
  font-size: 15px;
  color: var(--ka-ink);
}

/* Tighten the stack of consecutive benefit rows */
.ka-skin .product-info__block-item[data-block-type="feature-with-icon"] + .product-info__block-item[data-block-type="feature-with-icon"] {
  margin-top: -6px;
}

/* ---------- Step headings (1. scent / 2. pack / 3. delivery) ---------- */

.ka-skin .ka-step-heading,
.ka-skin .qn-pl__heading,
.ka-skin .qngp__legend {
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  color: var(--ka-ruby);
}

/* ---------- Scent picker ---------- */

.ka-skin .ka-sp__name {
  color: var(--ka-soft);
  font-weight: 500;
}

.ka-skin .ka-sp__card.is-selected .ka-sp__name {
  color: var(--ka-ruby);
  font-weight: 700;
}

/* ---------- Pack ladder / delivery choice accents the settings can't reach ---------- */

.ka-skin .ka-dc__card--sub .ka-dc__label,
.ka-skin .ka-dc__card--sub .ka-dc__price {
  color: var(--ka-ruby);
}

.ka-skin .ka-dc__label {
  font-size: 16px;
  font-weight: 700;
}

.ka-skin .ka-dc__card--once .ka-dc__label {
  font-size: 15px;
  font-weight: 500;
  color: var(--ka-ink);
}

.ka-skin .ka-dc__perload,
.ka-skin .ka-dc__single,
.ka-skin .ka-dc__ticks,
.ka-skin .ka-dc__disclosure {
  color: var(--ka-soft);
}

.ka-skin .ka-dc__ticks {
  font-size: 14px;
}

.ka-skin .ka-dc__tick {
  color: var(--ka-ruby);
}

.ka-skin .ka-dc__freq {
  background: #ffffff;
  border-color: var(--ka-rule);
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  color: var(--ka-ink);
}

@media screen and (max-width: 749px) {
  .ka-skin .ka-dc__label { font-size: 15px; }
  .ka-skin .ka-dc__price { font-size: 18px; }
}

/* ---------- Buy buttons ---------- */

.ka-skin .buy-buttons .button {
  border-radius: 999px;
  min-height: 58px;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.02em;
}

.ka-skin .ka-bn__button {
  color: var(--ka-ruby);
  border-color: var(--ka-ruby);
  background: #ffffff;
  font-size: 16px;
}

/* ---------- Rating stars (Paper frame 02: gold stars + label) ---------- */

.ka-skin .rating-badge__stars svg path {
  fill: var(--ka-gold);
}

.ka-skin .rating-badge__label {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--ka-soft);
}

/* ---------- Trust lines under the buttons ---------- */

/* Classes on <p> tags don't survive Shopify's richtext validation, so the
   template tags the text BLOCK with custom_class "ka-trust" instead; the two
   paragraphs inside are the shipnote and the stockline. The legacy
   .ka-shipnote/.ka-stockline selectors stay for older template copies. */
.ka-skin .ka-trust p,
.ka-skin .ka-shipnote,
.ka-skin .ka-stockline {
  text-align: center;
  font-size: 13px;
  color: var(--ka-soft);
}

.ka-skin .ka-trust p a,
.ka-skin .ka-shipnote a {
  color: var(--ka-ruby);
  font-weight: 600;
  text-underline-offset: 2px;
}

.ka-skin .ka-trust p strong,
.ka-skin .ka-stockline strong {
  color: var(--ka-ink);
  font-weight: 600;
}

.ka-skin .ka-trust p strong::before,
.ka-skin .ka-stockline strong::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--ka-green);
  margin-right: 7px;
  vertical-align: 1px;
}

/* ---------- Accordions ---------- */

.ka-skin [data-block-type="accordion"] .accordion__toggle {
  color: var(--ka-ruby);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}

.ka-skin [data-block-type="accordion"] .accordion {
  border-block-color: var(--ka-rule);
}

.ka-skin [data-block-type="accordion"] .animated-plus {
  color: var(--ka-ruby);
}

.ka-skin [data-block-type="accordion"] .accordion__content {
  color: var(--ka-ink);
  font-size: 14px;
}

/* ---------- Icon badges row ---------- */

.ka-skin .ka-ib__icon {
  background: #ffffff !important;
  border: 1.2px solid var(--ka-ruby);
  color: var(--ka-sunset) !important;
}

.ka-skin .ka-ib__label {
  color: var(--ka-ink);
  font-weight: 600;
}

/* ---------- Buyer quote card ---------- */

.ka-skin .ka-bq__quote {
  color: var(--ka-ink);
  font-weight: 600;
  line-height: 1.5;
}

.ka-skin .ka-bq__label {
  letter-spacing: 0.06em;
  font-weight: 700;
}

.ka-skin .ka-bq__author {
  color: var(--ka-soft);
}

/* ---------- "Pairs Perfectly With" (db_product_upsell) ---------- */

.ka-skin .db-upsell__add-btn {
  font-style: italic;
  font-weight: 800;
  letter-spacing: 0.03em;
}

.ka-skin .db-upsell__price {
  color: var(--ka-sunset);
}

/* ---------- Gallery ---------- */

.ka-skin .product-gallery__media,
.ka-skin .product-gallery__media img {
  border-radius: 14px;
}

/* ---------- Sticky add-to-cart bar (board 03, bottom bar) ---------- */

.product-sticky-bar.ka-skin {
  background: #ffffff;
  border-top: 1px solid var(--ka-rule);
}

.product-sticky-bar.ka-skin .price-list {
  color: var(--ka-ruby);
  font-weight: 700;
}

.product-sticky-bar.ka-skin .button {
  background: rgb(131 20 34);
  --button-background: 131 20 34;
  --button-text-color: 255 255 255;
  border-radius: 999px;
  min-height: 52px;
  font-weight: 700;
  letter-spacing: 0.02em;
}