/* Sistema global de botones WAG: .wag-btn + variante (--primary, --secondary, --outline, --ghost, --danger)
   + tamaño (--sm, --md, --lg) + estados (hover, focus, active, disabled, loading con .is-loading o aria-busy).
   Usa los tokens existentes; los ajustes btn_* del personalizador se aplican encima desde inc/buttons.php.
   Ningún componente heredado usa estas clases: añadirlas es la vía de unificación. */
.wag-btn{
  --wag-btn-bg:var(--wa-accent,var(--wag-accent));
  --wag-btn-ink:var(--wag-color-white);
  --wag-btn-line:transparent;
  --wag-btn-hover-bg:color-mix(in srgb,var(--wag-btn-bg) 86%,#000);
  --wag-btn-hover-ink:var(--wag-btn-ink);
  display:inline-flex;align-items:center;justify-content:center;gap:var(--wag-space-8);
  box-sizing:border-box;min-height:40px;margin:0;padding:10px 18px;
  border:1px solid var(--wag-btn-line);border-radius:var(--wag-radius-8);
  background:var(--wag-btn-bg);color:var(--wag-btn-ink);
  font:inherit;font-size:var(--wag-text-14);font-weight:600;line-height:1.2;text-decoration:none;white-space:nowrap;
  cursor:pointer;-webkit-tap-highlight-color:transparent;
  transition:background-color var(--wag-state-duration),color var(--wag-state-duration),border-color var(--wag-state-duration),box-shadow var(--wag-state-duration),transform var(--wag-state-duration);
}
/* Los estados declaran fondo, texto y borde: las reglas globales heredadas (button:focus/:hover de base.css y
   *-defaults.css) los pintaban con el azul de Astra. */
.wag-btn:is(:focus,:active){background:var(--wag-btn-bg);color:var(--wag-btn-ink);border-color:var(--wag-btn-line)}
.wag-btn:hover{background:var(--wag-btn-hover-bg);color:var(--wag-btn-hover-ink);border-color:var(--wag-btn-line);text-decoration:none}
.wag-btn:focus{outline:none}
.wag-btn:focus-visible{box-shadow:var(--wag-focus-ring)}
.wag-btn:active{transform:translateY(1px)}
.wag-btn:is(:disabled,[aria-disabled="true"],.is-disabled){opacity:.55;cursor:not-allowed;transform:none;background:var(--wag-btn-bg);color:var(--wag-btn-ink)}
.wag-btn:is(.is-loading,[aria-busy="true"]){position:relative;color:transparent;pointer-events:none}
.wag-btn:is(.is-loading,[aria-busy="true"])::after{
  content:"";position:absolute;inset:0;margin:auto;width:1.1em;height:1.1em;box-sizing:border-box;
  border:2px solid var(--wag-btn-ink);border-right-color:transparent;border-radius:50%;
  animation:wag-btn-spin .7s linear infinite;
}
@keyframes wag-btn-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.wag-btn{transition:none}.wag-btn:is(.is-loading,[aria-busy="true"])::after{animation-duration:1.8s}}

.wag-btn--secondary{--wag-btn-bg:#eef3f8;--wag-btn-ink:#3a566f;--wag-btn-hover-bg:#e0e9f1}
.wag-btn--outline{--wag-btn-bg:transparent;--wag-btn-ink:var(--wa-accent,var(--wag-accent));--wag-btn-line:currentColor;--wag-btn-hover-bg:color-mix(in srgb,var(--wa-accent,var(--wag-accent)) 10%,transparent)}
.wag-btn--ghost{--wag-btn-bg:transparent;--wag-btn-ink:var(--wa-ink,var(--wag-ink));--wag-btn-hover-bg:color-mix(in srgb,var(--wa-ink,var(--wag-ink)) 8%,transparent)}
.wag-btn--danger{--wag-btn-bg:var(--wag-color-rust);--wag-btn-ink:var(--wag-color-white);--wag-btn-hover-bg:#963622}

html[data-theme="dark"] .wag-btn{--wag-btn-bg:var(--wa-accent,var(--wag-dark-accent))}
html[data-theme="dark"] .wag-btn--secondary{--wag-btn-bg:#26303b;--wag-btn-ink:#d5dee7;--wag-btn-hover-bg:#2f3b48}
html[data-theme="dark"] .wag-btn--outline{--wag-btn-bg:transparent;--wag-btn-ink:var(--wag-dark-accent)}
html[data-theme="dark"] .wag-btn--ghost{--wag-btn-bg:transparent;--wag-btn-ink:var(--wag-dark-ink)}
html[data-theme="dark"] .wag-btn--danger{--wag-btn-bg:#c9553c;--wag-btn-hover-bg:var(--wag-color-rust)}

.wag-btn--sm{min-height:32px;padding:6px 12px;font-size:var(--wag-text-12)}
.wag-btn--lg{min-height:48px;padding:13px 26px;font-size:var(--wag-text-16)}