/* FONTS */
* {
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

.montserrat-bold {
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Mansfield Bold';
    src: url('/Fonts/Mansfield-Bold.ttf') format('truetype'),
        url('/Fonts/Mansfield-Bold.otf') format('opentype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Mansfield Extra Bold';
    src: url('/Fonts/Mansfield-Extra-Bold.ttf') format('truetype'),
        url('/Fonts/Mansfield-Extra-Bold.otf') format('opentype');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'Mansfield Light';
    src: url('/Fonts/Mansfield-Light.ttf') format('truetype'),
        url('/Fonts/Mansfield-Light.otf') format('opentype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Mansfield Medium';
    src: url('/Fonts/Mansfield-Medium.ttf') format('truetype'),
        url('/Fonts/Mansfield-Medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Mansfield Semi Bold';
    src: url('/Fonts/Mansfield-Semi-Bold.ttf') format('truetype'),
        url('/Fonts/Mansfield-Semi-Bold.otf') format('opentype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Mansfield Black';
    src: url('/Fonts/Mansfield-Black.ttf') format('truetype'),
        url('/Fonts/Mansfield-Black.otf') format('opentype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Mansfield Regular';
    src: url('/Fonts/Mansfield-Regular.ttf') format('truetype'),
        url('/Fonts/Mansfield-Regular.otf') format('opentype');
    font-weight: 600;
    font-style: normal;
}

/* OTROS ESTILOS */
.bye-web {
    display: none;
}

.bye-responsive {
    display: block;
}

/* NAV */
.navweb {
    width: 100%;
    background-color: #e9552d;
    display: block;
    position: fixed;
    z-index: 999;
}

.navresponsive {
    display: none;
}

.lista {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5%;
}

.lista a {
    text-decoration: none;
    color: white;
}

.dropdown-item:hover {
    background-color: #e9552d;
    color: white !important;
    border-radius: 10px;
}

.desplegable {
    display: none;
}

.menu-desplegable {
    display: none;
}

.tienda {
    background-color: #79ae45;
    border-radius: 4vh;
    border: 2px solid white;
}

.tienda:hover {
    animation: carrito 1s;
}

.circulo {
    background-color: white;
    border-radius: 100%;
}

.nav-icons {
    width: 100%;
    margin: 0;
    padding: 0;
}

/* SLIDER */
.carousel-indicators [data-bs-target] {
    width: 1vh;
    height: 1vh;
    border-radius: 100%;
    transition: none;
    opacity: 1;
}

.carousel-indicators [data-bs-target].active {
    background-color: #e9552d;
}

.carousel-indicators {
    margin-left: 0;
    margin-right: 0;
}

.carousel-control-next,
.carousel-control-prev {
    top: 50%;
    height: 0;
    opacity: 1;
}

.carousel-control-next,
.carousel-control-prev {
    opacity: 1;
}

.posicion-ofertas {
    position: absolute;
    right: 0;
    bottom: 5%;
    left: 0;
    z-index: 2;
    display: flex;
    justify-content: center;
    padding: 0;
    margin: 0;
}

.btn-ofertas {
    background-color: #e9552d;
    border-radius: 4vh;
    width: fit-content;
    display: flex;
    padding-left: 2vw;
    padding-right: 2vw;
    padding-top: .5vh;
    padding-bottom: .7vh;
}

.btn-ofertas p {
    color: white;
    margin: 0;
    margin-left: 4px;
    margin-right: 4px;
}

.btn-ofertas img {
    width: 2.5rem;
    margin: 0;
    padding: 1vh;
}

.btn-position {
    position: fixed;
    width: 100%;
    height: 100vh;
}

.btn-wha {
    position: fixed;
    width: 10vh;
    height: 10vh;
    bottom: 1vw;
    right: 1vw;
    background-color: #79ae45;
    border-radius: 100%;
    border: 2px solid white;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999;
    padding: 2vh;
}

.containe-social {
    display: block;
    width: 10vw;
    border-radius: 4vh;
    border: 2px solid white;
    background-color: #79ae45;
}

.social-media {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5%;
    padding-left: 10%;
    padding-right: 10%;
}

.carousel-control-prev-icon {
    border-radius: 100%;
    background: white url("/images/Logos-Icons/flecha-pequena-izquierda.svg") center center/contain no-repeat;
    z-index: 3;
}

.carousel-control-prev-icon:hover {
    background: #e9552d url("/images/Logos-Icons/flecha-pequena-izquierda-blanco.svg") center center/contain no-repeat;
}

.carousel-control-next-icon {
    border-radius: 100%;
    background: white url("/images/Logos-Icons/flecha-pequena-derecha.svg") center center/contain no-repeat;
    z-index: 3;
}

.carousel-control-next-icon:hover {
    background: #e9552d url("/images/Logos-Icons/flecha-pequena-derecha-blanco.svg") center center/contain no-repeat;
}

/* BODY */
.tittle {
    text-align: center;
    color: #e9552d;
    margin-top: 2.5%;
    margin-bottom: 2.5%;
}

.hojita {
    background: url('/images/Logos-Icons/hojademerco.png') center center/contain no-repeat;
    display: inline-block;
    width: 2rem;
    height: 2rem;
    margin-left: 1vw;
    margin-right: 1vw;
}

#body-fondo {
    background: url('/images/Index/Patron.png') center center/cover no-repeat;
    width: 100%;
    height: max-content;
}

/* OFERTAS */
.carousel-indicators .Ofertas-slide.active {
    background-color: #79ae45;
}

.ofertas-img-slider img {
    border-radius: 5vh;
    height: 50vh;
}

.ofertas-img img {
    border-radius: 3vh;
    margin-top: 5%;
}

/* GARANTÍAS */
.garantias-img {
    width: 50%;
    position: relative;
    top: 50%;
}

.garantias-container {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 55vh;
    text-align: center;
    color: black;
    background-color: #efefef;
    border-radius: 4vh;
    margin-bottom: 7.5%;
    padding: 10%;
    transition: .5s;
}

.garantias-container p {
    height: 15vh;
}

.azul:hover {
    background-color: #62a6da;
    color: white;
}

.azul:hover h2 {
    transition: 1s;
    color: white !important;
}

.verde:hover {
    background-color: #398943;
    color: white;
}

.verde:hover h2 {
    transition: 1s;
    color: white !important;
}

.naranja:hover {
    background-color: #ecad35;
    color: white;
}

.naranja:hover h2 {
    transition: 1s;
    color: white !important;
}

.rojo:hover {
    background-color: #d34529;
    color: white;
}

.rojo:hover h2 {
    transition: 1s;
    color: white !important;
}

/* SUCURSALES */
.container-sucursales {
    background-color: #eaeaea;
    border-radius: 4vh;
    text-align: center;
    padding: 1%;
}

.container-sucursales select {
    border: none;
    border-radius: 4vh;
    margin: 0;
    padding: 1vh;
    font-size: 2vh;
    width: 100%;
    text-align: center;
}

.container-sucursales input {
    border-radius: 4vh;
    border: none;
    padding: 1vh;
    background-color: #bababa;
    color: white;
    width: 80%;
}

#sucursal-iframe iframe {
    width: 100%;
    height: 50vh;
    border-radius: 4vh;
    margin-top: 1%;
    margin-bottom: 5%;
}

/* MERCO QUEREMOS ESCUCHARTE */
.merco-escucharte {
    background: url('/images/Index/fondo-escucharte.png') center center/cover no-repeat;
    width: 100%;
    height: 50vh;
    color: white;
    text-align: center;
}

.merco-escucharte h5 {
    font-size: 4vh;
}

.merco-escucharte h1 {
    font-size: 12vh;
    font-style: italic;
}

.pepito-tienda {
    background: url('/images/Index/pepito-tienda.png') center center/cover no-repeat;
    width: 100%;
    height: 50vh;
}

.merco-naranja {
    background: url('/images/Index/fondo-naranja.png') center center/cover no-repeat;
    width: 100%;
    height: 74vh;
    color: white;
    padding: 3vh;
}

.merco-naranja h1 {
    font-size: 3vh;
}

.merco-naranja p {
    font-size: 1.5vh;
}

.pepito-dentro {
    background: url('/images/Index/pepito-dentro.png') center center/cover no-repeat;
    width: 101%;
    height: 74vh;
}

.hoja-blanca {
    background: url('/images/Logos-Icons/hoja-blanca.png') center center/contain no-repeat;
    display: inline-block;
    width: 8rem;
    height: 5rem;
}

/* Contenedor principal */
.merco-escucharte {
    background: url('/images/Index/fondo-escucharte.png') center center / cover no-repeat;
    width: 100%;
    min-height: 50vh;
    /* Ajusta la altura mínima para evitar amontonamiento */
    color: white;
    text-align: center;
    padding: 2rem;
    /* Espaciado interno */
}

/* Ajustes para texto */
.merco-escucharte h5 {
    font-size: 4vh;
}

.merco-escucharte h1 {
    font-size: 6vh;
    font-style: italic;
}

/* Botones */
.btn-wha-escu,
.btn-mess-escu {
    font-size: 1.2rem;
    /* Tamaño de fuente más uniforme */
    border: 1px solid white;
    border-radius: 4vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #57bb70;
    /* Whatsapp */
    color: white;
    padding: .75rem;
    margin: 0 auto;
    width: 100%;
    /* Ancho completo para pantallas pequeñas */
}

.btn-mess-escu {
    background-color: #4994ec;
    /* Messenger */
}

.btn-wha-escu span,
.btn-mess-escu span {
    background-size: contain;
    display: inline-block;
    width: 2.5rem;
    height: 2.5rem;
    margin-right: 0.5rem;
}

.btn-wha-escu span {
    background-image: url('/images/Logos-Icons/whatsapp.svg');
}

/* Fondo específico para el icono de Messenger */
.btn-mess-escu span {
    background-image: url('/images/Logos-Icons/facebook-messenger.svg');
}

.pasos {
    padding-left: 5vh;
    padding-right: 5vh;
}

.pasos h1 {
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-weight: 900;
    font-style: normal;
}

.pasos p {
    font-size: 1.8vh;
}

.hagamos-suceda button {
    border: none;
    border-top-left-radius: 4vh;
    border-bottom-left-radius: 4vh;
    background-color: #79ae45;
    color: white;
    padding-left: 1vw;
}

/* SÉ EL PRIMERO */
#seelprimero {
    background: url('/images/Index/fondo-seelprimero.jpg') center center/cover no-repeat;
    width: 100%;
    height: 100%;
    text-align: center;
    color: white;
}

.forms-seelprimero {
    padding: 10%;
}

.forms-seelprimero input,
select {
    width: 100%;
    padding: 1vh;
    padding-left: 2vh;
    border: none;
    border-radius: 4vh;
    margin-bottom: 2vh;
}

.btn-suscribirme {
    background-color: white;
    border-radius: 4vh;
    display: flex;
    text-align: center;
    width: fit-content;
    padding: 0.5vh;
}

.btn-suscribirme p {
    color: #79ae45;
    margin: 0;
    margin-left: 4px;
    margin-right: 4px;
}

.btn-suscribirme img {
    width: 2rem;
    margin: 0;
    padding: .5vh;
}

/* FOOTER */
#fondo-footer {
    background: url('/images/Logos-Icons/fondo-footer.jpg') center center/cover no-repeat;
    width: 100%;
    /* height: 100%; el footer se hizo bn grande en algunas vistas loko */
    color: white;
}

#fondo-footer a,
.navbar li {
    color: white;
    text-decoration: none;
    list-style: none;
}

#fondo-footer li {
    text-decoration: none;
    list-style: none;
}

.final-footer {
    background-color: #79ae45;
    color: white;
    padding: 1vh;
    text-align: center;
}

.fondo-patron {
    background: url('/images/Index/fondo-web.webp') center center/cover no-repeat;
    width: 100%;
    height: max-content;
}

@media only screen and (max-width: 992px) {

    .bye-web {
        display: block;
    }

    .bye-responsive {
        display: none;
    }

    .btn-ofertas img {
        width: 3rem;
    }

    /* NAV */
    .navresponsive {
        width: 100%;
        background-color: #e9552d;
        display: block;
        position: fixed;
        z-index: 999;
    }

    .nav-icons,
    .logo-merco {
        width: 50%;
    }

    .box-carrito {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .navweb {
        display: none !important;
    }

    .desplegable {
        display: block;
        width: 100%;
        height: 100vh;
        position: fixed;
        background-color: black;
        left: -100%;
        transition: 1s;
        z-index: 9999;
    }

    .lista-menu-desplegable {
        display: block;
        position: fixed;
        transition: 1s;
        z-index: 9999;
        overflow: auto;
        width: 100%;
        height: 100%;
    }

    .lista-menu-desplegable a {
        text-decoration: none;
        color: white;
    }

    .desplegable-on {
        left: 0;
    }

    .box-carrito {
        background-color: #79ae45;
        border-radius: 25%;
        border: none;
    }

    .cruz {
        width: 100%;
        margin: 0;
        padding: 1vh;
        transform: rotate(0deg);
    }

    .cruz-rotate-on {
        animation: rotate-on 1s ease-in-out forwards;
    }

    @keyframes rotate-on {
        0% {
            transform: rotate(0deg);
        }

        100% {
            transform: rotate(360deg);

        }
    }

    .cruz-rotate-off {
        animation: rotate-off 1s ease-in-out forwards;
    }

    @keyframes rotate-off {
        0% {
            transform: rotate(360deg);
        }

        100% {
            transform: rotate(0deg);

        }
    }

    /* SLIDER */
    .carousel-indicators [data-bs-target] {
        width: 1.5vh;
        height: 1.5vh;
    }

    .containe-social {
        display: none;
    }

    .btn-wha {
        width: 70%;
    }

    .carousel-control-prev-icon {
        background: #e9552d url("/images/Logos-Icons/flecha-pequena-izquierda-blanco.svg") center center/contain no-repeat;
    }

    .carousel-control-next-icon {
        background: #e9552d url("/images/Logos-Icons/flecha-pequena-derecha-blanco.svg") center center/contain no-repeat;
    }

    /* OFERTAS */
    .ofertas-img-slider img {
        padding-left: 2.5%;
        padding-right: 2.5%;
        border-radius: 4vh;
        height: 20vh;
    }

    .ofertas-img img {
        padding-left: 2.5%;
        padding-right: 2.5%;
        border-radius: 4vh;
        height: 20vh;
    }

    /* SUCURSALES */
    .container-sucursales-padre {
        padding: 5px;
    }

    .container-sucursales {
        padding: 5%;
    }

    .container-sucursales select {
        margin-bottom: 1.5vh;
    }

    /* GARANTÍAS */
    .garantias-img {
        width: 45%;
        top: 0;
    }

    .garantias-container {
        width: 80%;
    }

    .garantias-container p {
        height: auto;
        font-size: 1.5rem;
    }

    .carousel-control-prev-icon {
        z-index: 3;
    }

    .carousel-control-next-icon {
        z-index: 3;
    }

    /* MERCO QUEREMOS ESCUCHARTE */
    .merco-escucharte {
        padding: 5%;
        border-radius: 4vh;
        margin-top: 2.5%;
        margin-bottom: 2.5%;
    }

    .merco-escucharte h5 {
        font-size: 2vh;
    }

    .merco-escucharte h1 {
        font-size: 5vh;
    }

    .hoja-blanca {
        width: 5rem;
        height: 2rem;
    }

    .merco-naranja {
        padding: 5%;
        height: auto;
        border-radius: 4vh;
        margin-top: 2.5%;
        margin-bottom: 2.5%;
    }

    .btn:hover {
        background-color: #ff3c01e6;
        font-weight: bold;
    }

    .btn:hover p,
    .btn:hover span {
        font-weight: bold;
    }

    .btn-wha-escu {
        font-size: x-large;
        margin-top: 1vh;
        margin-bottom: 1vh;
    }

    .btn-wha-escu span {
        width: 3rem;
        height: 3rem;
    }

    .btn-mess-escu {
        font-size: x-large;
        margin-top: 1vh;
        margin-bottom: 1vh;
    }

    .btn-mess-escu span {
        width: 3rem;
        height: 3rem;
    }

    .btn-mess-escu,
    .btn-wha-escu {
        height: 80%;
    }
}

@media only screen and (max-width: 576px) {
    .garantias-img {
        width: 40%;
        top: 0;
    }

    .garantias-container {
        height: 25em;
    }
}

@media (max-width: 375px) {
    .merco-escucharte {
        min-height: 70vh;
    }
}

@media (max-width: 768px) {
    .garantias-img {
        width: 40%;
    }

    .garantias-container p {
        font-size: 2vh;
    }

    .navweb {
        display: none !important;
    }
}

@media (max-width: 767px) {
    .fondo-patron {
        background: url('/images/Index/fondo-mobile.webp') center center/cover no-repeat;
        width: 100%;
        height: max-content;
    }
}

.mobile {
    display: none;
}

.web {
    display: block;
}

@media (max-width: 991.98px) {
    .mobile {
        display: block;
    }

    .web {
        display: none;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .w-md-75 {
        width: 75% !important;
    }
}

/* Asegura que la página ocupe al menos toda la altura del viewport */
.wrapper {
    display: flex;
    flex-direction: column;
    /* Organiza elementos en columna */
    min-height: 100vh;
    /* Ocupa al menos toda la altura del viewport */
}

/* El contenido principal ocupa todo el espacio disponible */
main {
    flex: 1;
    /* Ocupa el espacio restante */
}

/* Footer siempre al final */
.footer-general {
    background-color: #f1f1f1;
    /* Ejemplo de color de fondo */
    padding: 0;
    /* Espaciado interno */
    text-align: center;
    /* Alineación centrada del texto */
}

.navweb {
    height: 100px;
    /* Ajusta la altura */
    display: flex;
    align-items: center;
    /* Centra los elementos verticalmente */
    justify-content: center;
    /* Distribuye el contenido */
    padding: 0 20px;
    /* Espacio lateral */
    box-sizing: border-box;
    /* Asegura que padding no altere el tamaño */
}

/* CONTENEDOR DE LOS ELEMENTOS INTERNOS DEL NAV */
.navweb .nav-container {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    justify-content: space-between;
}

.font-extra-bold {
    font-family: 'Mansfield Extra Bold';
}

.font-bold {
    font-family: 'Mansfield Bold';
}

.font-medium {
    font-family: 'Mansfield Medium';
}

.font-light {
    font-family: 'Mansfield Light';
}

.fondo-naranja-merco {
    background-color: #E64A19;
}

.naranja-merco {
    color: #E64A19;
}

.fondo-verde-merco {
    background-color: #4CAF50;
}

.verde-merco {
    color: #4CAF50;
}

::placeholder {
    font-family: 'Mansfield Light';
    font-weight: 300;
    color: #6c757d;
}

.slider-image {
    max-width: 100%;
    /* Asegura que la imagen no se desborde horizontalmente */
    height: auto;
    /* Permite que la altura se ajuste automáticamente */
    display: block;
    /* Evita el comportamiento inline por defecto */
    margin: 0 auto;
    /* Centra la imagen si es necesario */
    position: relative;
    /* Posicionamiento relativo para evitar problemas con otros elementos */
}

#avisoprivacidad h1 {
    font-size: 4.5vw;
    color: #f84512;
    font-family: 'Mansfield Extra Bold';
}

#avisoprivacidad{
    margin-top: 10vh;
}

.lineagris {
    width: 100%;
    background-color: #969696;
    height: 3px;
}

    hr {
      margin: 40px 0;
      border: none;
      border-top: 2px solid #eee;
    }
    table {
      width: 50%;
      border-collapse: collapse;
      margin-top: 15px;
      text-align:center;
    }
    table th, table td {
      border: 1px solid #ccc;
      padding: 8px 12px;
      text-align: left;
    }
    table th {
      background-color: #f2f2f2;
    }
    .image-placeholder {
      text-align: center;
      margin: 30px 0;
    }
    .image-placeholder img {
      max-width: 100%;
      height: auto;
      border: 1px solid #ddd;
      border-radius: 4px;
    }
    .highlight-section {
      background-color: #fcfcfc;
      padding: 20px;
      border-left: 5px solid #c00;
      margin: 30px 0;
    }
    a {
      color: #0056b3;
      text-decoration: none;
    }
    a:hover {
      text-decoration: underline;
    }
    
    .centered-table {
  margin-left: auto;
  margin-right: auto;
  border-collapse: collapse;
  margin-bottom:4vh;
}

    @media (max-width: 768px) {
        table {
          width: 100%;
          border-collapse: collapse;
          margin-top: 15px;
        }
    }

.nav-link-responsive:hover{
    color: #E64A19;
}