/*
 Theme Name: Astra Child
 Theme URI: https://theprintdragon.com
 Description: Child theme for Astra. Holds custom colors, glows, layout overrides, and brand styling for The Print Dragon.
 Author: Larry Raby
 Template: astra
 Version: 1.0.0
*/

/* ---------------------------------------------------------
   GLOBAL BRAND COLORS
   Add your elemental palette + glow colors here
--------------------------------------------------------- */

/* Example placeholders — replace with your real values */
:root {
    --fire: #ff4a2f;
    --water: #3fa9f5;
    --earth: #7a5f3d;
    --air: #cfe8ff;
    --arcane: #b44cff;

    --glow-fire: 0 0 12px rgba(255, 74, 47, 0.8);
    --glow-water: 0 0 12px rgba(63, 169, 245, 0.8);
    --glow-earth: 0 0 12px rgba(122, 95, 61, 0.8);
    --glow-air: 0 0 12px rgba(207, 232, 255, 0.8);
    --glow-arcane: 0 0 14px rgba(180, 76, 255, 0.9);
}

/* ---------------------------------------------------------
   TYPOGRAPHY OVERRIDES
--------------------------------------------------------- */

/* Example — customize as needed */
body {
    font-family: "Inter", sans-serif;
}

/* ---------------------------------------------------------
   NAVIGATION COLORS + HOVER EFFECTS
--------------------------------------------------------- */

.main-header-menu a {
    transition: color 0.25s ease, text-shadow 0.25s ease;
}

.main-header-menu a:hover {
    color: var(--arcane);
    text-shadow: var(--glow-arcane);
}

/* ---------------------------------------------------------
   SECTION COLOR IDENTITIES
   (Fire, Water, Earth, Air, Arcane, etc.)
--------------------------------------------------------- */

.section-fire {
    background: var(--fire);
    color: #fff;
}

.section-water {
    background: var(--water);
    color: #fff;
}

.section-earth {
    background: var(--earth);
    color: #fff;
}

.section-air {
    background: var(--air);
    color: #000;
}

.section-arcane {
    background: var(--arcane);
    color: #fff;
}

/* ---------------------------------------------------------
   BUTTONS
--------------------------------------------------------- */

.button-arcane {
    background: var(--arcane);
    color: #fff;
    box-shadow: var(--glow-arcane);
}

.button-arcane:hover {
    filter: brightness(1.15);
}

/* ---------------------------------------------------------
   CUSTOM GLOWS
--------------------------------------------------------- */

.glow-fire { text-shadow: var(--glow-fire); }
.glow-water { text-shadow: var(--glow-water); }
.glow-earth { text-shadow: var(--glow-earth); }
.glow-air { text-shadow: var(--glow-air); }
.glow-arcane { text-shadow: var(--glow-arcane); }

/* ---------------------------------------------------------
   PLACEHOLDER FOR FUTURE CUSTOM CSS
--------------------------------------------------------- */

/* Add more overrides below this line */