/*
 * Identidad: "libro mayor". Tinta azul profunda en la navegación, papel claro para el trabajo,
 * cifras con numerales tabulares alineadas a la derecha. Un único elemento protagonista:
 * la cadena de conciliación del inicio (facturado → recaudado → liquidado → abonado → conciliado).
 */
:root {
  /* Paleta institucional según el Manual de Marca GMP-DC-002 v002: Pantone 282 C (azul, 50 %), 7407 C (dorado, 30 %)
     y 320 C (turquesa, 20 %). Tipografía de textos: Frutiger (Optima solo en el logotipo). */
  --rada-noche: #152342;        /* Pantone 282 C */
  --rada-noche-2: #20335c;
  --rada-indigo: #152342;       /* acción principal: azul de marca */
  --rada-indigo-osc: #0d1730;
  --rada-oro: #c09e58;          /* Pantone 7407 C */
  --rada-oro-osc: #9a7c3d;
  --rada-oro-claro: #dcc28c;
  --rada-turquesa: #0097a6;     /* Pantone 320 C */
  --rada-turquesa-osc: #00717d;
  --tinta: var(--rada-noche);
  --tinta-2: var(--rada-noche-2);
  --papel: #f7f6f3;
  --linea: #dfe3ea;
  --cuenta: var(--rada-turquesa-osc);
  --texto: #1d1b26;
  --tenue: #55607a;
  --bs-link-color: var(--cuenta);
  --bs-link-color-rgb: 0, 113, 125;
  --bs-link-hover-color: var(--rada-noche);
  --bs-link-hover-color-rgb: 21, 35, 66;
  --bs-primary: #152342;
  --bs-primary-rgb: 21, 35, 66;
  --bs-body-font-family: Frutiger, "Frutiger LT Std", "Frutiger LT 55 Roman", "Segoe UI", "Source Sans 3", "Helvetica Neue", Arial, sans-serif;
  --bs-body-color: var(--texto);
}

/* Botones y controles con la paleta institucional */
.btn-primary { --bs-btn-bg: var(--rada-indigo); --bs-btn-border-color: var(--rada-indigo); --bs-btn-hover-bg: var(--rada-indigo-osc); --bs-btn-hover-border-color: var(--rada-indigo-osc);
  --bs-btn-active-bg: var(--rada-noche-2); --bs-btn-active-border-color: var(--rada-noche-2); --bs-btn-disabled-bg: var(--rada-indigo); --bs-btn-disabled-border-color: var(--rada-indigo); }
.btn-outline-primary { --bs-btn-color: var(--rada-indigo); --bs-btn-border-color: var(--rada-indigo); --bs-btn-hover-bg: var(--rada-indigo); --bs-btn-hover-border-color: var(--rada-indigo);
  --bs-btn-active-bg: var(--rada-indigo-osc); --bs-btn-active-border-color: var(--rada-indigo-osc); }
