/* MD Matemáticas — identidad visual: neo-brutalist / gaming */

:root {
  --md-navy: #262A3D;
  --md-teal: #5EC4B6;
  --md-amber: #F4736C;
  --md-lime: #FCE678;
  --md-paper: #EBF8EE;
  --md-ink: #1A1A1A;
  --md-black: #000000;
  --md-paper-fixed: #EBF8EE;
  --md-hero-bg: var(--md-teal);
  --md-ink-hero: #1A1A1A;
  --md-grid: rgba(38, 42, 61, 0.15);
  --md-edge: #000000;
  --md-page: var(--md-paper);
  --md-card: var(--md-paper);
  --md-surface: #ffffff;
  --md-text: #000000;
  --md-muted: #555555;
  --md-line: #bbbbbb;
  --md-help: #fffbe6;
  --md-ok-bg: #b6ead9;
  --md-bad-bg: #f9b7b1;
  --md-ok-fg: #0d6b57;
  --md-bad-fg: #b5352c;
  --md-warn-fg: #7a5b00;
  --md-shadow: 6px 6px 0 var(--md-edge);
  --md-shadow-sm: 4px 4px 0 var(--md-edge);
  --md-shadow-lg: 10px 10px 0 var(--md-edge);
  --md-border: 3px solid var(--md-edge);
}

body {
  color: var(--md-ink);
  background-color: var(--md-page);
  background-image:
    linear-gradient(to right, rgba(38, 42, 61, 0.08) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(38, 42, 61, 0.08) 1px, transparent 1px);
  background-size: 24px 24px;
}

h1, h2, h3, h4, h5, h6 {
  letter-spacing: -0.02em;
}

/* Enlaces: subrayado grueso de color, sin flechas extra */
a {
  text-decoration-color: var(--md-teal);
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

/* --- Navbar: barra negra a sangre, marca gigante --- */
.navbar {
  position: relative;
  border-bottom: 4px solid var(--md-edge);
  background: var(--md-navy) !important;
  padding-top: 0.6rem;
  padding-bottom: 0.6rem;
}

.navbar::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -4px;
  height: 4px;
  background: repeating-linear-gradient(
    90deg,
    var(--md-teal) 0, var(--md-teal) 24px,
    var(--md-amber) 24px, var(--md-amber) 48px,
    var(--md-lime) 48px, var(--md-lime) 72px
  );
}

.navbar-logo {
  height: 2.4rem !important;
  width: 2.4rem !important;
}

.navbar-title,
.navbar-brand {
  font-family: "Bricolage Grotesque", sans-serif;
  font-weight: 700;
  font-size: 1.4rem;
  text-transform: uppercase;
  letter-spacing: 0.01em;
  color: var(--md-lime) !important;
}

.navbar .nav-link {
  font-family: "Bricolage Grotesque", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 0.82rem;
  letter-spacing: 0.03em;
  color: var(--md-paper-fixed) !important;
  border: 2px solid transparent;
  padding: 0.35rem 0.75rem !important;
  margin: 0 0.15rem;
  border-radius: 0;
}

.navbar .nav-link:hover {
  color: var(--md-ink) !important;
  background: var(--md-lime);
  border-color: var(--md-edge);
}

.navbar .nav-link.active {
  color: var(--md-ink) !important;
  background: var(--md-teal);
  border-color: var(--md-edge);
}

.navbar .quarto-navbar-tools .bi,
.navbar .quarto-color-scheme-toggle,
.navbar .aa-DetachedSearchButton .aa-DetachedSearchButtonIcon {
  color: var(--md-paper-fixed) !important;
}

/* Interruptor claro/oscuro: botón con borde para que se vea */
.navbar .quarto-color-scheme-toggle {
  border: 2px solid var(--md-paper-fixed);
  padding: 0.2rem 0.45rem !important;
  margin-right: 0.5rem;
  line-height: 1;
}
.navbar .quarto-color-scheme-toggle:hover {
  background: var(--md-lime);
  color: #000 !important;
  border-color: #000;
}
.navbar .quarto-color-scheme-toggle .bi { font-size: 1.1rem; }

