/**
 * Grand Canyon Interactive Tools - Shared CSS Variables
 * Unified color scheme based on Tour Finder palette
 */

:root {
    /* Primary Colors - Grand Canyon Burnt Orange Theme */
    --gcit-primary: #e25822;           /* Burnt Orange (main brand color) */
    --gcit-primary-dark: #c25a3a;      /* Darker burnt orange */
    --gcit-secondary: #995239;         /* Canyon Brown */
    --gcit-secondary-dark: #734b45;    /* Darker brown */

    /* Status Colors */
    --gcit-success: #4a9b7f;           /* Teal (for high success/positive) */
    --gcit-warning: #e8b547;           /* Gold (for medium/warning) */
    --gcit-danger: #C44536;            /* Red (for low/alert) */
    --gcit-info: #4A90D4;              /* Sky Blue (for information) */

    /* Neutral Grays */
    --gcit-neutral-100: #f7f7f7;       /* Very light gray */
    --gcit-neutral-200: #e5e5e5;       /* Light gray */
    --gcit-neutral-300: #cccccc;       /* Medium gray */
    --gcit-neutral-400: #999999;       /* Gray */
    --gcit-neutral-500: #666666;       /* Dark gray */
    --gcit-neutral-700: #444444;       /* Darker gray */
    --gcit-neutral-900: #1a1a1a;       /* Almost black */

    /* Background Colors */
    --gcit-bg-white: #ffffff;
    --gcit-bg-light: var(--gcit-neutral-100);
    --gcit-bg-dark: var(--gcit-neutral-900);

    /* Text Colors */
    --gcit-text-primary: var(--gcit-neutral-900);
    --gcit-text-secondary: var(--gcit-neutral-700);
    --gcit-text-light: var(--gcit-neutral-500);
    --gcit-text-white: #ffffff;

    /* Border Colors */
    --gcit-border-light: var(--gcit-neutral-200);
    --gcit-border-medium: var(--gcit-neutral-300);
    --gcit-border-dark: var(--gcit-neutral-400);

    /* Shadow */
    --gcit-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --gcit-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    --gcit-shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
    --gcit-shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);
    --gcit-shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.1);

    /* Typography */
    --gcit-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    --gcit-font-size-sm: 14px;
    --gcit-font-size-base: 16px;
    --gcit-font-size-lg: 18px;
    --gcit-font-size-xl: 24px;
    --gcit-font-size-2xl: 32px;
    --gcit-font-size-3xl: 40px;

    --gcit-line-height-tight: 1.2;
    --gcit-line-height-base: 1.5;
    --gcit-line-height-relaxed: 1.75;

    --gcit-font-weight-normal: 400;
    --gcit-font-weight-medium: 500;
    --gcit-font-weight-semibold: 600;
    --gcit-font-weight-bold: 700;

    /* Spacing Scale */
    --gcit-space-xs: 0.25rem;    /* 4px */
    --gcit-space-sm: 0.5rem;     /* 8px */
    --gcit-space-md: 1rem;       /* 16px */
    --gcit-space-lg: 1.5rem;     /* 24px */
    --gcit-space-xl: 2rem;       /* 32px */
    --gcit-space-2xl: 3rem;      /* 48px */
    --gcit-space-3xl: 4rem;      /* 64px */

    /* Border Radius */
    --gcit-radius-sm: 4px;
    --gcit-radius-md: 6px;
    --gcit-radius-lg: 8px;
    --gcit-radius-xl: 12px;
    --gcit-radius-full: 9999px;

    /* Transitions */
    --gcit-transition-fast: 150ms ease-in-out;
    --gcit-transition-base: 200ms ease-in-out;
    --gcit-transition-slow: 300ms ease-in-out;

    /* Z-index Scale */
    --gcit-z-base: 1;
    --gcit-z-dropdown: 100;
    --gcit-z-sticky: 200;
    --gcit-z-fixed: 300;
    --gcit-z-modal-backdrop: 400;
    --gcit-z-modal: 500;
    --gcit-z-popover: 600;
    --gcit-z-tooltip: 700;

    /* Breakpoints (for reference in media queries) */
    --gcit-breakpoint-sm: 640px;
    --gcit-breakpoint-md: 768px;
    --gcit-breakpoint-lg: 1024px;
    --gcit-breakpoint-xl: 1280px;
}

/* Tool-Specific Color Aliases */
:root {
    /* Permit Estimator - Map to unified colors */
    --pde-primary: var(--gcit-primary);
    --pde-success: var(--gcit-success);
    --pde-warning: var(--gcit-warning);
    --pde-alert-orange: var(--gcit-primary-dark);
    --pde-alert-red: var(--gcit-danger);
    --pde-accent: var(--gcit-secondary);
    --pde-bg: var(--gcit-bg-white);
    --pde-text: var(--gcit-text-primary);
    --pde-text-light: var(--gcit-text-light);
    --pde-border: var(--gcit-border-light);
    --pde-shadow: var(--gcit-shadow);

    /* Tour Finder - Direct mapping (already using these colors) */
    --tf-primary: var(--gcit-primary);
    --tf-primary-dark: var(--gcit-primary-dark);
    --tf-secondary: var(--gcit-secondary);
    --tf-secondary-dark: var(--gcit-secondary-dark);
    --tf-success: var(--gcit-success);
    --tf-warning: var(--gcit-warning);
}

/* Utility Classes */
.gcit-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

/* Accessibility - Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}
