/* Lists, filters, metrics, settings, statistics, access and sessions screens and their dialogs.
   Screen composition owned by this area. Tokens and shared components come from design.css;
   no !important, no #workspace ID selectors, no reserved min-heights.
   Tables follow the width of their own panel (container queries), not the viewport, so the
   216px sidebar is accounted for: wide list -> table, medium -> two-line rows, narrow -> cards. */

/* ---------- Orders: metric strip ---------- */
.admin-workspace.admin-orders-workspace{gap:var(--space-3)}
.admin-orders-workspace>.admin-metrics{grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);background:var(--surface)}
.admin-orders-workspace .admin-metric{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);min-height:0;padding:10px var(--space-4);border:0;border-right:1px solid var(--line);cursor:default}
.admin-orders-workspace .admin-metric:last-child{border-right:0}
.admin-orders-workspace .admin-metric:hover{background:transparent}
.admin-orders-workspace .admin-metric>span{flex:1 1 auto;font-size:var(--text-sm);font-weight:600;line-height:1.35;color:var(--muted)}
.admin-orders-workspace .admin-metric>strong{flex:0 0 auto;margin:0;font-size:var(--text-2xl);line-height:1.1;letter-spacing:-.4px;font-weight:650;color:var(--navy)}
.admin-orders-workspace .admin-metric{flex-wrap:wrap}.admin-orders-workspace .admin-metric>span{flex-basis:0}
.admin-orders-workspace>.admin-metrics+p.muted{margin:-4px 0 0;font-size:var(--text-xs)}
@media(max-width:899px){
 .admin-orders-workspace>.admin-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
 .admin-orders-workspace .admin-metric:nth-child(2n){border-right:0}
 .admin-orders-workspace .admin-metric:nth-child(-n+2){border-bottom:1px solid var(--line)}
}
@media(max-width:699px){
 .admin-orders-workspace .admin-metric{padding:var(--space-2) var(--space-3)}
 .admin-orders-workspace .admin-metric>strong{font-size:var(--text-xl)}
}
/* D4b: karta zákazníka (F-21) má 6 dlaždíc s druhým riadkom; popis, suma a poznámka idú pod sebou (pri 375 px sa prekrývali),
   mriežka 3 a pod 700 px 2 stĺpce, deliace čiary cez medzeru 1 px na farbe čiary. */
[data-screen-id="admin.customer.card.kpi"]{grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line)}
[data-screen-id="admin.customer.card.kpi"]>.admin-metric{display:grid;align-content:start;justify-items:start;gap:4px;min-width:0;min-height:0;padding:var(--space-3) var(--space-4);border:0;background:var(--surface);cursor:default}
[data-screen-id="admin.customer.card.kpi"]>.admin-metric>strong{font-size:var(--text-2xl);line-height:1.2;overflow-wrap:anywhere}
[data-screen-id="admin.customer.card.kpi"]>.admin-metric>small{font-size:var(--text-xs);line-height:1.4}
@media(max-width:699px){[data-screen-id="admin.customer.card.kpi"]{grid-template-columns:repeat(2,minmax(0,1fr))}[data-screen-id="admin.customer.card.kpi"]>.admin-metric>strong{font-size:var(--text-xl)}}

