/* Este fichero CSS está específicamente encapsulado para el componente <musical-map-card>. Las reglas de estilo sólo
   afectan a los elementos dentro de este componente gracias al uso del selector 'musical-map-card' como prefijo en
   todas las clases. Esto garantiza el aislamiento de los estilos. El objetivo de esta hoja es no tener estilos inline
   en la plantilla del componente. */

/* Para el contenedor principal de la tarjeta */
musical-map-card .card-container {
  border-radius: var(--a3w-corner-4);
  border: 1px solid var(--Colors-gray-a3w-gray-300);
  width: 300px;
}

/* Para el contenedor de información con layout de columna */
musical-map-card .info-column-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--md-spacing-xs);
}

/* Para el contenedor de botones */
musical-map-card .button-container {
  display: flex;
  gap: var(--md-spacing-sm);
}