/* User Provided Stylesheet */

/* ==========================================================================
   SIDRo — identidad visual sobre el tema book-theme de MyST.
   Es la misma de EVA (Evaluación y análisis de riesgos de desastres): paleta de
   las tres capas del riesgo, tamaños de fuente de CCDR-tools, sidebar fijo e
   íconos de amenaza como en el CLIMAAX Handbook.
   Este archivo es la fuente; `construir_css.py` le añade los íconos (SVG
   incrustados) y escribe `sidro.css`, que es el que usa myst.yml.
   ========================================================================== */

:root {
  /* Paleta EVA: las tres capas del riesgo del logo, más el azul noche del texto */
  --eva-noche: #0b2545;
  --eva-rio: #1a6fa3;         /* amenaza */
  --eva-rio-oscuro: #145a8c;
  --eva-bosque: #2e7d32;      /* exposición */
  --eva-tierra: #c8811a;      /* vulnerabilidad */
  --eva-alerta: #c2410c;
  --eva-niebla: #f4f7fa;
  --eva-titulo: var(--eva-noche);
  --eva-texto: #2b3440;
  --eva-borde: #e3e8ee;
  --eva-sidebar-fondo: #fbfcfd;
  --eva-ancho-sidebar: 18rem;
  --eva-alto-barra: 60px;
  --eva-ancho-logo: 157px;   /* proporción 188:48 del logo, a 40 px de alto */
  --eva-alto-logo: 40px;

  /* Tamaños de fuente de CCDR-tools (GFDRR) */
  --eva-fs-texto: 16px;
  --eva-lh-texto: 1.65;
  --eva-fs-sidebar: 14px;
  --eva-fs-h1: 36px;
  --eva-fs-h2: 32px;
  --eva-fs-h3: 19.2px;
  --eva-fs-h4: 16px;
  --eva-fs-tabla: 14.4px;

  /* Colores del tema MyST */
  --myst-color-link: var(--eva-rio);
  --myst-color-link-hover: var(--eva-noche);
  --myst-color-link-underline: var(--eva-rio);
  --myst-color-primary: var(--eva-rio);
  --myst-color-primary-hover: var(--eva-rio-oscuro);
  --myst-color-active: var(--eva-rio);
  --myst-color-active-bg: rgba(26, 111, 163, 0.1);
  --myst-color-accent-text: var(--eva-noche);
  --myst-color-focus-ring: var(--eva-rio);
  --myst-color-focus-outline: #9cc8e6;
  --myst-color-info: var(--eva-rio);
  --myst-color-info-text: var(--eva-rio-oscuro);
  --myst-color-info-bg: #eaf3fa;
  --myst-color-success: var(--eva-bosque);
  --myst-color-success-text: var(--eva-bosque);
  --myst-color-success-bg: #edf6ee;
  --myst-color-warning: var(--eva-tierra);
  --myst-color-warning-text: #9a5f0c;
  --myst-color-warning-bg: #fdf4e5;
  --myst-color-danger: var(--eva-alerta);
  --myst-color-danger-text: var(--eva-alerta);
  --myst-color-danger-bg: #fdefe8;
  --myst-color-prose-body: var(--eva-texto);
}

.dark {
  --eva-titulo: #e8eef4;
  --eva-texto: #d7dde4;
  --eva-borde: #33404d;
  --eva-niebla: #1d2733;
  --eva-sidebar-fondo: #161d26;
  --myst-color-link: #5dade2;
  --myst-color-link-hover: #a9d4f0;
  --myst-color-link-underline: #5dade2;
  --myst-color-primary: #5dade2;
  --myst-color-active: #5dade2;
  --myst-color-active-bg: rgba(93, 173, 226, 0.16);
  --myst-color-accent-text: #e8eef4;
  --myst-color-info: #5dade2;
  --myst-color-info-text: #8cc6ec;
  --myst-color-success: #66bb6a;
  --myst-color-success-text: #81c784;
  --myst-color-warning: #f0a830;
  --myst-color-warning-text: #f5bf63;
  --myst-color-danger: #fb8c55;
  --myst-color-danger-text: #fb8c55;
  --myst-color-prose-body: var(--eva-texto);
}

