/**
 * Helper function for downsize mixin.
 */
/**
 * Downsize a CSS property using the viewport to affect calc().
 *
 * @param {string} $property: The property to be affected.
 * @param {string|list} $min: The min value / values.
 * @param {string|list} $max: The max value / values.
 * @param {string} $viewport: The biggest viewport, which the property must be calculated. NOTE: we use media-breakpoint-down here!
 * @param {boolean} $default: True if the default property must be set, regardless of the viewport size.
 * @param {list} $min-limit: A list containing the min viewport and the min value.
 */
#course-detail-page .module-cards.person-card.minimal {
  margin-bottom: 16px;
}
#course-detail-page .module-cards.person-card.minimal:has(+ .module-header) {
  margin-bottom: 0;
}
@media (max-width: 1199.98px) {
  #course-detail-page #course-list-sticky {
    position: fixed;
    bottom: -2rem;
    left: 0;
    z-index: 10;
    padding: 0;
    transition: opacity 0.3s, transform 0.3s;
    transform: translateY(100%);
  }
  #course-detail-page #course-list-sticky.show {
    transform: translateY(0);
  }
  #course-detail-page #course-list-sticky .module-cards .card {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    box-shadow: 0 -0.125rem 0.25rem 0 rgba(0, 0, 0, 0.12), 0 -0.25rem 1rem 0 rgba(0, 0, 0, 0.08);
  }
  #course-detail-page #course-list-sticky .module-cards .card .icons {
    display: none !important;
  }
  #course-detail-page #course-list-sticky.fade {
    opacity: 0;
    pointer-events: none;
  }
}
@media (min-width: 1200px) {
  #course-detail-page .page-sidebar {
    position: sticky;
    top: 120px;
  }
}

body.is-course-detail #body-container {
  overflow-x: visible;
}

#course-appointments-modal table {
  width: 100% !important;
}
#course-appointments-modal .modal-dialog.modal-dialog-scrollable {
  max-height: 80vh;
}