.c-schedule-section {
  padding-block-start: calc(40 * var(--etest-section-unit));

  @media (min-width: 1024px) {
    padding-block-start: calc(80 * var(--etest-section-unit));
  }
}

.c-schedule-section p,
.c-schedule-section ol,
.c-schedule-section ul,
.c-schedule-section li,
.c-schedule-section h2,
.c-schedule-section label {
  margin-bottom: 0;
}

.c-schedule-section input,
.c-schedule-section select {
  margin: 0 !important;
}

.c-schedule-section__container {
  position: relative;
  max-width: var(--etest-content-max-width, 1440px);
  margin-inline: auto;
  border-radius: calc(20 * var(--etest-section-unit));
  overflow: hidden;
  width: calc(100% - 32px);
  display: flex;
  flex-direction: column;
  row-gap: calc(16 * var(--etest-section-unit));

  @media (767px < width) {
    width: calc(100% - 48px);
    row-gap: calc(40 * var(--etest-section-unit));
  }
}

.c-schedule-section__title {
  font-weight: 700;
  color: #0e0e0e;
  text-align: center;
  text-wrap: balance;
  font-size: calc(28 * var(--etest-section-unit));
  line-height: 1.2;
  
  @media (min-width: 1024px) {
    font-size: calc(42 * var(--etest-section-unit));
    line-height: calc(51 * var(--etest-section-unit));
  }
}

.c-schedule-section__table {
  border: calc(1 * var(--etest-section-unit)) solid #d6d6d6;
  display: grid;
  border-radius: calc(12 * var(--etest-section-unit));
  grid-template-columns: 142fr 119fr 104fr;

  @media (min-width: 1024px) {
    border-radius: calc(20 * var(--etest-section-unit));
    grid-template-columns: 420fr 309fr 309fr 400fr;
  }
}

.c-schedule-section__row-header {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: subgrid;
  border-bottom: 1px solid #d6d6d6;
}

.c-schedule-section__heading-cell {
  display: flex;
  align-items: center;
  padding: calc(12 * var(--etest-section-unit)) calc(0 * var(--etest-section-unit)) calc(12 * var(--etest-section-unit)) calc(8 * var(--etest-section-unit));
  column-gap: calc(4 * var(--etest-section-unit));

  @media (min-width: 1024px) {
    padding: calc(24 * var(--etest-section-unit));
    column-gap: calc(12 * var(--etest-section-unit));
  }
}

.c-schedule-section__heading-cell:first-child {
  @media (min-width: 1024px) {
    margin-left: calc(12 * var(--etest-section-unit));
  }
}

.c-schedule-section__heading-cell:last-child {
  display: none;

  @media (min-width: 1024px) {
    display: flex;
  }
}

.c-schedule-section__cell-icon {
  width: calc(16 * var(--etest-section-unit));
  height: calc(16 * var(--etest-section-unit));

  @media (min-width: 1024px) {
    width: calc(24 * var(--etest-section-unit));
    height: calc(24 * var(--etest-section-unit));
  }
}

.c-schedule-section__heading-cell-title {
  font-weight: 700;
  color: #68686d;
  font-size: calc(12 * var(--etest-section-unit));
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-clamp: 1;
  -webkit-line-clamp: 1;

  @media (min-width: 1024px) {
    font-size: calc(16 * var(--etest-section-unit));
  }
}

.c-schedule-section__select-wrapper {
  border-radius: calc(9999 * var(--etest-section-unit));
  border: calc(1 * var(--etest-section-unit)) solid #d6d6d6;
  padding: calc(12 * var(--etest-section-unit)) calc(16 * var(--etest-section-unit));
  align-items: center;
  column-gap: calc(4 * var(--etest-section-unit));
  display: flex;

  @media (min-width: 1024px) {
    display: none;
  }
}

.c-schedule-section__select-first-icon {
  width: calc(20 * var(--etest-section-unit));
  height: calc(20 * var(--etest-section-unit));
}

.c-schedule-section__select-text {
  font-weight: 700;
  font-size: calc(14 * var(--etest-section-unit));
  color: #68686d;
}