/* ---------- Orders: filter toolbar (row 1) and disclosure + active chips (row 2) ---------- */
.admin-orders-panel{container:orders-list/inline-size}
.admin-orders-panel>[data-form-id="orders.filters"]{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:var(--space-2) var(--space-4);padding:var(--space-3) var(--space-4)}
.admin-orders-panel>[data-form-id="orders.filters"]>*{margin:0}
.admin-orders-panel>[data-form-id="orders.filters"]>.admin-list-toolbar{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--space-2);padding:0}
/* The field group has no semantics of its own; flattening it lets fields and buttons share one wrapping row. */
.admin-orders-panel>[data-form-id="orders.filters"]>.admin-list-toolbar>.cluster{display:contents}
.admin-orders-panel>[data-form-id="orders.filters"]>.admin-list-toolbar>.cluster>.field{flex:1 1 150px;min-width:0;max-width:none;margin:0;gap:4px}
.admin-orders-panel>[data-form-id="orders.filters"]>.admin-list-toolbar>.cluster>.field:first-child{flex:1.6 1 220px}
.admin-orders-panel>[data-form-id="orders.filters"]>.admin-list-toolbar .input{min-height:var(--control-height)}
.admin-orders-panel>[data-form-id="orders.filters"]>.admin-list-toolbar>.btn{min-height:var(--control-height);font-size:var(--text-sm)}
.admin-orders-panel>[data-form-id="orders.filters"]>details{grid-column:1;padding:0;border:0}
.admin-orders-panel>[data-form-id="orders.filters"]>details[open]{grid-column:1/-1}
.admin-orders-panel>[data-form-id="orders.filters"]>details>summary{display:inline-flex;align-items:center;min-height:28px;font-size:var(--text-sm);font-weight:600;color:var(--ink-2)}
.admin-orders-panel>[data-form-id="orders.filters"]>details[open]>summary{margin-bottom:var(--space-2)}
.admin-orders-panel>[data-form-id="orders.filters"]>details>.grid-2{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}
.admin-orders-panel>[data-form-id="orders.filters"]>details>p{margin:6px 0 0;font-size:var(--text-xs)}
.admin-orders-panel>[data-form-id="orders.filters"]>div.panel-body{grid-column:2;justify-self:end;display:flex;flex-direction:column;align-items:flex-end;gap:6px;min-width:0;padding:0}
.admin-orders-panel>[data-form-id="orders.filters"]>details[open]+div.panel-body{grid-column:1/-1;justify-self:stretch;align-items:flex-start}
.admin-orders-panel>[data-form-id="orders.filters"]>div.panel-body>.cluster{gap:6px}
.admin-orders-panel>[data-form-id="orders.filters"]>div.panel-body>.cluster>.btn{white-space:normal;text-align:left}
.admin-orders-panel>[data-form-id="orders.filters"]>div.panel-body .muted{margin:0;font-size:var(--text-xs)}
.admin-orders-panel>[data-form-id="orders.filters"] .form-error:not([hidden]){margin:0}
.admin-orders-panel>.admin-list-caption{padding:6px var(--space-4);border-top:1px solid var(--line);background:var(--surface);font-size:var(--text-xs);color:var(--muted)}

@container orders-list (max-width:859px){
 .admin-orders-panel>[data-form-id="orders.filters"]>.admin-list-toolbar>.cluster>.field:first-child{flex-basis:100%}
 .admin-orders-panel>[data-form-id="orders.filters"]>.admin-list-toolbar>.cluster>.field{flex-basis:120px}
}
@container orders-list (max-width:559px){
 .admin-orders-panel>[data-form-id="orders.filters"]{grid-template-columns:minmax(0,1fr);padding:var(--space-3) 14px}
 .admin-orders-panel>[data-form-id="orders.filters"]>.admin-list-toolbar>.cluster>.field{flex-basis:40%}
 .admin-orders-panel>[data-form-id="orders.filters"]>.admin-list-toolbar>.btn{flex:1 1 40%}
 .admin-orders-panel>[data-form-id="orders.filters"]>details{grid-column:1}
 .admin-orders-panel>[data-form-id="orders.filters"]>div.panel-body{grid-column:1;justify-self:stretch;align-items:flex-start}
}
/* Keep Status and Owner together on ordinary phones; only very narrow panels stack them. */
@container orders-list (max-width:319px){
 .admin-orders-panel>[data-form-id="orders.filters"]>.admin-list-toolbar>.cluster>.field{flex-basis:100%}
}
@media(max-width:699px){
 .admin-orders-panel>[data-form-id="orders.filters"]>details>summary{min-height:var(--control-height)}
}

