/* ============================================================
   SignFlow · Polished UI System
   © אופיר ברנס - כל הזכויות שמורות
   ============================================================ */

:root {
    --primary: #667eea;
    --primary-dark: #5568d3;
    --secondary: #764ba2;
    --accent: #f093fb;
    --gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --gradient-soft: linear-gradient(135deg, rgba(102,126,234,.08) 0%, rgba(118,75,162,.08) 100%);
    --gradient-accent: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);

    --success: #10b981;
    --success-bg: #d1fae5;
    --warning: #f59e0b;
    --warning-bg: #fef3c7;
    --danger: #ef4444;
    --danger-bg: #fee2e2;
    --info: #06b6d4;
    --info-bg: #cffafe;

    --bg: #f5f6fb;
    --bg-subtle: #eef0f7;
    --surface: #ffffff;
    --surface-2: #fafbff;
    --border: rgba(102,126,234,.12);
    --border-strong: rgba(102,126,234,.22);

    --text: #1f2937;
    --text-muted: #6b7280;
    --text-light: #9ca3af;

    --radius-sm: 10px;
    --radius: 14px;
    --radius-lg: 20px;
    --radius-xl: 28px;

    --shadow-sm: 0 1px 3px rgba(16,24,40,.04), 0 1px 2px rgba(16,24,40,.03);
    --shadow: 0 4px 20px rgba(102,126,234,.08), 0 2px 6px rgba(16,24,40,.04);
    --shadow-md: 0 10px 30px rgba(102,126,234,.12), 0 4px 12px rgba(16,24,40,.05);
    --shadow-lg: 0 20px 50px rgba(102,126,234,.18), 0 8px 20px rgba(16,24,40,.08);
    --shadow-glow: 0 0 0 1px rgba(102,126,234,.1), 0 8px 28px rgba(102,126,234,.22);

    --spring: cubic-bezier(.34,1.56,.64,1);
    --ease: cubic-bezier(.4,0,.2,1);

    --sidebar-width: 260px;
    --topbar-height: 68px;
}

* { margin:0; padding:0; box-sizing:border-box; }

html { scroll-behavior:smooth; }

body {
    font-family:'Heebo','Segoe UI',Tahoma,sans-serif;
    background:var(--bg);
    color:var(--text);
    direction:rtl;
    min-height:100vh;
    overflow-x:hidden;
    position:relative;
}

/* Decorative background orbs */
body::before {
    content:'';
    position:fixed;
    inset:0;
    background:
        radial-gradient(circle at 15% 20%, rgba(102,126,234,.08) 0%, transparent 40%),
        radial-gradient(circle at 85% 80%, rgba(118,75,162,.06) 0%, transparent 40%),
        radial-gradient(circle at 50% 50%, rgba(240,147,251,.04) 0%, transparent 50%);
    pointer-events:none;
    z-index:0;
}

/* ============================================================
   LAYOUT · SIDEBAR + TOPBAR
   ============================================================ */

.app-shell {
    display:flex;
    min-height:100vh;
    position:relative;
    z-index:1;
}

/* -------------- SIDEBAR (right in RTL) -------------- */
.sidebar {
    position:fixed;
    top:0;
    right:0;
    width:var(--sidebar-width);
    height:100vh;
    background:var(--surface);
    border-left:1px solid var(--border);
    box-shadow:-4px 0 24px rgba(102,126,234,.04);
    display:flex;
    flex-direction:column;
    z-index:100;
    transition:transform .35s var(--ease);
}

.sidebar-brand {
    display:flex;
    align-items:center;
    gap:12px;
    padding:20px 24px;
    border-bottom:1px solid var(--border);
    text-decoration:none;
    color:var(--text);
}
.sidebar-brand .brand-logo {
    width:42px;height:42px;
    background:var(--gradient);
    border-radius:12px;
    display:flex;align-items:center;justify-content:center;
    color:#fff;font-size:1.3rem;
    box-shadow:var(--shadow-glow);
}
.sidebar-brand .brand-logo img { width:100%; height:100%; object-fit:contain; border-radius:12px; }
.sidebar-brand h1 {
    font-size:1.25rem;
    font-weight:800;
    background:var(--gradient);
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;
    background-clip:text;
    letter-spacing:-.3px;
}
.sidebar-brand small { font-size:.72rem; color:var(--text-muted); font-weight:500; display:block; margin-top:2px; }

