@import url("https://use.typekit.net/pgn0jqr.css");
@import url("default.css");

/* =============================================================================
   LAS CUENCAS CUENTAN v6
   Basado en el tema Default de Tiki (Bootstrap 5.3)
   Estructura por capas: oscuro (header/footer) → medio (fondo) → claro (superficie)
   Las variables de color son sobreescritas por cada option.
   ============================================================================= */


/* -----------------------------------------------------------------------------
   1. VARIABLES GLOBALES
   ----------------------------------------------------------------------------- */

:root {
  /* Espaciado */
  --tiki-page-content-top-margin: 10px;
  /* Offset para anchors del AutoTOC. Compensa el header superior cuando la navegación usa fixed-top.
     Estado original del archivo (según backup.zip): no existía esta variable ni había compensación para anchors.
     Valor activo: 110px. */
  --lcc-anchor-offset: 110px;
  /* Estado original: sin --lcc-anchor-offset */

  /* Escala de capas */
  --lcc-z-underlay: 0;
  --lcc-z-content: 1;
  --lcc-z-float: 5;
  --lcc-z-pagetop: 30;
  --lcc-z-pagetop-dropdown: 31;
  --lcc-z-header: 40;
  --lcc-z-overlay: 50;
  --lcc-radius: 0.5rem;
  --lcc-radius-sm: 0.25rem;
  --lcc-pill-radius: 2rem;

  /* Colores de superficie y contraste */
  --lcc-surface: #ffffff;
  --lcc-on-dark: #ffffff;
  --lcc-subtle-hover-bg: #f4f1ea;

  /* Paleta base (opción azul por defecto, sobreescrita por cada option) */
  --lcc-ink: #316492;
  --lcc-link: #3885ba;
  --lcc-link-hover: #6db5dd;
  --lcc-bg: #dbe6ef;
  --lcc-top-accent: #bfe1f7;
  --lcc-top-accent-bg: #21496b;
  --lcc-border: #c9d8e5;
  --lcc-soft-bg: #f5f7f9;
  --lcc-pagetop-bg: #bfe1f7;
  --lcc-pagetop-border: #6db5dd;

  /* Bootstrap: curvaturas */
  --bs-border-radius: var(--lcc-radius);
  --bs-border-radius-sm: var(--lcc-radius-sm);
  --bs-border-radius-lg: var(--lcc-radius);

  /* Bootstrap: tipografía */
  --bs-body-font-size: 1rem;
  --bs-font-sans-serif: adelle-sans, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif,
    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --bs-body-font-family: var(--bs-font-sans-serif);

  /* Bootstrap: colores (sincronizados con la paleta LCC) */
  --bs-body-color: var(--lcc-ink);
  --bs-heading-color: var(--lcc-ink);
  --bs-emphasis-color: var(--lcc-ink);
  --bs-link-color: var(--lcc-link);
  --bs-link-hover-color: var(--lcc-link-hover);
  --bs-body-bg: var(--lcc-surface);
}


/* -----------------------------------------------------------------------------
   2. BODY Y TIPOGRAFÍA BASE
   ----------------------------------------------------------------------------- */

body.tiki {
  font-family: var(--bs-font-sans-serif);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  background-color: var(--lcc-bg) !important;
  background-image: none !important;
  color: var(--lcc-ink) !important;
}

/* Corrección de herencias de color de Bootstrap */
body *, p, ul, ol, li, blockquote, div { color: var(--lcc-ink); }
ul li::marker, ol li::marker { color: var(--lcc-ink) !important; }
.tiki .card-header *, .tiki .btn * { color: inherit !important; }

/* Tipografía: cuerpo */
body,
.tiki .mw-parser-output,
.tiki .toastui-editor-contents {
  font-family: var(--bs-font-sans-serif) !important;
  line-height: 1.5;
}

/* Tipografía: títulos principales — serif */
body.tiki h1, body.tiki h2, body.tiki h3,
.page-header h1, .page-header h2 {
  font-family: "Linux Libertine", "Times New Roman", serif !important;
  letter-spacing: -0.01em;
  font-weight: 700;
  color: var(--lcc-ink) !important;
}

