/* ════════════════════════════════════════════════════════════
   KIVO · BASE
   ════════════════════════════════════════════════════════════
   Tokens de este case y ajustes que deben cargar ANTES de las hojas de
   shared/, para que estas puedan sobrescribirlos. Enlazada en esa posición
   exacta en index.html: moverla cambia quién gana en la cascada.
   ════════════════════════════════════════════════════════════ */

/* Solo lo propio de este case. La base común de los tres vive en
   shared/case-base.css, que se carga justo antes de case-theme.css. */
:root {
  --font: "Inter", system-ui, sans-serif;
  --font-label: "Inter", system-ui, sans-serif;
  --font-display: "Instrument Sans", "Inter", system-ui, -apple-system, sans-serif;
  /* Shell UI (grad, spotlight, radios, pad) = default de case-master-look.css,
     Kivo es el case de referencia y no necesita override local. */
;
}

/* Colores de rol (collage RBAC) al 15% sobre el fondo. org/staff oscurecidos
   ~8-16% respecto al valor original — como texto plano sobre blanco (nombre
   de rol, check-icons) no llegaban a 4.5:1; cajero ya pasaba, sin cambios. */
.data-table-wrap {
  --role-org: #C34E40;
  --role-cajero: #4A6FA5;
  --role-staff: #547F54;
}

.data-table thead th {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-caption);
  background: var(--color-surface-2);
}

.data-table tr:last-child td,
.data-table tr:last-child th { border-bottom: 0;
}

.data-table tbody th {
  font-weight: 600;
  color: var(--color-ink);
  text-align: left;
  padding: 12px 14px;
  border-bottom: 1px solid var(--color-border);
  vertical-align: top;
}

.data-table tbody td {
  border-bottom: 1px solid var(--color-border);
  vertical-align: middle;
}

.check { font-weight: 600;
}

.impact-takeaway {
  margin-top: clamp(28px, 4vw, 40px);
  padding: clamp(24px, 3.5vw, 36px);
  border-radius: 16px;
  background:
    var(--color-surface-2);
  border: 1px solid var(--color-border);
}