/* Vehicle record 08.6: compact semantic three-column tables. */
#modal:has(.vehicle-record){width:min(980px,calc(100vw - 24px));max-height:calc(100dvh - 24px);font-family:inherit;color:#193552;background:#fff;border:1px solid #cbdcec;border-radius:12px}
#modal:has(.vehicle-record) .modal-heading{padding:8px 16px;border:0}
#modal:has(.vehicle-record) .modal-heading>.icon-btn{display:none}
#modal:has(.vehicle-record) .modal-heading h2{width:100%;justify-content:space-between;align-items:center;gap:8px 20px;color:#173756;font-family:inherit;font-size:24px;line-height:1.2}
#modal .vehicle-record-title{display:flex;flex-direction:column;gap:3px;white-space:nowrap}
#modal .vehicle-record-title small{font-size:12px;font-weight:400;color:#6b829b}
#modal .vehicle-record-heading-meta{min-width:0;max-width:58%;text-align:right;font-size:18px;overflow-wrap:anywhere}
#modal .vehicle-record-heading-meta small{display:block;font-size:12px;font-weight:400;line-height:1.3;margin-top:4px;color:#637e99}
#modal .vehicle-record-form{display:flex;flex-direction:column;min-height:0;overflow:hidden;margin:0}
#modal .vehicle-detail.vehicle-record{padding:0 16px 8px;min-height:0;overflow:auto}
#modal .vehicle-record-table-wrap{border:1px solid #c9dcee;border-radius:5px;overflow:hidden}
#modal .vehicle-record-table{table-layout:fixed;width:100%;border-collapse:collapse;margin:0;font-size:14px;line-height:1.2;color:#193552}
#modal .vehicle-record-table .record-category{width:23%}#modal .vehicle-record-table .record-property{width:32%}#modal .vehicle-record-table .record-value{width:45%}
#modal .vehicle-record-table thead th{background:#193e63;color:#fff;text-align:left;font-size:13px;font-weight:600;padding:5px 10px;border-right:1px solid #55738f}
#modal .vehicle-record-table td,#modal .vehicle-record-table tbody th{padding:2px 10px;text-align:left;vertical-align:middle;border-bottom:1px solid #e0eaf4;border-right:1px solid #d3e2f0;white-space:normal;overflow-wrap:anywhere;line-height:1.2}
#modal .vehicle-record-table td:last-child{border-right:0;background:#fff;font-variant-numeric:tabular-nums}
#modal .vehicle-record-table tbody+tbody{border-top:2px solid #88a9c9}
#modal .vehicle-record-table .record-group{background:#e7f1fb;color:#1b3f63;font-weight:600;font-size:14px}
#modal .vehicle-record-table .record-label{background:#fbfdff;font-weight:400;color:#47627d;font-size:13px}
#modal .vehicle-record-table .tag{display:inline-block;max-width:100%;white-space:normal;border:0;border-radius:4px;font-size:13px;line-height:1.25;padding:1px 7px;letter-spacing:0}
#modal .vehicle-record-table .tag:is(.valid,.active){background:#21845d;color:#fff}
#modal .vehicle-record-table .tag:is(.expired,.error){background:#c43f57;color:#fff}
#modal .vehicle-record-table .tag.missing{background:#f5ce7c;color:#47330c}
#modal .vehicle-record-table .tag.unchecked{background:#dcecff;color:#173f70}
#modal .vehicle-record-table details{font-size:12px;color:#627b94}#modal .vehicle-record-table details p{margin:6px 0}
#modal .vehicle-record-table .field{font-size:0;gap:0;margin:0;display:block}
#modal .vehicle-record-table :is(select,textarea){width:100%;min-width:0;max-width:100%;font:inherit;font-size:14px;line-height:1.2;color:#193552;background:#fff;border:1px solid #c9d9e8;border-radius:4px;padding:5px 7px;box-sizing:border-box}
#modal .vehicle-record-table textarea{display:block;min-height:32px;height:32px;max-height:140px;resize:vertical}
#modal .vehicle-record-table :is(select,textarea):focus-visible{outline:2px solid #7da9d4;outline-offset:1px}
#modal .vehicle-record .vehicle-history{margin-top:8px;padding:0;border:0;border-radius:0}
#modal .vehicle-record .vehicle-history header{margin-bottom:4px;gap:4px}
#modal .vehicle-record .vehicle-history h3{font-size:15px}#modal .vehicle-record .vehicle-history header>span{display:none}
#modal .vehicle-record .vehicle-history-scroll{border-radius:5px}
#modal .vehicle-record .vehicle-history-table{min-width:0;font-size:13px}
#modal .vehicle-record .history-col-date{width:14%}#modal .vehicle-record .history-col-event{width:50%}#modal .vehicle-record .history-col-until{width:16%}
#modal .vehicle-record .vehicle-history-table th{background:#193e63;color:#fff;padding:5px 10px;font-size:13px;white-space:normal;border-right:1px solid #55738f}
#modal .vehicle-record .vehicle-history-table td{padding:3px 10px;line-height:1.2;border-right:1px solid #dce7f1;font-size:13px}
#modal .vehicle-record .vehicle-history-kind{font-size:13px;padding:0;background:transparent;color:#244a6e;line-height:1.3;margin-right:8px}
#modal .vehicle-record .vehicle-history-equipment{display:inline;color:#52708b;font-size:12px;overflow-wrap:anywhere}
#modal .vehicle-record .vehicle-history-serial{display:inline}#modal .vehicle-record .vehicle-history-serial+span{margin-left:4px}
#modal .vehicle-record .vehicle-history-fact a{margin-top:3px}
#modal .vehicle-record-footer{flex:0 0 auto;border-top:1px solid #d5e3f0;padding:8px 16px;background:#fff}
#modal .vehicle-record-footer .form-error:empty{display:none}
#modal .vehicle-record-footer .form-error{margin-bottom:6px;font-size:13px}
#modal .vehicle-record-footer .vehicle-detail-actions{margin:0;padding:0;border:0;display:flex;flex-wrap:wrap;gap:7px;justify-content:flex-start}
#modal .vehicle-record-footer .btn{font:inherit;font-size:13px;line-height:1.3;min-height:34px;padding:6px 11px;border-radius:5px;white-space:nowrap}
#modal .vehicle-record-footer .btn.primary{background:#2367b0;border-color:#2367b0;margin-left:auto;color:white}
#modal .vehicle-record-footer [hidden]{display:none!important}
@media(max-width:600px){
 #modal:has(.vehicle-record){width:calc(100vw - 12px);max-height:calc(100dvh - 12px)}
 #modal:has(.vehicle-record) .modal-heading{padding:10px}
 #modal:has(.vehicle-record) .modal-heading h2{font-size:20px}
 #modal .vehicle-record-heading-meta{font-size:14px;max-width:48%}
 #modal .vehicle-record-heading-meta small{font-size:11px}
 #modal .vehicle-detail.vehicle-record{padding:0 8px 8px}
 #modal .vehicle-record-table{font-size:13px}
 #modal .vehicle-record-table td,#modal .vehicle-record-table tbody th{padding:3px 6px}
 #modal .vehicle-record-table .record-group,#modal .vehicle-record-table .record-label{font-size:12px}
 #modal .vehicle-record-table .record-category{width:24%}#modal .vehicle-record-table .record-property{width:31%}
 #modal .vehicle-record-table :is(select,textarea){font-size:16px;padding:4px}
 #modal .vehicle-record-table thead th{font-size:11px;padding:6px}
 #modal .vehicle-record .vehicle-history-table th,#modal .vehicle-record .vehicle-history-table td{padding:5px;font-size:11px}
 #modal .vehicle-record .vehicle-history-date time{white-space:normal}
 #modal .vehicle-record-footer{padding:8px}
 #modal .vehicle-record-footer .btn{flex:1 1 auto;font-size:12px;padding:6px 8px}
 #modal .vehicle-record-footer .btn.primary{margin-left:0}
}

