/*
Design tokens — primitives, gradient angles, and spectrum gradients.
Loaded before theme.css via functions.php.

SPECTRUM GRADIENT ANGLES
Each spectrum has one fixed stop list. Swap the visual direction by setting
--spectrum-gradient-angle on a scoped parent (e.g. .site-content .hero-banner).

Global angle scale:
  --gradient-angle-linear    92deg  near-horizontal (afterglow, sunset defaults)
  --gradient-angle-diagonal  108deg gentle diagonal (twilight, aspen defaults)
  --gradient-angle-sharp     131deg steeper diagonal
  --gradient-angle-reversed  275deg flipped visual direction
  --gradient-angle-vertical  180deg top-to-bottom

Afterglow examples (same stops, different angles):
  Default:  background: var(--afterglow-spectrum);
  Sharp:    --spectrum-gradient-angle: var(--gradient-angle-sharp);
            background: var(--afterglow-spectrum);
  Reversed: --spectrum-gradient-angle: var(--gradient-angle-reversed);
            background: var(--afterglow-spectrum);
*/

:root {
    /* Primary Colors */
    --white: #FFFFFF;
    --cream: #FEF7EC;
    --dark-gray: #282828;
    --fsm-orange: #FE9000;

    /* Secondary Colors */
    --fsm-purple: #977CC1;
    --fsm-yellow: #F1D01B;
    --fsm-green: #76E583;
    --fsm-blue: #19BDE6;
    --fsm-red: #CA5043;

    /* Tints & Shades */
    --orange-shade: #B14300;
    --orange-tint: #FFDEB2;
    --purple-shade: #4B3075;
    --purple-tint: #E0D8EC;
    --yellow-shade: #A48300;
    --yellow-tint: #FBF1BB;
    --green-shade: #299836;
    --green-tint: #D6F7DA;
    --blue-shade: #007199;
    --blue-tint: #BAEBF7;
    --red-shade: #7D0300;
    --red-tint: #EFCAC7;

    /* Global gradient angle scale */
    --gradient-angle-linear: 92deg;
    --gradient-angle-diagonal: 108deg;
    --gradient-angle-sharp: 131deg;
    --gradient-angle-reversed: 275deg;
    --gradient-angle-vertical: 180deg;

    /* Spectrum stops */
    --afterglow-spectrum-stops:
        var(--fsm-orange) 1.81%,
        var(--fsm-red) 42.39%,
        var(--fsm-purple) 85.48%;

    --twilight-spectrum-stops:
        var(--fsm-purple) 38.61%,
        var(--fsm-orange) 99.15%;

    --aspen-spectrum-stops:
        var(--fsm-green) 37.39%,
        var(--fsm-yellow) 93.55%;

    --sunset-spectrum-stops:
        var(--fsm-purple) 48.83%,
        var(--fsm-orange) 90.92%;

    /* Composed spectrums — override angle via --spectrum-gradient-angle */
    --afterglow-spectrum: linear-gradient(
        var(--spectrum-gradient-angle, var(--gradient-angle-linear)),
        var(--afterglow-spectrum-stops)
    );

    --twilight-spectrum: linear-gradient(
        var(--spectrum-gradient-angle, var(--gradient-angle-diagonal)),
        var(--twilight-spectrum-stops)
    );

    --aspen-spectrum: linear-gradient(
        var(--spectrum-gradient-angle, var(--gradient-angle-diagonal)),
        var(--aspen-spectrum-stops)
    );

    --sunset-spectrum: linear-gradient(
        var(--spectrum-gradient-angle, var(--gradient-angle-linear)),
        var(--sunset-spectrum-stops)
    );
}