/* Tipografía: títulos secundarios — sans-serif */
body.tiki h4, body.tiki h5, body.tiki h6,
.tiki .card-header h1, .tiki .card-header h2, .tiki .card-header h3,
.tiki .card-header h4, .tiki .card-header h5, .tiki .card-header h6,
.tiki .card-title, .tiki .module-title {
  padding: 0 !important;
  font-size: 1.25rem !important;
  color: var(--lcc-ink) !important;
  font-family: "Helvetica Neue", Arial, sans-serif !important;
  font-weight: 700;
  margin-bottom: 0.5rem;
}

/* Tipografía: editor WYSIWYG */
.tiki .mw-parser-output h1, .tiki .mw-parser-output h2,
.tiki .mw-parser-output h3, .tiki .mw-parser-output h4,
.tiki .mw-parser-output h5, .tiki .mw-parser-output h6 {
  font-family: var(--bs-font-sans-serif) !important;
  line-height: 1.2;
}

.tiki .toastui-editor-contents h1, .tiki .toastui-editor-contents h2,
.tiki .toastui-editor-contents h3, .tiki .toastui-editor-contents h4,
.tiki .toastui-editor-contents h5, .tiki .toastui-editor-contents h6,
.tiki .toastui-editor-contents .h1, .tiki .toastui-editor-contents .h2,
.tiki .toastui-editor-contents .h3, .tiki .toastui-editor-contents .h4,
.tiki .toastui-editor-contents .h5, .tiki .toastui-editor-contents .h6 {
  font-family: var(--bs-font-sans-serif) !important;
  font-weight: 400;
  color: var(--bs-body-color);
  line-height: 1.2;
}



/* -----------------------------------------------------------------------------
   3. CAPA OSCURA: HEADER Y FOOTER
   ----------------------------------------------------------------------------- */

/* Fondo oscuro en header y footer: usa --lcc-ink como color base.
   Cada option sobreescribe --lcc-ink en :root para cambiar este fondo. */
footer#footer, #cfooter {
  box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.15);
  border-radius: 0 !important;
  background-color: var(--lcc-ink) !important;
}

/* Header principal unificado (fondo semi-transparente que respeta el color dinámico) */
header.tiki-top-nav-light,
header.tiki-top-nav-dark {
  box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.15);
  border-radius: 0 !important;
  background-color: color-mix(in srgb, var(--lcc-ink) 90%, transparent) !important;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

/* Hacer el nav interior completamente transparente para no duplicar fondos */
nav.tiki-top-nav-light,
nav.tiki-top-nav-dark,
.top_modules {
  background: transparent !important;
  backdrop-filter: none;
  box-shadow: none !important;
}

/* Footer: padding y sin borde superior */
footer#footer, #cfooter {
  border-top: none !important;
  padding: 2rem 0;
}


/* Imagen decorativa del río también en el footer.
   Se reutiliza el mismo SVG del header, espejado en ambos sentidos
   para que se sienta parte de la misma familia visual sin verse idéntico. */
footer#footer,
#cfooter {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

footer#footer::before,
#cfooter::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("../images/rio.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  opacity: 0.38;
  transform: scale(-1, -1);
  transform-origin: center center;
  pointer-events: none;
  z-index: var(--lcc-z-underlay);
}

footer#footer > *,
#cfooter > * {
  position: relative;
  z-index: var(--lcc-z-content);
}

/* Texto claro sobre fondo oscuro (header, footer) */
.top_modules *, footer#footer *, #cfooter * {
  color: var(--lcc-on-dark) !important;
}

/* Variables Tiki de navbar: sincronizadas con la paleta LCC.
   Estas variables las usa el SCSS base de Tiki para colorear las navbars.
   Al usar var(--lcc-*), cambian automáticamente con cada option. */
