@font-face {
    font-family: 'Font';
    src: url(https://files.inspire360.tech/merritheweducation/68bb53e902c25c34f30ecb1f.zip);
    font-display: fallback;
    font-size: 2rem;
    font-weight: inherit;
    font-style: inherit;
}
[data-dapr-font="Font"],
    body.section-public #page-container *[data-dapr-font="Font"] {
    font-family: Font !important;
}

.section-public #page-container *:not(.fa):not([class*="vjs-"]),
.section-public #footer *:not(.fa):not([class*="vjs-"]) { font-family: Font; }

.navbar.navbar-subdom {
    background: #f5f5f5 !important;
    -webkit-box-shadow: 0 0 3px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 0 3px rgba(0,0,0,0.2);
    box-shadow: 0 0 3px rgba(0,0,0,0.2);
    z-index: 2;
}

.navbar.navbar-subdom .navbar-nav > li > a,
.navbar.navbar-subdom #my-account-drop,
.navbar.navbar-subdom .mobile-menu-toggle {
    color: #54585a;
    transition: color 0.15s ease-in-out, background 0.15s ease-in-out;
}

.navbar.navbar-subdom .nav > li > a:hover,
.navbar.navbar-subdom .nav > li > a:focus,
.navbar.navbar-subdom .nav > li.active > a,
.navbar.navbar-subdom .nav > li.open > a,
.navbar.navbar-subdom .nav > li.open > a:hover,
.navbar.navbar-subdom .nav > li.open > a:focus,
.profile-login.btn-login.btn.btn-trans {
    color: #823d5f !important;
    background: #ffffff !important;
    transition: color 0.15s ease-in-out, background 0.15s ease-in-out;
}

.subdom .navbar.navbar-admin .navbar-nav>li>a.btn-primary,
.subdom .navbar.navbar-admin .navbar-nav>li>a.btn-primary:hover,
.subdom .navbar.navbar-admin .navbar-nav>li>a.btn-primary:active,
.subdom .navbar.navbar-admin .navbar-nav>li>a.btn-primary:focus {
    color: #ffffff;
    background-color: #6b7f8c;
}
.subdom .navbar.navbar-admin .navbar-nav>li>a.btn-primary .fa {
    color: #ffffff;
}

body.section-public {
    background-color: #ffffff !important;
    background-image: none;
}

.section-public .nav-tabs>li.active>a,
.section-public .nav-tabs>li.active>a:hover,
.section-public .nav-tabs>li.active>a:focus {
    background-color: #ffffff;
}

a,
a:active,
a:hover,
a:focus {
    color: #6b7f8c;
}
.text-completed { color: #a89157 !important; }
.bg-completed { background-color: #a89157 !important; }
.border-completed { border-color: #a89157 !important; }

body.section-public .btn-primary,
body.section-public .btn-primary:hover,
body.section-public .btn-primary:active,
body.section-public .btn-primary:focus,
body.section-public .btn-primary[disabled],
body.section-public .btn-primary.disabled,
body.section-public li.for-button a.btn.btn-primary {
    color: #ffffff !important;
    background-color: #6b7f8c !important;
    border-color: #6b7f8c !important;
}

.box .box-title-bg,
.box .box-title-row,
.box .box-title.box-title-bg,
.box.white .box-title.box-title-bg,
.box.white .box-title-bg {
    color: #555;
    background-color: #f5f5f5;
}

.box>h1 {
    color: #000000 !important;
}

.box .box-title-bg .box-title,
.box.white .box-title-bg .box-title {
    color: #555;
}

.nav-tabs li.for-button { padding-top: 5px; }
.nav-tabs li.for-button a.btn {
    padding: 5px 15px;
    border: none;
    border-radius: 3px;
}


.bg-primary,
.nav-pills>li.active>a:hover {
color: #ffffff;
background-color: #6b7f8c;
}
.section-public .bg-primary-inverted {
color: #6b7f8c;
background-color: #ffffff;
}


body.section-public.login,
#auth-bg {
}


#footer {
    color: #54585a !important;
    text-decoration: none;
    background: #f5f5f5 !important;
    border-top: 4px solid #54585a !important;
    border-width: 4px 0 0 0;
    padding: 15px 0;
    min-height: 100px;
}
#footer a {
    color: #54585a !important;
}

