.elementor-27196 .elementor-element.elementor-element-cddc173{--display:flex;}.elementor-27196 .elementor-element.elementor-element-ea55ba4{margin:05% 0% calc(var(--kit-widget-spacing, 0px) + 5%) 0%;}#elementor-popup-modal-27196{background-color:rgba(0,0,0,.8);justify-content:center;align-items:center;pointer-events:all;}#elementor-popup-modal-27196 .dialog-message{width:640px;height:auto;}#elementor-popup-modal-27196 .dialog-close-button{display:flex;}#elementor-popup-modal-27196 .dialog-widget-content{box-shadow:2px 8px 23px 3px rgba(0,0,0,0.2);}@media(max-width:767px){.elementor-27196 .elementor-element.elementor-element-cddc173{--margin-top:0%;--margin-bottom:0%;--margin-left:0%;--margin-right:0%;}.elementor-27196 .elementor-element.elementor-element-ea55ba4{margin:10% 0% calc(var(--kit-widget-spacing, 0px) + 10%) 0%;}}/* Start custom CSS for shortcode, class: .elementor-element-ea55ba4 *//* --- VARIABLES DE COLORES (Para referencia) ---
   Principal: #e84d1f
   Negro:     #1a1a1a
   Claro:     #fff5eb
--------------------------------------------- */

/* Contenedor General */
.mi-sidebar-con-img ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* --- ITEM (Fila) --- */
.cat-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px; /* Un poco más de aire */
    border-bottom: 1px solid #f0f0f0; /* Separador sutil gris muy claro */
    border-radius: 8px; /* Bordes redondeados */
    transition: all 0.3s ease;
    margin-bottom: 2px;
}

/* Efecto HOVER en la fila */
.cat-wrapper:hover {
    background-color: #fff5eb; /* COLOR CLARO de fondo */
    transform: translateX(5px); /* Pequeño desplazamiento a la derecha */
}

/* --- ENLACE Y TEXTO --- */
.cat-wrapper a.cat-link {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: #1a1a1a; /* COLOR NEGRO */
    font-weight: 600; /* Letra un poco más gruesa */
    font-size: 15px;
    width: 100%;
    transition: color 0.2s;
}

/* Color del texto al pasar el mouse */
.cat-wrapper:hover a.cat-link .cat-name {
    color: #e84d1f; /* COLOR PRINCIPAL */
}

/* --- IMAGEN (Miniatura) --- */
.cat-thumb {
    width: 32px;
    height: 32px;
    object-fit: cover;
    border-radius: 50%; /* Círculo perfecto */
    margin-right: 12px;
    border: 2px solid #fff5eb; /* Borde color CLARO para separar */
    box-shadow: 0 2px 6px rgba(0,0,0,0.1); /* Sombra suave */
    background-color: #fff;
}

/* --- CONTADOR (Burbuja) --- */
.cat-count {
    background-color: #fff5eb; /* Fondo CLARO por defecto */
    color: #e84d1f; /* Número color PRINCIPAL */
    font-size: 11px;
    padding: 4px 10px;
    border-radius: 12px;
    font-weight: 700;
    transition: 0.3s;
}

/* Contador al pasar el mouse (Invierte colores) */
.cat-wrapper:hover .cat-count {
    background-color: #e84d1f; /* Fondo PRINCIPAL */
    color: #fff; /* Texto blanco */
}

/* --- JERARQUÍA (Subcategorías / Hijos) --- */
ul.sub-list {
    margin-left: 22px;
    margin-top: 5px;
    margin-bottom: 10px;
    /* Línea vertical guía en color PRINCIPAL pero suave (opcional: o sólido #e84d1f) */
    border-left: 2px solid rgba(232, 77, 31, 0.2); 
}

ul.sub-list .cat-wrapper {
    padding: 6px 10px; /* Hijos un poco más compactos */
    border-bottom: none; /* Sin líneas divisorias en hijos */
}

/* Texto de hijos */
ul.sub-list .cat-wrapper a.cat-link {
    font-size: 14px;
    font-weight: 400; /* Letra normal, no negrita */
    color: #555; /* Un gris un poco más suave que el negro puro */
}

ul.sub-list .cat-wrapper:hover a.cat-link {
    color: #e84d1f; /* Hover sigue siendo naranja */
}

/* Imagen de hijos más pequeña */
ul.sub-list .cat-thumb {
    width: 24px;
    height: 24px;
    border-width: 1px;
}

/* --- ESTILOS SOLO PARA MÓVIL (Pantallas menores a 768px) --- */
@media (max-width: 767px) {
    
    /* Reducir padding del contenedor */
    .cat-wrapper {
        padding: 8px 5px; /* Más compacto */
    }

    /* Texto un poco más pequeño */
    .cat-wrapper a.cat-link {
        font-size: 14px;
    }

    /* Imagen más pequeña */
    .cat-thumb {
        width: 26px;
        height: 26px;
        margin-right: 8px;
    }

    /* Sangría de hijos reducida para ganar espacio */
    ul.sub-list {
        margin-left: 15px;
        border-left-width: 2px;
    }

    /* Contador más pequeño */
    .cat-count {
        font-size: 10px;
        padding: 2px 6px;
    }
}/* End custom CSS */