/* ============================================
   Orvia Hotels - Frontend Design Tokens
   Prefix: --fe-*
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,400&display=swap');

:root {
    /* ── Brand Colors ── */
    --fe-primary: #1a3a5c;
    --fe-primary-light: #2a5a8c;
    --fe-primary-dark: #0e2340;
    --fe-accent: #c8956c;
    --fe-accent-light: #dbb895;
    --fe-accent-dark: #a87549;
    --fe-accent-glow: rgba(200, 149, 108, 0.15);

    /* ── Semantic Colors ── */
    --fe-success: #2d8a5e;
    --fe-success-light: #e8f5ef;
    --fe-warning: #d4920a;
    --fe-warning-light: #fef7e6;
    --fe-danger: #c03744;
    --fe-danger-light: #fce8ea;
    --fe-info: #2874a6;
    --fe-info-light: #e6f0f8;

    /* ── Neutrals ── */
    --fe-white: #ffffff;
    --fe-cream: #faf8f5;
    --fe-sand: #f3efe9;
    --fe-stone: #e8e2d9;
    --fe-gray-100: #f7f5f2;
    --fe-gray-200: #eae6e0;
    --fe-gray-300: #d4cfc7;
    --fe-gray-400: #b0a99e;
    --fe-gray-500: #8a8279;
    --fe-gray-600: #6b6560;
    --fe-gray-700: #4a4541;
    --fe-gray-800: #2d2926;
    --fe-gray-900: #1a1715;

    /* ── Text Colors ── */
    --fe-text: #2d2926;
    --fe-text-secondary: #6b6560;
    --fe-text-muted: #8a8279;
    --fe-text-inverse: #faf8f5;
    --fe-text-accent: #a87549;
    --fe-text-link: #1a3a5c;
    --fe-text-link-hover: #c8956c;

    /* ── Backgrounds ── */
    --fe-bg: #ffffff;
    --fe-bg-soft: #faf8f5;
    --fe-bg-muted: #f3efe9;
    --fe-bg-dark: #1a3a5c;
    --fe-bg-darker: #0e2340;
    --fe-bg-overlay: rgba(14, 35, 64, 0.6);
    --fe-bg-glass: rgba(255, 255, 255, 0.85);

    /* ── Borders ── */
    --fe-border: #e8e2d9;
    --fe-border-light: #f3efe9;
    --fe-border-dark: #d4cfc7;
    --fe-border-accent: rgba(200, 149, 108, 0.3);

    /* ── Typography ── */
    --fe-font-heading: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
    --fe-font-body: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    --fe-text-xs: 0.75rem;
    --fe-text-sm: 0.875rem;
    --fe-text-base: 1rem;
    --fe-text-lg: 1.125rem;
    --fe-text-xl: 1.25rem;
    --fe-text-2xl: 1.5rem;
    --fe-text-3xl: 2rem;
    --fe-text-4xl: 2.5rem;
    --fe-text-5xl: 3.25rem;
    --fe-text-6xl: 4rem;

    --fe-weight-light: 300;
    --fe-weight-normal: 400;
    --fe-weight-medium: 500;
    --fe-weight-semibold: 600;
    --fe-weight-bold: 700;

    --fe-leading-tight: 1.15;
    --fe-leading-snug: 1.3;
    --fe-leading-normal: 1.6;
    --fe-leading-relaxed: 1.75;

    --fe-tracking-tight: -0.02em;
    --fe-tracking-normal: 0;
    --fe-tracking-wide: 0.05em;
    --fe-tracking-wider: 0.1em;

    /* ── Spacing ── */
    --fe-space-1: 0.25rem;
    --fe-space-2: 0.5rem;
    --fe-space-3: 0.75rem;
    --fe-space-4: 1rem;
    --fe-space-5: 1.25rem;
    --fe-space-6: 1.5rem;
    --fe-space-8: 2rem;
    --fe-space-10: 2.5rem;
    --fe-space-12: 3rem;
    --fe-space-16: 4rem;
    --fe-space-20: 5rem;
    --fe-space-24: 6rem;
    --fe-space-32: 8rem;

    /* ── Layout ── */
    --fe-max-width: 1240px;
    --fe-max-width-narrow: 960px;
    --fe-max-width-wide: 1440px;
    --fe-sidebar-width: 300px;
    --fe-header-height: 72px;

    /* ── Borders & Radius ── */
    --fe-radius-sm: 4px;
    --fe-radius: 8px;
    --fe-radius-md: 10px;
    --fe-radius-lg: 16px;
    --fe-radius-xl: 24px;
    --fe-radius-full: 9999px;

    /* ── Shadows ── */
    --fe-shadow-xs: 0 1px 2px rgba(45, 41, 38, 0.04);
    --fe-shadow-sm: 0 2px 4px rgba(45, 41, 38, 0.06);
    --fe-shadow: 0 4px 12px rgba(45, 41, 38, 0.08);
    --fe-shadow-md: 0 8px 24px rgba(45, 41, 38, 0.1);
    --fe-shadow-lg: 0 16px 40px rgba(45, 41, 38, 0.12);
    --fe-shadow-xl: 0 24px 56px rgba(45, 41, 38, 0.16);
    --fe-shadow-accent: 0 4px 20px rgba(200, 149, 108, 0.2);
    --fe-shadow-dark: 0 8px 32px rgba(14, 35, 64, 0.25);

    /* ── Transitions ── */
    --fe-transition-fast: 150ms ease;
    --fe-transition: 250ms ease;
    --fe-transition-slow: 400ms ease;
    --fe-transition-bounce: 400ms cubic-bezier(0.34, 1.56, 0.64, 1);

    /* ── Z-Index Scale ── */
    --fe-z-dropdown: 100;
    --fe-z-sticky: 200;
    --fe-z-overlay: 300;
    --fe-z-modal: 400;
    --fe-z-toast: 500;
}

/* Dark theme overrides (optional, activated via data-theme="dark") */
[data-theme="dark"] {
    --fe-bg: #121a24;
    --fe-bg-soft: #1a2432;
    --fe-bg-muted: #22303f;
    --fe-text: #eae6e0;
    --fe-text-secondary: #b0a99e;
    --fe-text-muted: #8a8279;
    --fe-border: #2a3a4c;
    --fe-border-light: #1e2d3d;
}