/*
==========================================================
FantasyFanzone Design System
Design Tokens
Version: 4.1
==========================================================
*/

:root{

/*======================================================
COLORS
======================================================*/

--ffz-primary:#7C3AED;
--ffz-primary-hover:#6D28D9;
--ffz-primary-light:#A855F7;

--ffz-secondary:#10B981;
--ffz-secondary-hover:#059669;

--ffz-accent:#F59E0B;

--ffz-success:#22C55E;
--ffz-warning:#FACC15;
--ffz-danger:#EF4444;
--ffz-info:#3B82F6;

/*======================================================
BACKGROUND
======================================================*/

--ffz-background:#0B1020;

--ffz-surface:#151C32;
--ffz-surface-light:#1E293B;

--ffz-card:#111827;
--ffz-card-hover:#1B2438;

/*======================================================
TEXT
======================================================*/

--ffz-text:#F8FAFC;
--ffz-text-muted:#94A3B8;
--ffz-text-dark:#CBD5E1;
--ffz-heading:#FFFFFF;

/*======================================================
BORDERS
======================================================*/

--ffz-border:#334155;
--ffz-border-light:#475569;
--ffz-border-hover:#64748B;

/*======================================================
GRADIENTS
======================================================*/

--ffz-gradient-primary:
linear-gradient(
    135deg,
    #7C3AED 0%,
    #9333EA 100%
);

--ffz-gradient-secondary:
linear-gradient(
    135deg,
    #10B981 0%,
    #059669 100%
);

--ffz-gradient-dark:
linear-gradient(
    180deg,
    #0B1020 0%,
    #111827 100%
);

/*======================================================
TYPOGRAPHY
======================================================*/

--ffz-font-family:
"Inter",
system-ui,
-apple-system,
BlinkMacSystemFont,
"Segoe UI",
Roboto,
Helvetica,
Arial,
sans-serif;

--ffz-font-size-xs:.75rem;
--ffz-font-size-sm:.875rem;
--ffz-font-size-base:1rem;
--ffz-font-size-lg:1.125rem;
--ffz-font-size-xl:1.25rem;
--ffz-font-size-2xl:1.5rem;
--ffz-font-size-3xl:2rem;
--ffz-font-size-4xl:2.5rem;
--ffz-font-size-5xl:3.5rem;

--ffz-font-weight-normal:400;
--ffz-font-weight-medium:500;
--ffz-font-weight-semibold:600;
--ffz-font-weight-bold:700;
--ffz-font-weight-extra-bold:800;

--ffz-line-height:1.6;

/*======================================================
SPACING
======================================================*/

--ffz-space-1:.25rem;
--ffz-space-2:.5rem;
--ffz-space-3:.75rem;
--ffz-space-4:1rem;
--ffz-space-5:1.25rem;
--ffz-space-6:1.5rem;
--ffz-space-7:2rem;
--ffz-space-8:2.5rem;
--ffz-space-9:3rem;
--ffz-space-10:4rem;
--ffz-space-11:5rem;
--ffz-space-12:6rem;

/*======================================================
RADIUS
======================================================*/

--ffz-radius-xs:6px;
--ffz-radius-sm:8px;
--ffz-radius-md:12px;
--ffz-radius-lg:16px;
--ffz-radius-xl:24px;
--ffz-radius-2xl:32px;
--ffz-radius-pill:999px;

/*======================================================
SHADOWS
======================================================*/

--ffz-shadow-sm:
0 2px 8px rgba(0,0,0,.15);

--ffz-shadow-md:
0 10px 25px rgba(0,0,0,.20);

--ffz-shadow-lg:
0 18px 45px rgba(0,0,0,.28);

--ffz-shadow-xl:
0 25px 70px rgba(0,0,0,.35);

/*======================================================
TRANSITIONS
======================================================*/

--ffz-transition-fast:.2s ease;
--ffz-transition-normal:.3s ease;
--ffz-transition-slow:.45s ease;

/*======================================================
LAYOUT
======================================================*/

--ffz-container:1280px;

--ffz-header-height:80px;

/*
 * Default vertical spacing for major sections.
 */
--ffz-section-padding:64px;

--ffz-grid-gap:32px;

--ffz-card-padding:24px;

/*======================================================
BUTTONS
======================================================*/

--ffz-button-height:48px;
--ffz-button-radius:12px;

/*======================================================
INPUTS
======================================================*/

--ffz-input-height:52px;
--ffz-input-radius:12px;

/*======================================================
Z INDEX
======================================================*/

--ffz-z-dropdown:100;
--ffz-z-sticky:500;
--ffz-z-fixed:700;
--ffz-z-overlay:900;
--ffz-z-modal:1000;
--ffz-z-toast:1100;

}