/* =========================================================
   11 — MAUESPEJELCOM SEARCH OVERLAY EDITORIAL
   UBICACIÓN: APARIENCIA → PERSONALIZAR → CSS ADICIONAL

   REGLAS:
   - No tocar código maestro 01–10
   - No tocar mobile header
   - No tocar logo
   - Solo ajustar el buscador abierto de Salient

   REQUIERE CONFIGURACIÓN EN SALIENT:
   - Remove Header search: OFF
   - Remove Search Bottom Helper Text: ON
   - Search Placeholder Text: ¿QUÉ ESTÁS BUSCANDO?

   Objetivo:
   - Buscador editorial en español
   - Sin helper text en inglés
   - Título negro centrado en mayúsculas
   - Línea editorial gris
   - Barra de territorios centrada en Infrared
   - Caja blanca compacta y con identidad
========================================================= */


/* =====================================================
   11A — SEARCH OVERLAY GENERAL
===================================================== */

body #search-outer,
body.material #search-outer,
body #search-outer.nectar,
body #search-outer.nectar.material-open {
  background: transparent !important;
  background-color: transparent !important;

  border: 0 !important;
  box-shadow: none !important;

  overflow: visible !important;
}


/* =====================================================
   11B — CAJA REAL DEL BUSCADOR
===================================================== */

body #search-outer #search,
body.material #search-outer #search,
body #search-outer.nectar.material-open #search {
  position: relative !important;

  height: 126px !important;
  min-height: 126px !important;
  max-height: 126px !important;

  margin: 0 !important;

  padding-top: 15px !important;
  padding-right: 92px !important;
  padding-bottom: 12px !important;
  padding-left: 92px !important;

  background: #ffffff !important;
  background-color: #ffffff !important;

  border: 0 !important;
  border-radius: 0 !important;

  box-shadow: none !important;

  overflow: hidden !important;

  box-sizing: border-box !important;
}


/* =====================================================
   11C — CONTENEDORES INTERNOS
===================================================== */

body #search-outer #search .container,
body #search-outer #search .row,
body #search-outer #search .col,
body #search-outer #search .span_12,
body #search-outer #search form {
  width: 100% !important;
  max-width: 100% !important;

  height: auto !important;
  min-height: 0 !important;

  margin: 0 !important;
  padding: 0 !important;

  background: transparent !important;
  background-color: transparent !important;

  border: 0 !important;
  box-shadow: none !important;

  overflow: visible !important;

  box-sizing: border-box !important;
}


/* =====================================================
   11D — INPUT PRINCIPAL
   Guía principal centrada.
===================================================== */

body #search-outer #search input,
body.material #search-outer #search input,
body #search-outer.nectar.material-open #search input,
body #search-outer #search input[type="text"],
body #search-outer #search input[type="search"] {
  width: 100% !important;

  height: auto !important;
  min-height: 0 !important;

  margin: 0 !important;
  padding: 0 0 6px 0 !important;

  color: #000000 !important;

  background: transparent !important;
  background-color: transparent !important;

  border-top: 0 !important;
  border-right: 0 !important;
  border-left: 0 !important;
  border-bottom: 2px solid #cfcfcf !important;

  border-radius: 0 !important;

  box-shadow: none !important;
  outline: none !important;

  font-family: "Montserrat", "Inter", "Arial", sans-serif !important;
  font-size: clamp(34px, 3.45vw, 58px) !important;
  line-height: 0.95 !important;
  font-weight: 900 !important;
  letter-spacing: -0.055em !important;

  text-align: center !important;
  text-transform: uppercase !important;

  caret-color: #ff5a5f !important;

  box-sizing: border-box !important;
}

body #search-outer #search input:focus,
body.material #search-outer #search input:focus {
  border-bottom-color: #cfcfcf !important;
  box-shadow: none !important;
  outline: none !important;
}

body #search-outer #search input::placeholder {
  color: #000000 !important;
  opacity: 1 !important;
  text-align: center !important;
  text-transform: uppercase !important;
}

body #search-outer #search input::-webkit-input-placeholder {
  color: #000000 !important;
  opacity: 1 !important;
  text-align: center !important;
  text-transform: uppercase !important;
}