/* --------------------------------------------------------------------------
   Tipografía (tamaños de CCDR-tools en todo el libro)
   -------------------------------------------------------------------------- */
html { font-size: 16px; }

article,
article p,
article li,
article dd,
article dt,
article blockquote {
  font-size: var(--eva-fs-texto) !important;
  line-height: var(--eva-lh-texto) !important;
}

article { color: var(--eva-texto); }

h1, article h1 {
  font-size: var(--eva-fs-h1) !important;
  line-height: 1.15;
  font-weight: 650;
  letter-spacing: -0.01em;
  color: var(--eva-titulo);
}

article h2 {
  font-size: var(--eva-fs-h2) !important;
  line-height: 1.15 !important;
  font-weight: 500;
  letter-spacing: -0.01em;
  color: var(--eva-titulo);
  margin-top: 2.2rem;
}

article h3 {
  font-size: var(--eva-fs-h3) !important;
  line-height: 1.25;
  font-weight: 600;
  color: var(--eva-titulo);
}

article h4 { font-size: var(--eva-fs-h4) !important; color: var(--eva-titulo); }

/* Subtítulo de la página */
.myst-fm-block-subtitle, article > div p.text-zinc-600, header + p {
  font-size: var(--eva-fs-h3);
}

article table, article table p { font-size: var(--eva-fs-tabla) !important; }
article table th {
  background: var(--eva-niebla);
  color: var(--eva-titulo);
  font-weight: 600;
}
article table tbody tr:nth-child(even) { background: color-mix(in srgb, var(--eva-niebla) 55%, transparent); }

figcaption, article figcaption p { font-size: 14.4px; line-height: 1.55; }

/* Esquema de la página (derecha) */
.myst-outline, .myst-outline a, nav[aria-label="Document Outline"], nav[aria-label="Document Outline"] a {
  font-size: var(--eva-fs-sidebar);
}

/* --------------------------------------------------------------------------
   Barra superior: logo a la izquierda, alineado con el sidebar
   -------------------------------------------------------------------------- */
.myst-top-nav { border-bottom: 1px solid var(--eva-borde); box-shadow: none; }

.myst-home-link-logo { flex: none; margin-right: 0 !important; }
.myst-home-link img {
  height: var(--eva-alto-logo) !important;
  width: var(--eva-ancho-logo) !important;
  max-width: none;
}

.myst-home-link span {
  font-size: 12.5px !important;
  line-height: 1.2;
  letter-spacing: 0;
  color: var(--myst-color-text-secondary);
  max-width: 15rem;
  white-space: normal;
  margin-left: 0.75rem;
  padding-left: 0.75rem;
  border-left: 1px solid var(--eva-borde);
}

/* En pantallas angostas el logo de SIDRo (más ancho que el de EVA) basta: el lema no cabe junto a la búsqueda */
@media (max-width: 639px) {
  .myst-home-link span { display: none; }
}

/* --------------------------------------------------------------------------
   Sidebar: tamaño de CCDR, encabezados de sección y elemento activo
   -------------------------------------------------------------------------- */
.myst-primary-sidebar,
.myst-primary-sidebar .myst-toc,
.myst-primary-sidebar a {
  font-size: var(--eva-fs-sidebar);
  line-height: var(--eva-lh-texto);
}

.myst-primary-sidebar .myst-toc-item { margin-top: 1px; margin-bottom: 1px; }
.myst-primary-sidebar .myst-toc-item > a,
.myst-primary-sidebar .myst-toc > a { padding-top: 0.3rem; padding-bottom: 0.3rem; }

/* El logo ya lleva al inicio */
.myst-primary-sidebar .myst-toc > a:first-child { display: none; }

