/* ================================
   CUERPO DE CADA ÍTEM DEL ACORDEÓN
   ================================ */
.acordeon .item {
  margin: 24px 0;                 /* Más espacio arriba y abajo */
  border-radius: 8px;
  overflow: hidden;
  border: none;
  background: #797195;           /* Color lila oscuro */
}

/* ================================
   ENCABEZADO DEL PANEL (BOTÓN)
   ================================ */
.acordeon .titulo {
  background: #d5bdf2;           /* Lila claro */
  color: #333;
  padding: 15px 20px 15px 40px;
  font-weight: bold;
  width: 100%;
  border: none;
  cursor: pointer;
  text-align: left;
  font-size: 16px;
  position: relative;
  transition: background 0.3s ease;
}

/* ================================
   FLECHITA A LA IZQUIERDA
   ================================ */
.acordeon .titulo::after {
  content: "\25B6";              /* ► */
  position: absolute;
  left: 15px;
  top: 50%;
  transform: translateY(-50%);
  transition: transform 0.3s;
}

/* ================================
   FLECHITA ROTADA CUANDO ESTÁ ACTIVO
   ================================ */
.acordeon .titulo.activa::after {
  transform: translateY(-50%) rotate(90deg); /* ▼ */
}

/* ================================
   CONTENIDO VISIBLE AL DESPLEGAR
   ================================ */
.acordeon .contenido {
  display: none;
  padding: 20px;
  background: white;
  color: black;
  animation: fadeIn 0.3s ease;
}

/* ================================
   EFECTO DE APARICIÓN
   ================================ */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}


/* ================================
   ACORDEON ORGANO GARANTE
   ================================ */
.acordeon-blanco .acordeon_item_contenido {
  background-color: #ffffff;
} 

/* Fondo blanco SOLO para los acordeones con clase personalizada */
.acordeon.acordeon-blanco .item {
  background: #ffffff !important;
}

.acordeon.acordeon-blanco .titulo {
  background: #f0f0f0 !important;
  color: #000 !important;
}

.acordeon.acordeon-blanco .contenido {
  background: #ffffff !important;
  color: #000 !important;
}