/* ════════════════════════════════
   CSS VARIABLES — Design tokens
   Loaded first, inherited by all CSS files.
════════════════════════════════ */

:root {
    /* ── Brand colors ── */
    --accent: #7C9EFF;
    --accent2: #C3B8F8;
    --green: #5ecfae;
    --red: #FF6B8A;
    --orange: #FFB86C;
    --pink: #FF7EB3;

    /* ── Text ── */
    --text: #1a1a2e;
    --muted: #8a8fa8;

    /* ── Background ── */
    --bg: #f0f2fb;

    /* ── Glassmorphism ── */
    --glass-bg: rgba(255, 255, 255, 0.55);
    --glass-border: rgba(255, 255, 255, 0.85);
    --glass-shadow: 0 8px 48px rgba(120, 130, 160, 0.13);
    --blur: blur(18px);

    /* ── Inputs ── */
    --input-bg: rgba(255, 255, 255, 0.7);
    --input-border: rgba(200, 210, 240, 0.6);
    --input-radius: 11px;

    /* ── Layout ── */
    --radius: 20px;
    --radius-sm: 12px;
    --radius-xs: 8px;

    /* ── Gradients ── */
    --gradient-accent: linear-gradient(135deg, var(--accent), var(--accent2));
    --gradient-green: linear-gradient(135deg, var(--green), var(--accent));
    --gradient-red: linear-gradient(135deg, var(--red), var(--pink));

    /* ── Form ── */
    --required: #e06b8a;

    /* ── Admin sidebar ── */
    --sw: 240px;
}