.tiki-top-nav-light, .tiki-topbar-nav-light {
  --tiki-top-bg: var(--lcc-ink);
  --tiki-top-color: var(--lcc-on-dark);
  --tiki-top-hover-color: var(--lcc-top-accent);
  --tiki-top-active-color: var(--lcc-on-dark);
  --tiki-top-hover-bg: var(--lcc-top-accent-bg);
  --tiki-top-active-bg: var(--lcc-top-accent-bg);
  --tiki-topbar-bg: var(--lcc-ink);
  --tiki-topbar-color: var(--lcc-on-dark);
  --tiki-topbar-hover-color: var(--lcc-top-accent);
  --tiki-topbar-active-color: var(--lcc-on-dark);
  --tiki-topbar-hover-bg: var(--lcc-top-accent-bg);
  --tiki-topbar-active-bg: var(--lcc-top-accent-bg);
}

/* Links y textos del header: blanco sobre fondo oscuro */
.top_modules .navbar-nav .nav-link, .top_modules .navlink,
.top_modules .navbar-brand, .top_modules .navbar-text,
.sitetitle, .sitetagline, .sitesubtitle,
body.tiki h1.sitetitle, body.tiki h2.sitetitle, body.tiki h1.sitesubtitle,
body.tiki h2.sitetagline, body.tiki h3.sitetagline, body.tiki h2.sitesubtitle {
  color: var(--lcc-on-dark) !important;
}

.tiki-top-nav-light span, .tiki-top-nav-light p,
.tiki-topbar-nav-light span, .tiki-topbar-nav-light p {
  color: var(--lcc-on-dark) !important;
}

.tiki-top-nav-light a, .tiki-topbar-nav-light a {
  color: var(--lcc-on-dark) !important;
}

/* Hover de links en header: usa el color acento claro de la paleta */
.tiki-top-nav-light a:hover, .tiki-topbar-nav-light a:hover,
.top_modules .navbar-nav .nav-link:hover, .top_modules .navlink:hover,
.top_modules .navbar-brand:hover {
  color: var(--lcc-top-accent) !important;
}

/* Inputs y dropdowns dentro del header: texto oscuro sobre fondo claro */
.tiki-topbar-nav-light input:not([type="checkbox"]):not([type="radio"]), 
.tiki-top-nav-light input:not([type="checkbox"]):not([type="radio"]), 
.top_modules input:not([type="checkbox"]):not([type="radio"]), 
header input:not([type="checkbox"]):not([type="radio"]),
.top_modules .module input:not([type="checkbox"]):not([type="radio"]), 
header .module input:not([type="checkbox"]):not([type="radio"]), 
.top_modules .card input:not([type="checkbox"]):not([type="radio"]), 
header .card input:not([type="checkbox"]):not([type="radio"]) {
  color: var(--lcc-ink) !important;
  background-color: var(--lcc-surface) !important;
}

/* Imagen decorativa del río como sobreimpresión en el header general */
header.tiki-top-nav-light,
header.tiki-top-nav-dark {
  position: relative;
  isolation: isolate;
  overflow: visible;
}

header.tiki-top-nav-light::before,
header.tiki-top-nav-dark::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("../images/rio.svg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  opacity: 0.38;
  pointer-events: none;
  z-index: var(--lcc-z-underlay);
}

header.tiki-top-nav-light > *,
header.tiki-top-nav-dark > * {
  position: relative;
  z-index: var(--lcc-z-content);
}

/* Z-index del header sobre el contenido */
#header_outer,
#page-header,
#top_modules.top_modules {
  position: relative;
  z-index: var(--lcc-z-header);
}

#middle_outer {
  position: relative;
  z-index: var(--lcc-z-content);
}

