.navbar.navbar-bg-color-secundario, #mobileMenu {
    background: var(--color-primario) !important;
}

.navbar-brand img {
    width: 135px;
}

.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
    color: var(--color-secundario);
}

.badge-cart, .badge-login {
    background-color: var(--color-secundario) !important;
    color: var(--color-primario) !important;
}

#divBarraSuperior .p-seguinos, #divBarraSuperior .follow-link {
    color: #000000;
    line-height: 0;
}

@media (min-width: 992px) {
    .navbar-expand-lg[class*=navbar-bg-]:not(.fancy):not(.extended):not(.fixed) .navbar-collapse .nav-link {
        padding-top: 1rem;
        padding-bottom: 1rem;
    }
}

#offcanvas-search {
    background-color: #ffffff;
}

#txtBuscarShop, #txtBuscarShop::placeholder {
    color: var(--color-primario) !important;
}

.footer-titulo {
    color: var(--color-secundario);
}

.footer-coredevs {
    color: var(--color-secundario) !important;
}

.bg-dark.text-inverse a:not(.btn):not([class*=link-]):hover, .bg-navy.text-inverse a:not(.btn):not([class*=link-]):hover, .text-inverse a:not(.btn):hover, [class*=offcanvas-].text-inverse a:not(.btn):not([class*=link-]):hover {
    color: var(--color-secundario);
}
.text-inverse a:not(.btn):hover {
    border-color: var(--color-secundario);
}

.logo-menu-mobile {
    width: 135px;
}

.display-4{
	font-size: calc(1.305rem + .66vw);
	line-height: 1.2;
}

.btn-primary {
    background-color: var(--color-secundario) !important;
    border-color: var(--color-secundario) !important;
}

.banner-icon {
    color: var(--color-secundario);
}

.btn-secondary, .btn-secondary:hover {
    color: #000000;
}

.titulo-formulario-contacto, .titulo-whatsapp-contacto{
	font-size: calc(1.305rem + .66vw);
    line-height: 1.2;
}

.navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .show>.nav-link {
    color: var(--color-secundario);
}

@media (min-width:1200px){
	.titulo-formulario-contacto, .titulo-whatsapp-contacto{
		font-size: 1.8rem;
	}
}

.follow-link:hover {
    color: var(--color-secundario);
}

.data-fiscal img {
    width: 50px;
    height: auto;
}

.footer-logo {
    width: 150px;
}

.swiper-hero-con-barra, .swiper-hero-con-barra .swiper-slide {
    height: calc(100vw / 2.44);
}

.img-logo-nosotros, .img-logo-contacto {
    width: 215px;
}

@media (max-width: 767.98px){
    .swiper-hero-con-barra, .swiper-hero-con-barra .swiper-slide {
        height: 350px!important;
        height: calc(100vw / 1.84);
    }
}

@media (max-width: 575.98px){
    .swiper-hero-con-barra, .swiper-hero-con-barra .swiper-slide {
        height: 350px!important;
        height: calc(100vw / 1.84);
    }
}

.div-buscar-header .container {
    padding-top: 0.5rem!important;
    padding-bottom: 0.5rem!important;
}

[id^="divBloque"] .display-4, [id^="divBloque"] .display-5, [id^="divBloque"] .display-6 {
    line-height: 1.3;
    background-image: linear-gradient(to right, #fdaf18 18%, #fdaf18 69%);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
}

.link-dark:hover, .text-reset a:hover, a.text-reset:hover {
    color: var(--color-secundario) !important;
}

.breadcrumb-item a:hover {
    color: var(--color-secundario);
}

.btn-increment, .btn-decrement {
    border: 1px solid var(--color-secundario) !important;
    color: var(--color-secundario) !important;
}

.alert-custom .alert-link {
    color: var(--color-secundario);
}

.accordion-wrapper .card-header button {
    color: var(--color-secundario);
}

.btn-increment, .btn-decrement, #Checkout .btn-increment, #Checkout .btn-decrement {
    border: 1px solid var(--color-secundario) !important;
    color: var(--color-secundario) !important;
    font-weight: 400;
    font-size: 20px !important;
}

.form-check-input:checked {
    background-color: var(--color-secundario);
    border-color: var(--color-secundario);
}

#Checkout .checkout-check .form-check-label.btn:hover {
    border-color: var(--color-secundario);
}

#Checkout .checkout-check .form-check-label.btn.active {
    border-color: var(--color-secundario);
    color: var(--color-secundario);
}

.checkout-quantity-badge {
    background-color: var(--color-secundario);
}primary {
    --bs-text-opacity: 1;
    color: var(--color-secundario) !important;
}

#divPortadas .bg-color-secundario {
    background-color: var(--color-primario) !important;
}

.swiper-hero-con-barra, .swiper-hero-con-barra .swiper-slide {
    height: calc(100vh - 113px) !important;
}

.btn-close:before {
    background: rgb(253 175 24 / 40%);
}

.btn-close:hover::before {
    background: rgb(253 175 24);
}

.swiper-controls .swiper-pagination .swiper-pagination-bullet {
    background: var(--color-secundario);
}

.swiper-controls .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    border-color: var(--color-secundario);
}

.swiper-container.dots-over .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    border-color: var(--color-secundario);
}

.swiper-container.dots-over .swiper-pagination .swiper-pagination-bullet {
    background: var(--color-secundario);
}



/***********************************/
/************ DARK MODE ************/
/***********************************/

body {
    background:#000000;
    color: #ffffff;
}

