/*!
 * SEA GOLD Framework
 * FOUND-001 — Design Tokens
 * Version: 0.1.0
 * Status: Draft
 * Owner: SEA Sistemi
 */

:root {
    /* =====================================================
       01. COLORS — PRIMITIVE
       ===================================================== */

    /* Brand — SEA Blue */
    --sea-color-blue-50: #eff6ff;
    --sea-color-blue-100: #dbeafe;
    --sea-color-blue-200: #bfdbfe;
    --sea-color-blue-300: #93c5fd;
    --sea-color-blue-400: #60a5fa;
    --sea-color-blue-500: #3b82f6;
    --sea-color-blue-600: #2563eb;
    --sea-color-blue-700: #1d4ed8;
    --sea-color-blue-800: #1e40af;
    --sea-color-blue-900: #1e3a8a;
    --sea-color-blue-950: #172554;

    /* Brand — SEA Orange */
    --sea-color-orange-50: #fff7ed;
    --sea-color-orange-100: #ffedd5;
    --sea-color-orange-200: #fed7aa;
    --sea-color-orange-300: #fdba74;
    --sea-color-orange-400: #fb923c;
    --sea-color-orange-500: #f97316;
    --sea-color-orange-600: #ea580c;
    --sea-color-orange-700: #c2410c;
    --sea-color-orange-800: #9a3412;
    --sea-color-orange-900: #7c2d12;
    --sea-color-orange-950: #431407;

    /* Brand — SEA Aqua */
    --sea-color-aqua-50: #ecfeff;
    --sea-color-aqua-100: #cffafe;
    --sea-color-aqua-200: #a5f3fc;
    --sea-color-aqua-300: #67e8f9;
    --sea-color-aqua-400: #22d3ee;
    --sea-color-aqua-500: #06b6d4;
    --sea-color-aqua-600: #0891b2;
    --sea-color-aqua-700: #0e7490;
    --sea-color-aqua-800: #155e75;
    --sea-color-aqua-900: #164e63;
    --sea-color-aqua-950: #083344;

    /* Neutral */
    --sea-color-neutral-0: #ffffff;
    --sea-color-neutral-50: #f8fafc;
    --sea-color-neutral-100: #f1f5f9;
    --sea-color-neutral-200: #e2e8f0;
    --sea-color-neutral-300: #cbd5e1;
    --sea-color-neutral-400: #94a3b8;
    --sea-color-neutral-500: #64748b;
    --sea-color-neutral-600: #475569;
    --sea-color-neutral-700: #334155;
    --sea-color-neutral-800: #1e293b;
    --sea-color-neutral-900: #0f172a;
    --sea-color-neutral-950: #020617;

    /* Success */
    --sea-color-green-50: #f0fdf4;
    --sea-color-green-100: #dcfce7;
    --sea-color-green-500: #22c55e;
    --sea-color-green-600: #16a34a;
    --sea-color-green-700: #15803d;
    --sea-color-green-900: #14532d;

    /* Warning */
    --sea-color-amber-50: #fffbeb;
    --sea-color-amber-100: #fef3c7;
    --sea-color-amber-500: #f59e0b;
    --sea-color-amber-600: #d97706;
    --sea-color-amber-700: #b45309;
    --sea-color-amber-900: #78350f;

    /* Danger */
    --sea-color-red-50: #fef2f2;
    --sea-color-red-100: #fee2e2;
    --sea-color-red-500: #ef4444;
    --sea-color-red-600: #dc2626;
    --sea-color-red-700: #b91c1c;
    --sea-color-red-900: #7f1d1d;

    /* Information */
    --sea-color-cyan-50: #ecfeff;
    --sea-color-cyan-100: #cffafe;
    --sea-color-cyan-500: #06b6d4;
    --sea-color-cyan-600: #0891b2;
    --sea-color-cyan-700: #0e7490;
    --sea-color-cyan-900: #164e63;

    /* =====================================================
       02. COLORS — SEMANTIC
       ===================================================== */

    /* Brand */
    --sea-color-brand-primary: var(--sea-color-blue-700);
    --sea-color-brand-primary-hover: var(--sea-color-blue-800);
    --sea-color-brand-primary-active: var(--sea-color-blue-900);
    --sea-color-brand-secondary: var(--sea-color-aqua-600);
    --sea-color-brand-accent: var(--sea-color-orange-500);

    /* Text */
    --sea-color-text: var(--sea-color-neutral-900);
    --sea-color-text-strong: var(--sea-color-neutral-950);
    --sea-color-text-muted: var(--sea-color-neutral-600);
    --sea-color-text-subtle: var(--sea-color-neutral-500);
    --sea-color-text-inverse: var(--sea-color-neutral-0);
    --sea-color-text-link: var(--sea-color-blue-700);
    --sea-color-text-link-hover: var(--sea-color-blue-900);

    /* Surface */
    --sea-color-surface: var(--sea-color-neutral-0);
    --sea-color-surface-subtle: var(--sea-color-neutral-50);
    --sea-color-surface-muted: var(--sea-color-neutral-100);
    --sea-color-surface-strong: var(--sea-color-neutral-900);
    --sea-color-surface-brand: var(--sea-color-blue-700);
    --sea-color-surface-accent: var(--sea-color-orange-500);
    --sea-color-surface-overlay: rgba(15, 23, 42, 0.72);

    /* Border */
    --sea-color-border: var(--sea-color-neutral-200);
    --sea-color-border-strong: var(--sea-color-neutral-300);
    --sea-color-border-subtle: var(--sea-color-neutral-100);
    --sea-color-border-inverse: rgba(255, 255, 255, 0.28);

    /* Action */
    --sea-color-action: var(--sea-color-blue-700);
    --sea-color-action-hover: var(--sea-color-blue-800);
    --sea-color-action-active: var(--sea-color-blue-900);
    --sea-color-action-disabled: var(--sea-color-neutral-300);
    --sea-color-on-action: var(--sea-color-neutral-0);

    /* Feedback */
    --sea-color-success: var(--sea-color-green-600);
    --sea-color-success-surface: var(--sea-color-green-50);
    --sea-color-warning: var(--sea-color-amber-600);
    --sea-color-warning-surface: var(--sea-color-amber-50);
    --sea-color-danger: var(--sea-color-red-600);
    --sea-color-danger-surface: var(--sea-color-red-50);
    --sea-color-information: var(--sea-color-cyan-600);
    --sea-color-information-surface: var(--sea-color-cyan-50);

    /* =====================================================
       03. TYPOGRAPHY
       ===================================================== */

    --sea-font-family-sans: "Maven Pro", Arial, sans-serif;
    --sea-font-family-display: "Maven Pro", Arial, sans-serif;
    --sea-font-family-mono: Consolas, "Courier New", monospace;

    --sea-font-size-1: 0.75rem;
    --sea-font-size-2: 0.8125rem;
    --sea-font-size-3: 0.9375rem;
    --sea-font-size-4: 1rem;
    --sea-font-size-5: 1.125rem;
    --sea-font-size-6: 1.25rem;
    --sea-font-size-7: 1.5rem;
    --sea-font-size-8: 1.875rem;
    --sea-font-size-9: 2rem;
    --sea-font-size-10: 2.5rem;
    --sea-font-size-11: 3rem;
    --sea-font-size-12: 4rem;

    --sea-font-weight-regular: 400;
    --sea-font-weight-medium: 500;
    --sea-font-weight-semibold: 600;
    --sea-font-weight-bold: 700;

    --sea-line-height-tight: 1.1;
    --sea-line-height-snug: 1.25;
    --sea-line-height-normal: 1.5;
    --sea-line-height-relaxed: 1.7;

    --sea-letter-spacing-tight: -0.02em;
    --sea-letter-spacing-normal: 0;
    --sea-letter-spacing-wide: 0.04em;
    --sea-letter-spacing-wider: 0.08em;

    --sea-text-body-size: var(--sea-font-size-3);
    --sea-text-body-line-height: var(--sea-line-height-normal);
    --sea-text-action-size: var(--sea-font-size-3);
    --sea-text-h1-size: var(--sea-font-size-9);
    --sea-text-h2-size: var(--sea-font-size-8);

    /* =====================================================
       04. SPACING
       ===================================================== */

    --sea-space-0: 0;
    --sea-space-1: 0.25rem;
    --sea-space-2: 0.5rem;
    --sea-space-3: 0.75rem;
    --sea-space-4: 1rem;
    --sea-space-5: 1.25rem;
    --sea-space-6: 1.5rem;
    --sea-space-8: 2rem;
    --sea-space-10: 2.5rem;
    --sea-space-12: 3rem;
    --sea-space-16: 4rem;
    --sea-space-20: 5rem;
    --sea-space-24: 6rem;
    --sea-space-32: 8rem;

    --sea-gap-xs: var(--sea-space-2);
    --sea-gap-sm: var(--sea-space-4);
    --sea-gap-md: var(--sea-space-6);
    --sea-gap-lg: var(--sea-space-8);
    --sea-gap-xl: var(--sea-space-12);

    --sea-section-space-compact: var(--sea-space-8);
    --sea-section-space-default: var(--sea-space-12);
    --sea-section-space-spacious: var(--sea-space-16);

    /* =====================================================
       05. SIZING
       ===================================================== */

    --sea-size-touch-min: 2.75rem;
    --sea-size-icon-sm: 1rem;
    --sea-size-icon-md: 1.25rem;
    --sea-size-icon-lg: 1.5rem;
    --sea-size-control-sm: 2.25rem;
    --sea-size-control-md: 2.75rem;
    --sea-size-control-lg: 3.25rem;

    /* =====================================================
       06. RADIUS
       ===================================================== */

    --sea-radius-none: 0;
    --sea-radius-xs: 0.25rem;
    --sea-radius-sm: 0.5rem;
    --sea-radius-md: 0.75rem;
    --sea-radius-lg: 1rem;
    --sea-radius-xl: 1.5rem;
    --sea-radius-2xl: 2rem;
    --sea-radius-pill: 999rem;
    --sea-radius-circle: 50%;

    /* =====================================================
       07. BORDERS
       ===================================================== */

    --sea-border-width-0: 0;
    --sea-border-width-1: 1px;
    --sea-border-width-2: 2px;
    --sea-border-width-3: 3px;

    --sea-border-default: var(--sea-border-width-1) solid var(--sea-color-border);
    --sea-border-strong: var(--sea-border-width-1) solid var(--sea-color-border-strong);

    /* =====================================================
       08. SHADOWS
       ===================================================== */

    --sea-shadow-none: none;
    --sea-shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.06);
    --sea-shadow-sm: 0 2px 8px rgba(15, 23, 42, 0.08);
    --sea-shadow-md: 0 8px 24px rgba(15, 23, 42, 0.10);
    --sea-shadow-lg: 0 16px 40px rgba(15, 23, 42, 0.14);
    --sea-shadow-xl: 0 24px 64px rgba(15, 23, 42, 0.18);

    /* =====================================================
       09. ELEVATION
       ===================================================== */

    --sea-elevation-0: var(--sea-shadow-none);
    --sea-elevation-1: var(--sea-shadow-xs);
    --sea-elevation-2: var(--sea-shadow-sm);
    --sea-elevation-3: var(--sea-shadow-md);
    --sea-elevation-4: var(--sea-shadow-lg);
    --sea-elevation-5: var(--sea-shadow-xl);

    /* =====================================================
       10. CONTAINERS
       ===================================================== */

    --sea-container-narrow: 47.5rem;
    --sea-container-standard: 75rem;
    --sea-container-wide: 90rem;
    --sea-container-full: none;
    --sea-container-gutter: 2rem;
    --sea-container-gutter-mobile: 1rem;

    /* =====================================================
       11. BREAKPOINTS
       ===================================================== */

    --sea-breakpoint-sm: 30rem;
    --sea-breakpoint-md: 48rem;
    --sea-breakpoint-lg: 64rem;
    --sea-breakpoint-xl: 80rem;
    --sea-breakpoint-2xl: 90rem;

    /* =====================================================
       12. Z-INDEX
       ===================================================== */

    --sea-z-base: 0;
    --sea-z-raised: 10;
    --sea-z-dropdown: 100;
    --sea-z-sticky: 200;
    --sea-z-overlay: 300;
    --sea-z-modal: 400;
    --sea-z-toast: 500;
    --sea-z-max: 999;

    /* =====================================================
       13. MOTION — DURATION
       ===================================================== */

    --sea-duration-instant: 0ms;
    --sea-duration-fast: 120ms;
    --sea-duration-normal: 200ms;
    --sea-duration-slow: 320ms;
    --sea-duration-slower: 480ms;

    /* =====================================================
       14. MOTION — EASING
       ===================================================== */

    --sea-ease-linear: linear;
    --sea-ease-standard: cubic-bezier(0.2, 0, 0, 1);
    --sea-ease-emphasized: cubic-bezier(0.2, 0, 0, 1);
    --sea-ease-enter: cubic-bezier(0, 0, 0.2, 1);
    --sea-ease-exit: cubic-bezier(0.4, 0, 1, 1);

    /* =====================================================
       15. FOCUS
       ===================================================== */

    --sea-focus-color: #2563eb;
    --sea-focus-separation-color: #ffffff;
    --sea-focus-width: 3px;
    --sea-focus-offset: 4px;
    --sea-focus-separation-width: 2px;

    /* =====================================================
       16. OPACITY
       ===================================================== */

    --sea-opacity-0: 0;
    --sea-opacity-10: 0.1;
    --sea-opacity-20: 0.2;
    --sea-opacity-40: 0.4;
    --sea-opacity-60: 0.6;
    --sea-opacity-80: 0.8;
    --sea-opacity-100: 1;
}

