
.mi{font-family:'Material Symbols Rounded',sans-serif;font-weight:400;font-style:normal;font-size:1.1em;line-height:1;display:inline-block;vertical-align:-0.15em;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;font-variation-settings:'FILL' 1,'wght' 400,'GRAD' 0,'opsz' 20;flex-shrink:0;user-select:none}
.mi.mi-sm{font-size:.95em}.mi.mi-lg{font-size:1.35em}.mi.mi-xl{font-size:1.8em}.mi.mi-2xl{font-size:2.5em}
:root{
--primary:#5A1F12;--primary-light:#7A3020;--primary-dark:#3D1209;
--secondary:#55751F;--secondary-light:#6A9128;--accent:#3F5D17;--secondary-rgb:85,117,31;
--gold:#B8861A;--gold-light:#D4A827;
--bg:#F3EBDD;--bg-alt:#EDE3D0;--surface:#FCF8F1;--surface-alt:#EFE3D0;--surface-deep:#E6D9C5;
--border:#DCCFBC;--border-dark:#C8B9A2;
--text:#2C1608;--text-muted:#7C6A55;--text-light:#FFFDF8;--text-inverse:#FFFDF8;
--status-available:#2D7D2D;--status-available-bg:#E8F5E8;
--status-safari:#B86A00;--status-safari-bg:#FFF3E0;
--status-transfer:#3A5A8A;--status-transfer-bg:#EBF0FA;
--status-maintenance:#6B21A8;--status-maintenance-bg:#F3E8FF;
--status-lost:#B02020;--status-lost-bg:#FDECEA;
--status-damaged:#7C4A00;--status-damaged-bg:#FDF3E0;
--shadow-sm:0 2px 6px rgba(90,31,18,.07);--shadow-md:0 4px 14px rgba(90,31,18,.10);
--shadow-lg:0 10px 28px rgba(90,31,18,.14);--shadow-xl:0 20px 50px rgba(90,31,18,.18);
--radius-sm:4px;--radius:8px;--radius-lg:12px;--radius-xl:20px;--radius-full:9999px;
--font:'Montserrat','Segoe UI',Arial,sans-serif;--font-mono:'JetBrains Mono',monospace;
--trans:.25s ease;--nav-h:60px;--header-h:64px;--sidebar-w:240px}
body.dark{
--primary:#E8C8A0;--primary-light:#F0D4B0;--primary-dark:#C8A880;
--secondary:#8ABD4A;--secondary-light:#A0D060;--accent:#7AAA38;--secondary-rgb:138,189,74;
--gold:#D4A827;--gold-light:#E8C040;
--bg:#141008;--bg-alt:#1A140C;--surface:#1E1710;--surface-alt:#262018;--surface-deep:#302820;
--border:#3A3020;--border-dark:#4A3E2A;
--text:#F5EDE0;--text-muted:#B0A090;--text-light:#FFFDF8;--text-inverse:#141008;
--status-available:#6DBF6D;--status-available-bg:#0E2A0E;
--status-safari:#F0A040;--status-safari-bg:#2A1E08;
--status-transfer:#7AAADF;--status-transfer-bg:#0E1A2A;
--status-maintenance:#C084FC;--status-maintenance-bg:#2D1B4E;
--status-lost:#EF6060;--status-lost-bg:#2A0E0E;
--status-damaged:#E89040;--status-damaged-bg:#2A1800;
--shadow-sm:0 2px 8px rgba(0,0,0,.35);--shadow-md:0 4px 16px rgba(0,0,0,.45);
--shadow-lg:0 10px 30px rgba(0,0,0,.55);--shadow-xl:0 20px 50px rgba(0,0,0,.65)}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font);background:var(--bg);color:var(--text);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased;transition:background var(--trans),color var(--trans);min-height:100vh}
img{max-width:100%;display:block}
a{color:var(--secondary);text-decoration:none}
button,input,select,textarea{font-family:var(--font)}
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-track{background:var(--bg-alt)}
::-webkit-scrollbar-thumb{background:var(--border-dark);border-radius:var(--radius-full)}
::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}
h1,h2,h3,h4,h5{font-weight:700;line-height:1.25;color:var(--text)}
.section-title{font-size:1.3rem;font-weight:800;color:var(--primary);letter-spacing:.3px;margin-bottom:1.25rem;padding-bottom:.6rem;border-bottom:2px solid var(--surface-alt);display:flex;align-items:center;gap:.6rem}

/* LOGIN */
#login-screen{position:fixed;inset:0;background:var(--bg);z-index:9999;display:flex;align-items:center;justify-content:center;padding:1rem}
.login-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:3rem 2.5rem;width:100%;max-width:460px;box-shadow:var(--shadow-xl);text-align:center;animation:slideUp .5s ease}
@keyframes slideUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
.login-logo{width:72px;height:72px;margin:0 auto 1.5rem;background:linear-gradient(135deg,var(--primary),var(--primary-light));border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;color:white;font-size:1.8rem;font-weight:900;letter-spacing:1px;box-shadow:var(--shadow-md)}
#login-logo-wrap{min-height:96px!important}
#login-logo-img{max-width:264px!important;max-height:96px!important}

/* User Activity */
.user-activity-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-bottom:1rem}
.user-summary-card{position:relative;min-height:150px;background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--primary);border-radius:var(--radius);padding:1.1rem 4.4rem 1rem 1.2rem;display:flex;flex-direction:column;justify-content:center;box-shadow:var(--shadow-sm);overflow:hidden}
.user-summary-card.online{border-left-color:var(--status-available)}.user-summary-card.offline{border-left-color:var(--gold)}
.user-summary-label{font-size:.72rem;font-weight:800;text-transform:uppercase;color:var(--text-muted)}
.user-summary-card strong{font-size:2rem;color:var(--primary);line-height:1;margin:.55rem 0}.user-summary-card.online strong{color:var(--status-available)}
.user-summary-card small{font-size:.78rem;color:var(--text-muted)}
.user-summary-icon{position:absolute;right:1.15rem;top:50%;transform:translateY(-50%);font-size:2.35rem;color:var(--primary);opacity:.1}
.user-summary-card.online .user-summary-icon{color:var(--status-available)}.user-summary-card.offline .user-summary-icon{color:var(--gold)}
.user-activity-workspace{padding:0;overflow:hidden}
.user-activity-toolbar{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.15rem;border-bottom:1px solid var(--border);background:var(--surface-alt)}
.user-activity-heading{display:flex;align-items:center;gap:.7rem}.user-activity-heading>.mi{color:var(--secondary);font-size:1.45rem}.user-activity-heading>div{display:flex;flex-direction:column}.user-activity-heading strong{font-size:.92rem}.user-activity-heading small{font-size:.72rem;color:var(--text-muted)}
.user-activity-search{display:flex;align-items:center;gap:.45rem;border:1px solid var(--border);border-radius:var(--radius);padding:.5rem .7rem;background:var(--surface);min-width:260px}
.user-activity-search .mi{color:var(--text-muted)}.user-activity-search input{border:0;outline:0;background:transparent;color:var(--text);font:inherit;width:100%}
.user-activity-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem;padding:1.15rem}
.user-activity-card{position:relative;min-height:132px;background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--primary);border-radius:var(--radius);padding:1rem 2.6rem 1rem 1rem;text-align:left;display:grid;grid-template-columns:48px 1fr auto;gap:.8rem;align-items:center;color:var(--text);cursor:pointer;box-shadow:var(--shadow-sm);transition:border-color var(--trans),box-shadow var(--trans),transform var(--trans)}
.user-activity-card:hover{border-color:var(--secondary);box-shadow:var(--shadow-md);transform:translateY(-2px)}
.user-activity-avatar{width:44px;height:44px;border-radius:50%;background:var(--primary-dark);color:white;display:inline-flex;align-items:center;justify-content:center;font-weight:800;flex:0 0 auto}
.user-activity-avatar.online{background:var(--status-available);box-shadow:0 0 0 5px var(--status-available-bg)}
.user-activity-avatar.large{width:54px;height:54px;font-size:1rem}
.user-activity-card-copy{min-width:0;display:flex;flex-direction:column;gap:.15rem}.user-activity-card-copy strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-activity-card-copy span{font-size:.78rem;color:var(--text-muted)}.user-activity-card-copy small{font-size:.7rem;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.user-presence{display:inline-flex;align-items:center;gap:.35rem;border-radius:999px;padding:.3rem .5rem;font-size:.7rem;font-weight:800;white-space:nowrap}.user-presence i{width:8px;height:8px;border-radius:50%;background:currentColor}
.user-presence.online{color:#246b29;background:#e6f4e7}.user-presence.online i{box-shadow:0 0 0 4px rgba(47,125,50,.13);animation:user-heartbeat 1.8s ease-out infinite}.user-presence.offline{color:#7e746c;background:#f1ece6}
.user-activity-open{position:absolute;right:.75rem;color:var(--text-muted);opacity:.55;font-size:1.25rem}.user-activity-card:hover .user-activity-open{color:var(--secondary);opacity:1}
@keyframes user-heartbeat{0%,45%{box-shadow:0 0 0 3px rgba(47,125,50,.18)}70%,100%{box-shadow:0 0 0 8px rgba(47,125,50,0)}}
.user-activity-empty{padding:2rem;text-align:center;color:var(--text-muted);grid-column:1/-1}
.user-detail-head{display:flex;gap:.8rem;align-items:center;padding:.5rem 0 1rem;border-bottom:1px solid var(--border)}.user-detail-head>div{display:flex;flex-direction:column;gap:.2rem;flex:1}.user-detail-head>div span{font-size:.8rem;color:var(--text-muted)}
.user-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin:1rem 0}.user-detail-grid>div{background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius);padding:.75rem;display:flex;flex-direction:column;gap:.25rem}.user-detail-grid span{font-size:.7rem;text-transform:uppercase;font-weight:800;color:var(--text-muted)}.user-detail-grid strong{font-size:.84rem;overflow-wrap:anywhere}
.activity-log-filter{display:flex;flex-direction:column;gap:.2rem;min-width:165px}.activity-log-filter>span{font-size:.65rem;font-weight:800;text-transform:uppercase;color:var(--text-muted)}.activity-log-filter .form-control{width:100%}
@media(max-width:1024px){.user-activity-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.user-activity-summary,.user-activity-grid,.user-detail-grid{grid-template-columns:1fr}.user-activity-toolbar{align-items:stretch;flex-direction:column}.user-activity-search{min-width:0;width:100%}.user-activity-card{grid-template-columns:44px 1fr}.user-presence{grid-column:2;justify-self:start}}
.login-system-name{font-size:1.5rem;font-weight:900;color:var(--primary);letter-spacing:.5px;margin-bottom:.25rem}
.login-sub{font-size:.9rem;color:var(--text-muted);margin-bottom:2rem}
.login-badge{display:inline-block;font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.8px;padding:.2rem .75rem;border-radius:var(--radius-full);background:var(--secondary);color:white;margin-bottom:1.5rem}

/* LAYOUT */
html,body{height:100%;overflow:hidden}
#app-shell{display:none;flex-direction:column;height:100vh;overflow:hidden}
#app-shell.visible{display:flex}

/* Session restoration is distinct from login. On refresh, keep the authenticated
   route intact and cover startup with a neutral workspace state until Supabase
   has validated the stored session. */
