/* ==========================================
   KNOWLEDGE Portal
   Design System Variables
   ========================================== */

:root{

    /* ===== Brand Colors ===== */

    --primary:#0F4C81;
    --primary-light:#1D73BE;
    --primary-dark:#0A3558;

    --secondary:#22C55E;
    --accent:#F59E0B;

    --danger:#EF4444;
    --warning:#FACC15;
    --success:#16A34A;
    --info:#0EA5E9;

    /* ===== Background ===== */

    --background:#F5F7FB;
    --surface:#FFFFFF;
    --surface-hover:#F3F6FA;

    /* ===== Text ===== */

    --text:#1F2937;
    --text-light:#6B7280;
    --text-muted:#94A3B8;

    /* ===== Borders ===== */

    --border:#E5E7EB;
    --divider:#EDF2F7;

    /* ===== Sidebar ===== */

    --sidebar-bg:#0F172A;
    --sidebar-hover:#1E293B;
    --sidebar-active:#2563EB;

    /* ===== Radius ===== */

    --radius-xs:6px;
    --radius-sm:10px;
    --radius-md:16px;
    --radius-lg:22px;
    --radius-xl:30px;

    /* ===== Shadow ===== */

    --shadow-sm:
        0 2px 6px rgba(0,0,0,.05);

    --shadow-md:
        0 10px 30px rgba(0,0,0,.08);

    --shadow-lg:
        0 20px 50px rgba(0,0,0,.12);

    /* ===== Glass Effect ===== */

    --glass-bg:
        rgba(255,255,255,.70);

    --glass-border:
        rgba(255,255,255,.30);

    --blur:18px;

    /* ===== Transition ===== */

    --transition:.30s ease;

    /* ===== Fonts ===== */

    --font-family:
        "Inter",
        sans-serif;

    /* ===== Layout ===== */

    --sidebar-width:280px;

    --topbar-height:72px;

}