/* =========================================================
   SCHOOLHUB — ACCOUNT AREA
   Phase 2 (corrected)
   - Hide WordPress admin bar on Tutor frontend dashboard.
   - Hide Tutor LMS mobile dashboard navigation.
   - Style the Tutor dashboard without changing its internal
     button/layout behavior.
   ========================================================= */


/* ---------------------------------------------------------
   WORDPRESS ADMIN BAR
   --------------------------------------------------------- */

body.tutor-screen-frontend-dashboard #wpadminbar {
  display: none !important;
}


/* ---------------------------------------------------------
   TUTOR LMS MOBILE BOTTOM NAV
   --------------------------------------------------------- */

body.tutor-screen-frontend-dashboard .tutor-dashboard-nav-mobile {
  display: none !important;
}


/* ---------------------------------------------------------
   DASHBOARD CANVAS
   --------------------------------------------------------- */

body.tutor-screen-frontend-dashboard {
  background: var(--surface, #F8FAFC);
  color: var(--text-dark, #0F172A);
  font-family: var(--font-main, "Cairo", sans-serif);
}

body.tutor-screen-frontend-dashboard .tutor-dashboard-layout,
body.tutor-screen-frontend-dashboard .tutor-dashboard-main,
body.tutor-screen-frontend-dashboard .tutor-dashboard-body {
  background: var(--surface, #F8FAFC);
  color: var(--text-dark, #0F172A);
}

body.tutor-screen-frontend-dashboard .tutor-dashboard-page {
  box-sizing: border-box;
}


/* ---------------------------------------------------------
   TUTOR DASHBOARD HEADER
   Keep Tutor's structure; only clean up its appearance.
   --------------------------------------------------------- */

body.tutor-screen-frontend-dashboard .tutor-dashboard-header {
  background: var(--white, #FFFFFF);
  border-bottom: 1px solid var(--border, #E2E8F0);
  box-shadow: 0 2px 12px rgba(15, 23, 42, 0.04);
}

body.tutor-screen-frontend-dashboard .tutor-dashboard-header-inner {
  box-sizing: border-box;
  width: 100%;
  direction: rtl;
}

body.tutor-screen-frontend-dashboard .tutor-dashboard-header-left,
body.tutor-screen-frontend-dashboard .tutor-dashboard-header-right {
  box-sizing: border-box;
}

body.tutor-screen-frontend-dashboard .tutor-dashboard-header-left {
  text-align: right;
}

body.tutor-screen-frontend-dashboard .tutor-dashboard-header-left .tutor-h5 {
  margin: 0;
  color: var(--primary-dark, #042C53);
  font-family: var(--font-main, "Cairo", sans-serif);
  font-weight: 800;
  line-height: 1.6;
}

body.tutor-screen-frontend-dashboard .tutor-dashboard-header-left .tutor-text-subdued {
  color: var(--text-gray, #5F5E5A);
  font-weight: 500;
}

body.tutor-screen-frontend-dashboard .tutor-dashboard-header-left .tutor-tiny {
  color: var(--text-gray, #5F5E5A);
  font-family: var(--font-main, "Cairo", sans-serif);
}


/* User avatar — visual only, no layout rewrite. */
body.tutor-screen-frontend-dashboard .tutor-dashboard-header-user-avatar {
  border: 1px solid var(--border, #E2E8F0);
  border-radius: 50%;
  background: var(--white, #FFFFFF);
  color: var(--primary, #1E3A8A);
  box-shadow: none;
}

body.tutor-screen-frontend-dashboard .tutor-dashboard-header-user-avatar:hover,
body.tutor-screen-frontend-dashboard .tutor-dashboard-header-user-avatar:focus-visible {
  border-color: var(--border-strong, #85B7EB);
  background: var(--surface, #F8FAFC);
}


/* ---------------------------------------------------------
   DASHBOARD BODY
   --------------------------------------------------------- */

body.tutor-screen-frontend-dashboard .tutor-dashboard-body {
  width: 100%;
  box-sizing: border-box;
}

body.tutor-screen-frontend-dashboard .tutor-dashboard-body > .tutor-dashboard-page {
  width: min(100%, 1120px);
  margin-inline: auto;
}


/* ---------------------------------------------------------
   DASHBOARD SECTION FILTER
   --------------------------------------------------------- */

body.tutor-screen-frontend-dashboard .tutor-dashboard-home-sort > button {
  border-color: var(--border, #E2E8F0);
  border-radius: var(--radius-sm, 10px);
  background: var(--white, #FFFFFF);
  color: var(--primary, #1E3A8A);
  box-shadow: var(--shadow-soft, 0 8px 24px rgba(15, 23, 42, 0.06));
}


/* ---------------------------------------------------------
   STAT CARDS
   --------------------------------------------------------- */

body.tutor-screen-frontend-dashboard [data-section-id="current_stats"] {
  margin: 0 !important;
  gap: 14px !important;
}

body.tutor-screen-frontend-dashboard [data-section-id="current_stats"] > .tutor-flex-1 {
  min-width: 0;
  margin: 0 !important;
}

body.tutor-screen-frontend-dashboard .tutor-stat-card {
  min-height: 148px;
  height: 100%;
  box-sizing: border-box;
  padding: 18px;
  overflow: hidden;
  border: 1px solid var(--border, #E2E8F0);
  border-radius: var(--radius-md, 16px);
  background: var(--white, #FFFFFF);
  box-shadow: var(--shadow-soft, 0 8px 24px rgba(15, 23, 42, 0.06));
  font-family: var(--font-main, "Cairo", sans-serif);
}

body.tutor-screen-frontend-dashboard .tutor-stat-card:hover {
  box-shadow: var(--shadow-hover, 0 14px 30px rgba(15, 23, 42, 0.10));
}

body.tutor-screen-frontend-dashboard .tutor-stat-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

body.tutor-screen-frontend-dashboard .tutor-stat-card-title {
  color: var(--text-gray, #5F5E5A);
  font-family: var(--font-main, "Cairo", sans-serif);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.7;
}

body.tutor-screen-frontend-dashboard .tutor-stat-card-icon {
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--surface, #F8FAFC);
  color: var(--primary, #1E3A8A);
}

body.tutor-screen-frontend-dashboard .tutor-stat-card-icon svg {
  width: 20px;
  height: 20px;
}

body.tutor-screen-frontend-dashboard .tutor-stat-card-content {
  display: flex;
  align-items: flex-end;
  min-height: 70px;
  margin-top: auto;
}

body.tutor-screen-frontend-dashboard .tutor-stat-card-value {
  color: var(--primary-dark, #042C53);
  font-family: var(--font-main, "Cairo", sans-serif);
  font-size: 32px;
  font-weight: 800;
  line-height: 1.15;
}

body.tutor-screen-frontend-dashboard .tutor-stat-card-brand .tutor-stat-card-icon {
  background: var(--math-bg, #EEF2FF);
  color: var(--math-text, #3730A3);
}

body.tutor-screen-frontend-dashboard .tutor-stat-card-exception1 .tutor-stat-card-icon {
  background: var(--teal-bg, #E1F5EE);
  color: var(--teal-sub, #0F6E56);
}

body.tutor-screen-frontend-dashboard .tutor-stat-card-exception4 .tutor-stat-card-icon {
  background: #FFF7ED;
  color: var(--gold, #F59E0B);
}

body.tutor-screen-frontend-dashboard .tutor-stat-card-exception5 .tutor-stat-card-icon {
  background: var(--science-bg, #ECFDF5);
  color: var(--science-text, #047857);
}


/* ---------------------------------------------------------
   DASHBOARD CHART
   --------------------------------------------------------- */

body.tutor-screen-frontend-dashboard [data-section-id="course_completion_and_leader"] {
  margin: 0 !important;
}

body.tutor-screen-frontend-dashboard .tutor-dashboard-home-chart {
  box-sizing: border-box;
  border: 1px solid var(--border, #E2E8F0);
  border-radius: var(--radius-md, 16px);
  background: var(--white, #FFFFFF);
  box-shadow: var(--shadow-soft, 0 8px 24px rgba(15, 23, 42, 0.06));
}

body.tutor-screen-frontend-dashboard .tutor-dashboard-home-chart .tutor-small {
  color: var(--text-gray, #5F5E5A);
  font-family: var(--font-main, "Cairo", sans-serif);
  font-weight: 700;
}


/* ---------------------------------------------------------
   TYPOGRAPHY
   --------------------------------------------------------- */

body.tutor-screen-frontend-dashboard .tutor-dashboard-body,
body.tutor-screen-frontend-dashboard .tutor-dashboard-body * {
  font-family: var(--font-main, "Cairo", sans-serif);
}

body.tutor-screen-frontend-dashboard .tutor-dashboard-body a {
  text-decoration: none;
}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 767px) {

  body.tutor-screen-frontend-dashboard .tutor-dashboard-header-inner {
    min-height: 72px;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-header-left {
    order: 1;
    flex: 1 1 auto;
    min-width: 0;
    text-align: right;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-header-right {
    order: 2;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-header-left .tutor-h5 {
    font-size: 16px;
    line-height: 1.55;
    white-space: nowrap;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-header-left .tutor-tiny {
    display: none;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-header-user-avatar {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-body {
    padding: 18px 14px 90px !important;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-body > .tutor-dashboard-page {
    width: 100%;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-body > .tutor-dashboard-page > form {
    gap: 18px !important;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-home-sort {
    display: none;
  }

  body.tutor-screen-frontend-dashboard [data-section-id="current_stats"] {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px !important;
  }

  body.tutor-screen-frontend-dashboard [data-section-id="current_stats"] > .tutor-flex-1 {
    width: auto !important;
    flex: none !important;
  }

  body.tutor-screen-frontend-dashboard .tutor-stat-card {
    min-height: 150px;
    padding: 16px 14px;
    border-radius: 16px;
  }

  body.tutor-screen-frontend-dashboard .tutor-stat-card-title {
    max-width: 78%;
    font-size: 13px;
    line-height: 1.6;
  }

  body.tutor-screen-frontend-dashboard .tutor-stat-card-icon {
    width: 32px;
    height: 32px;
  }

  body.tutor-screen-frontend-dashboard .tutor-stat-card-value {
    font-size: 30px;
  }

  body.tutor-screen-frontend-dashboard [data-section-id="course_completion_and_leader"] {
    margin-top: 0 !important;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-home-chart {
    border-radius: 16px;
    overflow: hidden;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-home-chart .tutor-dashboard-home-chart-canvas {
    max-width: 100%;
  }
}


/* ---------------------------------------------------------
   DESKTOP
   --------------------------------------------------------- */

@media (min-width: 768px) {

  body.tutor-screen-frontend-dashboard .tutor-dashboard-body {
    padding: 28px 32px 56px;
  }

  body.tutor-screen-frontend-dashboard [data-section-id="current_stats"] {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  body.tutor-screen-frontend-dashboard [data-section-id="current_stats"] > .tutor-flex-1 {
    width: auto !important;
    flex: none !important;
  }
}


/* =========================================================
   SCHOOLHUB — DASHBOARD HEADER REFINEMENT
   Focused mobile fix: keep Tutor's welcome header functional,
   but remove the floating/overlapping look.
   ========================================================= */

@media (max-width: 767px) {

  body.tutor-screen-frontend-dashboard .tutor-dashboard-main {
    overflow: visible !important;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-header {
    position: relative !important;
    z-index: 2;
    width: 100%;
    min-height: 64px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: var(--white, #FFFFFF) !important;
    border-top: 0 !important;
    border-bottom: 1px solid var(--border, #E2E8F0) !important;
    box-shadow: none !important;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-header-inner {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    min-height: 64px !important;
    margin: 0 !important;
    padding: 10px 16px !important;
    box-sizing: border-box !important;
    direction: rtl !important;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-header-left {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: right !important;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-header-left .tutor-h5 {
    display: block !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    text-align: right !important;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-header-right {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-header-user {
    position: static !important;
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-header-user-avatar {
    position: static !important;
    transform: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    border: 1px solid var(--border-strong, #85B7EB) !important;
    border-radius: 50% !important;
    background: var(--white, #FFFFFF) !important;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06) !important;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-body {
    padding-top: 16px !important;
  }
}


/* =========================================================
   SCHOOLHUB — DASHBOARD HEADER FLOW FIX
   Keep the Tutor welcome header in normal document flow.
   Prevents overlap with the stats and removes the large
   blank area above the welcome row on mobile.
   ========================================================= */

@media (max-width: 767px) {

  body.tutor-screen-frontend-dashboard .tutor-dashboard-layout,
  body.tutor-screen-frontend-dashboard .tutor-dashboard-main {
    margin: 0 !important;
    padding: 0 !important;
    top: auto !important;
    transform: none !important;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-header {
    position: static !important;
    inset: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    margin: 0 !important;
    padding: 0 !important;
    height: auto !important;
    min-height: 0 !important;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-header-inner {
    position: static !important;
    top: auto !important;
    inset: auto !important;
    transform: none !important;
    min-height: 64px !important;
    height: 64px !important;
    margin: 0 !important;
    padding: 10px 16px !important;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-body,
  body.tutor-screen-frontend-dashboard .tutor-dashboard-header + .tutor-dashboard-body {
    position: static !important;
    margin: 0 !important;
    top: auto !important;
    inset: auto !important;
    transform: none !important;
    padding-top: 16px !important;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-page {
    position: static !important;
    margin-top: 0 !important;
  }
}


/* =========================================================
   SCHOOLHUB — LOGIN
   Dashboard page when the user is logged out.
   ========================================================= */

body.tutor-screen-frontend-dashboard .tutor-login-wrap {
  width: min(100%, 520px) !important;
  max-width: 520px !important;
  margin: 34px auto 58px !important;
  padding: 0 !important;
  overflow: hidden;
  box-sizing: border-box;
  background: var(--white, #FFFFFF);
  border: 1px solid var(--border, #E2E8F0);
  border-radius: var(--radius-lg, 24px);
  box-shadow: var(--shadow-soft, 0 8px 24px rgba(15, 23, 42, 0.06));
}

body.tutor-screen-frontend-dashboard .tutor-login-form-wrapper {
  padding: 32px 30px 28px !important;
  box-sizing: border-box;
}

body.tutor-screen-frontend-dashboard .tutor-login-form-wrapper > .tutor-h3 {
  margin: 0 0 24px !important;
  color: var(--primary-dark, #042C53);
  font-family: var(--font-main, "Cairo", sans-serif);
  font-size: 28px !important;
  font-weight: 800 !important;
  line-height: 1.5;
  text-align: center;
}

body.tutor-screen-frontend-dashboard #tutor-login-form {
  direction: rtl;
}

body.tutor-screen-frontend-dashboard #tutor-login-form .tutor-input-field {
  margin-bottom: 14px !important;
}

body.tutor-screen-frontend-dashboard #tutor-login-form .tutor-input {
  width: 100%;
  min-height: 54px;
  box-sizing: border-box;
  padding: 0 16px !important;
  border: 1px solid var(--border, #E2E8F0) !important;
  border-radius: 12px !important;
  background: var(--surface, #F8FAFC) !important;
  color: var(--text-dark, #0F172A) !important;
  font-family: var(--font-main, "Cairo", sans-serif) !important;
  font-size: 15px !important;
  font-weight: 500;
  text-align: right;
  box-shadow: none !important;
}

body.tutor-screen-frontend-dashboard #tutor-login-form .tutor-input::placeholder {
  color: #7A7F87;
  opacity: 1;
}

body.tutor-screen-frontend-dashboard #tutor-login-form .tutor-input:focus {
  border-color: var(--border-strong, #85B7EB) !important;
  background: var(--white, #FFFFFF) !important;
  box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.08) !important;
  outline: none !important;
}

body.tutor-screen-frontend-dashboard #tutor-login-form .tutor-flex.tutor-justify-between.tutor-items-center.tutor-mt-9 {
  margin-top: 8px !important;
}

body.tutor-screen-frontend-dashboard #tutor-login-form .tutor-label {
  color: var(--text-dark, #0F172A);
  font-family: var(--font-main, "Cairo", sans-serif);
  font-size: 13px;
  font-weight: 600;
}

body.tutor-screen-frontend-dashboard #tutor-login-form .tutor-btn-link-gray {
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--primary-text, #185FA5) !important;
  font-family: var(--font-main, "Cairo", sans-serif) !important;
  font-size: 13px !important;
  font-weight: 600;
}

body.tutor-screen-frontend-dashboard #tutor-login-form .tutor-btn-primary.tutor-btn-block {
  width: 100%;
  min-height: 52px;
  margin-top: 20px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: var(--primary, #1E3A8A) !important;
  color: var(--white, #FFFFFF) !important;
  font-family: var(--font-main, "Cairo", sans-serif) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  box-shadow: none !important;
}

body.tutor-screen-frontend-dashboard #tutor-login-form > .tutor-flex.tutor-items-center.tutor-justify-center {
  margin-top: 18px !important;
  padding-top: 2px;
}

body.tutor-screen-frontend-dashboard #tutor-login-form > .tutor-flex.tutor-items-center.tutor-justify-center .tutor-small {
  color: var(--text-gray, #5F5E5A);
  font-family: var(--font-main, "Cairo", sans-serif);
  font-size: 13px;
}

body.tutor-screen-frontend-dashboard #tutor-login-form > .tutor-flex.tutor-items-center.tutor-justify-center .tutor-btn-link {
  padding: 0 !important;
  color: var(--primary-text, #185FA5) !important;
  font-family: var(--font-main, "Cairo", sans-serif) !important;
  font-size: 13px !important;
  font-weight: 700;
}

@media (max-width: 767px) {

  body.tutor-screen-frontend-dashboard .tutor-login-wrap {
    width: calc(100% - 20px) !important;
    max-width: none !important;
    margin: 22px auto 74px !important;
    border-radius: 20px;
  }

  body.tutor-screen-frontend-dashboard .tutor-login-form-wrapper {
    padding: 28px 20px 26px !important;
  }

  body.tutor-screen-frontend-dashboard .tutor-login-form-wrapper > .tutor-h3 {
    margin-bottom: 20px !important;
    font-size: 25px !important;
  }

  body.tutor-screen-frontend-dashboard #tutor-login-form .tutor-input {
    min-height: 52px;
    font-size: 14px !important;
    border-radius: 11px !important;
  }
}



/* =========================================================
   SCHOOLHUB — STUDENT REGISTRATION
   Page ID: 1520
   ========================================================= */

body.page-id-1520 {
  background: var(--surface, #F8FAFC);
  color: var(--text-dark, #0F172A);
  font-family: var(--font-main, "Cairo", sans-serif);
}

body.page-id-1520 .schoolhub-main {
  background: var(--surface, #F8FAFC);
  padding: 4px 12px 34px;
}

body.page-id-1520 #primary > #main > article > .entry-header {
  margin: 0 auto;
  padding: 30px 12px 18px;
  border: 0;
  text-align: center;
}

body.page-id-1520 #primary > #main > article > .entry-header .entry-title {
  margin: 0;
  color: var(--primary-dark, #042C53);
  font-family: var(--font-main, "Cairo", sans-serif);
  font-size: clamp(25px, 5vw, 34px);
  font-weight: 800;
  line-height: 1.45;
}

body.page-id-1520 .entry-content {
  margin: 0 !important;
}

body.page-id-1520 #tutor-registration-wrap {
  width: min(100%, 520px) !important;
  max-width: 520px !important;
  margin: 0 auto 60px !important;
  padding: 0 !important;
  box-sizing: border-box;
  overflow: hidden;
  background: var(--white, #FFFFFF);
  border: 1px solid var(--border, #E2E8F0);
  border-radius: var(--radius-lg, 24px);
  box-shadow: var(--shadow-soft, 0 8px 24px rgba(15, 23, 42, 0.06));
}

body.page-id-1520 #tutor-registration-form {
  width: 100%;
  padding: 30px 30px 28px !important;
  box-sizing: border-box;
  direction: rtl;
  font-family: var(--font-main, "Cairo", sans-serif);
}

body.page-id-1520 #tutor-registration-form .tutor-form-group {
  margin: 0 0 17px !important;
}

body.page-id-1520 #tutor-registration-form .tutor-block {
  display: block;
  margin: 0 0 7px !important;
  color: var(--text-dark, #0F172A);
  font-family: var(--font-main, "Cairo", sans-serif);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.7;
  text-align: right;
}

body.page-id-1520 #tutor-registration-form .tutor-input-field {
  margin-bottom: 0 !important;
}

body.page-id-1520 #tutor-registration-form .tutor-input {
  width: 100%;
  min-height: 52px;
  padding: 0 15px !important;
  box-sizing: border-box;
  border: 1px solid var(--border, #E2E8F0) !important;
  border-radius: 11px !important;
  background: var(--surface, #F8FAFC) !important;
  color: var(--text-dark, #0F172A) !important;
  font-family: var(--font-main, "Cairo", sans-serif) !important;
  font-size: 14px !important;
  font-weight: 500;
  line-height: 1.5;
  text-align: right;
  box-shadow: none !important;
  transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

body.page-id-1520 #tutor-registration-form .tutor-input::placeholder {
  color: #7A7F87;
  opacity: 1;
}

body.page-id-1520 #tutor-registration-form .tutor-input:focus {
  border-color: var(--border-strong, #85B7EB) !important;
  background: var(--white, #FFFFFF) !important;
  box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.08) !important;
  outline: none !important;
}

body.page-id-1520 #tutor-registration-form .tutor-password-strength-checker {
  margin: 0 0 17px !important;
}

body.page-id-1520 #tutor-registration-form .tutor-password-field {
  margin: 0 !important;
}

body.page-id-1520 #tutor-registration-form .tutor-form-row,
body.page-id-1520 #tutor-registration-form .tutor-form-col-12 {
  margin: 0 !important;
  padding: 0 !important;
}

body.page-id-1520 #tutor-registration-form .tutor-btn-primary.tutor-btn-block {
  width: 100%;
  min-height: 52px;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: var(--primary, #1E3A8A) !important;
  color: var(--white, #FFFFFF) !important;
  font-family: var(--font-main, "Cairo", sans-serif) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  box-shadow: none !important;
  transition: transform .2s ease, background-color .2s ease;
}

body.page-id-1520 #tutor-registration-form .tutor-btn-primary.tutor-btn-block:hover,
body.page-id-1520 #tutor-registration-form .tutor-btn-primary.tutor-btn-block:focus-visible {
  background: var(--primary-dark, #042C53) !important;
  color: var(--white, #FFFFFF) !important;
  transform: translateY(-1px);
}

body.page-id-1520 #tutor-registration-form > div:last-child > .tutor-flex {
  margin-top: 16px !important;
}

body.page-id-1520 #tutor-registration-form > div:last-child > .tutor-flex .tutor-small {
  color: var(--text-gray, #5F5E5A);
  font-family: var(--font-main, "Cairo", sans-serif);
  font-size: 13px;
}

body.page-id-1520 #tutor-registration-form > div:last-child > .tutor-flex .tutor-btn-link {
  padding: 0 !important;
  color: var(--primary-text, #185FA5) !important;
  font-family: var(--font-main, "Cairo", sans-serif) !important;
  font-size: 13px !important;
  font-weight: 700;
}

@media (max-width: 767px) {

  body.page-id-1520 .schoolhub-main {
    padding: 2px 10px 24px;
  }

  body.page-id-1520 #primary > #main > article > .entry-header {
    padding: 22px 10px 14px;
  }

  body.page-id-1520 #primary > #main > article > .entry-header .entry-title {
    font-size: 27px;
  }

  body.page-id-1520 #tutor-registration-wrap {
    width: 100% !important;
    max-width: none !important;
    margin: 0 auto 74px !important;
    border-radius: 20px;
  }

  body.page-id-1520 #tutor-registration-form {
    padding: 24px 20px 26px !important;
  }

  body.page-id-1520 #tutor-registration-form .tutor-form-group {
    margin-bottom: 15px !important;
  }

  body.page-id-1520 #tutor-registration-form .tutor-block {
    margin-bottom: 6px !important;
    font-size: 13px;
  }

  body.page-id-1520 #tutor-registration-form .tutor-input {
    min-height: 50px;
    font-size: 14px !important;
  }
}


/* =========================================================
   SCHOOLHUB — FINAL ACCOUNT / LOGIN MICRO FIXES
   ========================================================= */

/* The global mobile .schoolhub-main has a 68px header offset.
   Tutor dashboard/login already sits below the real SchoolHub
   header, so that extra offset creates the unwanted blank gap. */
@media (max-width: 879px) {

  /* Only the authenticated Tutor Dashboard already starts below the
     SchoolHub header. The logged-out login screen still needs the global
     68px header offset. */
  body.logged-in.tutor-screen-frontend-dashboard .schoolhub-main {
    padding-top: 0 !important;
  }

  body.page-id-1520 .schoolhub-main {
    padding-top: 0 !important;
  }
}


/* ---------------------------------------------------------
   DASHBOARD WELCOME HEADER
   --------------------------------------------------------- */

@media (max-width: 767px) {

  body.tutor-screen-frontend-dashboard .tutor-dashboard-header {
    margin-top: 0 !important;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-header-inner {
    min-height: 62px !important;
    height: 62px !important;
    padding: 9px 16px !important;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-header-left .tutor-h5 {
    font-size: 15px !important;
  }

  body.tutor-screen-frontend-dashboard .tutor-dashboard-header-user-avatar {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
  }
}


/* ---------------------------------------------------------
   LOGIN — PASSWORD EYE
   --------------------------------------------------------- */

body.tutor-screen-frontend-dashboard #tutor-login-form .tutor-input-field[x-data] > span {
  right: 15px !important;
  left: auto !important;
}

body.tutor-screen-frontend-dashboard #tutor-login-form .tutor-input-field[x-data] .tutor-input {
  padding-right: 45px !important;
  padding-left: 16px !important;
}

/* Tutor's generated markup contains a fallback SVG in addition
   to the SVG rendered by the Alpine template. Hide only the
   duplicate fallback so one working eye remains. */
body.tutor-screen-frontend-dashboard #tutor-login-form .tutor-input-field[x-data] > span > svg:nth-of-type(2) {
  display: none !important;
}

@media (max-width: 767px) {

  body.tutor-screen-frontend-dashboard #tutor-login-form .tutor-input-field[x-data] .tutor-input {
    padding-right: 45px !important;
    padding-left: 16px !important;
  }
}


/* =========================================================
   SCHOOLHUB — LOGIN SPACING / VISIBILITY FINAL FIX
   ========================================================= */

@media (max-width: 879px) {

  /* Logged-out login page: keep the content below the fixed/sticky
     SchoolHub mobile header. */
  body.tutor-screen-frontend-dashboard:not(.logged-in) .schoolhub-main {
    padding-top: 68px !important;
  }

  body.tutor-screen-frontend-dashboard:not(.logged-in) .tutor-login-wrap {
    margin-top: 22px !important;
  }
}

/* Password eye: keep Tutor's functional eye control above the input. */
body.tutor-screen-frontend-dashboard #tutor-login-form
.tutor-input-field[x-data] > span {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 24px;
  height: 24px;
  right: 14px !important;
  left: auto !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 3 !important;
  color: var(--primary-dark, #042C53);
}

body.tutor-screen-frontend-dashboard #tutor-login-form
.tutor-input-field[x-data] .tutor-input {
  padding-right: 45px !important;
}

body.tutor-screen-frontend-dashboard #tutor-login-form
.tutor-input-field[x-data] > span > svg:nth-of-type(2) {
  display: none !important;
}


/* =========================================================
   SCHOOLHUB — FORGOT / RESET PASSWORD
   Tutor LMS retrieve-password flow.
   Both states use /dashboard/retrieve-password/.
   ========================================================= */

body.schoolhub-auth-password-page {
  background: var(--surface, #F8FAFC);
  color: var(--text-dark, #0F172A);
}

body.schoolhub-auth-password-page .schoolhub-main {
  background: var(--surface, #F8FAFC);
  padding: 24px 12px 40px;
}

/* On these pages the outer Tutor card is only a wrapper.
   The actual form becomes the SchoolHub card. */
body.schoolhub-auth-password-page .schoolhub-main > .tutor-card {
  width: min(100%, 560px) !important;
  max-width: 560px !important;
  margin: 0 auto 60px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.schoolhub-auth-password-page .tutor-forgot-password-form,
body.schoolhub-auth-password-page .tutor-reset-password-form {
  width: 100%;
  box-sizing: border-box;
  margin: 0 !important;
  padding: 34px 30px 30px !important;
  background: var(--white, #FFFFFF);
  border: 1px solid var(--border, #E2E8F0);
  border-radius: var(--radius-lg, 24px);
  box-shadow: var(--shadow-soft, 0 8px 24px rgba(15, 23, 42, 0.06));
  direction: rtl;
  font-family: var(--font-main, "Cairo", sans-serif);
}

/* Headings are inserted visually without altering Tutor's form logic. */
body.schoolhub-auth-password-page .tutor-forgot-password-form::before,
body.schoolhub-auth-password-page .tutor-reset-password-form::before {
  display: block;
  margin: 0 0 12px;
  color: var(--primary-dark, #042C53);
  font-family: var(--font-main, "Cairo", sans-serif);
  font-size: 28px;
  font-weight: 800;
  line-height: 1.5;
  text-align: center;
}

body.schoolhub-auth-password-page .tutor-forgot-password-form::before {
  content: "استعادة كلمة المرور";
}

body.schoolhub-auth-password-page .tutor-reset-password-form::before {
  content: "إنشاء كلمة مرور جديدة";
}

body.schoolhub-auth-password-page .tutor-forgot-password-form > .tutor-mb-8 {
  display: none;
}

body.schoolhub-auth-password-page .tutor-small {
  margin: 0 0 22px !important;
  color: var(--text-gray, #5F5E5A);
  font-family: var(--font-main, "Cairo", sans-serif);
  font-size: 14px !important;
  font-weight: 500;
  line-height: 2;
  text-align: center;
}

body.schoolhub-auth-password-page .tutor-form-row {
  margin: 0 !important;
  padding: 0 !important;
}

body.schoolhub-auth-password-page .tutor-form-col-12 {
  width: 100%;
  margin: 0 !important;
  padding: 0 !important;
}

body.schoolhub-auth-password-page .tutor-form-group {
  margin: 0 !important;
}

body.schoolhub-auth-password-page .tutor-forgot-password-form .tutor-form-row:first-of-type,
body.schoolhub-auth-password-page .tutor-reset-password-form .tutor-form-row:first-of-type {
  margin-top: 4px !important;
}

body.schoolhub-auth-password-page label.tutor-block {
  display: block;
  margin: 0 0 7px !important;
  color: var(--text-dark, #0F172A);
  font-family: var(--font-main, "Cairo", sans-serif);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.7;
  text-align: right;
}

body.schoolhub-auth-password-page .tutor-input-field {
  margin: 0 0 18px !important;
}

body.schoolhub-auth-password-page .tutor-input {
  width: 100%;
  min-height: 52px;
  box-sizing: border-box;
  padding: 0 15px !important;
  border: 1px solid var(--border, #E2E8F0) !important;
  border-radius: 11px !important;
  background: var(--surface, #F8FAFC) !important;
  color: var(--text-dark, #0F172A) !important;
  font-family: var(--font-main, "Cairo", sans-serif) !important;
  font-size: 14px !important;
  font-weight: 500;
  line-height: 1.5;
  text-align: right;
  box-shadow: none !important;
  transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

body.schoolhub-auth-password-page .tutor-input:focus {
  border-color: var(--border-strong, #85B7EB) !important;
  background: var(--white, #FFFFFF) !important;
  box-shadow: 0 0 0 3px rgba(30, 58, 138, 0.08) !important;
  outline: none !important;
}

body.schoolhub-auth-password-page .tutor-btn-primary.tutor-btn-block {
  width: 100%;
  min-height: 52px;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: var(--primary, #1E3A8A) !important;
  color: var(--white, #FFFFFF) !important;
  font-family: var(--font-main, "Cairo", sans-serif) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  box-shadow: none !important;
  transition: background-color .2s ease, transform .2s ease;
}

body.schoolhub-auth-password-page .tutor-btn-primary.tutor-btn-block:hover,
body.schoolhub-auth-password-page .tutor-btn-primary.tutor-btn-block:focus-visible {
  background: var(--primary-dark, #042C53) !important;
  color: var(--white, #FFFFFF) !important;
  transform: translateY(-1px);
}

body.schoolhub-auth-password-page .tutor-forgot-password-form .tutor-mb-5,
body.schoolhub-auth-password-page .tutor-reset-password-form .tutor-mb-5 {
  margin-bottom: 22px !important;
}

body.schoolhub-auth-password-page .tutor-reset-password-form .tutor-form-row {
  margin-bottom: 0 !important;
}

body.schoolhub-auth-password-page .tutor-reset-password-form .tutor-input-field {
  margin-bottom: 18px !important;
}

@media (max-width: 767px) {

  body.schoolhub-auth-password-page .schoolhub-main {
    padding: 18px 10px 28px;
  }

  body.schoolhub-auth-password-page .schoolhub-main > .tutor-card {
    width: 100% !important;
    max-width: none !important;
    margin-bottom: 74px !important;
  }

  body.schoolhub-auth-password-page .tutor-forgot-password-form,
  body.schoolhub-auth-password-page .tutor-reset-password-form {
    padding: 28px 20px 26px !important;
    border-radius: 20px;
  }

  body.schoolhub-auth-password-page .tutor-forgot-password-form::before,
  body.schoolhub-auth-password-page .tutor-reset-password-form::before {
    margin-bottom: 10px;
    font-size: 24px;
  }

  body.schoolhub-auth-password-page .tutor-small {
    margin-bottom: 18px !important;
    font-size: 14px !important;
    line-height: 1.9;
  }

  body.schoolhub-auth-password-page label.tutor-block {
    margin-bottom: 6px !important;
    font-size: 13px;
  }

  body.schoolhub-auth-password-page .tutor-input {
    min-height: 50px;
    font-size: 14px !important;
  }

  body.schoolhub-auth-password-page .tutor-input-field {
    margin-bottom: 15px !important;
  }

  body.schoolhub-auth-password-page .tutor-btn-primary.tutor-btn-block {
    min-height: 50px;
    font-size: 15px !important;
  }
}


/* =========================================================
   SCHOOLHUB — ACCOUNT PAGE TOP SPACING (FINAL)
   ========================================================= */

@media (max-width: 879px) {

  /* Authenticated dashboard: the Tutor dashboard starts in the
     document below the fixed SchoolHub header. No second offset. */
  body.logged-in.tutor-screen-frontend-dashboard .schoolhub-main {
    padding-top: 0 !important;
  }

  /* Logged-out Tutor login: keep the content below the fixed
     SchoolHub header, but use a small visual gap only. */
  body.tutor-screen-frontend-dashboard:not(.logged-in) .schoolhub-main {
    padding-top: 68px !important;
  }

  body.tutor-screen-frontend-dashboard:not(.logged-in) .tutor-login-wrap {
    margin-top: 14px !important;
  }

  /* Forgot / reset password are rendered directly after the
     SchoolHub header, so they do not need another 68px offset. */
  body.schoolhub-auth-password-page .schoolhub-main {
    padding-top: 18px !important;
  }

  /* Registration is also already after the fixed header. */
  body.page-id-1520 .schoolhub-main {
    padding-top: 0 !important;
  }
}