/* «3. Análisis» encabeza la lista de amenazas, que queda siempre visible */
.myst-primary-sidebar .myst-toc > a[href$="/book/analisis"] {
  font-weight: 600;
  color: var(--eva-titulo);
  margin-top: 0.9rem;
  padding-left: 0.5rem;
}

/* Secciones del libro, como los encabezados de CCDR y CLIMAAX */
.myst-primary-sidebar .myst-toc > div > .myst-toc-item > a[href$="/book/conceptos"],
.myst-primary-sidebar .myst-toc > div > .myst-toc-item > a[href$="/book/datos"],
.myst-primary-sidebar .myst-toc > div > .myst-toc-item > a[href$="/book/analisis"],
.myst-primary-sidebar .myst-toc > div > .myst-toc-item > :not(a):first-child {
  font-weight: 600;
  color: var(--eva-titulo);
}
.myst-primary-sidebar .myst-toc > div:has(> .myst-toc-item > a[href$="/book/datos"]),
.myst-primary-sidebar .myst-toc > div:last-child { margin-top: 0.9rem; }

/* Segundo nivel con guía vertical (como CLIMAAX) */
.myst-primary-sidebar .collapsible-content {
  margin-left: 0.55rem;
  padding-left: 0.6rem;
  border-left: 1px solid var(--eva-borde);
}

.myst-primary-sidebar .myst-toc-item.myst-toc-item-exact {
  background: var(--myst-color-active-bg);
  box-shadow: inset 3px 0 0 var(--myst-color-active);
}
.myst-primary-sidebar .myst-toc-item.myst-toc-item-exact > a { color: var(--myst-color-active); }

.myst-primary-sidebar-footer {
  font-size: 12px;
  line-height: 1.5;
  padding: 0.75rem 1rem !important;
  margin: 0 !important;
  border-top: 1px solid var(--eva-borde);
  color: var(--myst-color-text-secondary);
}
.myst-primary-sidebar-footer p { margin: 0; }

/* --------------------------------------------------------------------------
   Sidebar fijo y siempre visible desde 1024 px (como CLIMAAX y CCDR)
   -------------------------------------------------------------------------- */
@media (min-width: 1024px) {
  /* Sin botón de menú: el índice siempre está a la vista */
  .myst-top-nav-menu-button { display: none !important; }

  .myst-top-nav { padding-left: 0 !important; }
  .myst-top-nav-bar { max-width: none !important; }
  .myst-top-nav-bar > div:first-child {
    width: auto;
    min-width: var(--eva-ancho-sidebar) !important;
    margin-right: 1.5rem !important;
  }
  .myst-home-link { margin-left: 1.25rem !important; }

  .myst-primary-sidebar.myst-primary-sidebar {
    display: block !important;
    position: fixed !important;
    top: var(--eva-alto-barra) !important;
    left: 0 !important;
    width: var(--eva-ancho-sidebar) !important;
    max-width: none !important;
    height: calc(100vh - var(--eva-alto-barra)) !important;
    pointer-events: auto !important;
    background: var(--eva-sidebar-fondo);
    border-right: 1px solid var(--eva-borde);
    box-shadow: none !important;
  }
  .myst-primary-sidebar-pointer {
    display: flex !important;
    height: 100%;
    width: 100%;
  }
  .myst-primary-sidebar-nav { padding: 1rem 0.75rem 1rem 1rem; }
  .myst-primary-sidebar-toc { margin-left: 0 !important; margin-right: 0 !important; max-width: none !important; }
  .myst-primary-sidebar-footer { opacity: 1 !important; transform: none !important; }

  /* El contenido empieza a la derecha del sidebar */
  main.article-grid { margin-left: var(--eva-ancho-sidebar); }
}

