/* Spanish storefront overrides. Shared CSS keeps the legacy Plenty geometry. */
:root {
  --site-language: es;
}

/* The Spanish introduction is substantially longer than the Norwegian one. */
.legacy-intro__title,
.legacy-intro__title h1,
.legacy-intro__text {
  height: auto;
}

@media (max-width: 900.98px) {
  .legacy-intro.container {
    height: auto;
  }
}

@media (max-width: 575.98px) {
  /* The live ES header keeps the captured 324px search row at 390px. The
     shared <=400px overflow guard deliberately stretches it for 320px; reset
     that guard only above the smallest supported viewport. */
  .reference-header .header-tools.container {
    width: calc(100% - 22px);
    margin-right: auto;
    margin-left: auto;
  }

  .reference-header .header-tools .search {
    width: 324.39px;
    max-width: none;
    margin-right: 0;
    margin-left: 28.8px;
  }

  .reference-header .header-tools .search input {
    width: 273px;
    min-width: 0;
    flex: 1 1 auto;
  }

  .reference-header .account-tools {
    width: 195px;
    min-width: 195px;
    margin: 0 0 0 97.14px;
  }

  .reference-header .service-links > li.service-phone {
    left: 58px;
  }

  .reference-header .service-links > li.service-phone .fa {
    color: #212529;
  }

  .legacy-intro.container {
    min-height: 350.28px;
  }

  .legacy-intro__title {
    min-height: 91.28px;
  }

  .legacy-intro__title h1 {
    min-height: 49.28px;
  }

  .legacy-intro__text {
    min-height: 217px;
  }

  /* Plenty leaves a 28px utility row before the footer columns and keeps the
     consent-settings shield immediately above the legal widget. Reproducing
     those two in-flow gaps also prevents the bottom "to top" bar from
     overlapping Contacto. */
  html[lang="es"]:not([lang="no"]):not([lang="tr"]) .site-footer {
    padding-bottom: 80.5px;
    border-top: 3px solid #f29400;
  }

  .reference-footer-content {
    margin-top: 25px;
  }

  html[lang="es"]:not([lang="no"]):not([lang="tr"]) .footer-inline-top {
    left: 0;
    top: -17.1588px;
  }

  html[lang="es"]:not([lang="no"]):not([lang="tr"]) .footer-legal {
    height: 120.7px;
    margin-top: 32.6px;
  }

  html[lang="es"]:not([lang="no"]):not([lang="tr"]) .footer-privacy[hidden] {
    right: 75px;
    bottom: 201.2px;
    display: inline-flex;
  }
}

@media (max-width: 374px) {
  .reference-header .header-tools.container {
    width: 100%;
    margin-right: 0;
    margin-left: 0;
  }

  .reference-header .header-tools .search {
    width: calc(100% - 20px);
    max-width: calc(100vw - 20px);
    margin-right: 10px;
    margin-left: 10px;
  }

  .reference-header .account-tools {
    width: auto;
    min-width: 0;
    margin-right: auto;
    margin-left: auto;
  }

  .reference-header .service-links > li.service-phone {
    left: 46px;
  }
}

@media (min-width: 901px) {
  /* Desktop Plenty keeps the same 28px utility row before its 999px footer
     grid. Its legal widget is one narrow Bootstrap column, so Contacto wraps
     below the withdrawal button instead of sharing the full-width row. */
  html[lang="es"]:not([lang="no"]):not([lang="tr"]) .site-footer {
    padding-bottom: 78px;
    border-top: 3px solid #f29400;
  }

  .reference-footer-content {
    margin-top: 25px;
  }

  html[lang="es"]:not([lang="no"]):not([lang="tr"]) .footer-payment {
    height: 196.39px;
  }

  html[lang="es"]:not([lang="no"]):not([lang="tr"]) .footer-inline-top {
    top: -17.1588px;
  }

  html[lang="es"]:not([lang="no"]):not([lang="tr"]) .footer-legal {
    width: 227.25px;
    height: 92.65625px;
    margin-top: 59.4px;
    margin-right: auto;
    margin-left: calc(50% - 499.5px);
    text-align: center;
  }

  html[lang="es"]:not([lang="no"]):not([lang="tr"]) .footer-contact {
    position: relative;
    left: -5px;
  }

  html[lang="es"]:not([lang="no"]):not([lang="tr"]) .footer-privacy[hidden] {
    right: calc(50% - 514.5px);
    bottom: 184.65625px;
    display: inline-flex;
    width: 233.796875px;
  }
}

@media (min-width: 1280px) {
  .legacy-intro__title {
    min-height: 91.28px;
  }

  .legacy-intro__title h1 {
    min-height: 49.28px;
  }

  .legacy-intro__text {
    min-height: 112px;
  }
}