/* =========================================================
   gg_aura.css — CANONICAL GLOBAL AURA SYSTEM
   Purpose:
   - shared Angel / Demon / Null / Default aura variables
   - reusable borders, cards, buttons, text, veil, inputs
   - safe global helpers for all GodlyGangsta pages
   ========================================================= */

:root{
  --aura:#a78bfa;
  --auraGlow:rgba(167,139,250,.28);
  --auraSoft:rgba(167,139,250,.14);
  --auraLine:rgba(167,139,250,.24);
  --auraBtn:rgba(167,139,250,.18);
  --auraText:#eef2ff;
  --auraMuted:rgba(238,242,255,.72);
  --auraShadow:0 14px 40px rgba(0,0,0,.28);
  --auraInset:0 0 0 1px rgba(255,255,255,.03) inset;
  --auraTrans:180ms ease;
}

/* =========================================================
   AURA PALETTES
   ========================================================= */

/* DEFAULT */
html,
html[data-aura="DEFAULT"]{
  --aura:#a78bfa;
  --auraGlow:rgba(167,139,250,.28);
  --auraSoft:rgba(167,139,250,.14);
  --auraLine:rgba(167,139,250,.24);
  --auraBtn:rgba(167,139,250,.18);
}

/* ANGEL */
html[data-aura="ANGEL"]{
  --aura:#7ecbff;
  --auraGlow:rgba(126,203,255,.30);
  --auraSoft:rgba(126,203,255,.15);
  --auraLine:rgba(126,203,255,.26);
  --auraBtn:rgba(126,203,255,.18);
}

/* DEMON */
html[data-aura="DEMON"]{
  --aura:#ff5b7c;
  --auraGlow:rgba(255,91,124,.30);
  --auraSoft:rgba(255,91,124,.15);
  --auraLine:rgba(255,91,124,.26);
  --auraBtn:rgba(255,91,124,.18);
}

/* NULL */
html[data-aura="NULL"]{
  --aura:#7df1df;
  --auraGlow:rgba(125,241,223,.28);
  --auraSoft:rgba(125,241,223,.14);
  --auraLine:rgba(125,241,223,.24);
  --auraBtn:rgba(125,241,223,.16);
}

/* =========================================================
   GLOBAL TRANSITION HELPERS
   ========================================================= */

html body .gg-auraText,
html body .gg-auraTitle,
html body .gg-auraCard,
html body .gg-auraBorder,
html body .gg-auraGlow,
html body .gg-auraBtn,
html body .gg-auraPill,
html body .gg-auraInput,
html body .gg-auraRule,
html body .gg-auraBg,
html body .gg-veil{
  transition:
    color var(--auraTrans),
    border-color var(--auraTrans),
    background var(--auraTrans),
    box-shadow var(--auraTrans),
    text-shadow var(--auraTrans),
    filter var(--auraTrans),
    opacity var(--auraTrans);
}

/* =========================================================
   TEXT / TITLES
   ========================================================= */

.gg-auraText{
  color:var(--auraText);
  text-shadow:0 0 18px var(--auraSoft);
}

.gg-auraMuted{
  color:var(--auraMuted);
}

.gg-auraTitle{
  color:var(--aura);
  text-shadow:
    0 0 12px var(--auraSoft),
    0 0 26px var(--auraGlow);
}

.gg-auraAccent{
  color:var(--aura);
}

/* =========================================================
   PANELS / CARDS / BORDERS
   ========================================================= */

.gg-auraCard{
  border:1px solid var(--auraLine);
  box-shadow:
    var(--auraInset),
    var(--auraShadow),
    0 0 26px var(--auraSoft);
}

.gg-auraBorder{
  border-color:var(--auraLine) !important;
}

.gg-auraGlow{
  box-shadow:0 0 26px var(--auraSoft);
}

.gg-auraInset{
  box-shadow:var(--auraInset);
}

.gg-auraPanel{
  border:1px solid var(--auraLine);
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));
  box-shadow:
    var(--auraInset),
    0 10px 30px rgba(0,0,0,.24),
    0 0 18px var(--auraSoft);
}

/* =========================================================
   BUTTONS
   ========================================================= */

