/* ==========================================================
   OLB CART ADAPTER v0.7
   v0.7 (olb-cart 0.4.4): kølebil-advarsel .olb-cart__freight-warning (M3, Kurv SP v1.4).
   v0.6 (olb-cart 0.4.3): panelet kan altid scrolles som reserve (gammel/afvigende markup låser aldrig panelet).
   v0.5 (olb-cart 0.4.2): mini-cart med fast bund og scrollende liste (MC2), "+ X flere varer" som fold-ud (MC1), kompakt fragtfordel i mini (Kurv SP v1.5).
   v0.4 (olb-cart 0.4.1): fragtfordel fremhævet (.olb-info-block + success-soft), mini-fragtblok under "Varer i alt" (Kurv SP v1.3).
   v0.3 (olb-cart 0.4.0): fragtblok .olb-cart__freight / --mini / .olb-cart__benefit (Kurv SP v1.2, CK4).
   v0.2 (olb-cart 0.3.1): mini-cart-panel ≥1024 (DS-01 --width-drawer, loader 1.6.1).
   Klassifikation: component adapter
   Requires: OLB Design System v1.0 runtime (staging loader 1.6.0: Farve 1.0.5 ·
             Typo 0.9.8 · Layout 1.0.1 · F&D 1.0 · Icons 1.0.1 · Buttons 1.0.2 ·
             Forms 1.0.1 · Cards 1.0.1 · olb-behavior.css 1.0.1)
   Functional master: OLB_KURV_MINICART_MASTER_v1.0 + OLB_Bland_Selv_Slik_Master_v2.1 (§20)
   Structure Plan: OLB_CART_STRUCTURE_PLAN_v1.1
   Specialist master: n/a
   Mockup: Mockup V2 (Kurv og mini-cart)
   Build mode: A (olb-cart 0.3.1)
   Owns: placering/komposition af kurvside, varelinje (desktop-tabel og mobil
         2-rækket), opsummering, rabatkode-række, hjælpeboks, tom kurv,
         mini-cart-panel (placering, bredde, indholdsrækkefølge)
   Does NOT own: farver, typografi, spacing-skala, radius, skygger,
                 knapper/felter/kort/ikoner, fokus, globale states,
                 produktgrid, breakpoints, åbne/lukke (olb-shell-behavior)
   Breakpoints: kun canonical (768 / 1024)
   Lokale custom properties: --olb-cart-media (= --space-10 / --space-11)
   Documented deviations: 18rem = samme minimumsspor som Layout .olb-checkout
             (LOCKED), så kurv og kasse har samme opsummeringsbredde
   ========================================================== */

/* ---------- 1. Kurvsiden: stablet (mobil og tablet <1024) ---------- */

.olb-cart {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  row-gap: var(--gap-component);
  padding-block: var(--section-space);
  min-inline-size: 0;
}

.olb-cart > nav ol {
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap-tight);
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: var(--font-size-breadcrumb);
  color: var(--color-text-secondary);
}

.olb-cart > nav a {
  color: var(--color-link);
}

.olb-cart > nav li + li::before {
  content: "/";
  margin-inline-end: var(--gap-tight);
  color: var(--color-text-muted);
}

.olb-cart > .olb-button--tertiary {
  justify-self: start;
}

.olb-cart__title {
  margin: 0;
  font-family: var(--font-family-heading);
  font-size: var(--font-size-h1);
  font-weight: var(--font-weight-heading);
  line-height: var(--line-height-display);
  letter-spacing: var(--tracking-display);
  color: var(--color-text-primary);
}

.olb-cart__notices:empty {
  display: none;
}

.olb-cart > .olb-info-block {
  margin: 0;
  max-inline-size: var(--measure-info);
  font-size: var(--font-size-small);
  line-height: var(--line-height-help);
  color: var(--color-text-secondary);
}

.olb-cart > .olb-info-block .olb-icon {
  color: var(--color-brand-primary);
}