#session-restore-screen{
  position:fixed;
  inset:0;
  z-index:10002;
  display:grid;
  place-items:center;
  padding:1.5rem;
  background:var(--bg);
}
.session-restore-content{
  width:min(320px,100%);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:1rem;
  color:var(--text);
}
.session-restore-logo{
  display:block;
  width:min(230px,72vw);
  max-height:86px;
  object-fit:contain;
}
.session-restore-label{
  font-size:.82rem;
  font-weight:700;
  color:var(--text-muted);
}
.session-restore-progress{
  width:min(260px,70vw);
  height:4px;
  overflow:hidden;
  border-radius:999px;
  background:rgba(var(--secondary-rgb,85,117,31),.16);
}
.session-restore-progress span{
  display:block;
  width:42%;
  height:100%;
  border-radius:inherit;
  background:var(--secondary);
  animation:session-restore-slide 1.05s ease-in-out infinite;
}
html.session-restoring #login-screen,
html.session-restoring #app-shell,
html.session-restoring #app-loader{
  visibility:hidden!important;
}
@keyframes session-restore-slide{
  0%{transform:translateX(-110%)}
  100%{transform:translateX(340%)}
}
@media(prefers-reduced-motion:reduce){
  .session-restore-progress span{animation:none;width:100%}
}
.app-header{min-height:var(--header-h);flex-shrink:0;background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;flex-wrap:nowrap;padding:0 1.5rem;position:sticky;top:0;z-index:200;box-shadow:var(--shadow-sm);gap:.75rem}
#app-body{display:flex;flex:1;min-height:0;overflow:hidden}
.header-top-row{display:flex;align-items:center;gap:.5rem;flex-shrink:0}
.header-brand{display:flex;align-items:center;gap:.75rem;text-decoration:none;flex-shrink:0}
.brand-mark{width:40px;height:40px;flex-shrink:0;background:linear-gradient(135deg,#3F5D17,#55751F);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;color:white;font-weight:900;font-size:1rem;letter-spacing:1px}
.brand-name{font-weight:800;color:var(--primary);font-size:1rem;line-height:1.1;white-space:nowrap}
.brand-dept{font-size:.7rem;color:var(--text-muted);font-weight:600;text-transform:uppercase;letter-spacing:.8px;white-space:nowrap}
.header-spacer{flex:1;min-width:.5rem}
.header-actions{display:flex;align-items:center;gap:.6rem;flex-shrink:0}
.user-pill{display:flex;align-items:center;gap:.5rem;background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius-full);padding:.35rem .85rem .35rem .4rem;cursor:default;flex-shrink:0}
.user-pill .avatar{width:28px;height:28px;border-radius:50%;flex-shrink:0;background:var(--primary);color:white;display:flex;align-items:center;justify-content:center;font-size:.68rem;font-weight:800}
.user-pill .uname{font-size:.82rem;font-weight:700;color:var(--text);white-space:nowrap}
.role-tag{font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:.12rem .45rem;border-radius:var(--radius-full);background:var(--primary);color:white;white-space:nowrap}
.role-tag.admin{background:var(--gold);color:#2C1608}
.role-tag.manager{background:#3A5A8A;color:white}
.role-tag.storekeeper{background:var(--secondary);color:white}
.role-tag.reservation_officer{background:#5B3A9D;color:white}
.role-tag.reservation_manager{background:#176B63;color:white}
@media(max-width:600px){
.app-header{flex-direction:column;align-items:stretch;padding:.6rem .85rem;gap:.5rem;height:auto;min-height:auto}
.header-top-row{display:flex;align-items:center;gap:.5rem;width:100%}
.header-actions{display:flex;align-items:center;justify-content:space-between;width:100%;gap:.5rem}
.header-spacer{display:none}.header-brand{min-width:0;flex:1}.header-brand>div:last-child{min-width:0}.brand-mark{max-width:40vw}.brand-mark img{max-width:40vw!important;height:auto!important}.brand-dept{display:none}.brand-name{font-size:.9rem;overflow:hidden;text-overflow:ellipsis}
.user-pill{flex:1;justify-content:center}.user-pill .uname{font-size:.8rem}
.theme-btn{font-size:.75rem;padding:.3rem .55rem;flex-shrink:0}}

/* SIDEBAR */
#app-nav{width:var(--sidebar-w);min-width:var(--sidebar-w);height:100%;background:var(--primary);display:flex;flex-direction:column;overflow-y:scroll;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.15) transparent;transition:width .22s ease,min-width .22s ease;flex-shrink:0;z-index:100;-webkit-overflow-scrolling:touch;touch-action:pan-y}
#app-nav::-webkit-scrollbar{width:4px}
#app-nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:4px}
#app-nav.collapsed{width:56px;min-width:56px}
#app-nav.collapsed .nav-label{display:none}
#app-nav.collapsed .nav-section-label{display:none}
#app-nav.collapsed .nav-btn{justify-content:center;padding:.85rem 0}
#app-nav.collapsed .nav-btn .nav-icon{margin:0;font-size:1rem;padding:0;min-width:unset}
@media(min-width:901px){
#app-nav.collapsed:hover{width:var(--sidebar-w);min-width:var(--sidebar-w)}
#app-nav.collapsed:hover .nav-label{display:block}
#app-nav.collapsed:hover .nav-section-label{display:block}
#app-nav.collapsed:hover .nav-btn{justify-content:flex-start;padding:.7rem 1rem}
#app-nav.collapsed:hover .nav-btn .nav-icon{font-size:1rem}
#app-nav.collapsed:hover #sidebar-toggle{justify-content:flex-end;padding:.5rem .6rem}}
@media(max-width:900px){
#app-nav{position:fixed;top:0;left:0;width:0;min-width:0;height:100vh;height:100dvh;overflow:hidden;z-index:400;transition:width .25s ease;box-shadow:none}
#app-nav.nav-open{width:280px;min-width:280px;overflow-y:scroll;overflow-x:hidden;-webkit-overflow-scrolling:touch;box-shadow:var(--shadow-xl)}
#app-nav.nav-open .nav-label{display:block}
#app-nav.nav-open .nav-section-label{display:block}
#app-nav.nav-open .nav-btn{justify-content:flex-start;padding:.75rem 1rem}
#app-nav.nav-open .nav-btn .nav-icon{font-size:1rem}
#sidebar-toggle{display:none!important}
#mobile-nav-toggle{display:flex!important}}
.nav-section-label{font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,253,248,.35);padding:1rem 1rem .3rem;white-space:nowrap;overflow:hidden}
.nav-btn{background:none;border:none;color:rgba(255,253,248,.70);padding:.7rem 1rem;font-family:var(--font);font-size:.875rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.65rem;width:100%;text-align:left;transition:all .18s ease;white-space:nowrap;border-left:3px solid transparent;border-radius:0}
.nav-btn .nav-icon{font-family:'Material Symbols Rounded',sans-serif;font-variation-settings:'FILL' 1,'wght' 300,'GRAD' 0,'opsz' 20;font-size:1.2rem;font-style:normal;font-weight:normal;flex-shrink:0;line-height:1;width:24px;height:24px;display:flex;align-items:center;justify-content:center;color:rgba(255,253,248,.8)}
.nav-btn:hover .nav-icon{color:white}
.nav-btn.active .nav-icon{color:#C7D6A4}
.nav-btn .nav-label{flex:1;overflow:hidden;text-overflow:ellipsis}
.nav-btn--wrap{min-height:50px;white-space:normal}
.nav-btn--wrap .nav-label{white-space:normal;line-height:1.2;overflow:visible;text-overflow:clip}
.nav-count-badge{min-width:20px;height:20px;padding:0 .35rem;border-radius:var(--radius-full);display:inline-flex;align-items:center;justify-content:center;font:800 .65rem var(--font-mono);flex:0 0 auto}
.nav-count-badge[hidden]{display:none!important}
.nav-count-badge-danger{background:#C52222;color:#fff}
.nav-count-badge-success{background:#2E8B3C;color:#fff}
.nav-deadline-badges{display:flex;align-items:center;gap:.25rem;flex:0 0 auto}
.nav-deadline-badges[hidden]{display:none!important}
.nav-btn:hover{color:white;background:rgba(255,255,255,.09)}
.nav-btn.active{color:white;background:rgba(255,255,255,.14);border-left-color:#C7D6A4;font-weight:700}
.nav-btn .badge{background:var(--gold);color:#2C1608;font-size:.62rem;font-weight:800;padding:.1rem .38rem;border-radius:var(--radius-full);min-width:17px;text-align:center;flex-shrink:0}
#sidebar-toggle{display:flex;align-items:center;justify-content:flex-end;padding:.6rem .75rem;border-bottom:1px solid rgba(255,255,255,.08);flex-shrink:0}
#sidebar-toggle button{background:rgba(255,255,255,.10);border:none;color:rgba(255,253,248,.85);cursor:pointer;font-size:1.05rem;padding:.35rem;border-radius:50%;transition:background .2s ease,color .2s ease,transform .22s ease;line-height:1;display:flex;align-items:center;justify-content:center;width:34px;height:34px;flex-shrink:0}
#sidebar-toggle button:hover{background:rgba(255,255,255,.22);color:white}
#app-nav.collapsed #sidebar-toggle{justify-content:center;padding:.6rem}
#app-nav.collapsed #sidebar-toggle button{transform:rotate(180deg)}
.sidebar-mobile-header{display:none;align-items:center;justify-content:space-between;padding:.85rem 1rem;border-bottom:1px solid rgba(255,255,255,.12);flex-shrink:0}
@media(max-width:900px){.sidebar-mobile-header{display:flex}}
.nav-spacer{min-height:2rem;flex-shrink:0}
body.dark #app-nav{background:#1A140C;border-right:1px solid #3A3020}
body.dark .nav-btn{color:rgba(210,190,155,.65)}
body.dark .nav-btn:hover{color:#F5EDE0;background:rgba(255,255,255,.06)}
body.dark .nav-btn.active{color:#F5EDE0;background:rgba(255,255,255,.10);border-left-color:#D4A827}
body.dark .nav-btn .badge{background:#D4A827;color:#141008}
body.dark .nav-section-label{color:rgba(210,190,155,.30)}
body.dark #sidebar-toggle button{color:rgba(210,190,155,.4)}
#app-main-wrap{flex:1;min-width:0;height:100%;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column}
.app-main{flex:1;padding:1.75rem}
@media(max-width:768px){.app-main{padding:1rem}}
@media(max-width:480px){.app-main{padding:.75rem}}
.tab-panel{display:none;animation:fadeIn .3s ease}
.tab-panel.active{display:block}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

/* CARDS */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.75rem;box-shadow:var(--shadow-sm);margin-bottom:1.5rem;transition:background var(--trans),border-color var(--trans)}
.card-row{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}
.card-header{margin-bottom:1.25rem}
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1rem;margin-bottom:1.5rem}
.stat-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem 1.5rem;box-shadow:var(--shadow-sm);border-left:4px solid var(--secondary);position:relative;overflow:hidden;transition:all var(--trans)}
.stat-card .stat-icon{position:absolute;right:1rem;top:50%;transform:translateY(-50%);font-size:2.2rem;opacity:.08;pointer-events:none;user-select:none;line-height:1;font-variation-settings:'FILL' 1,'wght' 400,'GRAD' 0,'opsz' 48}
.stat-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}
.stat-card.danger{border-left-color:var(--status-lost)}
.stat-card.warning{border-left-color:var(--status-damaged)}
.stat-card.success{border-left-color:var(--status-available)}
.stat-card.gold{border-left-color:var(--gold)}
.stat-card.info{border-left-color:var(--status-transfer)}
.stat-label{font-size:.78rem;text-transform:uppercase;letter-spacing:.7px;color:var(--text-muted);font-weight:700;margin-bottom:.5rem}
.stat-value{font-size:2.2rem;font-weight:900;color:var(--primary);line-height:1}
.stat-sub{font-size:.78rem;color:var(--text-muted);margin-top:.4rem}

/* FORMS */
.form-group{margin-bottom:1.25rem}
.form-label{display:block;font-weight:600;font-size:.88rem;color:var(--text);margin-bottom:.5rem}
.form-label .req{color:var(--status-lost);margin-left:3px}
.form-control{width:100%;padding:.7rem 1rem;border:1.5px solid var(--border);border-radius:var(--radius);background:#FFFFFF;color:var(--text);font-family:var(--font);font-size:.95rem;font-weight:600;transition:all var(--trans)}
.form-control:focus{outline:none;border-color:var(--secondary);background:#FFFFFF;box-shadow:0 0 0 3px rgba(85,117,31,.15)}
.form-control::placeholder{color:var(--text-muted);font-weight:500}
body.dark .form-control{background:var(--surface-deep);border-color:var(--border-dark)}
body.dark .form-control:focus{background:var(--surface-alt)}
textarea.form-control{resize:vertical;min-height:90px}
.form-row{display:flex;gap:1rem;flex-wrap:wrap}
.form-row>*{flex:1;min-width:200px}
.form-hint{font-size:.78rem;color:var(--text-muted);margin-top:.3rem}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;padding:.65rem 1.35rem;border:none;border-radius:var(--radius);font-family:var(--font);font-size:.88rem;font-weight:700;cursor:pointer;transition:all var(--trans);text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;text-decoration:none}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-primary{background:var(--primary);color:white}
.btn-primary:hover:not(:disabled){background:var(--primary-light);box-shadow:var(--shadow-md)}
.btn-secondary{background:var(--secondary);color:white}
.btn-secondary:hover:not(:disabled){background:var(--secondary-light)}
.btn-outline{background:transparent;border:1.5px solid var(--primary);color:var(--primary)}
.btn-outline:hover:not(:disabled){background:var(--primary);color:white}
.btn-danger{background:var(--status-lost);color:white}
.btn-danger:hover:not(:disabled){background:#8B1A1A}
.btn-ghost{background:transparent;color:var(--text-muted);border:1px solid var(--border)}
.btn-ghost:hover:not(:disabled){background:var(--surface-alt);color:var(--text)}
.btn-gold{background:var(--gold);color:#2C1608}
.btn-gold:hover:not(:disabled){background:var(--gold-light)}
.btn-sm{padding:.4rem .8rem;font-size:.78rem}
.btn-lg{padding:.9rem 2rem;font-size:1rem}
.btn-block{width:100%}
.btn-icon{padding:.5rem;border-radius:var(--radius)}

/* BADGES */
.badge{display:inline-flex;align-items:center;gap:.3rem;padding:.25rem .75rem;border-radius:var(--radius-full);font-size:.75rem;font-weight:700;letter-spacing:.4px}
.badge::before{content:'*';font-size:.6rem}
.badge-available{background:var(--status-available-bg);color:var(--status-available)}
.badge-condition-functional{background:#D1FAE5;color:#065F46;border:1.5px solid #6EE7B7;font-style:normal;letter-spacing:.2px}
.badge-condition-damaged{background:#FEE2E2;color:#991B1B;border:1.5px solid #FCA5A5;font-style:normal;letter-spacing:.2px}
body.dark .badge-condition-functional{background:#064E3B;color:#6EE7B7;border-color:#065F46}
body.dark .badge-condition-damaged{background:#450A0A;color:#FCA5A5;border-color:#991B1B}
.badge-safari{background:var(--status-safari-bg);color:var(--status-safari)}
.badge-transfer{background:var(--status-transfer-bg);color:var(--status-transfer)}
.badge-maintenance{background:var(--status-maintenance-bg);color:var(--status-maintenance)}
.badge-lost{background:var(--status-lost-bg);color:var(--status-lost)}
.badge-damaged{background:var(--status-damaged-bg);color:var(--status-damaged)}
.badge-active{background:var(--status-available-bg);color:var(--status-available)}
.badge-inactive{background:#f3f4f6;color:#6b7280}
/* -•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•
   SEITS v53 NEW FEATURE STYLES
   -•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-• */

/* -- Driver Guide (registry removed v70) ----------------------- */
.driver-search-wrap{position:relative}
.driver-search-wrap input{width:100%;padding:.7rem 1rem .7rem 2.4rem;border:1.5px solid var(--border);border-radius:var(--radius);background:#fff;color:var(--text);font-family:var(--font);font-size:.95rem;font-weight:600;transition:all var(--trans)}
body.dark .driver-search-wrap input{background:var(--surface-deep);border-color:var(--border-dark)}
.driver-search-wrap input:focus{outline:none;border-color:var(--secondary);box-shadow:0 0 0 3px rgba(85,117,31,.15)}
.driver-search-icon{position:absolute;left:.7rem;top:50%;transform:translateY(-50%);color:var(--text-muted);font-size:1rem;pointer-events:none}
.driver-dropdown{position:absolute;top:calc(100% + 3px);left:0;right:0;background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-lg);z-index:300;max-height:220px;overflow-y:auto;display:none}
.driver-dropdown.open{display:block}
.driver-option{padding:.6rem 1rem;cursor:pointer;font-size:.9rem;font-weight:600;color:var(--text);display:flex;align-items:center;gap:.5rem;transition:background .12s}
.driver-option:hover{background:var(--surface-alt)}
.driver-option.no-results{color:var(--text-muted);font-style:italic;cursor:default}
.driver-option .driver-opt-name{flex:1}
.driver-option .driver-opt-add{font-size:.72rem;font-weight:800;color:var(--secondary);text-transform:uppercase;letter-spacing:.4px}

/* -- Dispatch Confirmation Modal ---------------------------------- */
.dispatch-checklist{display:flex;flex-direction:column;gap:.75rem;margin:1rem 0}
.dispatch-check-item{display:flex;align-items:flex-start;gap:.75rem;padding:.85rem 1rem;background:var(--surface-alt);border:1.5px solid var(--border);border-radius:var(--radius);cursor:pointer;transition:all .15s}
.dispatch-check-item:hover{border-color:var(--secondary);background:var(--surface)}
.dispatch-check-item.checked{border-color:var(--secondary);background:var(--status-available-bg)}
.dispatch-check-item input[type=checkbox]{width:18px;height:18px;accent-color:var(--secondary);flex-shrink:0;margin-top:.1rem;cursor:pointer}
.dispatch-check-label{font-weight:600;font-size:.9rem;color:var(--text);line-height:1.4}
.dispatch-check-sub{font-size:.78rem;color:var(--text-muted);margin-top:.15rem}
.dispatch-summary{background:var(--surface-alt);border:1.5px solid var(--border);border-radius:var(--radius);padding:.85rem 1rem;margin-bottom:1rem;font-size:.85rem}
.dispatch-summary-row{display:flex;gap:.5rem;margin-bottom:.3rem;align-items:baseline}
.dispatch-summary-label{font-weight:800;font-size:.75rem;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);min-width:80px;flex-shrink:0}
.dispatch-summary-val{font-weight:700;color:var(--text);font-family:var(--font-mono);font-size:.85rem}

/* -- Return Deadline List View ------------------------------------ */
.rdm-detail-list{display:flex;flex-direction:column;gap:.5rem}
.rdm-detail-row-item{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;background:var(--surface-alt);border:1.5px solid var(--border);border-radius:var(--radius);transition:all .15s}
.rdm-detail-row-item:hover{border-color:var(--border-dark)}
.rdm-detail-row-item .rdm-item-type{font-weight:800;font-size:.9rem;min-width:130px;flex-shrink:0}
.rdm-detail-row-item .rdm-item-serial{font-family:var(--font-mono);font-size:.8rem;color:var(--text-muted);font-weight:700;min-width:90px;flex-shrink:0}
.rdm-detail-row-item .rdm-item-status{flex:1}
.rdm-detail-row-item .rdm-item-action{flex-shrink:0}
.rdm-btn-upcoming{background:var(--status-transfer-bg);color:var(--status-transfer);border:1.5px solid var(--status-transfer);font-size:.78rem;font-weight:800;padding:.3rem .75rem;border-radius:var(--radius-full);cursor:not-allowed;display:inline-flex;align-items:center;gap:.25rem;letter-spacing:.3px}

/* -- Damaged / Lost / Disposed Warning Modal ---------------------- */
.impact-warning-banner{background:var(--status-lost-bg);border:2px solid var(--status-lost);border-radius:var(--radius-lg);padding:.85rem 1rem;margin-bottom:1rem;display:flex;align-items:flex-start;gap:.65rem}
.impact-warning-banner .mi{color:var(--status-lost);font-size:1.3rem;flex-shrink:0;margin-top:.05rem}
.impact-warning-title{font-weight:800;font-size:.95rem;color:var(--status-lost);margin-bottom:.25rem}
.impact-warning-sub{font-size:.82rem;color:var(--text-muted)}
.impact-alloc-list{display:flex;flex-direction:column;gap:.4rem;margin:.75rem 0}
.impact-alloc-row{display:grid;grid-template-columns:1fr 1fr;gap:.35rem .75rem;padding:.65rem .85rem;background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius);font-size:.82rem}
.impact-alloc-row .impact-field label{font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--text-muted);display:block;margin-bottom:.1rem}
.impact-alloc-row .impact-field span{font-weight:700;color:var(--text)}
.impact-rec{background:var(--status-safari-bg);border:1px solid var(--status-safari);border-radius:var(--radius-sm);padding:.5rem .75rem;font-size:.8rem;font-weight:700;color:var(--status-safari);display:flex;align-items:flex-start;gap:.4rem;margin-top:.65rem}

/* -- Maintenance Image Upload -------------------------------------- */
.damage-img-drop{border:2px dashed var(--border-dark);border-radius:var(--radius);padding:1.25rem;text-align:center;cursor:pointer;transition:all .15s;background:var(--surface-alt);position:relative}
.damage-img-drop:hover{border-color:var(--secondary);background:var(--surface)}
.damage-img-drop.has-image{border-style:solid;border-color:var(--secondary)}
.damage-img-preview{max-width:100%;max-height:200px;object-fit:contain;border-radius:var(--radius-sm);display:block;margin:.75rem auto 0}
.damage-img-label{font-size:.82rem;color:var(--text-muted);font-weight:600;display:flex;flex-direction:column;align-items:center;gap:.4rem}
.damage-img-label .mi{font-size:2rem;opacity:.5}

/* -- Calendar View Tabs -------------------------------------------- */
.cal-view-tabs{display:flex;gap:.35rem;flex-wrap:wrap;margin-bottom:1.1rem}
.cal-view-tab{background:var(--surface-alt);border:1.5px solid var(--border);color:var(--text-muted);font-family:var(--font);font-size:.8rem;font-weight:700;padding:.35rem .85rem;border-radius:var(--radius-full);cursor:pointer;transition:all .15s;display:inline-flex;align-items:center;gap:.3rem;white-space:nowrap}
.cal-view-tab.active{background:var(--primary);color:white;border-color:var(--primary)}
.cal-view-tab:hover:not(.active){background:var(--border);color:var(--text)}

/* Week View */
.cal-week-grid{display:grid;grid-template-columns:60px repeat(7,1fr);border-top:1px solid var(--border);border-left:1px solid var(--border);border-radius:var(--radius)}
.cal-week-header{background:var(--surface-alt);padding:.45rem .35rem;text-align:center;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--primary);border-right:1px solid var(--border);border-bottom:1px solid var(--border)}
.cal-week-header.today{background:var(--status-available-bg);color:var(--status-available)}
.cal-week-header.time-col{color:var(--text-muted)}
.cal-week-cell{border-right:1px solid var(--border);border-bottom:1px solid var(--border);padding:.4rem .35rem;min-height:80px;vertical-align:top;font-size:.75rem}
.cal-week-cell.today{background:rgba(45,125,45,.03)}
.cal-week-time-cell{border-right:1px solid var(--border);border-bottom:1px solid var(--border);padding:.4rem .35rem;font-size:.68rem;color:var(--text-muted);font-weight:700;text-align:right}

/* Day View */
.cal-day-view{display:flex;flex-direction:column;gap:.65rem}
.cal-day-section{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-lg);overflow:hidden}
.cal-day-section-header{background:var(--surface-alt);padding:.6rem 1rem;font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--primary);border-bottom:1px solid var(--border);display:flex;align-items:center;gap:.4rem}
.cal-day-section-body{padding:.5rem 1rem}
.cal-day-event-row{display:flex;align-items:center;gap:.75rem;padding:.55rem 0;border-bottom:1px solid var(--border);font-size:.85rem}
.cal-day-event-row:last-child{border-bottom:none}
.cal-day-event-icon{font-size:1.1rem;flex-shrink:0;color:var(--text-muted)}
.cal-day-event-main{flex:1;min-width:0}
.cal-day-event-name{font-weight:800;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cal-day-event-meta{font-size:.75rem;color:var(--text-muted);margin-top:.1rem}

/* Equipment Timeline View */
.cal-tl-block{position:absolute;top:4px;bottom:4px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:.65rem;font-weight:800;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding:0 .3rem;cursor:pointer;transition:filter .15s}
.cal-tl-block:hover{filter:brightness(.9)}
.cal-tl-available{background:var(--status-available-bg);color:var(--status-available);border:1px solid var(--status-available)}
.cal-tl-allocated{background:var(--secondary);color:white}
.cal-tl-hold{background:var(--status-safari-bg);color:var(--status-safari);border:1.5px dashed var(--status-safari)}
.cal-tl-maintenance{background:var(--status-maintenance-bg);color:var(--status-maintenance)}
.cal-tl-lost{background:var(--status-lost-bg);color:var(--status-lost)}
.cal-tl-damaged{background:var(--status-damaged-bg);color:var(--status-damaged)}
.cal-tl-returned{background:var(--surface-deep);color:var(--text-muted)}

/* -- Calendar Conflict Visualization ------------------------------ */
.cal-day.cal-conflict-ok{background:rgba(45,125,45,.035)}
.cal-day.cal-conflict-warn{background:rgba(184,106,0,.05)}
.cal-day.cal-conflict-danger{background:rgba(176,32,32,.055)}
.cal-day.cal-conflict-ok .cal-day-num{color:var(--status-available)}
.cal-day.cal-conflict-warn .cal-day-num{color:var(--status-safari)}
.cal-day.cal-conflict-danger .cal-day-num{color:var(--status-lost)}
.conflict-indicator{width:6px;height:6px;border-radius:50%;display:inline-block;flex-shrink:0}
.conflict-ok{background:var(--status-available)}
.conflict-warn{background:var(--status-safari)}
.conflict-danger{background:var(--status-lost)}
.conflict-detail-modal{font-size:.88rem}
.conflict-detail-row{display:grid;grid-template-columns:1fr 1fr;gap:.4rem .9rem;margin-bottom:.5rem}
.conflict-field label{font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--text-muted);display:block;margin-bottom:.1rem}
.conflict-field span{font-weight:700;color:var(--text);display:block}
.conflict-shortage{background:var(--status-lost-bg);border:1.5px solid var(--status-lost);border-radius:var(--radius-sm);padding:.5rem .75rem;font-weight:800;font-size:.9rem;color:var(--status-lost);display:flex;align-items:center;gap:.4rem;margin-top:.5rem}
.conflict-ok-msg{background:var(--status-available-bg);border:1.5px solid var(--status-available);border-radius:var(--radius-sm);padding:.5rem .75rem;font-weight:700;font-size:.85rem;color:var(--status-available);display:flex;align-items:center;gap:.4rem;margin-top:.5rem}
.cal-conflict-legend{display:flex;align-items:center;gap:.85rem;flex-wrap:wrap;font-size:.74rem;font-weight:700}
.cal-conflict-legend-item{display:flex;align-items:center;gap:.3rem;color:var(--text-muted)}

/* -- Driver Guide Settings Panel ---------------------------------- */
.driver-registry-table th,.driver-registry-table td{font-size:.85rem}
.driver-guide-badge{display:inline-flex;align-items:center;gap:.25rem;font-size:.72rem;font-weight:800;padding:.15rem .5rem;border-radius:var(--radius-full)}
.driver-guide-badge.active{background:var(--status-available-bg);color:var(--status-available)}
.driver-guide-badge.inactive{background:#f3f4f6;color:#6b7280}

/* -- Dispatch + Return improvements ------------------------------- */
.rdm-detail-card{background:var(--surface-alt);border:1.5px solid var(--border);border-radius:var(--radius);padding:.85rem 1rem;margin-bottom:.6rem;transition:border-color .15s}
.rdm-detail-card:hover{border-color:var(--border-dark)}
.rdm-detail-main{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:.5rem}
.rdm-detail-actionbar{display:flex;gap:.4rem;flex-wrap:wrap;align-items:center}

/* -- Return confirmation: vertical item list ----------------------- */
.rdm-items-list{display:flex;flex-direction:column;gap:.5rem;margin-top:.75rem}
.rdm-items-list-row{display:flex;align-items:center;gap:.65rem;background:var(--surface-alt);border:1.5px solid var(--border);border-radius:var(--radius);padding:.7rem 1rem;transition:border-color .15s}
.rdm-items-list-row:hover{border-color:var(--border-dark)}
.rdm-items-row-type{font-weight:800;font-size:.88rem;flex-shrink:0;min-width:100px}
.rdm-items-row-serial{font-family:var(--font-mono);font-size:.78rem;color:var(--text-muted);font-weight:700;flex-shrink:0;min-width:80px}
.rdm-items-row-badges{display:flex;gap:.35rem;flex:1;flex-wrap:wrap;align-items:center}
.rdm-items-row-action{flex-shrink:0}

/* -- v53 version badge update ------------------------------------- */

/* -•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•
   SEITS v55 GLOBAL DESIGN SYSTEM + ALL PROMPT BLOCK STYLES
   -•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-• */

/* -- PROMPT BLOCK 3: Global Button Design System ------------------ */
/* Primary action buttons -> dark green bg, white text */
.btn-primary{background:var(--secondary);color:#fff;border-color:var(--secondary)}
.btn-primary:hover:not(:disabled){background:var(--secondary-light);box-shadow:var(--shadow-md);border-color:var(--secondary-light)}
/* Secondary buttons -> medium green */
.btn-secondary{background:var(--accent);color:#fff;border-color:var(--accent)}
.btn-secondary:hover:not(:disabled){background:var(--secondary)}
/* Ghost/outline -> green border, green text; hover fills green */
.btn-ghost{background:transparent;color:var(--secondary);border:1.5px solid var(--secondary)}
.btn-ghost:hover:not(:disabled){background:var(--secondary);color:#fff}
/* Gold buttons stay gold */
.btn-gold{background:var(--gold);color:#2C1608}
.btn-gold:hover:not(:disabled){background:var(--gold-light)}
/* Danger stays red */
.btn-danger{background:var(--status-lost);color:#fff}
.btn-danger:hover:not(:disabled){background:#8B1A1A}
/* Confirm allocation btn (in modals) */
#dispatch-confirm-btn,#safari-action-ok.btn-secondary,#safari-action-ok{background:var(--secondary);color:#fff}
#dispatch-confirm-btn:not(:disabled):hover,#safari-action-ok:hover{background:var(--secondary-light)}

/* -- PROMPT BLOCK 3: Active tab states -> chocolate/brown ----------- */
.chip-tab.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.chip-tab:hover:not(.active){border-color:var(--secondary);color:var(--secondary);background:var(--status-available-bg)}
.rpt-tab-btn.active{color:var(--primary);border-bottom-color:var(--primary)}
.rdm-minitab.active{color:var(--primary);border-bottom-color:var(--primary)}
.rdm-mode-btn.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.inv-subtab.active{background:var(--primary);border-color:var(--primary);color:#fff}
.inv-view-btn.active{background:var(--primary);color:#fff;box-shadow:var(--shadow-sm)}
.sk-rpt-tab.active{background:var(--primary);color:#fff;border-color:var(--primary)}
/* Inactive sk tabs */
.sk-rpt-tab{background:var(--secondary);color:#fff;border-color:var(--secondary)}
.sk-rpt-tab:hover:not(.active){background:var(--secondary-light);color:#fff}

/* -- PROMPT BLOCK 1 + 3: Calendar View Tabs ---------------------- */
/* Inactive = dark green bg, white text */
.cal-view-tab{background:var(--secondary);color:#fff;border-color:var(--secondary)}
.cal-view-tab:hover:not(.active){background:var(--secondary-light);color:#fff;border-color:var(--secondary-light)}
/* Active = chocolate/brown */
.cal-view-tab.active{background:var(--primary);color:#fff;border-color:var(--primary)}

/* -- PROMPT BLOCK 1: Calendar Control Buttons --------------------- */
.cal-nav-btn{background:var(--secondary);border-color:var(--secondary);color:#fff}
.cal-nav-btn:hover{background:var(--secondary-light);border-color:var(--secondary-light);color:#fff}
.cal-nav-center{background:var(--secondary);border-color:var(--secondary)}
.cal-month-select,.cal-year-select{color:#fff;font-weight:800;background:transparent}
.cal-month-select option,.cal-year-select option{background:var(--surface);color:var(--text)}
/* Today / nav buttons in calendar toolbar */
.cal-toolbar .btn-ghost{background:var(--secondary);color:#fff;border-color:var(--secondary)}
.cal-toolbar .btn-ghost:hover{background:var(--secondary-light);color:#fff}

/* -- PROMPT BLOCK 1: Week View Styling ---------------------------- */
.cal-week-grid{background:var(--bg-alt)}
.cal-week-header{background:var(--secondary);color:#fff;border-color:rgba(255,255,255,.15)}
.cal-week-header.today{background:var(--primary);color:#fff}
.cal-week-header.time-col{background:var(--primary);color:#fff}
.cal-week-cell{background:var(--surface);border-color:var(--border)}
.cal-week-cell.today{background:rgba(85,117,31,.06)}

/* -- PROMPT BLOCK 1: Day View Navigation -------------------------- */
.cal-day-view [onclick^="calDayShift"],
.cal-day-view [onclick="calDayGoToday()"],
button[onclick="calDayShift(-1)"],
button[onclick="calDayShift(1)"],
button[onclick="calDayGoToday()"]{background:var(--secondary);color:#fff;border-color:var(--secondary)}
button[onclick="calDayShift(-1)"]:hover,
button[onclick="calDayShift(1)"]:hover,
button[onclick="calDayGoToday()"]:hover{background:var(--secondary-light);color:#fff}

/* -- PROMPT BLOCK 1: Conflict toggle & legend ---------------------- */
#cal-conflict-btn{background:var(--secondary);color:#fff;border-color:var(--secondary)}
#cal-conflict-btn:hover{background:var(--secondary-light)}

/* -- PROMPT BLOCK 3: Pagination buttons -------------------------- */
.pgn-btn{background:var(--secondary);color:#fff;border:1.5px solid var(--secondary);border-radius:var(--radius-sm);padding:.38rem .9rem;font-family:var(--font);font-size:.82rem;font-weight:700;cursor:pointer;transition:all .18s ease;display:inline-flex;align-items:center;gap:.3rem}
.pgn-btn:hover:not(:disabled){background:var(--secondary-light);border-color:var(--secondary-light)}
.pgn-btn:disabled{opacity:.45;cursor:not-allowed;background:var(--surface-alt);border-color:var(--border);color:var(--text-muted)}
.pgn-info{font-size:.8rem;font-weight:700;color:var(--text-muted);padding:0 .5rem}

/* -- PROMPT BLOCK 2: Timeline Category Cards ---------------------- */
/* Timeline pagination inside category */

/* -- PROMPT BLOCK 5: Return Modal Vertical List ------------------- */
.rdm-items-list-row{display:flex;align-items:flex-start;gap:.65rem;flex-wrap:wrap;background:var(--surface-alt);border:1.5px solid var(--border);border-radius:var(--radius);padding:.75rem 1rem;margin-bottom:.5rem;transition:border-color .15s;width:100%;box-sizing:border-box}
.rdm-items-list-row:hover{border-color:var(--border-dark)}
.rdm-items-row-type{font-weight:800;font-size:.88rem;flex-shrink:0;min-width:0;color:var(--text)}
.rdm-items-row-serial{font-family:var(--font-mono);font-size:.78rem;color:var(--text-muted);font-weight:700;flex-shrink:0}
.rdm-items-row-badges{display:flex;gap:.35rem;flex-wrap:wrap;align-items:center}
.rdm-items-row-action{width:100%;margin-top:.4rem;display:flex;gap:.35rem;flex-wrap:wrap}

/* -- PROMPT BLOCK 6: Damage Image Preview ------------------------- */
.maint-img-cell{text-align:center}
.btn-view-pic{background:var(--secondary);color:#fff;border:none;border-radius:var(--radius-sm);padding:.28rem .7rem;font-family:var(--font);font-size:.75rem;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:.25rem;transition:background .15s}
.btn-view-pic:hover{background:var(--secondary-light)}
.damage-lightbox-img{max-width:100%;max-height:65vh;border-radius:var(--radius);display:block;margin:0 auto;box-shadow:var(--shadow-lg)}

/* -- PROMPT BLOCK 4: Driver Guide nav item in storekeeper sidebar -- */


/* -- PROMPT BLOCK 7: Global em-dash removal / layout cleanup ------- */
/* Ensure modal content doesn't overflow */
.modal{overflow-y:auto;word-wrap:break-word}
#safari-action-body{max-width:100%;overflow-x:hidden}
.rdm-items-list{display:flex;flex-direction:column;gap:.5rem;width:100%}
/* Modal action footer consistent button spacing */
.modal-footer{gap:.6rem;flex-wrap:wrap}
/* Fix horizontal overflow in return details */
.rdm-detail-main{flex-wrap:wrap}
.rdm-detail-actionbar{flex-wrap:wrap;gap:.35rem}

/* -- PROMPT BLOCK 3: Form action buttons consistent --------------- */
.btn-danger-solid{background:var(--status-lost);color:#fff;border:none}
.btn-danger-solid:hover{background:#8B1A1A;color:#fff}
.btn-chocolate,.btn-chocolate:focus{background:var(--primary);color:#fff;border:none}
.btn-chocolate:hover{background:var(--primary-light);color:#fff}

/* -- PROMPT BLOCK 3: Reports module tab consistent styling --------- */
.rpt-tab-btn{padding:.65rem 1.25rem}
.rpt-tab-btn:hover:not(.active){color:var(--secondary);border-bottom-color:var(--secondary)}

/* -- PROMPT BLOCK 3: Active safari filter + allocation buttons ------ */
.rdm-mode-btn{border-color:var(--secondary);color:var(--secondary)}
.rdm-mode-btn:hover:not(.active){background:var(--secondary);color:#fff;border-color:var(--secondary)}

/* -- Driver guide dropdown (allocation form) buttons -------------- */
.driver-option:hover{background:var(--status-available-bg)}

/* -- Ensure dispatch checkboxes render properly ------------------- */
.dispatch-check-item.checked{border-color:var(--secondary);background:var(--status-available-bg)}
#dispatch-confirm-btn:not(:disabled){background:var(--secondary);color:#fff}

/* -- PROMPT BLOCK 3: Consistent table action buttons -------------- */
.btn.btn-sm.btn-ghost{border-color:var(--secondary);color:var(--secondary)}
.btn.btn-sm.btn-ghost:hover{background:var(--secondary);color:#fff}

/* Dark mode compatibility */
body.dark .cal-view-tab{background:#2A3D12;color:rgba(255,255,255,.85)}
body.dark .cal-view-tab.active{background:var(--primary);color:#141008}
body.dark .cal-nav-btn{background:#2A3D12;border-color:#3A5520}


/* -•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•
   SEITS v56 - ADDITIONAL STYLES
   -•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-• */

/* PB1: Driver Guide Code badge */
.dg-code-badge{display:inline-flex;align-items:center;gap:.2rem;font-size:.7rem;font-weight:800;font-family:var(--font-mono);background:var(--surface-deep);border:1px solid var(--border-dark);color:var(--text-muted);padding:.1rem .45rem;border-radius:var(--radius-sm);letter-spacing:.3px}

/* PB2: Calendar nav center green/white */
.cal-nav-center{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-full);padding:.3rem .75rem;display:flex;align-items:center;gap:.3rem;box-shadow:var(--shadow-sm)}
.cal-month-select,.cal-year-select{color:var(--primary);background:transparent;border:none;font-weight:800;font-size:.92rem;cursor:pointer;padding:.1rem .2rem;outline:none;appearance:none;-webkit-appearance:none;font-family:var(--font)}
.cal-month-select:focus,.cal-year-select:focus{outline:2px solid rgba(255,255,255,.5);border-radius:var(--radius-sm)}
.cal-month-select option,.cal-year-select option{background:var(--surface);color:var(--text)}
.cal-nav-btn{background:var(--secondary) !important;border:1.5px solid var(--secondary) !important;color:#fff !important;border-radius:50%;width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:background .15s,box-shadow .15s;box-shadow:var(--shadow-sm)}
.cal-nav-btn:hover{background:var(--secondary-light) !important;border-color:var(--secondary-light) !important;box-shadow:var(--shadow-md)}

/* PB3: Logout confirmation */
.logout-confirm-icon{display:flex;align-items:center;justify-content:center;width:60px;height:60px;background:var(--status-safari-bg);border-radius:50%;margin:0 auto 1rem;border:2px solid var(--status-safari)}
.logout-confirm-icon .mi{font-size:2rem;color:var(--status-safari)}

/* PB4: Reports charts */
.rpt-charts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem;margin-bottom:1.25rem}
.rpt-chart-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.1rem;box-shadow:var(--shadow-sm)}
.rpt-chart-title{font-size:.78rem;font-weight:800;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:.65rem;display:flex;align-items:center;gap:.35rem}
.rpt-chart-wrap{position:relative;height:195px}
.rpt-export-bar{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:.85rem;align-items:center;padding:.5rem 0;border-bottom:1px solid var(--border)}

/* Dark mode fixes */
body.dark .cal-nav-center{background:var(--surface-alt);border-color:var(--border-dark)}
body.dark .cal-nav-btn{background:#2A3D12 !important;border-color:#3A5520 !important}
/* -•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•
   SEITS v54 ADDITIONAL STYLES
   -•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-•-• */

/* -- Reports Module ----------------------------------------------- */
.rpt-module-tabs{display:flex;gap:0;border-bottom:2px solid var(--border);margin-bottom:1.5rem;overflow-x:auto;-webkit-overflow-scrolling:touch}
.rpt-tab-btn{background:none;border:none;border-bottom:3px solid transparent;margin-bottom:-2px;font-family:var(--font);font-size:.875rem;font-weight:700;color:var(--text-muted);padding:.65rem 1.1rem;cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;gap:.35rem;transition:color .15s,border-color .15s}
.rpt-tab-btn:hover:not(.active){color:var(--text);border-bottom-color:var(--border-dark)}
.rpt-tab-btn.active{color:var(--primary);border-bottom-color:var(--primary);font-weight:800}
.rpt-section{display:none}
.rpt-section.active{display:block}
.rpt-stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.85rem;margin-bottom:1.25rem}
.rpt-stat-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1rem 1.25rem;border-left:4px solid var(--secondary);box-shadow:var(--shadow-sm);cursor:pointer;transition:all var(--trans)}
.rpt-stat-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}
.rpt-stat-card.danger{border-left-color:var(--status-lost)}
.rpt-stat-card.warning{border-left-color:var(--status-damaged)}
.rpt-stat-card.info{border-left-color:var(--status-transfer)}
.rpt-stat-card.gold{border-left-color:var(--gold)}
.rpt-stat-card.success{border-left-color:var(--status-available)}
.rpt-stat-label{font-size:.72rem;text-transform:uppercase;letter-spacing:.6px;color:var(--text-muted);font-weight:700;margin-bottom:.35rem}
.rpt-stat-val{font-size:1.8rem;font-weight:900;color:var(--primary);line-height:1}
.rpt-stat-sub{font-size:.72rem;color:var(--text-muted);margin-top:.25rem}
.rpt-filter-row{display:flex;gap:.65rem;flex-wrap:wrap;align-items:flex-end;background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius);padding:.85rem 1rem;margin-bottom:1rem}
.rpt-filter-group{display:flex;flex-direction:column;gap:.28rem;flex:1;min-width:140px}
.rpt-filter-lbl{font-size:.74rem;font-weight:700;color:var(--text-muted);white-space:nowrap}
.rpt-ctrl{height:34px;padding:.35rem .75rem;font-size:.84rem}
.rpt-actions-bar{display:flex;align-items:center;gap:.65rem;flex-wrap:wrap;margin-bottom:1rem}

/* -- Storekeeper Dashboard Reports -------------------------------- */
.sk-reports-section{margin-top:1.5rem}
.sk-reports-tabs{display:flex;gap:.35rem;flex-wrap:wrap;margin-bottom:1rem}
.sk-rpt-tab{background:var(--surface-alt);border:1.5px solid var(--border);color:var(--text-muted);font-family:var(--font);font-size:.8rem;font-weight:700;padding:.35rem .9rem;border-radius:var(--radius-full);cursor:pointer;transition:all .15s;display:inline-flex;align-items:center;gap:.3rem;white-space:nowrap}
.sk-rpt-tab.active{background:var(--secondary);color:white;border-color:var(--secondary)}
.sk-rpt-tab:hover:not(.active){background:var(--border);color:var(--text)}
.sk-rpt-panel{display:none}
.sk-rpt-panel.active{display:block}
.sk-rpt-filter-bar{display:flex;gap:.55rem;flex-wrap:wrap;align-items:flex-end;padding:.75rem;background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:.85rem}
.sk-rpt-filter-group{display:flex;flex-direction:column;gap:.2rem;flex:1;min-width:120px}
.sk-rpt-lbl{font-size:.72rem;font-weight:700;color:var(--text-muted)}
.sk-rpt-ctrl{height:32px;padding:.3rem .65rem;font-size:.82rem}

/* -- Pagination per-page selector --------------------------------- */
.pgn-bar{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;padding:.65rem 0;justify-content:center}
.pgn-bar .pgn-perpage{font-size:.78rem;color:var(--text-muted);font-weight:600;display:flex;align-items:center;gap:.3rem;margin-left:auto}
.pgn-bar .pgn-perpage select{height:28px;padding:.1rem .5rem;font-size:.78rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);color:var(--text);font-family:var(--font)}

/* -- Reports table improvements ----------------------------------- */
.rpt-inline-table{width:100%;border-collapse:collapse}
.rpt-inline-table th{background:var(--surface-alt);color:var(--primary);font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.6px;padding:.75rem .9rem;text-align:left;border-bottom:2px solid var(--border);white-space:nowrap}
.rpt-inline-table td{padding:.72rem .9rem;border-bottom:1px solid var(--border);color:var(--text);font-size:.87rem;vertical-align:top}
.rpt-inline-table tbody tr:hover{background:var(--surface-alt)}
.rpt-inline-table tbody tr:last-child td{border-bottom:none}
.rpt-empty-state{text-align:center;padding:2.5rem;color:var(--text-muted)}
.rpt-empty-state .mi{font-size:2.5rem;display:block;margin-bottom:.5rem;opacity:.4}

/* -- Forecast / conflict cards ------------------------------------- */
.forecast-card{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-lg);padding:1rem 1.25rem;margin-bottom:.65rem;display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem;transition:box-shadow .15s}
.forecast-card:hover{box-shadow:var(--shadow-sm)}
.forecast-card.fc-danger{border-left:4px solid var(--status-lost);background:var(--status-lost-bg)}
.forecast-card.fc-warning{border-left:4px solid var(--status-safari);background:var(--status-safari-bg)}
.forecast-card.fc-ok{border-left:4px solid var(--status-available)}
.forecast-card-title{font-weight:800;font-size:.9rem;color:var(--text);margin-bottom:.2rem}
.forecast-card-meta{font-size:.78rem;color:var(--text-muted);line-height:1.5}
.forecast-badge{font-size:.7rem;font-weight:900;padding:.2rem .6rem;border-radius:var(--radius-full);white-space:nowrap;flex-shrink:0}
.fc-badge-danger{background:var(--status-lost);color:white}
.fc-badge-warn{background:var(--status-safari);color:white}
.fc-badge-ok{background:var(--status-available);color:white}

/* -- Return Deadline Manager mini-tabs and mode buttons -- */
.rdm-minitab{background:none;border:none;cursor:pointer;font-family:var(--font);font-size:.85rem;font-weight:700;color:var(--text-muted);padding:.5rem .9rem;border-bottom:2.5px solid transparent;margin-bottom:-2px;transition:color .15s,border-color .15s;display:inline-flex;align-items:center;gap:.3rem}
.rdm-minitab.active{color:var(--primary);border-bottom-color:var(--primary)}
.rdm-minitab:hover:not(.active){color:var(--text);border-bottom-color:var(--border)}
.rdm-mode-btn{background:var(--surface-alt);border:1.5px solid var(--border);color:var(--text-muted);font-family:var(--font);font-size:.78rem;font-weight:700;padding:.3rem .75rem;border-radius:var(--radius-full);cursor:pointer;transition:all .15s;white-space:nowrap}
.rdm-mode-btn.active{background:var(--primary);color:white;border-color:var(--primary)}
.rdm-mode-btn:hover:not(.active){background:var(--border);color:var(--text)}
/* Calendar day cells */
.rdm-cal-day{text-align:center;font-size:.78rem;font-weight:600;padding:.28rem .1rem;border-radius:var(--radius-sm);cursor:pointer;transition:background .1s,color .1s;line-height:1.3;color:var(--text)}
.rdm-cal-day:hover{background:var(--secondary);color:white}
.rdm-cal-day.cal-today{font-weight:900;color:var(--secondary)}
.rdm-cal-day.cal-selected{background:var(--primary);color:white;border-radius:var(--radius-sm)}
.rdm-cal-day.cal-in-range{background:var(--status-available-bg);color:var(--status-available)}
.rdm-cal-day.cal-range-end{background:var(--primary);color:white}
.rdm-cal-day.cal-empty{cursor:default}
.rdm-cal-day.cal-has-deadline{position:relative}
.rdm-cal-day.cal-has-deadline::after{content:'';position:absolute;bottom:2px;left:50%;transform:translateX(-50%);width:4px;height:4px;border-radius:50%;background:var(--status-safari)}
/* Multi-date mode: individually toggled date highlight */
.rdm-cal-day.cal-multi-selected{background:var(--secondary);color:white;border-radius:var(--radius-sm)}
.rdm-cal-day.cal-multi-selected:hover{background:var(--secondary-light);color:white}
/* Multi-date chip strip below the calendar input */
.rdm-multi-chips{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.45rem}
.rdm-multi-chip{display:inline-flex;align-items:center;gap:.3rem;background:var(--secondary);color:white;font-size:.73rem;font-weight:700;padding:.2rem .55rem .2rem .65rem;border-radius:var(--radius-full);white-space:nowrap}
.rdm-multi-chip button{background:none;border:none;color:white;cursor:pointer;font-size:.85rem;line-height:1;padding:0;margin-left:.1rem;opacity:.8;display:flex;align-items:center}
.rdm-multi-chip button:hover{opacity:1}
/* Cal-mode toggle strip inside the calendar popup header */
.rdm-cal-mode-strip{display:flex;gap:.3rem;margin-bottom:.6rem}
.rdm-cal-mode-pill{background:var(--surface-alt);border:1.5px solid var(--border);color:var(--text-muted);font-family:var(--font);font-size:.73rem;font-weight:700;padding:.22rem .65rem;border-radius:var(--radius-full);cursor:pointer;transition:all .15s;white-space:nowrap}
.rdm-cal-mode-pill.active{background:var(--primary);color:white;border-color:var(--primary)}
.rdm-cal-mode-pill:hover:not(.active){background:var(--border);color:var(--text)}
/* Deadline cards */
.rdm-deadline-card{border-radius:var(--radius-lg);padding:1rem 1.15rem;margin-bottom:.65rem;display:grid;grid-template-columns:minmax(160px,1.15fr) minmax(180px,1.3fr) minmax(150px,1fr) auto;align-items:center;gap:1rem;transition:box-shadow .15s}
.rdm-deadline-card:hover{box-shadow:0 2px 12px rgba(0,0,0,.08)}
.rdm-deadline-card.rdm-overdue{background:var(--status-lost-bg);border:1.5px solid var(--status-lost)}
.rdm-deadline-card.rdm-today{background:var(--status-available-bg);border:1.5px solid var(--status-available)}
.rdm-deadline-card.rdm-upcoming{background:var(--surface);border:1.5px solid var(--border)}
.rdm-safari-code{font-family:var(--font-mono);font-weight:900;font-size:.98rem;color:var(--text);letter-spacing:.3px}
.rdm-meta-row{display:flex;flex-wrap:wrap;gap:.35rem .9rem;margin-top:.35rem;font-size:.8rem;color:var(--text-muted)}
.rdm-meta-item{display:flex;align-items:center;gap:.25rem}
.rdm-client-block{display:flex;flex-direction:column;min-width:0}
.rdm-field-label,.rdm-deadline-date>small{font-size:.62rem;text-transform:uppercase;color:var(--text-muted);font-weight:800;letter-spacing:0}
.rdm-client-block>strong{font-size:1rem;color:var(--primary);font-weight:850;overflow-wrap:anywhere}
.rdm-client-block>span{font-size:.74rem;color:var(--text-muted);margin-top:.15rem}
.rdm-equipment-summary{display:flex;flex-wrap:wrap;gap:.4rem;margin:0}
.rdm-equipment-item{display:inline-flex;align-items:center;gap:.4rem;color:var(--text);font-size:.82rem;min-width:0;padding:.32rem .65rem;background:var(--surface);border:1px solid var(--border-dark);border-radius:var(--radius-full);box-shadow:var(--shadow-sm)}
.rdm-equipment-item .mi{font-size:1.2rem;color:var(--secondary)}
.rdm-equipment-item strong{font-weight:750}
.rdm-equipment-count{display:inline-grid;place-items:center;min-width:1.25rem;height:1.25rem;padding:0 .25rem;border-radius:var(--radius-full);background:var(--secondary);color:white;font-size:.68rem;font-weight:800}
.rdm-guide-highlight{display:inline-flex;align-items:center;gap:.45rem;color:var(--text)}
.rdm-guide-highlight>.mi{color:var(--status-available);font-size:1.25rem}
.rdm-guide-highlight span{display:flex;flex-direction:column;line-height:1.15}
.rdm-guide-highlight small{font-size:.62rem;text-transform:uppercase;color:var(--text-muted);font-weight:800}
.rdm-guide-highlight strong{font-size:.9rem;color:var(--status-available)}
.rdm-guide-highlight a,.rdm-guide-highlight em{font-size:.73rem;color:var(--status-available);font-style:normal;margin-top:.18rem;text-decoration:none}
.rdm-guide-highlight em{color:var(--text-muted)}
.rdm-deadline-end{display:flex;align-items:center;justify-content:flex-end;gap:.8rem}
.rdm-deadline-date{display:flex;flex-direction:column;align-items:flex-end;gap:.18rem;white-space:nowrap}
.rdm-deadline-date>span{font-size:.73rem;color:var(--text-muted)}
.rdm-deadline-date>span:not(.rdm-urgency-badge){font-size:.76rem;color:var(--primary);font-weight:800}
.rdm-actions{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap;justify-content:flex-end}
.rdm-urgency-badge{font-size:.66rem;font-weight:900;letter-spacing:.4px;padding:.2rem .6rem;border-radius:var(--radius-full);white-space:nowrap;display:inline-flex;align-items:center;gap:.25rem}
.rdm-deadline-date>.rdm-urgency-overdue{background:var(--status-lost);color:#FFF}
.rdm-deadline-date>.rdm-urgency-today{background:var(--status-available);color:#FFF}
.rdm-deadline-date>.rdm-urgency-upcoming{background:var(--surface);color:var(--primary);border:1px solid var(--primary)}
.rdm-urgency-badge>.mi{color:inherit}
/* Due-Today summary banner */
.rdm-due-summary{background:var(--status-available-bg);border:1.5px solid var(--status-available);border-radius:var(--radius-lg);padding:.85rem 1.1rem;margin-bottom:1rem}
.rdm-due-summary-header{display:flex;align-items:center;gap:.55rem;margin-bottom:.6rem}
.rdm-due-summary-title{font-weight:800;font-size:.95rem;color:var(--status-available)}
.rdm-due-summary-total{font-size:.78rem;font-weight:700;background:var(--status-available);color:white;padding:.15rem .55rem;border-radius:var(--radius-full);white-space:nowrap}
.rdm-due-summary-grid{display:flex;flex-wrap:wrap;gap:.45rem}
.rdm-due-cat-pill{display:inline-flex;align-items:center;gap:.3rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-full);padding:.22rem .7rem;font-size:.76rem;font-weight:700;color:var(--text)}
.rdm-due-cat-pill .rdm-cat-count{background:var(--secondary);color:white;border-radius:var(--radius-full);padding:.06rem .42rem;font-size:.68rem;font-weight:800}
.rdm-due-summary-empty{color:var(--text-muted);font-size:.85rem;font-style:italic}
.return-auto-stamp{display:flex;align-items:flex-start;gap:.55rem;background:var(--status-available-bg);border:1px solid var(--status-available);border-radius:var(--radius-sm);padding:.65rem .75rem;margin:.65rem 0;color:var(--text)}
.return-auto-stamp>.mi{color:var(--status-available);font-size:1.2rem}
.return-auto-stamp span{display:flex;flex-direction:column;gap:.1rem}
.return-auto-stamp small{color:var(--text-muted);font-size:.75rem}
.return-override-toggle{display:flex;align-items:center;gap:.45rem;font-size:.8rem;font-weight:700;color:var(--text-muted);margin:.55rem 0;cursor:pointer}
.return-override-toggle input{accent-color:var(--secondary)}
.return-confirmed-time{display:flex;align-items:center;gap:.2rem;color:var(--text-muted);font-family:var(--font-mono);font-size:.74rem;margin-top:.15rem}
.allocation-driver-phone{display:flex;align-items:center;gap:.2rem;color:var(--status-available);font-size:.74rem;margin-top:.15rem;white-space:nowrap}
.allocation-driver-phone-row .form-group{max-width:calc(50% - .5rem)}
@media(max-width:1050px){.rdm-deadline-card{grid-template-columns:1fr 1fr}.rdm-deadline-end{justify-content:space-between}.rdm-deadline-date{align-items:flex-start}}
@media(max-width:620px){.rdm-deadline-card{grid-template-columns:1fr}.rdm-deadline-end{justify-content:space-between;align-items:flex-end}.rdm-actions{justify-content:flex-start}}
@media(max-width:768px){.allocation-driver-phone-row .form-group{max-width:100%}}

/* TABLES */
.table-wrap{overflow-x:auto;border-radius:var(--radius)}
table{width:100%;border-collapse:collapse;min-width:640px}
th{background:var(--surface-alt);color:var(--primary);font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.7px;padding:.85rem 1rem;text-align:left;border-bottom:2px solid var(--border);white-space:nowrap}
td{padding:.8rem 1rem;border-bottom:1px solid var(--border);color:var(--text);font-size:.9rem}
tbody tr:hover{background:var(--surface-alt)}
tbody tr:last-child td{border-bottom:none}

/* MODALS */
.modal-overlay{position:fixed;inset:0;background:rgba(20,10,5,.65);backdrop-filter:blur(4px);z-index:1000;display:none;align-items:center;justify-content:center;padding:1rem}
.modal-overlay.open{display:flex}
.modal-overlay.open.modal-underlay{pointer-events:none}
.modal-overlay.open.modal-underlay>.modal{filter:saturate(.78) brightness(.86)}
.modal{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:2rem;width:100%;max-width:680px;max-height:92vh;overflow-y:auto;box-shadow:var(--shadow-xl);animation:slideUp .3s ease}
.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}
.modal-title{font-size:1.15rem;font-weight:800;color:var(--primary)}
.modal-close{background:none;border:none;cursor:pointer;color:var(--text-muted);font-size:1.4rem;line-height:1;padding:.2rem}
.modal-close:hover{color:var(--text)}
.modal-footer{display:flex;justify-content:flex-end;gap:.75rem;margin-top:1.5rem;padding-top:1rem;border-top:1px solid var(--border)}
.modal-window{position:relative;min-width:min(360px,calc(100vw - 2rem));min-height:220px}
.modal-window.modal-window-sized{position:fixed;margin:0;max-height:none;display:flex;flex-direction:column;overflow:auto}
.modal-window-resizing{user-select:none;transition:none!important;animation:none!important}
.modal-resize-handle{position:absolute;z-index:8;display:block;touch-action:none}
.modal-resize-n,.modal-resize-s{left:10px;right:10px;height:10px;cursor:ns-resize}
.modal-resize-e,.modal-resize-w{top:10px;bottom:10px;width:10px;cursor:ew-resize}
.modal-resize-n{top:0}.modal-resize-s{bottom:0}.modal-resize-e{right:0}.modal-resize-w{left:0}
.modal-resize-ne,.modal-resize-nw,.modal-resize-se,.modal-resize-sw{width:16px;height:16px}
.modal-resize-ne{right:0;top:0;cursor:nesw-resize}
.modal-resize-nw{left:0;top:0;cursor:nwse-resize}
.modal-resize-se{right:0;bottom:0;cursor:nwse-resize}
.modal-resize-sw{left:0;bottom:0;cursor:nesw-resize}
@media(max-width:700px){.modal-resize-handle{display:none}.modal-window{min-width:0;min-height:0}.modal-window.modal-window-sized{position:relative!important;left:auto!important;top:auto!important;width:100%!important;height:auto!important;max-height:calc(100vh - 2rem)!important}}
.allocation-wizard-modal{padding-bottom:1.25rem}
.allocation-wizard-modal-body{min-height:0;overflow:auto;padding-right:.2rem}
.allocation-wizard-in-modal{max-width:none!important;width:100%}
.allocation-wizard-in-modal .allocation-wizard-actions{display:none!important}
.allocation-wizard-modal-footer{flex:0 0 auto}
@media(max-width:700px){.allocation-wizard-modal-footer{position:sticky;bottom:0;background:var(--surface);z-index:4}.allocation-wizard-modal-footer .btn{flex:1;min-width:145px}}

/* PROGRESS */
.progress-wrap{background:var(--surface-alt);border-radius:var(--radius-full);height:10px;overflow:hidden}
.progress-bar{height:100%;border-radius:var(--radius-full);background:linear-gradient(90deg,var(--secondary),var(--secondary-light));transition:width .6s ease}
.progress-bar.danger{background:linear-gradient(90deg,var(--status-lost),#EF8080)}
.progress-bar.gold{background:linear-gradient(90deg,var(--gold),var(--gold-light))}

/* CHIP TABS */
.chip-tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.25rem}
.chip-tab{padding:.4rem 1rem;border-radius:var(--radius-full);border:1.5px solid var(--border);background:var(--surface-alt);font-size:.82rem;font-weight:700;cursor:pointer;transition:all var(--trans);color:var(--text)}
.chip-tab:hover{border-color:var(--secondary);color:var(--secondary)}
.chip-tab.active{background:var(--primary);color:white;border-color:var(--primary)}

/* TOAST */
.toast-stack{position:fixed;bottom:1.5rem;right:1.5rem;z-index:9998;display:flex;flex-direction:column;gap:.6rem;pointer-events:none}
.toast{pointer-events:auto;background:var(--primary);color:white;padding:.85rem 1.4rem;border-radius:var(--radius);box-shadow:var(--shadow-lg);font-weight:600;font-size:.88rem;display:flex;align-items:center;gap:.6rem;opacity:0;transform:translateX(24px);transition:all .3s ease;max-width:360px}
.toast.in{opacity:1;transform:translateX(0)}
.toast.success{background:var(--status-available)}
.toast.warning{background:var(--status-safari)}
.toast.error{background:var(--status-lost)}

/* ALERTS */
.alert{padding:.85rem 1.25rem;border-radius:var(--radius);font-size:.9rem;font-weight:600;margin-bottom:1rem;display:flex;align-items:flex-start;gap:.6rem}
.alert-warning{background:var(--status-safari-bg);color:var(--status-safari);border-left:4px solid var(--status-safari)}
.alert-danger{background:var(--status-lost-bg);color:var(--status-lost);border-left:4px solid var(--status-lost)}
.alert-info{background:var(--status-transfer-bg);color:var(--status-transfer);border-left:4px solid var(--status-transfer)}
.alert-success{background:var(--status-available-bg);color:var(--status-available);border-left:4px solid var(--status-available)}
.empty-state{text-align:center;padding:3.5rem 2rem;color:var(--text-muted)}
.empty-icon{font-size:3rem;margin-bottom:1rem;opacity:.6}
.empty-title{font-size:1.1rem;font-weight:700;color:var(--text);margin-bottom:.5rem}

/* CHARTS */
.chart-wrap{position:relative}
.chart-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.5rem;margin-bottom:1.5rem}

/* AUDIT LOG */
.audit-item{display:flex;gap:.75rem;align-items:flex-start;padding:.75rem 0;border-bottom:1px solid var(--border)}
.audit-item:last-child{border-bottom:none}
.audit-dot{width:8px;height:8px;border-radius:50%;background:var(--secondary);margin-top:.45rem;flex-shrink:0}
.audit-dot.add{background:var(--status-available)}
.audit-dot.remove{background:var(--status-lost)}
.audit-dot.edit{background:var(--status-safari)}
.audit-dot.transfer{background:var(--status-transfer)}
.audit-text{font-size:.88rem;color:var(--text)}
.audit-time{font-size:.75rem;color:var(--text-muted);margin-top:.1rem;font-family:var(--font-mono)}

/* THEME TOGGLE */
.theme-btn{background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius-full);padding:.45rem .9rem;color:var(--text-muted);font-size:.8rem;font-weight:700;cursor:pointer;transition:all var(--trans);white-space:nowrap}
.theme-btn:hover{background:var(--surface-deep);color:var(--text)}

/* MISC */
.divider{height:1px;background:var(--border);margin:1.25rem 0}
.text-muted{color:var(--text-muted)}.text-sm{font-size:.82rem}.fw-bold{font-weight:700}.fw-black{font-weight:900}
.color-primary{color:var(--primary)}.mono{font-family:var(--font-mono)}
.flex{display:flex}.items-center{align-items:center}.gap-1{gap:.5rem}.gap-2{gap:1rem}
.flex-wrap{flex-wrap:wrap}.justify-between{justify-content:space-between}
.mt-1{margin-top:.5rem}.mt-2{margin-top:1rem}.mb-2{margin-bottom:1rem}.hidden{display:none!important}
#mobile-nav-toggle{display:none}
.nav-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:399}
.nav-overlay.show{display:block}

/* RESPONSIVE */
@media(max-width:768px){.app-main{padding:1rem}.stats-grid{grid-template-columns:repeat(2,1fr)}.form-row>*{min-width:100%}.modal{padding:1.5rem}.chart-grid{grid-template-columns:1fr}}
@media(max-width:480px){.stats-grid{grid-template-columns:1fr}.app-main{padding:.75rem}}

/* EQUIPMENT ITEM CARD */
.eq-card{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius);padding:1.1rem 1.25rem;transition:all var(--trans);position:relative;border-left:5px solid var(--secondary)}
.eq-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);border-color:var(--border-dark)}
.eq-card.st-available{border-left-color:var(--status-available)}
.eq-card.st-safari{border-left-color:var(--status-safari)}
.eq-card.st-transfer{border-left-color:var(--status-transfer)}
.eq-card.st-maintenance{border-left-color:var(--status-maintenance)}
.eq-card.st-lost{border-left-color:var(--status-lost)}
.eq-card.st-damaged{border-left-color:var(--status-damaged)}
.eq-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:1rem}
.eq-head{display:flex;justify-content:space-between;align-items:flex-start;gap:.5rem;margin-bottom:.6rem}
.eq-name{font-weight:700;font-size:.95rem;color:var(--text)}
.eq-serial{font-size:.72rem;font-weight:700;background:var(--surface-alt);color:var(--text-muted);padding:.15rem .5rem;border-radius:var(--radius-full);white-space:nowrap;font-family:var(--font-mono)}
.eq-meta{font-size:.78rem;color:var(--text-muted);margin-bottom:.75rem}
.eq-actions{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}

/* LOW STOCK WARNING */
.low-stock-item{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.65rem .85rem;background:var(--status-safari-bg);border-radius:var(--radius-sm);border-left:3px solid var(--status-safari);margin-bottom:.5rem}
.low-stock-item:last-child{margin-bottom:0}

/* CONFIRM DIALOG */
.confirm-dialog{max-width:420px}
/* OVERDUE RETURNS ALERT */
.overdue-card{background:var(--surface);border:2px solid var(--status-lost);border-radius:var(--radius-lg);padding:1.4rem 1.5rem;margin-bottom:1.5rem;box-shadow:0 0 0 4px rgba(176,32,32,.07)}
.overdue-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;flex-wrap:wrap;gap:.5rem}
.overdue-card-title{font-size:1.05rem;font-weight:800;color:var(--status-lost);display:flex;align-items:center;gap:.5rem}
.overdue-safari-group{border:1px solid var(--border);border-left:4px solid var(--status-lost);border-radius:var(--radius);margin-bottom:.75rem;overflow:hidden}
.overdue-safari-group:last-child{margin-bottom:0}
.overdue-safari-header{background:var(--status-lost-bg);padding:.6rem 1rem;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem}
.overdue-safari-name{font-weight:800;font-size:.9rem;color:var(--status-lost);font-family:var(--font-mono)}
.overdue-safari-meta{font-size:.78rem;color:var(--text-muted);font-weight:600}
.overdue-item-row{display:flex;align-items:center;justify-content:space-between;padding:.55rem 1rem;border-top:1px solid var(--border);gap:.75rem;flex-wrap:wrap}
.overdue-item-row:first-of-type{border-top:none}
.overdue-item-eq{font-size:.85rem;font-weight:700;color:var(--text);display:flex;align-items:center;gap:.4rem}
.overdue-days-badge{background:var(--status-lost);color:white;font-size:.7rem;font-weight:800;padding:.18rem .55rem;border-radius:var(--radius-full);white-space:nowrap;flex-shrink:0}
.overdue-days-badge.warn{background:var(--status-safari)}
.stat-card.overdue{border-left-color:var(--status-lost)}
body.dark .overdue-card{border-color:var(--status-lost);box-shadow:0 0 0 4px rgba(239,96,96,.06)}
/* AFFECTED FUTURE BOOKINGS ALERT */
.affected-card{background:var(--surface);border:2px solid var(--status-safari);border-radius:var(--radius-lg);padding:1.4rem 1.5rem;margin-bottom:1.5rem;box-shadow:0 0 0 4px rgba(184,106,0,.06)}
.affected-card-title{font-size:1.05rem;font-weight:800;color:var(--status-safari);display:flex;align-items:center;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap;justify-content:space-between}
.affected-booking-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem;padding:.65rem 1rem;border:1px solid var(--border);border-left:4px solid var(--status-safari);border-radius:var(--radius);margin-bottom:.6rem;background:var(--surface)}
.affected-booking-row:last-child{margin-bottom:0}
.affected-booking-info{font-size:.85rem;font-weight:700;color:var(--text)}
.affected-booking-meta{font-size:.78rem;color:var(--text-muted);margin-top:.1rem}
.affected-badge{background:var(--status-safari);color:white;font-size:.7rem;font-weight:800;padding:.18rem .55rem;border-radius:var(--radius-full);white-space:nowrap;display:flex;align-items:center;gap:.3rem}
body.dark .affected-card{border-color:var(--status-safari);box-shadow:0 0 0 4px rgba(240,160,64,.06)}
/* CHECKBOX ITEM PICKER (Allocation form serial selector) */
.eq-picker-wrap{border:1.5px solid var(--border);border-radius:var(--radius);background:var(--surface);overflow:hidden}
.eq-picker-search{display:flex;align-items:center;gap:.5rem;padding:.55rem .75rem;border-bottom:1px solid var(--border);background:var(--surface-alt)}
.eq-picker-search input{flex:1;border:none;background:transparent;font-family:var(--font);font-size:.88rem;font-weight:600;color:var(--text);outline:none}
.eq-picker-search input::placeholder{color:var(--text-muted);font-weight:500}
.eq-picker-search .mi{color:var(--text-muted);font-size:1rem;flex-shrink:0}
.eq-picker-list{max-height:220px;overflow-y:auto;padding:.35rem 0}
.eq-picker-list::-webkit-scrollbar{width:5px}
.eq-picker-list::-webkit-scrollbar-thumb{background:var(--border-dark);border-radius:var(--radius-full)}
.eq-picker-empty{padding:1.25rem 1rem;text-align:center;color:var(--text-muted);font-size:.85rem;font-weight:600}
.eq-picker-item{display:flex;align-items:center;gap:.75rem;padding:.55rem 1rem;cursor:pointer;transition:background var(--trans);user-select:none}
.eq-picker-item:hover{background:var(--surface-alt)}
.eq-picker-item.is-checked{background:rgba(85,117,31,.08)}
.eq-picker-item.is-disabled{opacity:.45;cursor:not-allowed;pointer-events:none}
.eq-picker-item input[type=checkbox]{width:16px;height:16px;flex-shrink:0;accent-color:var(--secondary);cursor:pointer}
.eq-picker-item-body{flex:1;min-width:0}
.eq-picker-serial{font-size:.88rem;font-weight:800;color:var(--text);font-family:var(--font-mono)}
.eq-picker-nickname{font-size:.75rem;color:var(--text-muted);font-weight:600;margin-top:.05rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.eq-picker-status{font-size:.72rem;font-weight:700;color:var(--status-available);display:flex;align-items:center;gap:.25rem;flex-shrink:0}
/* Selection counter bar */
.eq-picker-counter{display:flex;align-items:center;justify-content:space-between;padding:.5rem .85rem;border-top:1px solid var(--border);background:var(--surface-alt);font-size:.82rem;font-weight:700;min-height:36px}
.eq-picker-counter .count-ok{color:var(--status-available)}
.eq-picker-counter .count-warn{color:var(--status-safari)}
.eq-picker-counter .count-over{color:var(--status-lost)}
.eq-picker-counter .count-muted{color:var(--text-muted)}
body.dark .eq-picker-item.is-checked{background:rgba(138,189,74,.08)}
/* SETTINGS */
.settings-section{margin-bottom:2rem}
.settings-section-title{font-size:.88rem;font-weight:800;text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted);margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid var(--border)}
.logo-preview-box{width:100%;max-width:320px;height:80px;background:var(--surface-alt);border:2px dashed var(--border-dark);border-radius:var(--radius);display:flex;align-items:center;justify-content:center;overflow:hidden;margin-bottom:.75rem}
.logo-preview-box img{max-height:72px;max-width:300px;object-fit:contain}
/* CATEGORY MANAGER */
.cat-chip{display:inline-flex;align-items:center;gap:.4rem;background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius-full);padding:.3rem .75rem .3rem .85rem;font-size:.82rem;font-weight:600;color:var(--text)}
.cat-chip button{background:none;border:none;cursor:pointer;color:var(--text-muted);font-size:.8rem;line-height:1;display:flex;align-items:center;padding:0}
.cat-chip button:hover{color:var(--status-lost)}
.cat-list{display:flex;flex-wrap:wrap;gap:.5rem;min-height:40px;padding:.5rem;background:var(--surface-alt);border-radius:var(--radius);border:1px solid var(--border)}
/* AVAILABILITY SUMMARY */
.avail-summary{border-radius:var(--radius);border:1.5px solid var(--border);background:var(--surface-alt);padding:.9rem 1.1rem;margin-top:.6rem;margin-bottom:.25rem;font-size:.84rem}
.avail-summary .avail-row{display:flex;justify-content:space-between;align-items:center;padding:.2rem 0;border-bottom:1px solid var(--border)}
.avail-summary .avail-row:last-child{border-bottom:none;padding-top:.4rem;margin-top:.2rem;font-weight:800;font-size:.9rem}
.avail-summary .avail-count{font-weight:700;font-family:var(--font-mono);font-size:.88rem}
.avail-summary .avail-count.good{color:var(--status-available)}
.avail-summary .avail-count.warn{color:var(--status-safari)}
.avail-summary .avail-count.bad{color:var(--status-lost)}
.avail-warning{background:var(--status-lost-bg);color:var(--status-lost);border:1.5px solid var(--status-lost);border-radius:var(--radius);padding:.65rem 1rem;font-size:.86rem;font-weight:700;display:flex;align-items:center;gap:.5rem;margin-top:.5rem}
.avail-ok{background:var(--status-available-bg);color:var(--status-available);border:1.5px solid var(--status-available);border-radius:var(--radius);padding:.65rem 1rem;font-size:.86rem;font-weight:700;display:flex;align-items:center;gap:.5rem;margin-top:.5rem}
.date-step-hint{background:var(--status-transfer-bg);color:var(--status-transfer);border-radius:var(--radius-sm);padding:.55rem .9rem;font-size:.82rem;font-weight:600;display:flex;align-items:center;gap:.45rem;margin-bottom:.75rem}
/* -- ALLOCATION STEP FLOW -------------------------------------------------
   Progressive 3-step form. Steps 2 and 3 are hidden until prerequisites
   in the previous step are complete. */
.al-step{border:1.5px solid var(--border);border-radius:var(--radius-lg);padding:1.25rem 1.4rem;margin-bottom:1rem;transition:all .22s ease;background:var(--surface)}
.al-step.step-locked{background:var(--bg-alt);border-color:var(--border);opacity:.6;pointer-events:none}
.al-step.step-active{border-color:var(--secondary);box-shadow:0 0 0 3px rgba(85,117,31,.1)}
.al-step.step-done{border-color:var(--border-dark)}
.al-step-header{display:flex;align-items:center;gap:.7rem;margin-bottom:1.1rem;padding-bottom:.75rem;border-bottom:1px solid var(--border)}
.al-step-num{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.78rem;font-weight:900;flex-shrink:0}
.step-locked .al-step-num{background:var(--border);color:var(--text-muted)}
.step-active .al-step-num{background:var(--secondary);color:white}
.step-done   .al-step-num{background:var(--status-available);color:white}
.al-step-title{font-size:.88rem;font-weight:800;color:var(--text)}
.step-locked .al-step-title{color:var(--text-muted)}
.al-step-status{margin-left:auto;font-size:.72rem;font-weight:700}
.step-active .al-step-status{color:var(--secondary)}
.step-done   .al-step-status{color:var(--status-available)}
.step-locked .al-step-status{color:var(--text-muted)}

/* -•-•-•-•-•-•-•-•-•-•-•-•-•-
   AVAILABILITY CALENDAR
-•-•-•-•-•-•-•-•-•-•-•-•-•- */
/* Toolbar N/A two rows on narrow viewports */
.cal-toolbar{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:1.1rem}
.cal-toolbar-row{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.cal-toolbar select,.cal-toolbar input{height:36px;padding:.35rem .8rem;font-size:.86rem}
/* Nav buttons N/A round, stronger */
.cal-nav-btn{background:var(--surface);border:1.5px solid var(--border);border-radius:50%;color:var(--text-muted);cursor:pointer;font-size:1rem;width:34px;height:34px;display:flex;align-items:center;justify-content:center;transition:all .18s ease;flex-shrink:0;box-shadow:var(--shadow-sm)}
.cal-nav-btn:hover{background:var(--primary);color:white;border-color:var(--primary);box-shadow:var(--shadow-md)}
/* Month + year dropdowns inline */
.cal-month-select{font-size:.95rem;font-weight:800;color:var(--primary);background:transparent;border:none;cursor:pointer;padding:.1rem .2rem;outline:none;appearance:none;-webkit-appearance:none;font-family:var(--font)}
.cal-month-select:focus{outline:2px solid var(--secondary);border-radius:var(--radius-sm)}
.cal-year-select{font-size:.95rem;font-weight:800;color:var(--primary);background:transparent;border:none;cursor:pointer;padding:.1rem .2rem;outline:none;appearance:none;-webkit-appearance:none;font-family:var(--font)}
.cal-year-select:focus{outline:2px solid var(--secondary);border-radius:var(--radius-sm)}
.cal-nav-center{display:flex;align-items:center;gap:.3rem;background:var(--surface-alt);border:1.5px solid var(--border);border-radius:var(--radius-full);padding:.25rem .65rem;box-shadow:var(--shadow-sm)}
/* Summary bar */
.cal-summary-bar{display:flex;gap:.75rem;flex-wrap:wrap;margin-bottom:1.1rem}
.cal-sum-chip{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius);padding:.5rem .95rem;font-size:.8rem;font-weight:700;display:flex;align-items:center;gap:.45rem;white-space:nowrap;box-shadow:var(--shadow-sm)}
.cal-sum-chip .csval{font-size:1.1rem;font-weight:900;margin-left:.25rem}
.cal-sum-chip.cs-total{border-left:4px solid var(--text-muted)}
.cal-sum-chip.cs-booked{border-left:4px solid var(--status-safari)}
.cal-sum-chip.cs-avail{border-left:4px solid var(--status-available)}
/* Calendar grid N/A stronger card depth */
.cal-grid-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--radius-lg);box-shadow:var(--shadow-md)}
.cal-grid{min-width:700px;border:1.5px solid var(--border-dark);border-radius:var(--radius-lg);overflow:hidden;background:var(--surface)}
.cal-weekdays{display:grid;grid-template-columns:repeat(7,1fr);background:var(--primary);border-bottom:none}
.cal-weekday{padding:.6rem .3rem;text-align:center;font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.7px;color:rgba(255,253,248,.7)}
.cal-days{display:grid;grid-template-columns:repeat(7,1fr)}
/* Day cells */
.cal-day{min-height:96px;border-right:1px solid var(--border);border-bottom:1px solid var(--border);padding:.4rem .45rem;position:relative;cursor:pointer;transition:background .15s ease;vertical-align:top}
.cal-day:nth-child(7n){border-right:none}
.cal-day:hover{background:rgba(85,117,31,.05)}
/* Today N/A stronger green tint + solid circle on number */
.cal-day.cal-today{background:rgba(85,117,31,.09)}
.cal-day.cal-today .cal-day-num{background:var(--secondary);color:white;border-radius:50%;width:26px;height:26px;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:.82rem;box-shadow:0 2px 6px rgba(85,117,31,.35)}
/* Selected day N/A clear inset border + stronger tint */
.cal-day.cal-selected{background:rgba(85,117,31,.08);box-shadow:inset 0 0 0 2.5px var(--secondary)}
.cal-day.cal-other-month{background:var(--bg-alt)}
.cal-day.cal-other-month .cal-day-num{color:var(--border-dark)}
.cal-day-num{font-size:.8rem;font-weight:700;color:var(--text-muted);margin-bottom:.28rem;line-height:1;width:26px;height:26px;display:flex;align-items:center;justify-content:center}
/* Busy indicators N/A stronger */
.cal-day.cal-busy-high{background:rgba(176,32,32,.04)}
.cal-day.cal-busy-high .cal-day-num{color:var(--status-lost);font-weight:900}
.cal-day.cal-busy-mid{background:rgba(184,106,0,.03)}
.cal-day.cal-busy-mid .cal-day-num{color:var(--status-safari);font-weight:900}
/* Booking blocks N/A green-primary palette */
.cal-block{border-radius:var(--radius-sm);padding:.2rem .5rem;font-size:.69rem;font-weight:700;margin-bottom:.2rem;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:filter .15s,box-shadow .15s;line-height:1.45;box-shadow:0 1px 3px rgba(0,0,0,.12)}
.cal-block:hover{filter:brightness(.9);box-shadow:0 2px 6px rgba(0,0,0,.18)}
/* Green-forward palette N/A 8 tones anchored on system greens/golds */
.cal-block-c0{background:#3F5D17;color:#F5F0E8}          /* deep accent green  */
.cal-block-c1{background:#55751F;color:white}             /* secondary green    */
.cal-block-c2{background:#6A9128;color:white}             /* lighter green      */
.cal-block-c3{background:#B8861A;color:#2C1608}           /* gold               */
.cal-block-c4{background:#8A6200;color:white}             /* dark gold          */
.cal-block-c5{background:#2D7D2D;color:white}             /* forest green       */
.cal-block-c6{background:#1A5E3A;color:white}             /* teal-green         */
.cal-block-c7{background:#5A7A10;color:white}             /* olive green        */
.cal-more{font-size:.68rem;color:var(--status-transfer);font-weight:800;cursor:pointer;padding:.18rem .5rem;border-radius:var(--radius-full);background:var(--status-transfer-bg);border:1px solid var(--status-transfer);margin-top:.1rem;display:inline-flex;align-items:center;gap:.2rem;transition:background .15s,color .15s}
.cal-more:hover{background:var(--status-transfer);color:white}
/* -- Calendar overflow modal N/A day-all-items list -------------------------
   .cal-overflow-row  = one booking row inside the "View All" day modal.
   Reuses existing cal-detail-row proportions but slightly more compact.   */
.cal-overflow-row{display:flex;align-items:center;gap:.65rem;padding:.55rem .75rem;border-bottom:1px solid var(--border);cursor:pointer;transition:background .15s;border-radius:var(--radius-sm)}
.cal-overflow-row:last-child{border-bottom:none}
.cal-overflow-row:hover{background:var(--surface-alt)}
.cal-overflow-icon{font-size:1.1rem;flex-shrink:0;opacity:.8}
.cal-overflow-main{flex:1;min-width:0}
.cal-overflow-safari{font-size:.82rem;font-weight:800;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cal-overflow-meta{font-size:.72rem;color:var(--text-muted);margin-top:.08rem}
/* Day detail panel N/A card depth */
.cal-detail-panel{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-lg);padding:1.25rem 1.5rem;margin-top:1.25rem;min-height:100px;box-shadow:var(--shadow-sm)}
.cal-detail-title{font-size:.95rem;font-weight:800;color:var(--primary);margin-bottom:1rem;display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.cal-detail-row{display:flex;align-items:flex-start;gap:1rem;padding:.65rem 0;border-bottom:1px solid var(--border)}
.cal-detail-row:last-child{border-bottom:none}
.cal-detail-safari{font-size:.82rem;font-weight:800;color:var(--text);min-width:110px}
.cal-detail-meta{font-size:.78rem;color:var(--text-muted);flex:1;line-height:1.5}
.cal-detail-badge{flex-shrink:0}
/* Calendar booking detail modal body */
.cal-modal-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem 1.5rem;margin-bottom:1rem}
.cal-modal-field label{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);display:block;margin-bottom:.15rem}
.cal-modal-field span{font-size:.9rem;font-weight:600;color:var(--text)}
.cal-modal-serials{background:var(--surface-alt);border-radius:var(--radius-sm);padding:.6rem .85rem;font-size:.82rem;font-weight:600;font-family:var(--font-mono);color:var(--text);margin-top:.5rem;line-height:1.6}
/* Dark mode overrides */
body.dark .cal-day:hover{background:rgba(138,189,74,.04)}
body.dark .cal-day.cal-today{background:rgba(138,189,74,.08)}
body.dark .cal-day.cal-selected{background:rgba(138,189,74,.07);box-shadow:inset 0 0 0 2.5px var(--secondary)}
/* --- HOLD / RESERVED BLOCKS in calendar ---
   Soft dashed-border stripe blocks visually distinct from solid confirmed allocations */
.cal-block-hold{background:repeating-linear-gradient(135deg,rgba(184,134,26,.18),rgba(184,134,26,.18) 3px,rgba(184,134,26,.06) 3px,rgba(184,134,26,.06) 8px);color:var(--gold);border:1.5px dashed var(--gold);border-radius:var(--radius-sm);padding:.2rem .5rem;font-size:.69rem;font-weight:700;margin-bottom:.2rem;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:filter .15s,box-shadow .15s;line-height:1.45}
.cal-block-hold:hover{filter:brightness(.93);box-shadow:0 2px 6px rgba(184,134,26,.25)}
/* Hold records table / panel */
.hold-badge{background:var(--status-safari-bg);color:var(--status-safari);border:1px solid var(--status-safari);font-size:.7rem;font-weight:800;padding:.18rem .55rem;border-radius:var(--radius-full);white-space:nowrap;display:inline-flex;align-items:center;gap:.25rem}
.hold-released{text-decoration:line-through;opacity:.55}
/* --- ACTIVE SAFARIS FILTER TOOLBAR ----------------------------------------
   sf- prefix = Safari Filters. Compact two-row grid that wraps cleanly on
   mobile. Reuses form-control sizing N/A no new palette tokens introduced.   */
.sf-filter-card{padding:1.1rem 1.25rem 1rem}
.sf-filter-label{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.7px;color:var(--text-muted);margin-bottom:.75rem;display:flex;align-items:center;gap:.4rem}
.sf-filter-row{display:flex;flex-wrap:wrap;gap:.65rem}
.sf-filter-group{display:flex;flex-direction:column;gap:.28rem;flex:1;min-width:150px}
.sf-filter-lbl{font-size:.74rem;font-weight:700;color:var(--text-muted);white-space:nowrap}
.sf-ctrl{height:34px;padding:.35rem .75rem;font-size:.84rem}
select.sf-ctrl{height:34px}
.sf-filter-actions{display:flex;align-items:center;gap:.85rem;margin-top:.85rem;padding-top:.75rem;border-top:1px solid var(--border)}
.sf-result-count{font-size:.78rem;font-weight:700;color:var(--text-muted)}
.sf-result-count.has-results{color:var(--secondary)}
.sf-result-count.no-results{color:var(--status-lost)}
/* Upcoming row N/A subtle tint instead of opacity so text stays sharp */
.sf-row-upcoming td{background:rgba(58,90,138,.04)}
/* Returned / Cancelled rows N/A crossed through like hold-released */
.sf-row-returned td,.sf-row-cancelled td{opacity:.6}
body.dark .sf-row-upcoming td{background:rgba(122,170,223,.05)}
/* --- OPERATIONAL ALERTS PANEL ---------------------------------------------
   Compact, scannable alert rows grouped by urgency category.
   Uses existing system colour tokens N/A no new palette introduced. */
.ops-alerts-wrap{margin-bottom:1.5rem}
.ops-alerts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1rem}
/* Category card */
.ops-cat{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm)}
.ops-cat-header{display:flex;align-items:center;gap:.55rem;padding:.65rem 1rem;font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.6px;border-bottom:1px solid var(--border)}
.ops-cat-header .mi{font-size:1.05rem}
/* Category colour variants */
.ops-cat.cat-danger  .ops-cat-header{background:var(--status-lost-bg);     color:var(--status-lost)}
.ops-cat.cat-warning .ops-cat-header{background:var(--status-safari-bg);   color:var(--status-safari)}
.ops-cat.cat-today   .ops-cat-header{background:var(--status-maintenance-bg);color:var(--status-maintenance)}
.ops-cat.cat-info    .ops-cat-header{background:var(--status-transfer-bg); color:var(--status-transfer)}
.ops-cat.cat-ready   .ops-cat-header{background:var(--status-available-bg);color:var(--status-available)}
/* Individual alert rows inside a category card */
.ops-row{display:flex;align-items:center;justify-content:space-between;padding:.55rem 1rem;border-bottom:1px solid var(--border);gap:.5rem;flex-wrap:wrap}
.ops-row:last-child{border-bottom:none}
.ops-row-left{flex:1;min-width:0}
.ops-row-title{font-size:.85rem;font-weight:700;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ops-row-meta{font-size:.75rem;color:var(--text-muted);margin-top:.08rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ops-row-right{display:flex;align-items:center;gap:.4rem;flex-shrink:0}
.ops-pill{font-size:.68rem;font-weight:800;padding:.18rem .55rem;border-radius:var(--radius-full);white-space:nowrap}
.ops-pill.p-danger {background:var(--status-lost-bg);    color:var(--status-lost)}
.ops-pill.p-warning{background:var(--status-safari-bg);  color:var(--status-safari)}
.ops-pill.p-info   {background:var(--status-transfer-bg);color:var(--status-transfer)}
.ops-pill.p-ok     {background:var(--status-available-bg);color:var(--status-available)}
.ops-pill.p-purple {background:var(--status-maintenance-bg);color:var(--status-maintenance)}
/* Empty state inside a category */
.ops-empty{padding:.75rem 1rem;font-size:.82rem;color:var(--text-muted);font-style:italic}
/* "All clear" full-width bar shown when everything is clean */
.ops-all-clear{background:var(--status-available-bg);border:1.5px solid var(--status-available);border-radius:var(--radius-lg);padding:.85rem 1.25rem;display:flex;align-items:center;gap:.6rem;font-size:.9rem;font-weight:700;color:var(--status-available);margin-bottom:1.5rem}
/* --- DASHBOARD FILTER BAR --------------------------------------------------
   Single compact bar at the top of the dashboard. Filters propagate down to
   stat cards, overdue panel, and affected bookings panel where applicable.
   Charts and recent-activity log are unaffected (date-independent views).   */
.dash-filter-bar{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-lg);padding:.85rem 1.1rem;margin-bottom:1.35rem;display:flex;flex-wrap:wrap;align-items:flex-end;gap:.75rem;box-shadow:var(--shadow-sm)}
.dash-filter-bar .dfl{display:flex;flex-direction:column;gap:.22rem;flex:1;min-width:130px}
.dash-filter-bar .dfl label{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--text-muted);white-space:nowrap}
.dash-filter-bar .dfc{height:32px;padding:.3rem .7rem;font-size:.84rem;border:1.5px solid var(--border);border-radius:var(--radius);background:var(--bg);color:var(--text);font-family:var(--font);font-weight:600;transition:border-color var(--trans)}
.dash-filter-bar .dfc:focus{outline:none;border-color:var(--secondary)}
body.dark .dash-filter-bar .dfc{background:var(--surface-deep);border-color:var(--border-dark)}
.dash-filter-bar .dfl-actions{display:flex;align-items:flex-end;gap:.5rem;flex-shrink:0;padding-bottom:0}
/* Active-filter indicator: tinted border when any filter is set */
.dash-filter-bar.has-filters{border-color:var(--secondary);border-left:4px solid var(--secondary)}
/* Small "filtered" badge shown on stat cards that were affected by a filter */
.stat-filtered-note{font-size:.68rem;font-weight:700;color:var(--secondary);margin-top:.25rem;display:flex;align-items:center;gap:.25rem;opacity:.9}
/* --- UNIVERSAL PAGINATION ---------------------------------------------------
   Shared pagination bar used by all list/table views.
   .pgn-bar  = outer flex row; hidden when not needed (<= PAGE_SIZE rows).
   .pgn-info = "Page X of Y  -  N records" label, centred.
   .pgn-btn  = prev/next buttons; disabled state handled by the helper.        */
.pgn-bar{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.65rem 1rem;border-top:1px solid var(--border);margin-top:0;flex-wrap:wrap}
.pgn-bar.pgn-hidden{display:none}
.pgn-info{font-size:.78rem;font-weight:700;color:var(--text-muted);text-align:center;flex:1;white-space:nowrap}
.pgn-btn{display:inline-flex;align-items:center;gap:.3rem;padding:.38rem .85rem;border:1.5px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);font-family:var(--font);font-size:.8rem;font-weight:700;cursor:pointer;transition:all var(--trans);white-space:nowrap}
.pgn-btn:hover:not(:disabled){background:var(--surface-alt);border-color:var(--border-dark)}
.pgn-btn:disabled{opacity:.38;cursor:not-allowed}
body.dark .pgn-btn{background:var(--surface-deep);border-color:var(--border-dark)}
body.dark .pgn-btn:hover:not(:disabled){background:var(--surface-alt)}
/* --- DASHBOARD SECTION HEADERS ---------------------------------------------
   .dash-section-hdr  = labelled divider between dashboard sections.
   Lighter than .section-title N/A it's within a page, not at the top level.   */
.dash-section-hdr{display:flex;align-items:center;gap:.55rem;font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted);margin:1.5rem 0 .85rem;padding-bottom:.45rem;border-bottom:1.5px solid var(--surface-deep)}
.dash-section-hdr .mi{font-size:1rem;opacity:.7}
body.dark .dash-section-hdr{border-bottom-color:var(--border)}

/* --- OPERATIONS NOTES WIDGET -----------------------------------------------
   Compact, single-card note board.  Intentionally simple N/A not a chat app.  */
.ops-note-item{display:flex;align-items:flex-start;gap:.65rem;padding:.65rem .85rem;border-bottom:1px solid var(--border);transition:background .15s}
.ops-note-item:last-child{border-bottom:none}
.ops-note-item:hover{background:var(--surface-alt)}
/* -- Unread state: subtle left accent + light background tint ------------ */
.ops-note-item.unread{background:rgba(85,117,31,.05);border-left:3px solid var(--secondary)}
.ops-note-item.unread:hover{background:rgba(85,117,31,.09)}
/* -- Mentioned state: stronger gold accent, shown when current user is tagged */
.ops-note-item.mentioned{background:rgba(184,134,26,.07);border-left:3px solid var(--gold)}
.ops-note-item.mentioned.unread{background:rgba(184,134,26,.12);border-left:3px solid var(--gold)}
.ops-note-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;margin-top:.38rem}
.ops-note-dot.urg-high{background:var(--status-lost)}
.ops-note-dot.urg-med {background:var(--status-safari)}
.ops-note-dot.urg-low {background:var(--status-available)}
.ops-note-body{flex:1;min-width:0}
.ops-note-msg{font-size:.875rem;font-weight:700;color:var(--text);line-height:1.4;word-break:break-word}
.ops-note-meta{font-size:.72rem;color:var(--text-muted);margin-top:.18rem}
.ops-note-del{background:none;border:none;cursor:pointer;color:var(--text-muted);padding:.2rem;border-radius:var(--radius-sm);display:flex;align-items:center;transition:color .15s,background .15s;flex-shrink:0}
.ops-note-del:hover{color:var(--status-lost);background:var(--status-lost-bg)}
.ops-note-empty{padding:1rem .85rem;font-size:.82rem;color:var(--text-muted);font-style:italic}
.ops-note-form{padding:.75rem .85rem;border-top:1.5px solid var(--border);background:var(--surface-alt);display:flex;flex-direction:column;gap:.55rem}
.ops-note-form textarea{resize:none;min-height:56px;font-size:.875rem}
.ops-note-form-row{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.ops-note-urg{height:30px;font-size:.82rem;flex:1;min-width:120px}
/* -- Badge-style mention/tag selector --------------------------------------
   Replaces the multi-select <select>. Each tag is a clickable chip with a
   checkbox. Selected chips use the secondary/gold palette for clear feedback. */
.mention-badge-wrap{display:flex;flex-wrap:wrap;gap:.4rem;padding:.5rem 0}
.mention-badge{display:inline-flex;align-items:center;gap:.28rem;padding:.28rem .65rem;border-radius:var(--radius-full);border:1.5px solid var(--border);background:var(--surface-alt);color:var(--text-muted);font-size:.75rem;font-weight:700;cursor:pointer;user-select:none;transition:all .18s ease;letter-spacing:.3px}
.mention-badge:hover{border-color:var(--secondary);color:var(--secondary);background:var(--surface)}
.mention-badge.selected{border-color:var(--secondary);background:var(--secondary);color:white}
.mention-badge.selected.admin-tag{background:var(--primary);border-color:var(--primary);color:white}
.mention-badge.selected.manager-tag{background:#3A5A8A;border-color:#3A5A8A;color:white}
.mention-badge.selected.reservation-officer-tag{background:#5B3A9D;border-color:#5B3A9D;color:white}
.mention-badge.selected.reservation-manager-tag{background:#176B63;border-color:#176B63;color:white}
.mention-badge .mention-check{width:14px;height:14px;border-radius:50%;border:1.5px solid currentColor;display:flex;align-items:center;justify-content:center;font-size:.6rem;flex-shrink:0}
.mention-badge.selected .mention-check{background:rgba(255,255,255,.3)}
/* -- Note detail modal ----------------------------------------------------- */
.note-detail-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.6rem .9rem;margin:1rem 0}
.note-detail-field label{font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);display:block;margin-bottom:.15rem}
.note-detail-field span{font-weight:700;color:var(--text);font-size:.9rem}
/* -- Stronger delete button on note cards --------------------------------- */
.ops-note-del{background:var(--status-lost-bg);border:1.5px solid var(--status-lost);color:var(--status-lost);padding:.32rem .55rem;border-radius:var(--radius-sm);cursor:pointer;display:flex;align-items:center;gap:.2rem;font-size:.75rem;font-weight:700;font-family:var(--font);transition:all .15s;flex-shrink:0;white-space:nowrap}
.ops-note-del:hover{background:var(--status-lost);color:white}
/* -- Mention / tag chips shown below note message ------------------------ */
.ops-note-tags{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.35rem}
.ops-tag{display:inline-flex;align-items:center;gap:.2rem;font-size:.68rem;font-weight:800;padding:.15rem .5rem;border-radius:var(--radius-full);background:var(--status-transfer-bg);color:var(--status-transfer);letter-spacing:.3px}
.ops-tag.tag-me{background:var(--gold-light);color:#2C1608}  /* highlighted when tag is current user */
/* -- Unread badge on sidebar nav button ------------------------------------ */
.ops-unread-badge{display:inline-flex;align-items:center;justify-content:center;
  min-width:18px;height:18px;padding:0 4px;border-radius:var(--radius-full);
  background:var(--status-lost);color:white;font-size:.62rem;font-weight:900;
  margin-left:auto;flex-shrink:0;line-height:1}
/* -- Mention dropdown in post form ---------------------------------------- */
.mention-select{height:32px;font-size:.82rem;flex:1;min-width:180px}
/* --- INVENTORY VIEW TOGGLE --------------------------------------------------
   .inv-view-btn = toggle pill button for card/list switch.
   .eq-list-wrap = table wrapper for list view, mirrors .table-wrap sizing.
   List rows use existing badge + action button patterns unchanged.           */
.inv-toggle-wrap{display:flex;align-items:center;gap:.3rem;background:var(--surface-alt);border:1.5px solid var(--border);border-radius:var(--radius);padding:.2rem;flex-shrink:0}
.inv-view-btn{background:none;border:none;cursor:pointer;padding:.3rem .6rem;border-radius:calc(var(--radius) - 2px);color:var(--text-muted);display:flex;align-items:center;gap:.3rem;font-size:.78rem;font-weight:700;font-family:var(--font);transition:all .18s ease;white-space:nowrap}
.inv-view-btn.active{background:var(--surface);color:var(--primary);box-shadow:var(--shadow-sm)}
.inv-view-btn:hover:not(.active){color:var(--text);background:rgba(0,0,0,.04)}
/* List view table N/A compact, same token system as other tables */
.eq-list-wrap table{min-width:560px}
.eq-list-wrap th{white-space:nowrap}
.eq-list-type-cell{display:flex;align-items:center;gap:.45rem;font-weight:700}
/* Category-based left accent on cards N/A subtle palette tints per type family */
.eq-card.cat-optics{border-left-color:#3A5A8A}
.eq-card.cat-connectivity{border-left-color:#2D7D2D}
.eq-card.cat-comfort{border-left-color:#B8861A}
.eq-card.cat-safety{border-left-color:#6B21A8}
.eq-card.cat-power{border-left-color:#55751F}


/* --- ACTIVE / DISPOSED INVENTORY TABS + CATEGORY CARDS ---------------------
   Added in v43. Category cards act as quick filters and disposed inventory
   is separated from operational stock so unavailable items never confuse the
   allocation workflow. */
.inv-subtabs{display:flex;gap:.5rem;flex-wrap:wrap;margin:.2rem 0 1rem}
.inv-subtab{background:var(--surface-alt);border:1.5px solid var(--border);color:var(--text-muted);font-family:var(--font);font-size:.82rem;font-weight:800;padding:.45rem 1rem;border-radius:var(--radius-full);cursor:pointer;transition:all .18s ease;display:inline-flex;align-items:center;gap:.35rem}
.inv-subtab.active{background:var(--primary);border-color:var(--primary);color:white;box-shadow:var(--shadow-sm)}
.inv-subtab:hover:not(.active){border-color:var(--secondary);color:var(--secondary);background:var(--surface)}
.inv-type-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.75rem;margin-bottom:1rem}
.inv-type-card{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-lg);padding:.85rem 1rem;text-align:left;cursor:pointer;box-shadow:var(--shadow-sm);transition:all .18s ease;border-left:4px solid var(--secondary);display:flex;align-items:center;gap:.7rem}
.inv-type-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--border-dark)}
.inv-type-card.active{border-color:var(--secondary);box-shadow:0 0 0 3px rgba(85,117,31,.12),var(--shadow-md);background:var(--status-available-bg)}
.inv-type-card .inv-type-icon{width:36px;height:36px;border-radius:var(--radius);display:flex;align-items:center;justify-content:center;background:var(--surface-alt);color:var(--primary);font-size:1.2rem;flex-shrink:0}
.inv-type-card.active .inv-type-icon{background:var(--secondary);color:white}
.inv-type-name{font-weight:900;font-size:.86rem;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.inv-type-meta{font-size:.72rem;color:var(--text-muted);font-weight:700;margin-top:.1rem}
.inv-type-count{font-family:var(--font-mono);font-weight:900;color:var(--primary)}
.btn-danger-solid{background:var(--status-lost)!important;color:white!important;border:1.5px solid var(--status-lost)!important}
.btn-danger-solid:hover{background:#8B1A1A!important;color:white!important}
.btn-chocolate{background:var(--primary)!important;color:var(--text-inverse)!important;border:1.5px solid var(--primary)!important}
.btn-chocolate:hover{background:var(--primary-light)!important;color:white!important}
body.dark .btn-chocolate{color:#141008!important}

/* -- Return Details modal action bar -----------------------------------------
   Keeps Confirm Return / Mark Damaged / Mark Lost / Extend-Reassign in one
   horizontal action list on wide screens, with clean wrapping on mobile. */
.rdm-detail-card{border:1px solid var(--border);border-radius:var(--radius);padding:.75rem 1rem;margin-bottom:.6rem;background:var(--surface)}
.rdm-detail-main{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.75rem}
.rdm-detail-actionbar{display:flex;align-items:center;justify-content:flex-end;gap:.45rem;flex-wrap:wrap;max-width:100%}
.rdm-detail-actionbar .btn{white-space:nowrap;min-height:34px}
@media(max-width:680px){.rdm-detail-main{align-items:flex-start}.rdm-detail-actionbar{justify-content:flex-start;width:100%}.rdm-detail-actionbar .btn{flex:1 1 auto;min-width:145px}}

/* --- DARK MODE CALENDAR CONTRAST FIXES --------------------------------------
   The weekday header row uses --primary-dark which in dark mode is a warm tan
   (#C8A880) N/A too light for dark backgrounds.  Override to a deep brown that
   matches the dark sidebar colour, and boost text opacity for readability.    */
body.dark .cal-weekdays{background:#1A140C}           /* deep dark-brown header  */
body.dark .cal-weekday{color:rgba(210,190,155,.85)}    /* warmer, more readable   */
/* Grid border + day cell backgrounds N/A subtle refinements for dark mode only */
body.dark .cal-grid{border-color:#3A3020}
body.dark .cal-day{border-color:#2A2015}
body.dark .cal-day.cal-busy-high{background:rgba(176,32,32,.08)}
body.dark .cal-day.cal-busy-mid {background:rgba(184,106,0,.06)}
body.dark .cal-day-num{color:rgba(210,190,155,.6)}
body.dark .cal-day.cal-today .cal-day-num{background:var(--secondary);color:#141008}
/* Day-number text for other-month cells needs extra fade in dark mode */
body.dark .cal-day.cal-other-month{background:#161008}
body.dark .cal-day.cal-other-month .cal-day-num{color:rgba(150,130,100,.4)}

/* --- MODERN NON-BLOCKING LOADER --------------------------------------------
   #app-loader stays outside document flow and is driven by showLoader().
   It replaces the old plain line with a compact QuickBooks-style activity pill. */
#app-loader{
  position:fixed;
  top:calc(var(--header-h) + 10px);
  left:50%;
  width:min(360px, calc(100vw - 32px));
  min-height:42px;
  transform:translateX(-50%) translateY(-8px);
  z-index:9997;
  display:none;
  pointer-events:none;
  opacity:0;
}
#app-loader.visible{
  display:grid;
  grid-template-columns:42px 1fr;
  align-items:center;
  gap:.65rem;
  opacity:1;
  transform:translateX(-50%) translateY(0);
  transition:opacity .22s ease, transform .22s ease;
}
#app-loader.fade-out{
  opacity:0;
  transform:translateX(-50%) translateY(-8px);
  transition:opacity .24s ease, transform .24s ease;
}
.loader-bar-wrap{
  grid-column:1 / -1;
  grid-row:1;
  width:100%;
  min-height:42px;
  border:1px solid rgba(var(--secondary-rgb,85,117,31),.22);
  border-radius:999px;
  background:
    linear-gradient(110deg,rgba(255,255,255,.88),rgba(255,255,255,.72)),
    rgba(var(--secondary-rgb,85,117,31),.10);
  box-shadow:0 12px 28px rgba(20,30,12,.14), 0 2px 8px rgba(20,30,12,.08);
  position:relative;
  overflow:hidden;
  backdrop-filter:blur(12px);
}
body.dark .loader-bar-wrap{
  background:
    linear-gradient(110deg,rgba(36,38,30,.9),rgba(26,28,22,.78)),
    rgba(var(--secondary-rgb,138,189,74),.10);
  box-shadow:0 12px 30px rgba(0,0,0,.28), 0 2px 10px rgba(0,0,0,.18);
}
.loader-bar-wrap:before{
  content:"";
  position:absolute;
  left:14px;
  top:50%;
  width:14px;
  height:14px;
  border-radius:999px;
  background:var(--secondary);
  box-shadow:0 0 0 6px rgba(var(--secondary-rgb,85,117,31),.14);
  transform:translateY(-50%);
  animation:loader-orbit-pulse 1.2s ease-in-out infinite;
}
.loader-bar-wrap:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(100deg,transparent 0%,rgba(255,255,255,.45) 42%,transparent 72%);
  transform:translateX(-110%);
  animation:loader-sheen 1.45s ease-in-out infinite;
}
.loader-bar{
  position:absolute;
  left:42px;
  right:14px;
  bottom:8px;
  height:3px;
  border-radius:999px;
  overflow:hidden;
  background:rgba(var(--secondary-rgb,85,117,31),.13);
}
.loader-bar:after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  width:48%;
  background:linear-gradient(90deg,
    transparent 0%,
    var(--secondary) 30%,
    var(--secondary-light) 55%,
    var(--secondary) 75%,
    transparent 100%);
  animation:slide-bar 1.05s ease-in-out infinite;
}
.loader-label{
  grid-column:1 / -1;
  grid-row:1;
  z-index:1;
  display:block;
  padding:.3rem 1rem .55rem 2.75rem;
  color:var(--text);
  font-size:.78rem;
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
@keyframes slide-bar{0%{left:-50%}100%{left:110%}}
@keyframes loader-sheen{0%{transform:translateX(-110%)}62%,100%{transform:translateX(110%)}}
@keyframes loader-orbit-pulse{
  0%,100%{transform:translateY(-50%) scale(.88);opacity:.7}
  50%{transform:translateY(-50%) scale(1.08);opacity:1}
}
/* Loader sits below the taller mobile header on small screens */
@media(max-width:600px){
  #app-loader{top:calc(var(--header-h) + 16px);width:calc(100vw - 24px)}
  .loader-label{font-size:.74rem}
}

.login-status{
  margin:.75rem 0 .65rem;
  min-height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  border:1px solid rgba(var(--secondary-rgb,85,117,31),.18);
  border-radius:999px;
  background:linear-gradient(90deg,rgba(var(--secondary-rgb,85,117,31),.08),rgba(var(--secondary-rgb,85,117,31),.16),rgba(var(--secondary-rgb,85,117,31),.08));
  background-size:220% 100%;
  color:var(--text);
  font-size:.78rem;
  font-weight:800;
  animation:login-liquid-flow 1.6s ease-in-out infinite;
}
.login-status.hidden{display:none}
.login-status:before{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background:var(--secondary);
  box-shadow:0 0 0 5px rgba(var(--secondary-rgb,85,117,31),.12);
  animation:login-dot-pulse 1s ease-in-out infinite;
}
.btn.login-busy{
  position:relative;
  overflow:hidden;
  opacity:.92;
  cursor:wait;
}
.btn.login-busy:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(115deg,transparent 0%,rgba(255,255,255,.26) 45%,transparent 70%);
  transform:translateX(-120%);
  animation:login-button-sheen 1.15s ease-in-out infinite;
}
.login-liquid-dot{
  width:1em;
  height:1em;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.55);
  border-top-color:#fff;
  display:inline-block;
  animation:login-spin .7s linear infinite;
}
@keyframes login-liquid-flow{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
@keyframes login-dot-pulse{0%,100%{transform:scale(.86);opacity:.7}50%{transform:scale(1.12);opacity:1}}
@keyframes login-button-sheen{to{transform:translateX(120%)}}
@keyframes login-spin{to{transform:rotate(360deg)}}

.skel{background:linear-gradient(90deg,var(--surface-alt) 25%,var(--surface-deep) 50%,var(--surface-alt) 75%);background-size:200% 100%;animation:shimmer 1.4s infinite;border-radius:var(--radius-sm)}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.skel-row{height:14px;margin-bottom:.6rem;border-radius:var(--radius-sm)}
.skel-row.short{width:40%}.skel-row.med{width:70%}.skel-row.full{width:100%}
/* --- SESSION & TAB PERSISTENCE (no visual CSS needed) ------------------- */

/* --- PDF REPORT PREVIEW MODAL ----------------------------------------------
   .rpt-preview-wrap  = scrollable white A4-ish content area inside modal.
   .rpt-hdr           = branded report header block.
   .rpt-meta-row      = filter summary line under the header.
   .rpt-table         = clean print-ready table inside the preview.           */
.rpt-preview-wrap{background:#fff;border-radius:var(--radius);padding:2rem;min-height:400px;max-height:60vh;overflow-y:auto;box-shadow:inset 0 0 0 1px #e0e0e0}
body.dark .rpt-preview-wrap{background:#1a1a1a;box-shadow:inset 0 0 0 1px #333}
.rpt-hdr{border-bottom:3px solid #5A1F12;padding-bottom:1rem;margin-bottom:1rem}
.rpt-hdr-top{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.rpt-title{font-size:1.25rem;font-weight:900;color:#5A1F12;letter-spacing:.3px}
.rpt-subtitle{font-size:.82rem;color:#7C6A55;margin-top:.2rem}
.rpt-meta-row{font-size:.75rem;color:#7C6A55;background:#F3EBDD;border-radius:var(--radius-sm);padding:.4rem .75rem;margin-bottom:1rem;display:flex;gap:1rem;flex-wrap:wrap}
.rpt-meta-row span{font-weight:700}
.rpt-table{width:100%;border-collapse:collapse;font-size:.82rem}
.rpt-table th{background:#5A1F12;color:white;font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.6px;padding:.55rem .85rem;text-align:left;white-space:nowrap}
.rpt-table td{padding:.55rem .85rem;border-bottom:1px solid #e8e0d4;color:#2C1608;vertical-align:top}
.rpt-table tbody tr:nth-child(even) td{background:#faf6f0}
.rpt-table tbody tr:last-child td{border-bottom:none}
.rpt-table-empty{text-align:center;color:#7C6A55;padding:2rem;font-style:italic}
/* Report filter toolbar N/A compact, appears above chip-tabs */
.rep-filter-bar{display:flex;flex-wrap:wrap;gap:.6rem;align-items:flex-end;padding:.85rem 1rem;background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:1rem}
.rep-filter-bar .rfl{display:flex;flex-direction:column;gap:.2rem;flex:1;min-width:130px}
.rep-filter-bar .rfl label{font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--text-muted)}
.rep-filter-bar .rfc{height:32px;padding:.3rem .7rem;font-size:.83rem;border:1.5px solid var(--border);border-radius:var(--radius);background:var(--bg);color:var(--text);font-family:var(--font);font-weight:600}
.rep-filter-bar .rfc:focus{outline:none;border-color:var(--secondary)}
/* --- BACKUP SECTION ---------------------------------------------------------
   Compact settings card for backup controls.                                 */
.backup-status{display:flex;align-items:center;gap:.65rem;padding:.65rem 1rem;background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius);font-size:.85rem;margin-bottom:1.1rem}
.backup-status .mi{font-size:1.1rem;color:var(--secondary)}
.backup-ts{font-weight:700;color:var(--text)}
.backup-ts.never{color:var(--text-muted);font-style:italic}
/* -- 2-step mention tagging: role category row + user badges row ------------
   .mention-role-chip = role category selector (not a mention target itself).
   .mention-user-row  = dynamically revealed user badges for selected role.   */
.mention-role-row{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:.5rem}
.mention-role-chip{display:inline-flex;align-items:center;gap:.25rem;padding:.28rem .65rem;border-radius:var(--radius-full);border:1.5px solid var(--border);background:var(--surface-alt);color:var(--text-muted);font-size:.75rem;font-weight:800;cursor:pointer;user-select:none;transition:all .18s ease;letter-spacing:.3px}
.mention-role-chip:hover{border-color:var(--primary);color:var(--primary)}
.mention-role-chip.active{border-color:var(--primary);background:var(--primary);color:white}
.mention-user-row{display:flex;flex-wrap:wrap;gap:.35rem;min-height:24px;padding:.1rem 0}
.mention-user-row .mention-badge{font-size:.73rem}
/* -- Report PDF download N/A hidden iframe for consistent styled export ------ */
#rpt-pdf-frame{position:fixed;left:-9999px;top:-9999px;width:900px;height:1200px;border:none;visibility:hidden}

/* ================================================================
   SEITS v73 - Final CSS Fixes
   ================================================================ */

/* PB6: Today button - green bg, ALWAYS white text */
.cal-toolbar .btn-ghost,
button[onclick="calGoToday()"],
button[onclick*="calGoToday"],
.cal-toolbar button {
  background: var(--secondary) !important;
  color: #fff !important;
  border-color: var(--secondary) !important;
}
.cal-toolbar .btn-ghost:hover,
button[onclick="calGoToday()"]:hover,
button[onclick*="calGoToday"]:hover,
.cal-toolbar button:hover {
  background: var(--secondary-light) !important;
  color: #fff !important;
}

/* PB6: Day view nav buttons */
.cal-day-view [class*="btn-secondary"],
button[onclick*="calDayShift"],
button[onclick*="calDayGoToday"] {
  background: var(--secondary) !important;
  color: #fff !important;
  border-color: var(--secondary) !important;
}
button[onclick*="calDayShift"]:hover,
button[onclick*="calDayGoToday"]:hover {
  background: var(--secondary-light) !important;
  color: #fff !important;
}

/* PB6: Week time column - chocolate/brown bg, white text */
.cal-week-header.time-col {
  background: var(--primary) !important;
  color: #fff !important;
  font-weight: 700;
}
.cal-week-time-cell {
  background: var(--surface-alt);
  color: var(--text-muted);
  font-size: .68rem;
  font-weight: 700;
  text-align: right;
  padding: .4rem .5rem;
  border-right: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

/* PB6: Current week day highlight */
.cal-week-cell.today {
  background: rgba(85,117,31,.07) !important;
  border-top: 2px solid var(--secondary) !important;
}
.cal-week-header.today {
  background: var(--primary) !important;
  color: #fff !important;
  font-weight: 900;
}

/* PB6: Month/Year selector - neutral white/light bg, dark text */
.cal-nav-center {
  background: var(--surface) !important;
  border: 1.5px solid var(--border) !important;
  border-radius: var(--radius-full);
  padding: .3rem .75rem;
  display: flex;
  align-items: center;
  gap: .3rem;
}
.cal-month-select,
.cal-year-select {
  color: var(--primary) !important;
  background: transparent !important;
  border: none !important;
  font-weight: 800;
  font-size: .92rem;
}

/* PB6: Week current week nav button */
button[onclick*="calWeekGoToday"] {
  background: var(--secondary) !important;
  color: #fff !important;
  border-color: var(--secondary) !important;
}
button[onclick*="calWeekGoToday"]:hover {
  background: var(--secondary-light) !important;
  color: #fff !important;
}

/* PB1: Prevent layout shift during modal open */
.modal-overlay {
  transition: none !important;
}

/* Dark mode adjustments */
body.dark .cal-nav-center {
  background: var(--surface-alt) !important;
  border-color: var(--border-dark) !important;
}
body.dark .cal-month-select,
body.dark .cal-year-select {
  color: rgba(255,255,255,.9) !important;
}

/* Reservation orders workspace */
.orders-workspace-tabs{display:flex;gap:.25rem;border-bottom:1px solid var(--border);margin-bottom:1rem;overflow-x:auto}
.orders-workspace-tab{min-height:42px;border:0;border-bottom:3px solid transparent;background:transparent;color:var(--text-muted);font:700 .82rem var(--font);padding:.65rem .9rem;display:inline-flex;align-items:center;gap:.4rem;white-space:nowrap;cursor:pointer}
.orders-workspace-tab:hover{color:var(--text);background:var(--surface-alt)}
.orders-archive-tabs{display:flex;align-items:center;gap:.35rem;margin:0 0 .8rem;border-bottom:1px solid var(--border);overflow-x:auto}
.orders-archive-tab{min-height:38px;display:inline-flex;align-items:center;gap:.35rem;padding:.5rem .75rem;border:0;border-bottom:3px solid transparent;background:transparent;color:var(--text-muted);font:750 .76rem var(--font);white-space:nowrap;cursor:pointer}
.orders-archive-tab:hover{background:var(--surface-alt);color:var(--text)}
.orders-archive-tab.active{border-bottom-color:var(--secondary);color:var(--primary)}
.orders-archive-tab b{min-width:20px;height:20px;display:inline-grid;place-items:center;padding:0 .3rem;border-radius:var(--radius-full);background:var(--surface-alt);font-size:.66rem}
.orders-workspace-tab.active{color:var(--primary);border-bottom-color:var(--secondary);background:transparent}
.orders-workspace-tab b{min-width:20px;height:20px;padding:0 .35rem;border-radius:10px;background:var(--surface-alt);color:var(--text);font:800 .68rem var(--font-mono);display:inline-flex;align-items:center;justify-content:center}
.orders-workspace-tab.active b{background:var(--primary);color:#fff}
.orders-officer-page-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 0 1rem;border-bottom:1px solid var(--border);margin-bottom:1rem}
.orders-officer-page-header[hidden]{display:none!important}
.orders-officer-page-header>div{display:flex;flex-direction:column;gap:.15rem;min-width:0}
.orders-officer-page-header>div span{font-size:.68rem;font-weight:800;text-transform:uppercase;color:var(--text-muted)}
.orders-officer-page-header>div strong{font-size:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.orders-workspace{display:grid;grid-template-columns:220px minmax(0,1fr);gap:1rem;align-items:start}
.orders-workspace[hidden],.orders-schedule-panel[hidden]{display:none!important}
.orders-workspace.orders-officer-view{grid-template-columns:minmax(0,1fr)}
.orders-workspace.is-collapsed{grid-template-columns:58px minmax(0,1fr)}
.orders-workspace-main{min-width:0}
.orders-officer-sidebar{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:.55rem;position:sticky;top:.5rem;max-height:calc(100vh - 190px);overflow:auto}
.orders-officer-header{height:38px;display:flex;align-items:center;justify-content:space-between;gap:.35rem;border-bottom:1px solid var(--border);margin-bottom:.35rem}
.orders-officer-title{font-size:.7rem;font-weight:800;text-transform:uppercase;color:var(--text-muted);padding-left:.35rem;overflow:hidden;white-space:nowrap}
.orders-officer-toggle{width:30px;height:30px;flex:0 0 30px;border:0;background:transparent;color:var(--text-muted);display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);cursor:pointer}
.orders-officer-toggle:hover{background:var(--surface-alt);color:var(--text)}
.orders-officer-item{width:100%;min-height:42px;display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:.55rem;border:0;background:transparent;color:var(--text);padding:.4rem;border-radius:var(--radius-sm);cursor:pointer;text-align:left}
.orders-officer-item:hover{background:var(--surface-alt)}
.orders-officer-item.active{background:var(--primary);color:#fff}
.orders-officer-avatar{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--surface-alt);color:var(--primary);font-size:.68rem;font-weight:900}
.orders-officer-item.active .orders-officer-avatar{background:rgba(255,255,255,.18);color:#fff}
.orders-officer-name{font-size:.78rem;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.orders-officer-count{font-family:var(--font-mono);font-size:.68rem;font-weight:800;min-width:22px;text-align:center}
.orders-unread-count{height:20px;padding:0 .35rem;border-radius:var(--radius-full);display:inline-grid;place-items:center;background:#C52222;color:#fff}
.orders-new-event{display:inline-flex;align-items:center;justify-content:center;min-height:22px;padding:.15rem .45rem;border-radius:var(--radius-full);background:#C52222;color:#fff;font-size:.65rem;font-weight:900;text-transform:uppercase}
.orders-card-unread{box-shadow:0 0 0 2px rgba(197,34,34,.12),var(--shadow-sm)}
.orders-workspace.is-collapsed .orders-officer-sidebar{padding:.45rem}
.orders-workspace.is-collapsed .orders-officer-header{justify-content:center}
.orders-workspace.is-collapsed .orders-officer-title,.orders-workspace.is-collapsed .orders-officer-name,.orders-workspace.is-collapsed .orders-officer-count{display:none}
.orders-workspace.is-collapsed .orders-officer-item{display:flex;justify-content:center;padding:.4rem 0}
.orders-filter-bar{margin-bottom:.6rem}
.orders-filter-grid{width:100%;display:grid;grid-template-columns:minmax(190px,1.35fr) repeat(5,minmax(135px,1fr)) auto;gap:.6rem;align-items:end}
.orders-filter-grid .dfl{min-width:0}
.orders-filter-grid .dfc{width:100%;min-width:0}
.orders-filter-count{min-height:34px;display:flex;align-items:center;color:var(--primary);font-size:.78rem;font-weight:800;white-space:nowrap}
.orders-schedule-panel{min-width:0}
.orders-schedule-toolbar{display:grid;grid-template-columns:minmax(210px,1.35fr) repeat(4,minmax(140px,.72fr)) auto;align-items:end;gap:.65rem;padding:.8rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:.65rem}
.orders-schedule-toolbar .dfl{display:flex;flex-direction:column;gap:.25rem;min-width:0}
.orders-schedule-toolbar .dfl[hidden]{display:none!important}
.orders-schedule-toolbar .dfl label{font-size:.7rem;font-weight:800;color:var(--text-muted);text-transform:uppercase}
.orders-schedule-toolbar .dfc{width:100%;height:34px;padding:.35rem .65rem;border:1.5px solid var(--border);border-radius:var(--radius);background:var(--bg);color:var(--text);font:600 .82rem var(--font)}
.orders-schedule-toolbar .dfc:focus{outline:none;border-color:var(--secondary)}
.orders-schedule-toolbar>.btn-icon{width:34px;height:34px;justify-self:start;align-self:end;padding:0}
body.dark .orders-schedule-toolbar .dfc{background:var(--surface-deep);border-color:var(--border-dark)}
.orders-schedule-toolbar-count{height:34px;display:flex;align-items:center;color:var(--text-muted);font-size:.78rem;font-weight:800;white-space:nowrap}
.orders-schedule-legend{display:flex;gap:.4rem;flex-wrap:wrap;margin:.55rem 0 .75rem}
.orders-schedule-legend span{display:inline-flex;align-items:center;gap:.3rem;font-size:.68rem;font-weight:800;padding:.25rem .5rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface)}
.orders-schedule-legend span::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--border-dark)}
.orders-schedule-legend .urgency-overdue::before{background:var(--status-lost)}
.orders-schedule-legend .urgency-today::before{background:var(--status-available)}
.orders-schedule-legend .urgency-tomorrow::before{background:#B86A00}
.orders-schedule-legend .urgency-later::before{box-sizing:border-box;background:var(--surface);border:1px solid var(--border-dark)}
.orders-schedule-list,.orders-card-list{display:flex;flex-direction:column;gap:.65rem}
.orders-list-section{min-width:0}
.orders-card{display:grid;grid-template-columns:minmax(170px,1.15fr) minmax(160px,.9fr) minmax(175px,1fr) minmax(145px,.8fr) minmax(250px,1.35fr);align-items:center;gap:1rem;min-height:96px;padding:.9rem 1rem;border:1.5px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);transition:box-shadow .15s}
.orders-card-officer{grid-template-columns:minmax(180px,1.15fr) minmax(170px,.9fr) minmax(220px,1.15fr) minmax(260px,1.35fr)}
.orders-card:hover{box-shadow:var(--shadow-md)}
.orders-card-danger{background:var(--status-lost-bg);border-color:var(--status-lost)}
.orders-card-success{background:var(--status-available-bg);border-color:var(--status-available)}
.orders-card-warning{background:var(--status-safari-bg);border-color:var(--status-safari)}
.orders-card-info{background:var(--status-transfer-bg);border-color:var(--status-transfer)}
.orders-card-neutral{background:var(--surface);border-color:var(--border-dark)}
.orders-card-client,.orders-card-equipment,.orders-card-context,.orders-card-date{display:flex;flex-direction:column;min-width:0;gap:.18rem}
.orders-card small{font-size:.62rem;font-weight:800;text-transform:uppercase;color:var(--text-muted)}
.orders-card-client>strong{font-size:.95rem;color:var(--primary);font-weight:850;overflow-wrap:anywhere}
.orders-card-client>span,.orders-card-context>span,.orders-card-date>span{font-size:.7rem;color:var(--text-muted)}
.orders-card-context>strong{font-size:.85rem;color:var(--status-available);overflow-wrap:anywhere}
.orders-card-date>strong{font-size:.95rem;color:var(--primary);font-weight:850}
.orders-equipment-pill{width:max-content;max-width:100%;display:inline-flex;align-items:center;gap:.4rem;padding:.32rem .58rem;border:1px solid var(--border-dark);border-radius:var(--radius-full);background:var(--surface);box-shadow:var(--shadow-sm);font-size:.78rem}
.orders-equipment-pill>.mi{color:var(--secondary)}
.orders-equipment-pill>strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.orders-equipment-pill>b{min-width:20px;height:20px;padding:0 .3rem;display:inline-grid;place-items:center;border-radius:var(--radius-full);background:var(--secondary);color:#fff;font:800 .68rem var(--font-mono)}
.orders-card-end{display:flex;flex-direction:column;align-items:flex-end;gap:.55rem;min-width:0}
.orders-card-statuses{display:flex;align-items:center;justify-content:flex-end;gap:.35rem;flex-wrap:wrap}
.orders-card-status{display:inline-flex;align-items:center;gap:.25rem;padding:.22rem .6rem;border-radius:var(--radius-full);font-size:.66rem;font-weight:900;text-transform:uppercase;white-space:nowrap}
.orders-card-status-danger{background:var(--status-lost);color:#fff}.orders-card-status-success{background:var(--status-available);color:#fff}.orders-card-status-warning{background:var(--status-safari);color:#fff}.orders-card-status-info{background:var(--status-transfer);color:#fff}.orders-card-status-neutral{background:var(--surface);color:var(--primary);border:1px solid var(--primary)}
.orders-card-amended{display:inline-flex;align-items:center;gap:.2rem;padding:.2rem .5rem;border:1px solid var(--status-safari);border-radius:var(--radius-full);background:var(--status-safari-bg);color:var(--status-safari);font-size:.64rem;font-weight:850;text-transform:uppercase;white-space:nowrap}
.orders-card-actions{display:flex;justify-content:flex-end;gap:.4rem;flex-wrap:wrap}
.orders-icon-action{width:34px;height:34px;display:inline-grid;place-items:center;padding:0;border:1px solid var(--border-dark);border-radius:var(--radius-sm);background:var(--surface);color:var(--primary);text-decoration:none;cursor:pointer;transition:background .16s ease,border-color .16s ease,color .16s ease}
.orders-icon-action:hover,.orders-icon-action:focus-visible{background:var(--surface-alt);border-color:var(--primary);outline:none}
.orders-file-action{min-height:34px;display:inline-flex;align-items:center;justify-content:center;gap:.3rem;padding:.42rem .65rem;border:1px solid var(--secondary);border-radius:var(--radius-sm);background:var(--secondary);color:#fff;text-decoration:none;font:800 .7rem var(--font);white-space:nowrap}
.orders-file-action:hover,.orders-file-action:focus-visible{filter:brightness(.92);outline:2px solid color-mix(in srgb,var(--secondary) 28%,transparent);outline-offset:1px}
.orders-details-btn{background:var(--primary)!important;border-color:var(--primary)!important;color:#fff!important}
.orders-details-btn:hover,.orders-details-btn:focus-visible{background:var(--primary-light)!important;border-color:var(--primary-light)!important}
.orders-primary-action{min-height:34px;display:inline-flex;align-items:center;justify-content:center;gap:.35rem;padding:.42rem .72rem;border:1px solid var(--secondary);border-radius:var(--radius-sm);background:var(--secondary);color:#fff;font:800 .72rem var(--font);cursor:pointer;white-space:nowrap}
.orders-primary-action:hover,.orders-primary-action:focus-visible{filter:brightness(.92);outline:2px solid color-mix(in srgb,var(--secondary) 28%,transparent);outline-offset:1px}
.orders-complete-action{background:var(--primary);border-color:var(--primary)}
.orders-card-status-allocated{background:var(--primary)!important;color:#fff!important}
.orders-action-menu{position:relative;display:inline-flex}
.orders-action-menu-toggle{width:34px;height:34px;display:inline-grid;place-items:center;padding:0;border:1px solid var(--border-dark);border-radius:var(--radius-sm);background:var(--surface);color:var(--primary);cursor:pointer;transition:background .16s ease,border-color .16s ease}
.orders-action-menu-toggle:hover,.orders-action-menu-toggle[aria-expanded="true"]{background:var(--surface-alt);border-color:var(--primary)}
.orders-action-menu-toggle .mi{font-size:1.15rem}
.orders-action-menu-popover{position:absolute;z-index:40;top:calc(100% + .35rem);right:0;min-width:168px;padding:.3rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);box-shadow:var(--shadow-lg)}
.orders-action-menu-popover[hidden]{display:none}
.orders-action-menu-item{width:100%;display:flex;align-items:center;gap:.5rem;padding:.55rem .65rem;border:0;border-radius:var(--radius-sm);background:transparent;color:var(--text);font:750 .76rem var(--font);text-align:left;cursor:pointer}
.orders-action-menu-item:hover,.orders-action-menu-item:focus-visible{background:var(--surface-alt);outline:none}
.orders-action-menu-danger{color:var(--status-lost)}
.logo-size-control{display:flex;align-items:center;gap:.85rem;max-width:460px}
.logo-size-control input[type=range]{flex:1;accent-color:var(--secondary)}
.logo-size-control output{min-width:58px;padding:.3rem .5rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-alt);color:var(--primary);font:800 .78rem var(--font-mono);text-align:center}
.orders-schedule-empty{min-height:190px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.35rem;color:var(--text-muted);border:1px dashed var(--border);border-radius:var(--radius);background:var(--surface)}
.orders-schedule-empty .mi{font-size:2rem}.orders-schedule-empty strong{color:var(--text)}
.orders-period{font-size:.76rem;white-space:nowrap}
.orders-period small{display:block;color:var(--text-muted);font-family:var(--font);font-weight:700;margin-top:.15rem}
.orders-proposal-btn{background:var(--secondary)!important;color:#fff!important}
.orders-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.orders-detail-grid>div{padding:.75rem;background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius-sm);min-width:0}
.orders-detail-grid span{display:block;color:var(--text-muted);font-size:.7rem;font-weight:800;text-transform:uppercase;margin-bottom:.2rem}
.orders-detail-grid strong{display:block;font-size:.86rem;overflow-wrap:anywhere}
.orders-detail-grid .orders-proposal-btn{display:inline-flex;width:max-content;max-width:100%;align-items:center;gap:.35rem;text-decoration:none}
.orders-detail-wide{grid-column:1/-1}
.orders-progress{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:0 0 1rem}
.orders-progress-step{position:relative;display:flex;flex-direction:column;align-items:center;gap:.3rem;color:var(--text-muted);font-size:.72rem;text-align:center}
.orders-progress-step::after{content:"";position:absolute;top:14px;left:calc(50% + 17px);right:calc(-50% + 17px);height:2px;background:var(--border)}
.orders-progress-step:last-child::after{display:none}
.orders-progress-step>span{width:28px;height:28px;border-radius:50%;border:2px solid var(--border-dark);background:var(--surface);display:flex;align-items:center;justify-content:center;font:800 .7rem var(--font-mono);z-index:1}
.orders-progress-step.complete,.orders-progress-step.current{color:var(--text)}
.orders-progress-step.complete>span{background:var(--status-available);border-color:var(--status-available);color:#fff}
.orders-progress-step.complete::after{background:var(--status-available)}
.orders-progress-step.current>span{border-color:var(--secondary);color:var(--secondary)}
.orders-progress-cancelled{display:flex;align-items:flex-start;gap:.5rem;padding:.65rem .8rem;margin-bottom:1rem;border:1px solid var(--status-lost);background:var(--status-lost-bg);color:var(--status-lost);font-size:.8rem;border-radius:var(--radius-sm)}
.orders-progress-cancelled>div{display:flex;flex-direction:column;gap:.15rem}.orders-progress-cancelled strong{font-weight:850}.orders-progress-cancelled span{font-size:.74rem}
.orders-amendment-history{margin-top:1rem;padding-top:.25rem;border-top:1px solid var(--border)}
.orders-amendment-history>.section-title{margin:.7rem 0;font-size:.82rem}
.orders-amendment-entry{padding:.7rem .8rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-alt);margin-top:.5rem}
.orders-amendment-entry>div{display:flex;justify-content:space-between;gap:.75rem;align-items:flex-start}.orders-amendment-entry>div>span{font-size:.7rem;color:var(--text-muted);text-align:right}
.orders-amendment-entry ul{list-style:none;margin:.55rem 0 0;padding:.55rem 0 0;border-top:1px solid var(--border)}
.orders-amendment-entry li{display:grid;grid-template-columns:minmax(110px,.7fr) minmax(0,1.3fr);gap:.65rem;padding:.22rem 0;font-size:.74rem}.orders-amendment-entry li>span{display:flex;align-items:center;gap:.25rem;color:var(--text-muted);overflow-wrap:anywhere}
.rpt-res-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:1rem;margin:1rem 0}
.reservation-allocation-context{display:flex;align-items:center;justify-content:space-between;gap:1rem;background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--secondary);border-radius:var(--radius);padding:.75rem 1rem;margin-bottom:1rem;box-shadow:var(--shadow-sm)}
.reservation-allocation-context>div{display:flex;flex-direction:column;min-width:0}
.reservation-allocation-context span{font-size:.78rem;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:1280px){.orders-filter-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.orders-filter-count{grid-column:1/-1;justify-self:end}.orders-card{grid-template-columns:1fr 1fr 1fr}.orders-card-end{grid-column:1/-1;flex-direction:row;align-items:center;justify-content:space-between}.orders-schedule-toolbar{grid-template-columns:repeat(3,minmax(160px,1fr))}.orders-schedule-toolbar-count{display:none}}
@media(max-width:1050px){.orders-workspace,.orders-workspace.is-collapsed{grid-template-columns:1fr}.orders-officer-sidebar{position:static;display:flex;gap:.35rem;max-height:none;overflow-x:auto}.orders-officer-header{border:0;flex:0 0 auto}.orders-officer-title,.orders-officer-toggle{display:none}.orders-officer-item,.orders-workspace.is-collapsed .orders-officer-item{min-width:168px;display:grid;grid-template-columns:30px minmax(0,1fr) auto;padding:.4rem}.orders-workspace.is-collapsed .orders-officer-name,.orders-workspace.is-collapsed .orders-officer-count{display:block}.rpt-res-grid{grid-template-columns:1fr}}
@media(max-width:800px){.orders-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.orders-schedule-toolbar{grid-template-columns:1fr 1fr}.orders-card{grid-template-columns:1fr 1fr}.orders-card-end{grid-column:1/-1}}
@media(max-width:700px){.orders-officer-page-header{align-items:flex-end}.orders-filter-grid{grid-template-columns:1fr}.orders-filter-count{grid-column:auto;justify-self:start}.orders-detail-grid{grid-template-columns:1fr}.orders-detail-wide{grid-column:auto}.reservation-allocation-context{align-items:flex-start;flex-direction:column}.orders-progress-step strong{font-size:.62rem}.orders-schedule-toolbar{grid-template-columns:1fr}.orders-card{grid-template-columns:1fr;gap:.7rem}.orders-card-end{grid-column:auto;align-items:flex-start;flex-direction:column;padding-top:.6rem;border-top:1px solid var(--border)}.orders-card-actions{justify-content:flex-start}.orders-card-actions .orders-proposal-btn{display:inline-flex}.orders-action-menu-popover{right:auto;left:0}}


/* -- QuickBooks-style login animation ----------------------------------- */
@keyframes qb-fade-up { from { opacity:0; transform:translateY(24px); } to { opacity:1; transform:translateY(0); } }
@keyframes qb-logo-pop { 0%{opacity:0;transform:scale(.7) translateY(-10px)} 70%{transform:scale(1.06) translateY(0)} 100%{opacity:1;transform:scale(1) translateY(0)} }
@keyframes qb-bar-fill { from{width:0} to{width:100%} }
@keyframes qb-pulse { 0%,100%{opacity:1} 50%{opacity:.45} }
#login-screen { background: linear-gradient(145deg, var(--primary) 0%, #1a2e08 60%, var(--primary-dark,#1a2e08) 100%) !important; }
.login-card { animation: qb-fade-up .6s cubic-bezier(.22,1,.36,1) both; animation-delay:.15s; background:rgba(255,255,255,.97)!important; border-radius:18px!important; box-shadow:0 32px 80px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.12)!important; }
.login-logo-wrap { animation: qb-logo-pop .7s cubic-bezier(.22,1,.36,1) both; animation-delay:.05s; }
.login-tagline { animation: qb-fade-up .5s ease both; animation-delay:.35s; }
.login-form-group { animation: qb-fade-up .5s ease both; }
.login-form-group:nth-child(1){animation-delay:.4s}
.login-form-group:nth-child(2){animation-delay:.48s}
.login-form-group:nth-child(3){animation-delay:.56s}
.login-btn-wrap { animation: qb-fade-up .5s ease both; animation-delay:.62s; }
/* Loading bar under the card on submit */
#login-progress { height:3px; background:var(--secondary); border-radius:0 0 18px 18px; width:0; transition:width .4s ease; margin-top:-3px; opacity:0; }
#login-progress.loading { opacity:1; animation: qb-bar-fill 1.8s ease forwards; }

.password-field { position:relative; display:flex; align-items:center; }
.password-field .form-control { padding-right:2.85rem; }
.password-toggle {
  position:absolute;
  right:.55rem;
  width:2rem;
  height:2rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  border:0;
  border-radius:var(--radius-sm);
  background:transparent;
  color:var(--text-muted);
  cursor:pointer;
}
.password-toggle:hover,
.password-toggle:focus-visible { color:var(--text); background:var(--surface-2); outline:none; }
/* Background floating shapes */
.login-bg-shape { position:fixed; border-radius:50%; background:rgba(255,255,255,.04); pointer-events:none; }
.login-bg-shape-1 { width:380px;height:380px;top:-80px;right:-100px;animation:qb-pulse 6s ease-in-out infinite; }
.login-bg-shape-2 { width:220px;height:220px;bottom:60px;left:-60px;animation:qb-pulse 8s ease-in-out infinite; animation-delay:2s; }
.login-bg-shape-3 { width:120px;height:120px;bottom:200px;right:80px;animation:qb-pulse 5s ease-in-out infinite; animation-delay:1s; }
