/* AUDITOR IA — IDENTIDAD VISUAL 2026
   Capa independiente. No altera React ni el sidebar JS.
*/

:root {
  --aud-navy: #10345b;
  --aud-blue: #1e40af;
  --aud-teal: #0b7d7b;
  --aud-aqua: #14b8a6;
  --aud-bg: #f3f7fb;
  --aud-border: #dbe6f1;
  --aud-shadow: 0 12px 32px rgba(15, 52, 91, .07);
}

/* Base institucional */
body {
  background: var(--aud-bg);
  color: var(--aud-navy);
}

.workspace-main {
  background:
    radial-gradient(
      circle at 94% 3%,
      rgba(20,184,166,.07),
      transparent 30%
    ),
    #f3f7fb;
}

/* Encabezado de operación */
.workspace-main .section-header {
  position: relative;
  padding: 26px 30px;
  margin-bottom: 24px;
  border: 1px solid #d8eaf0;
  border-radius: 20px;
  background:
    radial-gradient(
      circle at 90% 20%,
      rgba(20,184,166,.16),
      transparent 38%
    ),
    linear-gradient(
      115deg,
      #ffffff 5%,
      #e8f5fa 70%,
      #d7f0f0 100%
    );
  box-shadow: var(--aud-shadow);
}

.workspace-main .section-header h2 {
  color: #10345b;
  font-weight: 800;
  letter-spacing: -.035em;
}

.workspace-main .section-header .eyebrow {
  color: #0b7d7b;
  font-weight: 750;
  letter-spacing: .1em;
}

/* Botón principal */
.workspace-main .section-header .button-link {
  background: linear-gradient(135deg, #0b7d7b, #08636d);
  border: 1px solid rgba(255,255,255,.15);
  color: white;
  border-radius: 12px;
  box-shadow: 0 6px 16px rgba(11,125,123,.16);
  transition: transform .18s, box-shadow .18s;
}

.workspace-main .section-header .button-link:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(11,125,123,.24);
}

/* Dashboard de métricas reales */
.audit-dashboard {
  width: 100%;
  margin: 0 0 26px;
  color: #10345b;
}

.audit-dashboard h1,
.audit-dashboard h2,
.audit-dashboard h3 {
  color: #10345b;
  letter-spacing: -.035em;
}

.audit-dashboard > :first-child {
  margin-top: 0;
}

/* Tarjetas KPI: aprovecha la estructura ya renderizada */
.audit-dashboard article,
.audit-dashboard [class*="metric-card"],
.audit-dashboard [class*="kpi-card"] {
  position: relative;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--aud-border);
  border-radius: 18px;
  box-shadow: var(--aud-shadow);
  transition:
    transform .2s ease,
    box-shadow .2s ease,
    border-color .2s ease;
}

.audit-dashboard article:hover,
.audit-dashboard [class*="metric-card"]:hover,
.audit-dashboard [class*="kpi-card"]:hover {
  transform: translateY(-3px);
  border-color: #a9d5da;
  box-shadow: 0 16px 36px rgba(15,52,91,.12);
}

/* Línea cromática por indicador */
.audit-dashboard article:nth-child(5n+1) {
  border-top: 4px solid #10a67b;
  background: linear-gradient(160deg,#fff,#f0fbf6);
}

.audit-dashboard article:nth-child(5n+2) {
  border-top: 4px solid #2563eb;
  background: linear-gradient(160deg,#fff,#eff6ff);
}

.audit-dashboard article:nth-child(5n+3) {
  border-top: 4px solid #ef6a66;
  background: linear-gradient(160deg,#fff,#fff4f3);
}

.audit-dashboard article:nth-child(5n+4) {
  border-top: 4px solid #8054db;
  background: linear-gradient(160deg,#fff,#f6f2ff);
}

.audit-dashboard article:nth-child(5n+5) {
  border-top: 4px solid #10a8b5;
  background: linear-gradient(160deg,#fff,#eefbfd);
}

.audit-dashboard article strong,
.audit-dashboard [class*="metric-card"] strong,
.audit-dashboard [class*="kpi-card"] strong {
  color: #10345b;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

/* Paneles institucionales */
.workspace-main .panel {
  border: 1px solid var(--aud-border);
  border-radius: 18px;
  background: #fff;
  box-shadow: var(--aud-shadow);
}

.workspace-main .panel-title h3 {
  color: #10345b;
  font-weight: 750;
}

.workspace-main .action-grid a {
  border: 1px solid #e0eaf4;
  border-radius: 13px;
  background: linear-gradient(150deg,#fff,#f8fbff);
  transition:
    border-color .18s,
    transform .18s,
    box-shadow .18s;
}

.workspace-main .action-grid a:hover {
  transform: translateY(-2px);
  border-color: #8cc9cb;
  box-shadow: 0 8px 20px rgba(15,52,91,.08);
}

.workspace-main .action-grid a strong {
  color: #0b7376;
}

.workspace-main .state-grid > * {
  border-radius: 12px;
  border-color: #dfe9f3;
  background: #f9fbfe;
}

/* Accesibilidad y adaptación */
@media (max-width: 900px) {
  .workspace-main .section-header {
    padding: 20px;
    border-radius: 15px;
  }
}

@media (max-width: 600px) {
  .workspace-main .section-header {
    padding: 16px;
  }

  .audit-dashboard article {
    border-radius: 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .audit-dashboard article,
  .workspace-main .action-grid a,
  .workspace-main .section-header .button-link {
    transition: none;
  }
}


/* A65E153 BANNER MEDICO START */

.workspace-main .section-header {
  background-image:
    linear-gradient(
      90deg,
      rgba(255,255,255,.98) 0%,
      rgba(245,251,255,.94) 35%,
      rgba(235,248,253,.30) 72%,
      rgba(235,248,253,.08) 100%
    ),
    url("/assets/branding/auditor_banner_medico.png");

  background-size: cover;
  background-position: center right;
  background-repeat: no-repeat;
  min-height: 185px;
}

.workspace-main .section-header h2 {
  position: relative;
  z-index: 1;
}

@media (max-width: 700px) {
  .workspace-main .section-header {
    min-height: 155px;
    background-position: 65% center;
  }
}

/* A65E153 BANNER MEDICO END */