/* lic.eposlovanje.hr — Swiss Financial Precision dizajn sistem.
   Blokovi ".kai-*" su PRENESENI DOSLOVNO iz katica-knjigovodstvo2
   src/Client/BookkeepingSystem.Client/wwwroot/css/app.css (grep "kai-kpi-grid|kai-filter|kai-badge")
   — ISTI nazivi klasa, ISTE vrijednosti, da Lic.AdminUi renderira identično u oba domaćina
   (ovaj Host i Katičin WASM klijent, plan B1/B6, odluka iz intervjua t. 18/22). Blokovi ".lic-*"
   su NOVI, samo za elemente kojih Katičin app.css nema (appbar/drawer/kpi-tile/pager). */

:root {
    --font-body: 'DM Sans', sans-serif;
    --font-heading: 'Instrument Serif', serif;
    --font-mono: 'DM Mono', monospace;
    --kai: #3B82F6;
    --kv: #8B5CF6;
    --ks: #059669;
    --kd: #DC2626;
    --kw: #D97706;
    --bg: #F5F5F0;
    --r: 10px;
    --rs: 6px;
    --sb-bg: #0F172A;
}

/* ============================================================
   KAI DESIGN SYSTEM — preneseno iz Katice (kai-badge, kai-kpi-grid, kai-filter, kai-section)
   ============================================================ */
.kai-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.68rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 10px;
    white-space: nowrap;
}
.kai-badge-dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: currentColor;
    flex-shrink: 0;
}
.kai-badge-ok { background: #ECFDF5; color: #059669; }
.kai-badge-warn { background: #FFFBEB; color: #D97706; }
.kai-badge-err { background: #FEF2F2; color: #DC2626; }
.kai-badge-info { background: #EFF6FF; color: #2563EB; }
.kai-badge-sent { background: #EDE9FE; color: #5B21B6; }
.kai-badge-success { background: #ECFDF5; color: #059669; }
.kai-badge-warning { background: #FFFBEB; color: #D97706; }
.kai-badge-danger { background: #FEF2F2; color: #DC2626; }
.kai-badge-default { background: #F1F5F9; color: #64748B; }

.kai-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 16px;
}
@media (max-width: 1200px) { .kai-kpi-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .kai-kpi-grid { grid-template-columns: 1fr; } }

.kai-kpi-clickable:hover { transform: translateY(-1px); box-shadow: 0 2px 8px rgba(15,23,42,0.08); }

.kai-mono { font-family: var(--font-mono); }
.kai-pos { color: #059669; }
.kai-neg { color: #DC2626; }
.kai-warn-val { color: #D97706; }

.mud-table .mud-table-head th {
    font-size: 0.65rem !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748B !important;
}

.kai-section {
    background: #fff;
    border: 1px solid #E8EBF0;
    border-radius: var(--r);
    padding: 16px;
    margin-bottom: 12px;
}

.kai-filter {
    background: #fff;
    border: 1px solid #E8EBF0;
    border-radius: var(--r);
    padding: 10px 14px;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}

.kai-banner {
    padding: 10px 14px;
    border-radius: var(--rs);
    font-size: 0.72rem;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.kai-banner-info { background: #EFF6FF; border: 1px solid #BFDBFE; color: #1E40AF; }
.kai-banner-warn { background: #FFFBEB; border: 1px solid #FDE68A; color: #92400E; }
.kai-banner-success { background: #ECFDF5; border: 1px solid #A7F3D0; color: #065F46; }
.kai-banner-error { background: #FEF2F2; border: 1px solid #FECACA; color: #991B1B; }

.money, .number {
    font-family: var(--font-heading);
    font-variant-numeric: tabular-nums;
}

/* ============================================================
   LIC — layout (appbar/drawer/content) i komponente kojih Katičin app.css nema
   ============================================================ */
body { font-family: var(--font-body); background: var(--bg); }

.lic-appbar { background: var(--sb-bg) !important; color: #fff; height: 52px; }
.lic-appbar-title { font-family: var(--font-heading); color: #fff; }
.lic-appbar-sub { color: #94A3B8; }

.lic-drawer { background: var(--sb-bg) !important; }
.lic-nav .mud-nav-link { color: #CBD5E1 !important; }
.lic-nav .mud-nav-link.active { color: #fff !important; background: rgba(59,130,246,0.18) !important; }

/* Gornji razmak = visina app bara (MudMainContent ga računa iz --mud-appbar-height; kratki `padding`
   ga je pregazio pa je zaglavlje stranice završilo ISPOD app bara — Playwright snimka 17.09.). */
.lic-content { padding: calc(var(--mud-appbar-height, 52px) + 20px) 20px 20px 20px; }

.lic-page-header { margin-bottom: 16px; }
.lic-page-header-icon { color: var(--kai); }
.lic-page-header-title { font-family: var(--font-heading); }
.lic-page-header-subtitle { color: #64748B; }

.lic-kpi-tile {
    background: #fff;
    border: 1px solid #E8EBF0;
    border-left-width: 3px;
    border-radius: var(--r);
    padding: 12px 14px;
}
.lic-kpi-border-kai { border-left-color: var(--kai); }
.lic-kpi-border-kv { border-left-color: var(--kv); }
.lic-kpi-border-ks { border-left-color: var(--ks); }
.lic-kpi-border-kd { border-left-color: var(--kd); }
.lic-kpi-border-kw { border-left-color: var(--kw); }
.lic-kpi-label { color: #64748B; letter-spacing: 0.04em; }
.lic-kpi-value { font-family: var(--font-heading); }
.lic-kpi-sub { color: #94A3B8; }

.lic-pager {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 8px 0;
    position: sticky;
    bottom: 0;
    background: #fff;
    border-top: 1px solid #E8EBF0;
}
.lic-pager-tekst { color: #64748B; min-width: 110px; text-align: center; }