/* Reststück-Finder – Zusatz-Styles (nur Tokens aus kit.css, keine festen Farben) */
.ic{display:inline-flex;vertical-align:-4px}
.back{margin:0 0 10px;padding-left:8px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* Rest-Karten */
.rgrid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
@media(max-width:480px){.rgrid{grid-template-columns:1fr 1fr;gap:10px}}
.rcard{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);cursor:pointer;display:flex;flex-direction:column;min-width:0;transition:border-color .12s,transform .12s}
.rcard:hover{border-color:var(--acc)}.rcard:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.rcard.dim{opacity:.7}
.fb{position:relative;aspect-ratio:4/3;background:var(--line-2);overflow:hidden}
.fb img{width:100%;height:100%;object-fit:cover;display:block}
.fb .ph{position:absolute;inset:0;display:grid;place-items:center;color:var(--mut);opacity:.6}
.fb .cnt{position:absolute;right:8px;bottom:8px;background:rgba(0,0,0,.6);color:#fff;border-radius:99px;padding:1px 9px;font-size:.75rem;font-weight:600}
.rc-b{padding:10px 12px 12px;display:flex;flex-direction:column;gap:2px;min-width:0}
.rc-b .t{font-weight:600;overflow-wrap:anywhere;line-height:1.3}.rc-b .m{color:var(--mut);font-size:.86rem;overflow-wrap:anywhere}
.rc-badges{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.nr{font-variant-numeric:tabular-nums;color:var(--mut);font-size:.78rem;font-weight:600;letter-spacing:.02em}

/* Filterleiste */
.filters{display:grid;gap:10px;grid-template-columns:2fr 1fr 1fr 1fr;align-items:end;margin-bottom:10px}
@media(max-width:860px){.filters{grid-template-columns:1fr 1fr}.filters .wide{grid-column:1/3}}
.filters label{margin-top:0}
.chips{margin-bottom:14px}
.chip{display:inline-flex;align-items:center}
.count{color:var(--mut);font-size:.88rem;margin:0 0 10px}

/* Suche & Treffer */
.hit{display:grid;grid-template-columns:132px 1fr;gap:14px;align-items:start}
@media(max-width:560px){.hit{grid-template-columns:96px 1fr;gap:12px}}
.hit .fb{border-radius:var(--r-s);aspect-ratio:1/1;border:1px solid var(--line)}
.hit h3{margin:0 0 2px;overflow-wrap:anywhere}
.hit .facts{color:var(--mut);font-size:.9rem}
.hit-wide{grid-column:1/3}
.why{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:4px;font-size:.9rem}
.why li{display:flex;gap:8px;align-items:flex-start;color:var(--fg)}.why li svg{flex:0 0 16px;margin-top:3px;color:var(--ok)}
.hit-foot{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:12px}
.hit-foot .after{flex:1 1 200px;color:var(--mut);font-size:.88rem}
.sketch{flex:0 0 auto;display:block}
.rej{display:flex;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line-2)}.rej:last-child{border-bottom:0}
.rej .fb{flex:0 0 52px;aspect-ratio:1/1;border-radius:8px}.rej .why-not{color:var(--bad);font-size:.86rem}
details.more{margin:14px 0}details.more>summary{cursor:pointer;font-weight:600;padding:10px 0;min-height:44px;display:flex;align-items:center}
.adv{border:1px solid var(--line);border-radius:var(--r-s);padding:0 14px;margin:14px 0 4px}.adv[open]{padding-bottom:12px}.adv>summary{cursor:pointer;font-weight:600;min-height:44px;display:flex;align-items:center;color:var(--mut)}

/* Detailseite */
.gal{display:grid;gap:10px;grid-template-columns:1fr}
.gal .main{aspect-ratio:4/3;border-radius:var(--r);overflow:hidden;background:var(--line-2);border:1px solid var(--line);cursor:zoom-in;position:relative;width:100%;padding:0}
.gal .main img{width:100%;height:100%;object-fit:cover;display:block}
.thumbs{display:flex;gap:8px;flex-wrap:wrap}
.thumbs .th{position:relative;width:64px;height:64px;border-radius:var(--r-s);overflow:hidden;border:2px solid var(--line);padding:0;min-height:0;background:var(--line-2)}.thumbs .th.on{border-color:var(--acc)}.thumbs .th img{width:100%;height:100%;object-fit:cover;display:block}
.detail{display:grid;gap:16px;grid-template-columns:minmax(0,420px) 1fr;align-items:start}
@media(max-width:860px){.detail{grid-template-columns:1fr}}
.kv{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;margin:0}.kv dt{color:var(--mut);font-size:.88rem}.kv dd{margin:0;font-weight:500;overflow-wrap:anywhere}
.big-size{font-size:1.6rem;font-weight:700;letter-spacing:-.02em;line-height:1.15}
.toolbar{display:flex;gap:8px;flex-wrap:wrap}
.pos{display:grid;grid-template-columns:72px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--line-2)}.pos:last-child{border-bottom:0}
.pos .fb{border-radius:var(--r-s);aspect-ratio:1/1;border:1px solid var(--line)}
.pos .acts-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.pos .t{font-weight:600;overflow-wrap:anywhere}.pos .m{color:var(--mut);font-size:.88rem;overflow-wrap:anywhere}
.feed{list-style:none;margin:0;padding:0}
.feed li{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid var(--line-2);align-items:flex-start}.feed li:last-child{border-bottom:0}
.feed .dot{flex:0 0 30px;height:30px;border-radius:50%;background:var(--acc-2);color:var(--acc);display:grid;place-items:center}
.feed .tx{flex:1;min-width:0;overflow-wrap:anywhere}.feed .when{color:var(--mut);font-size:.8rem;display:block;margin-top:1px}
.feed li.click{cursor:pointer;margin:0 -8px;padding:10px 8px;border-radius:var(--r-s)}.feed li.click:hover{background:var(--line-2)}
.due{white-space:nowrap}