/* Transparencia de tarjetas y módulos dentro del header */
.top_modules .card, .top_modules .module,
.top_modules .card-body, .top_modules .card-header,
.top_modules .bg-light, .top_modules .bg-white,
header .card, header .module, header .bg-light, header .bg-white,
.tiki-top-nav-light .card, .tiki-top-nav-light .module,
.tiki-top-nav-light .bg-light, .tiki-top-nav-light .bg-white,
.tiki-topbar-nav-light .card, .tiki-topbar-nav-light .module,
.tiki-topbar-nav-light .bg-light, .tiki-topbar-nav-light .bg-white {
  background-color: transparent !important;
  color: var(--lcc-on-dark) !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

.top_modules .card *, .top_modules .module *,
header .card *, header .module * {
  color: inherit !important;
}

/* Fondo transparente de navbars dentro del header */
header.navbar, .tiki-top-nav-light, .tiki-topbar-nav-light {
  border-bottom: none !important;
}

.top_modules header.navbar,
.top_modules .tiki-top-nav-light,
.top_modules .tiki-topbar-nav-light,
.top_modules .navbar,
.top_modules .nav {
  background-color: transparent !important;
}

.tiki-topbar-nav-light, .tiki-topbar-nav-dark {
  margin-top: 0 !important;
}

/* Topbar (barra entre header y contenido) con color acento claro */
.topbar-wrapper.tiki-topbar-nav-light,
.topbar.tiki-topbar-nav-light {
  background-color: var(--lcc-top-accent) !important;
  color: var(--lcc-ink) !important;
}

.topbar-wrapper.tiki-topbar-nav-light .nav-link,
.topbar.tiki-topbar-nav-light .nav-link,
.topbar-wrapper.tiki-topbar-nav-light .btn-link,
.topbar.tiki-topbar-nav-light .btn-link {
  color: var(--lcc-ink) !important;
}

.topbar-wrapper.tiki-topbar-nav-light .nav-link:hover,
.topbar.tiki-topbar-nav-light .nav-link:hover,
.topbar-wrapper.tiki-topbar-nav-light .btn-link:hover,
.topbar.tiki-topbar-nav-light .btn-link:hover {
  color: var(--lcc-link) !important;
}

/* Espacio entre navbar fija y contenido (layout classic bootstrap) */
body.navbar-padding {
  padding-top: calc(90px + 10px) !important;
}

/* Espacio superior al contenedor de contenido */
body.tiki .middle_outer {
  margin-top: 10px !important;
}


/* -----------------------------------------------------------------------------
   4. CAPA MEDIA: FONDO Y CONTENIDO PRINCIPAL
   ----------------------------------------------------------------------------- */

/* Columnas transparentes */
#col1, #col2, #col3,
#middle-column,
.tiki-center {
  background-color: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  margin-bottom: var(--tiki-page-content-top-margin) !important;
}

.middle {
  background-color: transparent !important;
}

/* Módulos transparentes */
.tiki .module {
  background-color: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}


/* -----------------------------------------------------------------------------
   5. CAPA CLARA: SUPERFICIES DE LECTURA
   ----------------------------------------------------------------------------- */

/* Tarjetas */
.tiki .card {
  background-color: var(--lcc-surface) !important;
  border-radius: var(--lcc-radius) !important;
  border: 1px solid var(--lcc-border);
  box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.05);
}

/* Tarjetas flotantes (float inline): elevar z-index para que los bloques
   vecinos (que ocupan 100% del ancho) no capturen sus clicks. */
.wikitext .card[style*="float"],
.page-content .card[style*="float"],
#page-data .card[style*="float"] {
  position: relative;
  z-index: var(--lcc-z-float);
}

.tiki .card-body {
  background-color: var(--lcc-surface) !important;
  border-bottom-left-radius: calc(var(--lcc-radius) - 1px) !important;
  border-bottom-right-radius: calc(var(--lcc-radius) - 1px) !important;
}

.tiki .card-footer {
  background-color: var(--lcc-soft-bg) !important;
  border-bottom-left-radius: calc(var(--lcc-radius) - 1px) !important;
  border-bottom-right-radius: calc(var(--lcc-radius) - 1px) !important;
}

.tiki .card-header {
  background-color: var(--lcc-surface) !important;
  border-bottom: 2px solid var(--lcc-bg) !important;
  border-radius: calc(var(--lcc-radius) - 1px) calc(var(--lcc-radius) - 1px) 0 0 !important;
  padding: 0.75rem 1rem !important;
}

/* Superficies de lectura: fondo blanco, borde redondeado, sombra sutil.
   Se aplica a todo contenedor de contenido wiki/artículo/blog. */
