/*
 * Modus Customer Commerce UI — design tokens
 * FOSSBilling client theme (huraga) customisation for Modus Systems.
 * Loaded after build/css/huraga.css. Do not remove the --mc- prefix.
 */

:root {
    /* ---- Colour: Brand ---- */
    --mc-color-primary-50: #eef3ff;
    --mc-color-primary-100: #dce6ff;
    --mc-color-primary-200: #bdceff;
    --mc-color-primary-300: #91adff;
    --mc-color-primary-400: #6385ff;
    --mc-color-primary-500: #3f63ff;
    --mc-color-primary-600: #2b4ff5;
    --mc-color-primary-700: #223fd8;
    --mc-color-primary-800: #2037ae;
    --mc-color-primary-900: #20338a;
    --mc-color-primary-950: #172056;

    /* ---- Colour: Accent ---- */
    --mc-color-accent-50: #ecfdf9;
    --mc-color-accent-100: #cff9ef;
    --mc-color-accent-200: #a3f2e1;
    --mc-color-accent-300: #66e5cf;
    --mc-color-accent-400: #2bd0b8;
    --mc-color-accent-500: #0fb59f;
    --mc-color-accent-600: #079281;
    --mc-color-accent-700: #087569;
    --mc-color-accent-800: #095d55;
    --mc-color-accent-900: #094d47;

    /* ---- Colour: Neutral (ink) ---- */
    --mc-color-ink-950: #0b1020;
    --mc-color-ink-900: #11182b;
    --mc-color-ink-800: #1b253b;
    --mc-color-ink-700: #303c53;
    --mc-color-ink-600: #4b5870;
    --mc-color-ink-500: #68758a;
    --mc-color-ink-400: #929cad;
    --mc-color-ink-300: #c0c6d1;
    --mc-color-ink-200: #dde1e8;
    --mc-color-ink-100: #edf0f4;
    --mc-color-ink-50: #f7f8fb;
    --mc-color-white: #ffffff;

    /* ---- Colour: Semantic ---- */
    --mc-color-success: #087f5b;
    --mc-color-success-bg: #e9f8f1;
    --mc-color-warning: #9a6700;
    --mc-color-warning-bg: #fff5d6;
    --mc-color-danger: #c92a2a;
    --mc-color-danger-bg: #fff0f0;
    --mc-color-info: #1c5d99;
    --mc-color-info-bg: #edf6ff;

    /* ---- Colour: Surfaces ---- */
    --mc-surface-page: #f7f8fb;
    --mc-surface-raised: #ffffff;
    --mc-surface-subtle: #eef2f7;
    --mc-surface-dark: #0b1020;
    --mc-surface-dark-raised: #121a2e;

    /* ---- Colour: Text ---- */
    --mc-text-primary: #0b1020;
    --mc-text-secondary: #4b5870;
    --mc-text-muted: #68758a;
    --mc-text-inverse: #ffffff;

    /* ---- Colour: Border ---- */
    --mc-border-subtle: #e1e5ec;
    --mc-border-strong: #c4cad5;
    --mc-border-focus: #3f63ff;

    /* ---- Soft commercial stages (hero / closing panel only) ---- */
    --mc-gradient-hero: linear-gradient(180deg, #ffffff 0%, #fbfcff 42%, #eef5ff 100%);
    --mc-gradient-closing: linear-gradient(180deg, #fbfcff 0%, #f4f8ff 100%);

    /* ---- Typography: families ---- */
    --mc-font-display: "Manrope", "Inter", ui-sans-serif, system-ui, -apple-system,
        BlinkMacSystemFont, "Segoe UI", sans-serif;
    --mc-font-body: "Inter", ui-sans-serif, system-ui, -apple-system,
        BlinkMacSystemFont, "Segoe UI", sans-serif;
    --mc-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
        "Liberation Mono", monospace;

    /* ---- Typography: scale ---- */
    --mc-text-xs: 0.75rem;
    --mc-text-sm: 0.875rem;
    --mc-text-base: 1rem;
    --mc-text-lg: 1.125rem;
    --mc-text-xl: 1.25rem;
    --mc-text-2xl: 1.5rem;
    --mc-text-3xl: 1.875rem;
    --mc-text-4xl: 2.25rem;
    --mc-text-5xl: 3rem;
    --mc-text-6xl: 3.75rem;
    --mc-text-7xl: 4.5rem;

    /* ---- Spacing (4px base) ---- */
    --mc-space-0: 0;
    --mc-space-1: 0.25rem;
    --mc-space-2: 0.5rem;
    --mc-space-3: 0.75rem;
    --mc-space-4: 1rem;
    --mc-space-5: 1.25rem;
    --mc-space-6: 1.5rem;
    --mc-space-8: 2rem;
    --mc-space-10: 2.5rem;
    --mc-space-12: 3rem;
    --mc-space-16: 4rem;
    --mc-space-20: 5rem;
    --mc-space-24: 6rem;
    --mc-space-28: 7rem;
    --mc-space-32: 8rem;

    /* ---- Containers / grid ---- */
    --mc-container-sm: 720px;
    --mc-container-md: 960px;
    --mc-container-lg: 1200px;
    --mc-container-xl: 1320px;
    --mc-page-gutter: clamp(1rem, 4vw, 2rem);
    --mc-storefront-max: 1320px;
    --mc-portal-max: 1920px;

    /* ---- Radii ---- */
    --mc-radius-xs: 4px;
    --mc-radius-sm: 6px;
    --mc-radius-md: 8px;
    --mc-radius-lg: 8px;
    --mc-radius-xl: 12px;
    --mc-radius-pill: 999px;

    /* ---- Shadows ---- */
    --mc-shadow-xs: 0 1px 2px rgba(11, 16, 32, 0.05);
    --mc-shadow-sm: 0 6px 18px rgba(11, 16, 32, 0.07);
    --mc-shadow-md: 0 14px 36px rgba(11, 16, 32, 0.10);
    --mc-shadow-lg: 0 24px 70px rgba(11, 16, 32, 0.14);

    /* ---- Motion ---- */
    --mc-duration-fast: 120ms;
    --mc-duration-normal: 200ms;
    --mc-duration-slow: 320ms;
    --mc-ease-standard: cubic-bezier(0.2, 0, 0, 1);
}

/* ---- Map Modus tokens onto Bootstrap variables Huraga already relies on ---- */
:root,
[data-bs-theme="light"] {
    --bs-primary: var(--mc-color-primary-600);
    --bs-primary-rgb: 43, 79, 245;
    --bs-body-font-family: var(--mc-font-body);
    --bs-body-color: var(--mc-text-primary);
    --bs-body-bg: var(--mc-surface-page);
    --bs-border-color: var(--mc-border-subtle);
    --bs-border-radius: var(--mc-radius-sm);
    --bs-border-radius-lg: var(--mc-radius-lg);
}