.olb-cart__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  row-gap: var(--gap-card-list);
  min-inline-size: 0;
}

/* ---------- 2. Vareliste ---------- */

.olb-cart__list,
.olb-minicart__list {
  margin: 0;
  padding: 0;
  list-style: none;
  min-inline-size: 0;
}

.olb-cart__head {
  display: none;
}

/* ---------- 3. Varelinje, mobil: to kompakte rækker (master §15) ----------
   Øverst: billede · navn/vægt · pris. Nederst: stepper · Fjern · linjetotal. */

.olb-cart-line {
  --olb-cart-media: var(--space-10);
  display: grid;
  grid-template-columns: var(--olb-cart-media) minmax(0, 1fr) auto auto;
  column-gap: var(--gap-inline);
  row-gap: var(--gap-tight);
  align-items: center;
  padding-block: var(--gap-component);
  border-bottom: var(--border-divider);
  min-inline-size: 0;
}

.olb-cart-line__media {
  grid-column: 1;
  grid-row: 1 / span 2;
  align-self: start;
  display: block;
  inline-size: var(--olb-cart-media);
  aspect-ratio: 1;
  border-radius: var(--radius-image);
  overflow: hidden;
  background: var(--color-surface-product);
}

.olb-cart-line__media img {
  display: block;
  inline-size: 100%;
  block-size: 100%;
  object-fit: contain;
}

.olb-cart-line__body {
  grid-column: 2 / -1;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  gap: var(--product-name-to-variant);
  min-inline-size: 0;
  overflow-wrap: anywhere;
}

.olb-cart-line__body > p {
  margin: 0;
  font-size: var(--font-size-product-sub);
  line-height: var(--line-height-ui);
  color: var(--color-text-secondary);
}

.olb-cart-line__body > .olb-cart-line__name,
.olb-cart-line__name {
  font-size: var(--font-size-product-name);
  font-weight: var(--font-weight-semibold);
  line-height: var(--line-height-card);
  color: var(--color-text-primary);
  text-decoration: none;
}

@media (hover: hover) and (pointer: fine) {
  a.olb-cart-line__name:hover {
    text-decoration: underline;
  }
}

.olb-cart-line .olb-cart-line__temp {
  font-size: var(--font-size-meta);
  font-weight: var(--font-weight-semibold);
  color: var(--color-brand-primary);
}

.olb-cart-line .olb-unit-price {
  font-size: var(--font-size-price-unit);
}

/* Pris (første p.olb-price) og stykpris × antal (eneste p uden class). */
.olb-cart-line > p.olb-price:first-of-type {
  grid-column: 2;
  grid-row: 2;
}

.olb-cart-line > p:not([class]) {
  grid-column: 3 / -1;
  grid-row: 2;
  justify-self: end;
}

.olb-cart-line > p {
  margin: 0;
}

.olb-cart-line .olb-price {
  font-size: var(--font-size-body);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-price);
  color: var(--color-text-primary);
}

.olb-cart-line > p:not([class]) {
  font-size: var(--font-size-meta);
  color: var(--color-text-secondary);
}

.olb-cart-line .olb-price del {
  margin-inline-end: var(--gap-hairline);
  font-size: var(--font-size-price-old);
  font-weight: var(--font-weight-regular);
  color: var(--color-text-muted);
}

.olb-cart-line .olb-price ins {
  text-decoration: none;
  color: var(--color-sale);
}

/* Nederste række. */
.olb-cart-line > .olb-quantity {
  grid-column: 1 / 3;
  grid-row: 3;
  justify-self: start;
  inline-size: var(--quantity-min-width);
}

.olb-cart-line > .olb-button {
  grid-row: 3;
  grid-column: 3;
}

.olb-cart-line > .olb-quantity ~ p.olb-price {
  grid-column: 4;
  grid-row: 3;
  justify-self: end;
}

