/* KID+D foundation, reconstructed from KID_D_UX_DESIGN_SYSTEM.md,
 * ERP form tokens and current Orders/shared styles. Not a recovered original.
 * Low-specificity, opt-in primitives; page/shared styles retain ownership.
 * The kid-form marker alone does not restyle its descendant controls.
 */
/* UI font trial. Document templates keep their own font families.
 * CS ChatThaiUI by Chanok Samiti: https://thaifaces.com/specimen/cs-chatthai-ui/
 * To restore the previous UI font, set --kid-font-sans back to Anuphan.
 */
@font-face {
    font-family: 'CS ChatThaiUI';
    src: url('../fonts/cs-chatthai-ui-regular.woff2') format('woff2');
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}
:root {
    --kid-brand-900: #0D3158;
    --kid-brand-800: #1A3D7C;
    --kid-brand-legacy: #1A3F8B;
    --kid-text: #202124;
    --kid-text-secondary: #434A54;
    --kid-muted: #646E7A;
    --kid-placeholder: #8A939F;
    --kid-border: #E2E8F0;
    --kid-border-strong: #CBD5E1;
    --kid-surface: #FFFFFF;
    --kid-surface-soft: #F8FAFC;
    --kid-control-soft-background: #F9F9FB;
    --kid-control-soft-border: #E5E5EA;
    --kid-canvas: #F6F8FB;
    --kid-canvas-history: #FFFFFF;
    --kid-accent: #2498C5;
    --kid-success: #15803D;
    --kid-action-lime: #8BC322;
    --kid-action-lime-hover: #75A817;
    --kid-action-lime-shadow: none;
    --kid-action-lime-shadow-hover: none;
    --kid-button-radius: 5px;
    --kid-popup-radius: var(--kid-button-radius);
    --kid-button-focus: #38BDF8;
    --kid-button-transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease, box-shadow 150ms ease, translate 100ms ease;
    --kid-warning: #D97706;
    --kid-danger: #DC2626;
    --kid-info: #1D4ED8;
    --kid-font-sans: 'CS ChatThaiUI', 'Anuphan', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --kid-space-4: 4px;
    --kid-space-6: 6px;
    --kid-space-8: 8px;
    --kid-space-10: 10px;
    --kid-space-12: 12px;
    --kid-space-14: 14px;
    --kid-space-16: 16px;
    --kid-space-20: 20px;
    --kid-space-24: 24px;
    --kid-space-32: 32px;
    --kid-radius-8: 8px;
    --kid-radius-10: 10px;
    --kid-radius-12: 12px;
    --kid-radius-14: 14px;
    --kid-radius-16: 16px;
    --kid-radius-20: 20px;
    --kid-radius-pill: 999px;
    --kid-control-height: 46px;
    --kid-control-compact: 40px;
    --kid-control-action: 48px;
    --kid-shadow-xs: 0 1px 2px rgba(15, 23, 42, .04);
    --kid-shadow-card: 0 12px 38px rgba(15, 23, 42, .065);
    --kid-shadow-card-hover: 0 14px 34px rgba(15, 23, 42, .10);
    --kid-shadow-elevated: 0 14px 34px rgba(15, 23, 42, .16);
    --kid-shadow-modal: 0 24px 70px rgba(15, 23, 42, .24);
    --kid-focus-ring: 0 0 0 3px rgba(26, 61, 124, .16);
    --kid-shadow-field: none;
    --kid-shadow-field-hover: none;
    --kid-shadow-field-focus: none;
    --kid-shadow-field-muted: none;
    --kid-shadow-field-edit: none;
    --kid-motion-fast: 150ms;
    --kid-motion-normal: 200ms;
    --kid-motion-ease: ease;
}