/* Keep the early MCD deadline note beside the date, inside its own section. */
#modal .vehicle-record-mcd-deadline{display:flex;align-items:center;flex-wrap:wrap;gap:3px 8px}
#modal .vehicle-record-mcd-deadline>span:first-child{white-space:nowrap}
#modal .vehicle-record-mcd-gap{display:inline-block;padding:1px 6px;border-radius:4px;background:#cdb4f2;color:#36214f;font-weight:600;font-size:12px;line-height:1.25}

/* Both confirmed SKZI serial components, using the same data as the fleet list. */
#modal .vehicle-record-table .serial-number{font:inherit;max-width:100%;overflow-wrap:anywhere}
#modal .vehicle-record-table .crypto-serial-lines{display:flex;flex-direction:column;gap:1px}
#modal .vehicle-record-table .crypto-serial-lines>span{display:block;position:static;white-space:normal;overflow-wrap:anywhere}

/* Filing-card header: navy plate tab, full white client area. */
#modal:has(.vehicle-record) .modal-heading{padding:0 16px 0 0;margin-bottom:8px;gap:14px;background:#fff;border-bottom:0;border-radius:11px 11px 0 0;box-shadow:none;align-items:center;overflow:hidden}
#modal:has(.vehicle-record) .modal-heading h2{flex:1;min-width:0;align-items:center;flex-wrap:nowrap;justify-content:flex-start;font-size:20px;gap:18px;line-height:1.2;color:#193e63}
#modal .vehicle-record-title{position:relative;isolation:isolate;flex:0 0 auto;align-self:stretch;justify-content:center;gap:2px;padding:10px 26px 10px 16px;color:#fff;background:#193e63;border-radius:10px 10px 0 0}
/* The divider starts after the sloped navy tab, never underneath it. */
#modal .vehicle-record-client::after{content:"";position:absolute;left:-2px;right:-60px;bottom:0;height:1px;background:#bed2e6;pointer-events:none}
#modal .vehicle-record-title::after{content:"";position:absolute;z-index:-1;top:0;bottom:-1px;right:-16px;width:28px;background:#193e63;clip-path:polygon(0 0,42% 0,100% 100%,0 100%)}
#modal .vehicle-record-title small,#modal .vehicle-record-client small{font-size:11px;line-height:1.2;font-weight:400;color:#a9d3f5}
#modal .vehicle-record-client{position:relative;align-self:stretch;justify-content:center;display:flex;flex:1 1 auto;flex-direction:column;gap:3px;min-width:0;max-width:100%;padding:9px 0 9px 10px;background:#fff;text-align:left;font-size:14px;line-height:1.25;font-weight:600;color:#193e63;overflow-wrap:anywhere}
#modal .vehicle-record-client small{color:#607d99}
#modal:has(.vehicle-record) .modal-heading>.icon-btn{display:inline-flex;flex:0 0 30px;align-items:center;justify-content:center;width:30px;height:30px;padding:5px;color:#527695;background:#fff;border:1px solid #d2e1ef;border-radius:7px;outline:none;box-shadow:none}
#modal:has(.vehicle-record) .modal-heading>.icon-btn:hover{background:#e5eff9;color:#193e63;border-color:#9cb9d5}
#modal:has(.vehicle-record) .modal-heading>.icon-btn:focus-visible{outline:2px solid #527fa9;outline-offset:2px;box-shadow:none;color:#193e63}
#modal:has(.vehicle-record) .modal-heading>.icon-btn:focus-visible .icon{stroke-width:2.5}
#modal:has(.vehicle-record) .modal-heading>.icon-btn .icon{width:18px;height:18px}
@media(max-width:600px){
 #modal:has(.vehicle-record) .modal-heading{padding:0 8px 0 0;gap:8px}
 #modal:has(.vehicle-record) .modal-heading h2{font-size:17px;gap:12px}
 #modal .vehicle-record-title{padding:9px 12px 9px 8px}
 #modal .vehicle-record-title::after{right:-10px;width:18px}
 #modal .vehicle-record-client::after{right:-46px}
 #modal .vehicle-record-client{padding:8px 0 8px 6px;font-size:12px}
 #modal .vehicle-record-title small,#modal .vehicle-record-client small{font-size:10px}
}

