:root{
  --primary:#1F2937;--secondary:#111827;--accent:#2563EB;--success:#16A34A;--warning:#F59E0B;--danger:#DC2626;
  --bg:#F8FAFC;--card:#FFFFFF;--border:#E5E7EB;--text:#111827;--muted:#6B7280;
  --shadow-sm:0 1px 2px rgba(17,24,39,.06);--shadow-md:0 16px 40px rgba(17,24,39,.08);--shadow-lg:0 24px 80px rgba(17,24,39,.14);
  --radius:18px;--radius-sm:12px;--sidebar:292px;--topbar:76px;
}
[data-theme="dark"]{--bg:#0B1220;--card:#111827;--border:#1F2937;--text:#F9FAFB;--muted:#9CA3AF;--primary:#F9FAFB;--secondary:#030712;--shadow-md:0 20px 45px rgba(0,0,0,.32)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at top left,rgba(37,99,235,.08),transparent 34rem),var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:14px;letter-spacing:0}a{text-decoration:none;color:inherit}
.app-shell{display:grid;grid-template-columns:var(--sidebar) minmax(0,1fr);min-height:100vh}.sidebar{position:sticky;top:0;height:100vh;padding:18px;background:linear-gradient(180deg,var(--secondary),#172033);color:#F9FAFB;border-right:1px solid rgba(255,255,255,.08);box-shadow:var(--shadow-lg);z-index:40;transition:width .22s ease,transform .22s ease}.brand-panel{display:flex;align-items:center;gap:12px;padding:8px 4px 20px}.brand-mark{width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,var(--accent),#60A5FA);display:grid;place-items:center;font-weight:900;box-shadow:0 16px 40px rgba(37,99,235,.35)}.brand-copy{display:flex;flex-direction:column;line-height:1.15}.brand-copy strong{font-size:18px}.brand-copy span{font-size:12px;color:#A7B1C2}.sidebar-toggle{margin-left:auto}
.nav-menu{display:flex;flex-direction:column;gap:4px}.nav-section{margin:18px 12px 7px;font-size:11px;text-transform:uppercase;color:#8792A5;font-weight:800;letter-spacing:.08em}.nav-menu a{display:flex;align-items:center;gap:12px;min-height:42px;padding:10px 12px;border-radius:12px;color:#D5DAE4;transition:background .16s ease,color .16s ease,transform .16s ease}.nav-menu a i{font-size:17px;width:20px;text-align:center}.nav-menu a:hover{background:rgba(255,255,255,.08);color:#fff;transform:translateX(2px)}.nav-menu a.active{background:linear-gradient(135deg,rgba(37,99,235,.96),rgba(59,130,246,.82));color:#fff;box-shadow:0 14px 35px rgba(37,99,235,.28)}
.app-shell.collapsed{--sidebar:88px}.app-shell.collapsed .brand-panel{justify-content:center}.app-shell.collapsed .sidebar-toggle,.app-shell.collapsed .brand-copy,.app-shell.collapsed .nav-section,.app-shell.collapsed .nav-menu span{display:none}.app-shell.collapsed .nav-menu a{justify-content:center}.main{min-width:0}.topbar{height:var(--topbar);position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:0 24px;background:rgba(255,255,255,.78);backdrop-filter:blur(18px);border-bottom:1px solid var(--border)}[data-theme="dark"] .topbar{background:rgba(17,24,39,.78)}.topbar-left{display:flex;align-items:center;gap:14px}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.08em;font-weight:900;color:var(--accent)}.topbar h1{font-size:21px;margin:0;font-weight:850;color:var(--text)}.topbar-actions{display:flex;align-items:center;gap:10px}.global-search{height:42px;width:min(360px,26vw);display:flex;align-items:center;gap:9px;border:1px solid var(--border);border-radius:999px;background:var(--card);padding:0 14px;box-shadow:var(--shadow-sm)}.global-search input{border:0;outline:0;background:transparent;width:100%;color:var(--text)}.icon-btn{border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.08);color:inherit;width:40px;height:40px;border-radius:12px;display:inline-grid;place-items:center;position:relative;transition:transform .16s ease,box-shadow .16s ease,background .16s ease}.topbar .icon-btn{background:var(--card);border-color:var(--border);color:var(--primary)}.icon-btn:hover{transform:translateY(-1px);box-shadow:var(--shadow-sm)}.pulse-dot{position:absolute;top:8px;right:8px;width:8px;height:8px;background:var(--danger);border-radius:50%;box-shadow:0 0 0 4px rgba(220,38,38,.14)}.user-chip{height:42px;display:flex;align-items:center;gap:9px;border:1px solid var(--border);border-radius:999px;background:var(--card);padding:4px 12px 4px 4px}.user-chip span{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#EEF2FF;color:var(--accent);font-weight:900}.content{padding:24px;max-width:1680px;margin:0 auto;width:100%}
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 10% 10%,rgba(37,99,235,.26),transparent 28rem),linear-gradient(135deg,#0F172A,#1F2937 50%,#F8FAFC)}.login-card{width:min(440px,94vw);background:rgba(255,255,255,.92);backdrop-filter:blur(22px);padding:34px;border-radius:24px;box-shadow:0 32px 90px rgba(15,23,42,.28);border:1px solid rgba(255,255,255,.58)}.login-card h1{font-size:32px;font-weight:900;margin:0}.login-card p{color:var(--muted);margin:6px 0 24px}.login-logo{width:54px;height:54px;border-radius:18px;background:linear-gradient(135deg,var(--accent),#60A5FA);color:#fff;display:grid;place-items:center;font-weight:900;margin-bottom:18px}
.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}.page-head h2{margin:0;font-weight:900;font-size:26px}.page-subtitle{margin:6px 0 0;color:var(--muted)}.premium-card,.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:18px}.premium-card:hover{box-shadow:var(--shadow-md)}.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.kpi-card{position:relative;overflow:hidden;min-height:138px}.kpi-card:after{content:"";position:absolute;right:-38px;top:-38px;width:110px;height:110px;border-radius:50%;background:rgba(37,99,235,.1)}.kpi-label{color:var(--muted);font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.05em}.kpi-value{font-size:30px;font-weight:950;margin-top:8px;color:var(--text)}.kpi-meta{display:flex;align-items:center;gap:6px;margin-top:14px;color:var(--muted);font-weight:700}.chart-grid{display:grid;grid-template-columns:2fr 1fr;gap:16px;margin-top:16px}.split-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:16px;margin-top:16px}.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.btn{border-radius:12px;font-weight:800;display:inline-flex;align-items:center;gap:7px}.btn-primary,.primary{background:var(--accent)!important;border-color:var(--accent)!important;color:#fff!important}.btn-light,.secondary{background:#F3F4F6!important;border:1px solid var(--border)!important;color:var(--primary)!important}.danger,.btn-danger{background:var(--danger)!important;color:#fff!important}.section-title{font-size:16px;font-weight:900;margin:0 0 14px}.muted{color:var(--muted)}.badge{border-radius:999px;padding:5px 9px;font-weight:850;font-size:12px}.DRAFT{background:#EEF2F6;color:#475467}.VERIFIED{background:#DBEAFE;color:#1D4ED8}.PENDING_APPROVAL{background:#FEF3C7;color:#B45309}.POSTED,.APPROVED{background:#DCFCE7;color:#15803D}.REJECTED{background:#FEE2E2;color:#B91C1C}.CANCELLED{background:#E5E7EB;color:#374151}.DELETED{background:#FEE2E2;color:#991B1B}
.field{display:flex;flex-direction:column;gap:7px;margin-bottom:14px}.field label{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:900}.input,select,textarea,.form-control,.form-select{border:1px solid var(--border)!important;border-radius:12px!important;background:var(--card)!important;color:var(--text)!important;min-height:42px;box-shadow:none!important}.input:focus,.form-control:focus,.form-select:focus,textarea:focus{border-color:var(--accent)!important;box-shadow:0 0 0 4px rgba(37,99,235,.12)!important}.sticky-actions{position:sticky;bottom:0;z-index:20;background:rgba(248,250,252,.9);backdrop-filter:blur(18px);border-top:1px solid var(--border);padding:14px 0;display:flex;justify-content:flex-end;gap:10px}[data-theme="dark"] .sticky-actions{background:rgba(11,18,32,.9)}
.table-shell{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:10px;box-shadow:var(--shadow-sm);overflow:auto;position:relative}.table-shell.dropdown-open{overflow:visible;z-index:5000}table.dataTable,table{width:100%!important;color:var(--text)}table.dataTable{white-space:nowrap}table thead th{position:sticky;top:0;z-index:3;background:#F9FAFB!important;color:#374151!important;font-size:11px;text-transform:uppercase;letter-spacing:.03em;border-bottom:1px solid var(--border)!important}table td,table th{vertical-align:middle;padding:8px 10px!important;border-color:var(--border)!important}table.dataTable th:first-child,table.dataTable td:first-child{position:sticky;left:0;z-index:2;background:var(--card)}table.dataTable thead th:first-child{z-index:4;background:#F9FAFB!important}.table-shell table:has(.dropdown) th:last-child,.table-shell table:has(.dropdown) td:last-child{position:sticky;right:0;z-index:5;background:var(--card);box-shadow:-12px 0 18px rgba(17,24,39,.07);min-width:104px}.table-shell table:has(.dropdown) td.action-cell-open{z-index:5001!important}.table-shell table:has(.dropdown) thead th:last-child{z-index:6;background:#F9FAFB!important}.table-shell .dropdown-menu,.na-floating-action-menu{z-index:99999!important;box-shadow:var(--shadow-md);border-color:var(--border);border-radius:12px;padding:6px;min-width:180px}.table-shell .dropdown-item,.na-floating-action-menu .dropdown-item{border-radius:8px;padding:7px 10px;font-weight:700}[data-theme="dark"] table thead th{background:#111827!important;color:#D1D5DB!important}[data-theme="dark"] .table-shell table:has(.dropdown) th:last-child,[data-theme="dark"] .table-shell table:has(.dropdown) td:last-child{background:var(--card)}.dataTables_wrapper .dt-search input,.dataTables_wrapper .dt-length select{border:1px solid var(--border);border-radius:10px;padding:6px 10px;background:var(--card);color:var(--text)}.dt-scroll,.dataTables_scroll,.dt-scroll-head,.dataTables_scrollHead,.dt-scroll-body,.dataTables_scrollBody{overflow:visible!important}
.empty-state{display:grid;place-items:center;text-align:center;min-height:240px;color:var(--muted)}.empty-state i{font-size:42px;color:#CBD5E1;margin-bottom:10px}.skeleton{position:relative;overflow:hidden;background:#EEF2F7;border-radius:12px}.skeleton:after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.7),transparent);animation:shimmer 1.4s infinite}@keyframes shimmer{100%{transform:translateX(100%)}}
.timeline{display:grid;gap:12px}.timeline-item{display:grid;grid-template-columns:34px 1fr;gap:10px}.timeline-dot{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#EFF6FF;color:var(--accent)}.sidebar-top-toggle{display:none}.app-shell.collapsed .sidebar-top-toggle{display:inline-grid}.select2-container .select2-selection--single{height:42px;border-color:var(--border);border-radius:12px}.select2-container--default .select2-selection--single .select2-selection__rendered{line-height:40px}.select2-container--default .select2-selection--single .select2-selection__arrow{height:40px}
@media(max-width:1180px){.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.chart-grid,.split-grid{grid-template-columns:1fr}.global-search{display:none}}
@media(max-width:900px){.app-shell{grid-template-columns:1fr}.sidebar{position:fixed;transform:translateX(-105%);width:292px}.app-shell.mobile-open .sidebar{transform:translateX(0)}.sidebar-top-toggle{display:inline-grid}.app-shell.mobile-open .sidebar-top-toggle{display:none}.app-shell.mobile-open .sidebar-toggle{display:inline-grid}.topbar{padding:0 14px}.content{padding:16px}.quick-create,.user-chip strong{display:none}.kpi-grid{grid-template-columns:1fr}.page-head{flex-direction:column}.topbar h1{font-size:17px}}
.btn{justify-content:center;white-space:nowrap}.quick-create{min-width:128px}
.dropdown-layout{display:grid;grid-template-columns:360px minmax(0,1fr);gap:18px}.category-pane{position:sticky;top:96px;align-self:start}.category-list{display:grid;gap:8px;max-height:calc(100vh - 230px);overflow:auto;padding-right:4px}.category-pill{width:100%;border:1px solid var(--border);background:var(--card);border-radius:14px;padding:12px;text-align:left;display:flex;justify-content:space-between;gap:10px;align-items:center;color:var(--text);transition:.16s ease}.category-pill:hover,.category-pill.active{border-color:rgba(37,99,235,.45);background:#EFF6FF;box-shadow:var(--shadow-sm)}[data-theme="dark"] .category-pill:hover,[data-theme="dark"] .category-pill.active{background:#172554}.category-pill span{display:flex;flex-direction:column}.category-pill small{color:var(--muted);font-weight:700}.category-pill em{font-style:normal;font-size:11px;font-weight:900;color:var(--muted)}.bank-row{border-style:dashed!important}.is-invalid{border-color:var(--danger)!important;box-shadow:0 0 0 4px rgba(220,38,38,.1)!important}
@media(max-width:1000px){.dropdown-layout{grid-template-columns:1fr}.category-pane{position:relative;top:auto}.category-list{max-height:none}}
.category-choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.category-choice-grid button{border:1px solid var(--border);border-radius:16px;background:var(--card);padding:22px;font-weight:900;color:var(--text);transition:.16s ease}.category-choice-grid button:hover{border-color:var(--accent);background:#EFF6FF;transform:translateY(-1px)}.voucher-group{border:1px solid var(--border);border-radius:18px;background:var(--card);padding:14px;margin-bottom:14px}.voucher-group h4{font-size:15px;font-weight:950;margin:0 0 10px;text-transform:uppercase;letter-spacing:.04em}.voucher-line{display:flex;justify-content:space-between;gap:14px;padding:12px;border-top:1px solid var(--border)}.voucher-line:first-of-type{border-top:0}.voucher-line:hover{background:rgba(37,99,235,.035)}
@media(max-width:760px){.category-choice-grid{grid-template-columns:1fr}.voucher-line{flex-direction:column}}
.job-flow-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.recovery-flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;gap:14px;align-items:center}.recovery-flow div{background:#F8FAFC;border:1px solid var(--border);border-radius:14px;padding:14px}.recovery-flow span{display:block;color:var(--muted);font-size:12px;font-weight:800;text-transform:uppercase}.recovery-flow strong{font-size:20px}@media(max-width:1100px){.job-flow-grid,.recovery-flow{grid-template-columns:1fr}.recovery-flow i{display:none}}
.editable-table th{min-width:140px}.editable-table .form-control,.editable-table .form-select{min-width:130px}
.branch-select{width:150px!important;height:38px;border-radius:10px!important;font-weight:800;color:var(--primary);background-color:var(--card)!important;border-color:var(--border)!important}
.branch-check-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px}
.branch-check{display:flex;align-items:center;gap:10px;border:1px solid var(--border);border-radius:12px;background:var(--card);padding:10px 12px;cursor:pointer}
.branch-check span{display:flex;flex-direction:column;line-height:1.2}
.branch-check strong{font-size:13px;color:var(--text)}
.branch-check small{font-size:11px;color:var(--muted);font-weight:800}
.user-management-stack{display:grid;gap:18px;margin-top:16px}
.user-create-card{padding:0;overflow:hidden}
.user-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:18px 20px;border-bottom:1px solid var(--border);background:linear-gradient(180deg,#fff,#fbfdff)}
.user-form-actions{display:flex;gap:10px;align-items:center;flex-shrink:0}
.user-create-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(250px,.65fr);gap:0}
.user-form-section{padding:16px 20px;border-right:1px solid var(--border);border-bottom:1px solid var(--border)}
.user-form-section:nth-child(2n){border-right:0}
.branch-access-section{grid-column:1/-1;border-right:0;border-bottom:0;background:#fbfdff}
.section-kicker{font-size:11px;text-transform:uppercase;letter-spacing:.08em;font-weight:950;color:var(--accent);margin-bottom:10px}
.user-form-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.user-form-row.access-row,.user-form-row.contact-row{grid-template-columns:repeat(2,minmax(0,1fr))}
.user-create-card .field{margin-bottom:0}
.user-create-card .form-control,.user-create-card .form-select{min-height:40px}
.user-list-card{padding:16px 18px 18px}
.user-list-card .table-shell{border-radius:14px}
@media(max-width:1180px){.user-create-grid{grid-template-columns:1fr}.user-form-section{border-right:0}.user-card-head{flex-direction:column}.user-form-actions{width:100%;justify-content:flex-end}}
@media(max-width:760px){.user-form-row,.user-form-row.access-row,.user-form-row.contact-row{grid-template-columns:1fr}.user-form-actions{display:grid;grid-template-columns:1fr 1fr}.user-card-head,.user-form-section{padding:14px}.branch-check-grid{grid-template-columns:1fr}}