.wikitext,
.page-content, .article, .blog-post, .mw-parser-output {
  background-color: var(--lcc-surface) !important;
  border-radius: var(--lcc-radius) !important;
  border: 1px solid var(--lcc-border);
  box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.05);
  padding: 2rem;
}

/* Color de texto oscuro en superficies claras */
#col1 .card *, #col2 .card *, #col3 .card *, .middle .card *,
#col1 .module *, #col2 .module *, #col3 .module *, .middle .module *,
.wikitext *, .page-content *, .article *, .blog-post * {
  color: var(--lcc-ink) !important;
}

/* Excepción: botones preservan sus colores propios */
#col1 .card .btn, #col1 .card .btn *, #col2 .card .btn, #col2 .card .btn *,
#col3 .card .btn, #col3 .card .btn *, .middle .card .btn, .middle .card .btn *,
.wikitext .btn, .wikitext .btn *, .page-content .btn, .page-content .btn * {
  color: inherit !important;
}

/* Excepción: clases text-white/text-light sobre superficies claras */
.tiki .card.text-white, .tiki .card .text-white,
.tiki .card.text-light, .tiki .card .text-light,
.tiki .module.text-white, .tiki .module .text-white,
.wikitext.text-white, .wikitext .text-white,
.wikitext.text-light, .wikitext .text-light {
  color: var(--lcc-ink) !important;
}


/* -----------------------------------------------------------------------------
   6. MENÚ PAGETOP (barra de navegación interna)
   ----------------------------------------------------------------------------- */

#mod-menupagetop1, .mod-menupagetop1, [id^="mod-menupagetop"],
[id^="mod-menupagetop"] .card,
[id^="mod-menupagetop"] .bg-light,
[id^="mod-menupagetop"] .navbar,
[id^="mod-menupagetop"] .tiki-nav-light,
[id^="mod-menupagetop"] > div {
  background-color: var(--lcc-pagetop-bg) !important;
  border-radius: var(--lcc-radius) !important;
  border-color: var(--lcc-pagetop-border) !important;
}

[id^="mod-menupagetop"] .tiki-nav-light,
[id^="mod-menupagetop"] > div {
  border-radius: var(--lcc-radius) !important;
}

#mod-menupagetop1,
#mod-menupagetop1 .navbar,
#mod-menupagetop1 .navbar-nav,
#mod-menupagetop1 .nav-link,
#mod-menupagetop1 .nav-link *,
#mod-menupagetop1 .navbar-brand,
#mod-menupagetop1 .dropdown-item,
#mod-menupagetop1 .dropdown-item * {
  color: var(--lcc-ink) !important;
}

#mod-menupagetop1 .nav-link:hover,
#mod-menupagetop1 .nav-link:focus,
#mod-menupagetop1 .dropdown-item:hover,
#mod-menupagetop1 .dropdown-item:focus {
  color: var(--lcc-link) !important;
}

#mod-menupagetop1,
#mod-menupagetop1 .navbar,
#mod-menupagetop1 .navbar-collapse,
#mod-menupagetop1 .navbar-nav,
#mod-menupagetop1 .dropdown {
  position: relative;
  overflow: visible !important;
}

#mod-menupagetop1 { z-index: var(--lcc-z-pagetop); }
#mod-menupagetop1 .dropdown-menu { z-index: var(--lcc-z-pagetop-dropdown); }


/* -----------------------------------------------------------------------------
   7. DROPDOWNS Y MENÚS
   ----------------------------------------------------------------------------- */

/* Dropdown base */
.dropdown-menu {
  --bs-dropdown-bg: var(--lcc-surface);
  --bs-dropdown-link-color: var(--lcc-ink);
  --bs-dropdown-link-hover-bg: var(--lcc-soft-bg);
  --bs-dropdown-link-hover-color: var(--lcc-ink);
  border-radius: var(--lcc-radius);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
  border: 1px solid var(--lcc-border);
}

