:root{
    --primary-dark:#0f172a;
    --primary-blue:#2563eb;
    --primary-violet:#7c3aed;
    --accent-orange:#f97316;
    --accent-gold:#f59e0b;
    --accent-cyan:#06b6d4;
    --success:#10b981;
    --bg:#f3f6fb;
    --surface:#fff;
    --border:#e5e7eb;
    --text:#111827;
    --muted:#64748b;
    --shadow:0 18px 45px rgba(15,23,42,.1);
}
*{box-sizing:border-box}
body{
    margin:0;
    font-family:"Noto Kufi Arabic",Tahoma,Arial,sans-serif;
    background:
        radial-gradient(circle at 12% 0,rgba(6,182,212,.12),transparent 30%),
        linear-gradient(180deg,#f8fbff 0,#f3f6fb 42%,#eef3f9 100%);
    color:var(--text);
    min-height:100vh;
}
html[dir=rtl] body{direction:rtl;text-align:right}
a{color:var(--primary-blue)}
a,button,input,select,textarea{font-family:inherit;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease,color .18s ease,transform .18s ease}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
    outline:3px solid rgba(249,115,22,.42);
    outline-offset:3px;
}
.app-header{
    color:#fff;
    padding:16px;
    background:
        linear-gradient(135deg,rgba(15,23,42,.98) 0%,rgba(37,99,235,.96) 58%,rgba(124,58,237,.92) 100%);
    box-shadow:0 14px 32px rgba(15,23,42,.22);
    position:sticky;
    top:0;
    z-index:20;
}
.header-shell{
    max-width:1240px;
    margin:0 auto;
    display:flex;
    align-items:center;
    gap:16px;
}
.brand{
    display:inline-flex;
    align-items:center;
    gap:11px;
    color:#fff;
    text-decoration:none;
    flex:0 0 auto;
    min-width:max-content;
}
.brand-mark{
    width:44px;
    height:44px;
    display:grid;
    place-items:center;
    direction:ltr;
    color:#0f172a;
    font-weight:900;
    letter-spacing:0;
    border-radius:14px;
    background:linear-gradient(135deg,#fff 0,#dff7ff 46%,#fbbf24 100%);
    box-shadow:0 10px 22px rgba(0,0,0,.18),inset 0 0 0 1px rgba(255,255,255,.7);
}
.brand-copy{display:flex;flex-direction:column;gap:2px;line-height:1.1}
.brand-copy strong{font-size:24px;letter-spacing:0;direction:ltr;text-align:left}
.brand-copy small{font-size:11px;color:rgba(255,255,255,.76);white-space:nowrap}
.main-nav{
    display:flex;
    align-items:center;
    gap:8px;
    flex:1 1 auto;
    min-width:0;
    overflow-x:auto;
    scrollbar-width:thin;
    scrollbar-color:rgba(255,255,255,.42) transparent;
    padding:6px 2px;
}
.main-nav::-webkit-scrollbar{height:6px}
.main-nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.38);border-radius:999px}
.nav-pill{
    color:rgba(255,255,255,.88);
    text-decoration:none;
    border:1px solid rgba(255,255,255,.16);
    background:rgba(255,255,255,.08);
    border-radius:999px;
    padding:10px 14px;
    font-weight:700;
    font-size:14px;
    white-space:nowrap;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.nav-pill:hover{
    color:#fff;
    background:rgba(255,255,255,.16);
    border-color:rgba(255,255,255,.32);
    transform:translateY(-1px);
}
.nav-pill.active{
    color:#0f172a;
    background:linear-gradient(135deg,#fff 0,#e0f2fe 48%,#fbbf24 100%);
    border-color:rgba(255,255,255,.72);
    box-shadow:0 10px 22px rgba(2,6,23,.2),inset 0 -3px 0 rgba(249,115,22,.42);
}
.header-actions{
    display:flex;
    align-items:center;
    gap:10px;
    flex:0 0 auto;
}
.language-switcher{
    position:relative;
    display:inline-flex;
    align-items:center;
    font-family:inherit;
}
.language-trigger{
    height:38px;
    display:inline-flex;
    align-items:center;
    gap:7px;
    color:#fff;
    border:1px solid rgba(255,255,255,.24);
    border-radius:999px;
    background:rgba(255,255,255,.14);
    padding:5px 9px 5px 11px;
    cursor:pointer;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 10px 20px rgba(15,23,42,.14);
    backdrop-filter:blur(10px);
}
.language-trigger:hover,.language-dropdown:focus-within .language-trigger{
    background:rgba(255,255,255,.2);
    border-color:rgba(255,255,255,.38);
}
.language-icon{
    width:26px;
    height:26px;
    display:grid;
    place-items:center;
    border-radius:999px;
    color:#0f172a;
    background:linear-gradient(135deg,#fff,#dff7ff);
}
.language-icon svg{width:15px;height:15px;fill:currentColor}
.language-code{
    direction:ltr;
    min-width:22px;
    text-align:center;
    font-size:12px;
    font-weight:900;
    letter-spacing:0;
}
.language-caret{
    font-size:10px;
    color:rgba(255,255,255,.74);
    line-height:1;
    transform:translateY(-1px);
}
.language-toggle{display:flex;align-items:center;gap:4px}
.icon-btn{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:999px}
.language-dropdown{position:relative}
.language-menu{
    position:absolute;
    inset-block-start:calc(100% + 10px);
    inset-inline-end:0;
    width:168px;
    display:grid;
    gap:4px;
    padding:7px;
    border:1px solid rgba(226,232,240,.95);
    border-radius:12px;
    background:rgba(255,255,255,.98);
    box-shadow:0 18px 42px rgba(15,23,42,.2);
    opacity:0;
    visibility:hidden;
    transform:translateY(-4px);
    pointer-events:none;
    z-index:50;
}
.language-dropdown:hover .language-menu,.language-dropdown:focus-within .language-menu{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
    pointer-events:auto;
}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.language-option{
    display:flex;
    align-items:center;
    gap:9px;
    color:#1e293b;
    text-decoration:none;
    border-radius:9px;
    padding:9px 10px;
    font-weight:700;
    font-size:13px;
    border:1px solid transparent;
}
.language-option:hover{background:#f8fafc;color:#0f172a;border-color:#e2e8f0}
.language-option.active{
    background:#eff6ff;
    color:#1d4ed8;
    border-color:#bfdbfe;
    box-shadow:inset 3px 0 0 var(--accent-orange);
}
.language-badge{
    direction:ltr;
    min-width:31px;
    height:24px;
    display:inline-grid;
    place-items:center;
    border-radius:999px;
    background:#e2e8f0;
    color:#334155;
    font-size:10px;
    font-weight:900;
}
.language-option.active .language-badge{
    background:linear-gradient(135deg,var(--primary-blue),var(--accent-cyan));
    color:#fff;
}
.logout-form{margin:0}
.logout-button{
    color:#fff;
    border:0;
    border-radius:999px;
    background:linear-gradient(135deg,#fb923c 0,#ef4444 100%);
    padding:10px 15px;
    cursor:pointer;
    font:inherit;
    font-weight:800;
    white-space:nowrap;
    box-shadow:0 10px 22px rgba(239,68,68,.26);
}
.logout-button:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(239,68,68,.34)}
.wrap{max-width:1180px;margin:28px auto;padding:0 18px}
.panel{
    background:rgba(255,255,255,.98);
    border:1px solid rgba(226,232,240,.95);
    border-radius:8px;
    padding:20px;
    margin-bottom:18px;
    overflow-x:auto;
    box-shadow:var(--shadow);
}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
table{width:100%;border-collapse:collapse;background:#fff;min-width:720px}
th,td{padding:11px 12px;border-bottom:1px solid #e4e7ee;text-align:right;vertical-align:top}
th{background:#edf5ff;color:#1e293b;font-weight:800}
tr:hover td{background:#f8fbff}
label{display:block;margin-top:12px;font-weight:800;color:#1f2937}
input,select,textarea{width:100%;border:1px solid #cbd5e1;border-radius:8px;padding:10px 11px;background:#fff;color:var(--text);font:inherit}
input:focus,select:focus,textarea:focus{border-color:var(--primary-blue);box-shadow:0 0 0 4px rgba(37,99,235,.12)}
textarea{min-height:90px}
.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:14px}
.button{
    display:inline-block;
    background:linear-gradient(135deg,var(--primary-blue),var(--accent-cyan));
    color:#fff;
    text-decoration:none;
    border:0;
    border-radius:8px;
    padding:10px 14px;
    cursor:pointer;
    font-weight:800;
    box-shadow:0 10px 20px rgba(37,99,235,.18);
}
.button:hover{transform:translateY(-1px);box-shadow:0 14px 26px rgba(37,99,235,.24)}
.secondary{background:linear-gradient(135deg,#64748b,#475569)}
.danger{color:#b42318}
.ok{background:#ecfdf5;border:1px solid #a7f3d0;color:#065f46;padding:12px 14px;border-radius:8px;margin-bottom:18px}
.muted{color:var(--muted)}
.top-spacer{margin-inline-start:auto}
.guest-language{display:flex;justify-content:flex-end;margin:18px 0}
.guest-language .language-trigger{color:#172033;background:rgba(255,255,255,.9);border-color:#cdd5df;box-shadow:0 10px 24px rgba(15,23,42,.08)}
.guest-language .language-caret{color:#64748b}
.badge{display:inline-block;border-radius:999px;padding:3px 9px;font-size:12px;font-weight:800}
.badge.active,.badge.posted,.badge.paid{background:#dcfce7;color:#166534}
.badge.partial,.badge.pending,.badge.draft{background:#e0f2fe;color:#075985}
.badge.cancelled,.badge.overdue{background:#fee2e2;color:#991b1b}
.badge.inactive,.badge.suspended{background:#fef3c7;color:#92400e}
.badge.archived{background:#e5e7eb;color:#374151}
.crumbs{color:var(--muted);margin-bottom:12px;font-size:14px}
.filters{align-items:end}
.pre{white-space:pre-wrap;background:#0f172a;color:#e2e8f0;border-radius:8px;padding:12px;overflow:auto;direction:ltr;text-align:left}
.footer{text-align:center;color:var(--muted);font-size:12px;padding:20px}
.dashboard-hero{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(260px,360px);
    gap:18px;
    align-items:stretch;
    margin-bottom:22px;
}
.dashboard-hero-copy{
    position:relative;
    overflow:hidden;
    border-radius:10px;
    padding:28px;
    color:#fff;
    background:
        linear-gradient(135deg,rgba(15,23,42,.97) 0%,rgba(37,99,235,.92) 52%,rgba(6,182,212,.86) 100%);
    box-shadow:0 20px 46px rgba(15,23,42,.16);
}
.dashboard-hero-copy:after{
    content:"";
    position:absolute;
    inset-block-start:-80px;
    inset-inline-start:-70px;
    width:220px;
    height:220px;
    border:1px solid rgba(255,255,255,.18);
    border-radius:50%;
}
.dashboard-kicker,.section-kicker{
    display:inline-flex;
    color:var(--accent-orange);
    font-size:12px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:0;
    margin-bottom:7px;
}
.dashboard-hero h1{
    margin:0 0 10px;
    font-size:34px;
    line-height:1.25;
}
.dashboard-welcome{
    margin:0 0 8px;
    font-weight:800;
    font-size:18px;
}
.dashboard-summary{
    margin:0;
    max-width:720px;
    color:rgba(255,255,255,.86);
    line-height:1.9;
}
.dashboard-profile-card{
    border:1px solid rgba(226,232,240,.95);
    border-radius:10px;
    background:#fff;
    padding:22px;
    box-shadow:var(--shadow);
    display:flex;
    flex-direction:column;
    gap:8px;
}
.profile-label{color:var(--muted);font-size:13px;font-weight:800}
.dashboard-profile-card strong{font-size:24px;color:var(--primary-dark)}
.dashboard-profile-card>span:last-of-type{color:#334155;line-height:1.7}
.profile-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:auto}
.profile-stats div{
    border-radius:8px;
    background:#f8fafc;
    border:1px solid #e2e8f0;
    padding:12px;
}
.profile-stats b{display:block;font-size:22px;color:var(--primary-blue)}
.profile-stats small{color:var(--muted);font-weight:700}
.dashboard-section{margin:22px 0}
.section-heading{
    display:flex;
    justify-content:space-between;
    gap:16px;
    align-items:end;
    margin-bottom:14px;
}
.section-heading h2{margin:0;font-size:22px;color:var(--primary-dark)}
.section-heading p{margin:0;max-width:520px;color:var(--muted);line-height:1.8}
.dashboard-grid,.showrooms-grid,.quick-actions-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:14px;
}
.metric-grid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.metric-card,.showroom-card,.quick-action-card{
    position:relative;
    overflow:hidden;
    border:1px solid rgba(226,232,240,.95);
    border-radius:10px;
    background:#fff;
    box-shadow:0 14px 34px rgba(15,23,42,.08);
}
.metric-card{
    display:flex;
    gap:13px;
    align-items:flex-start;
    padding:18px;
}
.metric-card:hover,.showroom-card:hover,.quick-action-card:hover{
    transform:translateY(-2px);
    box-shadow:0 20px 44px rgba(15,23,42,.13);
}
.metric-icon,.quick-action-icon{
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    border-radius:12px;
    flex:0 0 auto;
}
.metric-icon svg,.quick-action-icon svg{width:22px;height:22px;fill:currentColor}
.metric-label{display:block;color:var(--muted);font-weight:800;font-size:13px}
.metric-card strong{display:block;font-size:28px;line-height:1.25;color:var(--primary-dark);margin:3px 0}
.metric-card p{margin:0;color:var(--muted);font-size:13px;line-height:1.7}
.accent-blue .metric-icon,.accent-blue .quick-action-icon{background:#dbeafe;color:#1d4ed8}
.accent-cyan .metric-icon,.accent-cyan .quick-action-icon{background:#cffafe;color:#0e7490}
.accent-green .metric-icon,.accent-green .quick-action-icon{background:#dcfce7;color:#15803d}
.accent-violet .metric-icon,.accent-violet .quick-action-icon{background:#ede9fe;color:#6d28d9}
.accent-gold .metric-icon,.accent-gold .quick-action-icon{background:#fef3c7;color:#b45309}
.accent-orange .metric-icon,.accent-orange .quick-action-icon{background:#ffedd5;color:#c2410c}
.accent-red .metric-icon,.accent-red .quick-action-icon{background:#fee2e2;color:#b91c1c}
.showroom-card{padding:18px}
.showroom-card-top{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:14px}
.showroom-code{
    direction:ltr;
    display:inline-flex;
    border-radius:999px;
    background:#eff6ff;
    color:#1d4ed8;
    padding:5px 10px;
    font-size:12px;
    font-weight:900;
}
.showroom-card h3{margin:0 0 8px;font-size:19px;color:var(--primary-dark)}
.showroom-card p{margin:0 0 16px;line-height:1.7}
.showroom-link{box-shadow:none}
.quick-action-card{
    display:flex;
    align-items:flex-start;
    gap:13px;
    padding:16px;
    color:var(--text);
    text-decoration:none;
}
.quick-action-card strong{display:block;color:var(--primary-dark);margin-bottom:5px}
.quick-action-card small{display:block;color:var(--muted);line-height:1.7}
.vehicles-page{display:grid;gap:18px}
.vehicles-hero{
    display:flex;
    justify-content:space-between;
    gap:18px;
    align-items:flex-end;
    border:1px solid rgba(226,232,240,.95);
    border-radius:10px;
    padding:22px;
    background:linear-gradient(135deg,#fff 0,#f8fbff 54%,#e0f2fe 100%);
    box-shadow:var(--shadow);
}
.vehicles-hero h1{margin:0 0 8px;font-size:30px;color:var(--primary-dark)}
.vehicles-hero p{margin:0;color:var(--muted);line-height:1.8}
.vehicles-create{white-space:nowrap}
.vehicle-metrics{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
    gap:12px;
}
.vehicle-metric{
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#fff;
    padding:14px;
    box-shadow:0 12px 26px rgba(15,23,42,.07);
}
.vehicle-metric span{display:block;color:var(--muted);font-size:12px;font-weight:800}
.vehicle-metric strong{display:block;margin-top:5px;font-size:24px;color:var(--primary-dark)}
.vehicle-metric.accent-available{border-color:#bbf7d0;background:#f0fdf4}
.vehicle-metric.accent-reserved{border-color:#fde68a;background:#fffbeb}
.vehicle-metric.accent-sold{border-color:#cbd5e1;background:#f8fafc}
.vehicle-filter-card{
    position:relative;
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#fff;
    padding:18px;
    box-shadow:0 14px 32px rgba(15,23,42,.08);
}
.filter-heading,.results-bar{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:14px;
    margin-bottom:14px;
}
.filter-heading h2{margin:0;font-size:20px;color:var(--primary-dark)}
.filter-heading p{margin:3px 0 0;color:var(--muted);font-size:13px}
.clear-filters{color:var(--accent-orange);font-weight:800;text-decoration:none}
.vehicle-filter-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
    gap:12px;
    align-items:end;
}
.filter-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:14px}
.loading-chip{
    display:none;
    border-radius:999px;
    background:#eff6ff;
    color:#1d4ed8;
    padding:8px 11px;
    font-size:12px;
    font-weight:800;
}
.is-loading .loading-chip{display:inline-flex}
.is-loading:after{
    content:"";
    position:absolute;
    inset:0;
    border-radius:10px;
    background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.55),rgba(255,255,255,0));
    animation:vehicleLoading 1.1s linear infinite;
    pointer-events:none;
}
@keyframes vehicleLoading{from{transform:translateX(100%)}to{transform:translateX(-100%)}}
.results-bar{
    margin:0;
    color:var(--muted);
    font-size:13px;
    font-weight:800;
}
.vehicle-cards-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(285px,1fr));
    gap:16px;
}
.vehicle-card{
    overflow:hidden;
    border:1px solid rgba(226,232,240,.95);
    border-radius:10px;
    background:#fff;
    box-shadow:0 14px 32px rgba(15,23,42,.08);
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.vehicle-card:hover{
    transform:translateY(-3px);
    box-shadow:0 22px 48px rgba(15,23,42,.14);
    border-color:#cbd5e1;
}
.vehicle-card-media{
    height:96px;
    display:grid;
    place-items:center;
    color:#fff;
    background:linear-gradient(135deg,#0f172a,#2563eb);
}
.vehicle-card.status-available .vehicle-card-media{background:linear-gradient(135deg,#064e3b,#10b981)}
.vehicle-card.status-reserved .vehicle-card-media{background:linear-gradient(135deg,#92400e,#f59e0b)}
.vehicle-card.status-sold .vehicle-card-media{background:linear-gradient(135deg,#1f2937,#64748b)}
.vehicle-card.status-inactive .vehicle-card-media,.vehicle-card.status-archived .vehicle-card-media{background:linear-gradient(135deg,#475569,#94a3b8)}
.vehicle-card-media svg{width:72px;height:72px;fill:currentColor;opacity:.92}
.vehicle-card-body{padding:16px}
.vehicle-card-top{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:12px}
.vehicle-code{
    direction:ltr;
    display:inline-flex;
    border-radius:999px;
    background:#eff6ff;
    color:#1d4ed8;
    padding:5px 9px;
    font-size:11px;
    font-weight:900;
}
.vehicle-card h3{margin:0;color:var(--primary-dark);font-size:20px;line-height:1.35}
.vehicle-subtitle{margin:6px 0 12px;color:var(--muted);font-size:13px}
.vehicle-details{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin:0 0 14px;
}
.vehicle-details div{
    border:1px solid #e2e8f0;
    border-radius:8px;
    padding:9px;
    background:#f8fafc;
    min-width:0;
}
.vehicle-details dt{color:var(--muted);font-size:11px;font-weight:900}
.vehicle-details dd{margin:3px 0 0;color:#1f2937;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vehicle-price-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin-bottom:14px;
}
.vehicle-price-row div{
    border-radius:8px;
    background:linear-gradient(180deg,#fff,#f8fafc);
    border:1px solid #e2e8f0;
    padding:10px;
}
.vehicle-price-row span{display:block;color:var(--muted);font-size:11px;font-weight:900}
.vehicle-price-row strong{display:block;color:#0f172a;font-size:17px;margin-top:3px}
.vehicle-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.vehicle-actions form{margin:0}
.vehicle-actions .button{padding:8px 10px;font-size:13px;box-shadow:none}
.vehicle-empty-state{
    text-align:center;
    border:1px dashed #cbd5e1;
    border-radius:10px;
    background:#fff;
    padding:34px 18px;
    box-shadow:0 12px 28px rgba(15,23,42,.06);
}
.vehicle-empty-icon{
    width:58px;
    height:58px;
    display:grid;
    place-items:center;
    margin:0 auto 12px;
    border-radius:18px;
    background:linear-gradient(135deg,#dbeafe,#cffafe);
    color:#1d4ed8;
    font-weight:900;
}
.vehicle-empty-state h2{margin:0 0 8px;color:var(--primary-dark)}
.vehicle-empty-state p{margin:0 0 16px;color:var(--muted)}
.pagination{
    display:flex;
    justify-content:center;
    gap:8px;
    flex-wrap:wrap;
    margin:6px 0 10px;
}
.pagination a{
    min-width:38px;
    height:38px;
    display:inline-grid;
    place-items:center;
    border:1px solid #dbe3ef;
    border-radius:999px;
    background:#fff;
    color:#1f2937;
    text-decoration:none;
    font-weight:900;
    box-shadow:0 8px 18px rgba(15,23,42,.06);
}
.pagination a:hover,.pagination a.active{
    color:#fff;
    border-color:transparent;
    background:linear-gradient(135deg,var(--primary-blue),var(--accent-cyan));
}
.customers-page{display:grid;gap:18px}
.customers-hero{
    display:flex;
    justify-content:space-between;
    gap:18px;
    align-items:flex-end;
    border:1px solid rgba(226,232,240,.95);
    border-radius:10px;
    padding:22px;
    background:linear-gradient(135deg,#fff 0,#f8fbff 52%,#ede9fe 100%);
    box-shadow:var(--shadow);
}
.customers-hero h1{margin:0 0 8px;font-size:30px;color:var(--primary-dark)}
.customers-hero p{margin:0;color:var(--muted);line-height:1.8}
.customers-create{white-space:nowrap}
.customer-metrics{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
    gap:12px;
}
.customer-metric{
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#fff;
    padding:14px;
    box-shadow:0 12px 26px rgba(15,23,42,.07);
}
.customer-metric span{display:block;color:var(--muted);font-size:12px;font-weight:800}
.customer-metric strong{display:block;margin-top:5px;font-size:24px;color:var(--primary-dark)}
.customer-metric.accent-active{border-color:#bbf7d0;background:#f0fdf4}
.customer-metric.accent-contracts{border-color:#bfdbfe;background:#eff6ff}
.customer-metric.accent-recent{border-color:#ddd6fe;background:#f5f3ff}
.customer-filter-card{
    position:relative;
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#fff;
    padding:18px;
    box-shadow:0 14px 32px rgba(15,23,42,.08);
}
.customer-filter-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
    gap:12px;
    align-items:end;
}
.customer-cards-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(285px,1fr));
    gap:16px;
}
.customer-card{
    overflow:hidden;
    border:1px solid rgba(226,232,240,.95);
    border-radius:10px;
    background:#fff;
    box-shadow:0 14px 32px rgba(15,23,42,.08);
    padding:16px;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.customer-card:hover{
    transform:translateY(-3px);
    box-shadow:0 22px 48px rgba(15,23,42,.14);
    border-color:#cbd5e1;
}
.customer-card-top{
    display:grid;
    grid-template-columns:auto 1fr auto;
    gap:11px;
    align-items:start;
    margin-bottom:14px;
}
.customer-avatar{
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    border-radius:16px;
    color:#fff;
    background:linear-gradient(135deg,var(--primary-blue),var(--primary-violet));
    font-weight:900;
    box-shadow:0 12px 22px rgba(37,99,235,.22);
}
.customer-code{
    direction:ltr;
    display:inline-flex;
    border-radius:999px;
    background:#f5f3ff;
    color:#6d28d9;
    padding:4px 9px;
    font-size:11px;
    font-weight:900;
    margin-bottom:5px;
}
.customer-card h3{margin:0;color:var(--primary-dark);font-size:19px;line-height:1.35}
.customer-details{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin:0 0 14px;
}
.customer-details div{
    border:1px solid #e2e8f0;
    border-radius:8px;
    padding:9px;
    background:#f8fafc;
    min-width:0;
}
.customer-details dt{color:var(--muted);font-size:11px;font-weight:900}
.customer-details dd{margin:3px 0 0;color:#1f2937;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.customer-contract-strip{
    display:grid;
    grid-template-columns:auto auto 1fr;
    gap:8px;
    align-items:center;
    border-radius:9px;
    border:1px solid #dbeafe;
    background:linear-gradient(135deg,#eff6ff,#f8fafc);
    padding:10px;
    margin-bottom:14px;
}
.customer-contract-strip span{color:var(--muted);font-size:12px;font-weight:900}
.customer-contract-strip strong{color:#1d4ed8;font-size:20px}
.customer-contract-strip small{color:#334155;font-weight:800;text-align:left}
.customer-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.customer-actions form{margin:0}
.customer-actions .button{padding:8px 10px;font-size:13px;box-shadow:none}
.customer-empty-state{
    text-align:center;
    border:1px dashed #cbd5e1;
    border-radius:10px;
    background:#fff;
    padding:34px 18px;
    box-shadow:0 12px 28px rgba(15,23,42,.06);
}
.customer-empty-icon{
    width:58px;
    height:58px;
    display:grid;
    place-items:center;
    margin:0 auto 12px;
    border-radius:18px;
    background:linear-gradient(135deg,#ede9fe,#dbeafe);
    color:#6d28d9;
    font-weight:900;
}
.customer-empty-state h2{margin:0 0 8px;color:var(--primary-dark)}
.customer-empty-state p{margin:0 0 16px;color:var(--muted)}
.contracts-page{display:grid;gap:18px}
.contracts-hero{
    display:flex;
    justify-content:space-between;
    gap:18px;
    align-items:flex-end;
    border:1px solid rgba(226,232,240,.95);
    border-radius:10px;
    padding:22px;
    background:linear-gradient(135deg,#fff 0,#f8fbff 52%,#cffafe 100%);
    box-shadow:var(--shadow);
}
.contracts-hero h1{margin:0 0 8px;font-size:30px;color:var(--primary-dark)}
.contracts-hero p{margin:0;color:var(--muted);line-height:1.8}
.contracts-create{white-space:nowrap}
.contract-metrics{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
    gap:12px;
}
.contract-metric{
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#fff;
    padding:14px;
    box-shadow:0 12px 26px rgba(15,23,42,.07);
}
.contract-metric span{display:block;color:var(--muted);font-size:12px;font-weight:800}
.contract-metric strong{display:block;margin-top:5px;font-size:24px;color:var(--primary-dark)}
.contract-metric.accent-active{border-color:#bfdbfe;background:#eff6ff}
.contract-metric.accent-completed{border-color:#bbf7d0;background:#f0fdf4}
.contract-metric.accent-overdue{border-color:#fed7aa;background:#fff7ed}
.contract-filter-card{
    position:relative;
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#fff;
    padding:18px;
    box-shadow:0 14px 32px rgba(15,23,42,.08);
}
.contract-filter-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
    gap:12px;
    align-items:end;
}
.contract-cards-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(310px,1fr));
    gap:16px;
}
.contract-card{
    border:1px solid rgba(226,232,240,.95);
    border-radius:10px;
    background:#fff;
    box-shadow:0 14px 32px rgba(15,23,42,.08);
    padding:16px;
    overflow:hidden;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.contract-card:hover{transform:translateY(-3px);box-shadow:0 22px 48px rgba(15,23,42,.14);border-color:#cbd5e1}
.contract-card.status-active{border-top:4px solid var(--primary-blue)}
.contract-card.status-completed{border-top:4px solid var(--success)}
.contract-card.status-cancelled{border-top:4px solid #ef4444}
.contract-card.status-draft{border-top:4px solid var(--accent-gold)}
.contract-card.status-archived{border-top:4px solid #64748b}
.contract-card-top{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    margin-bottom:10px;
}
.contract-number{
    direction:ltr;
    display:inline-flex;
    border-radius:999px;
    background:#eff6ff;
    color:#1d4ed8;
    padding:4px 9px;
    font-size:11px;
    font-weight:900;
    margin-bottom:6px;
}
.contract-card h3{margin:0;color:var(--primary-dark);font-size:19px;line-height:1.35}
.contract-meta-line{
    display:flex;
    justify-content:space-between;
    gap:10px;
    color:#334155;
    background:#f8fafc;
    border:1px solid #e2e8f0;
    border-radius:9px;
    padding:10px;
    margin-bottom:12px;
    font-weight:800;
}
.contract-details{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin:0 0 14px;
}
.contract-details div{
    border:1px solid #e2e8f0;
    border-radius:8px;
    padding:9px;
    background:#fff;
    min-width:0;
}
.contract-details dt{color:var(--muted);font-size:11px;font-weight:900}
.contract-details dd{margin:3px 0 0;color:#1f2937;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.contract-financial-strip{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:8px;
    margin-bottom:14px;
}
.contract-financial-strip div{
    border-radius:8px;
    background:linear-gradient(180deg,#fff,#f8fafc);
    border:1px solid #e2e8f0;
    padding:9px;
}
.contract-financial-strip span{display:block;color:var(--muted);font-size:11px;font-weight:900}
.contract-financial-strip strong{display:block;color:#0f172a;font-size:15px;margin-top:3px}
.contract-progress{margin-bottom:14px}
.progress-caption{display:flex;justify-content:space-between;gap:10px;color:var(--muted);font-size:12px;font-weight:900;margin-bottom:7px}
.progress-caption strong{color:#c2410c}
.progress-track{height:9px;border-radius:999px;background:#e2e8f0;overflow:hidden}
.progress-track span{display:block;height:100%;border-radius:999px;background:linear-gradient(135deg,var(--primary-blue),var(--accent-cyan))}
.contract-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.contract-actions .button{padding:8px 10px;font-size:13px;box-shadow:none}
.contract-empty-state{
    text-align:center;
    border:1px dashed #cbd5e1;
    border-radius:10px;
    background:#fff;
    padding:34px 18px;
    box-shadow:0 12px 28px rgba(15,23,42,.06);
}
.contract-empty-icon{
    width:58px;
    height:58px;
    display:grid;
    place-items:center;
    margin:0 auto 12px;
    border-radius:18px;
    background:linear-gradient(135deg,#cffafe,#dbeafe);
    color:#0e7490;
    font-weight:900;
}
.contract-empty-state h2{margin:0 0 8px;color:var(--primary-dark)}
.contract-empty-state p{margin:0 0 16px;color:var(--muted)}
.installments-page{display:grid;gap:18px}
.installments-hero{
    display:flex;
    justify-content:space-between;
    gap:18px;
    align-items:flex-end;
    border:1px solid rgba(226,232,240,.95);
    border-radius:10px;
    padding:22px;
    background:linear-gradient(135deg,#fff 0,#f8fbff 52%,#fff7ed 100%);
    box-shadow:var(--shadow);
}
.installments-hero h1{margin:0 0 8px;font-size:30px;color:var(--primary-dark)}
.installments-hero p{margin:0;color:var(--muted);line-height:1.8}
.installment-hero-alert{
    min-width:180px;
    border:1px solid #fed7aa;
    border-radius:10px;
    background:linear-gradient(135deg,#fff,#fff7ed);
    padding:14px;
    box-shadow:0 12px 26px rgba(249,115,22,.12);
}
.installment-hero-alert span,.installment-hero-alert small{display:block;color:#9a3412;font-size:12px;font-weight:900}
.installment-hero-alert strong{display:block;margin:5px 0;color:#c2410c;font-size:32px;line-height:1}
.installment-metrics{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(145px,1fr));
    gap:12px;
}
.installment-metric{
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#fff;
    padding:14px;
    box-shadow:0 12px 26px rgba(15,23,42,.07);
}
.installment-metric span{display:block;color:var(--muted);font-size:12px;font-weight:800}
.installment-metric strong{display:block;margin-top:5px;font-size:24px;color:var(--primary-dark)}
.installment-metric.accent-total{border-color:#bfdbfe;background:#eff6ff}
.installment-metric.accent-overdue{border-color:#fecaca;background:#fef2f2}
.installment-metric.accent-today{border-color:#bae6fd;background:#f0f9ff}
.installment-metric.accent-week{border-color:#fed7aa;background:#fff7ed}
.installment-metric.accent-partial{border-color:#fde68a;background:#fffbeb}
.installment-metric.accent-paid{border-color:#bbf7d0;background:#f0fdf4}
.installment-metric.accent-money{border-color:#ddd6fe;background:#f5f3ff}
.installment-quick-filters{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    align-items:center;
}
.installment-quick-filters a{
    display:inline-flex;
    align-items:center;
    min-height:36px;
    border:1px solid #dbe3ef;
    border-radius:999px;
    background:#fff;
    color:#334155;
    padding:7px 13px;
    text-decoration:none;
    font-size:13px;
    font-weight:900;
    box-shadow:0 8px 18px rgba(15,23,42,.05);
}
.installment-quick-filters a:hover,.installment-quick-filters a.active{
    color:#fff;
    border-color:transparent;
    background:linear-gradient(135deg,var(--primary-blue),var(--accent-cyan));
}
.installment-quick-filters a.active.danger{background:linear-gradient(135deg,#dc2626,#f97316)}
.installment-quick-filters a.active.success{background:linear-gradient(135deg,#059669,#10b981)}
.installment-filter-card{
    position:relative;
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#fff;
    padding:18px;
    box-shadow:0 14px 32px rgba(15,23,42,.08);
}
.installment-filter-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(185px,1fr));
    gap:12px;
    align-items:end;
}
.installment-cards-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
    gap:16px;
}
.installment-card{
    border:1px solid rgba(226,232,240,.95);
    border-radius:10px;
    background:#fff;
    box-shadow:0 14px 32px rgba(15,23,42,.08);
    padding:16px;
    overflow:hidden;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.installment-card:hover{transform:translateY(-3px);box-shadow:0 22px 48px rgba(15,23,42,.14);border-color:#cbd5e1}
.installment-card.status-pending{border-top:4px solid var(--primary-blue)}
.installment-card.status-partial{border-top:4px solid var(--accent-gold)}
.installment-card.status-paid{border-top:4px solid var(--success)}
.installment-card.status-overdue{border-top:4px solid #dc2626}
.installment-card.status-cancelled{border-top:4px solid #64748b}
.installment-card-top{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    margin-bottom:10px;
}
.installment-number{
    direction:ltr;
    display:inline-flex;
    border-radius:999px;
    background:#eff6ff;
    color:#1d4ed8;
    padding:4px 9px;
    font-size:11px;
    font-weight:900;
    margin-bottom:6px;
}
.installment-card h3{margin:0;color:var(--primary-dark);font-size:19px;line-height:1.35}
.installment-meta-line{
    display:flex;
    justify-content:space-between;
    gap:10px;
    color:#334155;
    background:#f8fafc;
    border:1px solid #e2e8f0;
    border-radius:9px;
    padding:10px;
    margin-bottom:12px;
    font-weight:800;
}
.installment-meta-line strong{color:#0f172a}
.installment-meta-line mark{
    border-radius:999px;
    background:#fee2e2;
    color:#b91c1c;
    padding:3px 8px;
    font-size:12px;
    font-weight:900;
}
.installment-meta-line small{color:var(--muted);font-weight:900}
.installment-details{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin:0 0 14px;
}
.installment-details div{
    border:1px solid #e2e8f0;
    border-radius:8px;
    padding:9px;
    background:#fff;
    min-width:0;
}
.installment-details dt{color:var(--muted);font-size:11px;font-weight:900}
.installment-details dd{margin:3px 0 0;color:#1f2937;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.installment-financial-strip{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:8px;
    margin-bottom:14px;
}
.installment-financial-strip div{
    border-radius:8px;
    background:linear-gradient(180deg,#fff,#f8fafc);
    border:1px solid #e2e8f0;
    padding:9px;
}
.installment-financial-strip span{display:block;color:var(--muted);font-size:11px;font-weight:900}
.installment-financial-strip strong{display:block;color:#0f172a;font-size:16px;margin-top:3px}
.installment-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.installment-actions .button{padding:8px 10px;font-size:13px;box-shadow:none}
.installment-empty-state{
    text-align:center;
    border:1px dashed #cbd5e1;
    border-radius:10px;
    background:#fff;
    padding:34px 18px;
    box-shadow:0 12px 28px rgba(15,23,42,.06);
}
.installment-empty-icon{
    width:58px;
    height:58px;
    display:grid;
    place-items:center;
    margin:0 auto 12px;
    border-radius:18px;
    background:linear-gradient(135deg,#fff7ed,#fee2e2);
    color:#c2410c;
    font-weight:900;
    direction:ltr;
}
.installment-empty-state h2{margin:0 0 8px;color:var(--primary-dark)}
.installment-empty-state p{margin:0 0 16px;color:var(--muted)}
.payments-page{display:grid;gap:18px}
.payments-hero{
    display:flex;
    justify-content:space-between;
    gap:18px;
    align-items:flex-end;
    border:1px solid rgba(226,232,240,.95);
    border-radius:10px;
    padding:22px;
    background:linear-gradient(135deg,#fff 0,#f8fbff 52%,#dcfce7 100%);
    box-shadow:var(--shadow);
}
.payments-hero h1{margin:0 0 8px;font-size:30px;color:var(--primary-dark)}
.payments-hero p{margin:0;color:var(--muted);line-height:1.8}
.payment-hero-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.payment-hero-actions .button{padding:9px 12px;font-size:13px}
.payment-hero-total{
    min-width:205px;
    border:1px solid #bbf7d0;
    border-radius:10px;
    background:linear-gradient(135deg,#fff,#f0fdf4);
    padding:14px;
    box-shadow:0 12px 26px rgba(16,185,129,.12);
}
.payment-hero-total span,.payment-hero-total small{display:block;color:#047857;font-size:12px;font-weight:900}
.payment-hero-total strong{display:block;margin:5px 0;color:#065f46;font-size:28px;line-height:1}
.payment-metrics{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(145px,1fr));
    gap:12px;
}
.payment-metric{
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#fff;
    padding:14px;
    box-shadow:0 12px 26px rgba(15,23,42,.07);
}
.payment-metric span{display:block;color:var(--muted);font-size:12px;font-weight:800}
.payment-metric strong{display:block;margin-top:5px;font-size:23px;color:var(--primary-dark)}
.payment-metric.accent-total{border-color:#bfdbfe;background:#eff6ff}
.payment-metric.accent-money{border-color:#bbf7d0;background:#f0fdf4}
.payment-metric.accent-today{border-color:#bae6fd;background:#f0f9ff}
.payment-metric.accent-month{border-color:#ddd6fe;background:#f5f3ff}
.payment-metric.accent-cash{border-color:#a7f3d0;background:#ecfdf5}
.payment-metric.accent-bank{border-color:#c7d2fe;background:#eef2ff}
.payment-quick-filters{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    align-items:center;
}
.payment-quick-filters a{
    display:inline-flex;
    align-items:center;
    min-height:36px;
    border:1px solid #dbe3ef;
    border-radius:999px;
    background:#fff;
    color:#334155;
    padding:7px 13px;
    text-decoration:none;
    font-size:13px;
    font-weight:900;
    box-shadow:0 8px 18px rgba(15,23,42,.05);
}
.payment-quick-filters a:hover,.payment-quick-filters a.active{
    color:#fff;
    border-color:transparent;
    background:linear-gradient(135deg,var(--primary-blue),var(--accent-cyan));
}
.payment-quick-filters a.active.success{background:linear-gradient(135deg,#059669,#10b981)}
.payment-quick-filters a.active.bank{background:linear-gradient(135deg,#2563eb,#06b6d4)}
.payment-quick-filters a.active.card{background:linear-gradient(135deg,#7c3aed,#a855f7)}
.payment-quick-filters a.active.muted{background:linear-gradient(135deg,#475569,#64748b)}
.payment-filter-card{
    position:relative;
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#fff;
    padding:18px;
    box-shadow:0 14px 32px rgba(15,23,42,.08);
}
.payment-filter-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(185px,1fr));
    gap:12px;
    align-items:end;
}
.payment-cards-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(330px,1fr));
    gap:16px;
}
.payment-card{
    border:1px solid rgba(226,232,240,.95);
    border-radius:10px;
    background:#fff;
    box-shadow:0 14px 32px rgba(15,23,42,.08);
    padding:16px;
    overflow:hidden;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.payment-card:hover{transform:translateY(-3px);box-shadow:0 22px 48px rgba(15,23,42,.14);border-color:#cbd5e1}
.payment-card.method-cash{border-top:4px solid var(--success)}
.payment-card.method-bank_transfer{border-top:4px solid var(--accent-cyan)}
.payment-card.method-card{border-top:4px solid var(--primary-violet)}
.payment-card.method-other{border-top:4px solid #64748b}
.payment-card.status-cancelled{opacity:.78;border-top-color:#ef4444}
.payment-card-top{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    margin-bottom:12px;
}
.payment-number{
    direction:ltr;
    display:inline-flex;
    border-radius:999px;
    background:#ecfdf5;
    color:#047857;
    padding:4px 9px;
    font-size:11px;
    font-weight:900;
    margin-bottom:6px;
}
.payment-card h3{margin:0;color:var(--primary-dark);font-size:19px;line-height:1.35}
.payment-method-badge{
    display:inline-flex;
    align-items:center;
    border-radius:999px;
    padding:5px 10px;
    font-size:11px;
    font-weight:900;
    white-space:nowrap;
}
.payment-method-badge.cash{color:#047857;background:#d1fae5}
.payment-method-badge.bank_transfer{color:#075985;background:#e0f2fe}
.payment-method-badge.card{color:#6d28d9;background:#ede9fe}
.payment-method-badge.other{color:#334155;background:#f1f5f9}
.payment-amount-panel{
    border:1px solid #dbeafe;
    border-radius:10px;
    background:linear-gradient(135deg,#fff,#f8fafc);
    padding:13px;
    margin-bottom:12px;
}
.payment-amount-panel span,.payment-amount-panel small{display:block;color:var(--muted);font-size:12px;font-weight:900}
.payment-amount-panel strong{display:block;margin:4px 0;color:#0f172a;font-size:26px;line-height:1.2}
.payment-details{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin:0 0 14px;
}
.payment-details div{
    border:1px solid #e2e8f0;
    border-radius:8px;
    padding:9px;
    background:#fff;
    min-width:0;
}
.payment-details dt{color:var(--muted);font-size:11px;font-weight:900}
.payment-details dd{margin:3px 0 0;color:#1f2937;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.payment-receipt-strip{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:8px;
    margin-bottom:12px;
}
.payment-receipt-strip div{
    border-radius:8px;
    background:#f8fafc;
    border:1px solid #e2e8f0;
    padding:9px;
    min-width:0;
}
.payment-receipt-strip span{display:block;color:var(--muted);font-size:11px;font-weight:900}
.payment-receipt-strip strong{display:block;color:#0f172a;font-size:13px;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.payment-note{
    margin:0 0 12px;
    border-radius:8px;
    background:#fffbeb;
    border:1px solid #fde68a;
    color:#92400e;
    padding:9px;
    font-size:12px;
    font-weight:800;
    line-height:1.7;
}
.payment-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.payment-actions .button{padding:8px 10px;font-size:13px;box-shadow:none}
.payment-empty-state{
    text-align:center;
    border:1px dashed #cbd5e1;
    border-radius:10px;
    background:#fff;
    padding:34px 18px;
    box-shadow:0 12px 28px rgba(15,23,42,.06);
}
.payment-empty-icon{
    width:58px;
    height:58px;
    display:grid;
    place-items:center;
    margin:0 auto 12px;
    border-radius:18px;
    background:linear-gradient(135deg,#dcfce7,#dbeafe);
    color:#047857;
    font-weight:900;
    direction:ltr;
}
.payment-empty-state h2{margin:0 0 8px;color:var(--primary-dark)}
.payment-empty-state p{margin:0 0 16px;color:var(--muted)}
.expenses-page{display:grid;gap:18px}
.expenses-hero{
    display:flex;
    justify-content:space-between;
    gap:18px;
    align-items:flex-end;
    border:1px solid rgba(226,232,240,.95);
    border-radius:10px;
    padding:22px;
    background:linear-gradient(135deg,#fff 0,#f8fbff 52%,#ffedd5 100%);
    box-shadow:var(--shadow);
}
.expenses-hero h1{margin:0 0 8px;font-size:30px;color:var(--primary-dark)}
.expenses-hero p{margin:0;color:var(--muted);line-height:1.8}
.expense-hero-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.expense-hero-actions .button{padding:9px 12px;font-size:13px}
.expense-hero-total{
    min-width:210px;
    border:1px solid #fed7aa;
    border-radius:10px;
    background:linear-gradient(135deg,#fff,#fff7ed);
    padding:14px;
    box-shadow:0 12px 26px rgba(249,115,22,.12);
}
.expense-hero-total span,.expense-hero-total small{display:block;color:#9a3412;font-size:12px;font-weight:900}
.expense-hero-total strong{display:block;margin:5px 0;color:#c2410c;font-size:28px;line-height:1}
.expense-metrics{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(145px,1fr));
    gap:12px;
}
.expense-metric{
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#fff;
    padding:14px;
    box-shadow:0 12px 26px rgba(15,23,42,.07);
}
.expense-metric span{display:block;color:var(--muted);font-size:12px;font-weight:800}
.expense-metric strong{display:block;margin-top:5px;font-size:23px;color:var(--primary-dark);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.expense-metric.accent-total{border-color:#bfdbfe;background:#eff6ff}
.expense-metric.accent-money{border-color:#fed7aa;background:#fff7ed}
.expense-metric.accent-today{border-color:#bae6fd;background:#f0f9ff}
.expense-metric.accent-month{border-color:#ddd6fe;background:#f5f3ff}
.expense-metric.accent-method{border-color:#bbf7d0;background:#f0fdf4}
.expense-metric.accent-category{border-color:#fbcfe8;background:#fdf2f8}
.expense-quick-filters{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    align-items:center;
}
.expense-quick-filters a{
    display:inline-flex;
    align-items:center;
    min-height:36px;
    border:1px solid #dbe3ef;
    border-radius:999px;
    background:#fff;
    color:#334155;
    padding:7px 13px;
    text-decoration:none;
    font-size:13px;
    font-weight:900;
    box-shadow:0 8px 18px rgba(15,23,42,.05);
}
.expense-quick-filters a:hover,.expense-quick-filters a.active{
    color:#fff;
    border-color:transparent;
    background:linear-gradient(135deg,#f97316,#f59e0b);
}
.expense-quick-filters a.active.salary{background:linear-gradient(135deg,#7c3aed,#a855f7)}
.expense-quick-filters a.active.maintenance{background:linear-gradient(135deg,#2563eb,#06b6d4)}
.expense-quick-filters a.active.marketing{background:linear-gradient(135deg,#db2777,#fb7185)}
.expense-quick-filters a.active.rent{background:linear-gradient(135deg,#475569,#6366f1)}
.expense-quick-filters a.active.muted{background:linear-gradient(135deg,#475569,#64748b)}
.expense-filter-card{
    position:relative;
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#fff;
    padding:18px;
    box-shadow:0 14px 32px rgba(15,23,42,.08);
}
.expense-filter-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(185px,1fr));
    gap:12px;
    align-items:end;
}
.expense-cards-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(330px,1fr));
    gap:16px;
}
.expense-card{
    border:1px solid rgba(226,232,240,.95);
    border-radius:10px;
    background:#fff;
    box-shadow:0 14px 32px rgba(15,23,42,.08);
    padding:16px;
    overflow:hidden;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.expense-card:hover{transform:translateY(-3px);box-shadow:0 22px 48px rgba(15,23,42,.14);border-color:#cbd5e1}
.expense-card.category-default{border-top:4px solid #64748b}
.expense-card.category-rent{border-top:4px solid #6366f1}
.expense-card.category-salary{border-top:4px solid var(--primary-violet)}
.expense-card.category-maintenance{border-top:4px solid var(--accent-cyan)}
.expense-card.category-marketing{border-top:4px solid #db2777}
.expense-card.status-cancelled{opacity:.78;border-top-color:#ef4444}
.expense-card.status-archived{opacity:.82;border-top-color:#64748b}
.expense-card-top{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    margin-bottom:12px;
}
.expense-number{
    direction:ltr;
    display:inline-flex;
    border-radius:999px;
    background:#fff7ed;
    color:#c2410c;
    padding:4px 9px;
    font-size:11px;
    font-weight:900;
    margin-bottom:6px;
}
.expense-card h3{margin:0;color:var(--primary-dark);font-size:19px;line-height:1.35}
.expense-category-badge{
    display:inline-flex;
    align-items:center;
    max-width:145px;
    border-radius:999px;
    padding:5px 10px;
    font-size:11px;
    font-weight:900;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.expense-category-badge.default{color:#334155;background:#f1f5f9}
.expense-category-badge.rent{color:#3730a3;background:#e0e7ff}
.expense-category-badge.salary{color:#6d28d9;background:#ede9fe}
.expense-category-badge.maintenance{color:#075985;background:#e0f2fe}
.expense-category-badge.marketing{color:#be185d;background:#fce7f3}
.expense-amount-panel{
    border:1px solid #fed7aa;
    border-radius:10px;
    background:linear-gradient(135deg,#fff,#fff7ed);
    padding:13px;
    margin-bottom:12px;
}
.expense-amount-panel span,.expense-amount-panel small{display:block;color:#9a3412;font-size:12px;font-weight:900}
.expense-amount-panel strong{display:block;margin:4px 0;color:#0f172a;font-size:26px;line-height:1.2}
.expense-description{
    margin:0 0 12px;
    color:#334155;
    line-height:1.8;
    font-size:13px;
    font-weight:800;
}
.expense-details{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin:0 0 14px;
}
.expense-details div{
    border:1px solid #e2e8f0;
    border-radius:8px;
    padding:9px;
    background:#fff;
    min-width:0;
}
.expense-details dt{color:var(--muted);font-size:11px;font-weight:900}
.expense-details dd{margin:3px 0 0;color:#1f2937;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.expense-note{
    margin:0 0 12px;
    border-radius:8px;
    background:#fffbeb;
    border:1px solid #fde68a;
    color:#92400e;
    padding:9px;
    font-size:12px;
    font-weight:800;
    line-height:1.7;
}
.expense-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.expense-actions .button{padding:8px 10px;font-size:13px;box-shadow:none}
.expense-empty-state{
    text-align:center;
    border:1px dashed #cbd5e1;
    border-radius:10px;
    background:#fff;
    padding:34px 18px;
    box-shadow:0 12px 28px rgba(15,23,42,.06);
}
.expense-empty-icon{
    width:58px;
    height:58px;
    display:grid;
    place-items:center;
    margin:0 auto 12px;
    border-radius:18px;
    background:linear-gradient(135deg,#ffedd5,#fee2e2);
    color:#c2410c;
    font-weight:900;
    direction:ltr;
}
.expense-empty-state h2{margin:0 0 8px;color:var(--primary-dark)}
.expense-empty-state p{margin:0 0 16px;color:var(--muted)}
.reports-page{display:grid;gap:18px}
.reports-hero{
    display:flex;
    justify-content:space-between;
    gap:18px;
    align-items:flex-end;
    border:1px solid rgba(226,232,240,.95);
    border-radius:10px;
    padding:22px;
    background:linear-gradient(135deg,#fff 0,#f8fbff 50%,#e0f2fe 100%);
    box-shadow:var(--shadow);
}
.reports-hero h1{margin:0 0 8px;font-size:30px;color:var(--primary-dark)}
.reports-hero p{margin:0;color:var(--muted);line-height:1.8}
.reports-hero-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.reports-hero-actions .button{padding:8px 10px;font-size:12px;box-shadow:none}
.reports-hero-total{
    min-width:220px;
    border:1px solid #bfdbfe;
    border-radius:10px;
    background:linear-gradient(135deg,#fff,#eff6ff);
    padding:14px;
    box-shadow:0 12px 26px rgba(37,99,235,.12);
}
.reports-hero-total span,.reports-hero-total small{display:block;color:#1d4ed8;font-size:12px;font-weight:900}
.reports-hero-total strong{display:block;margin:5px 0;color:#0f172a;font-size:27px;line-height:1.2}
.reports-quick-ranges{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    align-items:center;
}
.reports-quick-ranges a{
    display:inline-flex;
    align-items:center;
    min-height:36px;
    border:1px solid #dbe3ef;
    border-radius:999px;
    background:#fff;
    color:#334155;
    padding:7px 13px;
    text-decoration:none;
    font-size:13px;
    font-weight:900;
    box-shadow:0 8px 18px rgba(15,23,42,.05);
}
.reports-quick-ranges a:hover,.reports-quick-ranges a.active{
    color:#fff;
    border-color:transparent;
    background:linear-gradient(135deg,var(--primary-blue),var(--primary-violet));
}
.reports-filter-card{
    position:relative;
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#fff;
    padding:18px;
    box-shadow:0 14px 32px rgba(15,23,42,.08);
}
.reports-filter-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(185px,1fr));
    gap:12px;
    align-items:end;
}
.reports-section-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:12px;
    margin-top:4px;
}
.reports-section-heading span{display:block;color:var(--accent-orange);font-size:12px;font-weight:900;text-transform:uppercase}
.reports-section-heading h2{margin:3px 0 0;color:var(--primary-dark);font-size:22px}
.reports-kpi-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
    gap:12px;
}
.reports-kpi-grid.operational{grid-template-columns:repeat(auto-fit,minmax(155px,1fr))}
.reports-kpi-card{
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#fff;
    padding:15px;
    box-shadow:0 12px 26px rgba(15,23,42,.07);
    min-width:0;
}
.reports-kpi-card span{display:block;color:var(--muted);font-size:12px;font-weight:900}
.reports-kpi-card strong{display:block;margin-top:7px;color:#0f172a;font-size:23px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;direction:ltr;text-align:inherit}
.reports-kpi-card.accent-green{border-color:#bbf7d0;background:#f0fdf4}
.reports-kpi-card.accent-orange{border-color:#fed7aa;background:#fff7ed}
.reports-kpi-card.accent-blue{border-color:#bfdbfe;background:#eff6ff}
.reports-kpi-card.accent-violet{border-color:#ddd6fe;background:#f5f3ff}
.reports-kpi-card.accent-red{border-color:#fecaca;background:#fef2f2}
.reports-kpi-card.accent-indigo{border-color:#c7d2fe;background:#eef2ff}
.reports-kpi-card.accent-cyan{border-color:#bae6fd;background:#f0f9ff}
.reports-kpi-card.accent-slate{border-color:#cbd5e1;background:#f8fafc}
.reports-insights-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
    gap:12px;
}
.reports-insight-card{
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#fff;
    padding:15px;
    box-shadow:0 12px 26px rgba(15,23,42,.07);
}
.reports-insight-card span{display:block;color:var(--muted);font-size:12px;font-weight:900}
.reports-insight-card strong{display:block;margin-top:6px;color:#0f172a;font-size:20px;line-height:1.35}
.reports-insight-card small{display:block;margin-top:5px;color:#64748b;font-weight:800}
.reports-insight-card.accent-green{border-color:#bbf7d0;background:#f0fdf4}
.reports-insight-card.accent-orange{border-color:#fed7aa;background:#fff7ed}
.reports-insight-card.accent-red{border-color:#fecaca;background:#fef2f2}
.reports-insight-card.accent-blue{border-color:#bfdbfe;background:#eff6ff}
.reports-insight-card.accent-violet{border-color:#ddd6fe;background:#f5f3ff}
.reports-comparison-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(315px,1fr));
    gap:16px;
}
.reports-showroom-card{
    border:1px solid rgba(226,232,240,.95);
    border-radius:10px;
    background:#fff;
    box-shadow:0 14px 32px rgba(15,23,42,.08);
    padding:16px;
}
.reports-showroom-top{
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:flex-start;
    margin-bottom:12px;
}
.reports-showroom-top span{
    direction:ltr;
    display:inline-flex;
    border-radius:999px;
    background:#eff6ff;
    color:#1d4ed8;
    padding:4px 9px;
    font-size:11px;
    font-weight:900;
    margin-bottom:6px;
}
.reports-showroom-top h3{margin:0;color:var(--primary-dark);font-size:19px}
.reports-showroom-top strong{color:#047857;font-size:18px;white-space:nowrap}
.reports-showroom-card dl{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
    margin:0;
}
.reports-showroom-card dl div{
    border:1px solid #e2e8f0;
    border-radius:8px;
    background:#f8fafc;
    padding:9px;
    min-width:0;
}
.reports-showroom-card dt{color:var(--muted);font-size:11px;font-weight:900}
.reports-showroom-card dd{margin:3px 0 0;color:#1f2937;font-size:13px;font-weight:900;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.report-shortcut-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(235px,1fr));
    gap:16px;
}
.report-shortcut-card{
    border:1px solid rgba(226,232,240,.95);
    border-radius:10px;
    background:#fff;
    box-shadow:0 14px 32px rgba(15,23,42,.08);
    padding:16px;
    display:grid;
    gap:10px;
}
.report-shortcut-icon{
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    border-radius:16px;
    direction:ltr;
    color:#0f172a;
    background:linear-gradient(135deg,#dbeafe,#cffafe);
    font-size:12px;
    font-weight:900;
}
.report-shortcut-card h3{margin:0;color:var(--primary-dark);font-size:18px}
.report-shortcut-card p{margin:0;color:var(--muted);line-height:1.8;font-size:13px}
.report-shortcut-card .button{justify-self:start;padding:8px 10px;font-size:13px;box-shadow:none}
.reports-empty-state{
    text-align:center;
    border:1px dashed #cbd5e1;
    border-radius:10px;
    background:#fff;
    padding:30px 18px;
    box-shadow:0 12px 28px rgba(15,23,42,.06);
}
.reports-empty-icon{
    width:58px;
    height:58px;
    display:grid;
    place-items:center;
    margin:0 auto 12px;
    border-radius:18px;
    background:linear-gradient(135deg,#dbeafe,#ede9fe);
    color:#1d4ed8;
    font-weight:900;
    direction:ltr;
}
.reports-empty-state h2{margin:0 0 8px;color:var(--primary-dark)}
.reports-empty-state p{margin:0 0 16px;color:var(--muted)}
.showroom-comparison-page{
    display:grid;
    gap:18px;
}
.comparison-hero{
    display:flex;
    justify-content:space-between;
    align-items:stretch;
    gap:18px;
    border:1px solid rgba(226,232,240,.95);
    border-radius:12px;
    background:linear-gradient(135deg,#f8fafc 0%,#eef6ff 52%,#f5f3ff 100%);
    padding:22px;
    box-shadow:0 18px 42px rgba(15,23,42,.09);
}
.comparison-hero h1{
    margin:6px 0 7px;
    color:#0f172a;
    font-size:30px;
    line-height:1.25;
}
.comparison-hero p{
    max-width:720px;
    margin:0;
    color:#475569;
    line-height:1.9;
    font-size:14px;
    font-weight:700;
}
.readonly-badge{
    display:inline-flex;
    align-items:center;
    min-height:28px;
    margin-top:12px;
    border:1px solid #bfdbfe;
    border-radius:999px;
    background:#eff6ff;
    color:#1d4ed8;
    padding:4px 10px;
    font-size:12px;
    font-weight:900;
}
.comparison-hero-total{
    min-width:160px;
    display:grid;
    align-content:center;
    justify-items:center;
    border:1px solid rgba(255,255,255,.7);
    border-radius:12px;
    background:rgba(255,255,255,.78);
    padding:16px;
    box-shadow:0 12px 26px rgba(37,99,235,.12);
}
.comparison-hero-total span{
    color:#1d4ed8;
    font-size:12px;
    font-weight:900;
}
.comparison-hero-total strong{
    color:#0f172a;
    font-size:32px;
    line-height:1.15;
}
.comparison-quick-ranges{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    align-items:center;
}
.comparison-quick-ranges a{
    display:inline-flex;
    align-items:center;
    min-height:34px;
    border:1px solid #dbe3ef;
    border-radius:999px;
    background:#fff;
    color:#334155;
    padding:7px 12px;
    text-decoration:none;
    font-size:13px;
    font-weight:900;
    box-shadow:0 8px 18px rgba(15,23,42,.05);
}
.comparison-quick-ranges a:hover,.comparison-quick-ranges a.active{
    color:#fff;
    border-color:transparent;
    background:linear-gradient(135deg,#2563eb,#7c3aed);
}
.comparison-filter-card{
    position:relative;
    border:1px solid #e2e8f0;
    border-radius:12px;
    background:#fff;
    padding:18px;
    box-shadow:0 14px 32px rgba(15,23,42,.08);
}
.comparison-filter-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
    gap:12px;
    align-items:end;
}
.comparison-kpi-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(175px,1fr));
    gap:12px;
}
.comparison-kpi-card{
    min-width:0;
    border:1px solid #e2e8f0;
    border-radius:12px;
    background:#fff;
    padding:15px;
    box-shadow:0 12px 26px rgba(15,23,42,.07);
}
.comparison-kpi-card span{
    display:block;
    color:#64748b;
    font-size:12px;
    font-weight:900;
}
.comparison-kpi-card strong{
    display:block;
    margin-top:7px;
    color:#0f172a;
    font-size:22px;
    line-height:1.25;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    direction:ltr;
    text-align:inherit;
}
.comparison-kpi-card.accent-blue{border-color:#bfdbfe;background:#eff6ff}
.comparison-kpi-card.accent-green{border-color:#bbf7d0;background:#f0fdf4}
.comparison-kpi-card.accent-orange{border-color:#fed7aa;background:#fff7ed}
.comparison-kpi-card.accent-violet{border-color:#ddd6fe;background:#f5f3ff}
.comparison-kpi-card.accent-cyan{border-color:#bae6fd;background:#f0f9ff}
.comparison-kpi-card.accent-red{border-color:#fecaca;background:#fef2f2}
.comparison-kpi-card.accent-indigo{border-color:#c7d2fe;background:#eef2ff}
.comparison-section-heading{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:12px;
}
.comparison-section-heading span{
    display:block;
    color:#f97316;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
}
.comparison-section-heading h2{
    margin:3px 0 0;
    color:#0f172a;
    font-size:22px;
}
.comparison-insights-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
    gap:12px;
}
.comparison-insight-card{
    min-width:0;
    border:1px solid #e2e8f0;
    border-radius:12px;
    background:#fff;
    padding:15px;
    box-shadow:0 12px 26px rgba(15,23,42,.07);
}
.comparison-insight-card span{display:block;color:#64748b;font-size:12px;font-weight:900}
.comparison-insight-card strong{display:block;margin-top:6px;color:#0f172a;font-size:19px;line-height:1.35}
.comparison-insight-card small{display:block;margin-top:5px;color:#64748b;font-weight:800}
.comparison-insight-card.accent-green{border-color:#bbf7d0;background:#f0fdf4}
.comparison-insight-card.accent-blue{border-color:#bfdbfe;background:#eff6ff}
.comparison-insight-card.accent-orange{border-color:#fed7aa;background:#fff7ed}
.comparison-insight-card.accent-red{border-color:#fecaca;background:#fef2f2}
.comparison-insight-card.accent-violet{border-color:#ddd6fe;background:#f5f3ff}
.comparison-insight-card.accent-cyan{border-color:#bae6fd;background:#f0f9ff}
.comparison-performance-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
    gap:14px;
}
.comparison-performance-card{
    border:1px solid #e2e8f0;
    border-radius:12px;
    background:#fff;
    padding:16px;
    box-shadow:0 14px 32px rgba(15,23,42,.08);
}
.comparison-performance-card.strong{border-color:#86efac;background:linear-gradient(180deg,#f0fdf4,#fff)}
.comparison-performance-card.good{border-color:#bfdbfe;background:linear-gradient(180deg,#eff6ff,#fff)}
.comparison-performance-card.watch{border-color:#fed7aa;background:linear-gradient(180deg,#fff7ed,#fff)}
.comparison-performance-card.danger{border-color:#fecaca;background:linear-gradient(180deg,#fef2f2,#fff)}
.comparison-card-top{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:12px;
}
.comparison-card-code{
    display:inline-flex;
    direction:ltr;
    border-radius:999px;
    background:#eef2ff;
    color:#4338ca;
    padding:4px 9px;
    font-size:11px;
    font-weight:900;
}
.comparison-card-top h3{
    margin:8px 0 0;
    color:#0f172a;
    font-size:18px;
}
.performance-badge{
    display:inline-flex;
    align-items:center;
    min-height:28px;
    border-radius:999px;
    background:#f1f5f9;
    color:#334155;
    padding:4px 10px;
    font-size:12px;
    font-weight:900;
    white-space:nowrap;
}
.performance-badge.strong{background:#dcfce7;color:#047857}
.performance-badge.good{background:#dbeafe;color:#1d4ed8}
.performance-badge.watch{background:#ffedd5;color:#c2410c}
.performance-badge.danger{background:#fee2e2;color:#b91c1c}
.comparison-net{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin:14px 0 10px;
    color:#64748b;
    font-size:13px;
    font-weight:900;
}
.comparison-net strong{
    color:#0f172a;
    direction:ltr;
}
.comparison-progress span{
    display:block;
    margin-top:7px;
    color:#475569;
    font-size:12px;
    font-weight:900;
}
.comparison-card-stats{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
    margin-top:12px;
}
.comparison-card-stats div{
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#f8fafc;
    padding:9px;
    min-width:0;
}
.comparison-card-stats span{
    display:block;
    color:#64748b;
    font-size:11px;
    font-weight:900;
}
.comparison-card-stats strong{
    display:block;
    margin-top:3px;
    color:#1f2937;
    font-size:13px;
    font-weight:900;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    direction:ltr;
    text-align:inherit;
}
.comparison-table-wrap{
    overflow:auto;
    border:1px solid #e2e8f0;
    border-radius:12px;
    background:#fff;
    box-shadow:0 14px 32px rgba(15,23,42,.08);
}
.comparison-table{
    width:100%;
    min-width:1080px;
    border-collapse:separate;
    border-spacing:0;
}
.comparison-table th{
    position:sticky;
    top:0;
    z-index:1;
    background:#f8fafc;
    color:#334155;
    padding:13px 12px;
    border-bottom:1px solid #e2e8f0;
    font-size:12px;
    font-weight:900;
    text-align:inherit;
    white-space:nowrap;
}
.comparison-table td{
    padding:13px 12px;
    border-bottom:1px solid #edf2f7;
    color:#1f2937;
    font-size:13px;
    font-weight:800;
    white-space:nowrap;
}
.comparison-table tbody tr:hover{background:#f8fafc}
.comparison-table tbody tr:last-child td{border-bottom:0}
.comparison-table strong{display:block;color:#0f172a;font-size:14px}
.comparison-table small{display:block;color:#64748b;font-weight:900;direction:ltr}
.comparison-table .num{direction:ltr;text-align:inherit}
.comparison-table .positive{color:#047857}
.comparison-table .negative{color:#b91c1c}
.comparison-table .warning{color:#c2410c}
@media(max-width:980px){
    .header-shell{align-items:flex-start;flex-wrap:wrap}
    .main-nav{order:3;width:100%;flex-basis:100%;padding-block:8px 2px}
    .header-actions{margin-inline-start:auto}
    .dashboard-hero{grid-template-columns:1fr}
}
@media(max-width:720px){
    .app-header{padding:12px}
    .header-shell{gap:10px}
    .brand-mark{width:40px;height:40px;border-radius:12px}
    .brand-copy strong{font-size:21px}
    .brand-copy small{font-size:10px}
    .header-actions{width:100%;justify-content:space-between}
    .main-nav{gap:7px}
    .nav-pill{padding:9px 12px;font-size:13px}
    .wrap{margin:16px auto;padding:0 12px}
    .panel{padding:15px}
    .button{padding:9px 12px}
    .dashboard-hero-copy,.dashboard-profile-card{padding:20px}
    .dashboard-hero h1{font-size:27px}
    .section-heading{align-items:flex-start;flex-direction:column}
    .dashboard-grid,.showrooms-grid,.quick-actions-grid{grid-template-columns:1fr}
    .vehicles-hero,.filter-heading,.results-bar{align-items:flex-start;flex-direction:column}
    .vehicle-cards-grid{grid-template-columns:1fr}
    .customers-hero{align-items:flex-start;flex-direction:column}
    .customer-cards-grid{grid-template-columns:1fr}
    .contracts-hero{align-items:flex-start;flex-direction:column}
    .contract-cards-grid{grid-template-columns:1fr}
    .contract-financial-strip{grid-template-columns:1fr 1fr}
    .installments-hero{align-items:flex-start;flex-direction:column}
    .installment-cards-grid{grid-template-columns:1fr}
    .installment-financial-strip{grid-template-columns:1fr}
    .installment-details{grid-template-columns:1fr}
    .payments-hero{align-items:flex-start;flex-direction:column}
    .payment-cards-grid{grid-template-columns:1fr}
    .payment-details{grid-template-columns:1fr}
    .payment-receipt-strip{grid-template-columns:1fr}
    .expenses-hero{align-items:flex-start;flex-direction:column}
    .expense-cards-grid{grid-template-columns:1fr}
    .expense-details{grid-template-columns:1fr}
    .reports-hero{align-items:flex-start;flex-direction:column}
    .reports-comparison-grid,.report-shortcut-grid{grid-template-columns:1fr}
    .reports-showroom-card dl{grid-template-columns:1fr}
    .comparison-hero{align-items:flex-start;flex-direction:column;padding:18px}
    .comparison-hero h1{font-size:25px}
    .comparison-hero-total{width:100%;min-width:0}
    .comparison-section-heading{align-items:flex-start;flex-direction:column}
    .comparison-performance-grid,.comparison-insights-grid,.comparison-kpi-grid{grid-template-columns:1fr}
    .comparison-card-stats{grid-template-columns:1fr}
}
@media(max-width:440px){
    .brand-copy small{display:none}
    .header-actions{align-items:stretch}
    .language-switcher{justify-content:center}
    .language-trigger{width:100%;justify-content:center}
    .logout-button{width:100%;padding-inline:12px}
}