.olb-cart-line > .olb-form-message--error {
  grid-column: 1 / -1;
}

/* Udsolgt (master §24): linjen nedtones, beskeden bærer betydningen. */
.olb-cart-line.is-soldout .olb-cart-line__body,
.olb-cart-line.is-soldout .olb-price {
  color: var(--color-text-muted);
}

/* Fortryd-linje. */
.olb-cart-line.is-removed {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--gap-inline);
  color: var(--color-text-secondary);
}

.olb-cart-line.is-removed > p {
  margin: 0;
}

/* Bland selv-pose (plan §4.5): ingen stepper. */
.olb-cart-line--bag > .olb-price {
  grid-column: 2;
  grid-row: 2;
}

.olb-cart-line--bag > a.olb-button {      /* Rediger */
  grid-row: 3;
  grid-column: 2 / 4;
  justify-self: start;
}

.olb-cart-line--bag > button.olb-button { /* Fjern */
  grid-row: 3;
  grid-column: 4;
  justify-self: end;
}

.olb-cart-line--bag details summary {
  cursor: pointer;
  color: var(--color-link);
  font-weight: var(--font-weight-semibold);
}

.olb-cart-line--bag details ul {
  margin: var(--gap-tight) 0 0;
  padding-inline-start: var(--gap-component);
}

/* ---------- 4. Opsummering ---------- */

.olb-cart__summary {
  display: grid;
  row-gap: var(--checkout-summary-row-gap);
  align-content: start;
  padding: var(--gap-component);
  background: var(--color-surface);
  border: var(--border-card);
  border-radius: var(--radius-checkout-card);
  min-inline-size: 0;
}

.olb-cart__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: var(--gap-inline);
  align-items: baseline;
  margin: 0;
  font-size: var(--font-size-summary-item);
  line-height: var(--line-height-ui);
  color: var(--color-text-primary);
}

.olb-cart__row dd {
  margin: 0;
  text-align: end;
}

/* Skift/Fjern-knapperne under rabatlinjen. */
.olb-cart__row dd:last-child:not(.olb-price):not(:nth-child(2)) {
  grid-column: 1 / -1;
  display: flex;
  justify-content: end;
  gap: var(--gap-tight);
}

.olb-cart__row:first-of-type {
  font-weight: var(--font-weight-semibold);
}

.olb-cart__row:first-of-type .olb-price {
  font-size: var(--font-size-price);
  font-weight: var(--font-weight-bold);
}

.olb-cart__summary > p {
  margin: 0;
  font-size: var(--font-size-meta);
  color: var(--color-text-muted);
}

.olb-cart__summary .olb-checkout-cta {
  margin-block-start: var(--gap-tight);
}

/* ---------- 4b. Fragtblok (Kurv SP v1.2, CK4) ----------
   Ligger i .olb-cart__summary (side) og i mini-cart-body (--mini).
   Nulstiller :first-of-type-fremhævningen fra 4, fordi rækkerne her er første af deres type i blokken. */

.olb-cart__freight {
  display: grid;
  row-gap: var(--gap-tight);
  padding-block-start: var(--gap-component);
  border-block-start: var(--border-divider);
  min-inline-size: 0;
}

.olb-cart__freight > p {
  margin: 0;
  font-size: var(--font-size-meta);
  line-height: var(--line-height-help);
  color: var(--color-text-secondary);
}

.olb-cart__freight .olb-cart__row,
.olb-cart__freight .olb-cart__row:first-of-type {
  font-weight: var(--font-weight-regular);
}

.olb-cart__freight .olb-cart__row:first-of-type .olb-price {
  font-size: inherit;
  font-weight: var(--font-weight-semibold);
}

/* "Levering til …" + Ændr: knappen til højre, teksten bryder frit. */
.olb-cart__freight > p.olb-cart__row {
  align-items: center;
  color: var(--color-text-primary);
  font-size: var(--font-size-summary-item);
}