.dropdown-item,
.dropdown-menu .dropdown-item,
.dropdown-menu .dropdown-item *,
.top_modules .dropdown-menu .dropdown-item,
.top_modules .dropdown-menu .dropdown-item * {
  color: var(--lcc-ink) !important;
}

/* Dropdowns oscuros de Bootstrap en el panel de administración:
   se renderizan sobre fondo claro, hay que revertirlos al esquema claro. */
.tiki .dropdown-menu.dropdown-menu-dark,
.tiki ul.dropdown-menu.tiki-admin-top-nav-dark {
  --bs-dropdown-bg: var(--lcc-surface);
  --bs-dropdown-color: var(--lcc-ink);
  --bs-dropdown-link-color: var(--lcc-ink);
  --bs-dropdown-link-hover-color: var(--lcc-link);
  --bs-dropdown-link-hover-bg: var(--lcc-soft-bg);
  --bs-dropdown-border-color: var(--lcc-border);
  --lcc-on-dark: var(--lcc-ink);
  background-color: var(--lcc-surface) !important;
  color: var(--lcc-ink) !important;
}

.tiki .dropdown-menu.dropdown-menu-dark .dropdown-item,
.tiki ul.dropdown-menu.tiki-admin-top-nav-dark .dropdown-item {
  color: var(--lcc-ink) !important;
}

.tiki .dropdown-menu.dropdown-menu-dark .dropdown-item:hover,
.tiki .dropdown-menu.dropdown-menu-dark .dropdown-item:focus,
.tiki ul.dropdown-menu.tiki-admin-top-nav-dark .dropdown-item:hover,
.tiki ul.dropdown-menu.tiki-admin-top-nav-dark .dropdown-item:focus {
  background-color: var(--lcc-soft-bg) !important;
  color: var(--lcc-link) !important;
}

/* Popup de login: texto oscuro sobre fondo blanco */
.siteloginbar_poppedup.dropdown-menu,
.siteloginbar_poppedup.dropdown-menu *,
.siteloginbar_popup .dropdown-menu,
.siteloginbar_popup .dropdown-menu * {
  color: var(--lcc-ink) !important;
}

/* Z-index del popup de login */
.siteloginbar_popup,
.siteloginbar_popup .dropdown-menu,
.siteloginbar_poppedup.dropdown-menu {
  z-index: var(--lcc-z-overlay) !important;
}


/* -----------------------------------------------------------------------------
   8. PANEL DE ADMINISTRACIÓN
   ----------------------------------------------------------------------------- */

/* Barra de anclas de administración: fondo claro propio, texto oscuro */
.adminanchors {
  margin-top: 10px !important;
  --lcc-on-dark: var(--lcc-ink);
}

.adminanchors a.nav-link:hover {
  color: var(--lcc-link) !important;
}

/* Dropdowns de admin dentro de la barra oscura: mantener texto claro */
#admin-navbar-collapse-1 .dropdown-menu.dropdown-menu-dark,
#admin-navbar-collapse-1 .dropdown-menu.tiki-admin-top-nav-dark,
#admin-navbar-collapse-1 .dropdown-menu.dropdown-menu-dark *,
#admin-navbar-collapse-1 .dropdown-menu.tiki-admin-top-nav-dark * {
  color: var(--lcc-on-dark) !important;
}

#admin-navbar-collapse-1 .dropdown-menu.dropdown-menu-dark .dropdown-item,
#admin-navbar-collapse-1 .dropdown-menu.tiki-admin-top-nav-dark .dropdown-item,
#admin-navbar-collapse-1 .dropdown-menu.dropdown-menu-dark .dropdown-header,
#admin-navbar-collapse-1 .dropdown-menu.tiki-admin-top-nav-dark .dropdown-header,
#admin-navbar-collapse-1 .dropdown-menu.dropdown-menu-dark .form-check-label,
#admin-navbar-collapse-1 .dropdown-menu.tiki-admin-top-nav-dark .form-check-label {
  color: var(--lcc-on-dark) !important;
}