.section-public .table-striped > tbody > tr:nth-child(odd) {
    background-color: #ffffff;
}

/* ===========================
   Inspire360 — Typography Map
   - Uses your uploaded font via CSS Reference: 'Font'
   - Tune sizes at :root to scale everything
   =========================== */

:root{
  /* Global scale */
  --size-base: 16px;

  /* Page text */
  --text-size: 1rem;          /* base 16px */
  --text-line: 1.65;

  /* Headers */
  --h1: 2.25rem;
  --h2: 1.75rem;
  --h3: 1.35rem;

  /* Header & Footer blocks */
  --header-size: 1rem;        /* nav/item text */
  --footer-size: 0.9rem;

  /* Auth pages (sign in / register) */
  --auth-title: 1.75rem;
  --auth-label: 0.95rem;
  --auth-input: 1rem;
  --auth-button: 1rem;
}

/* 1) Global font application (includes form controls) */
html{ font-size: var(--size-base); }
body,
input, select, textarea, button {
  font-family: 'Font', "Helvetica Neue", Arial, sans-serif !important;
  font-size: var(--text-size);
  line-height: var(--text-line);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #222;
}

/* 2) Page content sizing */
main, .page-content, .content, .container {
  font-size: var(--text-size);
  line-height: var(--text-line);
}
h1{ font-size: var(--h1); line-height: 1.2; font-weight: 700; }
h2{ font-size: var(--h2); line-height: 1.25; font-weight: 600; }
h3{ font-size: var(--h3); line-height: 1.3;  font-weight: 600; }
p, li { font-size: var(--text-size); }

/* 3) Header sizing */
header, .site-header, .main-header, .navbar {
  font-size: var(--header-size);
}
header h1, .site-header h1, .navbar-brand {
  font-size: var(--h2);
  font-weight: 700;
}

/* 4) Footer sizing */
footer, .site-footer {
  font-size: var(--footer-size);
  line-height: 1.5;
}
footer small { font-size: 0.8rem; }

/* 5) Sign-in / Register pages
   These selectors cover common Inspire360 auth layouts.
   Keep all; harmless if a class isn't present on your theme. */
body[class*="sign-in"],
body[class*="signin"],
body[class*="sign_in"],
body[class*="login"],
body[class*="sign-up"],
body[class*="signup"],
body[class*="sign_up"],
body[class*="register"] {
  font-size: var(--text-size);
}

body[class*="sign-"], body[class*="login"], body[class*="register"] h1,
.auth, .auth__title, .login__title, .registration__title {
  font-size: var(--auth-title);
  font-weight: 600;
}

.auth label, .login label, .registration label,
.form-label {
  font-size: var(--auth-label);
  font-weight: 500;
}

.auth input, .login input, .registration input,
.form-control {
  font-size: var(--auth-input);
  padding: 0.75rem;
}

.auth button, .login button, .registration button,
button[type="submit"], .btn-primary {
  font-size: var(--auth-button);
  padding: 0.75rem 1.25rem;
}

/* 6) Responsive tweaks */
@media (max-width: 768px){
  :root{
    --size-base: 15px;
    --h1: 2rem;
    --h2: 1.5rem;
  }
  header, .site-header { font-size: 0.95rem; }
  footer, .site-footer { font-size: 0.85rem; }
}
@media (max-width: 480px){
  :root{
    --size-base: 14px;
    --h1: 1.6rem;
    --h2: 1.35rem;
  }
}

/* Optional: map bold/semibold if you uploaded multiple weights */
strong, b { font-weight: 700; }
em { font-style: italic; }