/* ---------- Orders: table (wide list) ---------- */
.admin-orders-table .data-table th{padding:8px 12px;font-size:var(--text-xs);font-weight:600;color:var(--muted);background:var(--surface-2)}
.admin-orders-table .data-table td{padding:10px 12px;vertical-align:middle}
.admin-orders-table .data-table :is(th,td):first-child{padding-left:var(--space-4)}
.admin-orders-table .data-table :is(th,td):last-child{padding-right:var(--space-4)}
.admin-orders-table .data-table td:first-child{min-width:240px;max-width:420px}
.admin-orders-table .admin-order-identity{gap:var(--space-3)}
.admin-orders-table .admin-order-identity>.admin-compact-preview{width:48px;flex:0 0 48px}
.admin-orders-table .admin-order-identity>.admin-compact-preview .model-visual.small{width:48px;height:48px}
.admin-orders-table .admin-order-identity>.admin-compact-preview .model-visual.small :is(svg,img){max-height:48px}
/* The placeholder icon and its aria-label already say "no preview"; the caption stays for assistive tech. */
.admin-orders-table .admin-compact-preview>.admin-cell-muted{position:absolute;width:1px;height:1px;margin:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.admin-orders-table .admin-order-reference{gap:6px;flex-wrap:wrap}
.admin-orders-table .admin-order-reference .admin-order-link{font-size:var(--text-sm);font-weight:700;letter-spacing:.01em}
.admin-orders-table .admin-order-reference .admin-priority{font-size:var(--text-xs);line-height:18px;padding:0 6px;border-radius:var(--radius-sm)}
.admin-orders-table .admin-order-reference .admin-priority.is-unknown{background:var(--surface-2);color:var(--muted)}
.admin-orders-table .admin-table-title{margin:2px 0 0;font-size:var(--text-md);font-weight:600;line-height:1.35}
.admin-orders-table .admin-cell-muted{margin-top:2px;font-size:var(--text-xs);line-height:1.4}
.admin-orders-table :is(.admin-order-date,.admin-order-progress,.admin-order-price) .admin-cell-muted{font-size:var(--text-xs)}
.admin-orders-table :is(.admin-order-date,.admin-order-progress)>strong{display:block;font-size:var(--text-md);font-weight:600;white-space:nowrap}
.admin-orders-table .admin-order-progress .admin-cell-muted{margin-top:2px}
.admin-order-quantities{display:grid;gap:2px;margin:0;min-width:118px;font-variant-numeric:tabular-nums}
.admin-order-quantities>div{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-2)}
.admin-order-quantities dt{font-size:var(--text-xs);font-weight:400;color:var(--muted)}
.admin-order-quantities dd{margin:0;font-size:var(--text-sm);font-weight:650;color:var(--ink);white-space:nowrap}
.admin-orders-table .admin-order-state .badge{font-size:var(--text-xs);white-space:nowrap;line-height:18px;text-align:left}
.admin-orders-table .data-table td.admin-order-price{min-width:150px;white-space:normal}
/* D4 (R1-02, R2-01, R2-02): iba v karte (kontajner do 479 px) sa čip fakturácie pod cenou zalomí a text ostane pri bodke; v tabuľke zoznamu ostáva nowrap (.badge v design.css), inak by auto rozloženie stĺpec zúžilo. */
@container orders-list (max-width:479px){.admin-orders-table .admin-order-price>.badge[data-billing]{white-space:normal;text-align:left}}
/* D4b: v kartách a dvojriadkových riadkoch zoznamu zákazníka (kontajner do 859 px) sa dlhý text termínu zalomí; nowrap z pravidla .admin-orders-table :is(.admin-order-date,…)>strong ho posúval cez stĺpec Dokončené kusy. */
@container orders-list (max-width:859px){[data-screen-id="customer.orders.list"] .admin-order-row>td.admin-order-date>strong{white-space:normal}}
.admin-orders-table .product-price-compact{gap:1px;line-height:1.4}
.admin-orders-table .product-price-compact strong{font-size:var(--text-lg)}
.admin-orders-table .product-price-compact :is(small,span){font-size:var(--text-xs);font-weight:400}
.admin-orders-table .product-price-list{display:grid;grid-template-columns:minmax(0,1fr);justify-items:end;align-items:baseline;text-align:right}
.admin-orders-table .product-price-list>:is(strong,small){white-space:nowrap}
.admin-orders-table .product-price-list>span{grid-column:1/-1;justify-self:end}
.admin-orders-table .data-table:has(td.admin-order-price) th:nth-child(5){text-align:right}
.admin-orders-table .admin-order-owner .admin-owner{font-size:var(--text-sm);white-space:normal}