/* --- Sidebar de temario: lista tipo checklist --- */
#quarto-sidebar .sidebar-item-container {
  font-family: "Inter", sans-serif;
}

#quarto-sidebar .sidebar-item.active > .sidebar-item-container {
  border-left: 4px solid var(--md-lime);
  padding-left: 0.5rem;
  margin-left: -0.5rem;
  background: var(--md-navy);
}

#quarto-sidebar .sidebar-item.active > .sidebar-item-container .sidebar-link {
  color: var(--md-paper-fixed) !important;
}

#quarto-sidebar .sidebar-section > .sidebar-item-container .sidebar-link {
  font-family: "Bricolage Grotesque", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 0.8rem;
  letter-spacing: 0.03em;
}

/* --- Divisor: franja diagonal a sangre --- */
.lattice-divider {
  height: 22px;
  margin: 3rem 0;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  background: repeating-linear-gradient(
    -45deg,
    var(--md-teal) 0,
    var(--md-teal) 22px,
    var(--md-amber) 22px,
    var(--md-amber) 44px,
    var(--md-lime) 44px,
    var(--md-lime) 66px
  );
  border-top: var(--md-border);
  border-bottom: var(--md-border);
  transform: skewY(-1deg);
}

/* --- Pie de página --- */
.page-footer,
.footer {
  background: var(--md-navy);
  color: var(--md-paper-fixed, #EBF8EE);
  border-top: 4px solid var(--md-edge);
  font-family: "JetBrains Mono", monospace;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.page-footer a,
.footer a {
  color: var(--md-lime);
}

/* ================= Modo oscuro (paleta de mathgym.es) =================
   Fondo #141b26, superficies #1a2230 / #212b3b, línea #2a3648, texto #eceff4,
   acento #d163cc (morado de marca), oro #f8c818. Los colores de la academia
   (menta, coral, amarillo) se mantienen como acentos y sus textos siguen en negro. */
body.quarto-dark {
  --md-page: #141b26;
  --md-card: #1a2230;
  --md-paper: #212b3b;
  --md-surface: #1a2230;
  --md-ink: #eceff4;
  --md-text: #eceff4;
  --md-muted: #a8b3c4;
  --md-line: #2a3648;
  --md-edge: #05080d;
  --md-black: #05080d;
  --md-navy: #2c142c;
  --md-help: #2a2640;
  --md-ok-bg: #12483e;
  --md-bad-bg: #5a2420;
  --md-ok-fg: #5be3bb;
  --md-bad-fg: #ff8f86;
  --md-warn-fg: #f8c818;
  --md-hero-bg: linear-gradient(135deg, #3a1338 0%, #141b26 85%);
  --md-ink-hero: #eceff4;
  --md-grid: rgba(236, 239, 244, 0.1);
  color: var(--md-ink);
  background-image:
    linear-gradient(to right, rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
}
body.quarto-dark a { text-decoration-color: #d163cc; }
body.quarto-dark .navbar { border-bottom-color: #d163cc; }
body.quarto-dark .navbar::after { display: block; }
body.quarto-dark .page-footer, body.quarto-dark .footer { background: #0e131b; border-top-color: #2a3648; }
body.quarto-dark #quarto-sidebar .sidebar-item.active > .sidebar-item-container { background: #2c142c; border-left-color: #f8c818; }
body.quarto-dark .gym,
body.quarto-dark .ebau-ej,
body.quarto-dark .mdx-hoja,
body.quarto-dark .mdx-fs,
body.quarto-dark .mdx-rubrica { color: var(--md-ink); }
body.quarto-dark .gym-head,
body.quarto-dark .mdx-bar { background: #2c142c; border-color: #d163cc; }
body.quarto-dark .gym-btn,
body.quarto-dark .gym-choice { color: var(--md-ink); }
body.quarto-dark .gym-check,
body.quarto-dark .gym-next,
body.quarto-dark .gym-sol,
body.quarto-dark .gym-res,
body.quarto-dark .gym-help-btn,
body.quarto-dark .gym-choice:hover,
body.quarto-dark .mdx-banner,
body.quarto-dark .mdx-nota,
body.quarto-dark .mdx-elijo,
body.quarto-dark .gym-tip,
body.quarto-dark .gym-class .gym-help-btn { color: #000; }
body.quarto-dark .gym-stats span { color: var(--md-ink); }
body.quarto-dark .gym input:focus { background: #2c3a50; }
body.quarto-dark div.callout .callout-body-container { color: var(--md-ink); }
body.quarto-dark div.callout.callout-style-default > .callout-header,
body.quarto-dark div.callout .callout-title-container { color: #000; }
/* Callouts simples (sin cabecera de color): el título va en claro sobre el fondo oscuro */
body.quarto-dark div.callout.callout-style-simple .callout-title-container,
body.quarto-dark div.callout.callout-style-simple > .callout-header { color: var(--md-ink); }
body.quarto-dark div.callout { border-color: #2a3648 !important; box-shadow: 4px 4px 0 #05080d; }
body.quarto-dark .katex { color: inherit; }
body.quarto-dark .mdx-tabla th { background: #2a3648; }
body.quarto-dark table { --bs-table-color: var(--md-ink); }

/* Botón destacado «Simulacro PAU» en la barra de navegación */
.navbar a.nav-link[href$="examen/index.html"] {
  background: var(--md-amber);
  color: #000 !important;
  border-color: #000 !important;
  box-shadow: 3px 3px 0 #000;
  margin-left: 0.6rem;
  opacity: 1;
}
.navbar a.nav-link[href$="examen/index.html"]:hover { background: var(--md-lime); }
.navbar a.nav-link[href$="examen/index.html"].active { background: var(--md-teal); }

/* Botón brutalista (portada y avisos) */
.btn-brut {
  display: inline-block;
  font: 800 0.95rem "Bricolage Grotesque", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: #000 !important;
  background: var(--md-paper-fixed);
  border: 3px solid var(--md-edge);
  box-shadow: 5px 5px 0 var(--md-edge);
  padding: 0.7rem 1.2rem;
  text-decoration: none !important;
  transition: transform 0.08s, box-shadow 0.08s;
}
.btn-brut:hover { transform: translate(-2px, -2px); box-shadow: 7px 7px 0 var(--md-edge); }
.btn-brut:active { transform: translate(4px, 4px); box-shadow: 1px 1px 0 var(--md-edge); }
.btn-coral { background: var(--md-amber); }
.btn-yellow { background: var(--md-lime); }
.btn-big { font-size: 1.15rem; padding: 0.9rem 1.5rem; }

/* Aviso de simulacro en las portadas de ejercicios y actividades */
.pau-aviso {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.8rem 1.4rem;
  background: var(--md-lime);
  color: #000;
  border: 3px solid var(--md-edge);
  box-shadow: 6px 6px 0 var(--md-edge);
  padding: 1rem 1.3rem;
  margin: 1.2rem 0 2rem;
  transform: rotate(-0.5deg);
}
.pau-aviso strong { font: 800 1.15rem "Bricolage Grotesque", sans-serif; text-transform: uppercase; display: block; }
.pau-aviso span { flex: 1 1 18rem; font-weight: 500; }
.pau-aviso a.btn-brut { margin-left: auto; background: var(--md-amber); }

/* --- EBAU Andalucía: tarjetas de ejercicio --- */
.ebau-ej {
  background: var(--md-surface);
  border: var(--md-border, 3px solid #000);
  border-left-width: 10px;
  box-shadow: 4px 4px 0 var(--md-edge);
  padding: 0.7rem 1rem 0.4rem;
  margin: 1.1rem 0;
  overflow-x: auto;
}
.ebau-ej > p:first-child {
  font-size: 0.85rem;
  padding-bottom: 0.4rem;
  margin-bottom: 0.6rem;
  border-bottom: 2px dashed var(--md-edge);
}
.ebau-ej table { margin: 0.5rem 0; }

/* Callouts (Solución, Advertencia, Nota…): borde negro duro y sombra, sin esquinas redondeadas */
div.callout {
  border: var(--md-border) !important;
  border-radius: 0 !important;
  box-shadow: var(--md-shadow-sm);
  background-color: var(--md-surface);
  margin: 1.4rem 0;
}
div.callout .callout-header,
div.callout .callout-title-container {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 800;
  color: var(--md-black);
}
div.callout.callout-style-default > .callout-header { border-bottom: var(--md-border); }
div.callout.callout-style-default .callout-body-container { background-color: var(--md-surface); }
div.callout.callout-tip.callout-style-default > .callout-header { background-color: var(--md-teal); }
div.callout.callout-note.callout-style-default > .callout-header { background-color: var(--md-lime); }
div.callout.callout-warning.callout-style-default > .callout-header { background-color: var(--md-amber); }
div.callout.callout-important.callout-style-default > .callout-header { background-color: var(--md-amber); }
div.callout.callout-style-simple { border-left-width: 10px !important; }
div.callout.callout-tip { border-left-color: var(--md-teal) !important; }
div.callout.callout-note { border-left-color: var(--md-lime) !important; }
div.callout.callout-warning,
div.callout.callout-important { border-left-color: var(--md-amber) !important; }

/* Los iconos de la barra son imágenes oscuras: se invierten para verse sobre el fondo navy */
.navbar .quarto-color-scheme-toggle .bi::before { filter: invert(1); }
.navbar .aa-DetachedSearchButton svg,
.navbar .aa-DetachedSearchButtonIcon svg { color: var(--md-paper-fixed) !important; fill: var(--md-paper-fixed) !important; }

/* Texto sobre fondos de color (amarillo, menta, coral): siempre negro, también el código y los enlaces */
.gym-tip code, .mdx-banner code, .mdx-nota code, .pau-aviso code, .ticket-stub code, .door code,
.gym-tip a, .mdx-banner a, .mdx-nota a, .pau-aviso a:not(.btn-brut), .gym-help-btn code,
div.callout.callout-style-default > .callout-header code,
div.callout.callout-style-default > .callout-header a {
  color: #000 !important;
}

/* Pies de figura y notas al margen: el coral de la marca no se lee sobre el fondo claro */
.panel-caption, .figure-caption, .subfigure-caption, .table-caption, figcaption,
.column-margin figcaption, .margin-caption, div.aside, aside, .column-margin {
  color: #3d4256;
}
body.quarto-dark .panel-caption, body.quarto-dark .figure-caption, body.quarto-dark .subfigure-caption,
body.quarto-dark .table-caption, body.quarto-dark figcaption, body.quarto-dark .margin-caption,
body.quarto-dark div.aside, body.quarto-dark aside, body.quarto-dark .column-margin {
  color: var(--md-muted);
}
.barrow-lab figcaption { color: var(--md-text); }

/* Fórmulas destacadas más anchas que la pantalla: se desplazan en su propia caja en vez de ensanchar toda la página (móvil) */
mjx-container[display="true"] { overflow-x: auto; overflow-y: hidden; max-width: 100%; }
/* Tablas más anchas que la pantalla (p. ej. la tabla de la normal): se desplazan dentro de su caja */
@media (max-width: 767.98px) {
  main table { display: block; max-width: 100%; overflow-x: auto; }
}

/* Pasos numerados de las soluciones: el número empieza al principio de la fila */
div.callout .callout-body-container > ol,
div.callout .callout-body-container > details ol {
  list-style-position: inside;
  padding-left: 0;
  margin-left: 0;
}
div.callout .callout-body-container ol > li > ul,
div.callout .callout-body-container ol > li > ol {
  padding-left: 1.4rem;
}
div.callout .callout-body-container ol > li > p:first-child { display: inline; }