.btn-oro { --bs-btn-color: #152342; --bs-btn-bg: var(--rada-oro); --bs-btn-border-color: var(--rada-oro); --bs-btn-hover-color: #152342; --bs-btn-hover-bg: var(--rada-oro-claro);
  --bs-btn-hover-border-color: var(--rada-oro-claro); --bs-btn-active-bg: var(--rada-oro-osc); --bs-btn-active-border-color: var(--rada-oro-osc); --bs-btn-active-color: #fff; }
.form-control:focus, .form-select:focus, .form-check-input:focus { border-color: #66c1ca; box-shadow: 0 0 0 .2rem rgba(0, 151, 166, .22); }
.form-check-input:checked { background-color: var(--rada-indigo); border-color: var(--rada-indigo); }
.nav-tabs .nav-link.active, .nav-pills .nav-link.active { border-bottom-color: var(--rada-oro); }
.nav-pills .nav-link.active { background-color: var(--rada-indigo); }
.page-link { color: var(--rada-indigo); }
.active > .page-link, .page-link.active { background-color: var(--rada-indigo); border-color: var(--rada-indigo); }

body { background: var(--papel); font-size: .925rem; }
.salto:focus { position: absolute; z-index: 1000; background: #fff; padding: .5rem 1rem; }

/* Estructura */
.marco { display: flex; min-height: 100vh; }
.lateral {
  width: 232px; flex: 0 0 232px; background: var(--tinta); color: #e8edf5;
  display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; overflow-y: auto;
}
.marca { display: flex; gap: .65rem; align-items: center; padding: 1.1rem 1rem 1rem; border-bottom: 1px solid var(--tinta-2); line-height: 1.15; }
.marca small { color: #b8c2d6; }
.marca { flex-direction: column; align-items: flex-start; gap: .7rem; }
.marca-logo { display: block; width: 176px; max-width: 100%; height: auto; padding: .35rem 0; } /* horizontal negativo; mínimo digital 100 px */
.marca-sistema { border-top: 1px solid rgba(192, 158, 88, .45); padding-top: .55rem; width: 100%; font-size: .8rem; color: #d3d9e6; letter-spacing: .03em; }
.marca-sistema strong { color: var(--rada-oro); font-weight: 600; }
.lateral .nav { padding: .6rem 0; }
.lateral .nav-link { color: #d3d9e6; padding: .42rem 1.1rem; border-left: 3px solid transparent; }
.lateral .nav-link:hover { color: #fff; background: var(--tinta-2); }
.lateral .nav-link.active { color: #fff; border-left-color: var(--rada-oro); background: var(--tinta-2); font-weight: 600; }
.lateral .nav-link:focus-visible, .btn:focus-visible, a:focus-visible { outline: 3px solid var(--rada-oro); outline-offset: 2px; }
.usuario { margin-top: auto; padding: 1rem; border-top: 1px solid var(--tinta-2); font-size: .85rem; }

.area { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.barra { display: flex; gap: .75rem; align-items: center; padding: .85rem 1.5rem; background: #fff; border-bottom: 1px solid var(--linea); }
.contenido { padding: 1.25rem 1.5rem 3rem; }

@media (max-width: 991.98px) {
  .lateral { position: fixed; left: -240px; z-index: 1040; transition: left .2s; }
  .lateral.abierto { left: 0; box-shadow: 0 0 0 100vmax rgba(0,0,0,.35); }
  .contenido { padding: 1rem; }
}
@media (prefers-reduced-motion: reduce) { .lateral { transition: none; } }

/* Superficies: un solo nivel de panel, sin sombras decorativas */
.panel { background: #fff; border: 1px solid var(--linea); border-radius: .375rem; padding: 1rem 1.1rem; margin-bottom: 1.1rem; }
.panel > h2, .panel > h3 { font-size: 1rem; font-weight: 600; margin-bottom: .75rem; }
.ayuda { color: var(--tenue); font-size: .85rem; }

/* Cifras */
.num, td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.negativo { color: #b42318; }

/* Cadena de conciliación (elemento protagonista del inicio) */
.cadena { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border: 1px solid var(--linea); border-radius: .375rem; background: #fff; overflow: hidden; margin-bottom: 1.1rem; }
.eslabon { padding: 1rem 1.1rem; position: relative; border-right: 1px solid var(--linea); }
.eslabon:last-child { border-right: 0; background: #eef7f6; }
.eslabon:not(:last-child)::after {
  content: ""; position: absolute; right: -9px; top: 50%; width: 16px; height: 16px; background: #fff;
  border-top: 1px solid var(--linea); border-right: 1px solid var(--linea); transform: translateY(-50%) rotate(45deg); z-index: 1;
}
.eslabon .etq { color: var(--tenue); font-size: .8rem; }
.eslabon .val { font-size: 1.35rem; font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.eslabon .sub { font-size: .78rem; color: var(--tenue); }
.eslabon:last-child .val { color: var(--cuenta); }
.medidor { width: 100%; height: 6px; margin-top: .5rem; appearance: none; border: 0; border-radius: 3px; background: var(--linea); }
.medidor::-webkit-progress-bar { background: var(--linea); border-radius: 3px; }
.medidor::-webkit-progress-value { background: var(--cuenta); border-radius: 3px; }
.medidor::-moz-progress-bar { background: var(--cuenta); border-radius: 3px; }
@media (max-width: 991.98px) { .cadena { grid-template-columns: 1fr 1fr; } .eslabon::after { display: none; } .eslabon { border-bottom: 1px solid var(--linea); } .eslabon .val { font-size: 1.05rem; } }

.alertas { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: .75rem; margin-bottom: 1.1rem; }
.alerta { background: #fff; border: 1px solid var(--linea); border-left: 4px solid var(--tenue); border-radius: .25rem; padding: .65rem .8rem; color: inherit; text-decoration: none; }
.alerta:hover { border-color: #b9c2cf; }
.alerta .n { font-size: 1.15rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.alerta.riesgo { border-left-color: #b42318; }
.alerta.aviso { border-left-color: #b54708; }
.alerta.info { border-left-color: #1d6fa5; }

/* Tablas */
.tabla-datos { font-size: .86rem; background: #fff; }
.tabla-datos thead th { background: #eef1f5; font-weight: 600; white-space: nowrap; border-bottom: 1px solid #c9d1dc; position: sticky; top: 0; z-index: 1; }
.tabla-datos thead th a { color: inherit; text-decoration: none; }
.tabla-datos thead th a:hover { text-decoration: underline; }
.tabla-datos td { vertical-align: middle; }
.tabla-datos .obs { max-width: 26rem; color: var(--tenue); font-size: .8rem; }
.tabla-scroll { overflow: auto; max-height: 72vh; border: 1px solid var(--linea); border-radius: .375rem; }
.tabla-scroll .table { margin: 0; }
.estado { font-weight: 500; font-size: .76rem; white-space: normal; text-align: left; line-height: 1.25; }
.demo { font-size: .66rem; background: #fdf2c4; color: #6b4e00; border-radius: .2rem; padding: .05rem .3rem; }
.hash { font-family: Consolas, monospace; font-size: .72rem; color: var(--tenue); }

.filtros .form-label { font-size: .78rem; color: var(--tenue); margin-bottom: .15rem; }
.pestanas { margin-bottom: 1rem; }

/* Trazabilidad */
.traza { list-style: none; padding-left: 0; margin: 0; }
.traza > li { border-left: 2px solid var(--linea); padding: .35rem 0 .35rem 1rem; position: relative; }
.traza > li::before { content: ""; position: absolute; left: -6px; top: .75rem; width: 10px; height: 10px; border-radius: 50%; background: #fff; border: 2px solid var(--cuenta); }
.traza .traza { margin-top: .35rem; }
dl.ficha { display: grid; grid-template-columns: max-content 1fr; gap: .25rem 1rem; margin: 0; font-size: .86rem; }
dl.ficha dt { color: var(--tenue); font-weight: 400; }
dl.ficha dd { margin: 0; word-break: break-word; }

.fondo-simple { min-height: 100vh; background: radial-gradient(circle at 30% 20%, #20335c 0, var(--rada-noche) 60%) fixed; }
.login-logo { display: block; width: 9rem; height: auto; margin: 0 auto 1rem; }
.tarjeta-login h1 { color: var(--rada-noche); }
.simple { max-width: 420px; margin: 9vh auto; padding: 0 1rem; }
.tarjeta-login { background: #fff; border-radius: .5rem; padding: 2rem; }

@media print {
  .lateral, .barra, .no-imprimir, .btn { display: none !important; }
  .contenido { padding: 0; }
  .panel, .cadena { break-inside: avoid; }
}

/* ---------- Revisión diaria ---------- */
.lead-resumen { font-size: 1.05rem; }
.texto-ok { color: #1c7c43; }
.tabla-cuadre { min-width: 980px; }
.tabla-cuadre th[scope=row] { font-weight: 600; min-width: 13rem; }
.tabla-cuadre .fila-explica td { white-space: normal; }
.tabla-cuadre .separador { border-left: 2px solid var(--linea); }
.tabla-cuadre .fila-canal > * { border-bottom: 0; padding-top: .55rem; }
.tabla-cuadre .fila-explica td { color: var(--tenue); font-size: .82rem; padding-top: 0; padding-bottom: .55rem; }
.tabla-cuadre tfoot th, .tabla-cuadre tfoot td { font-weight: 600; background: #f1f4f8; }
.semaforo { display: inline-block; font-size: .78rem; font-weight: 600; padding: .15rem .55rem; border-radius: 1rem; white-space: nowrap; }
.sem-ok { background: #e3f4ea; color: #1c7c43; }
.sem-pendiente { background: #fff1d6; color: #8a5a00; }
.sem-revisar { background: #eceff3; color: #4b5563; }
.paso { display: inline-flex; align-items: center; justify-content: center; width: 1.6rem; height: 1.6rem; border-radius: 50%; font-weight: 700; font-size: .85rem; }
.paso-ok { background: #e3f4ea; color: #1c7c43; }
.paso-falta { background: #fde4e4; color: #b42318; }
.paso-sugerido { background: #e0efff; color: #1d4ed8; }
.paso-espera, .paso-sin_datos { background: #eceff3; color: #6b7280; }
.paso-na { color: #9ca3af; }
.paso-efectivo { background: #fff1d6; color: #8a5a00; }
.leyenda .paso { width: 1.25rem; height: 1.25rem; font-size: .7rem; }
.obs-corta { max-width: 26rem; }
.lista-pendientes { list-style: none; padding: 0; margin: 0; counter-reset: p; }
.lista-pendientes .pend { border-left: 4px solid var(--linea); padding: .5rem .75rem; margin-bottom: .6rem; background: #fafbfc; border-radius: 0 .375rem .375rem 0; }
.pend-warning { border-left-color: #e0a800 !important; }
.pend-danger { border-left-color: #d64545 !important; }
.pend-info { border-left-color: #3b82f6 !important; }
.sugerencia { border: 1px solid var(--linea); border-radius: .375rem; padding: .6rem .75rem; margin-bottom: .6rem; }
.barra-seleccion { position: sticky; top: 0; background: #fff; z-index: 2; padding: .35rem 0; }
.lista-cruce { max-height: 58vh; overflow-y: auto; }
.item-cruce { display: grid; grid-template-columns: auto 1fr auto; gap: .6rem; align-items: start; padding: .45rem .5rem; border-bottom: 1px solid var(--linea); cursor: pointer; }
.item-cruce:hover { background: #f6f9fc; }
.item-cruce.marcado { background: #e8f4f3; }
.item-cruce.tiene-sugerencia .item-ref strong::after { content: " •"; color: #1d4ed8; }
.item-ref { min-width: 0; }
.item-valor { font-weight: 600; white-space: nowrap; }
.barra-cruce { position: sticky; bottom: 0; z-index: 3; display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; background: var(--tinta); color: #fff; padding: .6rem 1rem; border-radius: .375rem; margin-top: 1rem; }
.barra-cruce .sumas { display: flex; flex-wrap: wrap; gap: 1rem; }
.barra-cruce input { flex: 1 1 18rem; }
.barra-cruce .negativo { color: #ffb4b4; }
.barra-cruce .texto-ok { color: #9be7b8; }
@media (max-width: 575px) { .barra-cruce .sumas { gap: .5rem; } }
.grupo-modo { border: 0; border-top: 1px solid var(--linea); padding: .6rem 0 0; margin: .6rem 0 0; min-width: 0; }
.grupo-modo:first-of-type { border-top: 0; padding-top: 0; margin-top: 0; }
.grupo-modo legend { font-size: .92rem; font-weight: 600; margin-bottom: .15rem; display: flex; justify-content: space-between; align-items: center; gap: .5rem; }

/* ---------- Revisión diaria: vista amigable ---------- */
.barra-filtros { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: .75rem 1.5rem; padding: .75rem 1rem; }
.filtros-fila { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .6rem 1rem; margin: 0; }
.campo { display: flex; flex-direction: column; gap: .2rem; min-width: 11rem; }
.campo > label { font-size: .75rem; font-weight: 600; color: var(--tenue); text-transform: uppercase; letter-spacing: .03em; }
.navegador-dia { min-width: 16rem; }
.info-ventana { text-align: right; font-size: .85rem; line-height: 1.3; }
@media (max-width: 767px) { .info-ventana { text-align: left; } .campo { min-width: 100%; } }

.pasos-revision { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; margin-bottom: 1rem; }
.paso-rev { display: flex; gap: .6rem; align-items: center; padding: .6rem .8rem; background: #fff; border: 1px solid var(--linea); border-radius: .5rem; color: var(--texto); text-decoration: none; line-height: 1.2; }
.paso-rev small { color: var(--tenue); }
.paso-rev:hover { border-color: #b9c2cf; background: #fbfcfd; }
.paso-rev.activo { border-color: var(--cuenta); box-shadow: inset 0 -3px 0 var(--cuenta); }
.paso-num { flex: 0 0 auto; width: 1.9rem; height: 1.9rem; border-radius: 50%; display: grid; place-items: center; background: #eceff3; font-weight: 700; color: var(--tenue); }
.paso-rev.activo .paso-num { background: var(--cuenta); color: #fff; }
@media (max-width: 767px) { .pasos-revision { grid-template-columns: 1fr 1fr; } }

.tipos-cruce { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; margin-bottom: .75rem; }
.tipo-cruce { display: flex; flex-direction: column; gap: .2rem; padding: .7rem .85rem; background: #fff; border: 1px solid var(--linea); border-radius: .5rem; color: var(--texto); text-decoration: none; }
.tipo-cruce span { color: var(--tenue); font-size: .82rem; }
.tipo-cruce:hover { border-color: #b9c2cf; }
.tipo-cruce.activo { border: 2px solid var(--cuenta); background: #f2f9f8; }
.modo-chip { align-self: flex-start; font-style: normal; font-size: .72rem; font-weight: 600; padding: .05rem .5rem; border-radius: 1rem; margin-top: .15rem; }
.modo-chip.auto { background: #e3f4ea; color: #1c7c43; }
.modo-chip.manual { background: #eceff3; color: #4b5563; }
@media (max-width: 767px) { .tipos-cruce { grid-template-columns: 1fr; } }

.guia-cruce { background: #fff; border: 1px solid var(--linea); border-radius: .5rem; padding: .65rem .9rem; margin-bottom: 1rem; }
.pasos-cruce { list-style: none; display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; padding: 0; margin: 0 0 .35rem; font-size: .9rem; }
.pasos-cruce li { display: flex; align-items: center; gap: .4rem; }
.pasos-cruce li > span { width: 1.4rem; height: 1.4rem; border-radius: 50%; background: var(--tinta); color: #fff; display: grid; place-items: center; font-size: .75rem; font-weight: 700; }
.chips-filtro { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; margin-top: .4rem; }
.chip-filtro { background: #eef4ff; color: #1e3a8a; border-radius: 1rem; padding: .1rem .6rem; font-size: .8rem; }

.cabeza-lado { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .5rem; margin-bottom: .5rem; }
.cabeza-lado h2 { font-size: 1rem; font-weight: 600; display: flex; align-items: center; gap: .45rem; }
.cabeza-lado input { max-width: 16rem; }
.letra-lado { width: 1.6rem; height: 1.6rem; border-radius: .35rem; background: var(--tinta); color: #fff; display: grid; place-items: center; font-size: .85rem; }
.lado-cruce .lista-cruce { max-height: 60vh; border-top: 1px solid var(--linea); }
.item-cruce { border-left: 3px solid transparent; padding: .55rem .6rem; }
.item-cruce .form-check-input { width: 1.15rem; height: 1.15rem; margin-top: .15rem; }
.item-cruce.marcado { background: #e8f4f3; border-left-color: var(--cuenta); }
.item-cruce.coincide { background: #f0fbf4; border-left-color: #1c7c43; }
.item-linea1 { display: block; }
.item-principal { display: block; font-size: .86rem; overflow-wrap: anywhere; }
.item-etiquetas { display: flex; flex-wrap: wrap; gap: .25rem; margin-top: .2rem; }
.etq { font-size: .72rem; background: #f1f3f6; color: #4b5563; border-radius: .25rem; padding: .02rem .4rem; }
.etq-cajero { background: #fff4e0; color: #7a4b00; }
.item-valor { font-size: .98rem; text-align: right; display: flex; flex-direction: column; align-items: flex-end; }
.tag-igual { display: none; font-size: .68rem; font-weight: 600; color: #1c7c43; }
.item-cruce.coincide .tag-igual { display: block; }
.vacio { text-align: center; padding: 2rem 1rem; }

.barra-cruce { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: .6rem 1.2rem; padding: .75rem 1rem; box-shadow: 0 -4px 12px rgba(27,42,65,.18); }
.barra-cruce .sumas { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.25rem; }
.barra-cruce .suma { display: flex; flex-direction: column; line-height: 1.15; }
.barra-cruce .suma small { color: #b9c6da; font-size: .72rem; }
.barra-cruce .suma strong { font-size: 1.05rem; font-variant-numeric: tabular-nums; }
.estado-cruce { font-size: .85rem; padding: .15rem .6rem; border-radius: 1rem; background: rgba(255,255,255,.12); }
.estado-cruce.ok { background: #1c7c43; color: #fff; }
.estado-cruce.dif { background: #8a5a00; color: #fff; }
.barra-cruce .motivo { display: flex; flex-direction: column; gap: .35rem; }
.motivos-rapidos { display: flex; flex-wrap: wrap; gap: .3rem; }
.motivos-rapidos .btn { --bs-btn-padding-y: .05rem; --bs-btn-font-size: .75rem; }
.barra-cruce input { flex: 1 1 auto; }
@media (max-width: 991px) { .barra-cruce { grid-template-columns: 1fr; } }
.fila-ajuste { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .4rem .8rem; align-items: center; padding: .5rem 0; border-top: 1px solid var(--linea); font-size: .88rem; }
.fila-ajuste > span:last-child { flex: 1 1 18rem; max-width: 30rem; }
.ajuste-nc { background: #fff8e6; border: 1px solid #f2d48a; border-radius: .375rem; padding: .4rem .6rem; }
.zona-riesgo { border-color: #f1b4b4; }
.zona-riesgo summary { cursor: pointer; }
.sep-notas { font-size: .8rem; font-weight: 600; padding: .5rem .6rem .25rem; background: #fff8e6; border-top: 1px solid #f2d48a; }
.item-nota { background: #fffcf3; }

/* ---------- Reporte de ventas ---------- */
.kpis-ventas { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: .6rem; margin-bottom: 1rem; }
.kpi-v { background: #fff; border: 1px solid var(--linea); border-radius: .5rem; padding: .75rem .9rem; }
.kpi-v .etq { color: var(--tenue); font-size: .8rem; }
.kpi-v .val { font-size: 1.3rem; font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.kpi-v .sub { font-size: .78rem; color: var(--tenue); }
.kpi-v.principal { border: 2px solid var(--cuenta); background: #f2f9f8; }
.kpi-v.principal .val { color: var(--cuenta); }
.col-barra { min-width: 11rem; }
.barra-part { width: 7rem; height: .6rem; vertical-align: middle; appearance: none; border: 0; border-radius: .3rem; background: var(--linea); }
.barra-part::-webkit-meter-bar { background: var(--linea); border: 0; border-radius: .3rem; height: .6rem; }
.barra-part::-webkit-meter-optimum-value { background: var(--cuenta); border-radius: .3rem; }
.barra-part::-moz-meter-bar { background: var(--cuenta); border-radius: .3rem; }
.tabla-tipos thead th { text-align: center; vertical-align: bottom; white-space: normal; line-height: 1.2; }
.tabla-tipos .col-ventas { background: #fbeefa; }
.tabla-tipos thead .col-ppto { background: #fff36b; }
.tabla-tipos .fila-grupo th, .tabla-tipos .fila-grupo td { font-weight: 600; border-top: 1px solid #c9d1dc; }
.tabla-tipos .fila-sede td { color: var(--tenue); font-size: .8rem; padding-left: 1.4rem; }
.tabla-tipos tfoot th, .tabla-tipos tfoot td { font-weight: 700; border-top: 2px solid var(--texto); background: #f1f4f8; }
.input-ppto { min-width: 9rem; }
.tabla-datos .col-base { background: #eef7f6; }
.validacion-resumen { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .5rem; }
.val-tarjeta { display: flex; flex-direction: column; gap: .2rem; padding: .6rem .75rem; border: 1px solid var(--linea); border-radius: .5rem; color: var(--texto); text-decoration: none; background: #fff; }
.val-tarjeta .n { font-size: 1.3rem; font-weight: 700; }
.val-tarjeta.activa { border: 2px solid var(--cuenta); background: #f2f9f8; }
.val-tarjeta .semaforo { align-self: flex-start; white-space: normal; }
.col-facturas { min-width: 12rem; max-width: 22rem; white-space: normal; }

/* ---------- Tablero gerencial de ventas ---------- */
.dashboard { --d-fondo: #f4f4f1; --d-tarjeta: #fff; --d-borde: #e1e6ee; --d-tinta: #1b2333; --d-tinta2: #55607a; --d-tenue: #8a93a6;
  --d-navy: var(--rada-noche); --d-s1: #152342; --d-s1b: #6d7c9c; --d-s1c: #c6cddb; --d-s2: #c09e58; --d-s3: #0097a6; --d-meta: #c09e58; --d-ok: #0a7d0a; --d-baja: #c0392b;
  --d-oro: var(--rada-oro); --d-oro-claro: var(--rada-oro-claro);
  background: var(--d-fondo); color: var(--d-tinta); margin: -1rem; padding: 1rem; border-radius: .5rem; font-variant-numeric: tabular-nums; }
.db-toolbar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: .75rem; margin-bottom: .75rem; }
.db-cabecera { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; background: var(--d-navy); color: #fff;
  border-radius: .6rem; padding: .9rem 1.2rem; margin-bottom: .75rem; border-bottom: 4px solid var(--d-oro); }
.db-marca { display: flex; align-items: center; gap: .9rem; }
.db-marca { align-items: center; flex: 1 1 26rem; min-width: 0; }
.db-control { margin-left: auto; }
.db-marca img { width: 150px; height: auto; flex: none; padding-right: 1.1rem; margin-right: .2rem; border-right: 1px solid rgba(192, 158, 88, .45); }
.db-empresa { font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--d-oro-claro); font-weight: 600; }
.db-titulo { font-size: 1.55rem; font-weight: 700; margin: .1rem 0 0; color: #fff; }
.db-cab-der { display: flex; flex-wrap: wrap; gap: .3rem 1.5rem; margin-top: .45rem; }
.db-cab-der span { display: block; font-size: .68rem; text-transform: uppercase; letter-spacing: .06em; color: #c3cde0; }
.db-cab-der strong { font-size: .92rem; }
.db-grid { display: grid; grid-auto-flow: row dense; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: .75rem; margin-bottom: .75rem; }
.db-grid .c-2 { grid-column: span 2; } .db-grid .c-3 { grid-column: span 3; } .db-grid .c-4 { grid-column: span 4; } .db-grid .c-5 { grid-column: span 5; }
.db-grid .c-6 { grid-column: span 6; } .db-grid .c-7 { grid-column: span 7; } .db-grid .c-8 { grid-column: span 8; }
.db-tarjeta { background: var(--d-tarjeta); border: 1px solid var(--d-borde); border-radius: .6rem; padding: .9rem 1rem; box-shadow: 0 1px 2px rgba(20, 48, 79, .06); min-width: 0; break-inside: avoid; }
.db-tit { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: .25rem .75rem; margin-bottom: .6rem; }
.db-tit h2 { font-size: .9rem; font-weight: 700; margin: 0; color: var(--d-navy); border-left: 3px solid var(--d-oro); padding-left: .5rem; }
.db-kpi.heroe { border-top: 3px solid var(--d-oro); }
/* Control documental (ISO 9001, información documentada) */
.db-control { display: grid; grid-template-columns: repeat(4, auto); gap: 0; border: 1px solid rgba(255, 255, 255, .25); border-radius: .4rem; overflow: hidden; }
.db-control > div { padding: .3rem .7rem; border-left: 1px solid rgba(255, 255, 255, .2); }
.db-control > div:first-child { border-left: 0; }
.db-control span { display: block; font-size: .62rem; text-transform: uppercase; letter-spacing: .06em; color: #c3cde0; }
.db-control strong { font-size: .85rem; white-space: nowrap; }
.db-firmas { display: grid; grid-template-columns: repeat(3, 1fr) 1.4fr; gap: .75rem; background: #fff; border: 1px solid var(--d-borde); border-radius: .6rem; padding: .7rem 1rem; margin-bottom: .5rem; font-size: .8rem; }
.db-firmas span { display: block; font-size: .64rem; text-transform: uppercase; letter-spacing: .06em; color: var(--d-tinta2); }
.db-firmas strong { color: var(--d-navy); }
.db-firmas .leyenda-sgc { color: var(--d-tinta2); font-size: .72rem; border-left: 3px solid var(--d-oro); padding-left: .6rem; }
@media (max-width: 768px) { .db-control { grid-template-columns: repeat(2, auto); } .db-firmas { grid-template-columns: 1fr 1fr; } }
.db-leyenda { white-space: nowrap; font-size: .72rem; color: var(--d-tinta2); display: inline-flex; flex-wrap: wrap; align-items: center; gap: .2rem .5rem; }
/* Muestras de color con bordes: se imprimen aunque el navegador no imprima fondos */
.sw { display: inline-block; width: 0; height: 0; border: .35rem solid var(--d-s1); border-radius: 2px; vertical-align: -1px; margin-right: .1rem; }
.sw.habil, .sw.s1 { border-color: var(--d-s1); } .sw.sabado { border-color: var(--d-s1b); } .sw.finde { border-color: var(--d-s1c); } .sw.s2 { border-color: var(--d-s2); }
.sw.prom { width: .8rem; border-width: 2px 0 0; border-style: dashed; border-color: var(--d-tinta); border-radius: 0; vertical-align: 3px; }
.sw.meta { height: .9rem; border-width: 0 0 0 3px; border-color: var(--d-meta); border-radius: 0; }
.db-etq { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--d-tinta2); font-weight: 600; }
.db-sub { font-size: .76rem; color: var(--d-tinta2); }
.db-sub.fuerte { color: var(--d-tinta); font-weight: 600; font-size: .9rem; margin-top: .2rem; }
.db-heroe { font-size: 2.3rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.1; margin: .2rem 0; }
.db-valor { font-size: 1.8rem; font-weight: 700; margin: .3rem 0; }
.db-valor.sube { color: var(--d-ok); } .db-valor.baja { color: var(--d-baja); }
.db-spark { width: 100%; height: 3.4rem; display: block; margin-top: .5rem; }
.db-spark .area { fill: #d6eef1; } .db-spark .linea { fill: none; stroke: var(--d-s3); stroke-width: 2; vector-effect: non-scaling-stroke; }
.db-spark .meta { stroke: var(--d-meta); stroke-width: 1.5; stroke-dasharray: 5 4; vector-effect: non-scaling-stroke; }
.db-anillo { display: flex; align-items: center; gap: .9rem; margin-top: .4rem; }
.db-anillo svg { width: 5.8rem; height: 5.8rem; flex: none; }
.db-anillo .pista { fill: none; stroke: #eceff4; stroke-width: 10; }
.db-anillo .avance { fill: none; stroke: var(--d-s3); stroke-width: 10; stroke-linecap: round; }
.db-anillo .avance.ok { stroke: var(--d-ok); }
.db-anillo .valor { font-size: 17px; font-weight: 700; fill: var(--d-tinta); }
.db-anillo-txt div + div { margin-top: .5rem; }
.db-anillo-txt span, .db-mini span, .db-pie-graf span { display: block; font-size: .68rem; text-transform: uppercase; letter-spacing: .05em; color: var(--d-tinta2); }
.db-anillo { min-width: 0; } .db-anillo-txt { min-width: 0; }
.db-anillo-txt strong { font-size: .9rem; white-space: nowrap; }
.db-mini { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; margin-top: .5rem; }
.db-mini div { background: #f4f6f9; border-radius: .45rem; padding: .5rem .6rem; }
.db-mini strong { font-size: 1.05rem; }
.db-mini em { display: block; font-style: normal; font-size: .7rem; color: var(--d-tinta2); }
.db-mini.seis { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.db-grid .c-12 { grid-column: span 12; }
.db-anillo { flex-wrap: wrap; }
.db-restan { flex: 1 1 13rem; min-width: 0; border-left: 3px solid var(--d-oro); padding-left: .8rem; font-size: .78rem; color: var(--d-tinta2); }
.db-restan > strong { display: block; font-size: 1.25rem; color: var(--d-navy); line-height: 1.2; }
.db-restan > em { display: block; font-style: normal; font-size: .72rem; margin-bottom: .35rem; }
.db-restan-fila { display: flex; justify-content: space-between; gap: .5rem; border-top: 1px solid #edf0f4; padding-top: .25rem; margin-top: .25rem; }
.db-restan-fila b { color: var(--d-tinta); white-space: nowrap; }
.db-select { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .5rem; }
.db-select select { min-width: 16rem; }
.db-grafica { width: 100%; height: auto; display: block; }
.db-grafica .guia { stroke: #e9edf2; stroke-width: 1; }
.db-grafica .eje { stroke: #9aa7b5; stroke-width: 1; }
.db-grafica .eti-eje { font-size: 12px; fill: var(--d-tenue); }
.db-grafica .eti-dia { font-size: 12px; fill: var(--d-tinta2); }
.db-grafica .eti-dia.tenue { fill: #b2bcc8; }
.db-grafica .eti-valor { font-size: 12px; font-weight: 700; fill: var(--d-tinta); }
.db-grafica .zona { fill: transparent; }
.db-grafica .db-dia:hover .zona { fill: #f1f5f9; }
.db-grafica .col-dia { fill: var(--d-s1); } .db-grafica .col-dia.sabado { fill: var(--d-s1b); } .db-grafica .col-dia.domfest { fill: var(--d-s1c); }
.db-grafica .db-dia:hover .col-dia { fill: var(--d-s3); }
.db-grafica .linea-prom { stroke: var(--d-tinta); stroke-width: 1.5; stroke-dasharray: 6 5; }
.db-pie-graf { display: flex; flex-wrap: wrap; gap: .5rem 2rem; border-top: 1px solid #edf0f4; padding-top: .55rem; margin-top: .4rem; }
.db-pie-graf strong { font-size: .92rem; }
.db-apilada { width: 100%; height: 1.6rem; display: block; margin: .3rem 0 .8rem; }
.db-apilada .s1 { fill: var(--d-s1); } .db-apilada .s2 { fill: var(--d-s2); }
.db-comp > div { display: grid; grid-template-columns: auto 1fr auto 3.6rem; align-items: center; gap: .5rem; font-size: .86rem; padding: .35rem 0; border-bottom: 1px solid #edf0f4; }
.db-comp em { font-style: normal; color: var(--d-tinta2); text-align: right; }
.db-lista-datos { margin-top: .7rem; }
.db-lista-datos > div { display: flex; justify-content: space-between; gap: .75rem; font-size: .82rem; padding: .3rem 0; color: var(--d-tinta2); }
.db-lista-datos strong { color: var(--d-tinta); white-space: nowrap; }
.db-nota { font-size: .72rem; color: var(--d-tinta2); margin: .6rem 0 0; }
.db-barra { width: 100%; height: 10px; display: block; overflow: visible; }
.db-barra .pista { fill: #eef1f5; } .db-barra .relleno { fill: var(--d-s1); } .db-barra.alt .relleno { fill: var(--d-s3); } .db-barra .meta { fill: var(--d-meta); }
.db-unidades { display: grid; gap: .15rem; margin-bottom: .6rem; }
.db-unidad { display: grid; grid-template-columns: minmax(6rem, 9rem) minmax(5rem, 1fr) 8.5rem 4rem; align-items: center; gap: .7rem; padding: .45rem .3rem; border-radius: .35rem; }
.db-unidad:hover, .db-ranking li:hover { background: #f4f6f9; }
.db-unidad .nombre { font-weight: 600; font-size: .86rem; }
.db-unidad .cifras { font-size: .8rem; line-height: 1.15; }
.db-unidad .cifras strong { display: block; font-size: .92rem; }
.db-unidad .cifras span { color: var(--d-tinta2); }
.db-chip { justify-self: end; font-size: .76rem; font-weight: 700; padding: .15rem .5rem; border-radius: 1rem; background: #e3f3f5; color: var(--rada-turquesa-osc); white-space: nowrap; }
.db-chip.ok { background: #e3f4e3; color: var(--d-ok); } .db-chip.neutro { background: #f0f2f5; color: var(--d-tinta2); font-weight: 500; }
.db-tabla-env { overflow-x: auto; }
.db-tabla { width: 100%; border-collapse: collapse; font-size: .78rem; }
.db-tabla th, .db-tabla td { padding: .3rem .45rem; border-bottom: 1px solid #edf0f4; text-align: left; }
.db-tabla .num { text-align: right; white-space: nowrap; }
.db-tabla thead th { font-size: .66rem; text-transform: uppercase; letter-spacing: .04em; color: var(--d-tinta2); border-bottom: 1px solid #c9d2dc; }
.db-tabla tbody th { font-weight: 600; }
.db-tabla tfoot th, .db-tabla tfoot td { font-weight: 700; border-top: 2px solid var(--d-navy); border-bottom: 0; }
.db-ranking { list-style: none; margin: 0; padding: 0; }
.db-ranking li { display: grid; grid-template-columns: 1.4rem minmax(0, 2.2fr) minmax(3rem, 1fr) 4.8rem; align-items: center; gap: .6rem; padding: .32rem .3rem; font-size: .82rem; border-radius: .35rem; }
.db-ranking.con-cant li { grid-template-columns: 1.4rem minmax(0, 2.2fr) minmax(3rem, 1fr) 4.8rem 3.8rem; }
.db-ranking .pos { color: var(--d-tenue); font-weight: 700; text-align: right; }
.db-ranking .nom { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.db-ranking strong { text-align: right; white-space: nowrap; }
.db-ranking em { font-style: normal; color: var(--d-tinta2); text-align: right; white-space: nowrap; font-size: .78rem; }
.db-pie { font-size: .72rem; color: var(--d-tinta2); padding: .25rem .25rem 0; }
@media (max-width: 1200px) {
  .db-grid .c-2, .db-grid .c-3, .db-grid .c-4 { grid-column: span 6; }
  .db-grid .c-5, .db-grid .c-7, .db-grid .c-8 { grid-column: span 12; }
}
@media (max-width: 768px) {
  .db-grid .c-2, .db-grid .c-3, .db-grid .c-4, .db-grid .c-6 { grid-column: span 12; }
  .db-cab-der { gap: 1rem; flex-wrap: wrap; }
  .db-unidad { grid-template-columns: minmax(0, 1fr) auto; }
  .db-unidad .db-barra { grid-column: 1 / -1; grid-row: 2; }
  .db-ranking.con-cant li { grid-template-columns: 1.4rem minmax(0, 1fr) 5.2rem 3.6rem; }
  .db-ranking.con-cant .db-barra { display: none; }
}
.dashboard.exportando { width: 1400px; max-width: none; margin: 0; }
.dashboard.exportando .db-grid .c-2 { grid-column: span 2; } .dashboard.exportando .db-grid .c-3 { grid-column: span 3; } .dashboard.exportando .db-grid .c-4 { grid-column: span 4; }
.dashboard.exportando .db-grid .c-5 { grid-column: span 5; } .dashboard.exportando .db-grid .c-6 { grid-column: span 6; } .dashboard.exportando .db-grid .c-7 { grid-column: span 7; }
.dashboard.exportando .db-grid .c-8 { grid-column: span 8; } .dashboard.exportando .db-grid .c-12 { grid-column: span 12; } .dashboard.exportando .db-mini.seis { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.dashboard.exportando .db-control { grid-template-columns: repeat(4, auto); } .dashboard.exportando .db-firmas { grid-template-columns: repeat(3, 1fr) 1.4fr; }
.dashboard.exportando .db-unidad { grid-template-columns: minmax(6rem, 9rem) minmax(5rem, 1fr) 8.5rem 4rem; }
.dashboard.exportando .db-unidad .db-barra { grid-column: auto; grid-row: auto; }
.dashboard.exportando .db-ranking.con-cant li { grid-template-columns: 1.4rem minmax(0, 2.2fr) minmax(3rem, 1fr) 4.8rem 3.8rem; }
.dashboard.exportando .db-ranking.con-cant .db-barra { display: block; }
@media print {
  @page { size: landscape; margin: 8mm; }
  .dashboard { margin: 0; padding: 0; background: #fff; font-size: 11px; }
  .dashboard, .dashboard * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .db-tarjeta { box-shadow: none; }
  .db-grafica .db-dia .zona { fill: transparent; }
  .db-grid, .db-cabecera { break-inside: avoid; }
  .db-grid .c-2 { grid-column: span 2; } .db-grid .c-3 { grid-column: span 3; } .db-grid .c-4 { grid-column: span 4; } .db-grid .c-5 { grid-column: span 5; }
  .db-grid .c-6 { grid-column: span 6; } .db-grid .c-7 { grid-column: span 7; } .db-grid .c-8 { grid-column: span 8; } .db-grid .c-12 { grid-column: span 12; }
  .db-mini.seis { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
@media screen and (max-width: 1200px) { .db-mini.seis { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media screen and (max-width: 768px) { .db-mini.seis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