.gg-auraBtn{
  color:var(--auraText);
  border:1px solid var(--auraLine);
  background:
    linear-gradient(180deg, var(--auraBtn), rgba(255,255,255,.04));
  box-shadow:
    var(--auraInset),
    0 0 18px var(--auraSoft);
}

.gg-auraBtn:hover{
  filter:brightness(1.06);
  box-shadow:
    var(--auraInset),
    0 0 24px var(--auraGlow);
}

.gg-auraBtn:active{
  transform:translateY(1px);
  filter:brightness(.98);
}

.gg-auraBtn:focus-visible{
  outline:none;
  border-color:var(--aura);
  box-shadow:
    0 0 0 3px var(--auraSoft),
    0 0 24px var(--auraGlow);
}

.gg-auraBtn.is-active,
.gg-auraBtn[aria-pressed="true"]{
  border-color:var(--aura);
  box-shadow:
    0 0 0 1px var(--auraLine) inset,
    0 0 20px var(--auraGlow);
}

/* =========================================================
   PILLS / TAGS / BADGES
   ========================================================= */

.gg-auraPill{
  color:var(--auraText);
  border:1px solid var(--auraLine);
  background:rgba(255,255,255,.04);
  box-shadow:0 0 14px var(--auraSoft);
}

.gg-auraBadge{
  color:var(--aura);
  border:1px solid var(--auraLine);
  background:linear-gradient(180deg, var(--auraSoft), rgba(255,255,255,.03));
  box-shadow:0 0 12px var(--auraSoft);
}

/* =========================================================
   BACKGROUND TINT / VEIL
   ========================================================= */

.gg-veil{
  background:
    radial-gradient(1100px 700px at 20% 0%, var(--auraGlow), transparent 60%),
    radial-gradient(900px 500px at 85% 10%, var(--auraSoft), transparent 55%),
    radial-gradient(900px 650px at 50% 120%, var(--auraSoft), transparent 60%),
    linear-gradient(to bottom, rgba(0,0,0,.55), rgba(0,0,0,.70));
}

.gg-auraBg{
  background:
    radial-gradient(900px 600px at 20% 0%, var(--auraSoft), transparent 60%),
    radial-gradient(700px 500px at 80% 10%, var(--auraGlow), transparent 65%);
}

.gg-auraOverlay{
  position:relative;
}

.gg-auraOverlay::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(800px 400px at 50% 0%, var(--auraSoft), transparent 70%);
  opacity:.9;
}

/* =========================================================
   INPUTS / FOCUS
   ========================================================= */

.gg-auraInput,
input.gg-auraInput,
select.gg-auraInput,
textarea.gg-auraInput{
  color:var(--auraText);
  border:1px solid var(--auraLine);
  background:rgba(255,255,255,.04);
  box-shadow:var(--auraInset);
}

.gg-auraInput::placeholder,
input.gg-auraInput::placeholder,
textarea.gg-auraInput::placeholder{
  color:var(--auraMuted);
}

.gg-auraInput:focus,
input.gg-auraInput:focus,
select.gg-auraInput:focus,
textarea.gg-auraInput:focus{
  outline:none;
  border-color:var(--aura);
  box-shadow:
    0 0 0 3px var(--auraSoft),
    0 0 14px var(--auraGlow);
}

/* =========================================================
   LINKS / SELECTION
   ========================================================= */

.gg-auraLink{
  color:var(--aura);
  text-decoration-color:var(--auraLine);
}

.gg-auraLink:hover{
  text-shadow:0 0 12px var(--auraSoft);
}

::selection{
  background:var(--auraSoft);
  color:#fff;
}

/* =========================================================
   RULES / DIVIDERS
   ========================================================= */

.gg-auraRule{
  height:1px;
  background:linear-gradient(90deg, transparent, var(--auraLine), transparent);
}

.gg-auraRuleVertical{
  width:1px;
  background:linear-gradient(180deg, transparent, var(--auraLine), transparent);
}

/* =========================================================
   OPTIONAL STATE HELPERS
   ========================================================= */

.gg-auraHover:hover{
  border-color:var(--auraLine);
  box-shadow:0 0 20px var(--auraSoft);
}

.gg-auraFocus:focus-visible{
  outline:none;
  box-shadow:0 0 0 3px var(--auraSoft);
}

.gg-auraRing{
  box-shadow:0 0 0 3px var(--auraSoft);
}