/* Con el sidebar fijo, la rejilla ya no reserva el margen izquierdo del tema */
@media (min-width: 1280px) {
  main.article-grid,
  main .article-grid {
    grid-template-columns:
      [screen-start] .25rem [screen-inset-start page-start] 1rem [page-inset-start body-outset-start] 1fr
      [body-start gutter-left-start] 1rem [body-inset-start] minmax(8ch, 11ch) [middle-start] minmax(8ch, 11ch)
      [gutter-left-end] minmax(8ch, 11ch) minmax(8ch, 11ch) [gutter-right-start] minmax(8ch, 11ch) [middle-end]
      minmax(8ch, 11ch) [body-inset-end] 1rem [body-end gutter-right-end] 3rem [body-outset-end] minmax(5rem, 14rem)
      [page-inset-end] 2rem [page-end] 1fr [screen-inset-end] .25rem [screen-end];
  }
}

/* --------------------------------------------------------------------------
   Íconos de amenaza en el sidebar (como los del CLIMAAX Handbook)
   -------------------------------------------------------------------------- */
.myst-primary-sidebar a[href$='/analisis/sismo/cuaderno'], .myst-primary-sidebar a[href$='/analisis/incendio-forestal/cuaderno'], .myst-primary-sidebar a[href$='/analisis/mov-masa/cuaderno'], .myst-primary-sidebar a[href$='/analisis/incendio-urbano/cuaderno'], .myst-primary-sidebar a[href$='/analisis/calor/cuaderno'], .myst-primary-sidebar a[href$='/analisis/sintesis'] {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.myst-primary-sidebar a[href$='/analisis/sismo/cuaderno']::before, .myst-primary-sidebar a[href$='/analisis/incendio-forestal/cuaderno']::before, .myst-primary-sidebar a[href$='/analisis/mov-masa/cuaderno']::before, .myst-primary-sidebar a[href$='/analisis/incendio-urbano/cuaderno']::before, .myst-primary-sidebar a[href$='/analisis/calor/cuaderno']::before, .myst-primary-sidebar a[href$='/analisis/sintesis']::before {
  content: "";
  flex: none;
  width: 1.45em;
  height: 1.45em;
  background: no-repeat center / contain;
}
.myst-primary-sidebar a[href$='/analisis/sismo/cuaderno']::before { background-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 32 32%22%3E %3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 y1=%220%22 x2=%221%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23A07BD6%22/%3E%3Cstop offset=%221%22 stop-color=%22%234A2C82%22/%3E%3C/linearGradient%3E%3C/defs%3E %3Ccircle cx=%2216%22 cy=%2216%22 r=%2216%22 fill=%22url(%23g)%22/%3E %3Crect x=%2210.5%22 y=%226%22 width=%2211%22 height=%2214.5%22 fill=%22%23fff%22/%3E %3Cg fill=%22%234A2C82%22%3E%3Crect x=%2212.3%22 y=%228%22 width=%222.4%22 height=%222.4%22/%3E%3Crect x=%2217.3%22 y=%228%22 width=%222.4%22 height=%222.4%22/%3E %3Crect x=%2212.3%22 y=%2212.3%22 width=%222.4%22 height=%222.4%22/%3E%3Crect x=%2217.3%22 y=%2212.3%22 width=%222.4%22 height=%222.4%22/%3E%3C/g%3E %3Cpath d=%22M16.4 6 L15 10.5 L17.2 13.4 L15.4 17 L16.6 20.5%22 fill=%22none%22 stroke=%22%234A2C82%22 stroke-width=%221.1%22 stroke-linejoin=%22round%22/%3E %3Cpath d=%22M4.5 25 H9 L10.6 22 L12.6 28 L14.6 20.5 L16.6 27.5 L18.6 22.5 L20.4 26 L22 24 L23.2 25 H27.5%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.7%22 stroke-linejoin=%22round%22 stroke-linecap=%22round%22/%3E %3C/svg%3E"); }
.myst-primary-sidebar a[href$='/analisis/incendio-forestal/cuaderno']::before { background-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 32 32%22%3E %3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 y1=%220%22 x2=%221%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%2366BB6A%22/%3E%3Cstop offset=%221%22 stop-color=%22%231B5E20%22/%3E%3C/linearGradient%3E%3C/defs%3E %3Ccircle cx=%2216%22 cy=%2216%22 r=%2216%22 fill=%22url(%23g)%22/%3E %3Cpath d=%22M11 6.5 L16.5 14 H13.8 L18 19.5 H14.6 L18.6 24.8 H3.4 L7.4 19.5 H4 L8.2 14 H5.5 Z%22 fill=%22%23fff%22/%3E %3Crect x=%229.9%22 y=%2224.8%22 width=%222.2%22 height=%223%22 fill=%22%23fff%22/%3E %3Cpath d=%22M22.8 11 C23.6 13.8 27.4 15.3 27.4 19.7 A4.8 4.8 0 0 1 17.8 19.7 C17.8 17.4 19 16.1 20.1 15 C20.1 16.5 20.8 17.4 21.7 17.7 C21.4 15.3 21.8 13.1 22.8 11 Z%22 fill=%22%23FFB74D%22/%3E %3Cpath d=%22M22.6 17 C23.1 18.4 24.8 19.1 24.8 21.1 A2.3 2.3 0 0 1 20.2 21.1 C20.2 19.9 21 19.2 21.6 18.7 C21.7 19.6 22.1 19.9 22.5 20 C22.3 19 22.2 18 22.6 17 Z%22 fill=%22%23FFF176%22/%3E %3C/svg%3E"); }
.myst-primary-sidebar a[href$='/analisis/mov-masa/cuaderno']::before { background-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 32 32%22%3E %3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 y1=%220%22 x2=%221%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23C49461%22/%3E%3Cstop offset=%221%22 stop-color=%22%236B4223%22/%3E%3C/linearGradient%3E%3C/defs%3E %3Ccircle cx=%2216%22 cy=%2216%22 r=%2216%22 fill=%22url(%23g)%22/%3E %3Cpath d=%22M4 27.5 H28.5 V7.5 C25.5 8.2 23.6 10.8 21.7 14 L18.3 19.4 C15.6 23.4 10.6 26.4 4 27.5 Z%22 fill=%22%23fff%22/%3E %3Cpath d=%22M22.6 9.8 L25.3 13.4 M24.4 8.8 L26.6 11.8%22 stroke=%22%236B4223%22 stroke-width=%221.1%22 stroke-linecap=%22round%22/%3E %3Ccircle cx=%2213.6%22 cy=%2224.6%22 r=%221.6%22 fill=%22%236B4223%22/%3E%3Ccircle cx=%2217.6%22 cy=%2222.6%22 r=%221.2%22 fill=%22%236B4223%22/%3E%3Ccircle cx=%2210.2%22 cy=%2226.2%22 r=%220.9%22 fill=%22%236B4223%22/%3E %3Cpath d=%22M16.2 8.8 L10.6 14.4 M10.6 14.4 L13.5 14.4 M10.6 14.4 L10.6 11.5%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.7%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22/%3E %3C/svg%3E"); }
.myst-primary-sidebar a[href$='/analisis/incendio-urbano/cuaderno']::before { background-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 32 32%22%3E %3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 y1=%220%22 x2=%221%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23EF5350%22/%3E%3Cstop offset=%221%22 stop-color=%22%238E0000%22/%3E%3C/linearGradient%3E%3C/defs%3E %3Ccircle cx=%2216%22 cy=%2216%22 r=%2216%22 fill=%22url(%23g)%22/%3E %3Crect x=%225.5%22 y=%2212%22 width=%229%22 height=%2215%22 fill=%22%23fff%22/%3E %3Crect x=%2214.5%22 y=%227.5%22 width=%227.5%22 height=%2219.5%22 fill=%22%23fff%22/%3E %3Cg fill=%22%23B71C1C%22%3E%3Crect x=%227.3%22 y=%2214.3%22 width=%222%22 height=%222%22/%3E%3Crect x=%2210.8%22 y=%2214.3%22 width=%222%22 height=%222%22/%3E %3Crect x=%227.3%22 y=%2218.6%22 width=%222%22 height=%222%22/%3E%3Crect x=%2210.8%22 y=%2218.6%22 width=%222%22 height=%222%22/%3E %3Crect x=%2216.3%22 y=%2210%22 width=%222%22 height=%222%22/%3E%3Crect x=%2216.3%22 y=%2214.3%22 width=%222%22 height=%222%22/%3E%3Crect x=%2216.3%22 y=%2218.6%22 width=%222%22 height=%222%22/%3E%3C/g%3E %3Cpath d=%22M23.8 13.5 C24.6 16.1 28.1 17.5 28.1 21.6 A4.4 4.4 0 0 1 19.3 21.6 C19.3 19.5 20.4 18.3 21.4 17.3 C21.4 18.7 22 19.5 22.9 19.8 C22.6 17.6 23 15.5 23.8 13.5 Z%22 fill=%22%23FFB74D%22/%3E %3Cpath d=%22M23.7 18.6 C24.2 19.9 25.7 20.5 25.7 22.3 A2.1 2.1 0 0 1 21.5 22.3 C21.5 21.2 22.2 20.6 22.8 20.1 C22.9 20.9 23.2 21.2 23.6 21.3 C23.4 20.4 23.3 19.5 23.7 18.6 Z%22 fill=%22%23FFF176%22/%3E %3C/svg%3E"); }
.myst-primary-sidebar a[href$='/analisis/calor/cuaderno']::before { background-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 32 32%22%3E %3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 y1=%220%22 x2=%221%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%23F28A4B%22/%3E%3Cstop offset=%221%22 stop-color=%22%23C0392B%22/%3E%3C/linearGradient%3E%3C/defs%3E %3Ccircle cx=%2216%22 cy=%2216%22 r=%2216%22 fill=%22url(%23g)%22/%3E %3Crect x=%2211.6%22 y=%226%22 width=%225.2%22 height=%2214%22 rx=%222.6%22 fill=%22%23fff%22/%3E %3Ccircle cx=%2214.2%22 cy=%2221.6%22 r=%224.4%22 fill=%22%23fff%22/%3E %3Crect x=%2213.2%22 y=%2211%22 width=%222%22 height=%229%22 rx=%221%22 fill=%22%23C0392B%22/%3E %3Ccircle cx=%2214.2%22 cy=%2221.6%22 r=%222.6%22 fill=%22%23C0392B%22/%3E %3Cg stroke=%22%23fff%22 stroke-width=%221.6%22 stroke-linecap=%22round%22%3E %3Cpath d=%22M20.5 10.5 H25 M20.5 14.5 H23.5 M20.5 18.5 H25%22/%3E %3C/g%3E %3C/svg%3E"); }
.myst-primary-sidebar a[href$='/analisis/sintesis']::before { background-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 32 32%22%3E %3Cdefs%3E%3ClinearGradient id=%22g%22 x1=%220%22 y1=%220%22 x2=%221%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%232B4C7E%22/%3E%3Cstop offset=%221%22 stop-color=%22%230B2545%22/%3E%3C/linearGradient%3E%3C/defs%3E %3Ccircle cx=%2216%22 cy=%2216%22 r=%2216%22 fill=%22url(%23g)%22/%3E %3Cpath d=%22M16 6.5 L26 11.5 L16 16.5 L6 11.5 Z%22 fill=%22%23fff%22/%3E %3Cpath d=%22M6 16 L16 21 L26 16%22 fill=%22none%22 stroke=%22%235DADE2%22 stroke-width=%222%22 stroke-linejoin=%22round%22/%3E %3Cpath d=%22M6 20.5 L16 25.5 L26 20.5%22 fill=%22none%22 stroke=%22%23F0A830%22 stroke-width=%222%22 stroke-linejoin=%22round%22/%3E %3C/svg%3E"); }