/* Appointment overview: separate doctor and exam cards. */
main .section.appointment-overview { padding-top: 3rem; padding-bottom: 3rem; background: #f6f8fa; }
.appointment-cards { max-width: 960px; display: grid; gap: 2rem; }
.appointment-card { min-width: 0; padding: 2rem; border: 1px solid #dce4e9; border-top: 4px solid #167a89; border-radius: 14px; background: #fff; box-shadow: 0 6px 22px rgba(25, 52, 66, .05); }
.appointment-card--exam { border-top-color: #24659a; }
.appointment-card__header { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.25rem; }
.appointment-card__icon { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 52px; height: 52px; border-radius: 12px; background: #e8f5f4; color: #167a89; font-size: 1.6rem; }
.appointment-card--exam .appointment-card__icon { background: #ebf2fa; color: #24659a; }
.appointment-card__title { margin: 0; color: #263541; font-size: 1.5rem; line-height: 1.25; font-weight: 700; overflow-wrap: anywhere; }
.appointment-card__intro { margin-bottom: 1.5rem; }
.appointment-card__dates { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.appointment-card__dates:focus-visible { outline: 2px solid #24659a; outline-offset: 4px; }
.appointment-card__dates .table { width: 100%; margin-bottom: 0; }
.appointment-card__dates .table th { background: #f0f4f7; color: #263541; }
.appointment-card__dates .table th, .appointment-card__dates .table td { padding: .7rem .8rem; border-color: #dce4e9; vertical-align: top; }
.appointment-card__dates .table th:first-child, .appointment-card__dates .table td:first-child,
.appointment-card__dates .table th:nth-child(2), .appointment-card__dates .table td:nth-child(2) { white-space: nowrap; }
@media (max-width: 600px) {
  main .section.appointment-overview { padding: 1.5rem 1rem; }
  .appointment-cards { gap: 1.25rem; }
  .appointment-card { padding: 1.25rem 1rem; border-radius: 10px; }
  .appointment-card__header { gap: .75rem; }
  .appointment-card__icon { flex-basis: 42px; height: 42px; font-size: 1.3rem; }
  .appointment-card__title { font-size: 1.3rem; }
  .appointment-card__dates .table th, .appointment-card__dates .table td { padding: .6rem; }
  .appointment-card--exam .table { min-width: 500px; }
}

/* Location descriptions may contain lists from the appointment database. */
.appointment-card__dates td.edb-info ul,
.appointment-card__dates td.edb-info ol {
  list-style: none;
  margin: 0;
  padding: 0;
}
.appointment-card__dates td.edb-info li::marker { content: ''; }

/* More breathing room between navigation and appointment cards. */
main .section.appointment-overview { padding-top: 4.5rem; }
@media (max-width: 600px) {
  main .section.appointment-overview { padding-top: 3rem; }
}