@font-face {
    font-family: 'Vazirmatn';
    src: url('/fonts/Vazirmatn-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'Vazirmatn';
    src: url('/fonts/Vazirmatn-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}
:root {
    --bg: #e6edf5;
    --surface: #ffffff;
    --text: #0f172a;
    --muted: #6b7280;
    --primary: #0b73ff;
    --primary-weak: rgba(11, 115, 255, 0.1);
    --accent: #f97316;
    --border: #bcc8d8;
    --border-strong: #aebbd0;
    --shadow: 0 10px 24px rgba(15,23,42,0.12);
    --sidebar-width: 240px;
    --mobile-sidebar-width: min(82vw, 320px);
}
* { box-sizing: border-box; font-family: 'Vazirmatn','Tahoma',sans-serif; }
html { overflow-x:hidden; }
body.admin-body { margin:0; background:var(--bg); color:var(--text); direction:rtl; overflow-x:hidden; }
a { text-decoration:none; color:inherit; }
.admin-shell { display:grid; grid-template-columns:var(--sidebar-width) minmax(0,1fr); min-height:100dvh; }
.admin-sidebar { background:var(--sidebar-bg,#0f172a); color:#e2e8f0; padding:24px 16px; display:flex; flex-direction:column; gap:16px; position:sticky; top:0; height:100dvh; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; }
.sidebar-brand { display:flex; align-items:center; gap:10px; }
.brand-icon { width:38px; height:38px; border-radius:12px; background:var(--accent); }
.brand-title { font-weight:800; }
.brand-subtitle { font-size:12px; color:rgba(226,232,240,0.7); }
.sidebar-nav { display:flex; flex-direction:column; gap:8px; }
.sidebar-nav .item { display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:12px; color:#cbd5e1; min-width:0; }
.sidebar-nav .item.active, .sidebar-nav .item:hover { background:rgba(255,255,255,0.08); color:#fff; }
.sidebar-nav .item span:last-child { flex:1; min-width:0; }
.sidebar-icon { width:36px; height:28px; border-radius:8px; background:rgba(255,255,255,0.08); display:inline-flex; align-items:center; justify-content:center; font-weight:700; font-size:12px; }
.sidebar-icon svg { width:18px; height:18px; fill:currentColor; }
.sidebar-footer { margin-top:auto; }
.ghost-btn { display:inline-flex; align-items:center; justify-content:center; padding:8px 12px; border:1px solid rgba(255,255,255,0.2); border-radius:10px; color:#fff; background:transparent; }
.sidebar-footer .ghost-btn { width:100%; }
.admin-main { background:var(--bg); display:flex; flex-direction:column; min-width:0; }
.admin-topbar { background:var(--surface); border-bottom:1px solid var(--border); padding:14px 18px; box-shadow:0 4px 10px rgba(15,23,42,0.05); position:sticky; top:0; z-index:1100; }
.topbar-wrap { display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; }
.topbar-left { display:flex; gap:10px; align-items:center; }
.hamburger { display:none; width:40px; height:40px; border:1px solid var(--border); border-radius:10px; background:#fff; align-items:center; justify-content:center; flex-direction:column; gap:6px; padding:8px; cursor:pointer; }
.hamburger span { width:100%; height:2px; background:var(--text); display:block; border-radius:2px; }
.topbar-avatar { width:36px; height:36px; border-radius:50%; background:var(--primary-weak); display:inline-flex; align-items:center; justify-content:center; font-weight:800; color:var(--primary); }
.topbar-titles { display:flex; flex-direction:column; gap:2px; min-width:0; }
.topbar-user-name { font-weight:800; }
.topbar-subtitle { font-size:12px; color:var(--muted); }
.topbar-title { font-size:18px; font-weight:800; }
.admin-content { padding:20px 24px 32px; max-width:1440px; width:100%; margin:0 auto; min-width:0; }
.card { background:var(--surface); border:1px solid var(--border-strong); border-radius:16px; padding:16px; box-shadow:var(--shadow); margin-bottom:16px; min-width:0; }
.dashboard-hero { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:16px; box-shadow:var(--shadow); margin-bottom:16px; min-width:0; }
.hero-text { display:flex; flex-direction:column; gap:6px; min-width:0; }
.hero-title { font-size:20px; font-weight:800; margin:0; }
.hero-subtitle { font-size:13px; color:var(--muted); margin:0; }
.hero-meta { font-size:12px; color:var(--muted); }
.chip { display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:999px; background:var(--primary-weak); color:var(--primary); font-size:12px; font-weight:700; }
.filter-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:10px; align-items:end; }
.filter-grid > *, .form-grid > *, .kpi-grid > *, .chart-grid > *, .topbar-wrap > *, .d-flex > * { min-width:0; }
.filter-grid label { display:block; font-size:12px; color:var(--muted); margin-bottom:4px; }
.filter-grid input, .filter-grid select { width:100%; padding:10px; border:1px solid var(--border-strong); border-radius:10px; font-size:13px; background:#fff; color:var(--text); }
.filter-grid input:focus, .filter-grid select:focus, input:focus, select:focus, textarea:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(11, 115, 255, 0.15);
}
.filter-grid .actions, .filter-actions { display:flex; gap:8px; flex-wrap:wrap; grid-column:1/-1; }
.searchable-picker { position:relative; }
.searchable-picker .picker-results { position:absolute; top:100%; right:0; left:0; background:#fff; border:1px solid var(--border); border-radius:10px; box-shadow:var(--shadow); margin-top:4px; max-height:220px; overflow:auto; display:none; z-index:50; }
.searchable-picker .picker-results.open { display:block; }
.searchable-picker .picker-item { width:100%; border:none; background:#fff; text-align:right; padding:8px 10px; cursor:pointer; border-bottom:1px solid #eef2f6; }
.searchable-picker .picker-item:last-child { border-bottom:none; }
.searchable-picker .picker-item:hover { background:#f1f6ff; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:10px 14px; border-radius:12px; border:1px solid var(--border); background:#fff; color:var(--text); cursor:pointer; font-weight:700; min-height:42px; max-width:100%; text-align:center; }
.btn-primary { background:var(--primary); color:#fff; border-color:var(--primary); }
.btn-success { background:#10b981; color:#fff; border-color:#10b981; }
.btn-outline { background:#fff; color:var(--text); }
.btn.disabled { opacity:.5; pointer-events:none; }
.btn-sm { padding:6px 10px; font-size:12px; border-radius:10px; }
.btn-outline-primary { background:#fff; color:var(--primary); border-color:var(--primary); }
.btn-outline-secondary { background:#fff; color:var(--text); border-color:var(--border); }
.btn-outline-danger { background:#fff; color:#dc2626; border-color:#fca5a5; }
.btn-outline-warning { background:#fff; color:#b45309; border-color:#fcd34d; }
.btn-outline-success { background:#fff; color:#047857; border-color:#6ee7b7; }
.badge { display:inline-flex; align-items:center; justify-content:center; padding:4px 8px; border-radius:999px; font-size:12px; font-weight:700; }
.bg-secondary { background:#e2e8f0; color:#334155; }
.bg-success { background:rgba(16,185,129,0.14); color:#047857; }
.form-label { display:block; margin-bottom:6px; font-size:12px; color:var(--muted); }
.form-control, .form-select { width:100%; padding:10px 12px; border:1px solid var(--border-strong); border-radius:10px; font-size:13px; background:#fff; color:var(--text); }
.form-control-color { padding:6px; min-width:60px; width:60px; height:42px; }
.form-check { display:inline-flex; align-items:center; gap:8px; }
.form-check-input { margin:0; }
.form-check-label { font-size:13px; }
.alert { border-radius:12px; padding:12px 14px; border:1px solid transparent; }
.alert-success { background:rgba(16,185,129,0.08); border-color:rgba(16,185,129,0.18); color:#047857; }
.alert-danger { background:rgba(239,68,68,0.08); border-color:rgba(239,68,68,0.18); color:#b91c1c; }
.alert-warning { background:rgba(245,158,11,0.12); border-color:rgba(245,158,11,0.2); color:#92400e; }
.d-flex { display:flex; }
.align-items-start { align-items:flex-start; }
.justify-content-between { justify-content:space-between; }
.justify-content-end { justify-content:flex-end; }
.align-items-center { align-items:center; }
.flex-wrap { flex-wrap:wrap; }
.gap-2 { gap:8px; }
.w-100 { width:100%; }
.fw-bold { font-weight:700; }
.text-muted { color:var(--muted); }
.text-center { text-align:center; }
.small { font-size:12px; }
.mt-2 { margin-top:8px; }
.mb-0 { margin-bottom:0; }
.mb-1 { margin-bottom:4px; }
.mb-3 { margin-bottom:16px; }
.my-2 { margin-top:8px; margin-bottom:8px; }
.py-2 { padding-top:8px; padding-bottom:8px; }
.px-3 { padding-left:12px; padding-right:12px; }
.icon-row { display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
.icon-btn { width:34px; height:34px; border-radius:10px; border:1px solid var(--border); background:#fff; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; }
.icon-btn svg { width:16px; height:16px; fill:currentColor; }
.icon-btn.primary { background:var(--primary-weak); color:var(--primary); border-color:transparent; }
.icon-btn.danger { background:rgba(239,68,68,0.12); color:#ef4444; border-color:transparent; }
.icon-btn.warn { background:rgba(245,158,11,0.12); color:#f59e0b; border-color:transparent; }
.icon-btn.success { background:rgba(16,185,129,0.12); color:#10b981; border-color:transparent; }
.form-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:10px; align-items:end; }
.form-grid .span-2 { grid-column:span 2; }
.form-grid .span-full { grid-column:1/-1; }
.kpi-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:12px; }
.kpi-card { background:var(--surface); border:1px solid var(--border-strong); border-radius:16px; padding:14px; box-shadow:var(--shadow); }
.kpi-label { color:var(--muted); font-size:12px; }
.kpi-value { font-size:22px; font-weight:800; }
.performance-kpi-grid .kpi-card { display:flex; flex-direction:column; gap:6px; min-height:120px; }
.performance-kpi-card .kpi-agent { font-size:13px; font-weight:700; }
.performance-kpi-card .kpi-subtitle { font-size:11px; color:var(--muted); margin-top:auto; }
.performance-kpi-card .kpi-empty { font-size:12px; color:var(--muted); padding:6px 0; }
.chart-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:12px; }
.chart-wrap { min-height:220px; }
.table { width:100%; border-collapse:collapse; border-radius:12px; overflow:hidden; }
.table thead { background:#f8fafc; }
.table th, .table td { padding:12px 10px; border-bottom:1px solid #eef2f6; font-size:13px; text-align:right; }
.table tbody tr td { border-bottom:1px solid #d7e0ec; }
.table tr:last-child td { border-bottom:none; }
.table-hover tbody tr:hover { background:#f8fbff; }
.align-middle th, .align-middle td { vertical-align:middle; }
.table-sm th, .table-sm td { padding:10px 8px; }
.performance-table tbody tr td { border-bottom:1px solid #d7e0ec; }
.performance-table tbody tr:nth-child(even) { background:#f5f9ff; }
.performance-table tbody tr:hover { background:#eef4ff; }
.empty { text-align:center; color:var(--muted); padding:16px; }
.pager { padding:10px; display:flex; justify-content:space-between; align-items:center; gap:8px; flex-wrap:wrap; }
.pager-actions { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.pager-meta { font-size:12px; color:var(--muted); }
.pager > div:last-child { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.table-responsive { width:100%; overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; scrollbar-width:thin; border-radius:14px; }
.table-responsive > .table { min-width:100%; }
.card-panel { background:var(--surface); border:1px solid var(--border-strong); border-radius:16px; padding:16px; box-shadow:var(--shadow); }
.section-title { display:flex; align-items:center; gap:8px; font-size:18px; font-weight:800; color:var(--text); }
.pagination-nav { margin-top:16px; overflow-x:auto; }
.pagination-list { list-style:none; display:flex; align-items:center; justify-content:center; gap:8px; flex-wrap:wrap; margin:0; padding:0; min-width:max-content; }
.page-item { display:flex; flex:0 0 auto; }
.page-link, .page-ellipsis { min-width:40px; height:40px; padding:0 12px; border-radius:10px; border:1px solid var(--border); background:#fff; color:var(--text); display:inline-flex; align-items:center; justify-content:center; font-weight:700; white-space:nowrap; }
.page-link:hover { border-color:var(--primary); color:var(--primary); background:#f8fbff; }
.page-item.active .page-link { background:var(--primary); color:#fff; border-color:var(--primary); }
.page-item.disabled .page-link { opacity:.45; pointer-events:none; }
.page-ellipsis { color:var(--muted); }
.sort-btn { display:inline-flex; align-items:center; gap:6px; background:transparent; border:none; padding:0; font:inherit; color:inherit; cursor:pointer; }
.sort-indicator { font-size:11px; color:var(--muted); }
.table-loading { text-align:center; color:var(--muted); padding:18px; }
.table-loading.error { color:#ef4444; }
.sidebar-backdrop { display:block; position:fixed; inset:0; background:rgba(15,23,42,0.42); z-index:1190; opacity:0; pointer-events:none; transition:opacity .25s ease; }
.js-jalali-date { cursor:pointer; }
.jalali-date-field { position:relative; }
.jalali-date-field label { pointer-events:none; }
.jalali-date-field input.js-jalali-date { cursor:pointer; }
.jalali-date-panel {\r\n  direction:rtl;\r\n  max-height:320px;\r\n  overflow:auto;\r\n  position:fixed; position:absolute; z-index:99999; background:#fff; border:1px solid var(--border); border-radius:12px; box-shadow:var(--shadow); padding:10px; width:240px; display:none; }
.jalali-date-panel .jdp-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.jalali-date-panel .jdp-title { font-weight:700; font-size:13px; }
.jalali-date-panel .jdp-nav { border:1px solid var(--border); background:#fff; border-radius:8px; width:28px; height:28px; cursor:pointer; }
.jalali-date-panel .jdp-week, .jalali-date-panel .jdp-days { display:grid; grid-template-columns:repeat(7,1fr); gap:4px; }
.jalali-date-panel .jdp-week div { font-size:11px; color:var(--muted); text-align:center; }
.jalali-date-panel .jdp-day { border:1px solid transparent; background:#f8fafc; border-radius:8px; padding:6px 0; cursor:pointer; font-size:12px; }
.jalali-date-panel .jdp-day:hover { border-color:var(--primary); color:var(--primary); background:#fff; }
.jalali-date-panel .jdp-empty { height:26px; }
@media (max-width:1024px), (hover:none) and (pointer:coarse){
    .admin-shell { grid-template-columns:1fr; }
    .admin-sidebar {
        position:fixed;
        inset:0 0 0 auto;
        width:var(--mobile-sidebar-width);
        max-width:100vw;
        height:100dvh;
        padding:20px 14px 24px;
        transform:translateX(100%);
        visibility:hidden;
        transition:transform .25s ease, visibility .25s ease;
        z-index:1200;
        box-shadow:-18px 0 40px rgba(15,23,42,0.24);
    }
    body.sidebar-open { overflow:hidden; }
    body.sidebar-open .admin-sidebar { transform:translateX(0); visibility:visible; }
    body.sidebar-open .sidebar-backdrop { opacity:1; pointer-events:auto; }
    .hamburger { display:flex; }
    .admin-content { padding:16px 16px 24px; }
    .dashboard-hero { flex-direction:column; }
}
@media (max-width:768px){
    .topbar-wrap { display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; }
    .topbar-wrap > .topbar-titles:last-child { grid-column:1 / -1; }
    .topbar-title { font-size:16px; }
    .topbar-subtitle { font-size:11px; }
    .admin-content { padding:14px 12px 20px; }
    .card, .card-panel { padding:14px; border-radius:14px; }
    .filter-grid { grid-template-columns:1fr; }
    .form-grid { grid-template-columns:1fr; }
    .dashboard-hero { padding:14px; }
    .pagination-list { justify-content:flex-start; flex-wrap:nowrap; padding-bottom:4px; }
    .page-link, .page-ellipsis { min-width:36px; height:36px; font-size:12px; padding:0 10px; }
    .table th, .table td { padding:10px 8px; }
    .chart-grid, .kpi-grid { grid-template-columns:1fr; }
    .color-box { flex-wrap:wrap; }
}
