:root {
  --esx-native-bg: #f6f8fb;
  --esx-native-surface: #ffffff;
  --esx-native-surface-soft: #f8fafc;
  --esx-native-text: #0f172a;
  --esx-native-muted: #475569;
  --esx-native-border: rgba(15, 23, 42, .12);
  --esx-native-accent: #158f88;
  --esx-native-accent-strong: #0f766e;
  --esx-native-shadow: 0 18px 50px rgba(15, 23, 42, .08);
}

html[data-esx-theme="dark"] {
  --esx-native-bg: #07111f;
  --esx-native-surface: #101b32;
  --esx-native-surface-soft: #0b1628;
  --esx-native-text: #e5edf7;
  --esx-native-muted: #b9c6d8;
  --esx-native-border: rgba(226, 232, 240, .16);
  --esx-native-accent: #38d5c8;
  --esx-native-accent-strong: #67e8f9;
  --esx-native-shadow: 0 22px 70px rgba(0, 0, 0, .32);
}

body[class*="path-mod-"] {
  background: var(--esx-native-bg) !important;
  color: var(--esx-native-text) !important;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

body[class*="path-mod-"] #page,
body[class*="path-mod-"] #page-content,
body[class*="path-mod-"] #region-main,
body[class*="path-mod-"] [role="main"] {
  background: transparent !important;
  color: var(--esx-native-text) !important;
}

body[class*="path-mod-"] #region-main {
  max-width: 1120px;
  margin-left: auto;
  margin-right: auto;
}

body[class*="path-mod-"] .card,
body[class*="path-mod-"] .que,
body[class*="path-mod-"] .box,
body[class*="path-mod-"] .generalbox,
body[class*="path-mod-"] .quizinfo,
body[class*="path-mod-"] .quizattemptsummary,
body[class*="path-mod-"] .generaltable,
body[class*="path-mod-"] .mform fieldset {
  background: var(--esx-native-surface) !important;
  color: var(--esx-native-text) !important;
  border-color: var(--esx-native-border) !important;
  border-radius: 14px !important;
  box-shadow: var(--esx-native-shadow);
}

body[class*="path-mod-"] h1,
body[class*="path-mod-"] h2,
body[class*="path-mod-"] h3,
body[class*="path-mod-"] h4,
body[class*="path-mod-"] p,
body[class*="path-mod-"] label,
body[class*="path-mod-"] .qtext,
body[class*="path-mod-"] .answer,
body[class*="path-mod-"] .formulation,
body[class*="path-mod-"] .description,
body[class*="path-mod-"] .activity-description,
body[class*="path-mod-"] .no-overflow {
  color: var(--esx-native-text) !important;
}

body[class*="path-mod-"] small,
body[class*="path-mod-"] .text-muted,
body[class*="path-mod-"] .dimmed,
body[class*="path-mod-"] .muted,
body[class*="path-mod-"] .fdescription,
body[class*="path-mod-"] .breadcrumb,
body[class*="path-mod-"] .breadcrumb a {
  color: var(--esx-native-muted) !important;
}

body[class*="path-mod-"] a {
  color: var(--esx-native-accent) !important;
}

body[class*="path-mod-"] .btn-primary,
body[class*="path-mod-"] input[type="submit"],
body[class*="path-mod-"] button[type="submit"],
body[class*="path-mod-"] .singlebutton button,
body[class*="path-mod-"] .mod_quiz-next-nav {
  background: linear-gradient(135deg, var(--esx-native-accent), var(--esx-native-accent-strong)) !important;
  border-color: transparent !important;
  color: #ffffff !important;
  border-radius: 999px !important;
  font-weight: 750 !important;
  box-shadow: 0 12px 28px rgba(21, 143, 136, .22);
}

body[class*="path-mod-"] .btn-secondary,
body[class*="path-mod-"] .btn-default,
body[class*="path-mod-"] button:not([type="submit"]) {
  border-color: var(--esx-native-border) !important;
  color: var(--esx-native-text) !important;
  background: var(--esx-native-surface-soft) !important;
  border-radius: 999px !important;
}

body[class*="path-mod-"] table,
body[class*="path-mod-"] .generaltable {
  overflow: hidden;
}

body[class*="path-mod-"] .generaltable th {
  background: var(--esx-native-surface-soft) !important;
  color: var(--esx-native-text) !important;
  border-color: var(--esx-native-border) !important;
}

body[class*="path-mod-"] .generaltable td {
  border-color: var(--esx-native-border) !important;
  color: var(--esx-native-text) !important;
}

body[class*="path-mod-"] .modal,
body[class*="path-mod-"] .moodle-dialogue-base {
  color: var(--esx-native-text) !important;
}

body[class*="path-mod-"] .modal-content,
body[class*="path-mod-"] .moodle-dialogue-wrap {
  background: var(--esx-native-surface) !important;
  color: var(--esx-native-text) !important;
  border-color: var(--esx-native-border) !important;
  border-radius: 16px !important;
}

body[class*="path-mod-"] #page-footer,
body[class*="path-mod-"] .footer {
  background: var(--esx-native-surface-soft) !important;
  color: var(--esx-native-muted) !important;
  border-top: 1px solid var(--esx-native-border) !important;
}

@media (max-width: 768px) {
  body[class*="path-mod-"] #region-main {
    padding: 12px !important;
  }

  body[class*="path-mod-"] .que,
  body[class*="path-mod-"] .card,
  body[class*="path-mod-"] .box,
  body[class*="path-mod-"] .generalbox {
    border-radius: 12px !important;
  }
}
