/* Kurv-modal */
/* Cart header: align title and close button */
.ls-kurv-header h3 { margin: 0; min-height: 34px; display: flex; align-items: center; gap: 0.65rem; padding-right: 40px; }
.ls-kurv-header h3 svg { display: block; width: 24px; height: 24px; flex: none; }
.ls-kurv-header h3 svg[hidden] { display: none; }
/* Centre the close control against the 34px title row, on every viewport. */
.ls-kurv-kort > .ls-modal-luk { top: calc(1.25rem + 17px); right: 1.5rem; transform: translateY(-50%); }

/* Two-stage modal: fixed title, scrollable stage content, fixed actions */
.ls-kurv-kort { max-width: 760px; width: 94vw; max-height: 92vh; max-height: 92dvh; overflow: hidden; display: flex; flex-direction: column; padding: 0; }
.ls-kurv-header { flex: none; padding: 1.25rem 1.5rem; border-bottom: 1px solid #eef1f5; }
.ls-kurv-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 0.2rem 1.5rem 1.5rem; scrollbar-gutter: stable; }
/* Both stages share the available height and independently scroll their contents. */
.ls-kurv-trin { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; }
.ls-kurv-trin[hidden], .ls-kurv-trin [hidden] { display: none !important; }
.ls-kurv-trin > .ls-kurv-scroll { flex: 1 1 auto; min-height: 0; }
.ls-kurv-footer { display: block; flex: none; padding: 1rem 1.5rem 1.15rem; border-top: 1px solid #eef1f5; background: #fff; }
.ls-kurv-footer[hidden] { display: none !important; }
.ls-kurv-footer > p { margin: 0.6rem 0 0; }
@media (max-width: 560px) {
  .ls-kurv-header { padding: 1rem 1.15rem; }
  .ls-kurv-kort > .ls-modal-luk { top: calc(1rem + 17px); right: 1.15rem; }
  .ls-kurv-scroll { padding: 0.2rem 1.15rem 1rem; }
  .ls-kurv-footer { padding: 0.75rem 1.15rem 0.9rem; }
}
.ls-kurv-kort label { min-width: 0; }
.ls-kurv-kort input, .ls-kurv-kort textarea { width: 100%; box-sizing: border-box; }
.ls-kurv-linjer { display: flex; flex-direction: column; gap: 0.4rem; margin: 0.6rem 0; }
.ls-kurv-linje { display: grid; grid-template-columns: 1fr auto auto auto; align-items: center; gap: 0.9rem; padding: 0.6rem 0; border-bottom: 1px solid #eef1f5; }
.ls-kurv-navn { min-width: 0; }
.ls-kurv-navn b { display: block; font-size: 0.92rem; line-height: 1.25; overflow-wrap: anywhere; }
.ls-kurv-vnr { display: block; font-size: 0.72rem; color: #8a97a5; }
.ls-kurv-stkpris { display: block; font-size: 0.85rem; color: #8a97a5; }
.ls-kurv-stkpris-delt .ls-kurv-prisdel { display: block; }
.ls-kurv-stkpris-delt .ls-kurv-prisdel em { font-style: normal; color: #2fae4e; font-weight: 650; }
.ls-kurv-qty { display: inline-flex; align-items: center; gap: 0; border: 1px solid #d6dde5; border-radius: 8px; overflow: hidden; }
.ls-kurv-qty .km { background: #f4f7f9; border: 0; width: 28px; height: 30px; font-size: 1rem; cursor: pointer; }
.ls-kurv-qty .ki { width: 42px; height: 30px; border: 0; border-left: 1px solid #e6ebf0; border-right: 1px solid #e6ebf0; text-align: center; font-size: 0.9rem; -moz-appearance: textfield; }
.ls-kurv-qty .ki::-webkit-outer-spin-button, .ls-kurv-qty .ki::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.ls-kurv-sum { font-weight: 700; font-size: 0.9rem; white-space: nowrap; }
.ls-kurv-fjern { background: none; border: 0; color: #c0392b; font-size: 1.2rem; line-height: 1; cursor: pointer; padding: 0 0.2rem; }
.ls-kurv-total { margin: 0.4rem 0 0.8rem; }
.ls-kurv-fragt-detaljer { margin-bottom: 0.4rem; }
.ls-kurv-tak { text-align: center; padding: 1.4rem 0.5rem; font-size: 1.2rem; font-weight: 800; color: var(--ls-green-d, #2e7d32); }
.ls-kurv-felt2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem; }
.ls-kurv-send { display: flex; gap: 0.7rem; flex-wrap: wrap; margin: 0.6rem 0 0.3rem; }
.ls-kurv-kort h4 { margin: 0.8rem 0 0.4rem; }
@media (max-width: 560px) {
  .ls-kurv-linje { grid-template-columns: 1fr auto auto; grid-template-areas: "navn qty fjern" "sum sum sum"; row-gap: 0.3rem; }
  .ls-kurv-navn { grid-area: navn; } .ls-kurv-qty { grid-area: qty; } .ls-kurv-fjern { grid-area: fjern; }
  .ls-kurv-sum { grid-area: sum; text-align: right; }
  .ls-kurv-felt2 { grid-template-columns: 1fr; }
}

/* Messe: editérbar stykpris og fragtbeløb i kurven */
.ls-kurv-stkpris input.kp{width:96px;padding:.18rem .4rem;margin:0 .15rem;border:1px solid #cfd6df;border-radius:6px;font-size:.92rem}
#kurvForm [name="fragt"]{max-width:170px}

/* Besparelse ved mængderabat i kurven */
.ls-kurv-rabat{display:block;color:#b35a00;font-size:.78rem;font-weight:750;margin-top:.15rem}

/* Empty cart state */
.ls-kurv-empty {
  padding: 2.1rem 1rem 1.6rem;
  text-align: center;
}
.ls-kurv-empty-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 78px;
  height: 78px;
  border-radius: 50%;
  background: var(--ls-green, #3f9d2f);
  color: #fff;
  margin-bottom: 1.2rem;
}
.ls-kurv-empty-icon svg { width: 38px; height: 38px; }
.ls-kurv-kort .ls-kurv-empty-title {
  font-size: clamp(1.35rem, 3vw, 1.65rem);
  line-height: 1.35;
  font-weight: 400;
  color: var(--ls-navy, #16253f);
  margin: 0 0 0.65rem;
}
.ls-kurv-empty-text {
  max-width: 430px;
  margin: 0 auto 1.65rem;
  color: #637284;
  line-height: 1.65;
  font-size: 0.96rem;
}
/* The empty-cart CTA uses the shared .btn .btn--primary styling. */
@media (max-width: 560px) {
  .ls-kurv-empty { padding: 1.8rem 0.3rem 1.1rem; }
  .ls-kurv-empty-icon { width: 68px; height: 68px; }
  .ls-kurv-empty-cta { width: 100%; }
}


/* Populated cart: product previews, controls and bundle suggestion */
.ls-kurv-linjer { gap: 0; margin: 0.8rem 0; }
.ls-kurv-actions { display: contents; }
.ls-kurv-fjern-tekst { display: none; }
.ls-kurv-linje {
  grid-template-columns: 74px minmax(0, 1fr) auto auto 28px;
  gap: 0.8rem;
  padding: 1rem 0;
  align-items: center;
}
.ls-kurv-billede {
  width: 74px;
  height: 74px;
  overflow: hidden;
  border: 1px solid #e7ebf0;
  border-radius: 10px;
  background: #f3f5f8;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ls-kurv-billede img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ls-kurv-billede-tom { color: #8492a3; font-size: 0.65rem; text-align: center; }
.ls-kurv-navn b { font-size: 0.95rem; color: var(--ls-navy, #16253f); }
/* Compact quantity control: matches the existing .btn--sm Rediger button's height.
   Keep Rediger unchanged; reduce the size of this three-part control. */
.ls-kurv-qty {
  width: 106px;
  height: 32px;
  box-sizing: border-box;
  border: 2px solid var(--btn-primary, #ef7d00);
  border-radius: var(--btn-radius, 8px);
  background: #fff;
  overflow: hidden;
}
.ls-kurv-qty .km {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  padding: 0;
  box-sizing: border-box;
  border: 0;
  border-radius: 0;
  background: #fff;
  color: var(--btn-primary, #ef7d00);
  cursor: pointer;
  transition: background-color 0.15s, color 0.15s;
}
.ls-kurv-qty .km svg {
  display: block;
  width: 16px;
  height: 16px;
  flex: none;
}
.ls-kurv-qty .km:hover { background: #fff5e9; color: var(--btn-primary-hover, #d96f00); }
.ls-kurv-qty .km:active { background: #ffecd7; }
.ls-kurv-qty .km:focus-visible { outline: 2px solid var(--btn-primary, #ef7d00); outline-offset: -2px; }
.ls-kurv-qty .ki {
  flex: 1 1 0;
  min-width: 0;
  width: 46px;
  height: 28px;
  padding: 0 2px;
  box-sizing: border-box;
  border: 0;
  border-left: 1px solid #f4bb80;
  border-right: 1px solid #f4bb80;
  border-radius: 0;
  text-align: center;
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--ls-navy, #16253f);
  background: #fff;
}
.ls-kurv-qty .ki:focus { outline: 2px solid var(--btn-primary, #ef7d00); outline-offset: -2px; }
.ls-kurv-sum { text-align: right; font-size: 0.95rem; font-weight: 700; color: var(--ls-navy, #16253f); }
.ls-kurv-fjern { font-size: 1.35rem; border-radius: 6px; }
.ls-kurv-fjern:hover { background: #fff1ef; }
.ls-kurv-bundle {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
  width: 100%;
  padding: 0.65rem 0.85rem;
  border: 1px solid #f5ca9d;
  border-radius: 9px;
  background: #fff7ef;
  color: #874500;
  text-align: left;
  font: inherit;
  font-size: 0.82rem;
  line-height: 1.4;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.ls-kurv-bundle:hover { background: #ffecd7; border-color: #ef7d00; }
.ls-kurv-bundle:focus-visible { outline: 2px solid #ef7d00; outline-offset: 2px; }
.ls-kurv-bundle-tekst strong { color: #ab5700; }
/* Tilføj tilbud action – target the right-hand element */
/* The offer remains a single button; its final span is the visible action. */
.ls-kurv-linje .ls-kurv-bundle > span:last-child {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  white-space: nowrap;
  padding: 0.45rem 0.7rem;
  border: 0;
  border-radius: 7px;
  background-color: #ef7d00 !important;
  color: #fff !important;
  font-size: 0.78rem;
  font-weight: 400;
  line-height: 1.2;
}
.ls-kurv-linje .ls-kurv-bundle:hover > span:last-child { background-color: #d96f00 !important; color: #fff !important; }
@media (max-width: 560px) {
  .ls-kurv-bundle { flex-wrap: wrap; }
  .ls-kurv-linje .ls-kurv-bundle > span:last-child { margin-left: auto; }
}
@media (max-width: 700px) {
  /* Image and long title share the first row; controls and total use full modal width. */
  .ls-kurv-linje {
    grid-template-columns: 64px minmax(0, 1fr);
    grid-template-areas: "image navn" "actions actions" "bundle bundle";
    gap: 0.75rem 0.7rem;
    align-items: start;
  }
  .ls-kurv-billede { grid-area: image; width: 64px; height: 64px; }
  .ls-kurv-navn { grid-area: navn; min-width: 0; overflow-wrap: anywhere; }
  .ls-kurv-navn b { white-space: normal; overflow-wrap: anywhere; }
  .ls-kurv-actions {
    grid-area: actions;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    min-width: 0;
    width: 100%;
  }
  .ls-kurv-actions > .ls-kurv-qty,
  .ls-kurv-actions > .ls-kurv-rediger { order: 1; flex: none; }
  .ls-kurv-actions > .ls-kurv-fjern {
    order: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    width: auto;
    min-height: 32px;
    height: 32px;
    padding: 0.3rem 0.7rem;
    border: 2px solid #c0392b;
    border-radius: var(--btn-radius, 8px);
    background: #fff;
    color: #c0392b;
    font: inherit;
    font-size: 0.85rem;
    font-weight: 600;
    line-height: 1.2;
  }
  .ls-kurv-fjern-tekst { display: inline; }
  .ls-kurv-actions > .ls-kurv-fjern:hover { background: #fff1ef; }
  .ls-kurv-actions > .ls-kurv-fjern:focus-visible { outline: 2px solid #c0392b; outline-offset: 2px; }
  .ls-kurv-actions > .ls-kurv-sum {
    order: 3;
    margin-left: auto;
    text-align: right;
    min-width: 0;
  }
  .ls-kurv-bundle { grid-area: bundle; grid-column: 1 / -1; }
}
@media (max-width: 400px) {
  .ls-kurv-kort { width: 96vw; }
  .ls-kurv-linje { grid-template-columns: 58px minmax(0,1fr); }
  .ls-kurv-billede { width: 58px; height: 58px; }
}

/* Checkout details – scoped to the cart form */
#kurvForm { display: flex; flex-direction: column; gap: 0.85rem; }
#kurvForm .ls-kurv-felt2 { gap: 0.85rem; }
#kurvForm label { display: flex; flex-direction: column; gap: 0.35rem; min-width: 0; font-size: 0.88rem; font-weight: 650; color: var(--ls-navy, #16253f); }
#kurvForm input:not(.ki):not(.kp), #kurvForm textarea, #kurvForm select {
  width: 100%; min-width: 0; box-sizing: border-box; padding: 0.72rem 0.85rem;
  border: 1px solid #d6dde5; border-radius: 9px; background-color: #fff;
  color: var(--ls-navy, #16253f); font: inherit; font-size: 0.95rem; font-weight: 400;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
#kurvForm input:not(.ki):not(.kp):focus, #kurvForm textarea:focus, #kurvForm select:focus {
  outline: none; border-color: var(--ls-green, #3f9d2f); box-shadow: 0 0 0 3px rgba(63, 157, 47, 0.13);
}
#kurvForm input::placeholder, #kurvForm textarea::placeholder { color: #94a0ad; }
#kurvForm textarea { resize: vertical; }
#kurvForm .messe-only[hidden] { display: none; }
#kurvForm .ls-kurv-messe-rad:not(:has(> .messe-only:not([hidden]))) { display: none; }
#kurvForm .ls-kurv-messe-rad { align-items: start; }
#kurvForm select[name="fakturaAar"] {
  appearance: none; -webkit-appearance: none; cursor: pointer; padding-right: 2.6rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2316253f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 0.85rem center; background-size: 18px 18px;
}
#kurvForm [name="fragt"] { max-width: none; }
.ls-kurv-footer .ls-kurv-send { display: flex; gap: 0.7rem; flex-wrap: wrap; margin: 0.55rem 0 0.3rem; }
/* Checkout action buttons inherit their appearance from buttons.css. */
@media (max-width: 560px) {
  #kurvForm .ls-kurv-felt2 { grid-template-columns: 1fr; }
  .ls-kurv-footer .ls-kurv-send { flex-direction: column; }
  .ls-kurv-footer .ls-kurv-send button { width: 100%; }
}

/* Valgt farve i kurven */
.ls-kurv-farve{display:block;color:#5b6b7d;font-size:.82rem}

/* Colour chip beside the selected colour in the cart */
.ls-kurv-farve { display: flex; align-items: center; gap: .38rem; flex-wrap: wrap; }
.ls-kurv-farveprik { display: inline-block; width: 13px; height: 13px; flex: 0 0 13px; border-radius: 50%; background: var(--kurv-farve, #ddd); border: 1px solid rgba(0,0,0,.18); box-shadow: 0 0 0 1px rgba(255,255,255,.7) inset; }
.ls-kurv-farveprik.ukendt { background: repeating-linear-gradient(45deg,#ddd 0 3px,#aaa 3px 6px); }

/* Colour quantity allocation modal */
.ls-fordeling-overlay[hidden]{display:none!important}
.ls-fordeling-overlay{position:fixed;inset:0;z-index:100200;display:flex;align-items:center;justify-content:center;padding:1rem}
.ls-fordeling-backdrop{position:absolute;inset:0;background:rgba(12,24,37,.58)}
.ls-fordeling-kort{position:relative;background:#fff;border-radius:14px;width:min(100%,480px);max-height:90dvh;overflow:auto;box-shadow:0 18px 60px rgba(0,0,0,.22);padding:1.3rem}
/* Keep the colour / bundle dialog slightly narrower than the cart on phones. */
@media (max-width: 560px) {
  .ls-fordeling-kort {
    box-sizing: border-box;
    width: calc(100% - 0.5rem);
  }
}
.ls-fordeling-head{display:flex;justify-content:space-between;align-items:center;gap:1rem}
.ls-fordeling-head h3{font-size:1.17rem;margin:0;color:#16253f}
.ls-fordeling-luk{background:transparent;border:0;font-size:1.6rem;cursor:pointer;color:#64748b}
.ls-fordeling-hjaelp{font-size:.88rem;color:#64748b;margin:.5rem 0 1rem}
.ls-fordeling-liste{display:flex;flex-direction:column;gap:.15rem}
.ls-fordeling-rad{display:flex;gap:.65rem;align-items:center;padding:.55rem 0;border-bottom:1px solid #eef1f5}
.ls-fordeling-prik{width:22px;height:22px;border-radius:50%;flex:0 0 22px;background:var(--sw,#ddd);border:1px solid #abb2bc}
.ls-fordeling-prik.ukendt{background:repeating-linear-gradient(45deg,#ddd 0 3px,#aaa 3px 6px)}
.ls-fordeling-navn{flex:1;min-width:0;font-size:.9rem}
.ls-fordeling-rad button{width:32px;height:32px;border:1px solid #d6dde5;border-radius:7px;background:#fff;cursor:pointer;font-size:1.1rem}
.ls-fordeling-rad button:disabled{opacity:.4;cursor:not-allowed}
.ls-fordeling-antal{min-width:24px;text-align:center;font-weight:700;font-variant-numeric:tabular-nums}
.ls-fordeling-foot{display:flex;align-items:center;justify-content:space-between;gap:.8rem;flex-wrap:wrap;padding-top:1rem}
/* On phones, keep the quantity status above a full-width save button. */
@media (max-width: 560px) {
  .ls-fordeling-foot {
    flex-direction: column;
    align-items: stretch;
    flex-wrap: nowrap;
  }
  .ls-fordeling-foot .ls-fordeling-status {
    width: 100%;
    min-width: 0;
  }
  .ls-fordeling-foot > button,
  .ls-fordeling-foot > .btn {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    flex: none;
  }
}
.ls-fordeling-status{font-size:.82rem;color:#64748b}
/* The colour modal save and cart edit actions use the shared .btn variants. */
.ls-kurv-totalstk{display:block;color:#7a8796;font-weight:400;font-size:.77rem}
/* Cart edit button is positioned by .ls-kurv-actions at mobile widths. */

/* Compact, responsive layout for multiple selected colours in a single cart product. */
.ls-kurv-farver-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(92px, max-content));
  column-gap: 0.95rem;
  row-gap: 0.35rem;
  margin: 0.45rem 0 0.35rem;
  max-width: 100%;
}
.ls-kurv-farver-grid .ls-kurv-farve {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  flex-wrap: nowrap;
  white-space: nowrap;
}
@media (max-width: 560px) {
  .ls-kurv-farver-grid {
    grid-template-columns: repeat(auto-fit, minmax(85px, max-content));
    column-gap: 0.65rem;
  }
}


/* ============================================================
   Checkout flow: cart and customer details (two modal stages)
   ============================================================ */

/* Keep the existing shared button design; only control layout here. */
#kurv-footer-kurv .ls-kurv-send,
#kurv-footer-oplysninger .ls-kurv-send {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
}
#kurv-footer-kurv .ls-kurv-send > .btn,
#kurv-footer-oplysninger .ls-kurv-send > .btn { flex: 1 1 190px; min-width: 0; }
#kurv-til-bestilling:disabled { opacity: 0.5; cursor: not-allowed; }

/* Back navigation on the details stage. */
.ls-kurv-retur {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  margin: 0.95rem 0 0.45rem;
  padding: 0.3rem 0;
  border: 0;
  background: transparent;
  color: var(--ls-navy, #16253f);
  font: inherit;
  font-size: 0.88rem;
  font-weight: 650;
  cursor: pointer;
}
.ls-kurv-retur:hover { text-decoration: underline; }
.ls-kurv-retur:focus-visible { outline: 2px solid #ef7d00; outline-offset: 3px; }

/* Compact order overview underneath the customer form. */
.ls-kurv-opsummering {
  margin-top: 1.6rem;
  padding-top: 1.1rem;
  border-top: 1px solid #e6ebf0;
}
.ls-kurv-opsummering > h4 { margin: 0 0 0.6rem; }
.ls-kurv-opsummering-linjer { display: flex; flex-direction: column; }
.ls-kurv-opsummering-linje {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: center;
  padding: 0.7rem 0;
  border-bottom: 1px solid #eef1f5;
}
.ls-kurv-opsummering-billede {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  overflow: hidden;
  border: 1px solid #e7ebf0;
  border-radius: 8px;
  background: #f3f5f8;
}
.ls-kurv-opsummering-billede img { width: 100%; height: 100%; display: block; object-fit: cover; }
.ls-kurv-opsummering-billede-tom { font-size: 0.63rem; line-height: 1.3; text-align: center; color: #8492a3; }
.ls-kurv-opsummering-info { min-width: 0; display: flex; flex-direction: column; gap: 0.18rem; }
.ls-kurv-opsummering-info > strong { font-size: 0.89rem; line-height: 1.3; overflow-wrap: anywhere; color: var(--ls-navy, #16253f); }
.ls-kurv-opsummering-antal,
.ls-kurv-opsummering-farver { font-size: 0.78rem; color: #637284; line-height: 1.35; overflow-wrap: anywhere; }
.ls-kurv-opsummering-pris { font-size: 0.9rem; white-space: nowrap; color: var(--ls-navy, #16253f); text-align: right; }
.ls-kurv-opsummering-total { padding: 0.75rem 0 0.15rem; }
.ls-kurv-opsummering-rad { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding: 0.25rem 0; font-size: 0.87rem; color: #637284; }
.ls-kurv-opsummering-rad > :last-child { white-space: nowrap; text-align: right; }
/* Matching total amount rows on both checkout stages. */
.ls-kurv-i-alt {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  min-width: 0;
  font-size: 1.1rem;
  font-weight: 400;
  line-height: 1.4;
  color: #000;
}
.ls-kurv-i-alt > span:first-child { min-width: 0; }
.ls-kurv-i-alt > span:last-child { flex: none; white-space: nowrap; text-align: right; font: inherit; color: inherit; }
.ls-kurv-opsummering-i-alt { padding-top: 0.65rem; }

/* Smaller screens: keep the form and order overview scrollable, not the buttons. */
@media (max-width: 560px) {
  /* Almost full height on smaller phones, capped on taller phones. */
  .ls-kurv-kort { max-height: min(94dvh, 760px); }
  #kurv-footer-kurv .ls-kurv-send,
  #kurv-footer-oplysninger .ls-kurv-send { flex-direction: column; }
  #kurv-footer-kurv .ls-kurv-send > .btn,
  #kurv-footer-oplysninger .ls-kurv-send > .btn { width: 100%; flex: 0 0 auto; }
  .ls-kurv-opsummering-linje { grid-template-columns: 46px minmax(0, 1fr) auto; gap: 0.55rem; }
  .ls-kurv-opsummering-billede { width: 46px; height: 46px; }
  .ls-kurv-opsummering-pris { font-size: 0.82rem; }
  #kurv-footer-oplysninger .ls-kurv-kontakt-info { display: none; }
  /* On mobile, keep only the actions and any submission status. */
  #kurv-footer-oplysninger > p.muted.small { display: none; }
}
@media (max-height: 580px) {
  .ls-kurv-kort { max-height: min(98dvh, 760px); }
  .ls-kurv-footer { padding-top: 0.55rem; padding-bottom: 0.6rem; }
}

/* Consistent outline SVG sizing in cart and colour-selection modals. */
.ls-modal-luk svg,
.ls-fordeling-luk svg {
  display: block;
  width: 20px;
  height: 20px;
}
.ls-kurv-fjern {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
}
.ls-kurv-fjern svg { display: block; width: 18px; height: 18px; }
.ls-kurv-retur { gap: 0.45rem; }
.ls-kurv-retur svg { display: block; width: 18px; height: 18px; flex: none; }
.ls-fordeling-luk { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 0; }

/* Narrow screens: disable legacy grid-area assignments now that controls are grouped. */
@media (max-width: 560px) {
  .ls-kurv-linje {
    grid-template-columns: 64px minmax(0, 1fr);
    grid-template-areas: "image navn" "actions actions" "bundle bundle";
    row-gap: 0.75rem;
  }
  .ls-kurv-actions > .ls-kurv-qty,
  .ls-kurv-actions > .ls-kurv-rediger,
  .ls-kurv-actions > .ls-kurv-fjern,
  .ls-kurv-actions > .ls-kurv-sum { grid-area: auto; justify-self: auto; }
}
@media (max-width: 400px) {
  .ls-kurv-linje { grid-template-columns: 58px minmax(0, 1fr); }
}

/* EAN / Faktura switch for optional invoicing identification. */
.ls-kurv-faktura-felt { display: flex; flex-direction: column; gap: 0.4rem; min-width: 0; }
.ls-kurv-faktura-overskrift,
#kurvForm .ls-kurv-faktura-felt > label { font-size: 0.88rem; font-weight: 650; color: var(--ls-navy, #16253f); }
.ls-kurv-faktura-valg { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.3rem; padding: 0.25rem; border-radius: 10px; background: #f3f5f8; }
.ls-kurv-faktura-valgknap { min-height: 36px; border: 1px solid transparent; border-radius: 8px; background: transparent; font: inherit; font-size: 0.89rem; font-weight: 600; color: #637284; cursor: pointer; }
.ls-kurv-faktura-valgknap[aria-pressed="true"] { background: #fff; border-color: #d6dde5; color: var(--ls-navy, #16253f); box-shadow: 0 1px 3px rgba(0,0,0,0.07); }
.ls-kurv-faktura-valgknap:focus-visible { outline: 2px solid var(--btn-primary, #ef7d00); outline-offset: 2px; }
.ls-kurv-faktura-hjaelp { font-size: 0.78rem; line-height: 1.4; color: #637284; }

/* Explanation shown only when a cart product requires an order note. */
#kurvForm .ls-kurv-bemaerkning-hjaelp {
  display: block;
  margin-top: 0.1rem;
  color: #637284;
  font-size: 0.78rem;
  line-height: 1.4;
  font-weight: 400;
}
#kurvForm .ls-kurv-bemaerkning-hjaelp[hidden] { display: none !important; }

/* Customer-details inline validation */
.ls-kurv-overlinje .ls-kurv-paakraevet {
  margin: 0 0 0.1rem;
  color: #64748b;
  font-size: 0.78rem;
  font-weight: 400;
}
.ls-kurv-overlinje .ls-kurv-paakraevet > span { color: #ba3030; }
#kurvForm input[aria-invalid="true"],
#kurvForm select[aria-invalid="true"],
#kurvForm textarea[aria-invalid="true"] {
  border-color: #c0392b;
  box-shadow: 0 0 0 1px rgba(192,57,43,0.12);
}
/* Invalid fields keep a red border and focus ring, overriding the normal green focus style. */
#kurvForm input:not(.ki):not(.kp)[aria-invalid="true"]:focus,
#kurvForm textarea[aria-invalid="true"]:focus,
#kurvForm select[aria-invalid="true"]:focus {
  outline: none;
  border-color: #c0392b;
  box-shadow: 0 0 0 3px rgba(192, 57, 43, 0.16);
}

#kurvForm .ls-kurv-felt-fejl {
  display: block;
  margin-top: 0.1rem;
  color: #b42318;
  font-size: 0.78rem;
  line-height: 1.35;
  font-weight: 400;
}
#kurvForm .ls-kurv-faktura-felt > .ls-kurv-felt-fejl { margin-top: 0.35rem; }


/* Order / inquiry confirmation: presentation only; mailto and text remain unchanged. */
.ls-kurv-kort.ls-kurv-vis-kvittering > .ls-kurv-header { display: none; }
.ls-kurv-kort.ls-kurv-vis-kvittering > .ls-modal-luk { z-index: 1; }
.ls-kurv-kort.ls-kurv-vis-kvittering .ls-kurv-scroll { padding-top: 0; padding-bottom: 0; }
.ls-kurv-kort .ls-kurv-tak {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 2.1rem 1rem 1.6rem;
  text-align: center;
  font-weight: 400;
  color: var(--ls-navy, #16253f);
}
.ls-kurv-kort .ls-kurv-tak[hidden] { display: none !important; }
.ls-kurv-kvittering-ikon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 78px;
  height: 78px;
  border-radius: 50%;
  background: var(--ls-green, #3f9d2f);
  color: #fff;
  margin-bottom: 1.2rem;
}
.ls-kurv-kvittering-ikon svg { display: block; width: 38px; height: 38px; }
.ls-kurv-kort .ls-kurv-kvittering-titel {
  margin: 0 0 0.65rem;
  font-size: clamp(1.35rem, 3vw, 1.65rem);
  line-height: 1.35;
  font-weight: 400;
  color: var(--ls-navy, #16253f);
}
.ls-kurv-kort .ls-kurv-kvittering-tekst {
  max-width: 430px;
  margin: 0;
  color: #637284;
  line-height: 1.65;
  font-size: 0.96rem;
  font-weight: 400;
}
.ls-kurv-kort .ls-kurv-kvittering-tekst b { font-weight: 400; }
@media (max-width: 560px) {
  .ls-kurv-kort .ls-kurv-tak { padding: 1.8rem 0.3rem 1.1rem; }
  .ls-kurv-kvittering-ikon { width: 68px; height: 68px; }
}

/* Back-to-cart navigation and required-fields note share a row until space runs out. */
.ls-kurv-overlinje {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.2rem 0.9rem;
}
.ls-kurv-overlinje .ls-kurv-retur {
  flex: 0 0 auto;
  white-space: nowrap;
}
.ls-kurv-overlinje .ls-kurv-paakraevet {
  flex: 0 0 auto;
  margin: 0 0 0.45rem auto;
  white-space: nowrap;
  text-align: right;
}

/* Direct-contact alternative beneath the order overview. */
.ls-kurv-kontakt-kort {
  margin-top: 1rem;
  padding: 1rem 1.1rem;
  border: 1px solid #cfe8ce;
  border-radius: 10px;
  background: #f0f9ef;
  color: var(--ls-navy, #16253f);
}
.ls-kurv-kontakt-kort > p {
  margin: 0 0 0.7rem;
  font-size: 0.89rem;
  line-height: 1.5;
  font-weight: 400;
}
.ls-kurv-kontakt-links {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.55rem 1.4rem;
}
.ls-kurv-kontakt-links a {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  color: #28762b;
  font-size: 0.9rem;
  text-decoration: none;
  overflow-wrap: anywhere;
}
.ls-kurv-kontakt-links a:hover { text-decoration: underline; }
.ls-kurv-kontakt-links a:focus-visible { outline: 2px solid #28762b; outline-offset: 3px; }
.ls-kurv-kontakt-links svg { display: block; width: 19px; height: 19px; flex: none; }
/* The navigation/required-fields row belongs to the form, not the success state. */
.ls-kurv-kort.ls-kurv-vis-kvittering .ls-kurv-overlinje { display: none; }

/* Employee login remains inside the cart: no navigation and no cart reset. */
.ls-kurv-kort { position: relative; }
.ls-employee-bar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .7rem; padding: .6rem 1.5rem; border-bottom: 1px solid #eef1f5; font-size: .85rem; background: #f8fafc; }
.ls-employee-bar[hidden], .ls-employee-overlay[hidden], .ls-employee-bar button[hidden] { display: none !important; }
.ls-employee-overlay { position: absolute; z-index: 20; inset: 0; display: flex; align-items: center; justify-content: center; padding: 1rem; background: rgba(17, 30, 49, .55); }
.ls-employee-dialog { width: min(100%, 420px); max-height: 95%; overflow: auto; position: relative; background: #fff; border-radius: 14px; padding: 1.5rem; box-shadow: 0 12px 50px rgba(0,0,0,.2); }
.ls-employee-dialog h4 { margin: 0 0 .6rem; }
.ls-employee-dialog p { font-size: .9rem; line-height: 1.4; }
.ls-employee-dialog label { display: block; margin-top: .8rem; font-size: .88rem; }
.ls-employee-dialog input { display: block; margin-top: .25rem; padding: .55rem; border: 1px solid #cbd5e1; border-radius: 7px; }
.ls-employee-close { position: absolute; right: .8rem; top: .5rem; font-size: 1.7rem; background: none; border: 0; cursor: pointer; }
.ls-employee-buttons { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: .6rem; margin-top: 1.25rem; }

body.ls .ls-kurv-kort .ls-employee-buttons button.btn {
  flex: 1 1 0;
  min-width: 0;
  min-height: 38px;
  margin: 0;
  border-width: 2px;
  border-style: solid;
}
.ls-employee-error { color: #a42323; }
@media (max-width: 560px) { .ls-employee-bar { padding: .65rem 1.15rem; } }

/* ===== Taleordre (voice order) ===== */
.ls-taleordre-dialog { width: min(100%, 540px); max-height: 92%; overflow: auto; position: relative; background: #fff; border-radius: 14px; padding: 1.5rem; box-shadow: 0 12px 50px rgba(0,0,0,.2); }
.ls-taleordre-dialog h4 { margin: 0 0 .4rem; }
.ls-taleordre-hjaelp { font-size: .88rem; line-height: 1.45; color: #4a5560; margin: 0 0 1rem; }
.ls-taleordre-hjaelp em { color: #10233f; font-style: normal; font-weight: 600; }
.ls-taleordre-input-rad { display: flex; align-items: center; gap: .6rem; }
.ls-taleordre-tekst { flex: 1 1 auto; min-width: 0; padding: .6rem .7rem; border: 1px solid #cbd5e1; border-radius: 9px; font-size: .95rem; background: #fbfcfe; }
.ls-taleordre-tekst:focus { outline: none; border-color: #2fae4e; box-shadow: 0 0 0 3px rgba(47,174,78,.16); }
.ls-taleordre-mic { flex: 0 0 auto; width: 46px; height: 46px; border-radius: 50%; border: 1px solid #2fae4e; background: #eafaf0; color: #1f7a3d; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: background .15s, transform .1s; }
.ls-taleordre-mic svg { width: 22px; height: 22px; }
.ls-taleordre-mic:hover { background: #d9f5e4; }
.ls-taleordre-mic:disabled { opacity: .45; cursor: not-allowed; }
.ls-taleordre-mic.lytter { background: #e4362c; border-color: #e4362c; color: #fff; animation: taleordrePuls 1.3s infinite; }
@keyframes taleordrePuls { 0% { box-shadow: 0 0 0 0 rgba(228,54,44,.5); } 70% { box-shadow: 0 0 0 10px rgba(228,54,44,0); } 100% { box-shadow: 0 0 0 0 rgba(228,54,44,0); } }
.ls-taleordre-status { min-height: 1.1rem; margin: .55rem 0 .2rem; font-size: .84rem; color: #4a5560; }
.ls-taleordre-liste { display: flex; flex-direction: column; gap: .5rem; margin: .4rem 0 .2rem; }
.ls-taleordre-tom { font-size: .86rem; color: #8a97a5; margin: .2rem 0; }
.ls-taleordre-rad { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; padding: .5rem .6rem; border: 1px solid #e3e8ee; border-radius: 10px; background: #fafcff; }
.ls-taleordre-rad .to-beskrivelse { flex: 1 1 150px; min-width: 120px; padding: .45rem .55rem; border: 1px solid #cbd5e1; border-radius: 7px; font-size: .92rem; }
.ls-taleordre-felt { display: inline-flex; align-items: center; gap: .25rem; font-size: .82rem; color: #5b6b7d; }
.ls-taleordre-rad .to-antal { width: 62px; padding: .45rem .4rem; border: 1px solid #cbd5e1; border-radius: 7px; font-size: .92rem; text-align: right; }
.ls-taleordre-rad .to-pris { width: 92px; padding: .45rem .4rem; border: 1px solid #cbd5e1; border-radius: 7px; font-size: .92rem; text-align: right; }
.ls-taleordre-rad input:focus { outline: none; border-color: #2fae4e; box-shadow: 0 0 0 3px rgba(47,174,78,.14); }
.ls-taleordre-rad .to-fjern { margin-left: auto; width: 30px; height: 30px; border-radius: 7px; border: 1px solid #e3b7b4; background: #fff; color: #a42323; font-size: 1.2rem; line-height: 1; cursor: pointer; }
.ls-taleordre-rad .to-fjern:hover { background: #fdecec; }
/* Manual (voice-order) cart line tag */
.ls-kurv-taleordre-tag { display: inline-block; margin: .1rem 0 .15rem; padding: .08rem .4rem; border-radius: 6px; background: #eafaf0; color: #1f7a3d; font-size: .72rem; font-weight: 700; }
.ls-kurv-linje-manuel .ls-kurv-stkpris { color: #5b6b7d; }
@media (max-width: 560px) { .ls-taleordre-rad .to-beskrivelse { flex-basis: 100%; } }

/* ===== Taleordre: full-order dialog ===== */
.ls-taleordre-dialog--fuld { width: min(100%, 640px); max-height: 94%; }
.ls-taleordre-transcript { width: 100%; margin-top: .6rem; padding: .6rem .7rem; border: 1px solid #cbd5e1; border-radius: 9px; font-size: .92rem; line-height: 1.4; resize: vertical; background: #fbfcfe; font-family: inherit; }
.ls-taleordre-transcript:focus { outline: none; border-color: #2fae4e; box-shadow: 0 0 0 3px rgba(47,174,78,.16); }
.ls-taleordre-fortolk-rad { display: flex; gap: .5rem; margin: .5rem 0 .2rem; flex-wrap: wrap; }
.ls-taleordre-afsnit { margin-top: 1rem; border-top: 1px solid #eef1f5; padding-top: .8rem; }
.ls-taleordre-afsnit h5 { margin: 0 0 .5rem; font-size: .95rem; }
.ls-taleordre-afsnit #taleordre-tilfoej-vare { margin-top: .5rem; }
.ls-taleordre-kontakt { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem .7rem; }
.ls-taleordre-kontakt label { display: flex; flex-direction: column; font-size: .8rem; color: #4a5560; gap: .2rem; margin: 0; }
.ls-taleordre-kontakt label.ls-taleordre-bred { grid-column: 1 / -1; }
.ls-taleordre-kontakt input, .ls-taleordre-kontakt select { padding: .5rem .55rem; border: 1px solid #cbd5e1; border-radius: 7px; font-size: .92rem; background: #fff; font-family: inherit; }
.ls-taleordre-kontakt input:focus, .ls-taleordre-kontakt select:focus { outline: none; border-color: #2fae4e; box-shadow: 0 0 0 3px rgba(47,174,78,.14); }
.ls-taleordre-paakr { color: #c0362c; }
.ls-taleordre-succes { color: #1f7a3d; font-weight: 650; }
@media (max-width: 560px) { .ls-taleordre-kontakt { grid-template-columns: 1fr; } }

/* ===== B2B: separat faktureringsadresse i checkout ===== */
.ls-kurv-adr-overskrift { display: block; font-size: 0.88rem; font-weight: 650; color: var(--ls-navy, #16253f); margin: 0.2rem 0 -0.2rem; }
.ls-kurv-faktura-adresse { display: flex; flex-direction: column; gap: 0.5rem; padding: 0.8rem; border: 1px solid #e3e8ee; border-radius: 10px; background: #fafcff; }
.ls-kurv-faktura-adresse .ls-kurv-faktura-overskrift { margin-bottom: 0.1rem; }
.ls-kurv-checkbox { display: flex; align-items: center; gap: 0.5rem; font-size: 0.9rem; font-weight: 500; color: #4a5560; cursor: pointer; }
.ls-kurv-checkbox input { width: auto; margin: 0; }
#kurv-faktura-adresse-felter { display: flex; flex-direction: column; gap: 0.5rem; }