/*

CSS DE CUSTOMIZACIÓN PARA TIENDA DESAFIO

MANUAL DE REFERENCIA CSS NUBIXSTORE
https://cdn.nubixstore.ar/ns_css_manual.txt

PLANTILLA ASIGNADA: CARTZILLA
https://cartzilla.createx.studio/

COLORES UTILIZADOS:

- Primario; #a51f29 ( Rojo Oscuro )
- Secundario: #ffffff ( Blanco )
- Links: #222222 ( Negro )

*/

.btn-primary { background: #a51f29 }
.btn-primary { color: #11334F; border-color: #a51f29 }
.btn-primary:hover { background-color: #EDB5A4; border-color: #11334F }

/* BOTONES */

.btn-outline-accent { color: #11334F; border-color: #11334F }
.btn-outline-accent:hover { background-color: #a51f29 }

/* CARRITO */
#ns-cart .widget-product-title { font-weight:normal}

.navbar-tool-label { background: #EDB5A4!important; }
.steps-dark .step-item.active .step-count,
.steps-dark .step-item.active .step-progress {background-color:#a51f29}

/* CARRITO Y CHECKOUT */

.navbar-tool-label { background: #a51f29!important; }
.steps-dark .step-item.active .step-count,
.steps-dark .step-item.active .step-progress {background-color:#a51f29 }

/* SIDEBAR */
.widget .widget-filter-item a { font-size: 14px; color: #4b566b; }

.widget .widget-filter-item a:hover,
.widget .widget-filter-item a.current { color: #92b8bf; }

/* HEADER - CABECERA DE TIENDA */

.topbar-dark { background-color: #a51f29!important }

.is-mobile .topbar-text { font-size: 10px }
.ns-mobile-logo-store { width: 150px; padding:0;margin:0 }


/* FOOTER */
.bs-afip:hover { color: #ffffff }

footer.bg-dark { background-color: #a51f29!important } /* Primer porción de footer */
footer .bg-darker { background-color: #222222!important } /* Segunda porción de footer */


/* BANNERS */
.ns-banner { padding: 4px!important; margin: 0 }

/* BUSCADOR */
#ns-search-mobile-form,
#ns-search-form { width:inherit }

#ns-search-mobile-form button,
#ns-search-form button { border: 0; background: none; }

.bg-custom,
.bg-gray { background-color: #ebebeb !important}

.ns-cart-select-txt-option {
    font-size: 11px
}

.accordion-button.leaf::after{ display:none }

/*
 PAGE TITLE + BREADCRUMB
 .is-store-item
 */

.breadcrumb-item+.breadcrumb-item::before,
.breadcrumb-item a { color: #666666!important; }

.page-title-overlap { background: none; }
.page-title-overlap h1 { color: #222 }

/* ITEMS LIST */
.ns-item-list .star-rating { margin: 0; padding:0}

/* ITEM VIEW - FICHA PRODUCTO */
.ns-item-title { font-size: 32px }
.is-mobile .ns-item-title { font-size: 26px }

.ns-item-link { color: #92b8bf }
.ns-item-link:hover { color: #11334F }

.ns-item-description { width: 90%; margin:0;padding:0}
.ns-item-description ul { margin-left: 50px }

/* REVIEWS */

#ns-reviews-carousel footer { line-height: 1em }

#ns-reviews-carousel .card-body { min-height:360px }
.is-mobile #ns-reviews-carousel .card-body { min-height:285px }

#ns-reviews-carousel .card-body .btn-primary { position: absolute; bottom: 0}

#ns-reviews-carousel a { color: #4b566b }
#ns-reviews-carousel img { border: 2px solid #e94949; }

/* SECCIONES INSTITUCIONALES */

.ns-section a { color: #92b8bf }
.ns-section a:hover { color: #11334F }

/*
 PLANTILLA COLORES MERCADOLIBRE
*/

.ns-price { color: #111; }
.ns-off-price { color: #a51f29 }

.ns-free-shipping { background-color: #04a752; color: #fff }

.ns-item-list .ns-free-shipping { font-weight:bold; position: relative; float: right; margin-top:-25px!important; margin-bottom: 10px!important;}

.ns-badge-off { font-weight:bold; background: #a51f29; }

#ns-add-to-cart-btn { background: #a51f29; border-color:#e74a49; color: #fff}
#ns-add-to-cart-btn:hover { background: #222; border-color:#222;}

.is-mobile #ns-contact-btn { display:none!important; }


.ns-brand-marquee a:hover img { border-color: #444!important }

/* Desktop Menu */

.is-desktop .navbar-nav li:nth-child(7) .dropdown-menu { margin-left: 0px; }

/* VIDEO BANNERS */

.ns-banner-video-container {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%; /* 16:9 aspect ratio (9/16 = 0.5625) */
    height: 0;
    overflow: hidden;
margin-bottom: 5px;

}

.ns-banner-video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* VIDEO GALLERY */

.ns-banner-video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.ns-item-video-gallery {
        display: flex;
        justify-content: center;  /* Centra horizontalmente */
        align-items: center;      /* Centra verticalmente */
        text-align: center;
}

.ns-item-video-gallery iframe { min-height:500px }

.ns-item-video-container iframe { height: 500px }
.is-mobile .ns-item-video-container iframe { height: 300px }

/**********************************************************
  SLIDE Cartzilla v1 - Julio 2025
  Autor: Martin Carrillo
  Primera versión: 2025-07-29
  Última modificación: 2025-07-29
************************************************************/

.ns-slide {
    padding: 0 !important;
    margin: 0 !important;
}

.ns-slide .ns-slide-item h2 {
    color: #fff !important;
    font-size: 48px !important;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
} /* Título del slide */

.ns-slide .ns-slide-item p {
    color: #fff !important;
    font-size: 36px !important;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
} /* Bajada del slide */

.ns-slide .btn {
    margin-right: 1rem;
    font-size: 24px !important;
    padding: 0.75rem 2rem;
    line-height: 1.2;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
}

/* Mobile scaling */
@media (max-width: 768px) {
    .ns-slide .ns-slide-item h2 {
        font-size: 28px !important;
    }

    .ns-slide .ns-slide-item p {
        font-size: 20px !important;
    }

    .ns-slide .btn {
        font-size: 18px !important;
        padding: 0.5rem 1.5rem;
    }
}

.ns-slide .ns-slide-front-image {
    padding: 5px;
}

.ns-slide-item {
    position: relative;
    height: 700px; /* altura fija del slide */
    max-height: 700px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
}

/* Alturas de slide según dispositivo y posición del cliente */
.is-mobile .ns-slide-item {
    height: 70vh; /* altura para Mobile */
}

.is-mobile.is-home .ns-slide-item {
    height: 280px; /* altura para Mobile en HOME */
}

.is-desktop.is-home .ns-slide-item {
    height: 700px; /* altura para Desktop en HOME */
}

.ns-slide-meta { /* Contenedor de título, bajada y botones */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 2rem;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    pointer-events: none;
}

.ns-slide-meta > div {
    max-width: 42rem;
    pointer-events: all;
}

/* Configuración de colores botón 1 */
.ns-slide .btn.btn-primary {
   background-color: #fff !important;
    color: #2593D1 !important;
    border: 2px solid #fff !important;
}

.ns-slide .btn.btn-primary:hover {
    background-color: #2593D1 !important;
    color: #fff  !important; /* Color principal */
    border-color: #2593D1 !important;
}

/* Configuración de colores botón 2 */
.ns-slide .btn.btn-secondary {
    background-color: #fff !important;
    color: #2593D1 !important;
    border: 2px solid #fff !important;
}

.ns-slide .btn.btn-secondary:hover {
    background-color: #2593D1 !important;
    color: #fff  !important; /* Color principal */
    border-color: #2593D1 !important;
}

/************** FIN SLIDE CSS ************************/
