:root{--brand:#2563eb;--brand-2:#4f46e5;--ink:#172033;--muted:#64748b;--surface:#fff;--canvas:#f4f7fb;--border:#e5eaf2;--sidebar:#111827;--sidebar-2:#1f2937;--success:#10b981;--warning:#f59e0b;--danger:#ef4444;--shadow:0 10px 30px rgba(15,23,42,.07)}
*{box-sizing:border-box}body{background:var(--canvas);color:var(--ink);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:.94rem}.app-shell{min-height:100vh}.topbar{height:68px;background:rgba(255,255,255,.95);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:1020}.brand-mark{width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,var(--brand),var(--brand-2));display:grid;place-items:center;color:#fff;box-shadow:0 8px 20px rgba(37,99,235,.25)}.brand-title{font-weight:750;letter-spacing:-.02em}.sidebar{width:270px;background:linear-gradient(180deg,var(--sidebar),#0b1220);color:#cbd5e1;position:fixed;top:68px;bottom:0;left:0;overflow-y:auto;padding:20px 14px}.sidebar .nav-section{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:#64748b;padding:14px 14px 8px}.sidebar .nav-link{color:#cbd5e1;border-radius:10px;padding:10px 12px;margin:3px 0;display:flex;gap:11px;align-items:center;font-weight:550}.sidebar .nav-link:hover{background:rgba(255,255,255,.07);color:#fff}.sidebar .nav-link.active{background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;box-shadow:0 8px 20px rgba(37,99,235,.2)}.sidebar .nav-link i{font-size:1.05rem;width:20px}.content-wrap{margin-left:270px;padding:28px;min-height:calc(100vh - 68px)}.page-title{font-size:1.65rem;font-weight:760;letter-spacing:-.03em}.page-subtitle{color:var(--muted)}.card{border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);background:var(--surface)}.metric-card{padding:20px;position:relative;overflow:hidden;height:100%}.metric-card:after{content:"";position:absolute;width:110px;height:110px;border-radius:50%;right:-42px;top:-48px;background:rgba(37,99,235,.07)}.metric-label{color:var(--muted);font-size:.82rem;font-weight:650}.metric-value{font-size:1.85rem;font-weight:780;margin-top:5px;letter-spacing:-.04em}.metric-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:#eff6ff;color:var(--brand);font-size:1.15rem}.metric-icon.success{background:#ecfdf5;color:var(--success)}.metric-icon.warning{background:#fffbeb;color:var(--warning)}.metric-icon.danger{background:#fef2f2;color:var(--danger)}.section-card{padding:20px}.section-title{font-size:1rem;font-weight:720;margin:0}.table{--bs-table-bg:transparent}.table thead th{font-size:.74rem;text-transform:uppercase;letter-spacing:.04em;color:#64748b;border-bottom:1px solid var(--border);padding:14px 12px;white-space:nowrap}.table tbody td{padding:13px 12px;border-color:#edf1f6;vertical-align:middle}.table-hover tbody tr:hover{background:#f8fafc}.badge-soft{padding:.42rem .66rem;border-radius:999px;font-weight:650;font-size:.75rem}.btn{border-radius:10px;font-weight:600}.btn-primary{background:linear-gradient(135deg,var(--brand),var(--brand-2));border:0;box-shadow:0 7px 15px rgba(37,99,235,.18)}.form-control,.form-select{border-radius:10px;border-color:#d9e1ec;padding:.68rem .8rem}.form-control:focus,.form-select:focus{border-color:#93b4ff;box-shadow:0 0 0 .2rem rgba(37,99,235,.12)}.filter-card{padding:16px}.ticket-chat{max-height:470px;overflow-y:auto;padding:8px}.msg{background:#f1f5f9;border-radius:13px 13px 13px 3px;padding:12px 14px;margin-bottom:10px;max-width:85%}.msg.mine{margin-left:auto;background:#e8f0ff;border-radius:13px 13px 3px 13px}.msg small{font-size:.7rem}.empty-state{text-align:center;padding:42px 20px;color:var(--muted)}.empty-state i{font-size:2rem;color:#94a3b8}.login-page{min-height:100vh;background:radial-gradient(circle at 10% 10%,rgba(37,99,235,.18),transparent 35%),linear-gradient(135deg,#0f172a,#172554);display:grid;place-items:center;padding:24px}.login-card{width:min(430px,100%);border:0;border-radius:22px;box-shadow:0 30px 70px rgba(0,0,0,.25);overflow:hidden}.login-card .card-body{padding:38px}.chart-box{height:310px}.quick-action{border:1px solid var(--border);border-radius:13px;padding:15px;text-decoration:none;color:var(--ink);display:flex;align-items:center;gap:12px;transition:.2s}.quick-action:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:#bfd0ff}.quick-action i{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:#eff6ff;color:var(--brand)}.avatar{width:36px;height:36px;border-radius:50%;background:#e0e7ff;color:#4338ca;display:grid;place-items:center;font-weight:700}.offcanvas .sidebar{position:static;width:auto;height:100%;padding-top:10px}.status-dot{width:9px;height:9px;border-radius:50%;display:inline-block;margin-right:6px}.text-truncate-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media(max-width:991.98px){.sidebar{display:none}.content-wrap{margin-left:0;padding:20px}.topbar{height:62px}.sidebar-mobile{background:linear-gradient(180deg,var(--sidebar),#0b1220);color:#fff}.page-title{font-size:1.4rem}}
@media(max-width:575.98px){.content-wrap{padding:15px}.metric-value{font-size:1.55rem}.card{border-radius:13px}.section-card{padding:15px}.login-card .card-body{padding:28px 22px}}