/* Match data and property text sizes; status colours remain semantic. */
#modal .vehicle-record-table{--vehicle-field-font:13px}
#modal .vehicle-record-table :is(td,.record-label){font-size:var(--vehicle-field-font)}
#modal .vehicle-record-table td{color:#000}
#modal .vehicle-record-table td :is(.tag,.vehicle-record-mcd-gap){font-size:inherit}
@media(max-width:600px){#modal .vehicle-record-table{--vehicle-field-font:12px}}

#modal:has(.vehicle-record) .modal-heading h2:focus{outline:none;box-shadow:none}

#modal .vehicle-record .history-col-source{width:20%}
#modal .vehicle-record .vehicle-history-source a{display:inline-flex;align-items:center;gap:4px;max-width:100%;color:#356b9c;font-size:inherit;line-height:1.3}
#modal .vehicle-record .vehicle-history-source a svg{width:13px;height:13px;flex:0 0 13px}
@media(max-width:600px){
 #modal .vehicle-record .history-col-date,#modal .vehicle-record .history-col-until{width:24%}
 #modal .vehicle-record .history-col-event{width:32%}
 #modal .vehicle-record .vehicle-history-table time{font-size:10px}
}

/* Lift into focus with a gentle settling motion. */
#modal[open]:has(.vehicle-record){transform-origin:50% 35%;animation:vehicle-record-arrive 680ms cubic-bezier(.22,.7,.25,1) backwards}
#modal[open]:has(.vehicle-record)::backdrop{animation:vehicle-record-backdrop-in 460ms ease-out backwards}
@keyframes vehicle-record-arrive{
 0%{opacity:0;transform:translateY(24px) scale(.94);filter:blur(2px)}
 45%{opacity:1;filter:blur(0)}
 72%{transform:translateY(-2px) scale(1)}
 100%{opacity:1;transform:none;filter:blur(0)}
}
@keyframes vehicle-record-backdrop-in{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){
 #modal[open]:has(.vehicle-record),#modal[open]:has(.vehicle-record)::backdrop{animation:none}
}

/* Vehicle footer: work requests left, archive and deletion right. */
#modal .vehicle-detail-orders,#modal .vehicle-detail-manage{display:flex;flex-wrap:wrap;align-items:center;gap:7px;max-width:100%;min-width:0}
#modal .vehicle-detail-manage{margin-left:auto;justify-content:flex-end}
#modal .vehicle-record-footer .btn{display:inline-flex;align-items:center;justify-content:center;gap:6px}
#modal .vehicle-record-footer .btn .icon{width:16px;height:16px;flex:0 0 16px}
#modal .vehicle-record-footer [data-archive]{border:1px solid #bccfe1;background:#fff}
#modal .vehicle-record-footer [data-archive]:hover{background:#eef5fc;border-color:#86aacb}
@media(max-width:600px){
 #modal .vehicle-detail-orders{flex:1 1 100%}
 #modal .vehicle-detail-manage{flex:0 1 auto}
}

/* Work-specific colours and a gentle cue for current or approaching work. */
#modal .vehicle-record-footer [data-order-kind="crypto"]{--order-work-bg:#e8f6ed;--order-work-peak:#bfe8ce;--order-work-border:#9bcdb0;--order-work-glow:rgba(54,151,94,.22);background:var(--order-work-bg);border-color:var(--order-work-border);color:#215b3c}
#modal .vehicle-record-footer [data-order-kind="verification"]{--order-work-bg:#eaf4fe;--order-work-peak:#bfdff9;--order-work-border:#a1c6e7;--order-work-glow:rgba(57,133,197,.22);background:var(--order-work-bg);border-color:var(--order-work-border);color:#254e78}
#modal .vehicle-record-footer [data-order-kind]{font-weight:600}
#modal .vehicle-record-footer [data-order-kind]:hover{background:var(--order-work-peak)}
#modal .vehicle-record-footer .order-work-attention{position:relative;overflow:visible}
#modal .vehicle-record-footer .order-work-alert{position:absolute;right:-1px;top:-1px;transform:translate(50%,-50%);display:flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:#c43f57;color:#fff;border:1px solid #fff;font:700 13px/1 Arial,sans-serif;pointer-events:none}
#modal .vehicle-record-footer .order-work-alert::before,#modal .vehicle-record-footer .order-work-alert::after{content:"";position:absolute;inset:-1px;border:1.5px solid #c43f57;border-radius:50%;pointer-events:none;animation:vehicle-order-double-wave 1.8s ease-out infinite}
#modal .vehicle-record-footer .order-work-alert::after{animation-delay:.9s;opacity:0}
@keyframes vehicle-order-double-wave{0%{opacity:.7;transform:scale(1)}85%,100%{opacity:0;transform:scale(1.85)}}
@media(prefers-reduced-motion:reduce){#modal .vehicle-record-footer .order-work-alert::before,#modal .vehicle-record-footer .order-work-alert::after{animation:none;opacity:0}}


/* A4 portrait: the vehicle record occupies the upper half, including history. */
#vehicle-print-root{position:fixed;left:-10000px;top:0;width:190mm;height:128mm;box-sizing:border-box;background:#fff;color:#142b40;pointer-events:none;overflow:hidden;font-family:Arial,sans-serif;font-size:8pt;line-height:1.15}
#vehicle-print-root *{box-sizing:border-box;animation:none!important;transition:none!important;text-shadow:none!important}
#vehicle-print-root .vehicle-print-content{width:190mm;transform-origin:top left}
#vehicle-print-root .vehicle-print-heading{margin:0 0 2mm;padding:0 0 2mm;border-bottom:.4mm solid #315577}
#vehicle-print-root h2{display:flex;align-items:center;justify-content:space-between;gap:5mm;margin:0;font-size:13pt;line-height:1.2}
#vehicle-print-root .vehicle-record-title{display:flex;flex-direction:column;white-space:nowrap;gap:.5mm}
#vehicle-print-root .vehicle-record-client{display:flex;flex-direction:column;gap:.5mm;text-align:right;max-width:65%;font-size:10pt;overflow-wrap:anywhere}
#vehicle-print-root h2 small{font-size:7pt;font-weight:400;color:#4b647a}
#vehicle-print-root .vehicle-record{display:block;margin:0;padding:0;border:0;overflow:visible;max-height:none;height:auto}
#vehicle-print-root :is(.vehicle-record-table-wrap,.vehicle-history-scroll){display:block;border:0;border-radius:0;overflow:visible;max-height:none;min-width:0}
#vehicle-print-root table{width:100%;min-width:0;border-collapse:collapse;table-layout:fixed;margin:0;font:inherit;color:#162e44}
#vehicle-print-root :is(th,td){padding:.6mm 1.5mm;border:.2mm solid #b7c7d5;text-align:left;vertical-align:middle;white-space:normal;overflow-wrap:anywhere;font:inherit;line-height:1.15}
#vehicle-print-root thead th{background:#e4eef7;color:#183e61;font-weight:700}
#vehicle-print-root tbody+tbody{border-top:.4mm solid #7897b1}
#vehicle-print-root .record-category{width:23%}#vehicle-print-root .record-property{width:32%}#vehicle-print-root .record-value{width:45%}
#vehicle-print-root .record-group{background:#f0f5fa;font-weight:700}
#vehicle-print-root .record-label{color:#41596e;font-weight:400}
#vehicle-print-root td:last-child{color:#000}
#vehicle-print-root .tag{display:inline;font:inherit;font-weight:600;line-height:inherit;padding:0 .8mm;border:0;border-radius:.5mm;white-space:normal;box-shadow:none}
#vehicle-print-root .tag::before{display:none}
#vehicle-print-root .vehicle-history{margin:2mm 0 0;padding:0;border:0;background:#fff}
#vehicle-print-root .vehicle-history header{display:block;margin:0 0 1mm}
#vehicle-print-root h3{margin:0;font-size:9pt;line-height:1.2}
#vehicle-print-root .vehicle-history header>span{display:none}
#vehicle-print-root .history-col-date{width:14%}#vehicle-print-root .history-col-event{width:50%}#vehicle-print-root .history-col-until{width:16%}#vehicle-print-root .history-col-source{width:20%}
#vehicle-print-root .vehicle-history-kind{display:inline;margin-right:1mm;padding:0;background:transparent;color:#183e61;font:inherit;font-weight:700}
#vehicle-print-root .vehicle-history-equipment{display:inline;font:inherit;color:#263e52;overflow-wrap:anywhere}
#vehicle-print-root .vehicle-history-date small{display:block;font-size:6.5pt;color:#516a7f}
#vehicle-print-root :is(p,.hint,.notice){margin:1mm 0;font-size:7pt;line-height:1.2}
#vehicle-print-root a{color:#245e8b;text-decoration:none;font:inherit}
#vehicle-print-root :is(svg,button,.vehicle-record-footer){display:none!important}
@page vehicle-card-sheet{size:A4 portrait;margin:0}
@media print{
 html:has(body.vehicle-printing),body.vehicle-printing{height:auto!important;min-height:0!important;min-width:0!important;overflow:visible!important;background:#fff!important;margin:0!important;padding:0!important}
 body.vehicle-printing>:not(#vehicle-print-root){display:none!important}
 body.vehicle-printing #vehicle-print-root{position:relative;left:0;top:0;display:block;margin:10mm;page:vehicle-card-sheet;break-inside:avoid;print-color-adjust:exact;-webkit-print-color-adjust:exact}
 body.vehicle-printing dialog::backdrop{display:none!important;background:transparent!important}
}

/* Ordered work has a plain, stationary check instead of the attention badge. */
#modal .vehicle-record-footer .order-work-ordered{position:relative;overflow:visible}
#modal .vehicle-record-footer .order-work-check{position:absolute;right:-1px;top:-1px;transform:translate(50%,-50%);display:flex;align-items:center;justify-content:center;width:24px;height:24px;color:#21845d;background:transparent;pointer-events:none}
#modal .vehicle-record-footer .order-work-check .icon{width:24px;height:24px;flex:0 0 24px;stroke-width:3.5}

/* Leave room for the corner badge and its attention waves. */
#modal .vehicle-detail-orders{padding-right:10px}

/* Work buttons keep their normal border when focus returns from the order dialog. */
#modal .vehicle-record-footer [data-order-kind]:focus{outline:none;box-shadow:none}

/* Corner indicators paint above neighbouring work buttons. */
#modal .vehicle-record-footer .order-work-alert,
#modal .vehicle-record-footer .order-work-check{z-index:1}

#modal .vehicle-record-footer [data-order-kind="tachograph"]{--order-work-bg:#f0ebfa;--order-work-peak:#dfd2f3;--order-work-border:#c8b7e2;background:var(--order-work-bg);border-color:var(--order-work-border);color:#654b87}