/* ==========================================================================
   THEME.CSS — Centralized Theme Configuration
   ==========================================================================
   Every value below was extracted from the site's existing live styling
   so the visual appearance is unchanged. This file is the single source of 
   truth for brand colors, typography, and shape.

   All shades are now dynamically calculated using color-mix().
   ========================================================================== */

:root {
    /* ---- Brand colors (from the header/footer/accordion gradient) -------- */
    --primary-color: #850518;
    --secondary-color: #650313;
    /* ---- Dynamically Derived Hover & Alt Colors ---------------------------- */
    --primary-color-alt: color-mix(in srgb, var(--primary-color), black 30%);
    --secondary-hover-color: color-mix(in srgb, var(--secondary-color), black 20%);
    /* ---- Accent colors ----------------------------------------------------- */
    --accent-color: #99c232;
    --accent-hover-color: color-mix(in srgb, var(--accent-color), black 15%);
    --accent-gold-color: #c99a2e;
    --info-accent-start: #19266f;
    --info-accent-end: #176fb2;
    /* ---- Extended Dynamic Scale (Auto-generates based on primary-color) ---- */
    --primary-color-mobile: color-mix(in srgb, var(--primary-color), black 15%);
    --primary-color-dark: color-mix(in srgb, var(--primary-color), black 25%);
    --primary-shade-1: color-mix(in srgb, var(--primary-color), black 15%);
    --primary-shade-2: color-mix(in srgb, var(--primary-color), black 35%);
    --primary-shade-3: color-mix(in srgb, var(--primary-color), black 50%);
    --primary-shade-4: color-mix(in srgb, var(--primary-color), black 65%);
    --primary-shade-5: color-mix(in srgb, var(--primary-color), black 80%);
    /* Auto-calculating soft transparencies */
    --primary-color-soft: color-mix(in srgb, var(--primary-color) 8%, transparent);
    --primary-border-soft: color-mix(in srgb, var(--primary-color) 14%, transparent);
    --header-shadow: 0 18px 48px rgba(27, 15, 20, 0.14);
    /* ---- Header-specific text tones ---------------------------------------- */
    --heading-dark-color: #1f2933;
    --text-muted-alt-color: #667085;
    /* ---- Gradients --------------------------------------------------------- */
    --gradient-primary: linear-gradient(90deg, var(--primary-color) 0%, var(--primary-color) 35%, var(--secondary-color) 100%);
    --gradient-info: linear-gradient(90deg, var(--info-accent-start) 0%, var(--info-accent-start) 35%, var(--info-accent-end) 100%);
    --scrollbar-gradient: linear-gradient(90deg, var(--primary-shade-1) 0%, var(--primary-color-dark) 35%, var(--secondary-color) 100%);
    /* ---- Backgrounds -------------------------------------------------------- */
    --background-color: #ffffff;
    --background-secondary-color: #f7f8fa;
    --background-muted-color: #fcfcfc;
    --background-alt-color: #f1f1f1;
    /* ---- Text ---------------------------------------------------------------- */
    --text-color: #222222;
    --text-secondary-color: #353535;
    --text-muted-color: #666666;
    --text-on-dark-color: #ffffff;
    --text-on-dark-muted-color: #fffff2;
    /* ---- Borders --------------------------------------------------------------- */
    --border-color: #dddddd;
    --border-color-light: #ebebeb;
    /* ---- Semantic / status colors --------------------------------------------- */
    --success-color: #198754;
    --warning-color: #f0ad4e;
    --danger-color: #d9534f;
    --info-color: #337ab7;
    /* ---- Shape ------------------------------------------------------------------ */
    --button-radius: 6px;
    --button-radius-pill: 100vmax;
    --input-radius: 6px;
    --card-radius: 10px;
    --accordion-radius: 5px;
    /* ---- Typography --------------------------------------------------------------- */
    --font-family: "Roboto", sans-serif;
    --heading-font-family: "Roboto", sans-serif;
    --font-family-alt: "Merriweather", serif;
}