#admin-navbar-collapse-1 .dropdown-menu.dropdown-menu-dark .dropdown-item:hover,
#admin-navbar-collapse-1 .dropdown-menu.dropdown-menu-dark .dropdown-item:focus,
#admin-navbar-collapse-1 .dropdown-menu.tiki-admin-top-nav-dark .dropdown-item:hover,
#admin-navbar-collapse-1 .dropdown-menu.tiki-admin-top-nav-dark .dropdown-item:focus {
  color: var(--lcc-top-accent) !important;
}

/* Panel de control admin: centrar botones del grid */
.tiki-admin .d-flex.align-content-start.flex-wrap,
.admin-content .d-flex.align-content-start.flex-wrap {
  justify-content: center !important;
}


/* -----------------------------------------------------------------------------
   9. BOTONES
   ----------------------------------------------------------------------------- */

.tiki .btn-primary {
  --bs-btn-bg: var(--lcc-link);
  --bs-btn-border-color: var(--lcc-link-hover);
  --bs-btn-hover-bg: var(--lcc-link);
  --bs-btn-hover-border-color: var(--lcc-link);
  border-radius: var(--lcc-pill-radius) !important;
  padding: 0.5rem 1rem;
}

.tiki .btn-secondary {
  --bs-btn-bg: var(--lcc-surface);
  --bs-btn-border-color: var(--lcc-border);
  --bs-btn-color: var(--lcc-ink);
  --bs-btn-hover-bg: var(--lcc-subtle-hover-bg);
  border-radius: var(--lcc-pill-radius) !important;
  padding: 0.5rem 1rem;
}

/* Botones deshabilitados */
.tiki .btn.disabled,
.tiki .btn:disabled,
.tiki .btn.disabled-clickable,
.tiki .btn-primary.disabled,
.tiki .btn-primary.disabled-clickable {
  background-color: var(--lcc-top-accent) !important;
  border-color: var(--lcc-top-accent) !important;
  color: var(--lcc-ink) !important;
  opacity: 0.8 !important;
}


/* -----------------------------------------------------------------------------
   10. FORMULARIOS Y CONTROLES
   ----------------------------------------------------------------------------- */

textarea.form-control,
.form-control,
.search-box input {
  border-radius: var(--lcc-radius) !important;
}


/* -----------------------------------------------------------------------------
   11. POPOVERS
   ----------------------------------------------------------------------------- */

.popover {
  border-radius: var(--lcc-radius) !important;
  z-index: var(--lcc-z-overlay) !important;
}

.popover, .popover-body, .popover-header {
  color: var(--lcc-ink) !important;
}

.popover-header {
  background-color: var(--lcc-soft-bg) !important;
  border-bottom: 1px solid var(--lcc-border) !important;
}

.popover-body {
  background-color: var(--lcc-surface) !important;
}


/* -----------------------------------------------------------------------------
   12. HIPERVÍNCULOS EN EL CUERPO DEL CONTENIDO
   Usan el color de la paleta activa con subrayado para distinguirlos.
   Los visitados usan --lcc-link-hover (tono claro).
   Se excluyen botones, nav-links y dropdowns con :not().
   Se usa :is() para agrupar contextos y evitar repetición.
   ----------------------------------------------------------------------------- */

