/* =========================================================================
   Tema Datos Abiertos - Diputacion de Salamanca
   Reconstruccion para CKAN 2.11 / Bootstrap 5
   ========================================================================= */

:root {
  --sal-azul: #1f6bb8;          /* azul corporativo (barra superior / acentos) */
  --sal-azul-oscuro: #17558f;
  --sal-footer-bg: #1e1f23;     /* gris oscuro del footer */
  --sal-footer-fg: #e6e6e6;
  --sal-overlay: rgba(31, 107, 184, 0.55);
}

/* Fondo blanco de pagina */
body { background: #fff !important; color: #222; }
.wrapper, [role="main"], .main { background: #fff !important; }

/* ------------------------------------------------------------------ */
/* Barra superior (account masthead): franja azul                     */
/* ------------------------------------------------------------------ */
.account-masthead {
  background-color: var(--sal-azul) !important;
}
.account-masthead .account ul li a,
.account-masthead .account ul li .text {
  color: #fff;
}

/* ------------------------------------------------------------------ */
/* Cabecera (masthead): fondo blanco, logo compuesto a tamaño completo */
/* ------------------------------------------------------------------ */
.masthead {
  background: #fff !important;
  color: #000;
  padding: 12px 0;
}
.masthead .navbar {
  background: #fff !important;
  padding: 0;
}
/* Logo compuesto (Diputacion + Interreg + UE): que se vea grande y completo */
.masthead .header-image .logo,
.masthead .logo {
  display: inline-block;
  margin: 0;
}
.masthead .logo { display: inline-block; }
.masthead .logo img {
  height: 80px !important;   /* alto fijo: fuerza el render del SVG (evita 0x0) */
  max-height: 80px !important; /* vence al max-height:60px del core CKAN */
  width: auto !important;
  max-width: 100%;
  vertical-align: middle;
}
/* Menu principal: enlaces oscuros sobre fondo blanco */
.masthead .navbar-nav .nav-item .nav-link,
.masthead .nav-link {
  color: #222 !important;
  font-weight: 600;
}
.masthead .navbar-nav .nav-item .nav-link:hover,
.masthead .navbar-nav .nav-item .nav-link:focus,
.masthead .nav-link:hover,
.masthead .nav-link:focus {
  /* Como el viejo: fondo azul #0077bb + texto blanco al pasar el raton */
  background-color: #0077bb !important;
  color: #fff !important;
  border-radius: 4px;
}
/* Transicion suave del hover del menu, como el viejo */
.masthead .navbar-nav .nav-item .nav-link,
.masthead .nav-link {
  transition: background-color .2s ease-in-out, color .2s ease-in-out;
}
/* Boton hamburguesa visible sobre fondo blanco */
.masthead .navbar-toggler {
  border-color: rgba(0, 0, 0, 0.25);
}
.masthead .navbar-toggler .fa {
  color: #222 !important;
}
/* Buscador de la cabecera */
.masthead .site-search .form-control {
  min-width: 220px;
}
.masthead .site-search .btn {
  color: #222;
}

/* ------------------------------------------------------------------ */
/* Home: bloques-foto (sin banda-imagen; el viejo va directo a estos)  */
/* ------------------------------------------------------------------ */
.salamanca-home { margin: 0; }

.salamanca-org-blocks .org-block {
  position: relative;
  display: block;
  height: 529px;
  background-size: cover;
  background-position: center;
  text-decoration: none;
  overflow: hidden;
}
/* Bloques-foto con efecto 'dexter' (como el portal viejo):
   titulo siempre visible; en hover baja el marco blanco y aparece el texto. */

/* Oscurecido de la imagen en hover (la imagen es el background-image del <a>) */
.salamanca-org-blocks .org-block::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.15);
  transition: background 0.35s ease;
  z-index: 0;
}
.salamanca-org-blocks .org-block:hover::before {
  background: rgba(0, 0, 0, 0.40);
}

/* Marco blanco: en reposo oculto arriba (mitad inferior), baja en hover */
.salamanca-org-blocks .org-block-frame {
  position: absolute;
  right: 30px; bottom: 30px; left: 30px;
  height: calc(50% - 30px);
  border: 7px solid #fff;
  pointer-events: none;
  z-index: 2;
  transform: translate3d(0, -100%, 0);
  transition: transform 0.35s ease;
}
.salamanca-org-blocks .org-block:hover .org-block-frame {
  transform: translate3d(0, 0, 0);
}