.c-schedule-section__select {
  flex: 1;
  border: none;
  -moz-appearance: none;    /* Hides the arrow in Firefox */
  -webkit-appearance: none; /* Hides the arrow in Chrome, Safari, and Edge */
  appearance: none;
  padding: 0;
  font-weight: 400;
  background-color: transparent;
}

.c-schedule-section__select-last-icon {
  width: calc(20 * var(--etest-section-unit));
  height: calc(20 * var(--etest-section-unit));
  display: none;
}

.c-schedule-section__body {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: subgrid;
  grid-auto-rows: 0;
  overflow: hidden;
  list-style-type: none;
}

.c-schedule-section__table:has(#c-schedule-section__toggle:not(:checked)) .c-schedule-section__body {
  grid-template-rows: repeat(6, 1fr);
}

.c-schedule-section__table:has(#c-schedule-section__toggle:checked) .c-schedule-section__body {
  grid-template-rows: auto;
  grid-auto-rows: auto;
}

.c-schedule-section__container:not([data-selected-position]) .c-schedule-section__row-data,
.c-schedule-section__container[data-selected-position=""] .c-schedule-section__row-data,
.c-schedule-section__container:has(option[value=""]:checked) .c-schedule-section__row-data {
  display: grid;
  opacity: 1;
}

.c-schedule-section__container:not([data-selected-position]) .c-schedule-section__toggle-count--position-all,
.c-schedule-section__container[data-selected-position=""] .c-schedule-section__toggle-count--position-all,
.c-schedule-section__container:has(option[value=""]:checked) .c-schedule-section__toggle-count--position-all {
  max-width: calc(9999 * var(--etest-section-unit));
  opacity: 1;
  visibility: visible;
}

.c-schedule-section__row-data {
  grid-column: 1 / -1;
  grid-template-columns: subgrid;
  border-bottom: 1px solid #d6d6d680;
  display: none;
  opacity: 0;

  @media (min-width: 1024px) {
    display: grid;
    opacity: 1;
  }

  @media (prefers-reduced-motion: no-preference) {
    transition: all 0.3s;
  }

  @starting-style {
    opacity: 0;
  }
}

.c-schedule-section__data-cell {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: calc(10 * var(--etest-section-unit)) calc(8 * var(--etest-section-unit));
  row-gap: calc(2 * var(--etest-section-unit));

  @media (min-width: 1024px) {
    padding: calc(9 * var(--etest-section-unit)) calc(20 * var(--etest-section-unit));
    row-gap: calc(4 * var(--etest-section-unit));
  }
}

.c-schedule-section__data-cell:last-child {
  display: none;

  @media (min-width: 1024px) {
    display: flex;
  }
}

.c-schedule-section__data-cell-name {
  width: fit-content;
  display: flex;
  flex-direction: column;
  row-gap: calc(2 * var(--etest-section-unit));
  padding-left: calc(8 * var(--etest-section-unit));

  @media (prefers-reduced-motion: no-preference) {
    transition: all 0.3s;
  }

  @media (min-width: 1024px) {
    row-gap: calc(4 * var(--etest-section-unit));
    padding: calc(6 * var(--etest-section-unit)) calc(20 * var(--etest-section-unit));
    border-radius: calc(9999 * var(--etest-section-unit));
  }
}

.c-schedule-section__data-cell-title {
  font-weight: 700;
  color: #0e0e0e;
  font-size: calc(12 * var(--etest-section-unit));
  line-height: calc(15 * var(--etest-section-unit));

  @media (prefers-reduced-motion: no-preference) {
    transition: all 0.3s;
  }

  @media (min-width: 1024px) {
    font-size: calc(16 * var(--etest-section-unit));
    line-height: calc(19 * var(--etest-section-unit));
  }
}

.c-schedule-section__data-cell-subtitle {
  color: #68686d;
  font-size: calc(12 * var(--etest-section-unit));
  line-height: calc(15 * var(--etest-section-unit));

  @media (min-width: 1024px) {
    font-size: calc(16 * var(--etest-section-unit));
    line-height: calc(19 * var(--etest-section-unit));
  }
}

