/* Schedule page: the dark timeline comes from program.css; this file is the city map + timetable section. */
.c-schedule-map :where(h2, p) { margin: 0; }
.c-schedule-map { overflow: hidden; background: #f2ebe3; color: #000; }
.c-schedule-map__inner { position: relative; height: 724px; }
.c-schedule-map__art { position: absolute; top: -39px; left: 124px; width: 529px; height: auto; pointer-events: none; }
.c-schedule-map__tabs { position: absolute; top: 110px; left: 309px; width: 239px; height: 449px; }
.c-schedule-map__tab { position: absolute; display: flex; align-items: center; gap: 10px; height: 57px; padding: 10px; border: 0; background: none; cursor: pointer; font: inherit; }
.c-schedule-map__tab--ha-noi { top: -7.5px; left: -5px; }
.c-schedule-map__tab--da-nang { top: calc(50% - 29px); left: 86px; }
.c-schedule-map__tab--sai-gon { top: 403.5px; left: 31px; }
.c-schedule-map__pin { flex: none; width: 14px; height: 14px; background: url("../img/schedule-pin.svg") center / 100% 100% no-repeat; }
.c-schedule-map__tab.is-active .c-schedule-map__pin { background-image: url("../img/schedule-pin-active.svg"); }
.c-schedule-map__label { padding: 5px; border-radius: 4px; background: #f2ebe3; color: var(--c-crimson); font: 500 22px/32px var(--font-display); white-space: nowrap; }
.c-schedule-map__table { position: absolute; top: calc(50% - 20px); left: 676px; display: flex; flex-direction: column; gap: 18px; transform: translateY(-50%); }
.c-schedule-map__table[hidden] { display: none; }
.c-schedule-map__course-title { height: 52px; margin-bottom: -13px; padding: 10px; color: var(--c-crimson); font: 500 22px/32px var(--font-display); white-space: nowrap; }
.c-schedule-map__row { display: grid; grid-template-columns: 168px 73px 83px; gap: 5px; margin-bottom: -10px; font: 400 18px/1.386 var(--font-ui); white-space: nowrap; }
.c-schedule-map__row:last-child { margin-bottom: 0; }
.c-schedule-map__row > * { display: flex; align-items: center; padding: 10px; }
.c-schedule-map__row > :first-child { font: 500 22px/32px var(--font-display); }
.c-schedule-map__row strong { padding-inline: 5px; font-weight: 700; }
.c-schedule-map__empty { font: 400 18px/1.386 var(--font-ui); }

@media (max-width: 1199px) {
  .c-schedule-map__inner { display: flex; flex-direction: column; align-items: center; gap: 24px; height: auto; padding-block: 48px; }
  .c-schedule-map__art { display: none; }
  .c-schedule-map__tabs, .c-schedule-map__table { position: static; transform: none; }
  .c-schedule-map__tabs { display: flex; flex-wrap: wrap; justify-content: center; width: auto; height: auto; }
  .c-schedule-map__tab { position: static; }
  .c-schedule-map__table { max-width: 100%; overflow-x: auto; }
}