.olb-cart__freight > p.olb-cart__row > span {
  min-inline-size: 0;
  overflow-wrap: anywhere;
}

/* Fragtfordel (Kurv SP v1.3, FB2): canonical .olb-info-block (ikon + tekst) fremhævet med success-soft.
   Linket/knappen "Shop videre" står på egen linje under teksten. */
.olb-cart__freight > .olb-cart__benefit {
  margin-block-start: var(--gap-tight);
  padding: var(--gap-component);
  background: var(--color-success-soft);
  border-radius: var(--radius-info-card);
  color: var(--color-text-primary);
  font-size: var(--font-size-summary-item);
  font-weight: var(--font-weight-semibold);
  line-height: var(--line-height-ui);
  align-items: center;
}

.olb-cart__benefit > .olb-icon {
  color: var(--color-success);
}

.olb-cart__benefit > a,
.olb-cart__benefit > .olb-button {
  grid-column: 2;
  justify-self: start;
}

.olb-cart__benefit > a {
  color: var(--color-link);
  font-weight: var(--font-weight-semibold);
}

.olb-cart__benefit > a:hover {
  color: var(--color-link-hover);
}

/* M3: kølebil-advarsel (canonical .olb-info-block). En note, ikke en fejl: afdæmpet gul. */
.olb-cart__freight > .olb-cart__freight-warning {
  padding: var(--gap-tight) var(--gap-component);
  background: var(--color-warning-soft);
  border-radius: var(--radius-info-card);
  color: var(--color-text-primary);
  font-size: var(--font-size-meta);
  line-height: var(--line-height-help);
}

.olb-cart__freight-warning > .olb-icon {
  color: var(--color-warning-icon);
}

/* Genberegning (C34): kun teksten vises, gamle priser er fjernet af adapter-JS (master §16). */
.olb-cart__freight[aria-busy="true"] > p {
  color: var(--color-text-muted);
}

/* Mini-cart: blokken står under "Varer i alt" (som har sin egen linje), så ingen ekstra skillelinje, og mini-cart'ens subtotal-stil (dl med linje) gælder ikke her. */
.olb-cart__freight--mini {
  padding-block-start: 0;
  border-block-start: 0;
}

.olb-minicart__panel .olb-cart__freight--mini dl {
  display: grid;
  padding-block-start: 0;
  border-block-start: 0;
  font-weight: var(--font-weight-regular);
}

/* ---------- 5. Rabatkode (Forms .olb-coupon; kun placering af label/fejl) ---------- */

.olb-cart > .olb-coupon .olb-coupon__row {
  flex-wrap: wrap;
}

.olb-cart > .olb-coupon .olb-field__label,
.olb-cart > .olb-coupon .olb-field__error {
  flex-basis: 100%;
}

.olb-cart > .olb-coupon .olb-field__error {
  order: 1;
}

/* ---------- 6. Hjælpeboks ---------- */

.olb-cart > .olb-info-card h2 {
  margin: 0 0 var(--gap-tight);
  font-size: var(--font-size-h4);
  line-height: var(--line-height-subheading);
}

.olb-cart > .olb-info-card a {
  color: var(--color-link);
  font-weight: var(--font-weight-semibold);
}

.olb-cart > .olb-info-card p {
  margin: 0;
  font-size: var(--font-size-small);
  line-height: var(--line-height-help);
}

/* ---------- 7. Tom kurv (master §20–21) ---------- */

.olb-cart-empty {
  display: grid;
  justify-items: center;
  row-gap: var(--gap-component);
  text-align: center;
  color: var(--color-text-secondary);
}

.olb-cart-empty > .olb-icon {
  color: var(--color-brand-primary);
}

.olb-cart-empty > h1 {
  margin: 0;
  font-family: var(--font-family-heading);
  font-size: var(--font-size-h1);
  font-weight: var(--font-weight-heading);
  line-height: var(--line-height-display);
  letter-spacing: var(--tracking-display);
  color: var(--color-text-primary);
}

