/**
 * Forestgreen - Pie de pagina
 *
 * Medidas tomadas de https://forestgreen-pdp-atc.netlify.app/ a 1920 px:
 *   fondo #1f3a26, texto #cdd8d0, contenedor 1400 + 40 de margen
 *   rejilla 320px 200px 200px 220px 220px con hueco de 40
 *   titulos de columna 14 px/600, mayusculas, interletraje 0,8, blancos
 *   enlaces 13,5 px #cdd8d0, en bloque, 6 px arriba y abajo
 *   boton de presupuesto #2e8246, 14 px/500, 12px 22px, sin redondeo
 *   banda inferior 56 px, separada por 1 px rgba(255,255,255,.1)
 *
 * La estructura la pone footer.tpl. Aqui solo se pinta, y se doman las reglas
 * que el tema aplica a los modulos que viven dentro.
 */

.fg-footer {
  --fgf-bg: #1f3a26;
  --fgf-text: #cdd8d0;
  --fgf-muted: #a9b8ae;
  --fgf-title: #ffffff;
  --fgf-accent: #7dc98e;
  --fgf-cta: #2e8246;
  --fgf-rule: rgba(255, 255, 255, .1);
  --fgf-wrap: 1400px;
  --fgf-gutter: 40px;
}

/* --------------------------------------------------------------------------
   1. Base
   -------------------------------------------------------------------------- */

.fg-footer {
  background: var(--fgf-bg);
  color: var(--fgf-text);
  font-size: 13.5px;
  line-height: 1.7;
  margin-top: 0;
  border: 0;
}

.fg-footer .fg-footer__wrap {
  max-width: var(--fgf-wrap);
  margin: 0 auto;
  padding-left: var(--fgf-gutter);
  padding-right: var(--fgf-gutter);
  width: 100%;
}

.fg-footer .fg-footer__main { padding: 48px 0 40px; }

.fg-footer a { color: var(--fgf-text); text-decoration: none; }
.fg-footer a:hover { color: var(--fgf-title); text-decoration: none; }

.fg-footer .fg-footer__title,
.fg-footer .fg-footer__links .h3,
.fg-footer .fg-footer__links p.h3 {
  margin: 0 0 16px !important;
  padding: 0 !important;
  border: 0 !important;
  color: var(--fgf-title) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: .8px;
  text-transform: uppercase;
  line-height: 1.3 !important;
  text-align: left;
}

/* --------------------------------------------------------------------------
   2. Rejilla de cinco columnas
   -------------------------------------------------------------------------- */

.fg-footer .fg-footer__grid {
  display: grid;
  grid-template-columns: 320px 1fr 220px;
  gap: 40px;
  align-items: start;
}

/* Los bloques de ps_linklist ocupan la banda central. La rejilla la pone este
   contenedor y no la .row del modulo, para poder colocar el bloque de
   desistimiento en la tercera columna, debajo de sus enlaces. */
.fg-footer .fg-footer__links {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
  align-items: start;
}

.fg-footer .fg-footer__links .links,
.fg-footer .fg-footer__links #footer_links_block,
.fg-footer .fg-footer__links > .links > .row,
.fg-footer .fg-footer__links .row {
  display: contents;
}

.fg-footer .fg-footer__links .wrapper,
.fg-footer .fg-footer__links .col-md-12 {
  width: 100% !important;
  max-width: none !important;
  flex: none !important;
  padding: 0 !important;
  margin: 0;
}

/* --------------------------------------------------------------------------
   3. Enlaces
   -------------------------------------------------------------------------- */

