/* ============================================================================
   iFMS Design Foundation
   ----------------------------------------------------------------------------
   The single source of truth for iFMS design tokens — the same foundation that
   is synced to Claude Design (claude.ai/design → "iFMS Design Foundation") and
   used by every design handoff under docs/designs/.

   Colors/type/spacing mirror the Radzen "Standard" theme; the brand palette is
   the iFMS logo color (#1A76FF). splan.css bridges the brand tokens onto
   Radzen's --rz-primary so all ButtonStyle.Primary controls match the logo.

   Design markup that references var(--ifms-*) resolves against this file
   app-wide. Keep it in sync with the synced foundation.
   ============================================================================ */

:root {
    /* ---- Brand (primary) ----
       The --ifms-brand* palette is defined in css/splan.css (it also bridges the
       brand onto Radzen's --rz-primary). Only --ifms-on-brand is added here. */
    --ifms-on-brand: #FFFFFF;

    /* ---- Secondary ---- */
    --ifms-secondary: #5d89f7;
    --ifms-secondary-lighter: rgba(93, 137, 247, 0.16);

    /* ---- Neutrals (Radzen "base" scale) ---- */
    --ifms-base-50: #ffffff;
    --ifms-base-100: #f4f5f9;
    --ifms-base-200: #e9eaed;
    --ifms-base-300: #e0e1e4;
    --ifms-base-400: #c9cacd;
    --ifms-base-500: #afafb2;
    --ifms-base-600: #8d8e90;
    --ifms-base-700: #707072;
    --ifms-base-800: #4f4f50;
    --ifms-base-900: #262526;

    /* ---- Semantic ---- */
    --ifms-info: #12a4f5;
    --ifms-info-dark: #0f8ace;
    --ifms-info-light: #38b3f7;
    --ifms-info-lighter: rgba(18, 164, 245, 0.16);
    --ifms-success: #009b51;
    --ifms-success-dark: #008244;
    --ifms-success-light: #29ab6d;
    --ifms-success-lighter: rgba(0, 155, 81, 0.16);
    --ifms-warning: #ffae11;
    --ifms-warning-dark: #d6920e;
    --ifms-warning-light: #ffbb37;
    --ifms-warning-lighter: rgba(255, 174, 17, 0.16);
    --ifms-danger: #f31155;
    --ifms-danger-dark: #cc0e47;
    --ifms-danger-light: #f53770;
    --ifms-danger-lighter: rgba(243, 17, 85, 0.16);

    /* ---- Surfaces & text roles ---- */
    --ifms-background: var(--ifms-base-100);
    --ifms-surface: #ffffff;
    --ifms-text: var(--ifms-base-800);
    --ifms-text-title: var(--ifms-base-900);
    --ifms-text-muted: var(--ifms-base-500);
    --ifms-border: var(--ifms-base-300);

    /* ---- FMS-specific accents ---- */
    --ifms-grey-200: #EBEEF2;
    --ifms-blue-8: rgba(26, 118, 255, 0.08);
    --ifms-surface-subtle: #F5F7F9;
    --ifms-tab-selected: #3481e5;
    --ifms-link: #0c2d6b;

    /* ---- Type ---- */
    --ifms-font-family: Urbanist, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

    /* ---- Radius / spacing / elevation ---- */
    --ifms-radius-sm: 4px;
    --ifms-radius: 8px;
    --ifms-radius-lg: 12px;
    --ifms-space-1: 0.25rem;
    --ifms-space-2: 0.5rem;
    --ifms-space-3: 0.75rem;
    --ifms-space-4: 1rem;
    --ifms-space-5: 1.25rem;
    --ifms-space-6: 1.5rem;
    --ifms-space-8: 2rem;
    --ifms-shadow-sm: 0 1px 2px rgba(38, 37, 38, 0.06);
    --ifms-shadow: 0 2px 8px rgba(38, 37, 38, 0.10);
    --ifms-shadow-lg: 0 8px 24px rgba(38, 37, 38, 0.14);
    --ifms-overlay: linear-gradient(to bottom, rgba(17, 19, 21, 0.5) 0%, rgba(17, 19, 21, 0.9) 100%);
}