.olb-cart-empty > p {
  margin: 0;
  max-inline-size: var(--measure-body);
}

.olb-cart-empty > h2 {
  margin: var(--gap-block) 0 0;
  font-size: var(--font-size-h3);
  line-height: var(--line-height-subheading);
  color: var(--color-text-primary);
}

.olb-cart-empty > .olb-category-grid {
  justify-self: stretch;
  margin: 0;
  padding: 0;
  list-style: none;
  text-align: start;
}

/* Master §21: på mobil store klikbare rækker. */
@media (max-width: 767.98px) {
  .olb-cart-empty > .olb-category-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* ---------- 8. Desktop ≥1024: tabel + opsummering til højre (master §12–13) ---------- */

@media (min-width: 1024px) {
  .olb-cart {
    grid-template-columns: minmax(0, 1.6fr) minmax(18rem, 1fr);
    grid-template-areas:
      "crumb   crumb"
      "back    back"
      "title   title"
      "notices notices"
      "temp    temp"
      "list    summary"
      "coupon  help";
    column-gap: var(--space-8);
    align-items: start;
  }

  .olb-cart > nav             { grid-area: crumb; }
  .olb-cart > .olb-button--tertiary { grid-area: back; }
  .olb-cart__title            { grid-area: title; }
  .olb-cart__notices          { grid-area: notices; }
  .olb-cart > .olb-info-block { grid-area: temp; }
  .olb-cart__list             { grid-area: list; }
  .olb-cart__summary          { grid-area: summary; }
  .olb-cart > .olb-coupon     { grid-area: coupon; }
  .olb-cart > .olb-info-card  { grid-area: help; }

  /* Listen og opsummeringen placeres direkte i sidens grid. */
  .olb-cart__layout {
    display: contents;
  }

  /* Mobil-CTA over listen bruges kun <1024 (plan D26). */
  .olb-cart > [data-olb-zone="mobile-top"] {
    display: none;
  }

  .olb-cart__summary {
    position: sticky;
    top: var(--gap-component);
  }

  /* Tabel: kolonneoverskrifter og linjer deler samme spor. */
  .olb-cart__head,
  .olb-cart__list > .olb-cart-line:not(.is-removed) {
    --olb-cart-media: var(--space-11);
    display: grid;
    grid-template-columns:
      var(--olb-cart-media)
      minmax(0, 3fr)
      minmax(0, 1fr)
      var(--quantity-min-width)
      minmax(0, 1fr)
      auto;
    column-gap: var(--gap-component);
  }

  .olb-cart__head {
    padding-block-end: var(--gap-inline);
    border-bottom: var(--border-divider);
    font-size: var(--font-size-meta);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-secondary);
  }

  .olb-cart__head > span:first-child { grid-column: 1 / 3; }
  .olb-cart__head > span:last-child  { justify-self: end; }

  .olb-cart__list .olb-cart-line__media { grid-row: 1 / span 2; }
  .olb-cart__list .olb-cart-line__body  { grid-column: 2; grid-row: 1; }

  .olb-cart__list .olb-cart-line > p.olb-price:first-of-type {
    grid-column: 3;
    grid-row: 1;
  }

  .olb-cart__list .olb-cart-line > p:not([class]) {
    grid-column: 3;
    grid-row: 2;
    justify-self: start;
  }

  .olb-cart__list .olb-cart-line > .olb-quantity {
    grid-column: 4;
    grid-row: 1;
    inline-size: 100%;
  }

  .olb-cart__list .olb-cart-line > .olb-quantity ~ p.olb-price {
    grid-column: 5;
    grid-row: 1;
  }

  .olb-cart__list .olb-cart-line > .olb-button {
    grid-column: 6;
    grid-row: 1;
  }

  .olb-cart__list .olb-cart-line > .olb-form-message--error {
    grid-column: 2 / -1;
  }

  /* Bland selv-pose i tabellen. */
  .olb-cart__list .olb-cart-line--bag > p.olb-price:first-of-type {
    grid-column: 5;
    grid-row: 1;
    justify-self: end;
  }

  .olb-cart__list .olb-cart-line--bag > a.olb-button {
    grid-column: 4;
    grid-row: 1;
    justify-self: start;
  }

  .olb-cart__list .olb-cart-line--bag > button.olb-button {
    grid-column: 6;
    grid-row: 1;
  }
}


