@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap";
:root{--bg-60:#0b132b;--surface-30:#172554;--accent-10:#f59e0b;--primary:#3b82f6;--primary-hover:#2563eb;--secondary:#f59e0b;--background:var(--bg-60);--surface:var(--surface-30);--surface-light:var(--glass-border);--glass-sidebar:#06142ecc;--glass-topbar:#0b132bcc;--glass-card:#17255499;--glass-border:#ffffff0d;--table-header-bg:#0003;--text-main:#f8fafc;--text-muted:#94a3b8;--success:#10b981;--warning:#f59e0b;--danger:#ef4444;--border:#1e3a8a;--shadow-sm:0 4px 12px #0003;--shadow-md:0 10px 25px #0000004d;--shadow-lg:0 20px 48px #0006;--shadow-primary:0 8px 24px #0a264766;--radius-xs:8px;--radius-sm:12px;--radius-md:16px;--radius-lg:24px;--radius-full:9999px;--transition-fast:.2s cubic-bezier(.4, 0, .2, 1);--transition-normal:.3s cubic-bezier(.4, 0, .2, 1)}[data-theme=light]{--background:#f3f4f6;--surface:#fff;--surface-light:#f9fafb;--glass-sidebar:#ffffffe6;--glass-topbar:#ffffffe6;--glass-card:#ffffffe6;--glass-border:#00000014;--table-header-bg:#0000000a;--text-main:#111827;--text-muted:#4b5563;--primary:#2563eb;--primary-hover:#1d4ed8;--secondary:#d97706;--border:#d1d5db;--shadow-sm:0 2px 8px #0000000d;--shadow-md:0 4px 16px #00000014;--shadow-lg:0 8px 24px #0000001f;--shadow-primary:0 8px 24px #2563eb33}[data-theme=dark]{--background:#111827;--surface:#1f2937;--surface-light:#ffffff0d;--glass-sidebar:#111827cc;--glass-topbar:#111827cc;--glass-card:#1f293799;--glass-border:#ffffff0d;--table-header-bg:#0003;--text-main:#f9fafb;--text-muted:#9ca3af;--primary:#6366f1;--primary-hover:#4f46e5;--secondary:#10b981;--border:#374151;--shadow-primary:0 8px 24px #6366f133}[data-theme=red-dark]{--background:#1a0b0f;--surface:#2d141c;--surface-light:#ffffff0d;--glass-sidebar:#1a0b0fcc;--glass-topbar:#1a0b0fcc;--glass-card:#2d141c99;--glass-border:#ffffff0d;--table-header-bg:#0003;--text-main:#fdf2f5;--text-muted:#fca5a5;--primary:#e11d48;--primary-hover:#be123c;--secondary:#f43f5e;--border:#4c1d2a;--shadow-primary:0 8px 24px #e11d484d}[data-theme=green-dark]{--background:#061b14;--surface:#0e3628;--surface-light:#ffffff0d;--glass-sidebar:#061b14cc;--glass-topbar:#061b14cc;--glass-card:#0e362899;--glass-border:#ffffff0d;--table-header-bg:#0003;--text-main:#f0fdf4;--text-muted:#86efac;--primary:#10b981;--primary-hover:#059669;--secondary:#34d399;--border:#1b5641;--shadow-primary:0 8px 24px #10b9814d}[data-theme=emerald]{--background:#022c22;--surface:#064e3b;--surface-light:#ffffff0d;--glass-sidebar:#022c22cc;--glass-topbar:#022c22cc;--glass-card:#064e3b99;--glass-border:#ffffff0d;--table-header-bg:#0003;--text-main:#ecfdf5;--text-muted:#6ee7b7;--primary:#10b981;--primary-hover:#059669;--secondary:#34d399;--border:#047857;--shadow-primary:0 8px 24px #10b9814d}[data-theme=blue-sapphire]{--background:#001730;--surface:#00264d;--surface-light:#ffffff0d;--glass-sidebar:#001730cc;--glass-topbar:#001730cc;--glass-card:#00264d99;--glass-border:#ffffff0d;--table-header-bg:#0003;--text-main:#f0f8ff;--text-muted:#93c5fd;--primary:#0f52ba;--primary-hover:#0b3a85;--secondary:#3b82f6;--border:#004080;--shadow-primary:0 8px 24px #0f52ba4d}[data-theme=green-sapphire]{--background:#00211a;--surface:#00382d;--surface-light:#ffffff0d;--glass-sidebar:#00211acc;--glass-topbar:#00211acc;--glass-card:#00382d99;--glass-border:#ffffff0d;--table-header-bg:#0003;--text-main:#f0fdf8;--text-muted:#6ee7b7;--primary:#12826a;--primary-hover:#0c5e4c;--secondary:#34d399;--border:#005a49;--shadow-primary:0 8px 24px #12826a4d}[data-theme=red-sapphire]{--background:#2b0000;--surface:#4d0000;--surface-light:#ffffff0d;--glass-sidebar:#2b0000cc;--glass-topbar:#2b0000cc;--glass-card:#4d000099;--glass-border:#ffffff0d;--table-header-bg:#0003;--text-main:#fff0f0;--text-muted:#fca5a5;--primary:#b00c2a;--primary-hover:#82081e;--secondary:#ef4444;--border:maroon;--shadow-primary:0 8px 24px #b00c2a4d}[data-theme=orange-sapphire]{--background:#2e1200;--surface:#4a1d00;--surface-light:#ffffff0d;--glass-sidebar:#2e1200cc;--glass-topbar:#2e1200cc;--glass-card:#4a1d0099;--glass-border:#ffffff0d;--table-header-bg:#0003;--text-main:#fff5f0;--text-muted:#fdba74;--primary:#d95d00;--primary-hover:#a64700;--secondary:#f97316;--border:#8a3600;--shadow-primary:0 8px 24px #d95d004d}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--background);color:var(--text-main);-webkit-font-smoothing:antialiased;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.5;overflow-x:hidden}a{color:inherit;text-decoration:none}button{cursor:pointer;background:0 0;border:none;font-family:inherit}input,select,textarea{color:var(--text-main);font-family:inherit}select option{background-color:var(--surface-30);color:var(--text-main)}body{max-width:100vw;overflow-x:hidden}.app-container{max-width:100vw;min-height:100vh;display:flex;overflow-x:hidden}.sidebar{background:var(--glass-sidebar);-webkit-backdrop-filter:blur(20px);border-right:1px solid var(--glass-border);z-index:50;flex-direction:column;width:280px;height:100vh;display:flex;position:fixed;box-shadow:4px 0 24px #0003}.sidebar-header{border-bottom:1px solid var(--glass-border);padding:28px 24px}.sidebar-logo{background:linear-gradient(135deg, var(--primary), var(--secondary));-webkit-text-fill-color:transparent;letter-spacing:2px;-webkit-background-clip:text;background-clip:text;font-size:26px;font-weight:800}.sidebar-nav{flex-direction:column;flex:1;gap:6px;padding:24px 16px;display:flex;overflow-y:auto}.sidebar-nav::-webkit-scrollbar{width:4px}.nav-item{border-radius:var(--radius-sm);color:var(--text-muted);transition:all var(--transition-fast);align-items:center;gap:12px;padding:12px 16px;font-size:14px;font-weight:500;display:flex}.nav-item:hover{background:var(--glass-border);color:var(--text-main);transform:translate(4px)}.nav-item.active{background:color-mix(in srgb, var(--primary) 15%, transparent);color:var(--primary);border-left:4px solid var(--primary);font-weight:600}.main-content{flex-direction:column;flex:1;min-width:0;margin-left:280px;display:flex}.topbar{background:var(--glass-topbar);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--glass-border);z-index:40;justify-content:space-between;align-items:center;height:80px;padding:0 40px;display:flex;position:sticky;top:0}.page-title{color:var(--text-main);letter-spacing:-.5px;font-size:22px;font-weight:700}.user-profile{align-items:center;gap:16px;display:flex}.user-info{flex-direction:column;align-items:flex-end;display:flex}.user-role{color:var(--text-muted);letter-spacing:.5px;font-size:12px;font-weight:500}.avatar{background:linear-gradient(135deg, var(--primary), var(--secondary));color:#fff;width:44px;height:44px;box-shadow:var(--shadow-primary);border:2px solid #ffffff1a;border-radius:50%;justify-content:center;align-items:center;font-size:18px;font-weight:700;display:flex}.content-area{flex-direction:column;flex:1;min-width:0;max-width:100%;padding:40px;display:flex}.card{background:var(--glass-card);-webkit-backdrop-filter:blur(10px);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);border:1px solid var(--glass-border);transition:all var(--transition-normal);padding:28px}.card:hover{box-shadow:var(--shadow-md);border-color:#3b82f64d;transform:translateY(-4px)}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:28px;margin-bottom:40px;display:grid}.stat-title{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:12px;font-size:14px;font-weight:600}.stat-value{color:var(--text-main);font-size:36px;font-weight:800}.table-container{background:var(--glass-card);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);overflow-x:auto}table{border-collapse:separate;border-spacing:0;width:100%}th,td{text-align:left;border-bottom:1px solid var(--glass-border);padding:18px 24px}th{background:var(--table-header-bg);color:var(--text-muted);text-transform:uppercase;letter-spacing:1px;font-size:13px;font-weight:600}tr:last-child td{border-bottom:none}tr:hover td{background:var(--surface-light)}.badge{border-radius:var(--radius-full);align-items:center;gap:6px;padding:6px 14px;font-size:12px;font-weight:700;display:inline-flex}.badge.pending{background:color-mix(in srgb, var(--warning) 15%, transparent);color:var(--warning);border:1px solid color-mix(in srgb, var(--warning) 30%, transparent)}.badge.completed{background:color-mix(in srgb, var(--success) 15%, transparent);color:var(--success);border:1px solid color-mix(in srgb, var(--success) 30%, transparent)}.badge.cancelled{background:color-mix(in srgb, var(--danger) 15%, transparent);color:var(--danger);border:1px solid color-mix(in srgb, var(--danger) 30%, transparent)}.badge.in_progress{background:color-mix(in srgb, var(--primary) 15%, transparent);color:var(--primary);border:1px solid color-mix(in srgb, var(--primary) 30%, transparent)}.btn{border-radius:var(--radius-sm);transition:all var(--transition-normal);justify-content:center;align-items:center;gap:8px;padding:12px 24px;font-size:14px;font-weight:600;display:inline-flex}.btn-primary{background:var(--primary);color:#fff;box-shadow:var(--shadow-primary);border:none}.btn-primary:hover{background:var(--primary-hover);box-shadow:var(--shadow-primary);transform:translateY(-2px)}.btn-secondary{background:color-mix(in srgb, var(--text-main) 10%, transparent);color:var(--text-main);border:1px solid color-mix(in srgb, var(--text-main) 10%, transparent)}.btn-secondary:hover{background:color-mix(in srgb, var(--text-main) 15%, transparent);border-color:color-mix(in srgb, var(--text-main) 20%, transparent)}.btn-danger{background:color-mix(in srgb, var(--danger) 15%, transparent);color:var(--danger);border:1px solid color-mix(in srgb, var(--danger) 30%, transparent)}.btn-danger:hover{background:color-mix(in srgb, var(--danger) 25%, transparent);box-shadow:0 8px 24px color-mix(in srgb, var(--danger) 20%, transparent)}.btn-outline{border:1px solid var(--border);color:var(--text-main);background:0 0}.btn-outline:hover{border-color:var(--primary);color:var(--primary);background:#3b82f60d}.btn-sm{border-radius:var(--radius-xs);padding:8px 16px;font-size:13px}.form-label{color:var(--text-main);margin-bottom:8px;font-size:14px;font-weight:600;display:block}.form-input{width:100%;color:var(--text-main);background:#ffffff08;border:1px solid #ffffff14;border-radius:12px;padding:14px 18px;font-size:15px;font-weight:500;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:inset 0 2px 6px #0003}.form-input:hover{background:#ffffff0f;border-color:#ffffff26}.form-input:focus{border-color:var(--primary);background:#ffffff0f;outline:none;transform:translateY(-1px);box-shadow:0 0 0 4px #3b82f633,inset 0 2px 6px #0000001a}.form-input::placeholder{color:#ffffff4d}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--background)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.login-container{background:var(--bg-60);justify-content:center;align-items:center;min-height:100vh;display:flex;position:relative;overflow:hidden}.login-container:before{content:"";z-index:0;background:radial-gradient(circle,#3b82f626 0%,#0b132b00 70%);width:800px;height:800px;animation:10s ease-in-out infinite alternate pulse;position:absolute;top:-400px;left:-400px}@keyframes pulse{0%{opacity:.8;transform:scale(1)}to{opacity:1;transform:scale(1.2)}}.login-card{-webkit-backdrop-filter:blur(24px);border-radius:var(--radius-lg);z-index:2;background:#172554cc;border:1px solid #ffffff14;width:100%;max-width:440px;padding:56px 48px;box-shadow:0 24px 64px #0006}.login-title{background:linear-gradient(135deg, var(--primary), var(--secondary));-webkit-text-fill-color:transparent;text-align:center;-webkit-background-clip:text;background-clip:text;margin-bottom:12px;font-size:32px;font-weight:800}.login-subtitle{text-align:center;color:var(--text-muted);margin-bottom:40px;font-size:15px}@media (max-width:1024px){.sidebar{width:72px;overflow:hidden}.sidebar-logo{letter-spacing:0;color:var(--primary);text-align:center;background:0 0;font-size:14px}.sidebar-header{flex-direction:column;justify-content:center;align-items:center;padding:16px 0;display:flex}.sidebar-header div:last-child{display:none}.sidebar-nav{padding:16px 8px}.nav-item{justify-content:center;width:100%;margin:0;padding:14px 0}.nav-item span{display:none}.nav-item.active{background:color-mix(in srgb, var(--primary) 15%, transparent);border-left:none;border-radius:12px}.main-content{margin-left:72px}.topbar{padding:0 20px}.content-area{padding:20px}}@media (max-width:768px){.sidebar{background:var(--background);-webkit-backdrop-filter:blur(20px);border-right:1px solid var(--glass-border);width:280px;transition:transform .3s cubic-bezier(.4,0,.2,1);transform:translate(-100%);box-shadow:4px 0 24px #00000080}.sidebar.open{transform:translate(0)}.sidebar-nav{padding:12px 0}.nav-item{justify-content:flex-start;width:auto;margin:4px 12px;padding:12px 16px}.nav-item span{display:block}.sidebar-logo{text-align:left;font-size:20px;display:block}.sidebar-header{flex-direction:row;justify-content:space-between;padding:20px}.sidebar-header div:last-child{display:flex}.main-content{width:100%;margin-left:0}.topbar{background:var(--background);-webkit-backdrop-filter:none;justify-content:space-between;height:64px;padding:0 16px}.mobile-menu-btn{display:flex!important}.page-title{white-space:nowrap;text-overflow:ellipsis;max-width:150px;font-size:16px;font-weight:700;overflow:hidden}.content-area{box-sizing:border-box;width:100%;min-width:0;max-width:100vw;padding:12px;overflow-x:hidden}.card .form-input,.card select,.card input[type=text],.card input[type=date]{min-height:48px;padding:12px 16px;width:100%!important;max-width:100%!important}.card button.btn,.btn{justify-content:center;width:100%;min-height:48px;margin-bottom:8px;padding:12px 16px;font-size:15px}.btn-sm{min-height:40px!important;padding:8px 16px!important}.avatar{display:none}.table-container{width:100%;box-shadow:none;background:0 0;border:none;display:block;overflow:visible}.table-container table,table{display:block;width:100%!important;min-width:0!important}table thead{display:none}table tbody{width:100%;display:block}table tr{background:var(--surface);border-radius:var(--radius-md);border:1px solid var(--border);box-shadow:var(--shadow-sm);flex-direction:column;margin-bottom:16px;padding:12px;display:flex}table td{flex-direction:column;align-items:flex-start;min-height:auto;display:flex;white-space:normal!important;text-align:left!important;border-bottom:1px dashed #ffffff1a!important;padding:10px 12px!important}table td:last-child{border-bottom:none!important}table td:before{content:attr(data-label);text-transform:uppercase;color:var(--primary);letter-spacing:.5px;margin-bottom:6px;font-size:11px;font-weight:800}.stats-grid{grid-template-columns:1fr;gap:16px;margin-bottom:24px}.card{padding:20px}}.mobile-menu-btn{color:var(--text-main);cursor:pointer;background:0 0;border:none;margin-right:12px;padding:8px;display:none}.sidebar-overlay{z-index:45;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000080;display:none;position:fixed;inset:0}.sidebar-overlay.open{display:block}.sidebar-logo-img{transition:transform .3s cubic-bezier(.175,.885,.32,1.275),filter .3s}.sidebar-logo-img:hover{filter:drop-shadow(0 4px 12px #38bdf866);transform:scale(1.1)rotate(-2deg)}