@charset "UTF-8";
/* ============================================================
   AccesPub — Acabado común (dashboard y portal)
   Se carga DESPUÉS de style.css (y, en el portal, de portal.css)
   y ANTES del CSS de un tema. Retoques de presencia sobre el
   diseño base: tipografía de títulos, tarjetas, tablas, botones,
   enlaces y campos. Solo tokens: los temas del portal cambian
   los valores (api/portal/static/themes/*.css).
   Contraste comprobado por tests/test_temas.py.
   ============================================================ */

/* ── Tokens ─────────────────────────────────────────────────── */
:root {
  --focus:          var(--accent);
  --on-accent:      #fff;            /* texto sobre --accent-d, --success-strong… */
  --link:           var(--accent-d);
  --link-hover:     var(--accent-dk);
  --input-border:   #7b8698;         /* 3,6:1 sobre blanco (1.4.11); slate-400 no llegaba */
  --font-heading:   var(--font);
  --stat-green:     #22c55e;         /* solo decoración (raya) */
  --input-border-hover: var(--slate-500);
  --page-glow:      rgba(99,102,241,.07);   /* halo suave en lo alto de la página */
  --header-accent:  linear-gradient(90deg, var(--accent) 0%, #818cf8 35%, transparent 75%);
  --heading-weight: 750;
  --heading-track:  -.03em;
  --sh-panel:       0 1px 2px rgba(15,23,42,.04), 0 6px 20px -12px rgba(15,23,42,.10);
  --sh-btn:         0 1px 2px rgba(15,23,42,.10), inset 0 1px 0 rgba(255,255,255,.14);
  --r-panel:        14px;
  --r-btn:          10px;
  --selection:      var(--accent-l);
  --prefilled-border: #6366f1;       /* campo prerrellenado por la IA: 4,5:1 sobre blanco */
}

/* ── Común ──────────────────────────────────────────────────── */
::selection { background: var(--selection); color: var(--text); }
body {
  background:
    radial-gradient(1100px 340px at 50% -140px, var(--page-glow), transparent 70%) no-repeat,
    var(--bg);
}
h1, h2, h3, .page-head h1, .stat-num, .data-table caption { font-family: var(--font-heading); }
.page-head h1 { font-weight: var(--heading-weight); letter-spacing: var(--heading-track); }
.panel h2, .data-table caption { letter-spacing: -.015em; }

/* Cabecera: filete de color bajo la barra */
header::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
  background: var(--header-accent); pointer-events: none;
}

/* Paneles y tarjetas: más aire, sombra difusa en lugar de marcada */
.panel, .card, .info-card, .manage-card { border-radius: var(--r-panel); }
.panel { box-shadow: var(--sh-panel); }

/* Tarjetas de cifras: el color pasa del borde superior a la pastilla del icono */
.stat-card,
.stat-card.stat-blue, .stat-card.stat-green, .stat-card.stat-orange, .stat-card.stat-red {
  border-top: 1px solid var(--border); border-radius: var(--r-panel); box-shadow: var(--sh-panel);
}
.stat-card .stat-icon {
  box-sizing: content-box; padding: .45rem; border-radius: var(--r-btn);
  background: var(--slate-100); color: var(--slate-600); margin-bottom: .6rem;
}
.stat-card.stat-blue   .stat-icon { background: var(--accent-ll);  color: var(--accent-dk); }
.stat-card.stat-green  .stat-icon { background: var(--success-ll); color: var(--success-text); }
.stat-card.stat-orange .stat-icon { background: var(--warn-ll);    color: var(--warn-dark); }
.stat-card.stat-red    .stat-icon { background: var(--error-ll);   color: var(--error-text); }
.stat-card .stat-num { font-weight: var(--heading-weight); letter-spacing: var(--heading-track); }
/* Sin icono (resumen de la organización): una raya fina de color sobre la cifra */
.stat-card:not(:has(.stat-icon))::before {
  content: ""; display: block; width: 1.75rem; height: 3px; margin: 0 auto .7rem;
  border-radius: var(--r-full); background: var(--slate-300);
}
.stat-card.stat-blue:not(:has(.stat-icon))::before   { background: var(--accent); }
.stat-card.stat-green:not(:has(.stat-icon))::before  { background: var(--stat-green); }
.stat-card.stat-orange:not(:has(.stat-icon))::before { background: var(--warn); }

