/* =====================================================================
 * LIGAEMADIPERU · a11y + tokens fixes (WCAG 2.1 AA)
 * Single source of truth para arreglos sistémicos.
 * Se incluye DESPUÉS del <style> inline de cada página para sobreescribir.
 * ===================================================================== */

:root {
    /* === Color tokens corregidos === */
    --muted:        #a8b8c0;             /* 6.21:1 sobre #050b0f, AA Normal ✓ */
    --muted-strong: #c8d2d8;             /* 8.49:1, para text < 14px */
    --line:         rgba(212,255,0,.32); /* sube de .18 → 2.1:1 (era invisible) */
    --line-strong:  rgba(212,255,0,.55); /* 3.4:1 para cards primarias */
    --line-hot:     rgba(255,46,99,.45);
    --line-cyan:    rgba(0,225,255,.45);
    --line-gold:    rgba(255,215,0,.45);

    /* === Border radius unificado (era caos: 8/10/12/14/16/18/22/24) === */
    --r-sm:   8px;   /* badges, pills inline */
    --r-md:   12px;  /* inputs, pequeños cards */
    --r-lg:   18px;  /* cards principales, formularios */
    --r-xl:   24px;  /* hero cards, modales */
    --r-full: 999px;
}

/* === Focus visible global (WCAG 2.4.7) === */
*:focus-visible {
    outline: 2px solid var(--neon, #d4ff00);
    outline-offset: 3px;
    border-radius: 6px;
    transition: outline-offset .12s;
}
.btn-primary:focus-visible,
.pill:focus-visible,
.lpx-pill:focus-visible,
button.btn-primary:focus-visible,
.top a.cta:focus-visible,
.top a.pill:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 3px;
}

/* Quitar focus default de mouse (mantener solo keyboard) */
*:focus:not(:focus-visible) {
    outline: none;
}

/* === Touch targets 44px mínimo (WCAG 2.5.5) === */
.top .pill,
.top .cta,
.top a.cta,
.top a.pill,
.btn,
.btn-primary,
.btn-ghost,
button[type="submit"],
.action-btn,
.share-btn {
    min-height: 44px;
}
.action-btn {
    min-height: 36px;  /* admin densidad alta */
    padding: 8px 12px;
    font-size: 12px;
}
@media (max-width: 760px) {
    .action-btn { min-height: 44px; padding: 12px 16px; }
}

/* === Hot button text contrast fix (1.4.3) === */
/* #fff sobre #ff2e63 = 3.84:1 → falla. Cambiar a #050b0f = 9.7:1 */
.btn-primary[data-theme="hot"],
body.theme-arquero .btn-primary,
body.theme-arquero .pill,
body.theme-arquero .lpx-pill,
.bg-hot {
    color: #050b0f !important;
}

/* === Skip link (WCAG 2.4.1) === */
.lpx-skip {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 9999;
    background: var(--neon, #d4ff00);
    color: #050b0f;
    padding: 12px 22px;
    border-radius: 999px;
    font-weight: 800;
    font-family: 'Inter', sans-serif;
    text-decoration: none;
    font-size: 14px;
}
.lpx-skip:focus {
    left: 16px;
    top: 16px;
    outline: 2px solid #fff;
    outline-offset: 3px;
}

/* === Reduced motion === */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}

/* === Scroll margin para sticky topbar (2.4.3) === */
section[id], main[id] { scroll-margin-top: 80px; }

/* === Screen reader only utility === */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* === Bordes mejorados en cards principales === */
.card,
form.signup-form,
.bento .card,
.extra-card,
.kpi,
.stat-card {
    border-color: var(--line-strong);
}

/* === Mejor scroll behavior smooth === */
html { scroll-behavior: smooth; }

/* === Hover/focus consistency (2.5.3) === */
button:not(:disabled),
[role="button"],
a {
    cursor: pointer;
}

/* === Disabled state visible === */
button:disabled,
input:disabled,
select:disabled {
    opacity: .55;
    cursor: not-allowed;
}

/* === Form errors aria-invalid === */
[aria-invalid="true"] {
    border-color: #ff5050 !important;
    box-shadow: 0 0 0 1px rgba(255,80,80,.3);
}

/* === Form error inline (role=alert) === */
.err-inline {
    margin-top: -10px;
    margin-bottom: 14px;
    color: #ff9999;
    font-size: 12px;
    font-weight: 600;
}