/* ---------- Orders: medium list -> two-line rows (identity + status, then the four facts) ---------- */
@container orders-list (max-width:859px){
 .admin-orders-panel .admin-orders-table{overflow:visible}
 .admin-orders-table .data-table,.admin-orders-table .data-table tbody{display:block;width:100%}
 .admin-orders-table .data-table thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .admin-orders-table .data-table tr.admin-order-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr) minmax(0,1fr) minmax(170px,1.3fr);gap:var(--space-2) var(--space-4);position:static;padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--line-soft);background:var(--surface)}
 .admin-orders-table .data-table tr.admin-order-row:last-child{border-bottom:0}
 .admin-orders-table .data-table tr.admin-order-row>td{display:block;position:static;width:auto;min-width:0;max-width:none;margin:0;padding:0;border:0;font-size:var(--text-md);white-space:normal}
 .admin-orders-table .data-table tr.admin-order-row>td::before{content:attr(data-label);display:block;margin-bottom:2px;font-size:var(--text-xs);font-weight:400;line-height:1.4;color:var(--muted)}
 .admin-orders-table .data-table tr.admin-order-row>td:first-child{grid-column:1/4;grid-row:1;padding:0}
 .admin-orders-table .data-table tr.admin-order-row>:is(td:first-child,td.admin-order-state)::before{display:none}
 .admin-orders-table .data-table tr.admin-order-row>td.admin-order-state{grid-column:4;grid-row:1;justify-self:end;align-self:start;max-width:none}
 .admin-orders-table .data-table tr.admin-order-row>td.admin-order-date{grid-column:1;grid-row:2}
 .admin-orders-table .data-table tr.admin-order-row>td.admin-order-progress{grid-column:2;grid-row:2}
 .admin-orders-table .data-table tr.admin-order-row>td.admin-order-owner{grid-column:3;grid-row:2;justify-items:start}
 .admin-orders-table .data-table tr.admin-order-row>td.admin-order-price{grid-column:4;grid-row:2;text-align:right}
 .admin-orders-table .admin-order-price .product-price-compact{justify-items:end}
}
/* ---------- Orders: tablet list -> three facts per line under the identity ---------- */
@container orders-list (max-width:679px){
 .admin-orders-table .data-table tr.admin-order-row{grid-template-columns:minmax(0,1fr) minmax(0,.8fr) minmax(150px,1.2fr);gap:var(--space-2) var(--space-3)}
 .admin-orders-table .data-table tr.admin-order-row>td:first-child{grid-column:1/3}
 .admin-orders-table .data-table tr.admin-order-row>td.admin-order-state{grid-column:3}
 .admin-orders-table .data-table tr.admin-order-row>td.admin-order-price{grid-column:3;grid-row:2}
 .admin-orders-table .data-table tr.admin-order-row>td.admin-order-owner{grid-column:1/-1;grid-row:3}
}
/* ---------- Orders: narrow list -> card (identity, then label/value pairs in two columns) ---------- */
@container orders-list (max-width:479px){
 .admin-orders-table .data-table tr.admin-order-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-2) var(--space-3);padding:var(--space-3) 14px}
 .admin-orders-table .data-table tr.admin-order-row>td:first-child{grid-column:1/-1}
 .admin-orders-table .data-table tr.admin-order-row>td.admin-order-state{grid-column:1;grid-row:2;justify-self:start}
 .admin-orders-table .data-table tr.admin-order-row>td.admin-order-state::before{display:block}
 .admin-orders-table .data-table tr.admin-order-row>td.admin-order-price{grid-column:2;grid-row:2}
 .admin-orders-table .data-table tr.admin-order-row>td.admin-order-date{grid-column:1;grid-row:3}
 /* Admin cards: a long requested date moves under its label instead of running into the progress column; the date stays whole. */
 [data-screen-id="admin.orders.list"] .admin-order-row>td.admin-order-date .admin-cell-muted{white-space:normal}
 .admin-order-date .admin-date-value{white-space:nowrap}
 .admin-orders-table .data-table tr.admin-order-row>td.admin-order-progress{grid-column:2;grid-row:3;text-align:right}
 .admin-orders-table .data-table tr.admin-order-row>td.admin-order-owner{grid-column:1/-1;grid-row:4}
}