.sidebar-nav {
    flex:1;
    padding:16px 12px;
    overflow-y:auto;
    scrollbar-width:thin;
}
.sidebar-nav::-webkit-scrollbar { width:4px; }
.sidebar-nav::-webkit-scrollbar-thumb { background:var(--border-strong); border-radius:4px; }

.nav-section-label {
    padding:12px 16px 6px;
    font-size:.7rem;
    font-weight:700;
    color:var(--text-light);
    text-transform:uppercase;
    letter-spacing:.6px;
}

.nav-link-item {
    display:flex;
    align-items:center;
    gap:12px;
    padding:11px 16px;
    margin-bottom:2px;
    border-radius:var(--radius-sm);
    color:var(--text-muted);
    text-decoration:none;
    font-weight:500;
    font-size:.95rem;
    transition:all .25s var(--ease);
    position:relative;
}
.nav-link-item i { font-size:1.15rem; width:22px; text-align:center; transition:transform .25s var(--spring); }
.nav-link-item:hover {
    background:var(--gradient-soft);
    color:var(--primary);
    transform:translateX(-3px);
}
.nav-link-item:hover i { transform:scale(1.15); }
.nav-link-item.active {
    background:var(--gradient);
    color:#fff;
    box-shadow:var(--shadow-glow);
}
.nav-link-item.active::before {
    content:'';
    position:absolute;
    right:-12px;
    top:50%;
    transform:translateY(-50%);
    width:4px;height:24px;
    background:#fff;
    border-radius:4px 0 0 4px;
    box-shadow:-2px 0 12px rgba(255,255,255,.4);
}
.nav-link-item .nav-badge {
    margin-right:auto;
    background:var(--danger);
    color:#fff;
    font-size:.7rem;
    padding:2px 7px;
    border-radius:10px;
    font-weight:700;
}
.nav-link-item.active .nav-badge { background:rgba(255,255,255,.25); }