/* Einrichten */
.list-edit .item{padding:10px 0}.list-edit .item .acts-row{display:flex;gap:6px}
.steps{counter-reset:s;list-style:none;margin:0;padding:0;display:grid;gap:12px}
.steps li{counter-increment:s;display:flex;gap:12px;align-items:flex-start}.steps li::before{content:counter(s);flex:0 0 28px;height:28px;border-radius:50%;background:var(--acc);color:var(--acc-fg);display:grid;place-items:center;font-weight:700;font-size:.9rem}

/* Etikett (Druck) */
.label-sheet{border:2px solid var(--fg);border-radius:12px;padding:16px;display:grid;gap:4px;max-width:360px;margin:0 auto 6px;background:var(--surface);color:var(--fg)}
.label-sheet .lnr{font-size:2.4rem;font-weight:800;letter-spacing:.03em;line-height:1}
.label-sheet .lt{font-size:1.15rem;font-weight:700}.label-sheet .ls{font-size:1.5rem;font-weight:700}
.label-sheet .lm{color:var(--mut)}
body.print-label > *:not(.modal-bg){display:none!important}
@media print{
  body.print-label .modal-bg{position:static;background:none;padding:0;display:block}
  body.print-label .modal{box-shadow:none;width:auto;padding:0;max-height:none;overflow:visible}
  body.print-label .modal h2,body.print-label .modal .acts{display:none!important}
  body.print-label .label-sheet{border-color:#000;color:#000;background:#fff}body.print-label .label-sheet .lm{color:#333}
  .shell .content{padding:0}.banner{display:none}.page-h .acts{display:none}
  .pos .acts-row,.toolbar{display:none!important}
}

/* Kundenseite */
.public{padding-top:12px}
.public .p-head{display:flex;align-items:center;gap:12px;margin:6px 0 18px}
.public .p-head i{flex:0 0 44px;height:44px;border-radius:12px;background:var(--acc);color:var(--acc-fg);display:grid;place-items:center;font-style:normal;font-weight:800;font-size:1.05rem}
.public .p-head b{font-size:1.1rem;display:block;line-height:1.2}.public .p-head span{color:var(--mut);font-size:.88rem}
.public h1{font-size:1.45rem}
.public .p-item{display:grid;grid-template-columns:104px 1fr;gap:14px;align-items:start}
@media(max-width:420px){.public .p-item{grid-template-columns:84px 1fr}}
.public .p-item .fb{border-radius:var(--r-s);aspect-ratio:1/1;border:1px solid var(--line)}
.public .p-item .t{font-weight:700;font-size:1.05rem;overflow-wrap:anywhere}
.public .p-size{font-size:1.25rem;font-weight:700;margin:2px 0}
.public .p-foot{color:var(--mut);font-size:.85rem;text-align:center;margin-top:20px}
.public .big{min-height:52px;width:100%;font-size:1.05rem}
.p-err{text-align:center;padding:40px 16px}.p-err svg{width:48px;height:48px;color:var(--mut);margin-bottom:10px}

/* Mobil: Kopfzeile darf die Seite nicht aufweiten */
@media(max-width:860px){.shell{grid-template-columns:minmax(0,1fr)}}
@media(max-width:560px){.shell>header.top .muted{display:none}.shell>header.top .nm{max-width:84px!important}}
@media(max-width:560px){.item{flex-wrap:wrap}.item .grow{flex:1 1 150px}.shell>header.top .nm{display:none}}
