:root {
  --primary-color: #00FF00;
}

/* HEADER */
.navbar .container-fluid .navbar-brand img{width: 220px;}
.navbar .container-fluid .navbar-brand{ margin-left: 9%;}
#optionsShop .nav-item .nav-link img {max-height: 105px;max-width: 105px;height: auto;width: auto;}
.w-fit-content{width: fit-content;}
.bg-secondary-page{background-color: #545454!important;color: white!important;}
.bg-tertiary-page{background-color: #dddddd!important;color: white!important;}
.bg-quaternary-page{background-color: #dfe2e7!important;color: white!important;}
input.bg-secondary-page::placeholder {color: white; }
.text-secondary-page{color: #545454!important;}
.container-detail-blog img{max-height: 500px;border: 0;vertical-align: middle;margin: auto;width: auto;}
#optionsShopLlantas .card-body{min-width: 300px;}
#optionsShopRepuestos .card-body{min-width: 250px;}
@media (max-width: 900px){
    .navbar .container-fluid .navbar-brand img{width: 115px;}
    .navbar .container-fluid .navbar-brand{ margin-left: 0;}
    #optionsShop .nav-item .nav-link img {height: 62px;width: 62px;}
    #optionsShop .nav-item a {font-size: 0.9rem;}
    /* #optionsShop ul {gap: 0!important;} */
}

@media (max-width: 700px){
    #optionsShop .nav-item .nav-link img {height: 45px;width: 45px;}
    #optionsShop .nav-item a {font-size: 0.7rem;}
    #optionsShop ul {gap: 5px!important;}
}

@media (max-width: 400px){
    #optionsShop .nav-item .nav-link img {height: 40px;width: 40px;}
    #optionsShop .nav-item a {font-size: 0.6rem;}
    #optionsShop ul {gap: 4px!important;}
}

.navbar i span{font-size: 0.6rem;}
.navIndicators2 .dropdown-toggle::after{color: white;}
.navIndicators2 .dropdown-item:focus, .navIndicators2 .dropdown-item:hover{background-color: rgb(26, 25, 25)!important;}
.cardsPreviewProduct img{ height: 150px;}
.cardsPreviewProduct { width: 30%;}
.cardsPreviewProduct h6{ font-size: 0.8rem;text-align: center;}
.cardsPreviewProduct p{ font-size: 0.7rem;text-align: center;}
.containerProd{display: flex;flex-direction: column; align-items: stretch;}
.containerProdHover{display: flex;flex-direction: column;height: 100%; }
.cursor-pointer{cursor: pointer;}
footer img {width: 60px;}
.g_id_signin{width: 100%;}

/* GERENALES */
.hoverOpacity:hover {opacity: 0.7;}
.hoverZoomOut:hover { transform: scale(1.02);}
.hoverZoomOut { transition: transform 0.5s ease;}
.hoverStandOut:hover {box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;}
.hoverBgGrey:hover {background-color: #f5f5f5!important;}
.hoverBgDark:hover {background-color: #d6d6d6!important;}
.hoverQuaternary:hover {background-color: #d6d9dd!important;}
.hoverBorderLeft:hover {border-left: 5px solid var(--primary-color);}
.hoverBorderLeftDark:hover {border-left: 5px solid #d6d6d6;}
.bg-grey-general {background-color: #f5f5f5!important;}
.lineH {height: 0.08rem;}

/* TIENDA */
.shop-products-name{font-size: 0.9rem;}
.shop-item-code{font-size: 0.9rem;}


/* DETALLE PRODUCTO */
#carouselEquivalents img {width: 200px;}
#container-products img{width: 70px;}

/* MARCAS ALIADAS */
.glideAllianceMark img{height: 50px;}
@media (max-width: 800px){
    .glideAllianceMark img{height: 30px;}
}

@media (max-width: 800px){
    .glideAllianceMark .glide__arrow--right{display: none;}
    .glideAllianceMark .glide__arrow--left{display: none;}
}

/* TIMELINE CARRITO */
.timeline-cart {display: flex; gap: 30px;align-items: center;justify-content: center;padding: 30px;}
.timeline-cart .line-timeline-h {width: 150px;height: 3px;background-color: #ccc;border-radius: 3px;}
.timeline-cart .step-timeline-h {display: flex; align-items: center;flex-direction: column;}
.timeline-cart .step-timeline-h i {padding: 9px;background-color: #f4f4f4;border-radius: 50%;color: #afafaf;border: 1px solid #ededed}
.timeline-cart .step-timeline-h span {color: #afafaf;}
.timeline-cart .active i{background-color: var(--primary-color);color: white;}
.timeline-cart .active span{font-weight: 600;color: #969696;}
.timeline-cart span.active {background-color: var(--primary-color);}

#formSearchGeneral {width: 280px;}
.searchPredictions{position: absolute;z-index: 300;border-radius: 5px;background-color: white;box-shadow: 0 20px 27px 0 rgb(0 0 0 / 5%);padding: 10px;font-size: 13px;max-height: 300px;overflow: scroll;flex-direction: column;overflow-x: hidden;width: 280px;}
.searchPrediction:hover{background: lightgray;}
.searchPrediction{border-bottom: solid 1px lightgray; cursor: pointer}


/* CONTACTO */
.contact-section .contact__pse .contact__pse-img {max-width: 90px;}
.points-sale-section .nav-item .active { font-weight: 700; }

/* FONTS PERSONALIZADO */
.fs-l{font-size: large;}
.fs-xl{font-size: larger;}
.fs-m{font-size: medium;}
.fs-s{font-size: small;}
.fs-sm{font-size: smaller;}

/* INFO COMPAÑÍA */
.sectionInfoCompany img { max-width: 50px; min-width: 30px;}


.search-container { top: 12%; display: flex; background-color: #989898; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); transition: width 0.3s ease-in-out; width: 70px; overflow: hidden;z-index: 1000; position: relative;}
.search-icon {cursor: pointer;transition: transform 0.3s ease;padding-top: 11px;padding-bottom: 11px;font-size: 1.3rem;}
.search-input { border: none; outline: none; font-size: 16px; padding: 5px; flex: 1; width: 0; transition: width 0.3s ease-in-out;background-color: #989898;}
.expanded { width: 270px !important;}
/* .expanded .search-input {width: 150px;} */
.searchPredictionsMobile { top: calc(12% + 34px); width: 270px; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); display: none; flex-direction: column; 
    max-height: 300px; border-radius: 5px; overflow-y: auto; z-index: 1001; background-color: #989898;}
.searchPredictionsMobile p {font-size: 10px!important}
.searchPredictionsMobile h6 {font-size: 13px!important}


/* Spinner */
/* HTML: <div class="loader"></div> */
.loaderSpinner {
  width: 50px;
  padding: 8px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--primary-color);
  --_m: 
    conic-gradient(#0000 10%,#000),
    linear-gradient(#000 0 0) content-box;
  -webkit-mask: var(--_m);
          mask: var(--_m);
  -webkit-mask-composite: source-out;
          mask-composite: subtract;
  animation: loaderSpinner 1s infinite linear;
}
@keyframes loaderSpinner {to{transform: rotate(1turn)}}