:where(.kid-ui-surface, .kid-ui-card, .kid-ui-modal-panel, .kid-data-card) {
    box-sizing: border-box;
    color: var(--kid-text);
    background: var(--kid-surface);
    border: 1px solid var(--kid-border);
    border-radius: var(--kid-radius-14);
}
:where(.kid-ui-card) { padding: var(--kid-space-16); box-shadow: var(--kid-shadow-card); }
:where(.kid-ui-modal-panel) { max-width: 100%; box-shadow: var(--kid-shadow-modal); }
/* Compact native dialog shell; content stays within the shared panel contract. */
dialog.kid-ui-modal-panel--compact {
    position:fixed; inset:0; width:min(var(--kid-modal-width,680px),calc(100vw - 32px)); height:fit-content; max-height:var(--kid-modal-max-height,80dvh); margin:auto; padding:0;
    border:1px solid var(--kid-border); border-radius:var(--kid-frame-radius,var(--kid-radius-14));
    color:var(--kid-text); background:var(--kid-surface); overflow:hidden;
    font:400 13px/1.5 var(--kid-font-sans); text-align:left;
}
dialog.kid-ui-modal-panel--small { width:min(460px,calc(100vw - 32px)); }
dialog.kid-ui-modal-panel--compact > form { display:flex; flex-direction:column; min-height:0; max-height:inherit; margin:0; overflow:hidden; }
dialog.kid-ui-modal-panel--compact[open] { display:flex; flex-direction:column; }
dialog.kid-ui-modal-panel--compact::backdrop { background:rgba(15,23,42,.45); }
.kid-ui-modal-header { display:flex; align-items:flex-start; justify-content:space-between; gap:var(--kid-space-12); padding:var(--kid-space-16); border-bottom:1px solid var(--kid-border); background:var(--kid-surface-soft); flex-shrink:0; }
.kid-ui-modal-header > div { min-width:0; }
.kid-ui-modal-title { margin:0; color:var(--kid-brand-800); font:600 15px/1.5 var(--kid-font-sans); }
.kid-ui-modal-subtitle { margin:var(--kid-space-4) 0 0; color:var(--kid-muted); font:400 12px/1.5 var(--kid-font-sans); overflow-wrap:anywhere; }
.kid-ui-modal-header form { margin:0; flex-shrink:0; }
.kid-ui-modal-close { flex-shrink:0; font:400 20px/1 var(--kid-font-sans); }
.kid-ui-modal-close:hover { background:var(--kid-surface-soft); color:var(--kid-brand-800); border-color:var(--kid-brand-800); }
.kid-ui-modal-close:focus-visible { outline:2px solid var(--kid-brand-800); outline-offset:2px; }
.kid-ui-modal-body { overflow:auto; min-height:0; padding:var(--kid-space-16); }
.kid-ui-modal-footer { margin:0; padding:var(--kid-space-12) var(--kid-space-16); border-top:1px solid var(--kid-border); background:var(--kid-surface-soft); color:var(--kid-muted); font:400 11px/1.6 var(--kid-font-sans); flex-shrink:0; }
.kid-ui-modal-footer--actions { display:flex; justify-content:flex-end; gap:var(--kid-space-8); }
/* Shared modal form layout, proof uploads and media previews. */
.kid-ui-modal-form { display:grid; gap:var(--kid-space-20); }
.kid-ui-form-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr)); gap:var(--kid-space-16); }
.kid-ui-panel-body { padding:var(--kid-space-16); }
.kid-ui-modal-stack { display:grid; grid-auto-rows:max-content; align-content:start; gap:var(--kid-space-16); }
.kid-ui-modal-panel .kid-ui-alert { margin:0; padding:var(--kid-space-12) var(--kid-space-16); border:1px solid var(--kid-border); border-radius:var(--kid-radius-10); background:var(--kid-surface-soft); color:var(--kid-text-secondary); line-height:1.7; }
.kid-ui-modal-panel .kid-ui-alert--warning { border-color:#FDE68A; background:#FFFBEB; color:#92400E; }
.kid-ui-modal-panel .kid-ui-alert--danger { border-color:#FECACA; background:#FEF2F2; color:#991B1B; }
.kid-ui-file-control::file-selector-button { margin-right:var(--kid-space-12); padding:var(--kid-space-6) var(--kid-space-12); border:1px solid var(--kid-border); border-radius:var(--kid-radius-8); background:var(--kid-surface); color:var(--kid-brand-800); font:inherit; cursor:pointer; }
.kid-ui-media-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(90px,1fr)); gap:var(--kid-space-10); }
.kid-ui-media-grid figure { margin:0; min-width:0; }
.kid-ui-media-grid img { width:100%; aspect-ratio:1; object-fit:cover; border:1px solid var(--kid-border); border-radius:var(--kid-radius-10); background:var(--kid-surface-soft); }
.kid-ui-media-grid figcaption { margin-top:var(--kid-space-4); color:var(--kid-muted); font-size:11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kid-ui-media-grid--evidence { grid-template-columns:minmax(0,1fr); }
.kid-ui-media-grid--evidence img { display:block; width:100%; height:auto; max-height:360px; aspect-ratio:auto; object-fit:contain; padding:var(--kid-space-10); }
.kid-ui-media-grid--evidence figcaption { white-space:normal; }
.kid-ui-modal-panel [hidden] { display:none!important; }

.kid-ui-modal-body .kid-ui-choice-group { display:flex; flex-wrap:wrap; gap:var(--kid-space-16); margin:var(--kid-space-16) 0; padding:var(--kid-space-12); border:1px solid var(--kid-border); border-radius:var(--kid-frame-radius,var(--kid-radius-8)); }
.kid-ui-choice-group legend { color:var(--kid-text-secondary); font-weight:600; }
.kid-ui-choice { display:inline-flex; align-items:center; gap:var(--kid-space-6); cursor:pointer; }
.kid-ui-choice input[type="radio"] { width:16px; height:16px; margin:0; accent-color:var(--kid-brand-800); }
.kid-ui-choice input:focus-visible { outline:2px solid var(--kid-brand-800); outline-offset:2px; }
.kid-ui-modal-error { margin:var(--kid-space-8) 0 0; color:var(--kid-danger); font-size:12px; }
.kid-ui-modal-error:empty { display:none; }
:where(.kid-ui-label, .kid-form-label),
.kid-ui-modal-panel :is(.kid-ui-label, .kid-form-label) {
    display: block;
    margin-bottom: var(--kid-space-6);
    color: var(--kid-text-secondary);
    font: 600 12px/1.5 var(--kid-font-sans);
}
:where(.kid-form-field) { min-width: 0; }
:where(.kid-ui-control, .kid-form-control),
.kid-ui-modal-panel :is(.kid-ui-control, .kid-form-control) {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    min-height: var(--kid-control-height);
    padding: var(--kid-space-10) var(--kid-space-12);
    border: 1px solid var(--kid-border-strong);
    border-radius: var(--kid-radius-10);
    background: var(--kid-surface-soft);
    color: var(--kid-text);
    font: 400 14px/1.5 var(--kid-font-sans);
    box-shadow:var(--kid-shadow-field);
    transition:border-color var(--kid-motion-fast) var(--kid-motion-ease), background-color var(--kid-motion-fast) var(--kid-motion-ease);
}
:where(textarea.kid-ui-control, textarea.kid-form-control) { resize: vertical; }
:where(.kid-ui-control, .kid-form-control)::placeholder { color: var(--kid-placeholder); }
:where(.kid-ui-control, .kid-form-control):focus,
.kid-ui-modal-panel :is(.kid-ui-control, .kid-form-control):focus {
    border-color: var(--kid-brand-800);
    outline:1px solid var(--kid-brand-800);
    outline-offset:2px;
    box-shadow:var(--kid-shadow-field-focus);
}
:where(.kid-ui-control, .kid-form-control)[aria-invalid="true"],
.kid-ui-modal-panel :is(.kid-ui-control, .kid-form-control)[aria-invalid="true"] {
    border-color: var(--kid-danger);
    box-shadow: var(--kid-shadow-field-edit, none);
}
:where(.kid-ui-control, .kid-form-control):is(:disabled, [readonly]),
.kid-ui-modal-panel :is(.kid-ui-control, .kid-form-control):is(:disabled, [readonly]) {
    background: var(--kid-canvas);
    color: var(--kid-muted);
}
:where(.kid-ui-control, .kid-form-control):disabled { cursor: not-allowed; }
:where(.kid-ui-button),
.kid-ui-actions--toolbar .kid-ui-button,
:is(.kid-ui-modal-panel,.oc-dialog) .kid-ui-button {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--kid-space-8);
    min-height: var(--kid-control-compact);
    padding: var(--kid-space-8) var(--kid-space-16);
    border: 1px solid var(--kid-border-strong);
    border-radius: var(--kid-button-radius);
    background: var(--kid-surface);
    color: var(--kid-brand-800);
    font: 500 14px/1.5 var(--kid-font-sans);
    text-decoration: none;
    cursor: pointer;
}
:where(.kid-ui-button--primary), :is(.kid-ui-modal-panel,.oc-dialog) .kid-ui-button--primary, .od-btn.kid-ui-button--primary { background: var(--kid-action-lime); border-color: var(--kid-action-lime); color: var(--kid-surface); box-shadow: var(--kid-action-lime-shadow); font-weight:600; }
:where(.kid-ui-button--primary:hover:not(:disabled):not([aria-disabled="true"])), :is(.kid-ui-modal-panel,.oc-dialog) .kid-ui-button--primary:hover:not(:disabled):not([aria-disabled="true"]), .od-btn.kid-ui-button--primary:hover:not(:disabled):not([aria-disabled="true"]) { background: var(--kid-action-lime-hover); border-color: var(--kid-action-lime-hover); box-shadow: var(--kid-action-lime-shadow-hover); }
:where(.kid-ui-button--secondary), :is(.kid-ui-modal-panel,.oc-dialog) .kid-ui-button--secondary, .kid-ui-actions--toolbar .kid-ui-button--secondary { background: var(--kid-surface); border-color: var(--kid-border-strong); color: var(--kid-brand-800); }
:where(.kid-ui-button--brand), :is(.kid-ui-modal-panel,.oc-dialog) .kid-ui-button--brand, .kid-ui-actions--toolbar .kid-ui-button--brand { background:var(--kid-brand-800); border-color:var(--kid-brand-800); color:var(--kid-surface); }
:where(.kid-ui-button--warning), :is(.kid-ui-modal-panel,.oc-dialog) .kid-ui-button--warning { background:#FFF7ED; border-color:#FED7AA; color:#C2410C; }
:where(.kid-ui-button--danger), :is(.kid-ui-modal-panel,.oc-dialog) .kid-ui-button--danger, .kid-ui-actions--toolbar .kid-ui-button--danger { background: var(--kid-danger); border-color: var(--kid-danger); color: var(--kid-surface); }
:where(.kid-ui-button):focus-visible, :is(.kid-ui-modal-panel,.oc-dialog) .kid-ui-button:focus-visible, .kid-ui-actions--toolbar .kid-ui-button:focus-visible { outline: 2px solid var(--kid-button-focus); outline-offset: 3px; }
:where(.kid-ui-button):is(:disabled, [aria-disabled="true"], [aria-busy="true"]), :is(.kid-ui-modal-panel,.oc-dialog) .kid-ui-button:is(:disabled, [aria-disabled="true"], [aria-busy="true"]), .kid-ui-actions--toolbar .kid-ui-button:is(:disabled, [aria-disabled="true"], [aria-busy="true"]) { opacity: .6; cursor: not-allowed; }
:where(.kid-ui-status, .kid-data-status) {
    display: inline-flex;
    align-items: center;
    gap: var(--kid-space-4);
    padding: var(--kid-space-4) var(--kid-space-8);
    border-radius: var(--kid-radius-pill);
    background: var(--kid-surface-soft);
    color: var(--kid-muted);
    font: 600 11px/1.5 var(--kid-font-sans);
}
:where(.kid-ui-status--success) { color: var(--kid-success); background: #F0FDF4; }
:where(.kid-ui-status--warning) { color: #92400E; background: #FFFBEB; }
/* Width-only icon contracts: retain the icon library's height and other attributes. */
.kid-ui-icon-width-12 { width: 12px; }
.kid-ui-icon-width-14 { width: 14px; }
.kid-ui-icon-width-15 { width: 15px; }
.kid-ui-icon-width-16 { width: 16px; }
.kid-ui-icon-width-18 { width: 18px; }
.kid-ui-icon-width-20 { width: 20px; }

/* Shared page/workspace primitives. */
:where(.kid-ui-page) { box-sizing: border-box; background: var(--kid-surface); color: var(--kid-text); }
:where(.kid-ui-page-header) { display:flex; align-items:center; justify-content:space-between; gap:var(--kid-space-16); padding:var(--kid-space-16) 0; border:0; border-radius:0; background:var(--kid-surface); }
:where(.kid-ui-page-header__copy) { min-width:0; }
:where(.kid-ui-page-header h1) { margin:0; color:var(--kid-text); font:700 20px/1.3 var(--kid-font-sans); }
:where(.kid-ui-page-header p) { margin:var(--kid-space-4) 0 0; color:var(--kid-muted); font:400 12px/1.5 var(--kid-font-sans); }
:where(.kid-ui-muted) { color:var(--kid-muted); font-size:12px; }
:where(.kid-ui-count) { min-width:20px; display:inline-flex; align-items:center; justify-content:center; padding:2px var(--kid-space-6); border-radius:var(--kid-radius-pill); background:var(--kid-surface-soft); color:var(--kid-text-secondary); font-size:10px; }
:where(.kid-ui-stat__icon--info) { background:linear-gradient(145deg,#2D79EE,#1458D5); }
:where(.kid-ui-stat__icon--warning) { background:linear-gradient(145deg,#F7C51F,#D98A00); }
:where(.kid-ui-stat__icon--danger) { background:linear-gradient(145deg,#FF6872,#E33B45); }
:where(.kid-ui-stat__icon--success) { background:transparent; }
:where(.kid-ui-stat__icon img) { width:22px; height:22px; object-fit:contain; display:block; }
:where(.kid-ui-stat__icon--success img) { width:34px; height:34px; }
:where(.kid-ui-panel-title) { display:flex; align-items:center; gap:var(--kid-space-6); min-width:0; }
:where(.kid-ui-panel-title svg) { width:16px; height:16px; color:var(--kid-brand-800); }

:where(.kid-ui-page-eyebrow) { display:block; margin-bottom:var(--kid-space-4); color:var(--kid-brand-800); font:700 10px/1.4 var(--kid-font-sans); letter-spacing:.06em; text-transform:uppercase; }
:where(.kid-ui-actions) { display:flex; align-items:center; gap:var(--kid-space-8); flex-wrap:wrap; }
:where(.kid-ui-button--success) { background:var(--kid-success); border-color:var(--kid-success); color:var(--kid-surface); }
:where(.kid-ui-button--compact), .kid-ui-actions--toolbar .kid-ui-button--compact { min-height:34px; padding:var(--kid-space-6) var(--kid-space-10); font-size:12px; }
:where(.kid-ui-button svg), .kid-ui-actions--toolbar .kid-ui-button svg { width:15px; height:15px; }
/* Opt-in toolbar contract wins over page resets while reusing button variants. */
.kid-ui-actions--toolbar .kid-ui-button { flex:0 0 auto; white-space:nowrap; }
.kid-ui-actions--toolbar .kid-ui-button--secondary:hover:not(:disabled):not([aria-disabled="true"]) { background:var(--kid-surface-soft); border-color:var(--kid-brand-800); }
.kid-ui-actions--toolbar .kid-ui-button--brand:hover:not(:disabled):not([aria-disabled="true"]) { background:var(--kid-brand-900); border-color:var(--kid-brand-900); }
:where(.kid-ui-icon-button), .kid-ui-modal-panel .kid-ui-icon-button { box-sizing:border-box; width:var(--kid-control-height); height:var(--kid-control-height); display:inline-grid; place-items:center; padding:0; border:1px solid var(--kid-border-strong); border-radius:var(--kid-button-radius); background:var(--kid-surface); color:var(--kid-muted); cursor:pointer; }
:where(.kid-ui-icon-button--compact), .kid-ui-modal-panel .kid-ui-icon-button--compact { width:34px; height:34px; }
:where(.kid-ui-kpi-grid) { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--kid-space-10); }
:where(.kid-ui-stat) { appearance:none; min-height:72px; display:flex; align-items:center; gap:var(--kid-space-10); padding:var(--kid-space-12) var(--kid-space-14); border:1px solid var(--kid-border); border-radius:var(--kid-radius-12); background:var(--kid-surface); color:var(--kid-text); font:inherit; text-align:left; cursor:pointer; }
:where(.kid-ui-stat:hover) { border-color:var(--kid-border-strong); box-shadow:var(--kid-shadow-xs); }
:where(.kid-ui-stat__icon) { width:34px; height:34px; flex:0 0 34px; display:grid; place-items:center; overflow:hidden; border-radius:var(--kid-radius-pill); }
:where(.kid-ui-stat__copy span) { display:block; color:var(--kid-muted); font-size:11px; }
:where(.kid-ui-stat__copy strong) { display:block; color:var(--kid-text); font-size:20px; line-height:1.1; }
:where(.kid-ui-stat__copy small) { display:block; margin-top:2px; color:var(--kid-brand-800); font-size:10px; }
.kid-ui-stat--static { display:block; min-height:0; padding:var(--kid-space-10); border-radius:var(--kid-frame-radius,var(--kid-radius-8)); cursor:default; }
.kid-ui-stat--static:hover { border-color:var(--kid-border); box-shadow:none; }
.kid-ui-stat--static.kid-ui-stat--success { background:#F0FDF4; border-color:#BBF7D0; color:var(--kid-success); }
.kid-ui-stat--static.kid-ui-stat--warning { background:#FFFBEB; border-color:#FDE68A; color:#92400E; }

:where(.kid-ui-tabs) { width:max-content; max-width:100%; display:flex; gap:var(--kid-space-4); padding:3px; border:1px solid var(--kid-border); border-radius:var(--kid-radius-10); background:var(--kid-surface-soft); overflow:auto; }
:where(.kid-ui-tab) { min-height:34px; display:inline-flex; align-items:center; justify-content:center; gap:var(--kid-space-6); padding:0 var(--kid-space-10); border:0; border-radius:var(--kid-radius-8); background:transparent; color:var(--kid-muted); font:600 11px/1.4 var(--kid-font-sans); white-space:nowrap; cursor:pointer; }
:where(.kid-ui-tab.active, .kid-ui-tab[aria-selected="true"]) { background:var(--kid-surface); color:var(--kid-brand-800); box-shadow:var(--kid-shadow-xs); }
:where(.kid-ui-tab-count) { min-width:20px; padding:2px var(--kid-space-6); border-radius:var(--kid-radius-pill); background:var(--kid-border); color:var(--kid-text-secondary); font-size:10px; text-align:center; }
:where(.kid-ui-toolbar) { display:grid; grid-template-columns:minmax(280px,1fr) minmax(160px,200px) auto auto; gap:var(--kid-space-8); align-items:end; padding:var(--kid-space-8) var(--kid-space-10); border:1px solid var(--kid-border); border-radius:var(--kid-radius-10); background:var(--kid-surface); }
:where(.kid-ui-panel) { overflow:hidden; border:1px solid var(--kid-border); border-radius:var(--kid-radius-12); background:var(--kid-surface); }
:where(.kid-ui-panel-head) { display:flex; align-items:center; justify-content:space-between; gap:var(--kid-space-10); padding:var(--kid-space-12) var(--kid-space-14); border-bottom:1px solid var(--kid-border); background:var(--kid-surface); }
:where(.kid-ui-panel-head h2) { margin:0; color:var(--kid-brand-800); font:600 14px/1.5 var(--kid-font-sans); }
/* Shared checkbox filter control; keep native keyboard and form behavior. */
.kid-ui-check-control { box-sizing:border-box; min-height:38px; display:inline-flex; align-items:center; gap:var(--kid-space-8); padding:var(--kid-space-8) var(--kid-space-10); border:1px solid var(--kid-border-strong); border-radius:var(--kid-button-radius); background:var(--kid-surface); color:var(--kid-text-secondary); font:500 12px/1.4 var(--kid-font-sans); cursor:pointer; }
.kid-ui-check-control > input[type="checkbox"] { flex:0 0 16px; width:16px; height:16px; margin:0; accent-color:var(--kid-brand-800); cursor:inherit; }
.kid-ui-check-control > span { min-width:0; }
.kid-ui-check-control:hover { border-color:var(--kid-brand-800); }
.kid-ui-check-control:has(> input:checked) { border-color:var(--kid-brand-800); background:#EEF4FF; color:var(--kid-brand-800); }
.kid-ui-check-control:has(> input:focus-visible) { outline:2px solid var(--kid-button-focus); outline-offset:2px; }

/* Shared selectable product cards; the native checkbox owns pointer and keyboard selection. */
.kid-ui-selection-grid { display:grid; grid-template-columns:minmax(0,1fr); align-items:start; gap:var(--kid-space-8); overflow-x:auto; overflow-y:auto; max-height:var(--kid-selection-max-height,none); }
.kid-ui-selection-card { min-width:360px; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; overflow:hidden; border:1px solid var(--kid-border-strong); border-radius:var(--kid-selection-radius,var(--kid-radius-10)); background:var(--kid-surface); }
.kid-ui-selection-card__option { min-width:0; width:100%; display:grid; grid-template-columns:18px 56px minmax(0,1fr); align-items:center; column-gap:var(--kid-space-10); row-gap:2px; padding:var(--kid-selection-padding,var(--kid-space-12)); border:0; background:transparent; color:inherit; font:inherit; appearance:none; box-shadow:none; cursor:pointer; text-align:left; }
button.kid-ui-selection-card__option:hover { background:#F2F6FC; }
button.kid-ui-selection-card__option:focus-visible { outline:2px solid var(--kid-button-focus); outline-offset:-2px; }
.kid-ui-selection-card__check { grid-column:1; grid-row:1 / span 3; width:18px; height:18px; margin:0; accent-color:var(--kid-brand-800); cursor:inherit; }
.kid-ui-selection-card__image { grid-column:2; grid-row:1 / span 3; width:56px; height:56px; display:grid; place-items:center; background:var(--kid-surface); color:var(--kid-muted); font:400 12px/1.5 var(--kid-font-sans); }
.kid-ui-selection-card__image img { width:100%; height:100%; object-fit:contain; }
.kid-ui-selection-card__name { grid-column:3; min-width:0; color:var(--kid-text); font:600 14px/1.5 var(--kid-font-sans); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.kid-ui-selection-card__meta { grid-column:3; min-width:0; color:var(--kid-muted); font:400 12px/1.5 var(--kid-font-sans); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.kid-ui-selection-card__details { width:100px; padding:var(--kid-space-8) var(--kid-space-12) var(--kid-space-8) 0; }
.kid-ui-selection-card:has(.kid-ui-selection-card__check:checked) { border-color:var(--kid-brand-800); background:#EEF4FF; box-shadow:inset 0 0 0 1px var(--kid-brand-800); }
.kid-ui-selection-card:has(.kid-ui-selection-card__check:focus-visible) { outline:2px solid var(--kid-button-focus); outline-offset:2px; }
.kid-ui-selection-card:has(.kid-ui-selection-card__check:disabled) .kid-ui-selection-card__option { cursor:wait; }
.kid-ui-alert { margin-block:var(--kid-space-12); padding:var(--kid-space-12) var(--kid-space-16); line-height:1.7; border:1px solid var(--kid-border); border-radius:var(--kid-frame-radius,var(--kid-radius-10)); background:var(--kid-surface-soft); color:var(--kid-text-secondary); }
:where(.kid-ui-alert--success) { border-color:#BBF7D0; background:#F0FDF4; color:#166534; }
:where(.kid-ui-alert--warning) { border-color:#FDE68A; background:#FFFBEB; color:#92400E; }
:where(.kid-ui-alert--danger) { border-color:#FECACA; background:#FEF2F2; color:#991B1B; }
:where(.kid-form-stack) { display:flex; flex-direction:column; gap:var(--kid-space-6); min-width:0; }
:where(.kid-ui-divider) { height:1px; margin:var(--kid-space-20) 0; background:var(--kid-border); }
@media (max-width:900px) { :where(.kid-ui-toolbar) { grid-template-columns:1fr; } }
@media (max-width:700px) { :where(.kid-ui-kpi-grid) { grid-template-columns:repeat(2,minmax(0,1fr)); } :where(.kid-ui-page-header) { align-items:flex-start; flex-direction:column; } }
/* Existing soft form variant; intentionally does not inherit canonical control
 * height, typography or focus styling. Existing field classes retain those. */
input.kid-ui-control-soft,
select.kid-ui-control-soft,
textarea.kid-ui-control-soft {
    width: 100%;
    padding: var(--kid-space-12);
    border-radius: var(--kid-radius-12);
    border: 1px solid var(--kid-control-soft-border);
    background: var(--kid-control-soft-background);
}

:where(.kid-ui-status--danger) { color: var(--kid-danger); background: #FEF2F2; }
:where(.kid-ui-status--info) { color: var(--kid-info); background: #EFF6FF; }
:where(.kid-ui-status--neutral) { color: var(--kid-muted); background: var(--kid-surface-soft); }
:where(.kid-ui-help, .kid-form-help) { margin: var(--kid-space-4) 0 0; color: var(--kid-muted); font: 400 11px/1.5 var(--kid-font-sans); }
:where(.kid-ui-error, .kid-form-error) { margin: var(--kid-space-4) 0 0; color: var(--kid-danger); font: 400 12px/1.5 var(--kid-font-sans); }
:where(.kid-form-error-summary) {
    margin: 0 0 var(--kid-space-12);
    padding: var(--kid-space-12);
    border: 1px solid var(--kid-danger);
    border-radius: var(--kid-radius-10);
    background: #FEF2F2;
    color: var(--kid-danger);
    font: 400 12px/1.5 var(--kid-font-sans);
}
:where(.kid-ui-empty, .kid-data-empty) { padding: var(--kid-space-24); text-align: center; color: var(--kid-muted); }
:where(.kid-ui-table-shell, .kid-data-table-shell) { max-width: 100%; overflow: auto; border: 1px solid var(--kid-border); border-radius: var(--kid-radius-10); }
:where(.kid-data-table) { width: 100%; border-collapse: collapse; font-size: 12px; color: var(--kid-text); }
:where(.kid-data-table > thead > tr > th, .kid-data-table > tbody > tr > td) { padding: var(--kid-space-10); border-bottom: 1px solid var(--kid-border); text-align: start; }
:where(.kid-data-table > thead > tr > th) { background: var(--kid-surface-soft); color: var(--kid-text-secondary); font-weight: 600; }
:where(.kid-data-grid-table) { width: 100%; max-width: 100%; overflow: auto; border: 1px solid var(--kid-border); border-radius: var(--kid-radius-10); background: var(--kid-surface); color: var(--kid-text); font-size: 12px; }
:where(.kid-data-grid-table > .kid-data-grid-head) { min-height: 42px; align-items: center; background: var(--kid-accent); color: var(--kid-surface); }
:where(.kid-data-grid-table > .kid-data-grid-head > .kid-data-grid-cell) { min-width: 0; padding: 11px var(--kid-space-10); font-size: 11px; font-weight: 600; line-height: 1.25; }
:where(.kid-data-grid-table > .kid-data-grid-row) { background: var(--kid-surface); border-bottom: 1px solid #E8EDF4; }
:where(.kid-data-grid-table > .kid-data-grid-row:last-child) { border-bottom: 0; }
:where(.kid-data-grid-table > .kid-data-grid-row > .kid-data-grid-cell) { min-width: 0; padding: 11px var(--kid-space-10); }
:where(.kid-data-grid-table > .kid-data-grid-row:hover) { background: #FBFDFF; }
:where(.kid-data-caption) { padding: var(--kid-space-10); color: var(--kid-muted); text-align: start; font-size: 11px; }
/* Existing history styles own toolbar, search, pagination and fill geometry.
 * Preserve native hidden states even for primitives with display declarations.
 */
:where(.kid-ui-button, .kid-ui-status, .kid-data-status, .kid-ui-label, .kid-form-label)[hidden], :is(.kid-ui-modal-panel,.oc-dialog) .kid-ui-button[hidden] { display: none; }
@media (max-width: 768px) {
    :where(.kid-ui-control, .kid-form-control), .kid-ui-modal-panel :is(.kid-ui-control, .kid-form-control) { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
    :where(.kid-ui-control, .kid-form-control) { transition: none; }
}

/* Shared workflow primitives: quotation / task / assignment */
:where(.kid-form-field--stack), .kid-ui-modal-panel .kid-form-field--stack{display:flex;flex-direction:column;gap:var(--kid-space-6);}
:where(.kid-form-label svg,.kid-form-label i){width:14px;height:14px;flex:0 0 14px;color:var(--kid-brand-800);}
:where(.kid-ui-control--strong){font-weight:600;}
:where(select.kid-ui-control--native-select){appearance:auto;}
:where(.kid-ui-section-title){display:flex;align-items:center;gap:var(--kid-space-6);margin:0 0 var(--kid-space-12);color:var(--kid-text);font:700 13px/1.4 var(--kid-font-sans);}
:where(.kid-ui-section-title svg,.kid-ui-section-title i){width:16px;height:16px;flex:0 0 16px;}
:where(.kid-ui-action-row){display:flex;align-items:center;justify-content:flex-end;gap:var(--kid-space-10);width:100%;margin-top:var(--kid-space-10);padding-top:var(--kid-space-12);border-top:1px solid var(--kid-border);}
:where(.kid-ui-stepper){position:relative;display:flex;justify-content:space-between;width:100%;margin:0 0 var(--kid-space-16);padding:0 var(--kid-space-12);}
:where(.kid-ui-stepper)::before{content:'';position:absolute;top:15px;left:40px;right:40px;height:2px;background:var(--kid-border);}
:where(.kid-ui-stepper__item){position:relative;z-index:1;display:flex;flex:1 1 0;flex-direction:column;align-items:center;gap:var(--kid-space-6);}
:where(.kid-ui-stepper__dot){width:30px;height:30px;display:grid;place-items:center;border:2px solid var(--kid-border-strong);border-radius:var(--kid-radius-pill);background:var(--kid-surface);color:var(--kid-muted);}
:where(.kid-ui-stepper__label){color:var(--kid-muted);font:700 10px/1.2 var(--kid-font-sans);}
:where(.kid-ui-stepper__item.active .kid-ui-stepper__dot){border-color:var(--kid-brand-800);color:var(--kid-brand-800);}
:where(.kid-ui-stepper__item.active .kid-ui-stepper__label){color:var(--kid-brand-800);}
:where(.kid-ui-stepper__item.completed .kid-ui-stepper__dot){border-color:var(--kid-success);color:var(--kid-success);}
:where(.kid-ui-stepper__item.completed .kid-ui-stepper__label){color:var(--kid-success);}
@media(max-width:700px){:where(.kid-ui-action-row){align-items:stretch;flex-direction:column-reverse;}:where(.kid-ui-action-row .kid-ui-button){width:100%;}}
/* Shared search / filter primitives. */
:where(.kid-ui-search,.kid-ui-select-shell){position:relative;display:flex;align-items:center;min-width:0;width:100%}
:is(.kid-ui-search,.kid-ui-select-shell)>.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.kid-ui-search>svg,.kid-ui-search>i,.kid-ui-select-shell>svg,.kid-ui-select-shell>i{position:absolute;top:50%;left:12px;width:15px;height:15px;transform:translateY(-50%);color:var(--kid-muted);pointer-events:none;z-index:1}
.kid-ui-search__input.kid-ui-control,.kid-ui-select.kid-ui-control{box-sizing:border-box;width:100%;height:40px;min-height:40px;padding-top:0;padding-bottom:0;border-radius:var(--kid-radius-8);background:var(--kid-surface);font-size:11px;line-height:1.4}
.kid-ui-search__input.kid-ui-control{padding-left:38px;padding-right:13px}
.kid-ui-select.kid-ui-control{appearance:none;padding-left:38px;padding-right:34px;cursor:pointer}
:where(.kid-ui-select-shell)::after{content:"";position:absolute;right:14px;width:7px;height:7px;border-right:1.5px solid var(--kid-muted);border-bottom:1.5px solid var(--kid-muted);transform:rotate(45deg) translateY(-2px);pointer-events:none}
:where(.kid-ui-toolbar){display:flex;align-items:center;gap:var(--kid-space-10);min-width:0}
:where(.kid-ui-toolbar--search-filter){display:grid;grid-template-columns:minmax(0,1fr) 190px;margin:0 0 var(--kid-space-12);padding:var(--kid-space-10);border:1px solid var(--kid-border);border-radius:var(--kid-radius-10);background:var(--kid-surface-soft)}
:where(.kid-ui-filter-bar){display:flex;align-items:center;gap:var(--kid-space-6);flex-wrap:wrap;min-height:38px;margin:0 0 var(--kid-space-12);padding:0}
:where(.kid-ui-filter-label){margin-right:2px;color:var(--kid-text-secondary);font-size:10px;font-weight:600}
:where(.kid-ui-filter-pill){appearance:none;display:inline-flex;align-items:center;justify-content:center;height:34px;min-width:54px;padding:0 var(--kid-space-14);border:1px solid var(--kid-border-strong);border-radius:var(--kid-radius-8);background:var(--kid-surface);color:var(--kid-text-secondary);font:600 10.5px/1 var(--kid-font-sans);cursor:pointer;box-shadow:0 1px 2px rgba(15,23,42,.03);transition:border-color var(--kid-motion-fast) var(--kid-motion-ease),background var(--kid-motion-fast) var(--kid-motion-ease),color var(--kid-motion-fast) var(--kid-motion-ease),box-shadow var(--kid-motion-fast) var(--kid-motion-ease)}
:where(.kid-ui-filter-pill:hover){border-color:#AFC7DD;background:#F8FBFF;color:var(--kid-brand-800)}
:where(.kid-ui-filter-pill:focus-visible){outline:2px solid transparent;box-shadow:var(--kid-focus-ring)}
:where(.kid-ui-filter-pill.is-active){border-color:var(--kid-action-lime);background:var(--kid-action-lime);color:var(--kid-surface);box-shadow:var(--kid-action-lime-shadow)}
:where(.kid-ui-filter-pill.is-active:hover){border-color:var(--kid-action-lime-hover);background:var(--kid-action-lime-hover);box-shadow:var(--kid-action-lime-shadow-hover)}
:where(.kid-ui-filter-pill--danger){border-color:var(--kid-danger);background:var(--kid-danger);color:var(--kid-surface)}
:where(.kid-ui-filter-pill--danger:hover,.kid-ui-filter-pill--danger.is-active,.kid-ui-filter-pill--danger.is-active:hover){border-color:#B91C1C;background:#B91C1C;color:var(--kid-surface);box-shadow:0 1px 2px rgba(15,23,42,.03)}
:where(.kid-ui-filter-bar--tabs){flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden}
.kid-ui-filter-bar.kid-ui-filter-bar--tabs{gap:var(--kid-space-12)}
.kid-ui-filter-bar--tabs>.kid-ui-filter-pill{position:relative;flex:0 0 auto;height:40px;min-width:0;padding:0 var(--kid-space-10);border:0;border-radius:0;background:transparent;color:var(--kid-text-secondary);font:600 11px/1 var(--kid-font-sans);box-shadow:none;text-decoration:none}
.kid-ui-filter-bar--tabs>.kid-ui-filter-pill:hover{border:0;background:transparent;color:var(--kid-brand-800);box-shadow:none}
.kid-ui-filter-bar--tabs>.kid-ui-filter-pill.is-active{border:0;background:transparent;color:var(--kid-brand-800);box-shadow:none}
.kid-ui-filter-bar--tabs>.kid-ui-filter-pill.is-active::after{content:"";position:absolute;right:var(--kid-space-10);bottom:0;left:var(--kid-space-10);height:2px;border-radius:2px;background:var(--kid-brand-800)}
:where(.kid-ui-filter-field){display:flex;flex-direction:column;gap:5px;min-width:0}
:where(.kid-ui-filter-field)>label{margin:0;color:var(--kid-muted);font-size:9.5px;font-weight:600}
@media(max-width:760px){:where(.kid-ui-toolbar--search-filter){grid-template-columns:1fr}:where(.kid-ui-select-shell){width:100%}}
.kid-save-feedback{box-sizing:border-box;width:100%;margin:12px 0;padding:11px 16px;border:1px solid #bbebc9;border-radius:5px;background:#f0fdf4;color:#166534;font-size:13px;font-weight:600}
.kid-save-feedback.is-error{border-color:#fecaca;background:#fef2f2;color:#991b1b}

:where(.kid-ui-facts){display:grid;gap:10px;margin:0}
:where(.kid-ui-facts__row){display:grid;grid-template-columns:90px minmax(0,1fr);align-items:start;gap:10px}
:where(.kid-ui-facts__row[hidden]){display:none}
:where(.kid-ui-facts dt){color:var(--kid-muted);font-size:12px;line-height:1.6}
:where(.kid-ui-facts dd){min-width:0;margin:0;color:var(--kid-text-secondary);font-size:12px;line-height:1.6;overflow-wrap:anywhere}

/* Amount summaries keep labels and values aligned without separate table columns. */
.kid-ui-facts--amounts{gap:6px}
.kid-ui-facts--amounts .kid-ui-facts__row{grid-template-columns:minmax(80px,1fr) minmax(0,1.35fr);gap:12px}
.kid-ui-facts--amounts dd{text-align:right;font-variant-numeric:tabular-nums;overflow-wrap:normal}
.kid-ui-facts--amounts dd>strong{font-weight:600;white-space:nowrap}
.kid-ui-facts--amounts dd>small{display:block;margin-top:3px;color:var(--kid-muted);font-size:10px;line-height:1.4;white-space:normal}
.kid-ui-facts__row--success dd{color:var(--kid-success)}
.kid-ui-facts__row--warning dd{color:var(--kid-warning,#B45309)}
.kid-ui-facts__row--danger dd{color:var(--kid-danger)}

/* Shared tracking cards: procurement and delivery orders. */
.kid-tracking-list{display:flex;flex-direction:column;gap:12px}
.kid-tracking-list.kid-tracking-list--separated{gap:16px;padding:0;background:transparent}
.kid-tracking-list[hidden]{display:none}
.kid-tracking-card{background:var(--kid-tracking-surface,#fff);border:0;border-radius:0;box-shadow:0 1px 1px rgba(0,0,0,.05)}
.kid-tracking-card.kid-tracking-card--outlined{border:1px solid var(--kid-border-strong)}
.kid-tracking-card--compact{--kid-tracking-inset:16px;--kid-tracking-head-top:12px;--kid-tracking-foot-bottom:12px;--kid-tracking-foot-bg:var(--kid-surface);--kid-tracking-foot-color:var(--kid-text);--kid-tracking-foot-danger:var(--kid-danger);--kid-tracking-image-size:56px;--kid-tracking-row-height:72px;--kid-tracking-row-padding:8px;--kid-tracking-product-text:14px;--kid-tracking-product-meta:12px;box-shadow:none}
.kid-tracking-card__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 var(--kid-tracking-inset,24px);padding:var(--kid-tracking-head-top,24px) 0 12px;border-bottom:1px solid #e8e8e8;background:var(--kid-tracking-surface,#fff);color:#222}
.kid-tracking-card__identity{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0;font-size:14px}
.kid-tracking-card__identity strong{font-weight:600;white-space:nowrap}
.kid-tracking-card__identity>span:not(.kid-tracking-card__kind):not(.kid-ui-status){color:#757575;font-size:12px;overflow-wrap:anywhere}
.kid-tracking-card__kind{padding:1px 4px;border-radius:2px;background:#2498c5;color:#fff;font-size:12px;line-height:1.3;font-weight:600}
.kid-tracking-card__products{padding:0 var(--kid-tracking-inset,24px)}
.kid-tracking-product{display:grid;grid-template-columns:var(--kid-tracking-image-size,82px) minmax(0,1fr) auto;align-items:center;gap:12px;min-height:var(--kid-tracking-row-height,106px);padding:var(--kid-tracking-row-padding,12px) 0;border-bottom:1px solid #e8e8e8}
.kid-tracking-product:last-child{border-bottom:0}
.kid-tracking-product--waiting,.od-item.od-item--waiting{background:var(--kid-surface-muted,#F8FAFC)}
.kid-tracking-product--waiting .kid-tracking-product__copy strong,.kid-tracking-product--waiting .kid-tracking-product__quantity,.od-item--waiting .od-item-code,.od-item--waiting .od-item-name,.od-item--waiting .od-item-qty{color:var(--kid-text-muted,#64748B)}
.kid-tracking-product--waiting .kid-tracking-product__image img,.od-item--waiting .od-item-img{filter:grayscale(1);opacity:.65}
.od-item--waiting .od-item-review{background:#E2E8F0;color:#475569}
.kid-tracking-product__image{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--kid-tracking-image-size,82px);height:var(--kid-tracking-image-size,82px);overflow:hidden;background:#fff;border:1px solid #e1e1e1;border-radius:0;color:#bbb}
.kid-tracking-product__image img{width:calc(var(--kid-tracking-image-size,82px) - 2px);height:calc(var(--kid-tracking-image-size,82px) - 2px);object-fit:contain}
.kid-tracking-product__image svg{width:28px;height:28px}
.kid-tracking-product__copy{display:flex;flex-direction:column;gap:3px;min-width:0}
.kid-tracking-product__copy strong{color:rgba(0,0,0,.87);font-size:var(--kid-tracking-product-text,16px);font-weight:400;line-height:1.5;overflow-wrap:anywhere}
.kid-tracking-product__copy span{color:#757575;font-size:var(--kid-tracking-product-meta,14px);line-height:1.5}
.kid-tracking-product__copy small{color:#757575;font-size:12px;line-height:1.5;overflow-wrap:anywhere}
.kid-tracking-product__quantity{color:#333;font-size:14px;line-height:1.5;white-space:nowrap}
.kid-tracking-disclosure summary{display:flex;align-items:center;justify-content:center;gap:8px;min-height:38px;margin:0 var(--kid-tracking-inset,24px);padding:8px 0;border-top:1px solid #e8e8e8;background:var(--kid-tracking-surface,#fff);color:#757575;font-size:13px;list-style:none;cursor:pointer}
.kid-tracking-disclosure summary:hover{color:#2498c5}
.kid-tracking-disclosure summary::-webkit-details-marker{display:none}
.kid-tracking-disclosure summary>span{display:inline-flex;align-items:center;gap:6px}
.kid-tracking-disclosure summary svg{width:15px;height:15px}
.kid-tracking-disclosure[open]>summary{display:none}
.kid-tracking-disclosure__collapse{display:flex;align-items:center;justify-content:center;gap:7px;width:calc(100% - 2 * var(--kid-tracking-inset,24px));min-height:38px;margin:0 var(--kid-tracking-inset,24px) 12px;padding:8px 14px;border:1px solid #e8e8e8;border-radius:2px;background:#fff;color:#757575;font-family:inherit;font-size:13px;font-weight:400;line-height:1.4;cursor:pointer}
.kid-tracking-disclosure__collapse:hover{color:#2498c5;border-color:#2498c5}
.kid-tracking-disclosure__collapse:focus-visible{outline:2px solid #2498c5;outline-offset:3px}
.kid-tracking-disclosure__collapse svg{width:15px;height:15px}
.kid-tracking-card__foot{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px var(--kid-tracking-inset,24px) var(--kid-tracking-foot-bottom,24px);background:var(--kid-tracking-foot-bg,#fffefb)}
@media(max-width:900px){.kid-tracking-card__head{align-items:flex-start;flex-direction:column}.kid-tracking-card__foot{align-items:flex-start;flex-direction:column}}
@media(max-width:600px){.kid-tracking-card__head{margin-left:16px;margin-right:16px}.kid-tracking-card__products{padding-left:16px;padding-right:16px}.kid-tracking-product{grid-template-columns:var(--kid-tracking-image-size,82px) minmax(0,1fr);gap:10px}.kid-tracking-product__copy strong{font-size:14px}.kid-tracking-product__copy span{font-size:12px}.kid-tracking-product__quantity{grid-column:2}.kid-tracking-card__foot{padding-left:16px;padding-right:16px}}

/* Readable square workspace: central owner for order presentation. */
.kid-data-view--readable-square{--kid-readable-radius:4px;--kid-readable-text-size:15px;--kid-readable-label-size:14px;--kid-readable-title-size:26px;font-size:var(--kid-readable-text-size);line-height:1.6}

#section-orders{
    --kid-readable-text-size: 14px;
    --kid-frame-radius: 0px;
    --kid-readable-label-size: 12px;
    --od-brand: #2498c5;
    --od-brand-2: #1d85ae;
    --od-text: #222;
    --od-muted: #757575;
    --od-border: #e8e8e8;
    --od-soft: #f5f5f5;
    font-family: var(--kid-font-sans);
    font-weight: 400;
    line-height: 1.5;
    min-height: calc(100dvh - 60px);
    padding: 14px 20px 28px;
    background: #fff;
    box-sizing: border-box}
#section-orders *{box-sizing:border-box}.od-page{width:100%;min-width:0;margin:0}.od-page--empty{display:flex;flex-direction:column;min-height:calc(100dvh - 36px)}.od-page--empty>.od-layout{flex:1;align-items:stretch}.od-page--empty .od-list,.od-page--empty .od-detail{display:flex;flex-direction:column}.od-page--empty .od-empty,.od-page--empty .od-detail-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.od-page--empty .od-detail-empty[hidden]{display:none}.od-card{
    border: 1px solid var(--od-border);
    border-radius: 2px;
    background: #fff;
    box-shadow: none}
.od-hero{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 0}
#section-home .dashboard-home-title{display:flex;align-items:center;gap:12px;min-width:0}
#section-home .dashboard-home-title-icon{width:40px;height:40px;flex:0 0 40px;border-radius:4px;background:#EDF4FF;color:#2458A6;display:grid;place-items:center}
#section-home .dashboard-home-title-icon :is(svg,i){width:20px;height:20px}
#section-home .dashboard-home-title h1{margin:0;color:#172B4D;font-size:18px;font-weight:700;line-height:1.3}
#section-home .dashboard-home-title p{margin:3px 0 0;color:#8492A6;font-size:11px;line-height:1.5}
.od-search{
    display: flex;
    align-items: center;
    gap: 0;
    background: #eaeaea;
    border-radius: 2px}.od-search-field{
    width: auto;
    min-width: 0;
    flex: 1;
    height: 44px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 16px;
    border: 0;
    border-radius: 2px;
    background: transparent}.od-search-field:focus-within{
    outline: 2px solid #2498c5;
    outline-offset: 2px;
    box-shadow: none}.od-search-field svg{width:16px;color:#64748B}.od-search-field input{width:100%;border:0;outline:0;background:transparent;font:inherit;font-size:var(--kid-readable-text-size);color:var(--od-text)}.od-search-submit,.od-search-clear{
    height: 44px;
    border-radius: 0;
    font: 400 14px var(--kid-font-sans);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    white-space: nowrap}.od-search-submit{
    padding: 0 16px;
    border: 0;
    border-left: 1px solid #d5d5d5;
    background: transparent;
    color: #555;
    cursor: pointer}.od-search-clear{
    padding: 0 12px;
    border: 0;
    border-left: 1px solid #d5d5d5;
    background: transparent;
    color: #555;
    text-decoration: none}.od-search-clear[hidden]{display:none}
.od-filters{
    display: flex;
    align-items: stretch;
    gap: 0;
    overflow-x: auto;
    background: #fff;
    border-bottom: 1px solid #e8e8e8}.od-filter{
    min-height: 54px;
    padding: 16px 14px 14px;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    background: #fff;
    text-decoration: none;
    display: flex;
    flex: 1 0 auto;
    align-items: center;
    justify-content: center;
    gap: 5px;
    white-space: nowrap;
    color: #333}.od-filter:hover{
    color: #2498c5;
    background: #fafafa}.od-filter.active{
    border-bottom-color: #2498c5;
    background: #fff;
    color: #2498c5;
    box-shadow: none}.od-filter-copy{
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0;
    color: inherit;
    font-size: 14px;
    font-weight: 400}.od-filter-count{
    font-size: 13px;
    font-weight: 400;
    color: #2498c5;
    font-variant-numeric: tabular-nums}
.od-context{
    min-height: 24px;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px}.od-context-main,.od-context-meta{display:flex;align-items:center;gap:7px;min-width:0;color:#64748B;font-size:var(--kid-readable-label-size)}.od-context strong{color:#334155}.od-query-chip{max-width:280px;padding:4px 8px;border-radius:var(--kid-readable-radius);background:#EEF4FF;color:#1A3D7C;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.od-reset-link{color:#1A3D7C;font-weight:800;text-decoration:none}

.od-layout{
    display: grid;
    grid-template-columns: minmax(0,1fr) 360px;
    gap: 24px;
    align-items: start}

.od-main{display:flex;flex-direction:column;gap:12px;min-width:0}

.od-filter-total{color:#2498c5;font-size:13px}.od-list{overflow:hidden;border:0;background:transparent}.od-list-head{
    min-height: 60px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--od-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    background: #fff}.od-list-head h2{margin:0;color:var(--od-text);font-size:var(--kid-readable-text-size)}.od-list-head p{margin:3px 0 0;color:#64748B;font-size:var(--kid-readable-label-size)}.od-list>[data-orders-list]{margin-top:12px}.od-list-count{padding:5px 8px;border-radius:var(--kid-readable-radius);background:#F1F5F9;color:#475569;font-size:var(--kid-readable-label-size);font-weight:800;white-space:nowrap}
.od-row{cursor:pointer;outline:0;transition:box-shadow .12s}.od-row:hover{box-shadow:inset 3px 0 0 #cbdde6,0 1px 1px rgba(0,0,0,.05)}.od-row[aria-pressed="true"]{box-shadow:inset 3px 0 0 #2498c5}.od-row:focus-visible{outline:2px solid #4F7DB8;outline-offset:-2px}.od-ref{font-size:var(--kid-readable-text-size);font-weight:600;color:#163B76}.od-meta-line{margin-top:3px;color:var(--od-footer-text,#64748B);font-size:var(--kid-readable-label-size);line-height:1.4}.od-type-badge{display:flex;max-width:100%;align-items:center;gap:8px;margin-top:7px;padding:0;color:#475569;font-size:13px;font-weight:500;line-height:1.5}.od-type-badge img{width:24px;height:24px;flex:0 0 24px;object-fit:contain}.od-type-badge--inline{display:inline-flex;margin-top:0;vertical-align:middle}.od-customer{min-width:0}.od-customer strong{font-weight:500;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;color:var(--od-footer-text,#1E293B);line-height:1.4}.od-date{font-variant-numeric:tabular-nums}.od-transport{margin-top:4px;color:var(--od-footer-text,#64748B);font-size:var(--kid-readable-label-size)}
.od-card-origin{margin:0 var(--kid-tracking-inset,24px);padding:8px 0 0}.od-card-footer{--od-footer-text:var(--kid-tracking-foot-color,#1E293B);--kid-countdown-danger:var(--kid-tracking-foot-danger,var(--kid-danger));color:var(--od-footer-text);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:12px 20px;border-top:1px dotted rgba(0,0,0,.09)}.od-card-party,.od-card-delivery{min-width:0}.od-card-review{grid-column:1/-1}
.od-status{display:inline-flex;max-width:100%;align-items:center;gap:5px;padding:4px 6px;border-radius:var(--kid-readable-radius);font-size:var(--kid-readable-label-size);font-weight:600;white-space:normal}.od-status-dot{flex:0 0 6px;width:6px;height:6px;border-radius:50%;background:currentColor}.od-review-note{margin-top:5px;color:#F97316;font-size:var(--kid-readable-label-size);font-weight:850}
.od-empty{padding:56px 24px;text-align:center;color:#64748B}.od-empty-icon{width:36px;height:36px;margin:0 auto 10px;border-radius:var(--kid-readable-radius);background:#F1F5F9;display:grid;place-items:center;color:#64748B}.od-empty-icon svg{width:23px}.od-empty strong{display:block;color:#334155;font-size:var(--kid-readable-text-size)}.od-empty p{margin:5px auto 12px;max-width:420px;font-size:var(--kid-readable-label-size);line-height:1.55}.od-empty a{color:#1A3D7C;font-size:var(--kid-readable-label-size);font-weight:850;text-decoration:none}
.od-pagination{padding:10px 13px;border-top:1px solid var(--od-border);display:flex;align-items:center;justify-content:flex-end;gap:7px}.od-page-link,.od-page-current{min-height:42px;padding:0 10px;border:1px solid var(--od-border);border-radius:var(--kid-readable-radius);display:inline-flex;align-items:center;justify-content:center;color:#334155;font-size:var(--kid-readable-label-size);text-decoration:none}.od-page-current{background:#F8FAFC;color:#64748B}.od-page-link.disabled{opacity:.45;pointer-events:none}

.od-detail{
    position: sticky;
    top: 20px;
    overflow: hidden;
    max-height: calc(100dvh - 40px);
    display: flex;
    flex-direction: column}.od-detail-head{
    padding: 16px;
    border-top: 3px solid var(--kid-accent);
    border-bottom: 1px solid var(--od-border);
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px}.od-detail-kicker{margin-bottom:6px;color:var(--kid-muted);font-size:var(--kid-readable-label-size);font-weight:500}.od-detail-head h2{margin:0;color:var(--kid-brand-800);font-size:18px;font-weight:600;line-height:1.4;overflow-wrap:anywhere}.od-detail-ref{margin-top:4px;color:#64748B;font-size:var(--kid-readable-label-size);line-height:1.4}.od-detail-body{
    min-height: 0;
    overflow-y: auto;
    padding: 16px}.od-detail-empty{padding:30px 18px;text-align:center;color:#64748B}.od-detail-empty svg{width:28px;height:28px;margin-bottom:7px;color:#CBD5E1}.od-detail-empty strong{display:block;color:#334155;font-size:var(--kid-readable-text-size)}.od-detail-empty p{margin:5px 0 0;font-size:var(--kid-readable-label-size);line-height:1.5}
.od-summary{
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 8px;
    margin-bottom: 16px}.od-summary-item{
    min-height: 60px;
    padding: 10px;
    border: 1px solid var(--kid-border);
    border-radius: 0;
    background: var(--kid-surface)}.od-summary-item span{display:block;color:var(--kid-muted);font-size:11px;font-weight:500;line-height:1.4}.od-summary-item strong{display:block;margin-top:5px;color:var(--kid-brand-800);font-size:13px;font-weight:600;line-height:1.4;overflow-wrap:anywhere}.od-section{
    padding: 0 0 16px;
    margin: 0 0 16px;
    border-bottom: 1px solid #e8e8e8}.od-section:last-child{border:0;margin-bottom:0}.od-section:empty{display:none}.od-section-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.od-section-meta{align-self:flex-start;color:#64748B;font-size:var(--kid-readable-label-size)}.od-detail-main{color:var(--kid-text);font-size:var(--kid-readable-text-size);font-weight:600;line-height:1.5}.od-detail-line{margin-top:5px;color:#475569;font-size:var(--kid-readable-label-size);line-height:1.55;overflow-wrap:anywhere}.od-detail-line strong{color:#334155}.od-phone-link{color:var(--kid-brand-800);font-weight:500;text-decoration:none}.od-note{margin:12px 0 0;font-size:var(--kid-readable-label-size);line-height:1.5}.od-note:empty{display:none}
.od-items{display:grid;gap:7px}.od-item{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:8px;padding:10px 0;border:0;border-bottom:1px solid var(--kid-border);background:var(--kid-surface)}.od-item:last-child{border-bottom:0}.od-item>div{min-width:0}.od-item-img,.od-item-img-empty{width:44px;height:44px;border:1px solid #E2E8F0;border-radius:var(--kid-readable-radius);background:#fff}.od-item-img{object-fit:contain;padding:3px}.od-item-img-empty{display:grid;place-items:center;color:#64748B}.od-item-img-empty svg{width:15px}.od-item-code{color:var(--kid-brand-800);font-size:var(--kid-readable-label-size);font-weight:600;overflow-wrap:anywhere}.od-item-name{margin-top:3px;color:#475569;font-size:var(--kid-readable-label-size);line-height:1.35}.od-item-review{display:inline-flex;margin-top:4px;padding:2px 5px;border-radius:var(--kid-readable-radius);background:#FFF3E8;color:#C2410C;font-size:var(--kid-readable-label-size);font-weight:900}.od-item-qty{color:var(--kid-text-secondary);font-size:var(--kid-readable-label-size);font-weight:600;white-space:nowrap;text-align:right}
.od-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.od-btn{min-width:0}.od-btn[hidden]{display:none!important}.od-btn.full{grid-column:1/-1}
#section-orders .od-cancel-action{border:1px solid #fecaca;background:#fff;color:var(--kid-danger,#b91c1c);box-shadow:none}
#section-orders .od-cancel-action:hover:not(:disabled){background:#fef2f2;border-color:#f87171}
#section-orders .od-cancel-dialog{position:fixed;inset:0;width:min(520px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);margin:auto;padding:0;overflow:auto;border:1px solid var(--kid-border,#e2e8f0);border-radius:4px;background:#fff;color:var(--kid-text-secondary,#334155);font-size:13px;line-height:1.6}
#section-orders .od-cancel-dialog::backdrop{background:rgb(15 23 42 / 45%)}
#section-orders #quotation-cancellation-dialog{width:min(680px,calc(100vw - 32px));overflow:hidden}
#quotation-cancellation-dialog[open],#quotation-cancellation-form{display:flex;flex-direction:column;min-height:0;max-height:calc(100dvh - 32px)}
#section-orders #quotation-cancellation-form>header,#section-orders #quotation-cancellation-form>footer{flex-shrink:0}
#section-orders #quotation-cancellation-form>.od-cancel-dialog-body{overflow:auto;min-height:0;overscroll-behavior:contain}
#section-orders #quotation-cancellation-number{font-size:15px;font-weight:500;color:#173b68;margin-bottom:12px}
#quotation-cancellation-dialog .quotation-cancel-summary{margin-bottom:16px}
#quotation-cancellation-dialog .quotation-cancel-meta{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr);gap:14px;margin:0 0 16px}
#quotation-cancellation-dialog .quotation-cancel-meta dt{font-size:12px;color:#64748b;margin-bottom:3px}
#quotation-cancellation-dialog .quotation-cancel-meta dd{margin:0;overflow-wrap:anywhere;color:#243c58}
#quotation-cancellation-dialog .quotation-cancel-products-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 12px;background:#f4f7fb;border:1px solid #e2e8f0}
#quotation-cancellation-dialog .quotation-cancel-products-heading h3{font-size:13px;font-weight:500;margin:0}
#quotation-cancellation-dialog .quotation-cancel-products-heading>span{font-size:12px;color:#64748b}
#quotation-cancellation-dialog .quotation-cancel-products{list-style:none;padding:0;margin:0;border:1px solid #e2e8f0;border-top:0}
#quotation-cancellation-dialog .quotation-cancel-product{display:flex;align-items:center;gap:12px;padding:12px;min-width:0}
#quotation-cancellation-dialog .quotation-cancel-product+.quotation-cancel-product{border-top:1px solid #e8edf4}
#quotation-cancellation-dialog .quotation-cancel-product-image{width:54px;height:54px;flex:0 0 54px;display:flex;align-items:center;justify-content:center;border:1px solid #e2e8f0;background:#fff;color:#94a3b8;font-size:11px;overflow:hidden}
#quotation-cancellation-dialog .quotation-cancel-product-image img{width:100%;height:100%;object-fit:contain}
#quotation-cancellation-dialog .quotation-cancel-product-copy{flex:1;min-width:0;overflow-wrap:anywhere}
#quotation-cancellation-dialog .quotation-cancel-product-copy strong{font-weight:500}
#quotation-cancellation-dialog .quotation-cancel-product-copy small{margin-top:3px;font-size:12px}
#quotation-cancellation-dialog .quotation-cancel-product-quantity{flex-shrink:0;color:#173b68;font-variant-numeric:tabular-nums;white-space:nowrap}
#quotation-cancellation-dialog .quotation-cancel-products-empty{padding:12px;color:#64748b}
@media(max-width:560px){#quotation-cancellation-dialog .quotation-cancel-meta{grid-template-columns:1fr 1fr}#quotation-cancellation-dialog .quotation-cancel-meta>div:first-child{grid-column:1/-1}#quotation-cancellation-dialog .quotation-cancel-product{gap:9px}#quotation-cancellation-dialog .quotation-cancel-product-image{width:44px;height:44px;flex-basis:44px}}
#section-orders .od-cancel-dialog header,#section-orders .od-cancel-dialog footer{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 20px;border-bottom:1px solid var(--kid-border,#e2e8f0)}
#section-orders .od-cancel-dialog h2{margin:0;font-size:16px;font-weight:600}
#section-orders .od-cancel-dialog header button{width:32px;height:32px;border:1px solid var(--kid-border,#e2e8f0);background:#fff;color:#64748b;cursor:pointer;font-size:20px}
#section-orders .od-cancel-dialog-body{padding:16px 20px}
#section-orders .od-cancel-dialog-body p{margin:0 0 12px}
#section-orders .od-cancel-dialog-body label{display:block;margin-bottom:6px}
#section-orders .od-cancel-dialog textarea{box-sizing:border-box;width:100%;padding:10px;border:1px solid var(--kid-border-strong,#cbd5e1);font:inherit;resize:vertical}
#section-orders .od-cancel-dialog .od-cancel-return{display:flex;align-items:flex-start;gap:8px;margin:14px 0 6px}
#section-orders .od-cancel-return input{flex:0 0 auto;margin-top:4px}
#section-orders .od-cancel-dialog small{display:block;color:#64748b;font-size:11px}
#section-orders #od-cancel-order-error{margin:12px 0 0;color:var(--kid-danger,#b91c1c)}
#section-orders .od-cancel-dialog footer{justify-content:flex-end;border-top:1px solid var(--kid-border,#e2e8f0);border-bottom:0}
#section-orders .od-dialog-button{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:9px 16px;border:1px solid #cbd5e1;border-radius:4px;background:#fff;color:#334155;font:500 13px/1.5 var(--kid-font-sans,Arial,sans-serif);cursor:pointer;white-space:nowrap;text-decoration:none;box-shadow:none}
#section-orders .od-dialog-button--secondary:hover:not(:disabled){background:#f8fafc;border-color:#94a3b8}
#section-orders .od-dialog-button--danger{border-color:#c62828;background:#c62828;color:#fff}
#section-orders .od-dialog-button--danger:hover:not(:disabled){border-color:#a91f1f;background:#a91f1f}
#section-orders .od-dialog-button--primary{border-color:#15803d;background:#15803d;color:#fff}
#section-orders .od-dialog-button--primary:hover:not(:disabled){border-color:#166534;background:#166534}
#section-orders .od-dialog-button:disabled{opacity:.55;cursor:not-allowed}
#section-orders .od-dialog-button:focus-visible{outline:2px solid #219bc0;outline-offset:3px}
#section-orders .od-cancel-stock{margin:18px 0 12px}
#section-orders .od-cancel-stock h3{margin:0 0 8px;font-size:13px;font-weight:500}
.order-return-products{display:grid;gap:8px}
.order-return-product{display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid #e6ecf2;font-size:13px}
.order-return-image{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border:1px solid #e2e8f0;border-radius:4px;background:#fff;overflow:hidden}
.order-return-image img{width:100%;height:100%;object-fit:contain}
.order-return-image>span{font-size:10px;color:#94a3b8}
.order-return-product strong{display:block;font-size:13px;font-weight:500;overflow-wrap:anywhere;color:#183650}
.order-return-product small{display:block;margin-top:3px;font-size:11px;color:#748398}
.order-return-product b{font-size:13px;font-weight:500;white-space:nowrap;font-variant-numeric:tabular-nums}
.order-return-empty{margin:0;padding:12px 0;font-size:12px;color:#748398}
#section-orders .od-returns-dialog{width:min(880px,calc(100vw - 32px))}
#section-orders .od-return-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:16px}
#section-orders .od-return-toolbar input{flex:1;min-width:160px;padding:9px 12px;min-height:40px;border:1px solid #cbd5e1;border-radius:4px;font:inherit}
#section-orders .od-return-toolbar select{min-height:40px;max-width:100%;padding:8px 10px;border:1px solid #cbd5e1;border-radius:4px;background:#fff;font:inherit}
#section-orders .od-return-card{padding:16px;border:1px solid #e2e8f0;border-radius:5px;margin-bottom:14px}
#section-orders .od-return-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
#section-orders .od-return-card-head strong{display:block;color:#183650;font-size:14px;font-weight:500}
#section-orders .od-return-card-head small{margin-top:3px}
#section-orders .od-return-card p{font-size:12px;color:#64748b;margin:8px 0}
#section-orders .od-return-card .order-return-product{grid-template-columns:48px minmax(0,1fr) 130px}
#section-orders .od-return-card .od-return-quantity{display:block;font-size:11px;text-align:right;color:#64748b}
#section-orders .od-return-card .od-return-quantity input{box-sizing:border-box;display:block;width:100%;margin-top:5px;border:1px solid #cbd5e1;border-radius:4px;padding:8px 10px;min-height:38px;text-align:right;font:inherit;font-size:13px;color:#183650}
#section-orders .od-return-card .od-return-note{box-sizing:border-box;display:block;width:100%;min-height:38px;padding:8px 10px;margin:12px 0;border:1px solid #cbd5e1;border-radius:4px;resize:vertical;font:inherit}
#section-orders .od-return-receipt-history{margin-top:12px;font-size:12px;color:#64748b}
#section-orders .od-return-receipt-history>div{padding:6px 0;border-top:1px solid #e6ecf2}
#section-orders .od-return-error{color:#c62828;font-size:12px;line-height:1.6}
#section-orders .od-return-pagination{display:flex;justify-content:space-between;align-items:center;gap:10px}
@media(max-width:560px){#section-orders .od-cancel-dialog footer{flex-wrap:wrap}#section-orders .od-cancel-dialog footer .od-dialog-button{flex:1}#section-orders .od-return-card{padding:12px}#section-orders .od-return-card .order-return-product{grid-template-columns:42px minmax(0,1fr)}#section-orders .od-return-card .od-return-quantity{grid-column:2;text-align:left}#section-orders .od-return-card .od-return-quantity input{max-width:160px;text-align:left}}

@media(max-width:1180px){.od-layout{grid-template-columns:minmax(0,1fr) 300px}}
@media(max-width:1020px){.od-hero{flex-direction:column}.od-search{width:100%}.od-search-field{width:100%;flex:1}.od-layout{grid-template-columns:1fr}.od-detail{position:relative;top:auto;max-height: none}.od-detail-body{max-height:none}.od-filters{
        display: flex;
        overflow-x: auto}.od-filter{
        flex: 1 0 auto;
        min-width: 130px}}
@media(max-width:760px){#section-orders{--kid-readable-text-size:13px;--kid-readable-label-size:12px;line-height:1.4;padding:10px}.od-page--empty{min-height:calc(100dvh - 20px)}.od-search{display:grid;grid-template-columns:minmax(0,1fr) auto}.od-search-field{grid-column:1/-1}.od-search-submit,.od-search-clear{height:36px}.od-context{align-items:flex-start;flex-direction:column}.od-context-meta{width:100%;justify-content:space-between}.od-list-head{align-items:flex-start}.od-card-footer{grid-template-columns:minmax(0,1fr)}.od-card-origin{margin-left:16px;margin-right:16px}.od-pagination{justify-content:center;flex-wrap:wrap}.od-detail{margin-top:10px}.od-detail-body{padding:12px}.od-actions{position:sticky;bottom:0;padding:8px;margin:0 -4px -4px;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-top:1px solid #EDF1F6}.od-item{grid-template-columns:44px minmax(0,1fr) auto}.od-item-img,.od-item-img-empty{width:44px;height:44px}}
@media(max-width:430px){.od-filter{min-width:118px}.od-summary{grid-template-columns:1fr 1fr}.od-actions{grid-template-columns:1fr}.od-btn.full{grid-column:auto}.od-query-chip{max-width:190px}}
@media(prefers-reduced-motion:reduce){#section-orders *{scroll-behavior:auto!important;transition:none!important}}

/* Priority rows and tracking cards share one visual contract. */
.kid-data-table .kid-data-row--urgent { background: #FEF2F2; box-shadow: inset 3px 0 0 var(--kid-danger); }
.kid-tracking-card.kid-data-row--urgent { --kid-tracking-surface: #FEF2F2; --kid-tracking-foot-bg: var(--kid-surface); --kid-tracking-foot-color: var(--kid-text); --kid-tracking-foot-danger: var(--kid-danger); border-color: var(--kid-danger); box-shadow: inset 3px 0 0 var(--kid-danger); }
.kid-data-table .kid-data-row--urgent:hover, .kid-data-table .kid-data-row--urgent[aria-selected="true"] { background: #FEE2E2; box-shadow: inset 3px 0 0 var(--kid-danger); }
.kid-tracking-card.kid-data-row--urgent:hover, .kid-tracking-card.kid-data-row--urgent[aria-pressed="true"] { --kid-tracking-surface: #FEE2E2; box-shadow: inset 3px 0 0 var(--kid-danger); }
.kid-data-row--urgent .kid-data-countdown, .kid-data-countdown.kid-ui-text--danger { color: var(--kid-countdown-danger,var(--kid-danger)); font-weight: 700; }
.kid-data-countdown { font-variant-numeric: tabular-nums; }
/* Shared document attachments with filenames and upload metadata. */
.kid-ui-document-list{display:grid;gap:var(--kid-space-10,10px);padding:var(--kid-space-16,16px);border:1px solid var(--kid-border,#dce4ed);border-radius:var(--kid-radius-6,6px);background:var(--kid-surface,#fff);min-width:0}
.kid-ui-document-list__head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--kid-space-8,8px);font-size:13px;color:var(--kid-text,#1e293b)}
.kid-ui-document-list__head>span{font-size:12px;color:var(--kid-muted,#64748b)}
.kid-ui-document-list__item{display:grid;grid-template-columns:28px minmax(0,1fr) 16px;align-items:center;gap:var(--kid-space-12,12px);padding:var(--kid-space-12,12px);border:1px solid var(--kid-border,#dce4ed);border-radius:var(--kid-radius-6,6px);background:var(--kid-surface-soft,#f8fafc);color:var(--kid-text,#1e293b);text-decoration:none;min-width:0}
.kid-ui-document-list__item:hover,.kid-ui-document-list__item:focus-visible{border-color:var(--kid-primary,#2498c5)}
.kid-ui-document-list__item>svg{width:24px;height:24px;color:var(--kid-primary,#2498c5)}
.kid-ui-document-list__item[data-kind=pdf]>svg:first-child{color:#dc2626}
.kid-ui-document-list__item>svg:last-child{width:16px;height:16px;color:var(--kid-muted,#64748b)}
.kid-ui-document-list__copy{display:grid;gap:var(--kid-space-4,4px);min-width:0;overflow-wrap:anywhere}
.kid-ui-document-list__copy>strong{font-size:13px;font-weight:600;line-height:1.5}
.kid-ui-document-list__copy>small{font-size:11px;color:var(--kid-muted,#64748b);line-height:1.6}