.c-schedule-section__data-cell-status {
  border-radius: calc(9999 * var(--etest-section-unit));
  border-style: solid;
  border-width: calc(1 * var(--etest-section-unit));
  font-weight: 600;
  width: fit-content;
  padding: calc(4 * var(--etest-section-unit)) calc(8 * var(--etest-section-unit));
  font-size: calc(10 * var(--etest-section-unit));
  line-height: calc(12 * var(--etest-section-unit));

  @media (min-width: 1024px) {
    padding: calc(10.5 * var(--etest-section-unit)) calc(16 * var(--etest-section-unit));
    font-size: calc(16 * var(--etest-section-unit));
    line-height: 1.5;
  }
}

.c-schedule-section__data-cell-status.c-schedule-section__data-cell-status--out-of-slot {
  border-color: #68686d;
  color: #68686d;
  background-color: #fafafa;
}

.c-schedule-section__data-cell-status.c-schedule-section__data-cell-status--almost-out-of-slot {
  border-color: #9a1b1d;
  color: #9a1b1d;
  background-color: #fef8f8;
}

.c-schedule-section__data-cell-status.c-schedule-section__data-cell-status--slot-available {
  border-color: #2b52d4;
  color: #2b52d4;
  background-color: #f8f9fe;
}

.c-schedule-section__data-cell-location {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-clamp: 1;
  -webkit-line-clamp: 1;
}

.c-schedule-section__footer {
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
  padding: calc(12 * var(--etest-section-unit));

  @media (min-width: 1024px) {
    padding: calc(16 * var(--etest-section-unit));
  }
}

.c-schedule-section__toggle-wrapper {
  display: grid;
  grid-template-areas: "single";
  cursor: pointer;
}

.c-schedule-section__toggle {
  grid-area: single;
  appearance: none;
}

.c-schedule-section__toggle-overlay {
  grid-area: single;
  border: calc(1 * var(--etest-section-unit)) solid #d6d6d6;
  border-radius: calc(9999 * var(--etest-section-unit));
  padding: calc(14.5 * var(--etest-section-unit)) calc(24 * var(--etest-section-unit));
  display: flex;
  align-items: center;
  column-gap: calc(4 * var(--etest-section-unit));
}

.c-schedule-section__toggle-text-container {
  display: grid;
  grid-template-areas: "single";
  user-select: none;
}

.c-schedule-section__toggle-show-more-text-container,
.c-schedule-section__toggle-show-less-text-container {
  white-space: nowrap;
  grid-area: single;

  @media (prefers-reduced-motion: no-preference) {
    transition: all 0.3s;
  }
}

.c-schedule-section__table:has(#c-schedule-section__toggle:not(:checked)) .c-schedule-section__toggle-show-more-text-container {
  opacity: 1;
  visibility: visible;
  z-index: 1;
}

.c-schedule-section__table:has(#c-schedule-section__toggle:checked) .c-schedule-section__toggle-show-more-text-container {
  max-width: 0;
  opacity: 0;
  visibility: hidden;
  z-index: -1;
}

.c-schedule-section__table:has(#c-schedule-section__toggle:not(:checked)) .c-schedule-section__toggle-show-less-text-container {
  max-width: 0;
  opacity: 0;
  visibility: hidden;
  z-index: -1;
}

.c-schedule-section__table:has(#c-schedule-section__toggle:checked) .c-schedule-section__toggle-show-less-text-container {
  opacity: 1;
  visibility: visible;
  z-index: 1;
}

.c-schedule-section__toggle-text {
  font-weight: 600;
  color: #0e0e0e;
  font-size: calc(14 * var(--etest-section-unit));

  @media (min-width: 1024px) {
    font-size: calc(16 * var(--etest-section-unit));
  }
}

.c-schedule-section__toggle-icon {
  width: calc(16 * var(--etest-section-unit));
  height: calc(16 * var(--etest-section-unit));

  @media (prefers-reduced-motion: no-preference) {
    transition: all 0.3s;
  }
}

.c-schedule-section__toggle-count-container {
  display: inline-grid;
  grid-template-areas: "single";
}

.c-schedule-section__toggle-count {
  grid-area: single;
  opacity: 0;
  max-width: 0;
  visibility: hidden;
}

.show-on-desktop {
  display: none;

  @media (min-width: 1024px) {
    display: inline;
  }
}