/* ===========================
   MR CUSTOM (reutilizable)
   Objetivo:
   - Menú fondo rojo + texto blanco (hover NO se toca)
   - Buscador más ancho y bien alineado
   - Mejor legibilidad/venta sin romper tu plantilla
   =========================== */

/* --- MENÚ PRINCIPAL --- */
#menu.navbar {
  background: #d80000 !important;   /* rojo sólido */
  border: 0 !important;
  margin-bottom: 0 !important;
}

#menu.navbar .container,
#menu.navbar .navbar-collapse {
  background: transparent !important;
}

/* En algunos skins el UL trae fondo blanco/gris */
#menu.navbar .nav,
#menu.navbar .navbar-nav {
  background: transparent !important;
}

/* Texto del menú: BLANCO y más visible */
#menu.navbar .navbar-nav > li > a,
#menu.navbar .navbar-nav > li > a span {
  color: #ffffff !important;
  font-weight: 700;
  letter-spacing: .2px;
  text-transform: uppercase;
}

/* Separación y “presencia” */
#menu.navbar .navbar-nav > li > a {
  padding-top: 14px;
  padding-bottom: 14px;
}

/* IMPORTANTE:
   Hover y estados activos NO se sobrescriben,
   para que “el hover del menú” quede como lo tienes en el tema.
   (Por eso aquí no hay reglas :hover ni .active)
*/

/* Dropdown: respetamos tu estilo base, solo aseguramos legibilidad */
#menu .dropdown-menu a {
  color: inherit; /* deja que el tema mande aquí */
}

/* --- BUSCADOR ANCHO --- */
.mr-search-wide {
  padding-left: 15px;
  padding-right: 0;
}

#search {
  width: 100%;
}

#search form {
  width: 100%;
  display: flex;
  align-items: stretch;
}

#search #filter_name.form-control.input-lg {
  width: 100% !important;
  height: 48px;
  border-radius: 6px 0 0 6px;
}

#search .button-search {
  height: 48px;
  min-width: 56px;
  border-radius: 0 6px 6px 0;
}

/* Ajuste móvil: que se vea cómodo */
@media (max-width: 767px) {
  .mr-search-wide {
    padding-right: 15px;
  }
  #search #filter_name.form-control.input-lg {
    height: 46px;
  }
  #search .button-search {
    height: 46px;
    min-width: 52px;
  }
}

/* --- Extra: el menú en móvil a veces se “blanquea” en el header --- */
@media (max-width: 991px) {
  #menu.navbar .navbar-header,
  #menu.navbar .navbar-collapse {
    background: #d80000 !important;
  }
  #menu.navbar .navbar-header span.visible-xs,
  #menu.navbar .navbar-header span.visible-sm {
    color: #ffffff !important;
    font-weight: 700;
  }
}
/* SOLO ESCRITORIO: centra verticalmente el texto del menú */
@media (min-width: 768px) {
  #menu.navbar{
    min-height: 60px;          /* altura del bloque del menú */
    margin-bottom: 0;
    border-radius: 0;
  }

  #menu .navbar-nav > li > a{
    padding-top: 20px;         /* ajusta si quieres +/− */
    padding-bottom: 20px;      /* igual que arriba */
    line-height: 20px;         /* evita que se baje el texto */
    color: #fff;               /* letra blanca sobre rojo */
  }
}

/* ================================
   OFERTAS – mismo alto para todas
   ================================ */