:is(#col1, #col2, #col3, .middle, .wikitext, .page-content, .article, .blog-post)
  a:not(.btn):not(.nav-link):not(.dropdown-item):not(.navbar-brand) {
  color: var(--lcc-ink) !important;
  text-decoration: underline;
}

:is(#col1, #col2, #col3, .middle, .wikitext, .page-content, .article, .blog-post)
  a:visited:not(.btn):not(.nav-link):not(.dropdown-item):not(.navbar-brand) {
  color: var(--lcc-link-hover) !important;
}

:is(#col1, #col2, #col3, .middle, .wikitext, .page-content, .article, .blog-post)
  a:hover:not(.btn):not(.nav-link):not(.dropdown-item):not(.navbar-brand) {
  color: var(--lcc-link) !important;
  text-decoration: underline;
}


/* -----------------------------------------------------------------------------
   13. ALINEACIÓN DEL BUSCADOR EN EL HEADER
   El div.mb-3 que envuelve el input de búsqueda tiene display:block por defecto
   en Bootstrap, lo que fuerza un salto de línea y desalinea el buscador respecto
   al login. Se corrige solo en el contexto del header para no afectar formularios
   del resto del sitio.
   ----------------------------------------------------------------------------- */

.top_modules .box-search .mb-3,
header .box-search .mb-3 {
  display: inline-flex !important;
  align-items: center;
  margin-bottom: 0 !important;
}


/* -----------------------------------------------------------------------------
   14. MODALES
   Para que funcione la ayuda del editor. Investigar luego cómo hacerlo funcionar mejor.
   ----------------------------------------------------------------------------- */

.modal-backdrop {
  position: static !important; /* position: fixed anulado */
  top: auto !important;        /* top: 0 anulado */
  left: auto !important;       /* left: 0 anulado */
}


/* -----------------------------------------------------------------------------
   15. IMGBOX: AJUSTE DE CONTENEDOR DE IMÁGENES
   Tiki genera .imgbox con width/height inline en píxeles reales de la imagen.
   Cuando la imagen tiene img-fluid, se escala pero el contenedor no.
   Se fuerza height:auto y max-width:100% para que el recuadro se ajuste.
   ----------------------------------------------------------------------------- */

.imgbox {
  height: auto !important;
  max-width: 100% !important;
}

.imgbox img.img-fluid {
  width: 100%;
  height: auto;
}


/* -----------------------------------------------------------------------------
   16. CATBLOCK: LISTA HORIZONTAL DE PÁGINAS
   La lista de páginas del catblock se muestra en línea (horizontal con wrap)
   en vez de vertical. Se agrega separador sutil entre ítems.
   ----------------------------------------------------------------------------- */

/* Título de categoría */
.catblock .cattitle {
  font-weight: 700;
  margin-bottom: 0.5rem;
}

/* Contenedor catblock: misma superficie que .wikitext */
.catblock {
  background-color: var(--lcc-surface) !important;
  border-radius: var(--lcc-radius) !important;
  border: 1px solid var(--lcc-border);
  box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.05);
  padding: 2rem;
  margin-top: 1rem;
}

/* Etiqueta "wiki page:" / "file gallery:" en línea con los ítems */
.catblock .catfeatures > li {
  margin-bottom: 0.75rem;
}

/* Lista interna: layout horizontal con wrap */
.catblock ul.list-inline {
  display: inline-flex !important;
  flex-wrap: wrap;
  gap: 0.35rem 0.5rem;
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
}

/* Cada ítem en línea */
.catblock ul.list-inline > li {
  display: inline-block;
}

/* Sin separador entre ítems */

/* Links dentro del catblock */
.catblock ul.list-inline > li a.link {
  text-decoration: underline !important;
  font-weight: 400 !important;
  color: var(--lcc-link) !important;
  padding: 0.15rem 0.4rem;
  border-radius: var(--lcc-radius-sm);
  transition: background-color 0.15s ease, color 0.15s ease;
}

.catblock ul.list-inline > li a.link:hover {
  background-color: var(--lcc-soft-bg);
  color: var(--lcc-ink) !important;
  text-decoration: underline !important;
}




/* Ajuste del punto de aterrizaje de anchors para índices generados con AutoTOC.
   Estado original del archivo (según backup.zip): este bloque no existía y no había compensación de anchors.
   Ajuste actual que sí funcionó: desplazar físicamente el ancla con padding-top
   + margin-top negativo sobre los títulos que tienen id.
   Si en algún momento la navbar deja de usar fixed-top, revisar o desactivar este bloque.

   Estado original para volver atrás:
   Sin --lcc-anchor-offset.
   Sin bloque de compensación para títulos con id.
*/
body.tiki h1[id],
body.tiki h2[id],
body.tiki h3[id],
body.tiki h4[id],
body.tiki h5[id],
body.tiki h6[id],
body.tiki .showhide_heading[id] {
  padding-top: var(--lcc-anchor-offset) !important;
  margin-top: calc(var(--lcc-anchor-offset) * -1) !important;
}