/*
 * Funcionalidades: Estilos globales, buscador, formularios y responsive.
 *                  (Estilos visuales movidos a restaurantes-visual.css para cumplir norma < 200 líneas)
 * Versión: 1.04
 */

/* Hacer que los botones ocupen el ancho total de forma proporcional */
.hp-form__footer .hp-form__button,
.hp-form__footer button[type="submit"] {
  flex: 1 !important;
  margin: 0 !important;
  /* Elimina márgenes heredados que desplazan los botones al apilarse */
  justify-content: center !important;
  padding: 8px 15px !important;
  font-size: 14px !important;
  border-radius: 15px !important;
  box-sizing: border-box !important;
}

/* Estilo para los títulos pequeños encima de los campos de búsqueda */
.hp-form--listing-search label {
  display: block !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  color: #888 !important;
  margin-bottom: 5px !important;
}

/* Forzar el color de fondo en la página de resultados de búsqueda y archivo */
body.post-type-archive-hp_listing,
body.hp-listing-archive,
.archive.post-type-archive-hp_listing #page {
  background-color: #faf5e5 !important;
}

/* Reducir espacio vertical del título gigante de la página */
p.has-vivid-cyan-blue-color {
  margin-top: 0 !important;
  margin-bottom: 5px !important;
  line-height: 1.1 !important;
  padding-top: 0 !important;
}

/* Asegurar que los mensajes de éxito/error ocupen todo el ancho y no se compriman */
.hp-message,
.hp-form__message {
  flex-basis: 100% !important;
  width: 100% !important;
}

/* Alineación de los botones Buscar y Limpiar */
.hp-form {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
}

.hp-form .hp-form__footer {
  flex-basis: 100% !important;
  width: 100% !important;
  margin: 10px auto 0 auto !important;
  /* Centramos el bloque de botones */
  display: flex !important;
  gap: 5px !important;
  justify-content: center !important;
}

/* Ajustes para móviles: reducir separaciones verticales */
@media (max-width: 767px) {

  .hp-form--listing-search,
  .hp-form--listing-update {
    gap: 3px !important;
    /* Reduce el espacio entre campos de búsqueda */
  }

  /* Reducir espacio entre etiqueta e input en móvil */
  .hp-form--listing-search label {
    margin-bottom: 0px !important;
  }

  .hp-form__field {
    margin-bottom: 0 !important;
  }

  /* Compactar el aviso de radio en móvil */
  .hp-listing-radius-info {
    margin-bottom: 2px !important;
    padding: 3px 10px !important;
  }

  .hp-form--listing-search .hp-form__footer,
  .hp-form--listing-update .hp-form__footer {
    flex-basis: 95% !important;
    /* En móvil les damos más margen para legibilidad */
    width: 95% !important;
    gap: 5px !important;
    /* Reduce el espacio entre los botones */
    margin-top: 5px !important;
    /* Reduce el espacio entre el último campo y los botones */
  }

  /* Forzar ancho completo para botones de acción en móviles */
  .hp-form--listing-update .hp-form__footer .hp-form__button,
  .hp-form--listing-update .hp-form__footer button[type="submit"],
  .hp-form--listing-submit .hp-form__footer .hp-form__button,
  .hp-form--listing-submit .hp-form__footer button[type="submit"],
  .hp-button-cancel {
    max-width: 100% !important;
    flex: 1 1 100% !important;
    margin: 0 0 10px 0 !important;
  }
}

/* Estilo para el título de la página de edición/creación de anuncios */
.hp-page__title,
.entry-title {
  color: #6dc0e3 !important;
  font-size: 24px !important;
  /* Tamaño de fuente mucho más grande */
  font-weight: bold !important;
  /* Asegura que el título destaque */
  margin-bottom: 5px !important;
  /* Añade espacio debajo del título */
}

/* Ocultar visualmente el campo de categoría en los formularios */
.hp-form__field--categories,
.hp-form__field:has(select[name^="categories"]) {
  display: none !important;
}

/* Ocultar totalmente el menú y los enlaces de usuario de HivePress (Login/Cuenta/Mensajes) */
.hp-menu--user,
.hp-site-header__menu--user,
.hp-menu__item--user-login,
.hp-menu__item--user-account,
.hp-menu__item--user-register,
[class*="hp-menu__item--user"] {
  display: none !important;
}

/* Estilo para el aviso del radio de 15km */
.hp-listing-radius-info {
  background-color: #eef7fd !important;
  border: 1px solid #6dc0e3 !important;
  padding: 5px 15px !important;
  border-radius: 15px !important;
  font-size: 13px !important;
  color: #444 !important;
  margin-bottom: 5px !important;
  width: 100% !important;
  flex-basis: 100% !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  order: -1 !important;
}

.hp-listing-radius-info i {
  color: #6dc0e3 !important;
  font-size: 16px !important;
}

/* Forzar que el contenedor de resultados y orden salte a una nueva línea */
.hp-listing-pagination-header,
.hp-listings-header,
.hp-row.hp-listing-pagination-header {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 10px !important;
}

/* Asegurar que el contador de resultados y el selector de orden respiren */
.hp-result-count,
.hp-sort {
  flex: 0 1 auto !important;
}

/* Expandir los formularios de edición y creación al ancho total de la página */
.hp-template--listing-edit-page .hp-page__content,
.hp-template--listing-update-page .hp-page__content,
.hp-template--listing-submit-page .hp-page__content,
.hp-form--listing-update,
.hp-form--listing-submit,
.hp-form__fields,
.hp-page__topbar {
  max-width: 100% !important;
  width: 100% !important;
  flex-basis: 100% !important;
}

/* Aplicar el ancho del 40% a los botones de Guardar y Cancelar en edición/creación */
.hp-form--listing-update .hp-form__footer .hp-form__button,
.hp-form--listing-update .hp-form__footer button[type="submit"],
.hp-form--listing-submit .hp-form__footer .hp-form__button,
.hp-form--listing-submit .hp-form__footer button[type="submit"],
.hp-button-cancel {
  max-width: 40% !important;
  width: 100% !important;
  border-radius: 15px !important;
  flex: 0 1 40% !important;
  /* Permite que crezcan hasta el 40% pero no más */
  margin: 0 5px 5px 5px !important;
  /* Margen lateral pequeño para que no se peguen si están en la misma línea */
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

/* --- ESTILOS PARA LA PÁGINA DEL MAPA --- */

/* Asegurar altura y estilo del contenedor del mapa de HivePress */
.hp-map {
  height: 600px !important;
  /* Altura generosa para navegación */
  border-radius: 15px !important;
  border: 1px solid #e0e0e0 !important;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05) !important;
  margin-bottom: 15px !important;
}