:root { --sidebar: #082039; --sidebar2: #061629; --brand: #18c875; --brand2: #0fbf71; }
* { box-sizing: border-box; }
body { font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: #f8fafc; color: #0f172a; }
.idriver-sidebar { background: radial-gradient(circle at 20% 10%, rgba(28, 200, 117, .25), transparent 30%), linear-gradient(180deg, var(--sidebar), var(--sidebar2)); box-shadow: 8px 0 35px rgba(8, 32, 57, .12); }
.sidebar-link { display:flex; align-items:center; gap:.85rem; padding:.85rem 1rem; border-radius:.75rem; color:rgba(255,255,255,.88); transition:.2s; font-weight:600; font-size:.92rem; }
.sidebar-link:hover { background: rgba(255,255,255,.08); transform: translateX(3px); }
.sidebar-link.active { background: linear-gradient(135deg, #19c878, #0fc067); color:white; box-shadow: 0 14px 30px rgba(24,200,117,.28); }
.card { background: rgba(255,255,255,.92); border:1px solid #e2e8f0; border-radius:1rem; box-shadow:0 8px 24px rgba(15,23,42,.04); }
.stat-icon { width:3rem; height:3rem; border-radius:999px; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; box-shadow: inset 0 -10px 15px rgba(0,0,0,.08); }
.tone-green { background: linear-gradient(135deg,#20c76b,#06b66a); }
.tone-rose { background: linear-gradient(135deg,#fb4777,#f43f5e); }
.tone-sky { background: linear-gradient(135deg,#2ba5ff,#0ea5e9); }
.tone-violet { background: linear-gradient(135deg,#a66bff,#7c3aed); }
.tone-orange { background: linear-gradient(135deg,#ff8a22,#f97316); }
.tone-cyan { background: linear-gradient(135deg,#10c8cb,#0891b2); }
.tone-amber { background: linear-gradient(135deg,#ffc533,#f59e0b); }
.tone-emerald { background: linear-gradient(135deg,#24d391,#10b981); }
.input { width:100%; border:1px solid #dbe4f0; border-radius:.75rem; padding:.7rem .85rem; outline: none; background:white; transition:.15s; }
.input:focus { border-color:#18c875; box-shadow:0 0 0 4px rgba(24,200,117,.10); }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:.45rem; border-radius:.75rem; padding:.7rem 1rem; font-weight:700; transition:.15s; }
.btn-primary { background:linear-gradient(135deg,#19c878,#0fbf71); color:white; box-shadow:0 12px 25px rgba(24,200,117,.22); }
.btn-primary:hover { transform:translateY(-1px); box-shadow:0 16px 30px rgba(24,200,117,.30); }
.btn-soft { background:#f1f5f9; color:#0f172a; }
.btn-danger { background:#ef4444; color:white; }
.table th { font-size:.72rem; text-transform:uppercase; letter-spacing:.04em; color:#64748b; font-weight:800; }
.table td, .table th { padding:.9rem .75rem; border-bottom:1px solid #edf2f7; }
.badge { display:inline-flex; align-items:center; border-radius:999px; padding:.25rem .55rem; font-size:.72rem; font-weight:800; }
.badge-success { color:#047857; background:#dcfce7; }
.badge-pending { color:#a16207; background:#fef3c7; }
.badge-danger { color:#be123c; background:#ffe4e6; }
.badge-muted { color:#475569; background:#e2e8f0; }
.modal-backdrop { position:fixed; inset:0; background:rgba(15,23,42,.55); display:flex; align-items:center; justify-content:center; z-index:50; padding:1rem; }
.modal-box { width:min(760px, 100%); max-height:90vh; overflow:auto; background:white; border-radius:1.25rem; box-shadow:0 40px 80px rgba(2,6,23,.25); }
.chart-wrap { height: 280px; }
[x-cloak] { display:none!important; }
@media (max-width: 1024px) { .desktop-sidebar { display:none; } .content-shell { margin-left:0!important; } }
@media (min-width: 1025px) { .mobile-top { display:none; } .content-shell { margin-left:16rem; } }
.form-label { display:block; margin-bottom:.5rem; font-size:.875rem; font-weight:800; color:#0f172a; user-select:none; -webkit-user-select:none; }
.modal-box label, .card label { user-select:none; -webkit-user-select:none; }
.input[type="number"] { appearance:textfield; }
.input[type="number"]::-webkit-outer-spin-button, .input[type="number"]::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
.profile-menu-shadow { box-shadow:0 22px 55px rgba(15,23,42,.16); }
.top-action { width:2.75rem; height:2.75rem; border-radius:1rem; display:inline-flex; align-items:center; justify-content:center; background:#f8fafc; border:1px solid #e2e8f0; color:#0f172a; font-size:1.2rem; transition:.18s; }
.top-action:hover, .top-action.active { background:#0f172a; color:#fff; transform:translateY(-1px); box-shadow:0 12px 28px rgba(15,23,42,.12); }
button:disabled { pointer-events:none; }
.table tbody tr:hover { background:#f8fafc; }
body.dark-mode { background:#07111f; color:#e2e8f0; }
body.dark-mode .content-shell, body.dark-mode section { background:#07111f; }
body.dark-mode header, body.dark-mode .mobile-top { background:rgba(15,23,42,.94)!important; border-color:#1e293b!important; }
body.dark-mode .card, body.dark-mode .modal-box { background:#0f172a; border-color:#1e293b; color:#e2e8f0; }
body.dark-mode .input, body.dark-mode select, body.dark-mode textarea { background:#111c2e; border-color:#334155; color:#e2e8f0; }
body.dark-mode .btn-soft { background:#1e293b; color:#e2e8f0; }
body.dark-mode .table td, body.dark-mode .table th { border-color:#1e293b; }
body.dark-mode .table tbody tr:hover { background:#111c2e; }
body.dark-mode .bg-white, body.dark-mode .bg-slate-50, body.dark-mode .bg-slate-50\/70 { background-color:#0f172a!important; }
body.dark-mode .text-slate-500, body.dark-mode .text-slate-600, body.dark-mode .text-slate-700 { color:#cbd5e1!important; }
body.dark-mode .text-slate-400 { color:#94a3b8!important; }
body.dark-mode .border, body.dark-mode .border-b, body.dark-mode .border-l, body.dark-mode .border-slate-200, body.dark-mode .border-slate-300 { border-color:#334155!important; }
body.dark-mode .hover\:bg-slate-50:hover, body.dark-mode .hover\:bg-slate-100:hover { background:#1e293b!important; }
body.dark-mode .modal-backdrop { background:rgba(2,6,23,.75); }
body.dark-mode .form-label { color:#e2e8f0; }

/* Professional accounting toolbar fixes */
.accounting-toolbar { display:grid; grid-template-columns:minmax(260px, 1.6fr) minmax(140px, .9fr) minmax(150px, .8fr) minmax(150px, .8fr) auto; gap:.75rem; align-items:end; max-width:100%; }
.accounting-toolbar .field { min-width:0; }
.accounting-toolbar .field-label { display:block; font-size:.68rem; line-height:1; text-transform:uppercase; letter-spacing:.08em; color:#64748b; font-weight:900; margin:0 0 .35rem .1rem; }
.compact-input { height:3.1rem; padding:.65rem .85rem; border-radius:.85rem; font-size:.92rem; }
.accounting-actions { display:flex; gap:.75rem; align-items:end; }
.compact-action { min-height:3.1rem; padding:.72rem 1.1rem; white-space:nowrap; border-radius:.9rem; }
@media (max-width: 1280px) { .accounting-toolbar { grid-template-columns:repeat(2, minmax(0, 1fr)); width:100%; } .accounting-actions { grid-column:1/-1; justify-content:flex-end; } }
@media (max-width: 640px) { .accounting-toolbar { grid-template-columns:1fr; } .accounting-actions { justify-content:stretch; } .accounting-actions .btn { flex:1; } .compact-input { height:2.9rem; } }
body.dark-mode .accounting-toolbar .field-label { color:#cbd5e1; }

/* Enterprise UI refinements */
.desktop-sidebar nav::-webkit-scrollbar,.mobile-drawer nav::-webkit-scrollbar{width:6px}
.desktop-sidebar nav::-webkit-scrollbar-thumb,.mobile-drawer nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.25);border-radius:99px}
.desktop-sidebar{overflow:hidden}.desktop-sidebar nav{padding-bottom:.5rem}
.content-shell{transition:margin .2s ease;background:linear-gradient(180deg,#f8fbff 0%,#f8fafc 30%,#f1f5f9 100%)}
.module-filter-panel{display:grid;grid-template-columns:minmax(220px,1.2fr) repeat(4,minmax(140px,.75fr)) auto;gap:.75rem;align-items:end}
.module-filter-panel .filter-label{display:block;font-size:.68rem;line-height:1;text-transform:uppercase;letter-spacing:.08em;color:#64748b;font-weight:900;margin:0 0 .35rem .1rem}
.module-filter-panel .filter-actions{display:flex;gap:.65rem;align-items:end;justify-content:flex-end}
.loading-muted{opacity:.55;pointer-events:none;transition:.2s}
.clean-topbar{box-shadow:0 8px 30px rgba(15,23,42,.035)}
@media (max-width: 1280px){.module-filter-panel{grid-template-columns:repeat(2,minmax(0,1fr))}.module-filter-panel .filter-actions{grid-column:1/-1}}
@media (max-width: 640px){.module-filter-panel{grid-template-columns:1fr}.module-filter-panel .filter-actions{justify-content:stretch}.module-filter-panel .filter-actions .btn{flex:1}.mobile-top{padding:.65rem .9rem}.card{border-radius:.85rem}.btn{padding:.65rem .85rem}.input{min-height:2.75rem}.table td,.table th{padding:.72rem .6rem}}
@media (min-width: 1025px){.desktop-only-hide{display:none!important}}
body.dark-mode .module-filter-panel .filter-label{color:#cbd5e1}

/* Table alignment improvements */
.table th { text-align:left; vertical-align:middle; }
.table td { vertical-align:middle; }
.table .text-right, th.text-right, td.text-right { text-align:right; }
.table td .badge { white-space:nowrap; }
@media (max-width:640px){ .table { min-width:720px; } .modal-box{border-radius:1rem;} }

/* Live hosting professional dashboard fix */
.admin-page-shell { max-width: 100%; overflow-x: hidden; }
.dashboard-page { width: 100%; }
.dashboard-title-row { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; margin-bottom:.25rem; }
.dashboard-title { font-size: clamp(1.65rem, 1.3rem + 1vw, 2.35rem); line-height:1.05; font-weight:900; letter-spacing:-.035em; color:#07152a; }
.dashboard-subtitle { margin-top:.45rem; color:#64748b; font-size:.95rem; max-width:52rem; }
.dashboard-meta-card { min-width: 190px; border:1px solid #dbe4f0; background:rgba(255,255,255,.92); border-radius:1rem; padding:.75rem 1rem; display:flex; flex-direction:column; gap:.1rem; font-size:.82rem; box-shadow:0 8px 24px rgba(15,23,42,.04); }
.dashboard-meta-card strong { font-size:.98rem; color:#0f172a; }
.dashboard-kpi-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(245px, 1fr)); gap:1rem; align-items:stretch; }
.dashboard-kpi-card { padding:1.15rem; min-height:156px; overflow:hidden; position:relative; }
.dashboard-kpi-card:after { content:""; position:absolute; right:-40px; top:-40px; width:110px; height:110px; border-radius:999px; background:linear-gradient(135deg, rgba(24,200,117,.10), rgba(14,165,233,.08)); pointer-events:none; }
.dashboard-kpi-card .stat-icon { flex:0 0 3rem; width:3rem; height:3rem; }
.dashboard-kpi-label { font-size:.86rem; font-weight:900; color:#475569; line-height:1.25; min-height:2.1em; }
.dashboard-kpi-value { margin-top:.55rem; font-size:clamp(1.35rem, 1.05rem + .65vw, 1.85rem); line-height:1.08; font-weight:950; letter-spacing:-.025em; color:#0f172a; white-space:normal; overflow-wrap:anywhere; }
.dashboard-kpi-trend { margin-top:1.1rem; font-size:.86rem; font-weight:900; display:flex; align-items:center; gap:.25rem; flex-wrap:wrap; }
.chart-wrap { min-height:280px; }
.clean-topbar { min-width:0; }
.clean-topbar .input { box-shadow:none; }
.content-shell { min-width:0; }
@media (min-width:1025px) {
  .content-shell { margin-left:16rem; width:calc(100% - 16rem); }
  .desktop-sidebar { width:16rem; }
}
@media (max-width:1380px) and (min-width:1025px) {
  .dashboard-kpi-grid { grid-template-columns:repeat(auto-fit, minmax(225px, 1fr)); }
}
@media (max-width:768px) {
  .dashboard-title-row { flex-direction:column; align-items:stretch; }
  .dashboard-meta-card { min-width:0; }
  .dashboard-kpi-grid { grid-template-columns:1fr; }
  .dashboard-kpi-card { min-height:auto; }
}
body.dark-mode .dashboard-title { color:#f8fafc; }
body.dark-mode .dashboard-subtitle { color:#cbd5e1; }
body.dark-mode .dashboard-meta-card { background:#0f172a; border-color:#334155; }
body.dark-mode .dashboard-meta-card strong,
body.dark-mode .dashboard-kpi-value { color:#f8fafc; }
body.dark-mode .dashboard-kpi-label { color:#cbd5e1; }
