{
  "version": 3,
  "sources": ["src/app/features/events/components/event-card/event-card.component.css"],
  "sourcesContent": ["/* Card compacta y sin radio, como el resto de cards de la tienda. El borde\n   izquierdo colorea por tipo de evento y es la única señal cromática: la lista\n   puede tener decenas de filas y un bloque de color por fila sería ruido. */\n\n.event-card {\n  /* Contexto del botón estirado: su ::after cubre la tarjeta entera. */\n  position: relative;\n  display: flex;\n  align-items: flex-start;\n  gap: var(--space-4);\n  padding: var(--space-4) var(--space-5);\n  background: var(--color-surface-primary);\n  border: 1px solid var(--color-border-primary);\n  border-left: 4px solid var(--color-brand-neutral);\n  border-radius: 0;\n  transition: border-color var(--transition-fast);\n}\n\n.event-card:hover {\n  border-color: var(--color-brand-primary);\n}\n\n.event-card[data-type='torneo'] {\n  border-left-color: var(--color-brand-secondary);\n}\n\n.event-card[data-type='lanzamiento'] {\n  border-left-color: var(--color-brand-primary);\n}\n\n.event-card[data-type='precompra'] {\n  border-left-color: var(--color-brand-accent);\n}\n\n/* ── Bloque de fecha ── */\n\n.event-card__date {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  min-width: 3.25rem;\n  padding: var(--space-2);\n  background: var(--color-surface-alt);\n  border-radius: 0;\n  flex-shrink: 0;\n}\n\n.event-card__day {\n  font-family: var(--font-family-heading);\n  font-size: var(--text-size-2xl);\n  font-weight: var(--font-weight-heading-bold);\n  font-variant-numeric: tabular-nums;\n  color: var(--color-text-primary);\n  line-height: var(--leading-tight);\n}\n\n.event-card__month {\n  font-family: var(--font-family-body);\n  font-size: var(--text-size-xs);\n  font-weight: var(--font-weight-body-medium);\n  letter-spacing: 0.06em;\n  color: var(--color-text-secondary);\n}\n\n/* ── Miniatura ── */\n\n/* Solo con `showImage` e imagen (D33). 4rem ≈ alto del bloque de fecha, así que\n   no altera el alto de la tarjeta. */\n.event-card__thumb {\n  display: block;\n  inline-size: 4rem;\n  block-size: 4rem;\n  flex-shrink: 0;\n  object-fit: cover;\n  background: var(--color-surface-alt);\n  border-radius: 0;\n}\n\n/* ── Cuerpo ── */\n\n.event-card__body {\n  display: flex;\n  flex-direction: column;\n  gap: var(--space-1);\n  flex: 1;\n  min-width: 0;\n}\n\n.event-card__tags {\n  display: flex;\n  align-items: center;\n  gap: var(--space-2);\n  flex-wrap: wrap;\n}\n\n.event-card__type {\n  font-family: var(--font-family-body);\n  font-size: var(--text-size-xs);\n  font-weight: var(--font-weight-body-medium);\n  letter-spacing: 0.04em;\n  text-transform: uppercase;\n  color: var(--color-text-secondary);\n}\n\n/* Chip de juego: solo en las listas globales (`showGame`). Sin radio, como el\n   resto de la tienda, y en neutro — el color de esta card ya lo lleva el borde\n   izquierdo por tipo de evento, y una segunda señal cromática competiría. */\n.event-card__game {\n  font-family: var(--font-family-body);\n  font-size: var(--text-size-xs);\n  font-weight: var(--font-weight-body-medium);\n  padding: 0.0625rem var(--space-2);\n  border: 1px solid var(--color-border-primary);\n  border-radius: 0;\n  background: var(--color-surface-alt);\n  color: var(--color-text-secondary);\n  white-space: nowrap;\n}\n\n.event-card__game--store {\n  border-color: var(--color-brand-primary);\n  color: var(--color-brand-primary);\n}\n\n.event-card__name {\n  font-family: var(--font-family-heading);\n  font-size: var(--text-size-lg);\n  font-weight: var(--font-weight-heading);\n  color: var(--color-text-primary);\n  line-height: var(--leading-snug);\n  margin: 0;\n}\n\n/* Botón estirado (D21): se ve como el nombre de siempre y su ::after cubre la\n   tarjeta, así que toda ella abre el detalle con un único tab stop. El foco se\n   dibuja en el ::after para que el anillo rodee la tarjeta y no solo el nombre. */\n.event-card__open {\n  padding: 0;\n  margin: 0;\n  background: none;\n  border: 0;\n  border-radius: 0;\n  font: inherit;\n  color: inherit;\n  text-align: left;\n  cursor: pointer;\n}\n\n.event-card__open::after {\n  content: '';\n  position: absolute;\n  inset: 0;\n}\n\n.event-card__open:hover,\n.event-card__open:focus-visible {\n  text-decoration: underline;\n}\n\n.event-card__open:focus-visible {\n  outline: none;\n}\n\n.event-card__open:focus-visible::after {\n  outline: 2px solid var(--color-action-secondary);\n  outline-offset: 2px;\n}\n\n.event-card__meta,\n.event-card__location {\n  font-family: var(--font-family-body);\n  font-size: var(--text-size-sm);\n  color: var(--color-text-secondary);\n  line-height: var(--leading-normal);\n  margin: 0;\n}\n\n.event-card__location {\n  display: flex;\n  align-items: center;\n  gap: var(--space-1);\n  font-size: var(--text-size-xs);\n}\n\n.event-card__price {\n  font-family: var(--font-family-body);\n  font-size: var(--text-size-base);\n  font-weight: var(--font-weight-body-medium);\n  font-variant-numeric: tabular-nums;\n  color: var(--color-text-price);\n  white-space: nowrap;\n  flex-shrink: 0;\n  align-self: center;\n}\n\n/* ── Móvil ── */\n\n@media (max-width: 640px) {\n  .event-card {\n    flex-wrap: wrap;\n    padding: var(--space-4);\n    gap: var(--space-3);\n  }\n\n  .event-card__name {\n    font-size: var(--text-size-base);\n  }\n\n  /* `flex-basis: 100%` fuerza el salto de línea: sin él el precio se queda a la\n     derecha si cabe, y el cuerpo se estrangula tanto que el nombre del evento\n     se parte palabra a palabra. */\n  .event-card__price {\n    flex-basis: 100%;\n    align-self: flex-start;\n    /* Sangría con padding y no con margen: sobre una base del 100% el margen\n       se suma al ancho y saca la card fuera del viewport. */\n    box-sizing: border-box;\n    padding-left: calc(3.25rem + var(--space-4));\n  }\n\n  .event-card__thumb {\n    inline-size: 3rem;\n    block-size: 3rem;\n  }\n\n  /* D39 (sustituye las palancas de D36): solo con miniatura, y con la plantilla\n     intacta, la tarjeta pasa a rejilla. La miniatura va ENCIMA de la fecha en\n     una columna compartida, así que el cuerpo conserva el ancho que tiene sin\n     miniatura y nombre y fecha parten igual; solo crece la columna izquierda\n     (tope de 24 px). `row-gap: 0` + márgenes: foto → fecha `--space-1` y\n     cuerpo → precio `--space-3`, como en el flex de siempre. El precio\n     conserva su sangría móvil. */\n  .event-card--with-image {\n    display: grid;\n    grid-template-columns: auto minmax(0, 1fr);\n    grid-template-rows: auto 1fr auto;\n    column-gap: var(--space-3);\n    row-gap: 0;\n    align-items: start;\n  }\n\n  .event-card--with-image .event-card__thumb {\n    grid-column: 1;\n    grid-row: 1;\n    justify-self: center;\n    margin-block-end: var(--space-1);\n  }\n\n  .event-card--with-image .event-card__date {\n    grid-column: 1;\n    grid-row: 2;\n  }\n\n  .event-card--with-image .event-card__body {\n    grid-column: 2;\n    grid-row: 1 / span 2;\n  }\n\n  .event-card--with-image .event-card__price {\n    grid-column: 1 / -1;\n    grid-row: 3;\n    margin-block-start: var(--space-3);\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .event-card {\n    transition: none;\n  }\n}\n"],
  "mappings": "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",
  "names": []
}
