/*** agrega aqui los estilos necesarios para modificar el template ***/

.bs-grid-header__cart, .bs-grid-header__login {
    color: #0c2a2b;
}

.bs-grid-header__cart:hover, .bs-grid-header__login:hover {
    color: #2a4e1c;
}


/*** suscripcion ***/

.bs-footer__section-form__container {
    background: var(--secondary-color);
}

.bs-footer__section-form {
    background-color: #592533;
}

.bs-footer__section-form .btn:hover {
    color: #000000;
}



/**********************
    Banners
***********************/

.bs-banner{
    position:relative;
    margin-bottom:2rem;
    
}
.bs-banner .bs-img-square picture  {
    border-radius: var(--product-border-radius);
}

.bs-banner__title{
    transition:all .5s ease;
    position:absolute;
    font-size: 2rem;
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    color: var(--banner-hover-txt-color);
    font-weight: var(--font-light);
    text-align:center;
}
.bs-banner:hover .bs-banner__title{
    opacity:1;
}
@media screen and (min-width:111px){
.bs-banner__title{
    opacity:1;
    background: #0000004f;    
}  
}
@media screen and (min-width:320px){
.bs-banner__title{
    opacity:1;
    background: #0000004f;    
}  
}
@media screen and (min-width:576px) {
.bs-banner__title{
    opacity:1;
    background: #0000004f;    
}  
}

@media screen and (min-width:768px) {
.bs-banner__title{
    opacity:0;
    background: var(--banner-hover-bg-color);    
}
}
@media screen and (min-width:992px) {
.bs-banner__title{
    opacity:0;
    background: var(--banner-hover-bg-color);    
}
}
@media screen and (min-width:1200px) {
.bs-banner__title{
    opacity:0;
    background: var(--banner-hover-bg-color);    
}
}
/* media queries */ 

@media screen and (min-width:576px){
   
    
}
@media screen and (min-width:768px){

    .bs-footer__social .btn-social,
    .bs-footer__social .chat-facebook,
    .bs-footer__social .chat-whatsapp{
       font-size:1.5rem;
   } 
    .bs-footer__section:first-child{
        border-right: 1px solid rgba(0,0,0,0.2);
    }
    .bs-footer__section:not(:last-child){
        text-align:left;
        padding-bottom:1rem;
    }
    .bs-footer__social .chat-whatsapp, .chat-facebook{
        position:fixed;
        z-index:5000;
        right:1em;
        border:0;
    }
    .bs-footer__social .chat-whatsapp{
        background: var(--chat-whatsapp-bg-color);
        color: var(--chat-whatsapp-txt-color);
    }
    .bs-footer__social .chat-whatsapp{
        background: var(--chat-whatsapp-hover-bg-color);
        color: var(--chat-whatsapp-hover-txt-color);
    }
    .bs-footer__social .chat-facebook{
        background: var(--chat-facebook-bg-color);
        color: var(--chat-facebook-txt-color);
    }
    .bs-footer__social .chat-facebook:hover{
        background: var(--chat-facebook-hover-bg-color);
        color: var(--chat-facebook-hover-txt-color);
    }
    .bs-footer__social .chat-whatsapp,
    .bs-footer__social .chat-facebook{
        font-size:1.5rem;
    }
    .chat-whatsapp{
        bottom:200px;
        
    }
    .chat-facebook{
        bottom:150px
    }
    
    .bs-article-title::before,
    .bs-article-title::after,
    .bs-home-title::before,
    .bs-home-title::after{
    max-width:100px;
    min-width:40px;
    }
}
@media screen and (min-width:992px){
    
}
@media screen and (min-width:1200px){
    
}

.navbar-collapse.collapse.show .btn-close {
    color: #000000;
}

.btn-primary:disabled {
  color:#fff;
  background-color:#484848;
  border-color:#484848;
  }

  button[title="agregar al carro" i] {
  display: none;
}

.dd-nnoonnee {
  display: none;
}

.bs-footer__logo {
    display: flex;
    justify-content: center; /* centra horizontalmente */
    align-items: center; /* centra verticalmente si tiene altura fija */
}

.bs-footer__logo img {
    width: 66%;
    height: auto; /* evita deformación */
    margin-top: 20px;
    max-width: 310px;
}

/* Versión móvil */
@media (max-width: 768px) {
    .bs-footer__logo img {
        max-width: 112px; /* tamaño más pequeño en pantallas chicas */
        margin-top: 10px;
    }
}

.bs-footer__social {
    padding: 44px;
}

.jumbotron {
    background-color: #c4a35a3d;
}