.fg-footer .fg-footer__links ul,
.fg-footer .fg-footer__links ul.collapse {
  grid-template-columns: none !important;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* El display forzado solo vale en escritorio, donde las columnas tienen que
   estar siempre abiertas. En movil ps_linklist las sirve como acordeon de
   Bootstrap (ul.collapse, y .in cuando se abre); al forzar display:block sin
   media query las tres columnas quedaban desplegadas a la vez y el pie se iba
   a 2.006 px. Acotado a 992 px, el acordeon vuelve a funcionar y el pie baja
   a 1.470 px.  (15/09/2026) */
@media (min-width: 992px) {
  .fg-footer .fg-footer__links ul,
  .fg-footer .fg-footer__links ul.collapse { display: block !important; }
}

@media (max-width: 991px) {
  .fg-footer .fg-footer__links ul.collapse:not(.in):not(.show) { display: none !important; }
}

.fg-footer .fg-footer__links li { margin: 0; }

.fg-footer .fg-footer__links li a,
.fg-footer .fg-footer__links a.custom-page-link {
  display: block;
  padding: 6px 0;
  font-size: 13.5px !important;
  line-height: 1.45 !important;
  color: var(--fgf-text);
}

.fg-footer .fg-footer__links li a:hover { color: var(--fgf-title); }

/* La plantilla de ps_linklist imprime DOS titulos por columna:
     <p class="h3 hidden-sm-down">      -> el de escritorio
     <div class="title hidden-md-up">   -> la cabecera del acordeon de movil
   En escritorio sobra el segundo. Pero esta regla estaba sin media query y
   tambien lo mataba en movil, donde es el UNICO que queda visible (al otro lo
   esconde el propio tema por debajo de 768). Resultado: columnas sin titulo.
   Ahora solo aplica de 992 px hacia arriba. */
@media (min-width: 992px) {
  .fg-footer .fg-footer__links .title.hidden-md-up { display: none !important; }
}

/* --------------------------------------------------------------------------
   4. Columna de marca
   -------------------------------------------------------------------------- */

.fg-footer .fg-footer__logo { margin-bottom: 18px; }

.fg-footer .fg-footer__logo img {
  max-height: 48px;
  max-width: 190px;
  width: auto;
  height: auto;
  display: block;
}

.fg-footer .fg-footer__desc {
  margin: 0 0 20px;
  font-size: 13.5px;
  line-height: 1.7;
  color: var(--fgf-muted);
  max-width: 34ch;
}

.fg-footer .fg-footer__contact {
  margin: 0 0 20px;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.fg-footer .fg-footer__contact li {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  font-size: 13.5px;
  color: var(--fgf-text);
}

.fg-footer .fg-footer__contact svg {
  flex: 0 0 auto;
  color: var(--fgf-accent);
}

.fg-footer .fg-footer__cta {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 12px 22px;
  background: var(--fgf-cta);
  color: var(--fgf-title);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.3;
  border-radius: 0;
}

.fg-footer .fg-footer__cta:hover { background: #359450; color: var(--fgf-title); }

/* --------------------------------------------------------------------------
   5. Donde estamos: mapa y redes
   -------------------------------------------------------------------------- */

.fg-footer .fg-footer__place { min-width: 0; }

.fg-footer .fg-footer__map { margin-bottom: 18px; }

/* De todo lo que trae displayFooterBefore, en esta columna solo se quiere el
   mapa: el horario y la direccion ya estan en la columna de marca, y el
   bloque de Kit Digital se pinta mas abajo, a todo lo ancho. */
.fg-footer .fg-footer__map .banner_location.timetable,
.fg-footer .fg-footer__map .banner_location.text,
.fg-footer .fg-footer__map .wrapper_kit,
.fg-footer .fg-footer__map .location_title { display: none !important; }

.fg-footer .fg-footer__map .cb-item,
.fg-footer .fg-footer__map .cb-item-content,
.fg-footer .fg-footer__map .custom-html,
.fg-footer .fg-footer__map p {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
}

.fg-footer .fg-footer__map iframe,
.fg-footer .fg-footer__map img {
  width: 100% !important;
  height: 138px !important;
  min-height: 0 !important;
  border: 1px solid var(--fgf-rule);
  border-radius: 0 !important;
  display: block;
  background: rgba(255, 255, 255, .04);
}

.fg-footer .fg-footer__social ul {
  display: flex;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.fg-footer .fg-footer__social li { margin: 0; }

.fg-footer .fg-footer__social li a {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--fgf-rule);
  border-radius: 50%;
  background: transparent !important;
  filter: grayscale(1) brightness(2.4);
  position: static !important;
  transform: none !important;
}

.fg-footer .fg-footer__social li a:hover {
  border-color: var(--fgf-accent);
  filter: none;
}

/* --------------------------------------------------------------------------
   6. Kit Digital
   -------------------------------------------------------------------------- */

.fg-footer .fg-footer__grants {
  border-top: 1px solid var(--fgf-rule);
  padding: 26px 0;
  text-align: center;
}

/* Aqui pasa lo contrario que en la columna del mapa */
.fg-footer .fg-footer__grants .wrapper_location { display: none !important; }

.fg-footer .fg-footer__grants img { max-height: 58px; width: auto; }

.fg-footer .fg-footer__grants p {
  margin: 0 0 12px;
  font-size: 11.5px;
  letter-spacing: .4px;
  color: var(--fgf-muted);
}

/* --------------------------------------------------------------------------
   7. Banda inferior
   -------------------------------------------------------------------------- */

.fg-footer .fg-footer__bottom { border-top: 1px solid var(--fgf-rule); }

.fg-footer .fg-footer__bottom-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: nowrap;
  padding-top: 20px;
  padding-bottom: 20px;
  min-height: 56px;
}

.fg-footer .fg-footer__bottom .cb.displayFooterAfter,
.fg-footer .fg-footer__bottom .cb-wrapper { display: contents; }

.fg-footer .fg-footer__bottom .cb-item {
  flex: 0 1 auto;
  min-width: 0;
  margin: 0;
}

.fg-footer .fg-footer__bottom .cb-item:first-child { margin-right: auto; }

.fg-footer .fg-footer__bottom p { margin: 0; color: var(--fgf-muted); font-size: 13px; }

.fg-footer .fg-footer__bottom a { font-size: 13px; }

.fg-footer .fg-footer__bottom ul,
.fg-footer .fg-footer__bottom .custom-html {
  display: flex;
  align-items: center;
  gap: 20px;
  margin: 0;
  padding: 0;
  list-style: none;
  flex-wrap: wrap;
}

.fg-footer .fg-footer__bottom img { max-height: 18px; width: auto; }

/* --------------------------------------------------------------------------
   8. Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 1199px) {
  .fg-footer .fg-footer__grid { grid-template-columns: 280px 1fr 200px; gap: 30px; }
}

@media (max-width: 991px) {
  .fg-footer { --fgf-gutter: 20px; }
  .fg-footer .fg-footer__grid { grid-template-columns: 1fr 1fr; gap: 30px; }
  .fg-footer .fg-footer__brand { grid-column: 1 / -1; }
  .fg-footer .fg-footer__links { grid-column: 1 / -1; }
  .fg-footer .fg-footer__place { grid-column: 1 / -1; max-width: 320px; }
  .fg-footer .fg-footer__bottom-inner { flex-wrap: wrap; justify-content: center; text-align: center; }
  .fg-footer .fg-footer__bottom .cb-item:first-child { margin-right: 0; }
}

@media (max-width: 575px) {
  .fg-footer .fg-footer__links .row { grid-template-columns: 1fr; gap: 24px; }
}

/* --------------------------------------------------------------------------
   9. Dos frenos del tema
   -------------------------------------------------------------------------- */

/* Los enlaces heredaban el gris del tema (#737373), ilegible sobre el verde */
.fg-footer .fg-footer__contact a,
.fg-footer .fg-footer__contact a:visited,
.fg-footer .fg-footer__bottom a,
.fg-footer .fg-footer__links a {
  color: var(--fgf-text) !important;
}

.fg-footer .fg-footer__contact a:hover,
.fg-footer .fg-footer__bottom a:hover,
.fg-footer .fg-footer__links a:hover { color: var(--fgf-title) !important; }

/* Los frenos que hacian falta para el bloque de ps_socialfollow se han
   retirado: las redes las pinta ahora footer.tpl (seccion 13). */

/* --------------------------------------------------------------------------
   10. Banda de garantias del pie
   Medida en la referencia a 1920 px: alto 112, rejilla de 4 columnas
   iguales con hueco 22, icono 30 px de trazo 1,5 en color de acento,
   titulo y subtitulo en dos lineas, separador inferior de 1 px.
   -------------------------------------------------------------------------- */

.fg-footer .fg-footer__claims {
  border-bottom: 1px solid var(--fgf-rule);
}

.fg-footer .fg-footer__claims-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 22px;
  padding-top: 30px;
  padding-bottom: 30px;
  min-height: 112px;
  align-items: center;
}

.fg-footer .fg-footer__claim {
  display: flex;
  align-items: center;
  gap: 13px;
  min-width: 0;
}

.fg-footer .fg-footer__claim svg {
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  color: var(--fgf-accent);
}

.fg-footer .fg-footer__claim-text {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.fg-footer .fg-footer__claim-text strong {
  color: var(--fgf-title);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.45;
}

.fg-footer .fg-footer__claim-text span {
  color: var(--fgf-muted);
  font-size: 13px;
  line-height: 1.45;
}

/* --------------------------------------------------------------------------
   11. Orden de la banda inferior
   La referencia pone el aviso de copyright a la izquierda y los enlaces
   legales a la derecha; custombanners los sirve al reves. Se reordena con
   flex, sin tocar el modulo.
   -------------------------------------------------------------------------- */

.fg-footer .fg-footer__bottom #cb-56 { order: 1; margin-right: auto; }
.fg-footer .fg-footer__bottom #cb-55 { order: 2; }
.fg-footer .fg-footer__bottom #cb-27 { order: 3; margin-right: 0; }

@media (max-width: 991px) {
  .fg-footer .fg-footer__claims-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
  .fg-footer .fg-footer__bottom #cb-56 { margin-right: 0; }
}

@media (max-width: 575px) {
  .fg-footer .fg-footer__claims-grid { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
   12. Bloque de desistimiento
   Medido en la referencia: caja de 220 px con el boton arriba (38 px de alto,
   borde de 1 px, radio 0) y debajo un enlace de consulta a 11,5 px.
   -------------------------------------------------------------------------- */

.fg-footer .fg-footer__desist {
  grid-column: 3;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  margin-top: 18px;
  min-width: 0;
}

.fg-footer .fg-footer__desist-btn {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 10px 14px;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 0;
  background: none;
  color: var(--fgf-text) !important;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.3;
}

.fg-footer .fg-footer__desist-btn:hover {
  border-color: rgba(255, 255, 255, .45);
  color: var(--fgf-title) !important;
}

.fg-footer .fg-footer__desist-btn svg { width: 16px; height: 16px; flex: 0 0 16px; }

.fg-footer .fg-footer__desist-track {
  font-size: 11.5px;
  line-height: 1.3;
  color: var(--fgf-muted) !important;
  padding: 0;
}

.fg-footer .fg-footer__desist-track:hover { color: var(--fgf-text) !important; }

/* --------------------------------------------------------------------------
   13. Redes sociales
   Ahora las pinta footer.tpl (las URLs siguen siendo de ps_socialfollow), asi
   que ya no hacen falta los frenos de la seccion 9 para el bloque del modulo.
   Referencia: circulo de 36 px, borde 1 px rgba(255,255,255,.18), icono 17 px.
   -------------------------------------------------------------------------- */

.fg-footer .fg-footer__social {
  display: flex;
  gap: 10px;
  margin-top: 18px;
  padding: 0;
  list-style: none;
}

.fg-footer .fg-footer__social-link {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 50%;
  background: none !important;
  color: var(--fgf-text) !important;
}

.fg-footer .fg-footer__social-link:hover {
  border-color: var(--fgf-accent);
  color: var(--fgf-accent) !important;
}

.fg-footer .fg-footer__social-link svg { width: 17px; height: 17px; }

/* --------------------------------------------------------------------------
   14. Banda inferior: fuera los metodos de pago
   La tira de banderas/pago de custombanners se retira por peticion del
   cliente (07/09/2026). Sigue existiendo en el modulo, solo no se pinta.
   -------------------------------------------------------------------------- */

.fg-footer .fg-footer__bottom #cb-55 { display: none !important; }

@media (max-width: 991px) {
  .fg-footer .fg-footer__desist { grid-column: auto; }
}

/* --------------------------------------------------------------------------
   15. Aviso de copyright propio
   Lo escribe footer.tpl con el ano en curso. El banner cb-56 de custombanners
   se oculta: sigue existiendo, pero se quedo en 2023.
   -------------------------------------------------------------------------- */

.fg-footer .fg-footer__bottom #cb-56 { display: none !important; }

.fg-footer .fg-footer__copy {
  order: 0;
  margin: 0 auto 0 0;
  color: var(--fgf-muted);
  font-size: 13px;
}

@media (max-width: 991px) {
  .fg-footer .fg-footer__copy { margin: 0; }
}

/* ==========================================================================
   Móvil: correcciones medidas a 360/390/430 px  (08/09/2026)
   ========================================================================== */

@media (max-width: 991px) {

  /* La rejilla de tres columnas de enlaces sumaba 384,7 px dentro de un
     contenedor de 350: la tercera columna se salia y quedaba amputada, sin
     barra de scroll que lo delatara porque .fg-footer lleva overflow oculto.
     45 px de exceso a 360, 15 a 390. */
  .fg-footer .fg-footer__links {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px 20px;
  }

  /* El bloque de desistimiento caia como una columna mas de la rejilla,
     estrujado a 92 px, y su boton de 108 px se salia de la pista. */
  .fg-footer .fg-footer__desist { grid-column: 1 / -1; }

  .fg-footer .fg-footer__desist-track { font-size: 12.5px; }

  /* .fg-footer__place llevaba max-width 320 y terminaba 30 px antes que sus
     hermanos, con un escalon visible en el margen derecho. */
  .fg-footer .fg-footer__place { max-width: none; }

  /* Zonas pulsables por debajo de 44 px */
  .fg-footer .fg-footer__social-link { width: 44px; height: 44px; }

  .fg-footer .fg-footer__links a,
  .fg-footer .fg-footer__bottom a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }

  .fg-footer .fg-footer__cta { min-height: 44px; }
}

/* ==========================================================================
   Móvil: deshacer el pie "en fichas" del tema  (08/09/2026)
   theme.css trae, en su bloque de movil, un pie pensado para fondo blanco con
   acordeones:
       .footer-container .links ul      { background-color: #F6F6F6 }
       .footer-container .links ul > li { padding:.625rem; border-bottom:1px solid #FFF }
       .footer-container .links ul > li a { color: var(--main-text-color) }
   Sobre nuestro pie verde oscuro eso pintaba cada columna como una tarjeta
   gris con separadores blancos y el texto en gris oscuro, ilegible.
   Como .fg-footer y .footer-container son el mismo div, basta con anadir una
   clase mas para ganar en especificidad.
   ========================================================================== */

@media (max-width: 991px) {
  .fg-footer.footer-container .fg-footer__links ul,
  .fg-footer.footer-container .links ul {
    background-color: transparent !important;
    margin: 0;
    padding: 0;
  }

  .fg-footer.footer-container .fg-footer__links ul > li,
  .fg-footer.footer-container .links ul > li {
    padding: 0;
    font-weight: 400;
    border-bottom: 0;
    background: none;
  }

  .fg-footer.footer-container .fg-footer__links ul > li a,
  .fg-footer.footer-container .links ul > li a {
    color: var(--fgf-text) !important;
    background: none;
  }

  .fg-footer.footer-container .fg-footer__links ul > li a:hover {
    color: var(--fgf-title) !important;
  }

  /* Los titulos de columna tambien los reescala el tema */
  .fg-footer.footer-container .fg-footer__links .h3,
  .fg-footer.footer-container .fg-footer__links p.h3 {
    font-size: 14px !important;
    color: var(--fgf-title) !important;
    border-bottom: 0 !important;
    padding: 0 !important;
  }
}

/* --------------------------------------------------------------------------
   Móvil: banda inferior en una sola linea
   custom.css apila esa lista en movil:
       footer .wrapper_footer_after ul { flex-direction: column; align-items: center }
   y con el min-height de 44 px que pusimos por zona pulsable, cada enlace se
   convertia en una franja alta y separada. Vuelve a fila, centrada y con
   huecos normales; los 44 px se dejan en 36, que en fila siguen siendo
   comodos de pulsar sin abrir zanjas.
   -------------------------------------------------------------------------- */

@media (max-width: 991px) {
  .fg-footer.footer-container .fg-footer__bottom-inner {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 8px;
  }

  .fg-footer.footer-container .fg-footer__bottom .wrapper_footer_after ul,
  .fg-footer.footer-container .fg-footer__bottom ul,
  .fg-footer.footer-container .fg-footer__bottom .custom-html {
    flex-direction: row !important;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 2px 18px;
    margin: 0;
    padding: 0;
    text-align: center;
  }

  .fg-footer.footer-container .fg-footer__bottom li { margin: 0; }

  .fg-footer.footer-container .fg-footer__bottom a {
    min-height: 36px;
    font-size: 12.5px;
  }

  .fg-footer .fg-footer__copy {
    margin: 0;
    text-align: center;
    font-size: 12.5px;
  }
}

/* --------------------------------------------------------------------------
   Móvil: titulo de columna del acordeon
   Es el .title que imprime ps_linklist. Se le da el aspecto de los titulos de
   escritorio y se quita el separador claro que le pone el tema. El icono de
   mas/menos se deja, que es el que indica que la columna se pliega.
   -------------------------------------------------------------------------- */

@media (max-width: 991px) {
  .fg-footer.footer-container .fg-footer__links .title {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 0 10px !important;
    margin: 0;
    border-bottom: 0 !important;
    background: none;
  }

  .fg-footer.footer-container .fg-footer__links .title .h3,
  .fg-footer.footer-container .fg-footer__links .title span.h3 {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    color: var(--fgf-title) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: .8px;
    text-transform: uppercase;
    line-height: 1.3 !important;
  }

  .fg-footer.footer-container .fg-footer__links .title .navbar-toggler,
  .fg-footer.footer-container .fg-footer__links .title .collapse-icons {
    color: var(--fgf-muted);
    padding: 0;
  }

  .fg-footer.footer-container .fg-footer__links .title .material-icons { font-size: 20px; }
}
