/**
 * Tibia-Inspired Dark Theme Variables
 * Mysterious MMORPG Atmosphere
 */

:root {
  /* === PRIMARY COLORS === */
  /* Dark, mysterious backgrounds */
  --color-bg-darkest: #0a0806;           /* Nearly black - deepest shadows */
  --color-bg-dark: #1a1410;              /* Dark brown - main background */
  --color-bg-medium: #37261c;            /* Medium brown - elevated surfaces */
  --color-bg-light: #3d2817;             /* Lighter brown - content areas */

  /* === ACCENT COLORS === */
  /* Weathered metals and aged materials */
  --color-bronze: #8b6f47;               /* Weathered bronze - primary accent */
  --color-bronze-dark: #6b5437;          /* Darker bronze - borders */
  --color-rust: #6b4423;                 /* Rust - secondary accent */
  --color-gold-aged: #9d7d4f;            /* Aged gold - highlights */

  /* === NATURE & MYSTICAL === */
  --color-forest: #4a6741;               /* Forest green - online status */
  --color-teal-dark: #2d5a4a;            /* Dark teal - links, interactive */
  --color-purple-mystic: #5f3dc4;        /* Mystic purple - magic elements */
  --color-shadow: #3a2a1f;               /* Shadow brown - depth */

  /* === LIGHT & GLOW === */
  --color-candlelight: #ffeaa7;          /* Warm candle glow */
  --color-torch: #ff9f43;                /* Torch fire - warnings */
  --color-moonlight: #d4dce6;            /* Cool moonlight - text */
  --color-ember: #ff6348;                /* Hot ember - danger/alerts */

  /* === TEXT COLORS === */
  --color-text-primary: #e8e4dc;         /* JAŚNIEJSZY - było #d4d0c8 */
  --color-text-secondary: #c4b8a8;       /* JAŚNIEJSZY - było #a39a8f */
  --color-text-muted: #8f857a;           /* JAŚNIEJSZY - było #6f6960 */
  --color-text-bright: #fffef8;          /* JAŚNIEJSZY - było #f5f1e8 */
  --color-text-link: #7fc4bc;            /* JAŚNIEJSZY - było #6ea8a0 */
  --color-text-link-hover: #a5dbd4;      /* JAŚNIEJSZY - było #8fc5bd */

  /* === SEMANTIC COLORS === */
  --color-success: #4a6741;              /* Forest green */
  --color-warning: #d4923f;              /* Amber */
  --color-danger: #b8493f;               /* Dark red */
  --color-info: #4a708a;                 /* Slate blue */

  /* === BORDERS & DIVIDERS === */
  --color-border-dark: #2d1f17;          /* Dark border */
  --color-border-medium: #4a3828;        /* Medium border */
  --color-border-light: #6b5437;         /* Light border */
  --color-border-glow: rgba(255, 234, 167, 0.3);  /* Glowing border */

  /* === OPACITY & OVERLAYS === */
  --overlay-dark: rgba(10, 8, 6, 0.85);
  --overlay-medium: rgba(29, 20, 16, 0.75);
  --overlay-light: rgba(61, 40, 23, 0.6);
  --overlay-fog: rgba(180, 180, 180, 0.05);

  /* === SHADOWS === */
  --shadow-small: 0 2px 4px rgba(0, 0, 0, 0.5);
  --shadow-medium: 0 4px 8px rgba(0, 0, 0, 0.6);
  --shadow-large: 0 8px 16px rgba(0, 0, 0, 0.7);
  --shadow-glow: 0 0 20px rgba(255, 234, 167, 0.3);
  --shadow-glow-strong: 0 0 30px rgba(255, 234, 167, 0.5);
  --shadow-inset: inset 0 2px 4px rgba(0, 0, 0, 0.5);
  --shadow-text: 2px 2px 4px rgba(0, 0, 0, 0.8);

  /* === TYPOGRAPHY === */
  --font-heading: 'Cinzel', 'Georgia', serif;
  --font-body: 'Crimson Text', 'Georgia', serif;
  --font-display: 'MedievalSharp', 'Cinzel', serif;
  --font-ui: 'Cinzel', sans-serif;

  --font-size-xs: 0.75rem;    /* 12px */
  --font-size-sm: 0.875rem;   /* 14px */
  --font-size-base: 1rem;     /* 16px */
  --font-size-lg: 1.125rem;   /* 18px */
  --font-size-xl: 1.25rem;    /* 20px */
  --font-size-2xl: 1.5rem;    /* 24px */
  --font-size-3xl: 1.875rem;  /* 30px */
  --font-size-4xl: 2.25rem;   /* 36px */

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

  --line-height-tight: 1.25;
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.75;

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

  /* === BORDER RADIUS === */
  --radius-none: 0;
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 8px;
  --radius-full: 9999px;

  /* === TRANSITIONS === */
  --transition-fast: 150ms ease-in-out;
  --transition-base: 250ms ease-in-out;
  --transition-slow: 400ms ease-in-out;
  --transition-veryslow: 600ms ease-in-out;

  /* === Z-INDEX LAYERS === */
  --z-background: -1;
  --z-base: 0;
  --z-content: 10;
  --z-elevated: 20;
  --z-dropdown: 30;
  --z-sticky: 40;
  --z-modal-backdrop: 50;
  --z-modal: 60;
  --z-tooltip: 70;
  --z-notification: 80;
  --z-particles: 5;

  /* === LAYOUT === */
  --container-max-width: 1200px;
  --sidebar-width: 250px;
  --header-height: 80px;

  /* === EFFECTS === */
  --blur-sm: blur(4px);
  --blur-md: blur(8px);
  --blur-lg: blur(16px);

  /* === ANIMATED GRADIENTS === */
  --gradient-mysterious: linear-gradient(135deg, var(--color-bg-dark) 0%, var(--color-shadow) 50%, var(--color-bg-dark) 100%);
  --gradient-parchment: linear-gradient(180deg, #3d2817 0%, #2d1f17 50%, #3d2817 100%);
  --gradient-glow: radial-gradient(circle, rgba(255, 234, 167, 0.2) 0%, transparent 70%);
  --gradient-torch: radial-gradient(ellipse at center, var(--color-torch) 0%, transparent 70%);
  --gradient-bronze: linear-gradient(135deg, var(--color-bronze) 0%, var(--color-rust) 50%, var(--color-bronze-dark) 100%);
}

/* === DARK MODE VARIANTS (for future toggle) === */
[data-theme="lighter"] {
  --color-bg-dark: #2d1f17;
  --color-bg-medium: #3d2817;
  --color-text-primary: #f5f1e8;
}

/* === REDUCED MOTION === */
@media (prefers-reduced-motion: reduce) {
  :root {
    --transition-fast: 50ms linear;
    --transition-base: 100ms linear;
    --transition-slow: 150ms linear;
    --transition-veryslow: 200ms linear;
  }
}

/* === PRINT STYLES === */
@media print {
  :root {
    --color-bg-dark: #ffffff;
    --color-text-primary: #000000;
    --shadow-medium: none;
  }
}