/* Medical Exam shared design foundation. */
:root {
  --me-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --me-primary: #17324d;
  --me-primary-dark: #10263a;
  --me-accent: #0b6fa4;
  --me-success: #16724a;
  --me-success-bg: #ecfdf3;
  --me-danger: #b42318;
  --me-danger-bg: #fff1f0;
  --me-warning: #946200;
  --me-warning-bg: #fff8e6;
  --me-bg: #f4f7fa;
  --me-card: #ffffff;
  --me-card-bg: #ffffff;
  --me-border: #cfd8e3;
  --me-text: #182230;
  --me-muted: #526173;
  --me-radius: 8px;
  --me-shadow: 0 1px 2px rgba(16, 38, 58, .05), 0 8px 24px rgba(16, 38, 58, .06);
  --ct-bg: #f4f7fa;
  --ct-card: #ffffff;
  --ct-border: #cfd8e3;
  --ct-blue: #17324d;
  --ct-blue2: #0b6fa4;
  --ct-green: #16724a;
  --ct-red: #b42318;
  --ct-text: #182230;
  --ct-muted: #526173;
  --ct-sub: #68778a;
  --ct-step: #0b6fa4;
  --ct-radius: 8px;
}

[class^='me-'],
[class*=' me-'],
[id^='me-'] {
  font-family: var(--me-font) !important;
  letter-spacing: 0;
}

:where(.me-auth-page, .me-profile-layout, .me-video-library, .me-video-page,
  .me-course-page, .me-courses-page, .me-exams-page, .me-ct, .me-history,
  .me-launcher, .me-results-page) {
  color: var(--me-text);
  font-family: var(--me-font) !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

:where(.me-auth-page, .me-profile-layout, .me-video-library, .me-video-page,
  .me-course-page, .me-courses-page, .me-exams-page, .me-ct, .me-history,
  .me-launcher, .me-results-page) :where(button, input, select, textarea) {
  color: var(--me-text);
  font: inherit;
}

:where(.me-auth-page, .me-profile-layout, .me-video-library, .me-video-page,
  .me-course-page, .me-courses-page, .me-exams-page, .me-ct, .me-history,
  .me-launcher, .me-results-page) :where(h1, h2, h3, h4, h5, h6) {
  color: var(--me-text);
  font-family: var(--me-font) !important;
  letter-spacing: 0;
}

:where(.me-course-meta, .me-course-enrolled-sub, .me-exams-sub, .me-video-meta-row,
  .me-auth-sub, .me-form-field label, .me-stat-label, .me-empty-state,
  .me-panel-subtitle, .me-ct-section__sub, .me-mode__desc, .me-pool__desc) {
  color: var(--me-muted) !important;
}

:where(.me-course-card, .me-stat-card, .me-auth-card, .me-ct-section,
  .me-mode, .me-profile-main, .me-perf-card, .me-perf-section) {
  border-color: var(--me-border) !important;
  border-radius: var(--me-radius) !important;
}

:where(.me-form-field input, .me-form-field select, .me-form-field textarea,
  .me-auth-field input, .me-auth-field select, .me-ct input, .me-ct select,
  .me-ct textarea) {
  background: #ffffff !important;
  border-color: #b8c4d1 !important;
  color: var(--me-text) !important;
}

:where(.me-form-field input, .me-form-field select, .me-form-field textarea,
  .me-auth-field input, .me-auth-field select, .me-ct input, .me-ct select,
  .me-ct textarea)::placeholder {
  color: #68778a;
  opacity: 1;
}

:where(.me-quick-btn, .me-course-btn, .me-auth-submit, .me-btn-start,
  .me-exams-action--primary, .me-ct-submit) {
  border-radius: 6px !important;
  font-weight: 700;
}

:where(.me-quick-btn, .me-course-btn, .me-auth-submit, .me-btn-start,
  .me-exams-action--primary, .me-ct-submit):focus-visible,
:where(.me-auth-page, .me-profile-layout, .me-video-library, .me-video-page,
  .me-course-page, .me-courses-page, .me-exams-page, .me-ct, .me-history,
  .me-launcher, .me-results-page) :where(a, button, input, select, textarea):focus-visible {
  outline: 3px solid rgba(11, 111, 164, .3) !important;
  outline-offset: 2px;
}

.me-ct {
  background: var(--me-bg) !important;
  color: var(--me-text) !important;
  font-family: var(--me-font) !important;
}

.me-ct-step,
.me-ct-section__title,
.me-mode__title,
.me-count-label,
.me-ct-submit {
  font-family: var(--me-font) !important;
}

.me-profile-main,
.me-video-library,
.me-exams-page,
.me-courses-page {
  background: var(--me-bg);
}

.me-history-table th {
  color: #4b5a6d !important;
}

.me-history-table td,
.me-course-title,
.me-lecture-title,
.me-video-title {
  color: var(--me-text) !important;
}

@media (max-width: 760px) {
  .me-profile-layout {
    display: block;
    min-height: 0;
  }

  .me-profile-sidebar {
    width: 100%;
    min-height: 0;
  }

  .me-profile-nav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .me-profile-main {
    padding: 18px 14px;
    overflow: visible;
  }

  .me-stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .me-form-grid,
  .me-mode-row {
    grid-template-columns: 1fr;
  }

  .me-video-library,
  .me-exams-page,
  .me-courses-page,
  .me-ct {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

@media (max-width: 420px) {
  .me-profile-nav {
    grid-template-columns: 1fr;
  }

  .me-stats-grid {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
}