/* ---------- Generic list panels: customers, drafts, documents, notifications ---------- */
:is(.admin-customers,.customer-drafts,.finance-documents,.admin-notifications){container:list-panel/inline-size}
:is(.admin-customers,.customer-drafts,.finance-documents,.admin-notifications) .data-table :is(th,td):first-child{padding-left:var(--space-4)}
:is(.admin-customers,.customer-drafts,.finance-documents,.admin-notifications) .data-table :is(th,td):last-child{padding-right:var(--space-4)}
:is(.admin-customers,.customer-drafts) .data-table th:last-child,:is(.admin-customers,.customer-drafts,.finance-documents) .data-table td:last-child:has(.btn){width:1%;white-space:nowrap;text-align:right}
:is(.admin-customers,.customer-drafts) .data-table td:last-child .cluster{flex-wrap:nowrap;justify-content:flex-end;gap:var(--space-1)}
.finance-documents .data-table th:nth-child(n+3):nth-child(-n+6){text-align:right}
/* Column headers already name the identity cells; their inline labels return in the stacked layout. */
.finance-documents .data-table td:is(.product-document-identity,.product-order-identity){min-width:150px;padding-right:12px;border-left:0}
.finance-documents .data-table td.product-order-identity{padding-left:12px}
.finance-documents .product-identity-label{position:absolute;width:1px;height:1px;margin:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.admin-customers .data-table td:first-child>strong{display:block;font-weight:600}
.admin-notifications>.panel-body{display:grid;gap:var(--space-2)}
.admin-notifications>.panel-body>*{margin:0}
.admin-notifications>.panel-body>.notice{padding:6px 12px}
.admin-notifications>.panel-body>p.muted:last-child{font-size:var(--text-xs)}
/* A wide table keeps its own horizontal scroll and shows an edge shadow where content continues. */
:is(.finance-documents,.admin-notifications) .table-wrap{background:linear-gradient(90deg,var(--surface) 30%,#fff0) left/24px 100% no-repeat local,linear-gradient(270deg,var(--surface) 30%,#fff0) right/24px 100% no-repeat local,radial-gradient(farthest-side at 0 50%,#1735542e,#0000) left/10px 100% no-repeat scroll,radial-gradient(farthest-side at 100% 50%,#1735542e,#0000) right/10px 100% no-repeat scroll}

/* Drafts: segmented status switch with its hint on one bar. */
.customer-drafts-bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2) var(--space-4);padding:var(--space-3) 14px;border-bottom:1px solid var(--line-soft)}
.customer-drafts-toggle{display:inline-flex;gap:6px;padding:0;border:0;border-radius:0;background:transparent}
.customer-drafts-toggle>.btn{min-height:var(--control-height-sm);padding:3px 10px;border:1px solid var(--line);border-radius:var(--radius-pill);background:var(--surface);color:var(--ink-2);font-size:var(--text-xs);font-weight:600;box-shadow:none}
.customer-drafts-toggle>.btn:hover{border-color:var(--accent-line);background:var(--surface);color:var(--ink)}
.customer-drafts-toggle>.btn[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-soft);color:var(--accent);box-shadow:none}
.customer-drafts-bar>.product-draft-explanation{flex:1 1 240px}
/* Drafts keep their model thumbnail at every width, like the orders list (48px row, 40px card). */
.customer-drafts .admin-order-identity{gap:var(--space-3)}
.customer-drafts .admin-order-identity>.admin-compact-preview{display:grid;width:48px;flex:0 0 48px}
.customer-drafts .admin-compact-preview .model-visual.small{width:48px;height:48px}
.customer-drafts .admin-order-identity strong{display:block;font-weight:600;white-space:normal}
.customer-drafts .admin-order-identity .admin-cell-muted{margin-top:2px;font-size:var(--text-xs);white-space:normal}

/* Documents: the full table needs ~1030px. In a wide panel the long headers wrap and the file column (header and
   both cell kinds) aligns right; below that each document becomes two labelled lines (identity, status and file,
   then the four amounts), so no column or download action hides in a horizontal scroll. */
