/* Fondo MEGAMENU */
#header .header-top .inner > .wrapper {
    background-color: #1a1a1a !important;
    background-image: none !important; /* Esto quita el verde que viene por defecto */
}
/* CAMBIAR COLOR DEL TEXTO AL PASAR EL RATÓN (HOVER) */
.leo-megamenu .navbar-nav > li > a:hover .menu-title,
.leo-megamenu .navbar-nav > li:hover > a .menu-title {
    color: #C5A059 !important;
}

/* CAMBIAR COLOR DEL TEXTO CUANDO LA CATEGORÍA ESTÁ SELECCIONADA (ACTIVE) */
.leo-megamenu .navbar-nav > li.active > a .menu-title,
.leo-megamenu .navbar-nav > li.active > a {
    color: #C5A059 !important;
}

/* QUITAR POSIBLES LÍNEAS O BORDES VERDES (Subrayado de hover) */
.leo-megamenu .navbar-nav > li > a::after {
    background-color: #C5A059 !important;
}




/* CAMBIAR EL BOTÓN VERDE "NUESTRAS SECCIONES" A DORADO */
.ApMegamenu .leo-verticalmenu .title_block {
    background-color: #C5A059 !important;
    border-color: #C5A059 !important;
    color: #ffffff !important;
}

/* ASEGURAR EL COLOR DEL TEXTO E ICONO DENTRO DEL BOTÓN */
.ApMegamenu .leo-verticalmenu .title_block,
.ApMegamenu .leo-verticalmenu .title_block span,
.ApMegamenu .leo-verticalmenu .title_block i {
    color: #ffffff !important;
}

/* CAMBIO DE COLOR AL PASAR EL RATÓN (HOVER) */
.ApMegamenu .leo-verticalmenu .title_block:hover {
    background-color: #a68545 !important; /* Un dorado un poco más oscuro */
    border-color: #a68545 !important;
}



/* 1. COLOR DEL ICONO (los auriculares) */
.hd-contact i {
    color: #C5A059 !important;
    font-size: 32px; /* Por si quieres hacerlo un pelín más grande */
}

/* 2. COLOR DEL TEXTO "Llámanos" (El título h4) */
.hd-contact .hd-contact-text h4 {
    color: #333333 !important; /* Un gris oscuro/negro queda más elegante para el título */
    margin-bottom: 0;
}

/* 3. COLOR DEL NÚMERO DE TELÉFONO (El párrafo p) */
.hd-contact .hd-contact-text p {
    color: #C5A059 !important; /* Dorado para que el número resalte */
    font-weight: 700; /* Para que se vea más grueso y premium */
}

/* OPCIONAL: Si quieres que al pasar el ratón por el teléfono cambie algo */
.hd-contact:hover i, .hd-contact:hover p {
    color: #a68545 !important; /* Un dorado un poco más oscuro al pasar el ratón */
}






/* 1. LIMPIEZA DE CONTENEDORES */
.header-btn.btn-acc, .header-btn.btn-wl, .leo-blockcart, .leo-blockcart .cart-preview {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
}

/* 2. LOS 3 CÍRCULOS (Idénticos: 44x44px) */
.header-btn.btn-acc a, 
.header-btn.btn-wl a, 
.leo-blockcart .header-btn.btn-cart {
    width: 44px !important;
    height: 44px !important;
    background-color: #ffffff !important;
    border: 1.5px solid #C5A059 !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    margin: 0 10px !important;
    transition: all 0.3s ease !important;
}

/* 3. LOS CONTADORES (Igualados a 20px como pide el tema) */
/* Usamos la clase .ap-total que es común a los dos */
#header .ap-total {
    width: 20px !important;
    height: 20px !important;
    line-height: 18px !important; /* Ajuste para centrar número */
    background-color: #C5A059 !important;
    color: #ffffff !important;
    border: 1.5px solid #ffffff !important;
    border-radius: 50% !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    position: absolute !important;
    top: -6px !important;   /* Misma altura */
    right: -6px !important; /* Misma posición lateral */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
}

/* 4. ICONOS Y HOVER */
.header-btn i, .btn-cart i {
    color: #333333 !important;
    font-size: 18px !important;
}

.header-btn.btn-acc a:hover, 
.header-btn.btn-wl a:hover, 
.leo-blockcart .header-btn.btn-cart:hover {
    background-color: #C5A059 !important;
}

.header-btn.btn-acc a:hover i, 
.header-btn.btn-wl a:hover i, 
.leo-blockcart .header-btn.btn-cart:hover i {
    color: #ffffff !important;
}