.topbar{
	background-color: var(--topbar-footer);
}
#navbar .nav-item .nav-link.active::after,
#navbar .nav-item .nav-link:is(:hover)::after{
	background-color: var(--botones)!important;
}
.btn-outline-gris:is(:hover, :focus){
	background-color: var(--botones)!important;
}
.btn-color{
	background-color: var(--botones)!important;
}
.btn-color:is(:hover,:focus,:active){
	background-color: var(--botones-hover)!important;
}
#categorias .owl-nav button span{
	border-color: var(--botones)!important;
	color: var(--botones);
}
#categorias .owl-nav button span:hover{
	background-color: var(--botones)!important;
}
.linea-color{
	background-color: var(--botones)!important;
}
.cuadro-lineas{
	border-color: var(--botones);
}
.text-color{
	color: var(--botones)!important;
}
.indicadores .row [class^='col-']{
	border-left: 1px solid var(--botones);
}
#preguntas .accordion-button:not(.collapsed){
	color: var(--botones-hover);
	background-color: #f6f6f6;
}
#clientes button.owl-dot.active{
	background-color: var(--botones)!important;
}
#reviews .owl-dots button.active{
	background-color: var(--botones)!important;
}

/* Menu de navegacion: color administrable desde admin-web/configuracion.
   Sin valor configurado la variable llega en blanco, que es como venia. */
#navbar{
	background-color: var(--nav, #fff);
	border-bottom: 1px solid var(--nav-texto-tenue, rgba(0, 0, 0, .08));
}
#navbar .nav-item .nav-link{
	color: var(--nav-texto-suave, rgba(0, 0, 0, .7));
}
#navbar .nav-item .nav-link.active,
#navbar .nav-item .nav-link:is(:hover, :focus){
	color: var(--nav-texto, #000);
}
#navbar .nav-item .nav-link.active::after,
#navbar .nav-item .nav-link:is(:hover)::after{
	background-color: var(--nav-acento, var(--botones))!important;
}
#navbar .navbar-toggler{
	border-color: var(--nav-texto-tenue, rgba(0, 0, 0, .1));
}
#navbar .btn-carro,
#navbar .btn-icon a,
#navbar .btn-link{
	color: var(--nav-texto-suave, inherit);
}
#navbar .btn-carro:is(:hover, :focus),
#navbar .btn-icon a:is(:hover, :focus){
	color: var(--nav-texto, inherit);
}

/* Fondo del pie, administrable con "Bar footer" */
footer{
	background-color: var(--bar-footer, #fff);
	border-top-color: var(--texto-footer-tenue, #D9D9D9);
}
footer .down-foot{
	border-top-color: var(--texto-footer-tenue, #D9D9D9);
}

/* Color de la letra del pie, tambien administrable.
   Las utilidades .text-secondary de Bootstrap traen !important, por eso se repite aqui. */
footer,
footer p,
footer li,
footer li a,
footer h6,
footer .text-secondary,
footer a.text-secondary{
	color: var(--texto-footer, #666)!important;
}
footer li a:is(:hover, :focus),
footer a.text-secondary:is(:hover, :focus){
	color: var(--botones, #E30613)!important;
}
/* Los iconos de redes siguen el mismo color de la letra del pie */
footer .social-foot a.btn{
	color: var(--texto-footer, #666)!important;
	border-color: var(--texto-footer-tenue, #D9D9D9);
}
footer .social-foot a.btn:is(:hover, :focus){
	color: var(--botones, #E30613)!important;
}