/* Caption: ocupa todo el bloque, texto a la izquierda, blanco */
.salamanca-org-blocks .org-block-caption {
  position: absolute;
  inset: 0;
  padding: 3rem;
  color: #fff;
  text-align: left;
  z-index: 1;
}

/* Titulo: siempre visible, arriba */
.salamanca-org-blocks .org-block-title {
  margin: 0;
  color: #fff;
  font-size: 1.9rem;
  font-weight: 600;
  letter-spacing: .01em;
  text-transform: uppercase;
  text-shadow: 0 1px 4px rgba(0,0,0,.5);
}

/* Descripcion: oculta en reposo, aparece deslizando en hover, abajo */
.salamanca-org-blocks .org-block-desc {
  position: absolute;
  right: 60px; bottom: 60px; left: 60px;
  margin: 0;
  color: #fff;
  font-size: 1.15rem;
  line-height: 1.4;
  opacity: 0;
  transform: translate3d(0, -30px, 0);
  transition: opacity 0.35s ease, transform 0.35s ease;
  text-shadow: 0 1px 4px rgba(0,0,0,.6);
}
.salamanca-org-blocks .org-block:hover .org-block-desc {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

@media (max-width: 767.98px) {
  .salamanca-org-blocks .org-block { height: 240px; }
  .salamanca-org-blocks .org-block-title { font-size: 1.4rem; }
}

/* ------------------------------------------------------------------ */
/* Footer: fondo oscuro, 2 columnas                                    */
/* ------------------------------------------------------------------ */
.site-footer {
  background-color: var(--sal-footer-bg) !important;
  background-image: none !important;
  color: var(--sal-footer-fg);
  padding: 2.5rem 0;
}
.site-footer .salamanca-footer .footer-heading {
  color: #fff;
  font-size: 1.15rem;
  font-weight: 700;
  margin-bottom: 1rem;
}
.site-footer .footer-stats li,
.site-footer .footer-links-list li {
  margin-bottom: .4rem;
  position: relative;
  padding-left: 1.1rem;
}
.site-footer .footer-stats li::before,
.site-footer .footer-links-list li::before {
  content: "\2022";
  position: absolute;
  left: 0;
  color: var(--sal-footer-fg);
}
.site-footer .footer-stats strong { color: #fff; }
.site-footer .footer-links-list a {
  color: var(--sal-footer-fg);
  text-decoration: none;
}
.site-footer .footer-links-list a:hover {
  color: #fff;
  text-decoration: underline;
}
/* Ocultamos la atribucion CKAN por defecto para respetar el layout del portal */
.site-footer .attribution { display: none; }

/* ================================================================== */
/* Pagina de ORGANIZACION: parrilla de categorias (como el viejo)     */
/* ================================================================== */
.seccionDestacada {
  /* full-bleed: el fondo ocupa todo el ancho de ventana aunque este dentro del container de CKAN */
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  overflow-x: clip;
  padding: 50px 0;
  background-color: #f5f5f5;
  background-image: url("/base/images/fondo-destacados-v2.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  background-attachment: fixed;
  box-shadow: rgba(0,0,0,.2) 0 0 20px 0 inset;
}
.enlaceDestacado {
  display: block;
  width: 100%;
  text-decoration: none;
  color: #000;
  padding: 25px 0;
  background-color: rgba(255,255,255,.8);
  border-radius: 4px;
  margin: 15px 0;
  transition: .3s ease-in-out;
  box-shadow: rgba(0,0,0,.2) 0 2px 10px 0;
}
.enlaceDestacado:hover { text-decoration: none; background-color: #fff; }
.enlaceDestacado > div { width: 100%; text-align: center; }
.enlaceDestacado .iconoDestacado span {
  height: 75px; width: 75px; display: inline-block;
  transition: .3s ease-in-out;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center bottom !important;
}
.enlaceDestacado:hover .iconoDestacado { color: #005d92; }
.enlaceDestacado .textoDestacado { font-size: 1rem; text-decoration: none; margin-top: 10px; }

/* iconos normales */
.enlaceDestacado .iconoDestacado span.publico   { background: url("/base/images/landmark-blue-v2.svg"); }
.enlaceDestacado .iconoDestacado span.fomento   { background: url("/base/images/road-blue-v2.svg"); }
.enlaceDestacado .iconoDestacado span.comecio   { background: url("/base/images/euro-blue-v2.svg"); }
.enlaceDestacado .iconoDestacado span.economia  { background: url("/base/images/piggy-bank-solid.svg"); }
.enlaceDestacado .iconoDestacado span.empleo    { background: url("/base/images/handshake-blue-v2.svg"); }
.enlaceDestacado .iconoDestacado span.cultura   { background: url("/base/images/landmark-blue-v2.svg"); }
.enlaceDestacado .iconoDestacado span.ambiente  { background: url("/base/images/pagelines-blue-v2.svg"); }
.enlaceDestacado .iconoDestacado span.bienestar { background: url("/base/images/like-blue-v2.svg"); }
.enlaceDestacado .iconoDestacado span.ganaderia { background: url("/base/images/tractor-blue-v2.svg"); }
.enlaceDestacado .iconoDestacado span.turismo   { background: url("/base/images/suitcase-blue.svg"); }
.enlaceDestacado .iconoDestacado span.iae        { background: url("/base/images/IAE-claro-v2.svg"); }
.enlaceDestacado .iconoDestacado span.vehiculos  { background: url("/base/images/coche-claro-v2.svg"); }
.enlaceDestacado .iconoDestacado span.contratos  { background: url("/base/images/contrato-claro-v2.svg"); }
.enlaceDestacado .iconoDestacado span.recibos    { background: url("/base/images/recibo-claro-v2.svg"); }
.enlaceDestacado .iconoDestacado span.inmuebles  { background: url("/base/images/inmueble-claro-v2.svg"); }
.enlaceDestacado .iconoDestacado span.consumo    { background: url("/base/images/consumo-claro-v2.svg"); }
.enlaceDestacado .iconoDestacado span.tarifas    { background: url("/base/images/tarifa-claro-v2.svg"); }
/* iconos hover */
.enlaceDestacado:hover .iconoDestacado span.publico   { background: url("/base/images/landmark-dark-v2.svg"); }
.enlaceDestacado:hover .iconoDestacado span.fomento   { background: url("/base/images/road-dark-v2.svg"); }
.enlaceDestacado:hover .iconoDestacado span.comecio   { background: url("/base/images/euro-dark-v2.svg"); }
.enlaceDestacado:hover .iconoDestacado span.economia  { background: url("/base/images/piggy-bank-solid.svg"); }
.enlaceDestacado:hover .iconoDestacado span.empleo    { background: url("/base/images/handshake-dark-v2.svg"); }
.enlaceDestacado:hover .iconoDestacado span.cultura   { background: url("/base/images/landmark-dark-v2.svg"); }
.enlaceDestacado:hover .iconoDestacado span.ambiente  { background: url("/base/images/pagelines-dark-v2.svg"); }
.enlaceDestacado:hover .iconoDestacado span.bienestar { background: url("/base/images/like-dark-v2.svg"); }
.enlaceDestacado:hover .iconoDestacado span.ganaderia { background: url("/base/images/tractor-dark-v2.svg"); }
.enlaceDestacado:hover .iconoDestacado span.iae        { background: url("/base/images/IAE-oscuro-v2.svg"); }
.enlaceDestacado:hover .iconoDestacado span.vehiculos  { background: url("/base/images/coche-oscuro-v2.svg"); }
.enlaceDestacado:hover .iconoDestacado span.contratos  { background: url("/base/images/contrato-oscuro-v2.svg"); }
.enlaceDestacado:hover .iconoDestacado span.recibos    { background: url("/base/images/recibo-oscuro-v2.svg"); }
.enlaceDestacado:hover .iconoDestacado span.inmuebles  { background: url("/base/images/inmueble-oscuro-v2.svg"); }
.enlaceDestacado:hover .iconoDestacado span.consumo    { background: url("/base/images/consumo-oscuro-v2.svg"); }
.enlaceDestacado:hover .iconoDestacado span.tarifas    { background: url("/base/images/tarifa-oscuro-v2.svg"); }

/* evita barra horizontal por el full-bleed 100vw */
html, body { overflow-x: hidden; }


/* ------------------------------------------------------------------ */
/* Pagina de organizacion: cabeceras de facet azules + tarjetas iguales */
/* ------------------------------------------------------------------ */

/* Cabeceras de los modulos de facet (Grupos, Etiquetas, Formatos...) en azul,
   como el portal viejo */
.module-heading {
  background-color: #0077bb !important;
  color: #fff !important;
  border-radius: 4px 4px 0 0 !important;
}
.module-heading i,
.module-heading .fa {
  color: #fff !important;
}

/* Todas las tarjetas de dataset con la misma altura (como el viejo) */
.dataset-list .dataset-item {
  min-height: 108px;   /* como el viejo: cabe titulo a 2 lineas */
  display: flex;
  flex-direction: column;
  justify-content: flex-start;  /* contenido alineado arriba, no centrado */
}

/* Barra lateral: cada modulo de facet con fondo gris claro, como el viejo
   (linea 164 de estilospersonalizados.css). Excluye la ficha context-info.
   Sin box-shadow ni bordes en los items del nav. */
.secondary .module.module-narrow:not(.context-info):not(:has(.context-info)),
aside .module.module-narrow:not(.context-info):not(:has(.context-info)) {
  background-color: #f5f5f5;
  margin-bottom: 20px;
  border-radius: 4px;
  box-shadow: none;
  border: none;
}
.secondary .module.module-narrow .nav-simple > .nav-item > a,
.secondary .module.module-narrow .nav-facet .nav-item > a {
  border-bottom: none;
  box-shadow: none;
}

/* Quitar el recuadro con sombra del contenedor principal (core .box/.wrapper)
   y la linea vertical divisoria (.wrapper:before border-right), como el viejo. */
.wrapper {
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.wrapper:before {
  display: none !important;
  border-right: none !important;
}

/* Icono de la categoria (pagina de grupo) a 150x150 como el viejo
   (CKAN 2.11 lo estira a ancho completo). Solo afecta a .salamanca-group-image. */
.salamanca-group-image {
  text-align: center;
}
.salamanca-group-image img {
  width: 150px !important;
  height: 150px !important;
  max-width: 150px !important;
  object-fit: contain;
}

/* ------------------------------------------------------------------ */
/* Barra de pestanas de pagina (.page-header): sin fondo gris, sin      */
/* borde ni border-radius (como el viejo, que no la resalta)           */
/* ------------------------------------------------------------------ */
.page-header {
  background-color: transparent !important;
  border-bottom: none !important;
  border-radius: 0 !important;
}

/* ------------------------------------------------------------------ */
/* Tabla de info adicional del dataset (.additional-info 'Campo/Valor'):*/
/* cabecera con fondo oscuro y texto blanco, como el viejo             */
/* ------------------------------------------------------------------ */
.additional-info thead th,
.additional-info thead td {
  background-color: var(--sal-footer-bg) !important;
  color: #fff !important;
}

/* ------------------------------------------------------------------ */
/* Listado de grupos (/group): tarjetas con fondo gris, radio y altura  */
/* uniforme, como el viejo (evita el layout masonry irregular de 2.11)  */
/* ------------------------------------------------------------------ */
/* El contenedor .media-grid: sin fondo gris ni borde, para que se vea el
   blanco de la pagina (el core le pone background #fbfbfb + border 1px #ddd) */
.media-grid,
.module-grid {
  background: transparent none !important;   /* quita el #fbfbfb + bg.png del core */
  border: none !important;
  box-shadow: none !important;
}

/* El <a class="media-view"> que cubre cada tarjeta lleva un border 1px #ddd
   del core; se quita para que las tarjetas no tengan recuadro */
.media-grid .media-item .media-view {
  border: none !important;
  border-radius: 0 !important;
}
.media-grid .media-item {
  background-color: #f5f5f5;
  border-radius: 3px;
  padding: 15px;
  min-height: 200px;
  box-shadow: none;
  text-align: center;
}
.media-grid .media-item .media-image,
.media-grid .media-item img.media-image {
  /* iconos de categoria a tamano cuadrado uniforme (los SVG tienen distinta
     proporcion; sin esto CKAN los escala a ancho fijo y descuadra la altura) */
  display: block;
  margin: 0 auto 10px;
  width: auto !important;
  max-width: 110px;
  height: 90px !important;
  object-fit: contain;
}

/* ------------------------------------------------------------------ */
/* Parrilla /group como CSS grid real: CKAN 2.11 posiciona las tarjetas  */
/* en ABSOLUTO via JS (masonry) segun su altura -> saltan de columna     */
/* (p.ej. 'Vehiculos' no caia en la 1a columna). Forzamos grid por orden.*/
/* ------------------------------------------------------------------ */
.media-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  position: static !important;
  /* Aire entre la ultima fila de tarjetas y el footer */
  margin-bottom: 2.5rem !important;
}
.media-grid .media-item {
  position: relative !important;   /* contenedor del <a> absoluto que la hace clicable */
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  height: auto !important;
  /* Neutraliza los offsets inline (left/top) que deja el masonry JS de CKAN,
     para que sea el grid quien coloque las tarjetas por orden */
  left: auto !important;
  top: auto !important;
}
/* el <a class="media-view"> vuelve a cubrir TODA su tarjeta (clic completo),
   pero ahora relativo a su propio .media-item (que es el que coloca el grid) */
.media-grid .media-item .media-view {
  position: absolute !important;
  top: 0; left: 0; right: 0; bottom: 0;
}
@media (max-width: 991.98px) {
  .media-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 575.98px) {
  .media-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   COLOR DE ACENTO POR ORGANIZACION (como el viejo)
   body.regtsa -> verde #adc663 (hover #80a040)
   body.diputacion -> azul #0077bb (hover #005d92)
   La clase la anade scriptpersonalizado.js segun la URL/organizacion.
   Los iconos de categoria ya salen verdes por su CSS propio.
   ============================================================ */
body.regtsa .btn-primary,
body.regtsa .btn.btn-primary {
  background-color: #adc663 !important;
  border-color: #adc663 !important;
  color: #fff !important;
}
body.regtsa .btn-primary:hover,
body.regtsa .btn-primary:focus,
body.regtsa .btn.btn-primary:hover,
body.regtsa .btn.btn-primary:focus {
  background-color: #80a040 !important;
  border-color: #80a040 !important;
}
body.regtsa .module-heading {
  background-color: #adc663 !important;
  color: #fff !important;
}
body.regtsa .pagination .page-item.active .page-link,
body.regtsa .pagination > .active > a,
body.regtsa .pagination > .active > span {
  background-color: #adc663 !important;
  border-color: #adc663 !important;
  color: #fff !important;
}
body.regtsa .masthead .navbar-nav .nav-link:hover,
body.regtsa .masthead .nav-link:hover,
body.regtsa .masthead .navigation .nav-pills li a:hover,
body.regtsa .masthead .navigation .nav-pills li.active a {
  background-color: #adc663 !important;
  color: #fff !important;
}
body.regtsa .module-search .module-content {
  background-color: #adc663 !important;
  color: #fff !important;
}
body.regtsa .module-search .tags {
  background-color: #80a040 !important;
  color: #fff !important;
}
body.regtsa table thead {
  background-color: #adc663 !important;
}
/* logo de cabecera version REGTSA. La clase html.regtsa la pone un script
   inline del <head> ANTES de pintar, evitando el flash del logo antiguo. */
html.regtsa .masthead .logo img,
body.regtsa .masthead .logo img {
  content: url("/base/images/logo-datos-abiertos-regtsa-v3.svg");
}

body.diputacion .btn-primary,
body.diputacion .btn.btn-primary {
  background-color: #0077bb !important;
  border-color: #0077bb !important;
  color: #fff !important;
}
body.diputacion .btn-primary:hover,
body.diputacion .btn-primary:focus,
body.diputacion .btn.btn-primary:hover,
body.diputacion .btn.btn-primary:focus {
  background-color: #005d92 !important;
  border-color: #005d92 !important;
}
body.diputacion .module-search .module-content {
  background-color: #0077bb !important;
  color: #fff !important;
}
body.diputacion .module-search .tags {
  background-color: #005d92 !important;
  color: #fff !important;
}
