/* GESTION360PRO · blanco con azul rey (prueba de estilo). El modo claro es el principal.
   Se carga después de los estilos de cada página y solo cambia la paleta. */
:root{
  --bg:#070A12; --surface:#0E131F; --surface-2:#151B2A; --ink:#F2F5FB; --muted:#9AA5BC; --line:#242C3D;
  --brand:#5B9BFF; --brand-ink:#FFFFFF; --brand-soft:#16213A;
  --tag:#FF9F1C; --tag-ink:#1C0F00;
  --ok:#4FD39A; --ok-soft:#082419; --warn:#FFB341; --warn-soft:#271B06; --bad:#FF7A70; --bad-soft:#2C1016;
  --glow:rgba(70,140,255,.35); --glow-ring:rgba(120,175,255,.75);
  --silver:linear-gradient(180deg,#FFFFFF 0%,#E8EEF8 45%,#AFC6EE 58%,#F4F7FC 100%);
  --btn-bg:#FFFFFF; --btn-line:#D3DDF0; --btn-ink:#F2F5FB;
  --btn-sh:0 1px 2px rgba(0,0,0,.3); --btn-glow:0 0 14px rgba(80,150,255,.45);
  --btn-pri:linear-gradient(180deg,#3D7BFF 0%,#1E5BFF 55%,#1449E0 100%); --btn-pri-ink:#FFFFFF; --btn-pri-line:#1A52F0;
  --lines:rgba(255,255,255,.025); --bg-glow:rgba(40,110,255,.16);
  --app-bg:linear-gradient(160deg,#FFFFFF 0%,#E9EFFA 100%);
  --app-sh:0 8px 20px -8px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.6), 0 0 14px -4px rgba(70,140,255,.45);
}
:root[data-theme="light"]{
  --bg:#F6F8FC; --surface:#FFFFFF; --surface-2:#F3F6FC; --ink:#0D1B3E; --muted:#56648A; --line:#DCE4F2;
  --brand:#1E5BFF; --brand-ink:#FFFFFF; --brand-soft:#EAF0FF;
  --tag:#F08A00; --tag-ink:#FFFFFF;
  --ok:#137A4A; --ok-soft:#E3F5EC; --warn:#9A5E00; --warn-soft:#FFF4E0; --bad:#C0261A; --bad-soft:#FDE8E5;
  --glow:rgba(30,91,255,.20); --glow-ring:rgba(30,91,255,.45);
  --silver:linear-gradient(180deg,#3D7BFF 0%,#1E5BFF 55%,#1240C0 100%);
  --btn-bg:#FFFFFF; --btn-line:#D3DDF0; --btn-ink:#0D1B3E;
  --btn-sh:0 1px 2px rgba(13,27,62,.06); --btn-glow:0 0 0 3px rgba(30,91,255,.12), 0 1px 2px rgba(13,27,62,.06);
  --btn-pri:linear-gradient(180deg,#3D7BFF 0%,#1E5BFF 55%,#1449E0 100%); --btn-pri-ink:#FFFFFF; --btn-pri-line:#1A52F0;
  --lines:transparent; --bg-glow:rgba(30,91,255,.07);
  --app-bg:linear-gradient(160deg,#FFFFFF 0%,#F1F5FF 100%);
  --app-sh:0 6px 16px -8px rgba(30,91,255,.25), 0 1px 2px rgba(13,27,62,.06), inset 0 0 0 1px #E1E8F5;
}
/* Haz de luz azul arriba, como un escenario */
body{background-color:var(--bg)}
:root:not([data-theme="light"]) body{background-image:
  radial-gradient(ellipse 60% 35% at 50% -8%, rgba(60,125,255,.22), transparent 70%),
  repeating-linear-gradient(135deg, var(--lines) 0 1px, transparent 1px 24px)}
/* Menú lateral en degradado azul rey */
:root:not([data-theme="light"]) .side{background:#0B0F1A; border-right-color:#1E2636}
:root[data-theme="light"] .side{background:#FFFFFF; border-right-color:#E3E9F4}
:root[data-theme="light"] body{background-image:radial-gradient(ellipse 70% 40% at 50% -10%, rgba(30,91,255,.10), transparent 70%)}
/* Nombre de la marca: limpio, sin resplandor */
.g360{filter:none}
:root[data-theme="light"] .g360{background:linear-gradient(180deg,#3F86FF,#0A2A86); -webkit-background-clip:text; background-clip:text; filter:none}
.btn.primary{text-shadow:0 1px 1px rgba(0,20,90,.35)}
.btn:not(.primary):not(.ghost){color:#0D1B3E!important}
.btn.danger:not(.ghost){color:#C0261A!important}
/* Botones principales: azul rey con letras blancas en todas las páginas */
.btn.primary, a.btn.primary{background:var(--btn-pri)!important; color:var(--btn-pri-ink)!important; border-color:var(--btn-pri-line)!important}
.step::before{background:var(--btn-pri)!important; color:#fff!important}
/* Ambos modos: una luz fina azul rey recorre el borde de los botones */
@property --g360-a{syntax:'<angle>'; inherits:false; initial-value:0deg}
@keyframes g360-borde{to{--g360-a:360deg}}
:root .btn:not(.ghost){
  border:2px solid transparent!important;
  background:linear-gradient(#FFFFFF,#FFFFFF) padding-box,
    conic-gradient(from var(--g360-a), #C9D6F2 0 40%, rgba(30,91,255,.45) 58%, #1E5BFF 76%, #0B3BC4 82%, #4F8CFF 86%, #C9D6F2 96%) border-box!important;
  animation:g360-borde 3.5s linear infinite}
:root .btn.primary:not(.ghost), :root a.btn.primary{
  background:linear-gradient(180deg,#3D7BFF 0%,#1E5BFF 55%,#1449E0 100%) padding-box,
    conic-gradient(from var(--g360-a), #1449E0 0 40%, #6FA4FF 62%, #FFFFFF 78%, #CFE2FF 84%, #1449E0 96%) border-box!important;
  box-shadow:0 2px 10px -2px rgba(30,91,255,.45)!important}
:root .btn:not(.ghost):hover{box-shadow:0 0 0 3px rgba(30,91,255,.12), 0 0 12px rgba(30,91,255,.30)!important}
:root .btn:disabled{animation:none}