/* ---------- 9. Mini-cart (≥1024, plan §4.3, D4) ----------
   Åbnes kun af headerens kurv-knap ≥1024 (D3) via olb-shell-behavior (hidden/inert/fokus).
   Under 1024 findes ingen trigger, så panelet åbnes aldrig. */

@media (min-width: 1024px) {

  .olb-minicart {
    position: fixed;
    inset: 0;
    z-index: var(--z-drawer);
    display: flex;
    justify-content: flex-end;
  }

  .olb-minicart__scrim {
    position: absolute;
    inset: 0;
    background: var(--color-scrim);
  }

  .olb-minicart__panel {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: var(--gap-component);
    inline-size: min(var(--width-drawer), 100%);
    block-size: 100%;
    overflow-y: auto;              /* reserve: med 0.4.2+-markup flyder panelet aldrig over, kun listen scroller (MC2) */
    overscroll-behavior: contain;
    padding: var(--space-6) var(--space-6) 0;
    background: var(--color-surface-elevated);
    color: var(--color-text-primary);
    box-shadow: var(--shadow-overlay);
  }

  .olb-minicart__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--gap-tight);
  }

  .olb-minicart__top > h2 {
    margin: 0;
    font-family: var(--font-family-body);
    font-size: var(--font-size-h4);
    font-weight: var(--font-weight-semibold);
    letter-spacing: var(--tracking-normal);
  }

  .olb-minicart__panel > [data-olb-minicart-body] {
    display: flex;
    flex-direction: column;
    gap: var(--gap-component);
    flex: 1 1 auto;
    min-block-size: 0;
  }

  /* MC2: varelisten (og fold-ud) scroller; bunden står fast. */
  .olb-minicart__scroll {
    flex: 1 1 auto;
    min-block-size: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  .olb-minicart__footer {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    gap: var(--gap-tight);
    padding-block: var(--gap-component) var(--space-6);
    border-block-start: var(--border-divider);
  }

  .olb-minicart__footer > .olb-button--large {
    margin-block-start: var(--gap-tight);
  }

  .olb-minicart__panel .olb-minicart__footer > dl {
    padding-block-start: 0;
    border-block-start: 0;
  }

  /* MC1: "+ X flere varer" / "Vis færre varer". */
  .olb-minicart__more {
    margin-block: var(--gap-tight);
  }

  .olb-minicart__more[aria-expanded="true"] > .olb-icon {
    transform: rotate(180deg);
  }

  /* Fragtfordel kompakt i mini-cart: Shop videre til højre på samme linje. */
  .olb-cart__freight--mini > .olb-cart__benefit {
    grid-template-columns: auto minmax(0, 1fr) auto;
    padding-block: var(--gap-tight);
  }

  .olb-cart__freight--mini .olb-cart__benefit > .olb-button {
    grid-column: 3;
    grid-row: 1;
  }

  .olb-minicart__panel .olb-info-block p,
  .olb-minicart__panel > [data-olb-minicart-body] > p {
    margin: 0;
    color: var(--color-text-secondary);
    font-size: var(--font-size-small);
    line-height: var(--line-height-help);
  }

  .olb-minicart__panel dl {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--gap-tight);
    margin: 0;
    padding-block-start: var(--gap-component);
    border-block-start: var(--border-divider);
    font-weight: var(--font-weight-semibold);
  }

  .olb-minicart__panel dd {
    margin: 0;
  }
}