.finance-documents .data-table th{white-space:normal;vertical-align:bottom}
@container list-panel (min-width:1041px){
 .finance-documents .data-table :is(th,td):last-child{text-align:right}
}
@container list-panel (max-width:1040px){
 .finance-documents .data-table thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .finance-documents .data-table,.finance-documents .data-table tbody{display:block;width:100%}
 .finance-documents .data-table tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(max-content,1fr);align-items:start;gap:var(--space-2) var(--space-4);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--line-soft)}
 .finance-documents .data-table tbody tr:last-child{border-bottom:0}
 .finance-documents .data-table td{display:block;width:auto;min-width:0;padding:0;border:0;font-size:var(--text-md);text-align:left;white-space:normal;overflow-wrap:anywhere}
 .finance-documents .data-table td[data-label]::before{content:attr(data-label);display:block;margin-bottom:2px;font-size:var(--text-xs);font-weight:400;line-height:1.4;color:var(--muted)}
 .finance-documents .data-table td:is(.product-document-identity,.product-order-identity){min-width:0;padding:0}
 .finance-documents .product-identity-label{position:static;width:auto;height:auto;margin:0 0 2px;overflow:visible;clip-path:none;font-size:var(--text-xs);font-weight:400;letter-spacing:0;color:var(--muted)}
 .finance-documents .data-table td:nth-child(7){grid-column:3;grid-row:1}
 .finance-documents .data-table td:nth-child(8){grid-column:4;grid-row:1;align-self:center;justify-self:end;text-align:right}
 .finance-documents .data-table td:last-child:has(.btn){width:auto;white-space:nowrap}
 .finance-documents .data-table td:last-child:has(.btn)::before{display:none}
}

/* Narrow list panels: each row becomes a labelled two-column card; actions stay on screen. */
@container list-panel (max-width:599px){
 :is(.admin-customers,.customer-drafts,.finance-documents,.admin-notifications) .data-table thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 :is(.admin-customers,.customer-drafts,.finance-documents,.admin-notifications) .data-table,:is(.admin-customers,.customer-drafts,.finance-documents,.admin-notifications) .data-table tbody{display:block;width:100%}
 :is(.admin-customers,.customer-drafts,.finance-documents,.admin-notifications) .data-table tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-2) var(--space-3);padding:var(--space-3) 14px;border-bottom:1px solid var(--line-soft)}
 :is(.admin-customers,.customer-drafts,.finance-documents,.admin-notifications) .data-table tbody tr:last-child{border-bottom:0}
 :is(.admin-customers,.customer-drafts,.finance-documents,.admin-notifications) .data-table td{display:block;width:auto;min-width:0;padding:0;border:0;font-size:var(--text-md);text-align:left;white-space:normal;overflow-wrap:anywhere}
 :is(.admin-customers,.customer-drafts,.finance-documents,.admin-notifications) .data-table td:is(:first-child,:last-child){padding:0}
 :is(.admin-customers,.customer-drafts,.finance-documents,.admin-notifications) .data-table td[data-label]::before{content:attr(data-label);display:block;margin-bottom:2px;font-size:var(--text-xs);font-weight:400;line-height:1.4;color:var(--muted)}
 :is(.admin-customers,.customer-drafts) .data-table td:first-child{grid-column:1/-1}
 :is(.admin-customers,.customer-drafts) .data-table td:first-child::before{display:none}
 :is(.admin-customers,.customer-drafts,.finance-documents) .data-table td:last-child:has(.btn){width:auto;text-align:left}
 .finance-documents .data-table td .btn{min-height:var(--control-height)}
 :is(.admin-customers,.customer-drafts,.finance-documents) .data-table td:last-child:has(.btn)::before{display:none}
 .customer-drafts .data-table td:last-child:has(.btn){grid-column:1/-1}
 .customer-drafts .admin-order-identity>.admin-compact-preview{width:40px;flex-basis:40px}
 .customer-drafts .admin-compact-preview .model-visual.small{width:40px;height:40px}
 :is(.admin-customers,.customer-drafts) .data-table td:last-child .cluster{justify-content:stretch}
 :is(.admin-customers,.customer-drafts) .data-table td:last-child .btn{flex:1 1 0;min-height:var(--control-height)}
 .admin-customers .data-table td[data-label="E-mail"]{grid-column:1/-1}
 .finance-documents .data-table td:is(.product-document-identity,.product-order-identity){min-width:0}
 .finance-documents .product-identity-label{position:static;width:auto;height:auto;margin:0 0 2px;overflow:visible;clip-path:none;font-size:var(--text-xs);font-weight:400;letter-spacing:0;color:var(--muted)}
 .finance-documents .data-table td:is(:nth-child(7),:nth-child(8)){grid-column:auto;grid-row:auto;align-self:start;justify-self:stretch;text-align:left}
 .admin-customers .data-table td:last-child:has(.btn){align-self:end}
 .admin-customers .data-table td:last-child>.btn{width:100%;min-height:var(--control-height)}
}
@media(max-width:699px){
 .customer-drafts-bar{padding:var(--space-3) 14px}
 .customer-drafts-toggle{display:flex;width:100%}
 .customer-drafts-toggle>.btn{flex:1 1 0;min-height:44px}
 .product-list-pager{padding:var(--space-2) 14px}
 .product-list-pager .btn{min-height:var(--control-height)}
}

