/* Z5b redizajn V6.2 (3D_V3/PLAN-DALSIA-FAZA/REDIZAJN-V6-2/PLAN.md časť 5): detail objednávky zákazníka (pás kľúčových údajov, ďalší krok, priebeh, doručenie a platba).
   Súbor založil a v web/index.html pripojil R1 iba s touto hlavičkou; pravidlá píše vlastník balíka, tokeny sú v tokens-v62.css. */
/* Z5b-1 pravidlá (prototyp .kvrow 697 až 699 a dlaždice .v62-tile z R5, .callout 327 a 328, .bind 969; snimky/v62-03 a v62-04): hlavička
   detailu zákazníka so stavom a dlaždicami kľúčových údajov, pás Ponuka platí do a pás Ďalší krok. Okraj pásu ponuky #f1dfb8 je odtieň V6.2. */
/* U8-4b F2 a F3 (K9-G23-68): stav a dlaždice majú odstup od rámu hlavičky ako priebeh pod nimi. Pod 560 px dlaždice nie sú posuvný
   pás .v62-tiles (ten ostáva v zoznamoch), ale dva stĺpce: termíny cez celý riadok, cena a doprava vedľa seba, nič sa neoreže. */
.customer-detail-head .customer-detail-status{margin-bottom:var(--space-2);padding:var(--space-3) var(--space-4) 0}
.customer-detail-head>.customer-detail-keys{display:grid;padding:0 var(--space-4) var(--space-3);overflow:visible}
@media(max-width:699px){.customer-detail-head>:is(.customer-detail-status,.customer-detail-keys){padding-inline:var(--space-3)}}
@media(max-width:560px){
 .customer-detail-head>.customer-detail-keys{grid-template-columns:repeat(2,minmax(0,1fr))}
 .customer-detail-keys>.customer-detail-key:has(~.customer-detail-key-price){grid-column:1/-1}
}
.customer-detail-key{gap:4px}
.customer-detail-key-value{color:var(--ink);font-size:var(--text-md);font-weight:600;line-height:1.35;overflow-wrap:anywhere}
.customer-detail-key-price .product-price-compact{gap:1px}
/* U8-4b (K9-G23-68): v polovičnej dlaždici sa podpis ceny nezlomí pred posledným slovom (Bez a DPH), ale za bodkou; bez podpory ako doteraz. */
.customer-detail-key-price .product-price-compact>small{text-wrap:pretty}
.customer-detail-offer{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:0 0 var(--space-3);padding:14px 16px;border:1px solid #f1dfb8;border-radius:var(--radius-lg);background:var(--surface);box-shadow:0 0 0 3px var(--amber-bg)}
.customer-detail-offer-icon{display:flex;align-items:center;justify-content:center;flex:0 0 auto;width:40px;height:40px;border-radius:var(--radius);background:var(--amber-bg);color:var(--amber)}
.customer-detail-offer>strong{flex:1 1 220px;min-width:0;font-size:var(--text-md)}
.customer-detail-next{display:flex;align-items:flex-start;gap:8px;margin:0 0 var(--space-3);padding:9px 12px;border:1px solid var(--accent-line);border-radius:var(--radius-control);background:var(--blue-bg);color:var(--ink-2);font-size:var(--text-sm);line-height:1.45}
.customer-detail-next>.icon{flex:0 0 auto;margin-top:2px;color:var(--blue)}
@media(max-width:699px){.customer-detail-offer>.btn{width:100%;min-height:44px}}
/* Z5b-3 okno prijatia ponuky (views.js:254, prototyp cacceptModal .kvrow 697 až 699): prehľad ponuky a dopravy nad cenou; poradie obsahu ostáva. */
#portal-modal form[data-submit="accept"] .accept-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px 14px;margin:0}
#portal-modal form[data-submit="accept"] .accept-summary>div{display:flex;flex-direction:column;gap:1px;min-width:0}
#portal-modal form[data-submit="accept"] .accept-summary dt{color:var(--muted);font-size:var(--text-xs)}
#portal-modal form[data-submit="accept"] .accept-summary dd{margin:0;font-size:var(--text-md);font-weight:600;overflow-wrap:anywhere}
/* Z5b-2 súhrn detailu zákazníka (prototyp .kvlist 365 až 367, .cap 35, panely Doručenie a Správy; snimky/v62-04): iba vzhľad pod
   .customer-detail-head~.stack, teda len na detaile zákazníka; značky, texty a ceny súhrnu sa nemenia, tím má vlastný detail. */
.customer-detail-head~.stack .order-part h3{font-size:var(--text-md);font-weight:700}
.customer-detail-head~.stack .order-detail-grid>aside .panel-body>strong{font-size:var(--text-md)}
.customer-detail-head~.stack .order-detail-grid>aside .panel-body h3{margin:12px 0 4px;color:var(--muted);font-size:var(--text-xs);font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.customer-detail-head~.stack .order-detail-grid>aside .panel-body p{margin:0;font-size:var(--text-sm);line-height:1.45;overflow-wrap:anywhere}
.customer-detail-head~.stack .order-message{margin:0;padding:8px 0;border-bottom:1px solid var(--line-soft)}
.customer-detail-head~.stack .order-message>div{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 8px;color:var(--muted);font-size:var(--text-xs)}
.customer-detail-head~.stack .order-message>div>strong{color:var(--ink);font-size:var(--text-sm)}
.customer-detail-head~.stack .order-message>p{margin:4px 0 0;font-size:var(--text-sm);overflow-wrap:anywhere}
/* U8-4b F1 (K9-G23-68): pod 900 px je súhrn jeden stĺpec a Platba by bola posledná, pod tlačidlom prijatia. Stĺpce sa rozpustia
   (display:contents) a Platba ide hneď za Modely, nad panel Ponuka; značky, poradie v DOM a dva stĺpce nad 900 px ostávajú. */
@media(max-width:899px){
 .order-detail-grid:has(>aside>.customer-detail-payment){gap:var(--space-3)}
 .order-detail-grid:has(>aside>.customer-detail-payment)>.stack{display:contents}
 .order-detail-grid:has(>aside>.customer-detail-payment)>div.stack>:first-child{order:-2}
 .order-detail-grid:has(>aside>.customer-detail-payment)>aside>.customer-detail-payment{order:-1}
}
/* Z5b-4 priebeh piatich krokov v hlavičke nad počtami kusov (prototyp .track, snimky/v62-04): hotový krok zelený s fajkou, aktuálny modrý
   s číslom, ďalší sivý; spojnica od bodky po bodku ďalšieho kroku. Päť stĺpcov aj pri 375 px, popis sa láme, stránka sa neposúva do strany.
   Panel Platba v pravom stĺpci dedí pravidlá .order-detail-grid .panel-body>.product-price-summary (order-detail-tabs.css). */
.customer-detail-track{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin:0;list-style:none}
.customer-detail-track{padding:var(--space-3) var(--space-4);border-top:1px solid var(--line-soft)}
.customer-detail-track>li{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0}
.customer-detail-track>li:not(:last-child)::after{content:"";position:absolute;top:13px;left:28px;right:0;height:2px;background:var(--line)}
.customer-detail-track>li.is-done::after{background:var(--green)}
.customer-detail-track-dot{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:2px solid var(--line);border-radius:50%}
.customer-detail-track-dot{background:var(--surface);color:var(--muted);font-size:var(--text-xs);font-weight:700;font-variant-numeric:tabular-nums}
.customer-detail-track>.is-done>.customer-detail-track-dot{border-color:var(--green);background:var(--green);color:#fff}
.customer-detail-track>.is-current>.customer-detail-track-dot{border-color:var(--accent);background:var(--accent);color:#fff}
.customer-detail-track>.is-current>.customer-detail-track-dot{box-shadow:0 0 0 3px var(--accent-soft)}
.customer-detail-track-label{padding-right:6px;color:var(--muted);font-size:var(--text-sm);font-weight:600;line-height:1.3;overflow-wrap:anywhere;hyphens:auto}
.customer-detail-track>.is-done>.customer-detail-track-label{color:var(--ink)}
.customer-detail-track>.is-current>.customer-detail-track-label{color:var(--accent)}
@media(max-width:699px){.customer-detail-track{padding:var(--space-3)}.customer-detail-track-label{font-size:var(--text-xs)}}