/* -------------------------------------------------------------------------
   estilos-reveal.css
   Equivalente aproximado, para Quarto/reveal.js, de los estilos que en la
   versión xaringan proporcionaban ulpgcStats.css y titleClase0.css.
   Ajusta colores y tamaños a tu gusto: aquí sólo se reproducen las clases
   que usa el .qmd (.blue, .red, .resalta, .pull-left, .pull-right,
   .inverse, .bottom, .left, .right) y el fondo global con el logo.
   ------------------------------------------------------------------------- */

/* ---------- Tipografía general ---------- */
.reveal {
  --r-main-font-size: 30px;
  font-size: 30px;
}

.reveal h1 { font-size: 1.9em; }
.reveal h2 { font-size: 1.35em; margin-bottom: 0.4em; }
.reveal h3 { font-size: 1.15em; margin-bottom: 0.4em; }

.reveal ul, .reveal ol { margin-left: 1em; }
.reveal li { margin-bottom: 0.35em; }

/* En xaringan el texto va alineado a la izquierda */
.reveal .slides section { text-align: left; }

/* ---------- Fondo global (equivalente al `layout: true` del Rmd) ----------
   Se aplica a todas las diapositivas que no definen su propia imagen de
   fondo, igual que hacía la plantilla de remark.                          */
.reveal .slides > section:not(.stack):not([data-background-image]),
.reveal .slides > section > section:not([data-background-image]) {
  background-image: url("http://www.estadistica-dma.ulpgc.es/imagenes/uni2.png");
  background-size: 50% 75%;
  background-position: center;
  background-repeat: no-repeat;
}

/* Títulos que en la versión xaringan eran de nivel ### */
.reveal section.titulo-peq h2 { font-size: 1.15em; }

/* ---------- Colores de texto ---------- */
.blue  { color: #0b57d0; }
.red   { color: #cc0000; }
.green { color: #0b7a3b; }

/* Texto destacado (.resalta) */
.resalta {
  background-color: #fff3bf;
  border-left: 5px solid #f0a500;
  padding: 0.25em 0.5em;
  display: inline-block;
}

/* ---------- Columnas (equivalente a .pull-left / .pull-right) ---------- */
.pull-left {
  float: left;
  width: 47%;
}
.pull-right {
  float: right;
  width: 47%;
}
.pull-right + p, .pull-right + * { clear: both; }

/* Contenido centrado */
div.center { text-align: center; }
div.center img { display: block; margin: 0 auto; }

/* ---------- Diapositivas de sección (class: inverse, bottom, left) ------- */
.reveal section.inverse h1,
.reveal section.inverse h2,
.reveal section.inverse h3,
.reveal section.inverse p,
.reveal section.inverse li {
  color: #ffffff;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.7);
}

/* Colocación del título abajo a la izquierda */
.reveal .slides section.bottom {
  height: 100%;
  display: flex !important;
  flex-direction: column;
  justify-content: flex-end;
}
.reveal .slides section.left  { text-align: left; }
.reveal .slides section.right { text-align: right; }

.reveal .slides section.right {
  height: 100%;
  display: flex !important;
  flex-direction: column;
  justify-content: center;
}

/* ---------- Diapositiva de título ---------- */
/* Texto en blanco con sombra, para que se lea sobre la foto de fondo */
.reveal #title-slide .title,
.reveal #title-slide .subtitle,
.reveal #title-slide .quarto-title-authors,
.reveal #title-slide .date {
  color: #ffffff;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.85);
}

/* Velo oscuro sobre la imagen (sube o baja el 0.35 a tu gusto;
   pon la regla entre comentarios si no lo quieres) */
.reveal .backgrounds .slide-background:first-child .slide-background-content::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
}

.reveal .title,
.reveal #title-slide .title {
  font-size: 1.7em;
  margin-bottom: 1.5em;
}
.reveal #title-slide .subtitle {
  font-size: 1.1em;
}

/* ---------- Código ---------- */
.reveal pre code { font-size: 0.8em; line-height: 1.25; }

/* ---------- Escalas de texto intermedias ---------- */
.reveal .slides section.mediana  { font-size: 0.90em; }
.reveal .slides section.mediana2 { font-size: 0.82em; }
.reveal .slides section.mediana > *:not(h1):not(h2):not(h3) {
  font-size: 0.90em;
}

.question {
  color: var(--deep-blue);
  font-weight: 700;
  font-size: 1.05em;
}

.callout {
  border-left: 9px solid var(--cyan);
  padding: 0.6em 0.9em;
  background: #edf8fc;
  border-radius: 12px;
}

.callout-coral {
  border-left: 9px solid var(--coral);
  padding: 0.6em 0.9em;
  background: #fff0f4;
  border-radius: 12px;
}