/*
Theme Name: The Anderson Chronicles
Theme URI: https://andersonchronicles.local
Author: The Anderson Chronicles
Description: A premium editorial WordPress theme for The Anderson Chronicles local newspaper. Features a high-end "Digital Broadsheet" design with glassmorphic navigation, tonal surface layering, and Newsreader/Public Sans typography.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.9
Requires PHP: 8.0
License: Proprietary
Text Domain: anderson-chronicles
*/

/* ==========================================================================
   Design System: CSS Custom Properties
   Source: chronicle_modern/DESIGN.md
   ========================================================================== */

:root {
    /* Surface Architecture */
    --ac-surface: #f9f9f9;
    --ac-surface-dim: #dadada;
    --ac-surface-bright: #f9f9f9;
    --ac-surface-container-lowest: #ffffff;
    --ac-surface-container-low: #f3f3f3;
    --ac-surface-container: #eeeeee;
    --ac-surface-container-high: #e8e8e8;
    --ac-surface-container-highest: #e2e2e2;
    --ac-surface-variant: #e2e2e2;
    --ac-surface-tint: #525f71;

    /* On Surface */
    --ac-on-surface: #1a1c1c;
    --ac-on-surface-variant: #44474c;
    --ac-on-background: #1a1c1c;
    --ac-background: #f9f9f9;

    /* Primary */
    --ac-primary: #000000;
    --ac-on-primary: #ffffff;
    --ac-primary-container: #0f1c2c;
    --ac-on-primary-container: #778598;
    --ac-primary-fixed: #d6e4f9;
    --ac-primary-fixed-dim: #bac8dc;
    --ac-on-primary-fixed: #0f1c2c;
    --ac-on-primary-fixed-variant: #3a4859;
    --ac-inverse-primary: #bac8dc;

    /* Secondary (Anderson Red) */
    --ac-secondary: #b61819;
    --ac-on-secondary: #ffffff;
    --ac-secondary-container: #da352f;
    --ac-on-secondary-container: #fffbff;
    --ac-secondary-fixed: #ffdad6;
    --ac-secondary-fixed-dim: #ffb4ab;
    --ac-on-secondary-fixed: #410002;
    --ac-on-secondary-fixed-variant: #93000b;

    /* Tertiary */
    --ac-tertiary: #000000;
    --ac-on-tertiary: #ffffff;
    --ac-tertiary-container: #0a1e26;
    --ac-on-tertiary-container: #738791;
    --ac-tertiary-fixed: #d1e6f2;
    --ac-tertiary-fixed-dim: #b5cad5;
    --ac-on-tertiary-fixed: #0a1e26;
    --ac-on-tertiary-fixed-variant: #374953;

    /* Error */
    --ac-error: #ba1a1a;
    --ac-on-error: #ffffff;
    --ac-error-container: #ffdad6;
    --ac-on-error-container: #93000a;

    /* Outline */
    --ac-outline: #74777d;
    --ac-outline-variant: #c4c6cc;

    /* Inverse */
    --ac-inverse-surface: #2f3131;
    --ac-inverse-on-surface: #f1f1f1;

    /* Typography Scale */
    --ac-display-lg: 3.5rem;
    --ac-display-md: 2.5rem;
    --ac-headline-lg: 2rem;
    --ac-headline-md: 1.5rem;
    --ac-body-lg: 1rem;
    --ac-body-md: 0.875rem;
    --ac-label-lg: 0.875rem;
    --ac-label-md: 0.75rem;

    /* Border Radius */
    --ac-radius-sm: 0.125rem;
    --ac-radius-lg: 0.25rem;
    --ac-radius-xl: 0.5rem;
    --ac-radius-full: 0.75rem;

    /* Shadows */
    --ac-editorial-shadow: 0px 0px 32px 0px rgba(26, 28, 28, 0.06);
    --ac-ambient-shadow: 0px 0px 32px 0px rgba(26, 28, 28, 0.06);
}

/* ==========================================================================
   Base Styles
   ========================================================================== */

body {
    font-family: 'Public Sans', sans-serif;
    background-color: var(--ac-surface);
    color: var(--ac-on-surface);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Headline Serif */
.headline-serif,
.newsreader,
h1, h2, h3 {
    font-family: 'Newsreader', serif;
}

/* Material Symbols */
.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    vertical-align: middle;
}

/* Editorial Shadow */
.editorial-shadow {
    box-shadow: var(--ac-editorial-shadow);
}

/* Glass Header */
.glass-header {
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

/* Drop Cap */
.drop-cap::first-letter {
    float: left;
    font-family: 'Newsreader', serif;
    font-size: 4rem;
    line-height: 0.8;
    padding-right: 0.5rem;
    color: var(--ac-secondary);
    font-weight: 800;
}

/* Selection */
::selection {
    background-color: rgba(182, 24, 25, 0.2);
}

/* Links */
a {
    color: var(--ac-on-surface);
    text-decoration: none;
    transition: color 0.3s ease;
}

a:hover {
    color: var(--ac-secondary);
}

/* ==========================================================================
   WordPress Specific
   ========================================================================== */

/* Navigation active states */
.current-menu-item > a,
.current_page_item > a {
    color: #b61819 !important;
    font-weight: 700;
    border-bottom: 2px solid #b61819;
    padding-bottom: 0.25rem;
}

/* Footer link contrast — override global a{color} for dark footer background */
footer a {
    color: #cbd5e1; /* slate-300 */
}
footer a:hover {
    color: #ffffff;
}

/* Skip link — visible only on focus, needs contrast when shown */
.skip-link:focus,
a.skip-link:focus {
    color: #ffffff;
    background: var(--ac-secondary);
}

/* Screen reader text */
.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important;
}

/* Alignments */
.alignwide {
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
}

.alignfull {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
}

/* Image handling */
img {
    max-width: 100%;
    height: auto;
}

.wp-post-image {
    border-radius: var(--ac-radius-sm);
}
