:root {
  --fondo: #101b25;
  --superficie: #192936;
  --superficie2: #223643;
  --borde: #36505e;
  --texto: #e8f0f2;
  --secundario: #a1b7c0;
  --acento: #59c9b5;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  background: var(--fondo);
  color: var(--texto);
  font-size: 13px;
  line-height: 1.5;
}

.topbar {
  padding: 20px 3.5%;
  background: #14232e;
  border-bottom: 1px solid var(--borde);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 4px; font-size: 25px; }
h1 span { color: var(--acento); }
h2 { font-size: 17px; }
h3 { font-size: 14px; margin-bottom: 14px; }
p { color: var(--secundario); }

.eyebrow {
  color: var(--acento);
  font-weight: 700;
  font-size: 10px;
  letter-spacing: 1px;
}

main {
  max-width: 1550px;
  margin: 24px auto;
  padding: 0 24px;
}

.panel {
  background: var(--superficie);
  border: 1px solid var(--borde);
  border-radius: 10px;
  padding: 20px;
  margin-bottom: 18px;
}

.filtros {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

label {
  display: flex;
  flex-direction: column;
  gap: 5px;
  font-size: 12px;
  color: var(--secundario);
  font-weight: bold;
}

.buscar { grid-column: span 2; }

input, select {
  width: 100%;
  padding: 10px;
  border: 1px solid var(--borde);
  border-radius: 6px;
  background: var(--superficie2);
  color: var(--texto);
  font: inherit;
}

.acciones {
  display: flex;
  gap: 10px;
  align-items: end;
  flex-wrap: wrap;
  margin-top: 18px;
}

.btn {
  display: inline-block;
  padding: 10px 15px;
  background: var(--superficie2);
  color: var(--texto);
  border: 1px solid var(--borde);
  border-radius: 6px;
  text-decoration: none;
  font-weight: bold;
  font-size: 12px;
  cursor: pointer;
}

.btn:hover { border-color: var(--acento); }

.btn.principal {
  background: var(--acento);
  color: #10252a;
  border-color: var(--acento);
}

.modo { min-width: 180px; }

.cabecera-informe {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  border-bottom: 2px solid var(--acento);
  margin-bottom: 18px;
  padding-bottom: 14px;
}

.cabecera-informe h2 { margin: 8px 0 3px; }
.cabecera-informe p { margin: 0; }
.datos-informe { display: flex; flex-direction: column; text-align: right; }
.datos-informe span { color: var(--secundario); }

.indicadores {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
  margin-bottom: 18px;
}

.indicador {
  background: var(--superficie);
  border: 1px solid var(--borde);
  padding: 15px;
  border-radius: 9px;
}

.indicador span {
  color: var(--secundario);
  display: block;
  font-size: 11px;
}

.indicador strong {
  display: block;
  font-size: 27px;
  margin-top: 4px;
  color: var(--acento);
}

.resumenes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.resumenes .panel { margin-bottom: 18px; }

.tabla-resumen {
  width: 100%;
  border-collapse: collapse;
}

.tabla-resumen td, .tabla-resumen th {
  padding: 8px;
  border-bottom: 1px solid var(--borde);
  text-align: left;
}

.tabla-resumen .numero { text-align: right; }

.detalle-titulo {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.detalle-titulo span { color: var(--secundario); }

.tabla-scroll { overflow-x: auto; }

.tabla-detalle {
  width: 100%;
  border-collapse: collapse;
  min-width: 950px;
}

.tabla-detalle th, .tabla-detalle td {
  padding: 9px;
  text-align: left;
  border-bottom: 1px solid var(--borde);
  vertical-align: top;
}

.tabla-detalle th {
  background: var(--superficie2);
  color: var(--acento);
  white-space: nowrap;
}

.tabla-detalle td:nth-child(5) {
  min-width: 250px;
}

.fichas { display: none; }

.ficha {
  border: 1px solid var(--borde);
  border-left: 4px solid var(--acento);
  padding: 12px;
  margin: 10px 0;
  border-radius: 5px;
}

.ficha h4 { margin: 0 0 6px; }
.ficha p { margin: 0 0 6px; }
.ficha small { color: var(--secundario); }

.pie-informe {
  font-size: 10px;
  padding: 12px 0;
  color: var(--secundario);
}

.mensaje { padding: 10px 0; }

@media (max-width: 900px) {
  .filtros { grid-template-columns: 1fr 1fr; }
  .indicadores { grid-template-columns: repeat(2, 1fr); }
  .resumenes { grid-template-columns: 1fr; }
  .topbar, .cabecera-informe { flex-wrap: wrap; }
}

@media print {
  @page { size: A4 landscape; margin: 12mm; }

  :root {
    --fondo: #fff;
    --superficie: #fff;
    --superficie2: #eef2f4;
    --borde: #cbd4d9;
    --texto: #17232c;
    --secundario: #46525a;
    --acento: #176e72;
  }

  body { background: white; color: black; font-size: 9px; }
  main { max-width: none; margin: 0; padding: 0; }
  .no-print { display: none !important; }
  .panel, .indicador { box-shadow: none; border-radius: 0; }
  .panel { padding: 10px; }
  .indicador { padding: 9px; }
  .indicador strong { font-size: 18px; }
  .resumenes { gap: 8px; }
  .tabla-scroll { overflow: visible; }
  .tabla-detalle { min-width: 0; font-size: 8px; table-layout: auto; }
  .tabla-detalle th, .tabla-detalle td {
    padding: 5px;
    overflow-wrap: anywhere;
  }
  .tabla-detalle td:nth-child(5) { min-width: 0; }
  .cabecera-informe, .indicadores, .resumenes {
    break-inside: avoid;
  }
  tr, .ficha { break-inside: avoid; page-break-inside: avoid; }
  thead { display: table-header-group; }
  .detalle { border: none; padding: 0; }
  .pie-informe { margin-top: 12px; }
  body.imprimir-fichas .tabla-scroll { display: none; }
  body.imprimir-fichas .fichas { display: block; }
  body.imprimir-fichas .ficha { margin: 7px 0; }
}

@media screen { :root { --fondo:var(--lm-bg);--superficie:var(--lm-surface);--superficie2:var(--lm-surface-2);--borde:var(--lm-border);--texto:var(--lm-text);--secundario:var(--lm-text-dim);--acento:var(--lm-accent); } body{height:auto;overflow:auto;font-family:var(--lm-font-sans)}.topbar{background:var(--lm-surface)} }

html{height:auto;overflow:auto}.exportar-menu{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.exportar-menu label{font-size:12px;color:var(--secundario)}