/* =====================================================
   11E — BARRA EDITORIAL DE TERRITORIOS
===================================================== */

body #search-outer #search:after,
body.material #search-outer #search:after,
body #search-outer.nectar.material-open #search:after {
  content: "SNEAKERS  /  MARCAS  /  DROPS  /  GUÍAS  /  CULTURA" !important;

  position: absolute !important;

  left: 92px !important;
  right: 92px !important;
  bottom: 15px !important;

  display: block !important;

  color: #ff5a5f !important;

  font-family: "Montserrat", "Inter", "Arial", sans-serif !important;
  font-size: clamp(13px, 0.95vw, 16px) !important;
  line-height: 1 !important;
  font-weight: 900 !important;
  letter-spacing: 0.055em !important;

  text-align: center !important;
  text-transform: uppercase !important;

  opacity: 1 !important;
  visibility: visible !important;

  pointer-events: none !important;

  z-index: 100005 !important;
}


/* =====================================================
   11F — OCULTAR HELPER / TEXTOS EXTRA
===================================================== */

body #search-outer #search small,
body #search-outer #search p,
body #search-outer #search form > span,
body #search-outer #search .span_12 > span,
body #search-outer #search .instructions,
body #search-outer #search .search-instructions,
body #search-outer #search .search-helper {
  display: none !important;

  visibility: hidden !important;
  opacity: 0 !important;

  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;

  margin: 0 !important;
  padding: 0 !important;

  font-size: 0 !important;
  line-height: 0 !important;

  color: transparent !important;

  overflow: hidden !important;
  pointer-events: none !important;
}


/* =====================================================
   11G — CLOSE BUTTON / TACHE SUPERIOR DERECHO
   Se mantiene funcional; no seguimos ajustándolo.
===================================================== */

body #search-outer #close,
body #search-outer .close {
  position: absolute !important;

  top: 22px !important;
  right: 24px !important;

  width: 34px !important;
  height: 34px !important;

  margin: 0 !important;
  padding: 0 !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  background: rgba(0, 0, 0, 0.06) !important;
  background-color: rgba(0, 0, 0, 0.06) !important;

  border: 0 !important;
  border-radius: 999px !important;

  box-shadow: none !important;

  transform: none !important;

  z-index: 100006 !important;

  transition:
    background-color 0.22s ease,
    transform 0.22s ease !important;
}

body #search-outer #close:hover,
body #search-outer .close:hover {
  background: #ff5a5f !important;
  background-color: #ff5a5f !important;

  transform: scale(1.04) !important;
}

body #search-outer #close a,
body #search-outer .close a {
  width: 34px !important;
  height: 34px !important;

  margin: 0 !important;
  padding: 0 !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  color: #000000 !important;

  background: transparent !important;
  background-color: transparent !important;

  border: 0 !important;
  box-shadow: none !important;

  text-decoration: none !important;
}

body #search-outer #close a span,
body #search-outer #close a i,
body #search-outer .close a span,
body #search-outer .close a i {
  color: #000000 !important;

  font-size: 20px !important;
  line-height: 1 !important;
  font-weight: 700 !important;
}

body #search-outer #close:hover a span,
body #search-outer #close:hover a i,
body #search-outer .close:hover a span,
body #search-outer .close:hover a i {
  color: #000000 !important;
}


/* =====================================================
   11H — AJAX RESULTS
===================================================== */

body #search-outer .nectar-ajax-search-results,
body #search-outer #search-results {
  margin-top: 18px !important;

  background: #ffffff !important;
  background-color: #ffffff !important;

  border: 0 !important;
  border-radius: 0 0 18px 18px !important;

  box-shadow: none !important;

  overflow: hidden !important;
}

body #search-outer .nectar-ajax-search-results a,
body #search-outer #search-results a {
  color: #000000 !important;

  font-family: "Montserrat", "Inter", "Arial", sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.035em !important;

  text-decoration: none !important;
}

body #search-outer .nectar-ajax-search-results a:hover,
body #search-outer #search-results a:hover {
  color: #ff5a5f !important;
}