/*
 * MARABIKA Product UI v2.2.7 catalog adapter.
 * Gives existing, content-preserving mkds-prose descriptions a complete v2
 * surface without product-specific CSS or fabricated editorial components.
 */

/*
 * Product delivery already renders its own warm, rounded card. Flatten the
 * legacy theme wrapper so the section has one intentional frame, not a grey
 * rectangle around the card. Keep the wrapper's bottom rhythm unchanged.
 */
#product .product-shipping-block {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose {
  position: relative;
  display: flow-root;
  width: 100%;
  min-width: 0;
  padding: clamp(24px, 5cqi, 46px);
  overflow: hidden;
  border: 1px solid var(--mkds-v2-line);
  border-radius: var(--mkds-radius-xl);
  background: #fff;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--mkds-v2-accent-soft) 24%, #fff) 0%, #fff 44%, var(--mkds-v2-surface) 100%);
  box-shadow: var(--mkds-shadow);
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose::before {
  position: absolute;
  inset: 0 0 auto;
  height: 5px;
  background: linear-gradient(90deg, var(--mkds-v2-accent-strong), var(--mkds-v2-highlight));
  content: "";
  pointer-events: none;
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose > :where(h2, h3, h4) {
  max-width: 26ch;
  margin-inline: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 600;
  letter-spacing: -.018em;
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose > h2 {
  margin-block: 0 18px;
  font-size: clamp(28px, 5cqi, 40px) !important;
  line-height: 1.1 !important;
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose > :where(h2, h3):not(:first-child) {
  margin-block-start: clamp(34px, 6cqi, 54px);
  padding-block-start: clamp(26px, 4cqi, 38px);
  border-block-start: 1px solid var(--mkds-v2-line);
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose > h3 {
  margin-block-end: 14px;
  font-size: clamp(23px, 4cqi, 31px);
  line-height: 1.16;
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose > h4 {
  margin-block: 26px 10px;
  font-size: 20px;
  line-height: 1.25;
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose > :where(p, ul, ol, dl, blockquote) {
  max-width: 72ch;
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose :where(p, li, dd, td, th, blockquote) {
  font-size: 16px;
  line-height: 1.68;
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose > :where(p, ul, ol, dl, blockquote, .mkds-grid, .mkds-card, .mkds-table-wrap) {
  margin-block: 0 18px;
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose > :where(ul, ol) {
  padding-inline-start: 1.35rem;
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose li + li {
  margin-block-start: 8px;
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose > .mkds-grid {
  width: 100%;
  max-width: none;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
}

/*
 * Migrated long-form catalog descriptions can contain many substantial text
 * cards in one top-level grid. Two 383px desktop columns leave only about
 * 325px for copy after card padding, which is narrower than a comfortable
 * reading measure and creates excessive line wrapping. Keep these editorial
 * cards in document order as one reading column and cap long copy at 68ch.
 * Nested, purpose-built product grids retain their own component layouts.
 */
.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose > .mkds-grid > .mkds-card > :where(p, ul, ol, dl, blockquote) {
  max-width: 68ch;
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose .mkds-card {
  border-color: var(--mkds-v2-line);
  border-radius: var(--mkds-radius-md);
  background: color-mix(in srgb, var(--mkds-v2-canvas) 94%, var(--mkds-v2-accent-soft));
  box-shadow: none;
}

/*
 * Keep a question and its inline no-translate spans in one text flow. The v1
 * flex summary promotes each text fragment to a separate flex item, making
 * long product names collapse into narrow columns on desktop.
 */
.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product .mkds-faq > details > summary {
  display: block;
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product .mkds-faq > details > summary::after {
  inset-block-start: 50%;
  transform: translateY(-50%);
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose > .mkds-table-wrap {
  width: 100%;
  max-width: 100%;
  border: 1px solid var(--mkds-v2-line);
  border-radius: var(--mkds-radius-md);
  background: #fff;
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose > :last-child {
  margin-block-end: 0;
}

/*
 * Component-rich v1 descriptions already contain real MKDS cards. Keep a
 * single visual surface: remove the adapter shell and let those cards own the
 * border. The theme shell is flattened only when it contains a v2 product.
 */
.product-desc-section:has(.m-product-description--mkds-v2) {
  padding-inline: 0;
  overflow: visible;
  border: 0;
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose:has(> .mkds-grid) {
  padding: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose:has(> .mkds-grid)::before {
  display: none;
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose > .mkds-grid > .mkds-card:first-child {
  position: relative;
  overflow: hidden;
  background: #fff;
  background:
    radial-gradient(120% 85% at 100% 0, color-mix(in srgb, var(--mkds-v2-accent-strong) 11%, transparent), transparent 52%),
    linear-gradient(145deg, color-mix(in srgb, var(--mkds-v2-accent-soft) 18%, #fff) 0%, #fff 48%, color-mix(in srgb, var(--mkds-v2-highlight-soft) 30%, #fff) 100%);
  box-shadow: 0 18px 48px rgba(66, 44, 31, .09);
}

.mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose > .mkds-grid > .mkds-card:first-child::before {
  position: absolute;
  inset: 0 0 auto;
  height: 5px;
  background: linear-gradient(90deg, var(--mkds-v2-accent-strong), var(--mkds-v2-highlight));
  content: "";
  pointer-events: none;
}

/*
 * Restore the intentional reading transition that the legacy product card
 * had before Product v2. It belongs to the collapsible viewport, not to an
 * inner card, so it never creates another frame and disappears on expansion.
 */
.m-product-description.m-product-description--mkds-v2 {
  --mkds-v2-collapse-height: 420px;
}

/* The shell raises specificity above the compatibility :has() bridge. */
.m-product-description-shell--mkds-v2 > .m-product-description.m-product-description--mkds-v2 {
  --mkds-v2-collapse-height: 420px;
}

.m-product-description.m-product-description--mkds-v2.is-collapsible:not(.is-expanded)::after {
  position: absolute;
  z-index: 4;
  inset: auto 0 0;
  display: block;
  height: 112px;
  background:
    radial-gradient(85% 95% at 100% 100%, rgba(99, 42, 61, .075), transparent 72%),
    linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(250, 247, 244, .76) 55%, #fff 100%);
  content: "";
  pointer-events: none;
}

.m-product-description-shell--mkds-v2 > .m-product-description.m-product-description--mkds-v2.is-collapsible:not(.is-expanded)::after {
  display: block;
}

@media (max-width: 1023px) {
  .m-product-description.m-product-description--mkds-v2 {
    --mkds-v2-collapse-height: 380px;
  }

  .m-product-description-shell--mkds-v2 > .m-product-description.m-product-description--mkds-v2 {
    --mkds-v2-collapse-height: 380px;
  }
}

@media (max-width: 720px) {
  .m-product-description.m-product-description--mkds-v2 {
    --mkds-v2-collapse-height: 340px;
  }

  .m-product-description-shell--mkds-v2 > .m-product-description.m-product-description--mkds-v2 {
    --mkds-v2-collapse-height: 340px;
  }
}

@media (max-width: 480px) {
  .mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose {
    padding: 25px 17px 27px;
    border-radius: 18px;
  }

  .mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose > h2 {
    font-size: 28px !important;
  }

  .mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose > h3 {
    font-size: 24px;
  }
}

@media (forced-colors: active) {
  .mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose {
    border: 1px solid CanvasText;
    background: Canvas;
    box-shadow: none;
  }

  .mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose::before {
    background: CanvasText;
  }

  .mkds-page.mkds-v1.mkds-v2.mkds-page--product.mkds-product > .mkds-prose > .mkds-grid > .mkds-card:first-child {
    border: 1px solid CanvasText;
    background: Canvas;
    box-shadow: none;
  }

  .m-product-description.m-product-description--mkds-v2.is-collapsible:not(.is-expanded)::after {
    background: linear-gradient(180deg, transparent, Canvas 78%);
  }
}