/* ---------- A8b-2 Notifications as V6.2 (pNotif), outside the pinned order list window (DG-06, COL-09) ---------- */
/* Sending notice on top, then the list and the refused e-mails, side by side when wide; a narrow panel gives the state a full row. */
.admin-notifications-screen{display:grid;gap:var(--space-3);align-items:start}
.admin-notifications-screen>.notice{margin:0}
@media(min-width:1280px){.admin-notifications-screen:has(>.admin-notifications-blocked-panel){grid-template-columns:minmax(0,1fr) minmax(300px,360px)}.admin-notifications-screen>.notice{grid-column:1/-1}}
.admin-notifications-blocked{display:grid;gap:var(--space-2)}
.admin-notifications-blocked>*{margin:0}
/* The count under the refused list is a footnote like the list summary; a lone load error keeps its normal size. */
.admin-notifications-blocked>p.muted:last-child:not(:only-child){font-size:var(--text-xs)}
.admin-notifications .data-table td>strong{font-weight:600;color:var(--ink)}
.admin-notifications-recipient{font-family:var(--mono);font-size:var(--text-xs)}
.admin-notifications .data-table td>.admin-cell-muted{margin-top:2px;white-space:normal}
@container list-panel (max-width:599px){.admin-notifications .data-table td:last-child{grid-column:1/-1}.admin-notifications .badge{white-space:normal}}

/* ---------- Models: V6.2 cards (prototype .libgrid, .libcard, .lthumb); 300px minimum for our longer button labels ---------- */
.customer-library-screen.stack{gap:var(--space-3)}
.customer-library-screen>p{margin:0}
.customer-library-help{font-size:var(--text-sm);line-height:1.5}
.customer-library-help>.upload-format-hint{margin:0;font-size:inherit;font-weight:600;color:var(--ink-2)}
.customer-library-list>ul{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:12px;margin:0;padding:0;list-style:none}
.customer-library-row{display:flex;flex-direction:column;min-width:0;overflow:hidden;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.customer-library-thumb{display:grid;place-items:center;height:118px;background:linear-gradient(180deg,var(--surface-2),var(--line-soft));border-bottom:1px solid var(--line-soft)}
.customer-library-thumb .product-thumbnail{width:88px;height:88px;border:0;background:transparent}
.customer-library-identity{display:grid;gap:6px;min-width:0;padding:12px 14px 0}
.customer-library-title{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:6px}
.customer-library-title>h2{min-width:0;margin:0;font-size:var(--text-md);font-weight:700;line-height:1.35;letter-spacing:0;overflow-wrap:anywhere}
.customer-library-specs{display:flex;flex-wrap:wrap;gap:2px var(--space-2);margin:0;font-size:var(--text-sm);color:var(--muted)}
.customer-library-specs>span+span::before{content:"·";margin-right:var(--space-2);color:var(--subtle)}
.customer-library-identity>*{margin:0}
.customer-library-actions{flex-wrap:wrap;gap:6px;margin-top:auto;padding:10px 14px 14px}
/* V6.2 .btn.sm look, but the shared control height stays the touch target (36px, 44px on phones). */
.customer-library-actions>.btn{flex:1 1 auto;padding:4px 10px;font-size:var(--text-xs);white-space:nowrap}
.customer-library-list>.product-list-pager{margin-top:var(--space-3);padding:var(--space-2) 0;border:0;background:transparent}
/* Phones: full-width actions with 44px targets. */
@media(max-width:699px){.customer-library-actions>.btn{flex:1 1 140px;min-height:var(--control-height)}}