/**
 * Border Effects — Glow Borders
 *
 * Uses stacked box-shadow layers for natural glow falloff.
 * Mode-aware via [data-theme] attribute selectors.
 *
 * bg-layers elements use outline + drop-shadow (see base.css).
 */

/* ==========================================================================
   Glow Presets (6)
   ========================================================================== */

/* Primary — brand emphasis */
.border-fx-glow-primary:not(.bg-layers__border) {
    box-shadow:
        0 0 var(--border-fx-glow-spread, 8px) color-mix(in oklch, var(--color-primary) 40%, transparent),
        0 0 calc(var(--border-fx-glow-spread, 8px) * 2) color-mix(in oklch, var(--color-primary) 15%, transparent);
}
.bg-layers__border.border-fx-glow-primary {
    --border-fx-glow-color: color-mix(in oklch, var(--color-primary) 40%, transparent);
}

/* Secondary — secondary accent */
.border-fx-glow-secondary:not(.bg-layers__border) {
    box-shadow:
        0 0 var(--border-fx-glow-spread, 8px) color-mix(in oklch, var(--color-secondary) 40%, transparent),
        0 0 calc(var(--border-fx-glow-spread, 8px) * 2) color-mix(in oklch, var(--color-secondary) 15%, transparent);
}
.bg-layers__border.border-fx-glow-secondary {
    --border-fx-glow-color: color-mix(in oklch, var(--color-secondary) 40%, transparent);
}

/* Accent — call to action */
.border-fx-glow-accent:not(.bg-layers__border) {
    box-shadow:
        0 0 var(--border-fx-glow-spread, 8px) color-mix(in oklch, var(--color-accent) 40%, transparent),
        0 0 calc(var(--border-fx-glow-spread, 8px) * 2) color-mix(in oklch, var(--color-accent) 15%, transparent);
}
.bg-layers__border.border-fx-glow-accent {
    --border-fx-glow-color: color-mix(in oklch, var(--color-accent) 40%, transparent);
}

/* Neon — cyberpunk, gaming */
.border-fx-glow-neon:not(.bg-layers__border) {
    box-shadow:
        0 0 var(--border-fx-glow-spread, 8px) rgba(0, 255, 255, 0.5),
        0 0 calc(var(--border-fx-glow-spread, 8px) * 2) rgba(0, 255, 255, 0.2),
        0 0 calc(var(--border-fx-glow-spread, 8px) * 3) rgba(255, 0, 255, 0.1);
}
.bg-layers__border.border-fx-glow-neon {
    --border-fx-glow-color: rgba(0, 255, 255, 0.5);
}

/* Warm — inviting */
.border-fx-glow-warm:not(.bg-layers__border) {
    box-shadow:
        0 0 var(--border-fx-glow-spread, 8px) color-mix(in oklch, var(--color-warning) 30%, transparent),
        0 0 calc(var(--border-fx-glow-spread, 8px) * 2) color-mix(in oklch, var(--color-warning) 12%, transparent);
}
.bg-layers__border.border-fx-glow-warm {
    --border-fx-glow-color: color-mix(in oklch, var(--color-warning) 30%, transparent);
}

/* White — subtle, for dark themes */
.border-fx-glow-white:not(.bg-layers__border) {
    box-shadow:
        0 0 var(--border-fx-glow-spread, 8px) color-mix(in oklch, var(--color-base-100) 15%, transparent),
        0 0 calc(var(--border-fx-glow-spread, 8px) * 2) color-mix(in oklch, var(--color-base-100) 6%, transparent);
}
.bg-layers__border.border-fx-glow-white {
    --border-fx-glow-color: color-mix(in oklch, var(--color-base-100) 15%, transparent);
}

/* ==========================================================================
   Dark Mode Intensity Tuning
   ========================================================================== */

[data-theme*="-dark"] .border-fx-glow-primary:not(.bg-layers__border),
[data-theme*="-dark"].border-fx-glow-primary:not(.bg-layers__border) {
    box-shadow:
        0 0 calc(var(--border-fx-glow-spread, 8px) * 0.75) color-mix(in oklch, var(--color-primary) 30%, transparent),
        0 0 calc(var(--border-fx-glow-spread, 8px) * 1.5) color-mix(in oklch, var(--color-primary) 10%, transparent);
}

[data-theme*="-dark"] .border-fx-glow-secondary:not(.bg-layers__border),
[data-theme*="-dark"].border-fx-glow-secondary:not(.bg-layers__border) {
    box-shadow:
        0 0 calc(var(--border-fx-glow-spread, 8px) * 0.75) color-mix(in oklch, var(--color-secondary) 30%, transparent),
        0 0 calc(var(--border-fx-glow-spread, 8px) * 1.5) color-mix(in oklch, var(--color-secondary) 10%, transparent);
}

[data-theme*="-dark"] .border-fx-glow-accent:not(.bg-layers__border),
[data-theme*="-dark"].border-fx-glow-accent:not(.bg-layers__border) {
    box-shadow:
        0 0 calc(var(--border-fx-glow-spread, 8px) * 0.75) color-mix(in oklch, var(--color-accent) 30%, transparent),
        0 0 calc(var(--border-fx-glow-spread, 8px) * 1.5) color-mix(in oklch, var(--color-accent) 10%, transparent);
}

/* ==========================================================================
   Brand Mode Intensity Tuning (use contrast color)
   ========================================================================== */

[data-theme*="-brand"] .border-fx-glow-primary:not(.bg-layers__border),
[data-theme*="-brand"].border-fx-glow-primary:not(.bg-layers__border) {
    box-shadow:
        0 0 var(--border-fx-glow-spread, 8px) color-mix(in oklch, var(--color-primary-content) 50%, transparent),
        0 0 calc(var(--border-fx-glow-spread, 8px) * 2) color-mix(in oklch, var(--color-primary-content) 20%, transparent);
}