/* El item del carrusel */
.product_carousel .product-thumb {
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* Zona de imagen: altura fija */
.product_carousel .product-thumb .image {
  height: 220px;                 /* AJUSTA si quieres más/menos */
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

/* Imagen contenida sin deformar */
.product_carousel .product-thumb .image img {
  max-height: 100%;
  max-width: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}

/* Texto ocupa el mismo espacio */
.product_carousel .product-thumb .caption {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* Título con altura controlada */
.product_carousel .product-thumb .caption h4 {
  min-height: 40px;              /* fuerza mismo alto de título */
}

/* Botón siempre abajo */
.product_carousel .product-thumb .button-group {
  margin-top: auto;
}

/* Buscador más ancho (hasta la derecha) */
.mr-search-wide { width: 100%; }
.mr-search-wide form { width: 100%; display: flex; }
.mr-search-wide input.form-control { flex: 1; }

/* Sección Empresa */
.mr-empresa { margin-top: 10px; margin-bottom: 25px; }
.mr-card {
  background: #fff;
  border: 1px solid #eee;
  border-radius: 6px;
  padding: 18px;
  margin-bottom: 20px;
}
.mr-card-title { margin-top: 0; margin-bottom: 12px; font-weight: 700; }

.mr-quote {
  border-left: 4px solid #e43d30; /* rojo corporativo */
  padding-left: 14px;
  margin: 14px 0;
  color: #444;
}

/* CTA */
.mr-cta-row { margin-top: 12px; display: flex; gap: 10px; flex-wrap: wrap; }
.mr-btn-cta { border-radius: 4px; }

/* Galería */
.mr-gallery { display: grid; grid-template-columns: 1fr; gap: 10px; }
.mr-gallery-item img {
  width: 100%;
  height: auto;
  border-radius: 6px;
  border: 1px solid #eee;
}

/* En desktop, 2 columnas de fotos si hay varias */
@media (min-width: 992px) {
  .mr-gallery { grid-template-columns: 1fr 1fr; }
}

/* ===========================
   SERVICIOS (tarjetas + iconos)
   =========================== */

.mr-page-head { margin-bottom: 18px; }
.mr-lead { font-size: 15px; line-height: 1.6; margin: 8px 0 0; }

.mr-services-grid { margin-top: 10px; }

.mr-service-card{
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 10px;
  padding: 18px 16px;
  margin-bottom: 18px;
  min-height: 260px;             /* misma altura */
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
}

.mr-service-card h3{
  margin: 0 0 10px;
  font-weight: 700;
  font-size: 16px;
  line-height: 1.15;
  text-transform: uppercase;
}

.mr-service-card p{
  margin: 0;
  font-size: 13px;
  line-height: 1.6;
  color: #444;
}

/* Icono moderno, grande y perfectamente alineado */
.mr-service-icon{
  width: 64px;
  height: 64px;
  border-radius: 14px;
  background: #e3342a;          /* rojo marca */
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
  box-shadow: 0 10px 20px rgba(227,52,42,.25);
}

.mr-service-icon i{
  font-size: 30px;              /* “grande” */
  line-height: 1;
}

/* CTA */
.mr-services-cta{
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 12px;
  padding: 18px 18px;
  margin: 8px 0 20px;
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
}

.mr-services-cta h4{ margin: 0 0 6px; font-weight: 700; }
.mr-services-cta p{ margin: 0; color: #444; }

.mr-cta-btn{
  background: #e3342a;
  border-color: #e3342a;
}
.mr-cta-btn:hover, .mr-cta-btn:focus{
  background: #c92b22;
  border-color: #c92b22;
}

/* En móvil, que no quede tan alto */
@media (max-width: 767px){
  .mr-service-card{ min-height: 0; }
  .mr-services-cta .text-right{ text-align: left; margin-top: 10px; }
}

/* ====== Catálogo: fotos siempre a la misma altura ====== */
.mr-products-equal .product-thumb .image{
  height: 220px;            /* ajusta si quieres más/menos alto */
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: #fff;
}

.mr-products-equal .product-thumb .image img{
  max-height: 100%;
  width: auto;
  object-fit: contain;
}

/* Ajuste fino en móvil */
@media (max-width: 767px){
  .mr-products-equal .product-thumb .image{
    height: 190px;
  }
}

/* Extra: separaciones y consistencia de cards */
.mr-products-equal .product-thumb{
  height: 100%;
}

.mr-products-equal .product-thumb .caption h4{
  min-height: 44px;  /* ayuda a que los títulos no “bailen” */
}

/* ===== Header: buscador grande hasta la derecha ===== */
.mr-header-flex .mr-search-cell { width: 100%; }
.mr-search { width: 100%; }
.mr-search-form { display: flex; width: 100%; }
.mr-search-form input { flex: 1; }
.mr-search-form .button-search { width: 56px; }

/* ===== Menú rojo con texto blanco (hover se respeta) ===== */
#menu.navbar.mr-menu { background: #e53935; border: 0; }
#menu.navbar.mr-menu .navbar-nav > li > a { color: #fff !important; font-weight: 700; }
#menu.navbar.mr-menu .navbar-nav > li > a:hover { /* deja hover del theme */ }

/* ===== Productos: misma altura de imagen + cards consistentes ===== */
.mr-product-card { display: flex; flex-direction: column; height: 100%; }
.mr-product-image {
  position: relative;
  height: 220px;            /* AJUSTA si quieres más/menos alto */
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: #fff;
}
.mr-product-image img {
  max-height: 100%;
  width: 100%;
  object-fit: contain;      /* mantiene proporción sin recortar */
}
.mr-product-caption { flex: 1; }
.mr-product-title { min-height: 44px; } /* ayuda a alinear títulos */
.mr-product-actions { margin-top: auto; }

.mr-badge-oferta{
  position:absolute;
  top:10px;
  right:10px;
  background:#f7c948;
  color:#111;
  font-weight:700;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
}

/* Ocultar honeypot anti-bot */
.mr-honeypot { position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }

/* Buscador ancho hasta la derecha */
.mr-search-wide { width:100%; }
.mr-search-form { display:flex; width:100%; }
.mr-search-form input { flex:1; }


/* --- Buscar/Catálogos: igualar altura de imágenes --- */
.mr-product-card .image {
  position: relative;
}

.mr-thumb-img {
  width: 100%;
  height: 220px;          /* Ajusta si quieres más/menos alto */
  object-fit: cover;
}

/* En pantallas pequeñas, un pelín menos alto */
@media (max-width: 767px) {
  .mr-thumb-img { height: 180px; }
}

/* Badge OFERTA */
.mr-badge-oferta{
  position:absolute;
  top:10px;
  left:10px;
  background:#d9534f;
  color:#fff;
  font-weight:700;
  padding:6px 10px;
  border-radius:4px;
  font-size:12px;
  letter-spacing:0.5px;
}
