/* efis-enhance.css — modernisation layer over efis-theme.css. ADDITIVE ONLY: no colour, layout or flow changes.
   Load AFTER efis-theme.css. Same class names. Remove this file and the page is plain eFIS again. */

/* 1. Type scale and rhythm — one system font stack, tuned sizes, tabular numbers everywhere */
:root{--e-font:"Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
body{font-family:var(--e-font);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-variant-numeric:tabular-nums}
.phead h1{letter-spacing:-.01em}
.card h2{letter-spacing:-.005em}
.note{line-height:1.5}

/* 2. Cards — quiet elevation, hover lift on interactive cards only */
.card{box-shadow:0 1px 2px rgba(17,25,42,.04);transition:box-shadow .18s ease,transform .18s ease}
.card:has(tr.row:hover),.kpi:hover{box-shadow:0 6px 18px rgba(17,25,42,.08)}
.kpi{transition:box-shadow .18s ease}
.kpi .v{letter-spacing:-.02em}

/* 3. Tables — sticky header, row hover, comfortable density, aligned numbers */
.tw{max-height:min(70vh,720px);overflow:auto;scrollbar-width:thin}
.tw thead th{position:sticky;top:0;z-index:2;box-shadow:0 1px 0 rgba(255,255,255,.35) inset}
tbody tr{transition:background .12s ease}
tbody tr:hover td{background:#E8F0FF}
tr.row:hover td{background:#DBEAFE}
tbody tr:focus-within td{outline:2px solid var(--accent);outline-offset:-2px}
td{line-height:1.35}
.num{font-feature-settings:"tnum" 1}

/* 4. Buttons — pressed and hover states, focus ring, icon spacing */
.btn{transition:filter .12s ease,transform .06s ease,box-shadow .12s ease;box-shadow:0 1px 2px rgba(17,25,42,.12)}
.btn:hover{filter:brightness(1.06);box-shadow:0 3px 8px rgba(85,105,255,.28)}
.btn:active{transform:translateY(1px);box-shadow:none}
.btn:focus-visible{outline:3px solid rgba(85,105,255,.35);outline-offset:2px}
.btn.ghost{box-shadow:none}
.btn:disabled{box-shadow:none}

/* 5. Fields — clearer focus, error and success states */
.field input:focus,.field select:focus,input:focus,select:focus{box-shadow:0 0 0 4px rgba(85,105,255,.14)}
.field.err input{border-color:var(--crit)} .field.err label{color:var(--crit)}
.field .hint{font-size:12px;color:var(--mute);margin-top:4px}
input::placeholder{opacity:.85}

/* 6. Sidebar — collapsible to the 80px icon rail (eFIS behaviour), state remembered by the page */
.app.rail-collapsed{grid-template-columns:80px minmax(0,1fr)}
.app.rail-collapsed .rail{padding:12px 10px}
.app.rail-collapsed .brand{padding:6px;min-height:52px}
.app.rail-collapsed .brand img{height:32px}
.app.rail-collapsed .sec{justify-content:center;padding:14px 0}
.app.rail-collapsed .sec :not(.ic){display:none}
.app.rail-collapsed .nav,.app.rail-collapsed .who{display:none}
.rail{transition:padding .18s ease}
.sec,.nav{transition:background .12s ease,color .12s ease}
.nav.on::before{box-shadow:0 0 0 3px rgba(85,105,255,.25)}
.top .burger{cursor:pointer;transition:box-shadow .12s ease}
.top .burger:hover{box-shadow:0 2px 6px rgba(17,25,42,.15)}

/* 7. Header — status pill, subtle separation */
.top{backdrop-filter:blur(6px)}
.top .status{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:#374151;background:#fff;border:1px solid var(--line);border-radius:999px;padding:4px 10px}
.top .status::before{content:"";width:8px;height:8px;border-radius:50%;background:#16A34A}

/* 8. Status chips — one shape, readable weight, dot for live states */
.pill{font-weight:600;letter-spacing:.01em;padding:3px 10px}
.p-ACTIVE::before,.p-RECOVERING::before,.p-SENT::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:currentColor;margin-right:6px;vertical-align:1px}

/* 9. Empty and loading states */
.empty{padding:36px 16px;text-align:center;color:var(--mute);font-size:14px}
.empty b{display:block;color:var(--fg);font-size:15px;margin-bottom:4px}
.skeleton{background:linear-gradient(90deg,#F3F4F6 25%,#E5E7EB 37%,#F3F4F6 63%);background-size:400% 100%;animation:sk 1.2s ease infinite;border-radius:6px;min-height:14px}
@keyframes sk{0%{background-position:100% 0}100%{background-position:0 0}}

/* 10. Drawer, toast, callouts — smoother entry, consistent radius */
.drawer{animation:dr .18s ease-out}
@keyframes dr{from{transform:translateX(24px);opacity:0}to{transform:none;opacity:1}}
.toast{bottom:88px;border-radius:10px;box-shadow:0 10px 30px rgba(17,25,42,.25)}
.callout{border-radius:0 10px 10px 0}

/* 11. Print — the register and statements print cleanly */
@media print{.rail,.top,.dock,.toast,.phead .tools{display:none!important}.app{grid-template-columns:1fr}.work{padding:0}.card{box-shadow:none;border-color:#999}.tw{max-height:none;overflow:visible}.tw thead th{position:static;background:#eee;color:#000}}

/* 12. Motion respect */
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}
