/**
 * Shared styles for EventKoi Event Data blocks on the frontend.
 * Mirrors the backend editor defaults so Query Loop templates match legacy output.
 */

.wp-block-eventkoi-event-data.ek-event-title.ek-event-title-default {
  .ek-event-title--inner {
    margin: 0;
    font-weight: inherit;
    font-size: inherit;
  }
}

/* Defaults only apply to non-heading wrappers (div/p/span). */
.wp-block-eventkoi-event-data.ek-event-title.ek-event-title-default:where(div, p, span) {
  font-size: 1.25em;
  font-weight: 600;

  .ek-event-title--inner a,
  > a {
    text-decoration: none;

    &:hover,
    &:focus {
      text-decoration: underline;
    }
  }
}

.wp-block-eventkoi-event-data.ek-event-timeline.ek-event-timeline-default {
  font-size: 0.9em;
  opacity: 0.85;
}

.wp-block-eventkoi-event-data.ek-event-location.ek-event-location-default {
  display: flex;
  align-items: center;
  font-size: 0.9em;
  opacity: 0.85;

  // Alignment control sets text-align, a no-op on a flex container. Map it to
  // justify-content so center/right match the title and date fields.
  &.has-text-align-center {
    justify-content: center;
  }

  &.has-text-align-right {
    justify-content: flex-end;
  }

  a,
  span {
    display: flex;
    align-items: center;
    gap: 0.4em;
    text-decoration: none;
    color: inherit;
  }

  svg {
    width: 1em;
    height: 1em;
    opacity: 0.7;
    margin-top: 1px;
  }
}
