:root{
  --navy:#1f3b4d;
  --orange:#f36f21;
  --border:#d8dee3;
  --bg:#f4f6f8;
  --text:#2b3440;
  --muted:#6b7683;
  --radius:10px;
}
*{box-sizing:border-box;}
body{
  margin:0;
  font-family:'Segoe UI',Arial,Helvetica,sans-serif;
  background:var(--bg);
  color:var(--text);
}
a{color:var(--orange);text-decoration:none;}
.container{max-width:900px;margin:0 auto;padding:24px 16px 64px;}
.topbar{
  background:#fff;border-bottom:3px solid var(--orange);
  padding:14px 24px;display:flex;align-items:center;justify-content:space-between;
}
.topbar .brand{display:flex;align-items:center;gap:12px;font-weight:700;color:var(--navy);font-size:18px;}
.topbar .brand img{height:36px;}
.topbar nav a{margin-left:18px;color:var(--navy);font-weight:600;font-size:14px;}
.card{
  background:#fff;border:1px solid var(--border);border-radius:var(--radius);
  padding:28px;margin-bottom:24px;box-shadow:0 1px 3px rgba(0,0,0,.04);
}
h1.form-title{
  color:var(--navy);font-size:28px;margin:0 0 4px;letter-spacing:.5px;
}
.form-sub{color:var(--muted);margin-bottom:18px;font-size:14px;}
hr.accent{border:none;border-top:3px solid var(--orange);margin:14px 0 22px;}
.header-row{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;}
.logo-box img{max-height:60px;max-width:220px;}
label{display:block;font-weight:600;font-size:13.5px;margin-bottom:6px;color:var(--navy);}
.req{color:#d64545;}
input[type=text],input[type=date],input[type=time],input[type=number],textarea,select{
  width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:8px;
  font-size:14px;font-family:inherit;background:#fbfcfd;
}
textarea{resize:vertical;min-height:80px;}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--orange);background:#fff;}
.field{margin-bottom:18px;}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px;}
@media (max-width:640px){.grid-2,.grid-3{grid-template-columns:1fr;}}
.section-label{
  text-transform:uppercase;font-size:12px;letter-spacing:1px;color:var(--muted);
  font-weight:700;margin:26px 0 10px;border-bottom:1px solid var(--border);padding-bottom:6px;
}
button,.btn{
  display:inline-block;background:var(--orange);color:#fff;border:none;
  padding:11px 22px;border-radius:8px;font-weight:700;font-size:14.5px;cursor:pointer;
}
button.secondary,.btn.secondary{background:var(--navy);}
button.danger,.btn.danger{background:#d64545;}
button.ghost,.btn.ghost{background:#fff;color:var(--navy);border:1px solid var(--border);}
button:hover,.btn:hover{filter:brightness(1.06);}
.alert{padding:12px 16px;border-radius:8px;margin-bottom:18px;font-size:14px;}
.alert.success{background:#e7f7ec;color:#1e7b41;border:1px solid #bfe8cc;}
.alert.error{background:#fdecec;color:#b02a2a;border:1px solid #f5c6c6;}
table{width:100%;border-collapse:collapse;background:#fff;}
table th,table td{padding:10px 12px;border-bottom:1px solid var(--border);text-align:left;font-size:13.5px;}
table th{background:#f8f9fb;color:var(--navy);text-transform:uppercase;font-size:11.5px;letter-spacing:.5px;}
tr:hover td{background:#fafbfc;}
.badge{display:inline-block;padding:3px 10px;border-radius:20px;font-size:11.5px;font-weight:700;}
.badge.pending{background:#fff4e0;color:#a86400;}
.badge.approved{background:#e7f7ec;color:#1e7b41;}
.badge.rejected{background:#fdecec;color:#b02a2a;}
.toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;gap:12px;flex-wrap:wrap;}
.pill-toggle{display:inline-flex;align-items:center;gap:6px;cursor:pointer;}
.switch{position:relative;width:42px;height:24px;display:inline-block;}
.switch input{opacity:0;width:0;height:0;}
.slider{position:absolute;inset:0;background:#ccc;border-radius:34px;transition:.2s;}
.slider:before{content:"";position:absolute;height:18px;width:18px;left:3px;bottom:3px;background:#fff;border-radius:50%;transition:.2s;}
.switch input:checked + .slider{background:var(--orange);}
.switch input:checked + .slider:before{transform:translateX(18px);}
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#1f3b4d,#2c5164);}
.login-card{background:#fff;padding:40px;border-radius:14px;width:360px;box-shadow:0 20px 50px rgba(0,0,0,.25);}
.side-nav{width:220px;background:var(--navy);min-height:100vh;padding:22px 0;position:fixed;top:0;left:0;}
.side-nav a{display:block;color:#cfe0ea;padding:12px 24px;font-size:14.5px;font-weight:600;}
.side-nav a.active,.side-nav a:hover{background:rgba(255,255,255,.08);color:#fff;border-left:3px solid var(--orange);}
.side-nav .brand{color:#fff;padding:0 24px 20px;font-size:17px;font-weight:800;}
.admin-wrap{margin-left:220px;padding:30px 34px;}
.stat-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-bottom:26px;}
.stat-card{background:#fff;border:1px solid var(--border);border-radius:10px;padding:18px;}
.stat-card .num{font-size:28px;font-weight:800;color:var(--navy);}
.stat-card .lbl{font-size:12.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;}
.small{font-size:12.5px;color:var(--muted);}
.actions-cell a,.actions-cell button{margin-right:10px;font-size:13px;}
.modal-bg{display:none;position:fixed;inset:0;background:rgba(20,30,40,.5);align-items:center;justify-content:center;z-index:50;}
.modal-bg.open{display:flex;}
.modal{background:#fff;border-radius:12px;padding:26px;width:460px;max-width:92vw;max-height:88vh;overflow:auto;}
.modal h3{margin-top:0;color:var(--navy);}
.flex-end{display:flex;justify-content:flex-end;gap:10px;margin-top:18px;}
select[multiple]{height:auto;}
.drag-handle{cursor:grab;color:var(--muted);}