/* ===========================================================================
   IndustrieWert — cart, checkout, Angebotsliste, RFQ (directive §8.6, §8.7)
   Calm. Nothing moves beyond --t-fast feedback.
   =========================================================================== */
.com { padding-top: var(--s-6); }
.steps { list-style: none; display: flex; gap: var(--s-5); margin-bottom: var(--s-5); font-size: var(--fs-body-s); color: var(--c-ink-faint); flex-wrap: wrap; }
.steps li { display: flex; align-items: center; gap: var(--s-2); }
.steps li .t-spec { width: 24px; height: 24px; display: grid; place-items: center; border: var(--bw-hair) solid var(--c-grey-300); border-radius: 50%; font-size: var(--fs-caption); }
.steps li[aria-current] { color: var(--c-ink); font-weight: 600; }
.steps li[aria-current] .t-spec { background: var(--c-accent); border-color: var(--c-accent); color: var(--c-accent-ink); }

.com__layout { display: grid; gap: var(--s-7); grid-template-columns: minmax(0, 1fr) 340px; align-items: start; margin-top: var(--s-5); }
@media (max-width: 900px) { .com__layout { grid-template-columns: 1fr; gap: var(--s-5); } }
.com__main { display: flex; flex-direction: column; gap: var(--s-4); }
.com__side { position: sticky; top: calc(var(--h-header-compact) + var(--s-4)); display: flex; flex-direction: column; gap: var(--s-4); }
@media (max-width: 900px) { .com__side { position: static; } }
.com__empty { padding-block: var(--s-6); display: flex; flex-direction: column; gap: var(--s-3); align-items: flex-start; }
.com__done { max-width: 720px; display: flex; flex-direction: column; gap: var(--s-4); }

.note { padding: var(--s-3) var(--s-4); border: var(--bw-hair) solid var(--c-rule); border-left: var(--bw-emph) solid var(--c-industrial-900); font-size: var(--fs-body-s); margin-block: var(--s-3); }
.note--error { border-left-color: var(--c-error); color: var(--c-error); }
.note--warn { border-left-color: var(--c-warning); }

.line { display: grid; grid-template-columns: 96px minmax(0, 1fr) 80px 110px auto; gap: var(--s-4); align-items: center; padding: var(--s-4) 0; border-bottom: var(--bw-hair) solid var(--c-rule); }
@media (max-width: 700px) { .line { grid-template-columns: 72px minmax(0, 1fr); } .line__total, .line .qty, .line__actions { grid-column: 2; } .line__img { align-self: start; } }
.line__img { width: 96px; height: 72px; object-fit: cover; border: var(--bw-hair) solid var(--c-rule); background: var(--c-surface-alt); display: block; }
.line__body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.line__name { font-weight: 600; text-decoration: none; }
.line__name:hover { text-decoration: underline; }
.line__total { font-size: var(--fs-body-l); font-weight: 600; text-align: right; }
.line__actions { display: flex; flex-direction: column; gap: 6px; align-items: flex-end; }
.line__remove { background: none; border: 0; padding: 6px 0; color: var(--c-ink-faint); font-size: var(--fs-caption); cursor: pointer; text-decoration: underline; min-height: 32px; }
.line__remove:hover { color: var(--c-error); }
.js-motion .line [data-update] { display: none; }        /* quantities apply live once JS runs */
.qty input { width: 76px; min-height: 44px; padding: 8px; border: var(--bw-hair) solid var(--c-rule); border-radius: var(--r-1); text-align: center; font-family: var(--f-mono); }
.btn--small { min-height: 36px; padding: 6px var(--s-3); font-size: var(--fs-caption); }
.btn--block { width: 100%; }
.btn--big { min-height: 56px; font-size: var(--fs-body); padding-inline: var(--s-6); }

.sum { padding: var(--s-5); border: var(--bw-hair) solid var(--c-rule); display: flex; flex-direction: column; gap: var(--s-3); background: var(--c-surface); }
.sum--alt { background: var(--c-surface-alt); }
.sum__rows { margin: 0; display: flex; flex-direction: column; gap: 8px; }
.sum__rows div { display: flex; justify-content: space-between; gap: var(--s-3); font-size: var(--fs-body-s); }
.sum__rows dd { margin: 0; }
.sum__total { padding-top: var(--s-2); border-top: var(--bw-hair) solid var(--c-rule); font-weight: 700; font-size: var(--fs-body-l) !important; }
.sum__items { list-style: none; display: flex; flex-direction: column; gap: 6px; font-size: var(--fs-body-s); padding-bottom: var(--s-3); border-bottom: var(--bw-hair) solid var(--c-rule); }
.sum__items li { display: flex; justify-content: space-between; gap: var(--s-3); }
.sum__pay { color: var(--c-ink-faint); }

.ck { gap: var(--s-6); }
.ck__group { border: 0; padding: 0; margin: 0; display: flex; flex-direction: column; gap: var(--s-4); }
.ck__group legend { padding: 0; margin-bottom: var(--s-2); }
.ck__grid { display: grid; gap: var(--s-4); grid-template-columns: 1fr 1fr; }
@media (max-width: 600px) { .ck__grid { grid-template-columns: 1fr; } }
.ck__pay { padding: var(--s-4); border: var(--bw-hair) solid var(--c-rule); border-left: var(--bw-emph) solid var(--c-accent); }
.field { display: flex; flex-direction: column; gap: 6px; }
.field--full { grid-column: 1 / -1; }
.field--inline { flex-direction: row; align-items: center; gap: var(--s-2); }
.field--inline input { flex: 1; min-width: 0; }
.field > span { font-size: var(--fs-label); letter-spacing: var(--ls-label); text-transform: uppercase; font-weight: 600; color: var(--c-ink-muted); }
.field b { color: var(--c-error); font-weight: 600; }
.field input, .field select, .field textarea { padding: 12px var(--s-3); min-height: 46px; border: var(--bw-hair) solid var(--c-rule); border-radius: var(--r-1); background: var(--c-surface); font-size: var(--fs-body); }
.field textarea { min-height: auto; resize: vertical; }
.field small { font-size: var(--fs-caption); color: var(--c-ink-faint); }
.field em, .field__err { font-style: normal; font-size: var(--fs-caption); color: var(--c-error); }
.field.is-error input, .field.is-error select { border-color: var(--c-error); }
.check { display: flex; gap: var(--s-3); align-items: flex-start; font-size: var(--fs-body-s); line-height: 1.5; cursor: pointer; }
.check input { width: 20px; height: 20px; flex: 0 0 auto; margin-top: 2px; accent-color: var(--c-industrial-900); }
.check.is-error span { color: var(--c-error); }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.next { padding-left: 1.4em; display: flex; flex-direction: column; gap: var(--s-3); line-height: 1.6; }
.next--compact { gap: var(--s-2); font-size: var(--fs-body-s); }
.rfq__items { list-style: none; display: flex; flex-direction: column; gap: var(--s-3); }
.rfq__items li { display: flex; gap: var(--s-3); align-items: center; padding-bottom: var(--s-3); border-bottom: var(--bw-hair) solid var(--c-rule); }
.rfq__items li > div { flex: 1; min-width: 0; }
.rfq__items img { width: 72px; height: 54px; object-fit: cover; border: var(--bw-hair) solid var(--c-rule); }
.rfq__items a { font-weight: 600; text-decoration: none; }