/* =========================================================
   DARK THEME — SEMANTIC TOKEN OVERRIDES
   Experimental: non certificato in FOUND-001 v0.1.0
   ========================================================= */

[data-sea-theme="dark"] {
    --sea-color-text: var(--sea-color-neutral-100);
    --sea-color-text-strong: var(--sea-color-neutral-0);
    --sea-color-text-muted: var(--sea-color-neutral-300);
    --sea-color-text-subtle: var(--sea-color-neutral-400);
    --sea-color-text-inverse: var(--sea-color-neutral-950);

    --sea-color-surface: var(--sea-color-neutral-950);
    --sea-color-surface-subtle: var(--sea-color-neutral-900);
    --sea-color-surface-muted: var(--sea-color-neutral-800);
    --sea-color-surface-strong: var(--sea-color-neutral-0);

    --sea-color-border: var(--sea-color-neutral-700);
    --sea-color-border-strong: var(--sea-color-neutral-600);

    --sea-color-text-link: var(--sea-color-blue-300);
    --sea-color-text-link-hover: var(--sea-color-blue-200);

    --sea-focus-separation-color: var(--sea-color-neutral-950);
}

@media (max-width: 47.999rem) {
    :root {
        --sea-container-gutter: var(--sea-container-gutter-mobile);
        --sea-section-space-compact: var(--sea-space-8);
        --sea-section-space-default: var(--sea-space-12);
        --sea-section-space-spacious: var(--sea-space-16);
    }
}

@media (min-width: 48rem) {
    :root {
        --sea-section-space-compact: var(--sea-space-10);
        --sea-section-space-default: var(--sea-space-16);
        --sea-section-space-spacious: var(--sea-space-20);
    }
}

@media (min-width: 64rem) {
    :root {
        --sea-section-space-compact: var(--sea-space-10);
        --sea-section-space-default: var(--sea-space-16);
        --sea-section-space-spacious: var(--sea-space-24);
    }
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --sea-duration-fast: 0ms;
        --sea-duration-normal: 0ms;
        --sea-duration-slow: 0ms;
        --sea-duration-slower: 0ms;
    }
}