/* ==========================================================
   LEONARI – Estilos del Menú Lateral Acordeón
   Jerarquía: Rubros > Categorías > Subcategorías
   ========================================================== */

/* === Estructura base === */
.cd-accordion {
  list-style: none;
  margin: 0;
  padding: 0;
}

.cd-accordion__item {
  border-bottom: 1px solid #e0e0e0;
}

.cd-accordion__label {
  font-size: 1.5rem; /* 16px */
  display: block;
  position: relative;
  padding: 10px 15px;
  cursor: pointer;
  color: #1f1f25;
  font-weight: 500;
  transition: background 0.2s ease;
  user-select: none;
}

.cd-accordion__label:hover {
  background-color: #f5f8fa;
}

/* === Subniveles ocultos por defecto === */
.cd-accordion__sub {
  display: none;
  list-style: none;
  margin-left: 15px;
  padding-left: 10px;
  border-left: 2px solid rgba(12, 159, 203, 0.2);
}

/* === Inputs ocultos === */
.cd-accordion__input {
  display: none;
}

/* === Mostrar subniveles al estar activo === */
.cd-accordion__input:checked + .cd-accordion__label + .cd-accordion__sub {
  display: block;
  animation: fadeIn 0.25s ease;
}

/* === Flechas de expansión === */
.cd-accordion__label::after {
  content: "\f105";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: #0C9FCB;
  transition: transform 0.25s ease;
}

/* === Rotar flecha al abrir === */
.cd-accordion__input:checked + .cd-accordion__label::after {
  transform: translateY(-50%) rotate(90deg);
}

/* === Niveles jerárquicos === */
.cd-accordion__sub--l2 .cd-accordion__label {
  font-size: 1.5rem;
}
.cd-accordion__sub--l3 .cd-accordion__label {
  font-size: 1.4rem;
}

/* === Links de subcategorías === */
.cd-accordion__sub--l3 a {
  font-size: 0.95rem;
  color: #0C9FCB;
  text-decoration: none;
  display: inline-block;
  padding: 5px 0;
}
.cd-accordion__sub--l3 a:hover {
  text-decoration: underline;
}

/* === Animación suave === */
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* === Opcional: resaltar el elemento activo === */
.cd-accordion__label.activo,
.cd-accordion__sub--l3 a.activo {
  background-color: rgba(12, 159, 203, 0.1);
  color: #0C9FCB;
  font-weight: 600;
}

/* === Íconos uniformes (idénticos al menú superior) === */

/* Rubros y categorías principales */
.cd-accordion__label--icon-folder::before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  margin-right: 8px;
  vertical-align: middle;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'><path fill='currentColor' d='M3.3 1.5L7.5 5 3.3 8.5z'/></svg>");
  background-color: #0C9FCB;
}

/* Subcategorías (niveles inferiores) */
.cd-accordion__label--icon-img::before {
  content: "";
  display: inline-block;
  width: 9px;
  height: 9px;
  margin-right: 6px;
  vertical-align: middle;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='9' height='9' viewBox='0 0 10 10'><path fill='currentColor' d='M3.3 1.5L7.5 5 3.3 8.5z'/></svg>");
  background-color: #0C9FCB;
  opacity: 0.8;
}

.cd-accordion__input:checked + .cd-accordion__label::before {
  transform: rotate(90deg);
  transition: transform 0.25s ease;
}

#menu-lateral-categorias .active-cat > label,
#menu-lateral-categorias .active-cat > a {
  color: #0C9FCB !important;
  font-weight: 600;
  background-color: #f0fbff;
  border-left: 3px solid #0C9FCB;
}