@layer comp-schedule-base {
  @keyframes rotation {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(359deg);
    }
  }
  .comp-schedule:before, .comp-schedule:after {
    transition: opacity 0.2s ease-in-out;
  }
  .comp-schedule[data-loading=true] {
    pointer-events: none;
    position: relative;
  }
  .comp-schedule[data-loading=true]:before {
    content: "\f110";
    font: var(--fa-font-solid);
    text-align: center;
    padding: 3rem;
    font-size: 3rem;
    color: var(--color-primary);
    animation: rotation 3s infinite linear;
    position: absolute;
    top: 200px;
    left: calc(50% - 4rem);
    z-index: 100;
  }
  .comp-schedule[data-loading=true]:after {
    opacity: 0.75;
    background: var(--color-white);
    content: "";
    position: absolute;
    inset: 0 0 0 0;
  }
  .comp-schedule .screen-reader-text {
    font-size: 0;
    position: absolute;
  }
  .comp-schedule__header {
    margin-block-end: var(--spacing-lg, 1.5rem);
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm, 0.5rem);
  }
  @container (min-width: 600px) {
    .comp-schedule__header {
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
    }
  }
  .comp-schedule__header h2 {
    margin: 0;
  }
  .comp-schedule__filter {
    display: flex;
    align-items: center;
    gap: var(--spacing-md, 0.5rem);
  }
  .comp-schedule__filter__field--dropdown {
    display: flex;
    align-items: center;
    gap: var(--spacing-sm, 0.25rem);
  }
  .comp-schedule__filter__field--dropdown select {
    min-width: 10rem;
  }
  .comp-schedule__content__group {
    container-name: comp-group;
    container-type: inline-size;
    position: relative;
    padding: var(--spacing-md);
  }
  .comp-schedule__content__group__table {
    width: 100%;
  }
  .comp-schedule__content__group__table tbody tr {
    padding: var(--spacing-md);
    display: block;
    min-width: 340px;
  }
  @container comp-group (min-width: 720px) {
    .comp-schedule__content__group__table tbody tr {
      display: grid;
      grid-gap: var(--spacing-xs, 0.25rem);
      grid-template-columns: repeat(10, 2fr);
    }
    .comp-schedule__content__group__table tbody tr:has(td[data-key=date]) {
      grid-template-columns: repeat(11, 2fr);
    }
  }
  @container comp-group (min-width: 940px) {
    .comp-schedule__content__group__table tbody tr {
      grid-template-columns: repeat(10, 1fr);
    }
    .comp-schedule__content__group__table tbody tr:has(td[data-key=date]) {
      grid-template-columns: repeat(11, 1fr);
    }
  }
  .comp-schedule__content__group__table tbody tr:nth-of-type(odd) {
    background: var(--color-light, #EEE);
  }
  .comp-schedule__content__group__table tbody tr td {
    font-size: 1rem;
  }
  .comp-schedule__content__group__table tbody tr td:has(i), .comp-schedule__content__group__table tbody tr td:has(svg) {
    display: flex;
    align-items: flex-start;
    gap: var(--spacing-xs, 0.25rem);
  }
  @container comp-group (min-width: 940px) {
    .comp-schedule__content__group__table tbody tr td[data-key=date], .comp-schedule__content__group__table tbody tr td[data-key=comp] {
      grid-row: span 3;
    }
  }
  .comp-schedule__content__group__table tbody tr td[data-key=date] {
    width: 80px;
    float: left;
    margin-block-end: var(--spacing-xs, 0.25rem);
    margin-inline-end: var(--spacing-sm, 0.5rem);
  }
  @container comp-group (min-width: 720px) {
    .comp-schedule__content__group__table tbody tr td[data-key=date] {
      grid-row: span 3;
      width: unset;
      margin: 0;
    }
  }
  @container comp-group (min-width: 940px) {
    .comp-schedule__content__group__table tbody tr td[data-key=date] {
      grid-row: unset;
    }
  }
  .comp-schedule__content__group__table tbody tr td[data-key=date] .date {
    width: 100%;
  }
  @container comp-group (min-width: 720px) {
    .comp-schedule__content__group__table tbody tr td[data-key=comp] {
      grid-column: span 4;
      grid-row: span 2;
      padding-inline-end: var(--spacing-sm);
    }
  }
  @container comp-group (min-width: 940px) {
    .comp-schedule__content__group__table tbody tr td[data-key=comp] {
      grid-column: span 4;
      padding-inline-end: var(--spacing-lg);
      grid-row: unset;
    }
  }
  .comp-schedule__content__group__table tbody tr td[data-key=comp] strong {
    font-size: 1.125rem;
    display: block;
  }
  @container comp-group (min-width: 720px) {
    .comp-schedule__content__group__table tbody tr td[data-key=comp] span {
      font-size: var(--font-size-sm);
      line-height: var(--typescale);
      display: block;
    }
  }
  @container comp-group (min-width: 720px) {
    .comp-schedule__content__group__table tbody tr td[data-key=venue], .comp-schedule__content__group__table tbody tr td[data-key=time], .comp-schedule__content__group__table tbody tr td[data-key=program] {
      grid-column: 5/-1;
    }
  }
  :has([data-key=date]) .comp-schedule__content__group__table tbody tr td[data-key=venue], :has([data-key=date]) .comp-schedule__content__group__table tbody tr td[data-key=time], :has([data-key=date]) .comp-schedule__content__group__table tbody tr td[data-key=program] {
    margin-inline-start: 90px;
  }
  @container comp-group (min-width: 720px) {
    :has([data-key=date]) .comp-schedule__content__group__table tbody tr td[data-key=venue], :has([data-key=date]) .comp-schedule__content__group__table tbody tr td[data-key=time], :has([data-key=date]) .comp-schedule__content__group__table tbody tr td[data-key=program] {
      margin-inline-start: 0;
      grid-column: 6/-1;
    }
  }
  .comp-schedule__content__group__table tbody tr td[data-key=venue] {
    margin-block: var(--spacing-xs, 0.25rem);
  }
  @container comp-group (min-width: 720px) {
    .comp-schedule__content__group__table tbody tr td[data-key=venue] {
      margin: 0;
    }
  }
  @container comp-group (min-width: 940px) {
    .comp-schedule__content__group__table tbody tr td[data-key=venue] {
      grid-column: span 3;
    }
    :has([data-key=date]) .comp-schedule__content__group__table tbody tr td[data-key=venue] {
      grid-column: span 3;
    }
  }
  .comp-schedule__content__group__table tbody tr td[data-key=venue] a {
    text-wrap: balance;
  }
  .comp-schedule__content__group__table tbody tr td[data-key=time] {
    clear: both;
    margin-block-start: var(--spacing-sm, 0.5rem);
  }
  @container comp-group (min-width: 720px) {
    .comp-schedule__content__group__table tbody tr td[data-key=time] {
      margin-block-start: 0;
    }
  }
  @container comp-group (min-width: 940px) {
    .comp-schedule__content__group__table tbody tr td[data-key=time] {
      grid-column: span 2;
    }
    :has([data-key=date]) .comp-schedule__content__group__table tbody tr td[data-key=time] {
      grid-column: span 2;
    }
  }
  .comp-schedule__content__group__table tbody tr td[data-key=time] .badge {
    display: inline-block;
    text-wrap: nowrap;
    break-inside: avoid;
    background: #DDD;
    padding: var(--spacing-xxs, 0.125rem);
    text-transform: uppercase;
    line-height: 1;
    font-size: var(--font-size-sm, 0.85rem);
  }
  @container comp-group (min-width: 940px) {
    .comp-schedule__content__group__table tbody tr td[data-key=program] {
      grid-column: span 1;
    }
    :has([data-key=date]) .comp-schedule__content__group__table tbody tr td[data-key=program] {
      grid-column: span 1;
    }
  }
}

/*# sourceMappingURL=comp-schedule.css.map */