.sidebar-footer {
    padding:12px;
    border-top:1px solid var(--border);
}
.user-chip {
    display:flex;
    align-items:center;
    gap:10px;
    padding:10px;
    border-radius:var(--radius-sm);
    background:var(--gradient-soft);
    cursor:pointer;
    transition:all .25s var(--ease);
    text-decoration:none;
    color:var(--text);
}
.user-chip:hover { background:var(--gradient); color:#fff; transform:translateY(-2px); box-shadow:var(--shadow-glow); }
.user-chip:hover .user-chip-name,
.user-chip:hover .user-chip-role { color:#fff; }
.user-chip-avatar {
    width:38px;height:38px;
    background:var(--gradient);
    border-radius:10px;
    display:flex;align-items:center;justify-content:center;
    color:#fff;font-weight:700;
    flex-shrink:0;
    border:2px solid #fff;
    box-shadow:var(--shadow-sm);
    overflow:hidden;
}
.user-chip-avatar img { width:100%;height:100%;object-fit:cover;border-radius:8px; }
.user-chip-info { flex:1; min-width:0; }
.user-chip-name { font-weight:600; font-size:.88rem; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; transition:color .2s; }
.user-chip-role { font-size:.72rem; color:var(--text-muted); transition:color .2s; }

/* -------------- TOPBAR -------------- */
.topbar {
    position:sticky;
    top:0;
    height:var(--topbar-height);
    background:rgba(255,255,255,.9);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
    border-bottom:1px solid var(--border);
    z-index:50;
    display:flex;
    align-items:center;
    padding:0 28px;
    gap:16px;
}

.topbar-toggle {
    display:none;
    width:40px;height:40px;
    border:none;
    background:var(--gradient-soft);
    color:var(--primary);
    border-radius:10px;
    cursor:pointer;
    font-size:1.2rem;
    transition:all .2s;
}
.topbar-toggle:hover { background:var(--gradient); color:#fff; }

.breadcrumb-nav {
    display:flex;
    align-items:center;
    gap:8px;
    font-size:.88rem;
    color:var(--text-muted);
    flex-shrink:0;
}
.breadcrumb-nav a { color:var(--text-muted); text-decoration:none; transition:color .2s; }
.breadcrumb-nav a:hover { color:var(--primary); }
.breadcrumb-nav .sep { color:var(--text-light); font-size:.7rem; }
.breadcrumb-nav .current { color:var(--text); font-weight:600; }

.global-search {
    flex:1;
    max-width:480px;
    margin:0 auto 0 0;
    position:relative;
}
.global-search input {
    width:100%;
    padding:10px 42px 10px 16px;
    border:1.5px solid var(--border);
    border-radius:12px;
    background:var(--surface-2);
    font-family:inherit;
    font-size:.92rem;
    transition:all .25s var(--ease);
    color:var(--text);
}
.global-search input:focus {
    outline:none;
    border-color:var(--primary);
    background:#fff;
    box-shadow:0 0 0 4px rgba(102,126,234,.1);
}
.global-search .search-icon {
    position:absolute;
    right:14px;
    top:50%;
    transform:translateY(-50%);
    color:var(--text-muted);
    pointer-events:none;
}
.global-search .search-kbd {
    position:absolute;
    left:10px;
    top:50%;
    transform:translateY(-50%);
    font-size:.7rem;
    padding:3px 7px;
    background:var(--bg-subtle);
    border:1px solid var(--border);
    border-radius:6px;
    color:var(--text-muted);
    font-weight:600;
    pointer-events:none;
}

.topbar-actions {
    display:flex;
    align-items:center;
    gap:10px;
}
.topbar-btn {
    width:40px;height:40px;
    border:none;
    background:var(--surface-2);
    border:1px solid var(--border);
    color:var(--text-muted);
    border-radius:10px;
    cursor:pointer;
    font-size:1.1rem;
    transition:all .2s var(--ease);
    position:relative;
    display:flex;align-items:center;justify-content:center;
    text-decoration:none;
}
.topbar-btn:hover { background:var(--gradient); color:#fff; border-color:transparent; transform:translateY(-2px); box-shadow:var(--shadow-glow); }
.topbar-btn .dot {
    position:absolute;
    top:8px;right:8px;
    width:8px;height:8px;
    background:var(--danger);
    border-radius:50%;
    border:2px solid var(--surface);
}

.credits-pill {
    display:flex;
    align-items:center;
    gap:8px;
    padding:8px 14px;
    background:var(--gradient);
    color:#fff;
    border-radius:20px;
    font-weight:700;
    font-size:.88rem;
    box-shadow:var(--shadow-glow);
    transition:transform .25s var(--spring);
    text-decoration:none;
}
.credits-pill:hover { transform:translateY(-2px) scale(1.05); color:#fff; }
.credits-pill i { font-size:1.05rem; }

/* -------------- MAIN CONTENT AREA -------------- */
.main-wrap {
    flex:1;
    margin-right:var(--sidebar-width);
    min-width:0;
    display:flex;
    flex-direction:column;
    position:relative;
}

.page-content {
    padding:28px 32px 64px;
    flex:1;
}

.page-header {
    display:flex;
    align-items:center;
    gap:16px;
    margin-bottom:28px;
    flex-wrap:wrap;
}
.page-header .page-icon-wrap {
    width:56px;height:56px;
    background:var(--gradient);
    border-radius:16px;
    display:flex;align-items:center;justify-content:center;
    color:#fff;font-size:1.6rem;
    box-shadow:var(--shadow-glow);
    flex-shrink:0;
}
.page-header .page-title {
    font-size:1.75rem;
    font-weight:800;
    color:var(--text);
    letter-spacing:-.5px;
    line-height:1.2;
}
.page-header .page-subtitle {
    color:var(--text-muted);
    font-size:.95rem;
    margin-top:2px;
}
.page-header .page-actions {
    margin-right:auto;
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}

/* ============================================================
   CARDS · BUTTONS · FORMS
   ============================================================ */

.card-polished {
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:var(--radius-lg);
    padding:24px;
    box-shadow:var(--shadow);
    transition:all .3s var(--ease);
}
.card-polished:hover { box-shadow:var(--shadow-md); transform:translateY(-2px); }

.card-header-row {
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:20px;
    gap:12px;
    flex-wrap:wrap;
}
.card-header-row h2, .card-header-row h3, .card-header-row h4 {
    font-weight:700;
    color:var(--text);
    display:flex;align-items:center;gap:10px;
    letter-spacing:-.3px;
    margin:0;
}
.card-header-row h4 { font-size:1.1rem; }
.card-header-row i { color:var(--primary); }

/* Stat cards */
.stat-grid {
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
    gap:20px;
    margin-bottom:28px;
}
.stat-card-v2 {
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:var(--radius-lg);
    padding:22px;
    box-shadow:var(--shadow);
    transition:all .3s var(--ease);
    position:relative;
    overflow:hidden;
    cursor:pointer;
}
.stat-card-v2::before {
    content:'';
    position:absolute;
    inset:0;
    background:var(--gradient);
    opacity:0;
    transition:opacity .3s;
    z-index:0;
}
.stat-card-v2:hover { transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:transparent; }
.stat-card-v2:hover::before { opacity:1; }
.stat-card-v2:hover .stat-icon-v2,
.stat-card-v2:hover .stat-label-v2,
.stat-card-v2:hover .stat-value-v2,
.stat-card-v2:hover .stat-trend { color:#fff; }
.stat-card-v2:hover .stat-icon-v2 { background:rgba(255,255,255,.22); }
.stat-card-v2 > * { position:relative; z-index:1; }
.stat-card-v2 .stat-top {
    display:flex;justify-content:space-between;align-items:flex-start;
    margin-bottom:14px;
}
.stat-icon-v2 {
    width:46px;height:46px;
    border-radius:12px;
    background:var(--gradient-soft);
    color:var(--primary);
    display:flex;align-items:center;justify-content:center;
    font-size:1.3rem;
    transition:all .3s;
}
.stat-card-v2.v-success .stat-icon-v2 { background:var(--success-bg); color:var(--success); }
.stat-card-v2.v-warning .stat-icon-v2 { background:var(--warning-bg); color:var(--warning); }
.stat-card-v2.v-danger .stat-icon-v2 { background:var(--danger-bg); color:var(--danger); }
.stat-card-v2.v-info .stat-icon-v2 { background:var(--info-bg); color:var(--info); }

.stat-value-v2 {
    font-size:2.1rem;
    font-weight:800;
    color:var(--text);
    line-height:1;
    letter-spacing:-1px;
    transition:color .3s;
}
.stat-label-v2 {
    color:var(--text-muted);
    font-weight:600;
    font-size:.88rem;
    margin-top:6px;
    transition:color .3s;
}
.stat-trend {
    font-size:.78rem;
    font-weight:700;
    margin-top:8px;
    display:inline-flex;
    align-items:center;
    gap:4px;
    color:var(--success);
    transition:color .3s;
}
.stat-trend.negative { color:var(--danger); }

/* Buttons */
.btn-polished {
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 20px;
    border:none;
    border-radius:12px;
    font-family:inherit;
    font-weight:600;
    font-size:.92rem;
    cursor:pointer;
    text-decoration:none;
    transition:all .25s var(--ease);
    white-space:nowrap;
}
.btn-primary-p {
    background:var(--gradient);
    color:#fff;
    box-shadow:var(--shadow-glow);
}
.btn-primary-p:hover { transform:translateY(-2px); box-shadow:var(--shadow-md); color:#fff; }
.btn-outline-p {
    background:var(--surface);
    color:var(--primary);
    border:1.5px solid var(--border-strong);
}
.btn-outline-p:hover { background:var(--gradient-soft); border-color:var(--primary); color:var(--primary); }
.btn-ghost-p {
    background:transparent;
    color:var(--text-muted);
    padding:8px 14px;
}
.btn-ghost-p:hover { background:var(--gradient-soft); color:var(--primary); }
.btn-danger-p {
    background:var(--danger);
    color:#fff;
}
.btn-danger-p:hover { background:#dc2626; color:#fff; transform:translateY(-2px); }
.btn-success-p { background:var(--success); color:#fff; }
.btn-success-p:hover { background:#059669; color:#fff; transform:translateY(-2px); }
.btn-sm-p { padding:6px 12px; font-size:.82rem; }
.btn-lg-p { padding:13px 26px; font-size:1rem; }
.btn-icon-only { padding:9px; width:38px; height:38px; justify-content:center; }

/* Forms */
.form-label-p {
    display:block;
    font-weight:600;
    font-size:.88rem;
    color:var(--text);
    margin-bottom:6px;
}
.form-input-p,
.form-select-p,
.form-textarea-p {
    width:100%;
    padding:11px 14px;
    border:1.5px solid var(--border);
    border-radius:12px;
    font-family:inherit;
    font-size:.95rem;
    background:var(--surface);
    color:var(--text);
    transition:all .25s var(--ease);
}
.form-input-p:focus,
.form-select-p:focus,
.form-textarea-p:focus {
    outline:none;
    border-color:var(--primary);
    box-shadow:0 0 0 4px rgba(102,126,234,.1);
}
.form-textarea-p { resize:vertical; min-height:100px; }

.input-group-p {
    position:relative;
    margin-bottom:16px;
}
.input-group-p .input-icon {
    position:absolute;
    right:14px;
    top:50%;
    transform:translateY(-50%);
    color:var(--text-muted);
    pointer-events:none;
}
.input-group-p input,
.input-group-p select {
    padding-right:40px;
}

/* Tables */
.table-polished {
    width:100%;
    border-collapse:collapse;
    background:var(--surface);
    border-radius:var(--radius);
    overflow:hidden;
}
.table-polished thead tr {
    background:var(--gradient-soft);
}
.table-polished th {
    padding:14px 16px;
    text-align:right;
    font-weight:700;
    color:var(--text);
    font-size:.85rem;
    border-bottom:1px solid var(--border);
}
.table-polished td {
    padding:14px 16px;
    border-bottom:1px solid var(--border);
    font-size:.92rem;
    color:var(--text);
}
.table-polished tbody tr { transition:background .2s; }
.table-polished tbody tr:hover { background:var(--gradient-soft); }
.table-polished tbody tr:last-child td { border-bottom:none; }
.table-wrap {
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:var(--radius-lg);
    overflow:hidden;
    box-shadow:var(--shadow);
}

/* Badges */
.badge-p {
    display:inline-flex;
    align-items:center;
    gap:5px;
    padding:4px 10px;
    border-radius:20px;
    font-size:.75rem;
    font-weight:700;
}
.badge-success { background:var(--success-bg); color:#065f46; }
.badge-warning { background:var(--warning-bg); color:#92400e; }
.badge-danger { background:var(--danger-bg); color:#991b1b; }
.badge-info { background:var(--info-bg); color:#155e75; }
.badge-neutral { background:var(--bg-subtle); color:var(--text); }
.badge-p .dot-indicator {
    width:7px;height:7px;border-radius:50%;background:currentColor;
}

/* Alerts */
.alert-p {
    padding:14px 18px;
    border-radius:12px;
    display:flex;
    align-items:flex-start;
    gap:12px;
    margin-bottom:20px;
    border:1px solid transparent;
    font-weight:500;
}
.alert-p i { font-size:1.15rem; flex-shrink:0; margin-top:1px; }
.alert-p-success { background:var(--success-bg); color:#065f46; border-color:rgba(16,185,129,.2); }
.alert-p-warning { background:var(--warning-bg); color:#92400e; border-color:rgba(245,158,11,.2); }
.alert-p-danger { background:var(--danger-bg); color:#991b1b; border-color:rgba(239,68,68,.2); }
.alert-p-info { background:var(--info-bg); color:#155e75; border-color:rgba(6,182,212,.2); }

/* Empty state */
.empty-state {
    text-align:center;
    padding:48px 20px;
    color:var(--text-muted);
}
.empty-state i {
    font-size:3.5rem;
    color:var(--border-strong);
    margin-bottom:12px;
    display:block;
}
.empty-state h3 { font-weight:700; color:var(--text); margin-bottom:6px; }
.empty-state p { font-size:.9rem; }

/* Quick actions */
.quick-actions-grid {
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
    gap:14px;
    margin-bottom:28px;
}
.quick-action-card {
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:var(--radius);
    padding:20px;
    text-decoration:none;
    color:var(--text);
    display:flex;
    align-items:center;
    gap:14px;
    transition:all .3s var(--ease);
    position:relative;
    overflow:hidden;
}
.quick-action-card::before {
    content:'';
    position:absolute;
    top:0;right:0;
    width:80px;height:80px;
    background:var(--gradient);
    opacity:.08;
    border-radius:50%;
    transform:translate(40%, -40%);
    transition:all .4s var(--spring);
}
.quick-action-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:var(--primary); color:var(--text); }
.quick-action-card:hover::before { transform:translate(0,0) scale(6); opacity:.15; }
.quick-action-card .qa-icon {
    width:46px;height:46px;
    background:var(--gradient);
    border-radius:12px;
    display:flex;align-items:center;justify-content:center;
    color:#fff;font-size:1.25rem;
    flex-shrink:0;
    position:relative;
    z-index:1;
}
.quick-action-card .qa-text { position:relative; z-index:1; }
.quick-action-card .qa-title { font-weight:700; font-size:.95rem; }
.quick-action-card .qa-desc { font-size:.78rem; color:var(--text-muted); margin-top:2px; }

/* Chart container */
.chart-box {
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:var(--radius-lg);
    padding:24px;
    box-shadow:var(--shadow);
    min-height:320px;
}
.chart-box canvas { max-height:280px; }

/* Toolbar (search/filters/actions on list pages) */
.toolbar {
    display:flex;
    align-items:center;
    gap:12px;
    padding:16px;
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:var(--radius);
    margin-bottom:18px;
    flex-wrap:wrap;
}
.toolbar-search {
    flex:1;
    min-width:200px;
    position:relative;
}
.toolbar-search input {
    width:100%;
    padding:9px 38px 9px 14px;
    border:1.5px solid var(--border);
    border-radius:10px;
    background:var(--surface-2);
    font-family:inherit;
    font-size:.9rem;
    transition:all .25s var(--ease);
}
.toolbar-search input:focus { outline:none; border-color:var(--primary); background:#fff; box-shadow:0 0 0 3px rgba(102,126,234,.1); }
.toolbar-search i { position:absolute; right:12px; top:50%; transform:translateY(-50%); color:var(--text-muted); }
.toolbar-filter {
    padding:9px 14px;
    border:1.5px solid var(--border);
    border-radius:10px;
    background:var(--surface-2);
    font-family:inherit;
    font-size:.9rem;
    cursor:pointer;
    transition:all .2s;
}
.toolbar-filter:focus, .toolbar-filter:hover { border-color:var(--primary); }

/* Pagination */
.pagination-wrap {
    display:flex;
    justify-content:center;
    align-items:center;
    gap:6px;
    padding:20px 0 8px;
}
.page-btn {
    min-width:38px; height:38px;
    border:1.5px solid var(--border);
    background:var(--surface);
    color:var(--text);
    border-radius:10px;
    cursor:pointer;
    font-weight:600;
    transition:all .2s;
    display:flex;align-items:center;justify-content:center;
    text-decoration:none;
}
.page-btn:hover:not(:disabled):not(.active) { border-color:var(--primary); color:var(--primary); }
.page-btn.active { background:var(--gradient); color:#fff; border-color:transparent; box-shadow:var(--shadow-glow); }
.page-btn:disabled { opacity:.4; cursor:not-allowed; }

/* Dropdown (sidebar group expand) */
.nav-group-toggle {
    display:flex;
    align-items:center;
    gap:12px;
    padding:11px 16px;
    margin-bottom:2px;
    border-radius:var(--radius-sm);
    color:var(--text-muted);
    font-weight:500;
    font-size:.95rem;
    cursor:pointer;
    transition:all .2s;
    user-select:none;
}
.nav-group-toggle:hover { background:var(--gradient-soft); color:var(--primary); }
.nav-group-toggle i.chev { margin-right:auto; transition:transform .25s; font-size:.9rem; }
.nav-group.open .nav-group-toggle i.chev { transform:rotate(90deg); }
.nav-group-items { display:none; padding-right:12px; }
.nav-group.open .nav-group-items { display:block; }

/* Mobile overlay */
.sidebar-overlay {
    display:none;
    position:fixed;
    inset:0;
    background:rgba(16,24,40,.5);
    backdrop-filter:blur(4px);
    z-index:99;
    opacity:0;
    transition:opacity .25s;
}
.sidebar-overlay.visible { display:block; opacity:1; }

/* Loading overlay */
.loading-overlay {
    display:none;
    position:fixed;
    inset:0;
    background:rgba(255,255,255,.85);
    backdrop-filter:blur(6px);
    z-index:9999;
    align-items:center;
    justify-content:center;
}
.loading-overlay.visible { display:flex; }
.loading-spinner {
    width:48px;height:48px;
    border:4px solid var(--bg-subtle);
    border-top-color:var(--primary);
    border-radius:50%;
    animation:spin 1s linear infinite;
}
@keyframes spin { to { transform:rotate(360deg); } }

/* Footer */
.app-footer {
    padding:20px 32px;
    border-top:1px solid var(--border);
    background:var(--surface);
    color:var(--text-muted);
    font-size:.85rem;
    text-align:center;
}
.app-footer strong {
    background:var(--gradient);
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;
    background-clip:text;
    font-weight:800;
}

/* Scrollbar */
::-webkit-scrollbar { width:10px; height:10px; }
::-webkit-scrollbar-track { background:var(--bg-subtle); }
::-webkit-scrollbar-thumb { background:var(--border-strong); border-radius:5px; }
::-webkit-scrollbar-thumb:hover { background:var(--primary); }

/* Utilities */
.text-muted-p { color:var(--text-muted); }
.text-primary-p { color:var(--primary); }
.text-success-p { color:var(--success); }
.text-danger-p { color:var(--danger); }
.fw-700 { font-weight:700; }
.fw-800 { font-weight:800; }
.gap-8 { gap:8px; } .gap-12 { gap:12px; } .gap-16 { gap:16px; }
.mt-8 { margin-top:8px; } .mt-16 { margin-top:16px; } .mt-24 { margin-top:24px; }
.mb-8 { margin-bottom:8px; } .mb-16 { margin-bottom:16px; } .mb-24 { margin-bottom:24px; }
.d-flex { display:flex; } .align-center { align-items:center; } .justify-between { justify-content:space-between; }
.flex-wrap { flex-wrap:wrap; }

/* Animations */
@keyframes fadeInUp {
    from { opacity:0; transform:translateY(12px); }
    to { opacity:1; transform:translateY(0); }
}
.fade-in-up { animation:fadeInUp .5s var(--ease) both; }

/* Modal polish */
.modal-content {
    border:none;
    border-radius:var(--radius-lg);
    box-shadow:var(--shadow-lg);
    overflow:hidden;
}
.modal-header {
    background:var(--gradient-soft);
    border-bottom:1px solid var(--border);
    padding:18px 24px;
}
.modal-header .modal-title {
    font-weight:700;
    color:var(--text);
    display:flex;align-items:center;gap:10px;
}
.modal-header .modal-title i { color:var(--primary); }
.modal-body { padding:24px; }
.modal-footer { padding:16px 24px; border-top:1px solid var(--border); }

/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 992px) {
    .sidebar {
        transform:translateX(100%);
        box-shadow:var(--shadow-lg);
    }
    .sidebar.open { transform:translateX(0); }
    .main-wrap { margin-right:0; }
    .topbar-toggle { display:flex; align-items:center; justify-content:center; }
    .global-search { max-width:none; }
}

@media (max-width: 768px) {
    .topbar { padding:0 16px; gap:10px; }
    .page-content { padding:20px 16px 50px; }
    .page-header .page-title { font-size:1.4rem; }
    .page-header .page-icon-wrap { width:48px; height:48px; font-size:1.3rem; }
    .stat-grid { grid-template-columns:1fr 1fr; gap:12px; }
    .stat-card-v2 { padding:16px; }
    .stat-value-v2 { font-size:1.6rem; }
    .credits-pill { padding:6px 12px; font-size:.82rem; }
    .breadcrumb-nav { display:none; }
    .quick-actions-grid { grid-template-columns:1fr 1fr; }
    .toolbar { padding:12px; gap:8px; }
    .table-polished { font-size:.82rem; }
    .table-polished th, .table-polished td { padding:10px 8px; }
}

@media (max-width: 480px) {
    .stat-grid { grid-template-columns:1fr; }
    .quick-actions-grid { grid-template-columns:1fr; }
    .page-header .page-actions { width:100%; margin-right:0; }
    .btn-polished { flex:1; justify-content:center; }
}

/* Print */
@media print {
    .sidebar, .topbar, .app-footer, .page-actions { display:none !important; }
    .main-wrap { margin-right:0 !important; }
    body::before { display:none; }
}