/* Tablas: cabecera sin fondo, filete fino */
.data-table thead th {
  background: transparent; color: var(--text-sm);
  font-size: .7rem; letter-spacing: .07em; border-bottom: 1px solid var(--border-md);
}

/* Botones */
.btn { border-radius: var(--r-btn); }
.btn-primary, .btn-success { box-shadow: var(--sh-btn); }
.btn-secondary {
  background: var(--surface); color: var(--slate-700);
  border: 1px solid var(--border-md); box-shadow: 0 1px 2px rgba(15,23,42,.05);
}
.btn-secondary:hover { background: var(--slate-50); border-color: var(--input-border); }

/* Enlaces sin clase: el color del tema (antes, el azul por defecto del navegador) */
:where(main, footer) a:where(:not([class])) { color: var(--link); }
:where(main) a:where(:not([class])) { text-decoration-thickness: 1px; text-underline-offset: .18em; }
:where(main) a:where(:not([class])):hover { color: var(--link-hover); text-decoration-thickness: 2px; }
:where(footer) a:where(:not([class])) { color: var(--slate-600); }

/* Campos: borde con contraste suficiente y anillo de foco suave */
.field textarea, .choice textarea, textarea.input { border: 1px solid var(--input-border); border-radius: var(--r8); }
.input:hover, .field input:hover, .field select:hover, .field textarea:hover { border-color: var(--input-border-hover); }
.field input:focus-visible, .field select:focus-visible, .field textarea:focus-visible {
  border-color: var(--focus); box-shadow: 0 0 0 3px var(--accent-l);
}
.field select, select.input { background-color: var(--surface); color: var(--text); }

/* Pestañas de la organización: una sola línea; si no caben, se desplazan */
.subnav ul { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: thin; }
.subnav a { white-space: nowrap; padding-inline: .7rem; }


/* ── Dashboard ──────────────────────────────────────────────────
   Componentes propios del dashboard (style.css) con el mismo
   acabado que el portal. Sin efecto en el portal: allí no existen. */

/* Contenedores principales: radio y sombra difusa del portal */
.card, .login-page, .review-main, .review-sidebar { border-radius: var(--r-panel); box-shadow: var(--sh-panel); }
.workflow-panel, .export-accordion, .exp-tab, .action-banner { border-radius: var(--r-panel); }
.review-subsection, .issue-row, .skip-section, .drop-zone { border-radius: var(--r-btn); }
.export-accordion, .issue-row { box-shadow: 0 1px 2px rgba(15,23,42,.04); }

/* Títulos de página */
:where(main) h1 { letter-spacing: var(--heading-track); }
.upload-card h1 { font-weight: var(--heading-weight); }

/* Campos: style.css les pone var(--border-md) (#cbd5e1, 1,5:1 sobre blanco,
   no llega al 3:1 de 1.4.11) y quita el contorno de foco. Mismos selectores
   que style.css: al cargarse después, ganan. */
textarea,
.form-control, .login-form .form-control,
.val-field-row input, .val-field-row textarea, .val-field-row select,
.a11y-summary-block textarea, .onix-ai-textarea, .incompat-textarea,
.page-source-input, .caption-textarea, .lang-edit-input, .dl-sel {
  border-color: var(--input-border);
}
textarea:hover, .form-control:hover, .val-field-row input:hover, .val-field-row textarea:hover,
.val-field-row select:hover, .page-source-input:hover, .caption-textarea:hover,
.lang-edit-input:hover, .dl-sel:hover { border-color: var(--input-border-hover); }
textarea:focus-visible,
.form-control:focus-visible, .login-form .form-control:focus-visible,
.val-field-row input:focus-visible, .val-field-row textarea:focus-visible, .val-field-row select:focus-visible,
.a11y-summary-block textarea:focus-visible, .onix-ai-textarea:focus-visible, .incompat-textarea:focus-visible,
.page-source-input:focus-visible, .caption-textarea:focus-visible, .lang-edit-input:focus-visible, .dl-sel:focus-visible {
  outline: 2px solid var(--focus); outline-offset: 1px; border-color: var(--focus);
  box-shadow: 0 0 0 4px var(--accent-l);
}
:where(main) :where(input[type="checkbox"], input[type="radio"]) { accent-color: var(--accent-d); }
/* Prerrellenado por la IA: mismo tinte, borde con contraste (style.css lo fija con !important) */
.om-prefilled { border-color: var(--prefilled-border) !important; }

/* Botones con borde del dashboard */
.btn-outline-secondary, .btn-outline-report { border-radius: var(--r-btn); }