/* Shared visual components; financial values and business state remain in their modules. */
:root{--ui-green:#167044;--ui-blue:#1d5eab;--ui-orange:#9a4d0b;--ui-purple:#6b46ad;--ui-red:#b8323b;--ui-teal:#08737b;--ui-slate:#52687c}
.ui-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;max-width:900px;margin:0 auto 24px}.ui-card{display:flex;flex-direction:column;align-items:flex-start;gap:10px;min-height:150px;min-width:0;padding:18px 16px;border-radius:17px;color:#fff;text-decoration:none;border:1px solid transparent;box-shadow:0 4px 12px #16203a12;transition:transform .12s}.ui-card h2{margin:0;font-size:19px;line-height:1.25;color:inherit;overflow-wrap:anywhere}.ui-card p{margin:0;font-size:14px;line-height:1.4;color:inherit}.ui-card .ui-card-icon,.ch-card .ui-card-icon{width:34px;height:34px;flex-shrink:0}.ui-card:hover{transform:translateY(-2px)}.ui-card:focus-visible{outline:3px solid #16203a;outline-offset:3px}.ui-home{max-width:1000px;margin:auto}.ui-home .pagehead{margin-bottom:20px}.ui-home h1{overflow-wrap:anywhere}.ui-tester{max-width:900px;margin:0 auto 24px}.button{border-radius:12px;min-height:44px}.button.primary{background:var(--ui-green);border-color:var(--ui-green);color:white}.button.danger{background:var(--ui-red);border-color:var(--ui-red);color:white}.ui-cashier-home .ui-grid{max-width:none}@media(min-width:760px){.ui-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.ui-cashier-home .ui-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:350px){.ui-card{padding:15px 12px;min-height:145px}.ui-card h2{font-size:16px}.ui-card p{font-size:12px}.ui-grid{gap:10px}}
/* Same compact header and modal side drawer for all approved roles. */
body:has(.app-menu-toggle) .topbar{display:flex;position:relative;gap:12px;flex-wrap:nowrap;padding:12px max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left));min-height:70px}body:has(.app-menu-toggle) .topbar .brand{margin-right:auto}body:has(.app-menu-toggle) .account-link{margin-left:0}.app-menu-toggle{display:flex;align-items:center;justify-content:center;flex:0 0 48px;width:48px;height:48px;padding:10px;background:white;border:1px solid #c7cfda;border-radius:12px;color:#16203a;cursor:pointer}.app-menu-toggle:focus-visible,.app-drawer a:focus-visible{outline:3px solid #167044;outline-offset:2px}.app-drawer{position:fixed;inset:0 auto 0 0;width:min(360px,86vw);height:100dvh;max-width:none;max-height:100dvh;margin:0;padding:calc(16px + env(safe-area-inset-top)) 14px calc(16px + env(safe-area-inset-bottom));border:0;border-radius:0 18px 18px 0;background:#fff;color:#16203a;overflow-y:auto;overscroll-behavior:contain;box-shadow:8px 0 40px #16203a30}.app-drawer::backdrop{background:#101c35a0}.app-drawer-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 8px 12px;border-bottom:1px solid #dce1e9}.app-drawer-heading strong{font-size:22px}.app-drawer-heading .button{font-size:27px;min-width:48px}.app-drawer nav{display:grid;gap:4px;margin-top:12px}.app-drawer nav a{display:flex;align-items:center;gap:12px;min-height:48px;padding:12px;color:inherit;text-decoration:none;border-radius:10px;line-height:1.3;overflow-wrap:anywhere}.app-drawer nav a:hover,.app-drawer nav a[aria-current=page]{background:#e6f2eb}.app-drawer .icon{width:24px;height:24px;flex:0 0 24px}body.planning-focus:has(.app-menu-toggle) .topbar,body.caisse-focus:has(.app-menu-toggle) .topbar{display:flex}body:has(.app-menu-toggle) .workspace{min-height:0}.interface-preview{font-size:14px;padding:8px 12px;gap:6px 12px}.interface-preview small{flex-basis:auto}.interface-preview .button{padding:8px 12px;font-size:14px}@media(max-width:500px){body:has(.app-menu-toggle) .topbar .account-label,body:has(.app-menu-toggle) .topbar .account-link>.icon{display:none}body:has(.app-menu-toggle) .topbar .brand strong{font-size:23px}body:has(.app-menu-toggle) .topbar .clock{display:none}.interface-preview span{flex-basis:100%}.interface-preview small{display:none}}
/* Caisse actions keep the existing handlers and financial states. */
.cc-actions .button[data-tab=opening],.cc-shifts .button.primary{background:var(--ui-green);color:white;border-color:var(--ui-green)}.cc-actions .button[data-tab=movements],.cc-app .button[data-caisse=new-movement]{background:var(--ui-purple);color:white;border-color:var(--ui-purple)}.cc-actions .button[data-tab=drivers]{background:var(--ui-blue);color:white;border-color:var(--ui-blue)}.cc-actions .button[data-tab=close],.cc-app .button[data-caisse=commit-close],.deliveries .button[data-delivery=cash-finish-ask]{background:var(--ui-red);color:white;border-color:var(--ui-red)}.cc-actions .button{white-space:normal}.cc-app .cc-amount,.cc-app .cc-stat strong,.dl-unit{font-variant-numeric:tabular-nums}.field input,.field select,.cc-field input,.cc-field select{min-width:0;max-width:100%}.preview-chooser .button{background:var(--ui-blue);color:#fff}.preview-chooser [data-preview=retour]{background:var(--ui-slate)}@media(prefers-reduced-motion:reduce){.ui-card{transition:none}.ui-card:hover{transform:none}}@media print{.app-menu-toggle,.app-drawer,.interface-preview{display:none!important}}
.ch-green{background:var(--ui-green)}

.ui-absence h2{font-size:17px}@media(max-width:350px){.ui-grid{grid-template-columns:1fr}.ch-card.ui-absence h2{font-size:15px}}