.bg-gray, .bg-light, .bg-white {
    background-color: var(--color-primario) !important;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    color: #a5a9ac;
}

.price ins {
    color: var(--color-secundario) !important;
}

.link-dark {
    color: #ffffff;
}

.btn-primary, .btn-primary:hover, .btn-primary i {
    color: var(--color-primario) !important;
}

.breadcrumb-item+.breadcrumb-item::before {
    color: var(--color-secundario) !important;
}

.number-picker .input-group input {
    color: #ffffff;
}

.text-primary {
    color: #a5a9ac !important;
}

.swiper-container.nav-color .swiper-button, .swiper-container.nav-color .swiper-slide figure .item-link, .swiper-container.nav-color .swiper-button.swiper-button-disabled, .swiper-container.nav-color .swiper-slide figure .item-link.swiper-button-disabled {
    background: var(--color-secundario) !important;
}

.swiper-container.nav-color .swiper-button:hover, .swiper-container.nav-color .swiper-slide figure .item-link:hover {
    background: var(--color-secundario) !important;
}

.swiper-container.nav-color .swiper-button.swiper-button-disabled, .swiper-container.nav-color .swiper-slide figure .item-link.swiper-button-disabled {
    background: var(--color-secundario) !important;;
}

.accordion-wrapper .card-header button.collapsed {
    color: var(--color-primario) !important;
}

#divBloquePuntosdeVenta {
    color: var(--color-primario) !important;
}

.navbar-expand-lg .navbar-collapse .dropdown-menu .dropdown-item:hover {
    color: var(--color-secundario);
}

.ver-mas {
    color: var(--color-secundario) !important;
}

#carritoMenu .text-white, #carritoMenu p {
    color: #ffffff !important;
}

#carritoMenu, #favoritosMenu {
    background: #000000;
}

#carritoMenu .btn i {
    color: #ffffff;
}

#carritoMenu i:not(.btn i), #favoritosMenu i {
    color: #000000 !important;
}

#carritoMenu .btn-secondary {
    background-color: var(--color-primario) !important;
    border-color: var(--color-primario) !important;
}

#carritoMenu .btn-secondary, .btn-secondary:hover {
    color: #ffffff;
}

.link-light, .variante-light {
    color: #ffffff;
}

.link-light:focus, .link-light:hover {
    color: var(--color-secundario);
}

.offcanvas {
    color: #ffffff;
}

#carritoMenu .btn-secondary {
    background-color: #a5a9ac !important;
    border-color: #a5a9ac !important;
    color: var(--color-primario) !important;
}

#carritoMenu .btn-secondary i {
    color: var(--color-primario) !important;
}

#divBanners {
    background-color: #000000 !important;
}

.alert-icon i {
    color: var(--color-secundario);
}

#divResumenPedido .card-header i, #divResumenPedido .card-header h3, #divResumenPedido .link-dark, #divResumenPedido .number-picker .input-group input {
    color: var(--color-primario);
}

#btnEditarDatosPersonales, #btnEditarEnvio {
    color: var(--color-primario);
    transition: all .2s ease-in-out;
}

#btnEditarDatosPersonales:hover, #btnEditarEnvio:hover {
    color: var(--color-secundario);
    transition: all .2s ease-in-out;
}

.form-control {
    color: #000000;
}

#Checkout .shopping-cart i:hover {
    color: var(--color-secundario);
}

#resumenProductos i, #resumenProductos i:hover {
    transition: all .2s ease-in-out;
}

#contenidoPago i:not(.form-check-label i) {
    color: var(--color-secundario) !important;
}

#contenidoPago .card-body i.uil-university {
    color: #a5a9ac !important;
}

#contenidoPago .card-body, #Confirmacion .card-body {
    color: #000000;
}

#resumenProductos {
    color: #000000;

}

#contenidoPago .card-body a {
    color: var(--color-secundario);
}

.post-title {
    color: #ffffff;
}

.breadcrumb-item a {
    color: #9b9fa2;
}

.link-body {
    color: #ffffff;
}

.link-body:hover {
    color: var(--color-secundario);
}

.page-item.disabled .page-link {
    color: #636363;
    background-color: #000000;
}

.page-item.active .page-link {
    color: #000000;
    background-color: var(--color-secundario);
}

.page-link {
    background-color: #000000;
    border: 1px solid rgba(164, 174, 198, .2);
    color: var(--color-secundario);
}

.page-link:hover {
    background-color: var(--color-secundario);
}

.image-wrapper {
    color: #000000 !important;
}

.divider.text-white {
    color: #000000 !important;
}

#offcanvas-search {
    background-color: #000000 !important;
}

#txtBuscarShop, #txtBuscarShop::placeholder {
    color: #ffffff !important;
}

.modal-content {
    background-color: #000000 !important;
}

.a-registrate {
    color: var(--color-secundario) !important;
}

.btn-secondary, .btn-secondary:hover {
    color: #000000;
    background-color: #a5a9ac;
    border-color: #a5a9ac;
}

.link-body.active {
    color: var(--color-secundario);
}

footer .accordion-wrapper .card-header button.collapsed {
    color: #a7abae !important;
}

footer .accordion-wrapper .card-header button {
    transition: all .2s ease-in-out;
}

footer .accordion-wrapper .card-header button:hover {
    color: var(--color-secundario) !important;
    transition: all .2s ease-in-out;
}

footer .accordion-wrapper .card-header button:before {
    color: var(--color-secundario);
}