/* V66 — Compact navy page headings + refined visual experience across all portals. */
:root{
  --jx-page-navy:#0b2754;
  --jx-page-navy-2:#123b73;
  --jx-page-ink:#122951;
  --jx-page-muted:#72829a;
  --jx-page-line:#dfe7f3;
  --jx-page-soft:#f5f8fd;
  --jx-page-shadow:0 10px 26px rgba(11,39,84,.10);
}

/* ---------- One compact page-title language across student / teacher / admin / responsible / accountant ---------- */
:where(.academic-hero,.bill-hero,.care-heading,.project-hero,.sa-hero,.acc-hero,.jawda-page-heading,.teacher-messages-heading,.leq-hero,.qb-hero,.events-page-heading,.leqs-head,.readiness-page-head){
  position:relative!important;
  min-height:64px!important;
  height:auto!important;
  margin-bottom:16px!important;
  padding:10px 14px!important;
  border:1px solid #244d82!important;
  border-radius:14px!important;
  background:linear-gradient(112deg,var(--jx-page-navy),var(--jx-page-navy-2))!important;
  color:#fff!important;
  box-shadow:var(--jx-page-shadow)!important;
  overflow:hidden;
}
:where(.academic-hero,.bill-hero,.care-heading,.project-hero,.sa-hero,.acc-hero,.jawda-page-heading,.teacher-messages-heading,.leq-hero,.qb-hero,.events-page-heading,.leqs-head,.readiness-page-head)::after{
  content:"";
  position:absolute;
  width:150px;height:150px;
  inset-inline-end:-72px;top:-100px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:50%;
  box-shadow:0 0 0 24px rgba(255,255,255,.025);
  pointer-events:none;
}
:where(.academic-hero,.bill-hero,.care-heading,.project-hero,.sa-hero,.acc-hero,.jawda-page-heading,.teacher-messages-heading,.leq-hero,.qb-hero,.events-page-heading,.leqs-head,.readiness-page-head)
:is(h1,h2,h3,.qb-hero-title){
  position:relative;z-index:1;
  margin:0!important;
  color:#fff!important;
  font-size:clamp(1rem,1.55vw,1.22rem)!important;
  line-height:1.55!important;
  font-weight:900!important;
}
:where(.academic-hero,.bill-hero,.care-heading,.project-hero,.sa-hero,.acc-hero,.jawda-page-heading,.leq-hero,.qb-hero,.events-page-heading,.leqs-head,.readiness-page-head)
:is(p,small,.qb-hero-sub){
  position:relative;z-index:1;
  margin:2px 0 0!important;
  color:#d7e6f8!important;
  font-size:.74rem!important;
  line-height:1.65!important;
  font-weight:500!important;
}

/* Remove marketing eyebrow/kicker lines from page titles: title + short description only. */
.student-account-portal .bill-hero>span:not(.jx-page-icon),
.student-account-portal .care-eyebrow,
.accountant-portal-page .acc-hero>span,
.exam-eyebrow{display:none!important}

/* Compact 3D icon used in the title strip. */
.jx-page-icon,.academic-hero>.academic-art,.jawda-page-heading-icon{
  position:relative;z-index:1;
  display:grid!important;place-items:center!important;
  width:40px!important;height:40px!important;flex:0 0 40px!important;
  padding:4px!important;
  border:1px solid rgba(255,255,255,.18)!important;
  border-radius:12px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.22),rgba(255,255,255,.06))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.32),0 7px 13px rgba(0,10,35,.2)!important;
  transform:none!important;
}
.jx-page-icon svg,.academic-hero>.academic-art svg,.jawda-page-heading-icon :is(svg,.tw-icon){
  width:35px!important;height:35px!important;display:block;
  filter:drop-shadow(0 6px 5px rgba(0,12,40,.2))!important;
}
.academic-hero>.academic-art i{font-size:1.15rem!important}

/* Header layout: icon, then title/description. */
.academic-hero,.bill-hero,.care-heading,.jawda-page-heading{display:flex!important;align-items:center!important;gap:11px!important}
.academic-hero>div,.bill-hero>div,.care-heading>div,.jawda-page-heading-copy{position:relative;z-index:1;min-width:0;flex:1}
.jawda-page-heading-links{display:none!important}
body.staff-visual-v21 .jawda-page-heading{display:flex!important}

/* Compact action buttons that still live in legacy page headers. */
:where(.project-hero,.sa-hero,.care-heading,.events-page-heading,.leqs-head)>.btn,
:where(.project-hero,.sa-hero,.care-heading,.events-page-heading,.leqs-head)>a:not(.jx-page-icon){
  position:relative;z-index:2;
  min-height:34px!important;
  padding:6px 10px!important;
  border:1px solid rgba(255,255,255,.36)!important;
  border-radius:9px!important;
  background:rgba(255,255,255,.09)!important;
  color:#fff!important;
  font-size:.7rem!important;
  box-shadow:none!important;
}

/* ---------- Academic tools: plans / exams / library ---------- */
.academic-page{background:linear-gradient(180deg,#f4f7fc 0,#f8fafd 48%,#fff 100%)}
.academic-main{padding-block:18px 40px}
.academic-main-in-shell{padding-bottom:34px!important}
.academic-hero{margin-bottom:14px!important}
.academic-hero .academic-art{background:rgba(255,255,255,.08)!important}
.academic-icon-3d{width:35px!important;height:35px!important}
.academic-layout{gap:18px}
.academic-card{border:1px solid var(--jx-page-line);border-radius:17px;box-shadow:0 10px 26px rgba(18,41,81,.055)}
.academic-card:hover{border-color:#cfdbed}
.academic-side{top:82px;padding:15px}
.academic-side h2{margin-bottom:11px;color:#173a6b;font-size:.96rem}
.academic-menu-item{position:relative;padding:11px 12px;border:1px solid transparent;border-radius:12px;background:#f5f8fd}
.academic-menu-item:hover{border-color:#d5e1f3;background:#eef4fd;transform:translateY(-1px)}
.academic-menu-item.active{border-color:#c7d7ef;background:#eaf1fc;box-shadow:inset 4px 0 #315eaa}
html[dir="rtl"] .academic-menu-item.active{box-shadow:inset -4px 0 #315eaa}

/* Study plan visual refresh. */
.academic-plan-image{padding:12px;background:linear-gradient(145deg,#fff,#f7faff)}
.academic-plan-image img{border-radius:12px;filter:drop-shadow(0 12px 18px rgba(28,61,115,.08))}
.academic-plan-image figcaption{color:#60738f;font-size:.75rem}
.academic-metrics{gap:10px}
.academic-metrics div{position:relative;overflow:hidden;min-height:105px;padding:13px 12px;border:1px solid #dce6f4;border-radius:15px;background:linear-gradient(145deg,#fbfdff,#edf4ff);box-shadow:0 8px 18px rgba(20,52,103,.055)}
.academic-metrics div:after{content:"";position:absolute;width:70px;height:70px;inset-inline-end:-28px;top:-26px;border-radius:50%;background:#d9e8ff80}
.academic-metrics .plan-metric-icon{position:relative;z-index:1;display:grid;place-items:center;width:34px;height:34px;margin:0 auto 5px}
.academic-metrics .plan-metric-icon svg{width:34px;height:34px;filter:drop-shadow(0 6px 6px rgba(31,69,140,.17))}
.academic-metrics span:not(.plan-metric-icon){position:relative;z-index:1;color:#71819a;font-size:.72rem}
.academic-metrics strong{position:relative;z-index:1;color:#133767;font-size:1.35rem}
.academic-card progress{height:9px;border-radius:999px;overflow:hidden}
.academic-table{border-collapse:separate;border-spacing:0 6px}
.academic-table thead th{border:0!important;background:transparent!important;color:#617693;font-size:.72rem}
.academic-table tbody tr{background:#f8faff!important;box-shadow:0 3px 10px rgba(18,41,81,.025)}
.academic-table tbody td{border-top:1px solid #e6ecf5!important;border-bottom:1px solid #e6ecf5!important}
.academic-table tbody td:first-child{border-inline-start:1px solid #e6ecf5!important;border-radius:0 11px 11px 0}
.academic-table tbody td:last-child{border-inline-end:1px solid #e6ecf5!important;border-radius:11px 0 0 11px}
html[dir="ltr"] .academic-table tbody td:first-child{border-radius:11px 0 0 11px}
html[dir="ltr"] .academic-table tbody td:last-child{border-radius:0 11px 11px 0}

/* Exam schedule: denser, clearer, premium cards. */
.exam-hero:after{display:block!important}
.exam-category-tabs{margin-bottom:14px;gap:9px!important}
.academic-tabs .exam-category-tab{min-width:190px;padding:9px 11px;border-radius:13px!important}
.exam-tab-art{width:38px;height:38px;border-radius:11px!important}
.exam-schedule-shell{padding:18px!important;border-radius:18px!important}
.exam-section-head{padding-bottom:13px;border-bottom:1px solid #e4eaf3}
.exam-section-kicker{margin-bottom:1px!important;color:#607795!important;font-size:.69rem!important}
.exam-summary{gap:9px;margin:14px 0}
.exam-summary-card{padding:11px 12px;border-radius:14px!important;background:#f8faff!important;box-shadow:none!important}
.exam-summary-card:hover{transform:translateY(-2px);box-shadow:0 9px 18px rgba(28,65,133,.08)!important}
.exam-summary-art{width:40px;height:40px;border-radius:12px!important}
.exam-summary-card strong{font-size:1.12rem}
.exam-tools{margin-bottom:14px}
.exam-search .form-control{min-height:42px;border-radius:12px;background:#fff}
.exam-days{gap:12px}
.exam-day-card{border-radius:16px!important;box-shadow:0 8px 20px rgba(18,41,81,.055)!important}
.exam-day-head{padding:11px 13px;background:#f5f8fd}
.exam-day-art{width:41px;height:41px;border-radius:12px!important}
.exam-slots{padding:5px 12px 9px}
.exam-slot{padding:10px 2px;gap:10px}
.exam-course-chip{padding:6px 9px;border-radius:9px;font-size:.74rem}
.exam-time-art{width:33px;height:33px;border-radius:10px!important}

/* ---------- Student subscriptions ---------- */
.student-account-portal .bill-hero{margin-bottom:14px!important}
.student-account-portal .bill-hero::after{display:block!important}
.student-account-portal .bill-hero .jx-page-icon{background:rgba(255,255,255,.09)!important}
.student-account-portal .bill-stats{gap:10px;margin:0 0 14px}
.student-account-portal .bill-stats article{position:relative;overflow:hidden;min-height:92px;padding:13px;border:1px solid #dce5f2;border-radius:15px;background:linear-gradient(145deg,#fff,#f5f8fd);box-shadow:0 8px 19px rgba(11,39,84,.055)}
.student-account-portal .bill-stat-icon{width:39px;height:39px;border-radius:11px!important;box-shadow:inset 0 1px #fff,0 4px 0 #ccd9ec,0 8px 13px rgba(27,61,121,.09)}
.student-account-portal .bill-stats strong{color:#123768;font-size:1.2rem}
.student-account-portal .bill-card{border-radius:16px!important;border-color:#dde5f1!important;box-shadow:0 9px 22px rgba(18,41,81,.05)!important}
.student-account-portal .care-payment-next{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;padding:15px 17px;background:linear-gradient(120deg,#f7faff,#eef4fd)}
.student-account-portal .care-payment-next h2{font-size:.95rem;color:#173a6b}
.student-account-portal .care-payment-next p{font-size:.76rem;margin-bottom:0}
.student-account-portal .care-portal-links{grid-column:2;grid-row:1/3;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:7px}
.student-account-portal .care-portal-links .btn{min-height:35px;padding:6px 10px;font-size:.7rem;border-radius:10px}
.student-account-portal .bill-table{border:1px solid #e2e8f2;border-radius:13px;overflow:auto}
.student-account-portal .bill-table thead th{background:#f1f5fb;color:#496481;font-size:.71rem}
.student-account-portal .bill-table tbody tr:hover{background:#f8faff}

/* ---------- Requests / care center ---------- */
.student-account-portal .care-heading{margin-bottom:10px!important}
.care-page-tools{display:flex;justify-content:flex-end;margin:-3px 0 12px}
.care-page-tools .btn{min-height:34px;padding:6px 10px;border-radius:9px;font-size:.7rem}
.student-account-portal .care-stats{gap:10px;margin-bottom:12px}
.student-account-portal .care-stats article{min-height:84px;padding:12px;border:1px solid #dde6f3;border-radius:15px;background:linear-gradient(145deg,#fff,#f5f8fd);box-shadow:0 8px 18px rgba(18,41,81,.05)}
.student-account-portal .care-stat-icon{width:39px;height:39px;border-radius:11px!important;box-shadow:inset 0 1px rgba(255,255,255,.8),0 4px 0 #ccd9ec,0 8px 13px rgba(27,61,121,.09)}
.student-account-portal .care-shortcuts{grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-bottom:12px}
.student-account-portal .care-shortcuts a{min-height:72px;padding:10px;border:1px solid #dce5f2;border-radius:14px;background:#fff;box-shadow:0 7px 17px rgba(18,41,81,.045)}
.student-account-portal .care-shortcuts a:hover{transform:translateY(-2px);border-color:#c8d7ee;box-shadow:0 11px 22px rgba(18,41,81,.08)}
.student-account-portal .care-shortcuts a>span{width:38px;height:38px;border-radius:11px;background:linear-gradient(145deg,#eaf1ff,#d5e2f7);box-shadow:0 4px 0 #c6d6ef}
.student-account-portal .care-filters{padding:3px 0 11px;gap:9px}
.student-account-portal .care-item{margin-bottom:8px;padding:13px 14px;border:1px solid #e1e7f1;border-radius:14px;background:#fff;box-shadow:0 5px 14px rgba(18,41,81,.035)}
.student-account-portal .care-item:hover{border-color:#cdd9ec;background:#fbfdff;transform:translateY(-1px)}
.student-account-portal .care-item h2{margin:5px 0 4px;color:#173a6b;font-size:.91rem}
.student-account-portal .care-tag{font-size:.66rem;border-radius:999px}

/* ---------- Staff/accounting visual consistency ---------- */
.accountant-portal-page .acc-hero{padding:10px 14px!important}
.accountant-portal-page .acc-hero:after{display:block!important}
.teacher-page-shell .jawda-page-heading,.responsible-page-shell .jawda-page-heading{margin-bottom:14px!important}
.teacher-page-shell .teacher-tool-stage>header{
  min-height:64px!important;padding:10px 14px!important;border-radius:14px!important;
  background:linear-gradient(112deg,var(--jx-page-navy),var(--jx-page-navy-2))!important;
  border:1px solid #244d82!important;color:#fff!important;box-shadow:var(--jx-page-shadow)!important;
}
.teacher-page-shell .teacher-tool-stage>header h1{font-size:1.05rem!important;color:#fff!important}
.teacher-page-shell .teacher-tool-stage>header p{font-size:.74rem!important;color:#d7e6f8!important}

/* Make cards/actions feel more deliberate, without changing page logic. */
:where(.teacher-portal-page,.responsible-portal-page,.accountant-portal-page,.jawda-unified-ui-v25)
:is(.card,.soft-card,.acc-card,.project-panel,.project-card){border-color:#dfe6f1;box-shadow:0 8px 22px rgba(18,41,81,.045)}
:where(.teacher-portal-page,.responsible-portal-page,.accountant-portal-page,.jawda-unified-ui-v25)
:is(.card,.soft-card,.acc-card,.project-card):hover{border-color:#ced9eb}

@media(max-width:767.98px){
  :where(.academic-hero,.bill-hero,.care-heading,.project-hero,.sa-hero,.acc-hero,.jawda-page-heading,.teacher-messages-heading,.leq-hero,.qb-hero,.events-page-heading,.leqs-head,.readiness-page-head){
    min-height:58px!important;padding:9px 11px!important;border-radius:12px!important;gap:9px!important;
  }
  .jx-page-icon,.academic-hero>.academic-art,.jawda-page-heading-icon{width:36px!important;height:36px!important;flex-basis:36px!important;border-radius:10px!important}
  .jx-page-icon svg,.academic-hero>.academic-art svg,.jawda-page-heading-icon :is(svg,.tw-icon){width:31px!important;height:31px!important}
  .academic-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .academic-metrics div{min-height:92px}
  .student-account-portal .care-payment-next{grid-template-columns:1fr}
  .student-account-portal .care-portal-links{grid-column:1;grid-row:auto;justify-content:flex-start}
  .student-account-portal .care-shortcuts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .care-page-tools{justify-content:stretch}.care-page-tools .btn{width:100%}
}
@media(max-width:575.98px){
  .academic-main{padding-block:12px 28px}
  .academic-card{border-radius:14px!important}
  .exam-schedule-shell{padding:12px!important}
  .exam-summary{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .exam-summary-card{display:grid;text-align:center;justify-items:center;gap:5px;padding:9px 5px}
  .exam-summary-card small{font-size:.62rem}
  .exam-summary-art{width:35px;height:35px}
  .student-account-portal .bill-stats{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .student-account-portal .bill-stats article{display:grid;justify-items:center;text-align:center;gap:4px;min-height:96px;padding:9px 5px}
  .student-account-portal .bill-stats small{font-size:.62rem}
}

/* Workspace headings that do not use the standard hero partial yet. */
.billing-workspace-card>.billing-workspace-head{
  min-height:64px!important;margin:0!important;padding:10px 14px!important;
  border:0!important;border-radius:14px 14px 0 0!important;
  background:linear-gradient(112deg,var(--jx-page-navy),var(--jx-page-navy-2))!important;
  color:#fff!important;box-shadow:var(--jx-page-shadow)!important;
}
.billing-workspace-title{gap:10px!important}.billing-workspace-title .jawda-icon-3d{width:39px!important;height:39px!important;border-radius:11px!important;background:rgba(255,255,255,.12)!important;color:#fff!important;box-shadow:inset 0 1px rgba(255,255,255,.22),0 6px 12px rgba(0,10,35,.18)!important}
.billing-workspace-title h1{margin:0!important;color:#fff!important;font-size:1.08rem!important}.billing-workspace-title small{display:block;margin-top:2px;color:#d7e6f8!important;font-size:.72rem!important}.billing-workspace-head>.btn{min-height:34px;padding:6px 10px;border-color:rgba(255,255,255,.42)!important;background:rgba(255,255,255,.08)!important;color:#fff!important;font-size:.7rem}

.responsible-page-shell .responsible-welcome{
  min-height:64px!important;margin-bottom:14px!important;padding:10px 14px!important;
  display:flex!important;align-items:center!important;gap:10px!important;
  border:1px solid #244d82!important;border-radius:14px!important;
  background:linear-gradient(112deg,var(--jx-page-navy),var(--jx-page-navy-2))!important;
  color:#fff!important;box-shadow:var(--jx-page-shadow)!important;
}
.responsible-page-shell .responsible-welcome .welcome-kicker{display:none!important}
.responsible-page-shell .responsible-welcome h1{margin:0!important;color:#fff!important;font-size:1.08rem!important;font-weight:900!important}
.responsible-page-shell .responsible-welcome p{margin:2px 0 0!important;color:#d7e6f8!important;font-size:.72rem!important}
.responsible-page-shell .responsible-welcome .welcome-mark{width:40px!important;height:40px!important;order:-1;display:grid;place-items:center;padding:3px!important;border-radius:11px!important;background:rgba(255,255,255,.1)!important}
.responsible-page-shell .responsible-welcome .welcome-mark .tw-icon{width:35px!important;height:35px!important}

/* Secondary greetings should not compete with the page title. */
.teacher-page-shell .ov-hero{min-height:0!important;margin-bottom:14px!important;padding:10px 13px!important;border:1px solid #dbe5f2!important;border-radius:13px!important;background:#f7faff!important;color:var(--jx-page-ink)!important;box-shadow:none!important}
.teacher-page-shell .ov-hero h3{margin:0!important;color:#173a6b!important;font-size:.92rem!important}.teacher-page-shell .ov-hero .text-muted{margin-top:2px;color:#77869a!important;font-size:.71rem!important}
.teacher-page-shell .ov-hero:after{display:none!important}

/* Legacy title icons get a compact 3D treatment without increasing header height. */
:where(.project-hero,.teacher-messages-heading,.events-page-heading,.leqs-head) h1>i,
.teacher-messages-heading>i{
  display:inline-grid!important;place-items:center!important;
  width:31px!important;height:31px!important;margin-inline-end:6px!important;
  border:1px solid rgba(255,255,255,.18)!important;border-radius:9px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.22),rgba(255,255,255,.06))!important;
  color:#fff!important;box-shadow:inset 0 1px rgba(255,255,255,.26),0 5px 10px rgba(0,12,38,.18)!important;
  vertical-align:middle!important;font-size:.9rem!important;
}
.page-actions-below{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin:-5px 0 14px}
.page-actions-below :is(a,button){min-height:35px;padding:6px 10px;border-radius:9px;font-size:.72rem}
@media(max-width:575.98px){.page-actions-below>*{flex:1;justify-content:center}}

/* ==========================================================
   V67 — One-line navy title strip + unified dashboard headers
   Mirrors the compact teacher reports / quiz visual language.
   ========================================================== */
:root{
  --jx-v67-navy:#0b2754;
  --jx-v67-navy-2:#123b73;
  --jx-v67-navy-3:#1b4b89;
}

/* Every portal page title is now one compact navy row. */
:where(
  .academic-hero,.bill-hero,.care-heading,.project-hero,.sa-hero,.acc-hero,
  .jawda-page-heading,.teacher-messages-heading,.leq-hero,.qb-hero,
  .events-page-heading,.leqs-head,.readiness-page-head,.responsible-welcome,
  .billing-workspace-head,.lectures-hero-box,.chgcat-hero,.teacher-pay-hero
){
  min-height:52px!important;
  padding:8px 12px!important;
  margin-bottom:14px!important;
  border:1px solid #284f83!important;
  border-radius:13px!important;
  background:linear-gradient(110deg,var(--jx-v67-navy),var(--jx-v67-navy-2) 68%,var(--jx-v67-navy-3))!important;
  color:#fff!important;
  box-shadow:0 8px 18px rgba(11,39,84,.10)!important;
}

/* Title + description share the SAME line, like teacher reports. */
:where(
  .academic-hero>div,.bill-hero>div,.care-heading>div,.project-hero>div,.sa-hero>div,
  .jawda-page-heading-copy,.responsible-welcome>div,.billing-workspace-title>div
){
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  min-width:0!important;
  flex:1 1 auto!important;
  flex-wrap:nowrap!important;
}

/* Accounting legacy headers have h1 + p directly in the hero. */
.acc-hero{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  flex-wrap:nowrap!important;
}
.acc-hero>span{display:none!important}

:where(
  .academic-hero,.bill-hero,.care-heading,.project-hero,.sa-hero,.acc-hero,
  .jawda-page-heading,.teacher-messages-heading,.leq-hero,.qb-hero,
  .events-page-heading,.leqs-head,.readiness-page-head,.responsible-welcome,
  .billing-workspace-head,.lectures-hero-box,.chgcat-hero,.teacher-pay-hero
) :is(h1,h2,h3,.qb-hero-title){
  flex:0 0 auto!important;
  margin:0!important;
  color:#fff!important;
  font-size:1rem!important;
  line-height:1.45!important;
  font-weight:900!important;
  white-space:nowrap!important;
}

:where(
  .academic-hero,.bill-hero,.care-heading,.project-hero,.sa-hero,.acc-hero,
  .jawda-page-heading,.leq-hero,.qb-hero,.events-page-heading,.leqs-head,
  .readiness-page-head,.responsible-welcome,.billing-workspace-head,
  .lectures-hero-box,.chgcat-hero,.teacher-pay-hero
) :is(p,small,.qb-hero-sub,.text-muted){
  min-width:0!important;
  margin:0!important;
  color:#dbe8fa!important;
  font-size:.72rem!important;
  line-height:1.5!important;
  font-weight:500!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

/* Legacy project/account headers: keep the optional action on the same compact row. */
:where(.project-hero,.sa-hero,.events-page-heading,.leqs-head){
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  flex-wrap:nowrap!important;
}
:where(.project-hero,.sa-hero,.events-page-heading,.leqs-head)>:is(a,.btn){
  margin-inline-start:auto!important;
  flex:0 0 auto!important;
}

/* Compact title artwork to avoid making the strip taller than the teacher version. */
:where(.jx-page-icon,.academic-hero>.academic-art,.jawda-page-heading-icon){
  width:34px!important;
  height:34px!important;
  flex:0 0 34px!important;
  padding:2px!important;
  border-radius:9px!important;
}
:where(.jx-page-icon svg,.academic-hero>.academic-art svg,.jawda-page-heading-icon :is(svg,.tw-icon)){
  width:29px!important;
  height:29px!important;
}

/* Hide marketing/kicker lines from legacy title blocks — page title remains the focus. */
:where(.sa-hero,.teacher-pay-hero,.lectures-hero-box,.chgcat-hero) :is(.kicker,.eyebrow,span:first-child:not(.jx-page-icon)){
  display:none!important;
}

/* ==========================================================
   Sidebar dashboard identity — navy everywhere.
   Desktop teacher/admin/responsible + mobile drawers + accountant.
   ========================================================== */
body.staff-visual-v21 .rw-dashboard-link,
body.staff-visual-v21 .rw-dashboard-entry,
.responsible-mobile-offcanvas .rw-dashboard-entry,
.teacher-mobile-offcanvas .rw-dashboard-entry,
.accountant-portal-page .acc-sidebar-head{
  color:#fff!important;
  background:linear-gradient(110deg,var(--jx-v67-navy),var(--jx-v67-navy-2) 72%,var(--jx-v67-navy-3))!important;
  border-color:#244d82!important;
  box-shadow:0 9px 20px rgba(7,24,63,.16)!important;
}
body.staff-visual-v21 .rw-dashboard-link span,
body.staff-visual-v21 .rw-dashboard-entry span,
.responsible-mobile-offcanvas .rw-dashboard-entry span,
.teacher-mobile-offcanvas .rw-dashboard-entry span,
.accountant-portal-page .acc-sidebar-head :is(strong,small){color:#fff!important}
body.staff-visual-v21 .rw-dashboard-entry{
  min-height:52px!important;
  margin:0 0 9px!important;
  border-radius:13px!important;
  border:1px solid #244d82!important;
}
body.staff-visual-v21 .rw-dashboard-entry>.tw-icon{
  width:36px!important;height:36px!important;flex:0 0 36px!important;
  filter:drop-shadow(0 6px 6px rgba(0,12,42,.24))!important;
}
.accountant-portal-page .acc-sidebar-head{border-radius:15px!important}
.accountant-portal-page .acc-sidebar-head-icon{
  color:#fff!important;
  border:1px solid rgba(255,255,255,.18)!important;
  background:rgba(255,255,255,.10)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.2)!important;
}

/* Keep sidebar title consistent in mobile drawers as well. */
.responsible-mobile-offcanvas .offcanvas-header,
.teacher-mobile-offcanvas .offcanvas-header{
  border-bottom:1px solid #dce5f2;
  background:#f8faff;
}

/* Some management pages use a plain H1 lead row instead of the shared partial. */
body.staff-visual-v21 main>.d-flex.align-items-center.gap-3.mb-3:has(>div>h1),
body.staff-visual-v21 main>.d-flex.align-items-center.gap-3.mb-3:has(>h1){
  min-height:52px!important;
  padding:8px 12px!important;
  border:1px solid #284f83!important;
  border-radius:13px!important;
  background:linear-gradient(110deg,var(--jx-v67-navy),var(--jx-v67-navy-2) 68%,var(--jx-v67-navy-3))!important;
  color:#fff!important;
  box-shadow:0 8px 18px rgba(11,39,84,.10)!important;
}
body.staff-visual-v21 main>.d-flex.align-items-center.gap-3.mb-3:has(>div>h1) h1,
body.staff-visual-v21 main>.d-flex.align-items-center.gap-3.mb-3:has(>h1){color:#fff!important;font-size:1rem!important;margin:0!important;white-space:nowrap}
body.staff-visual-v21 main>.d-flex.align-items-center.gap-3.mb-3:has(>div>h1) p{color:#dbe8fa!important;font-size:.72rem!important;margin:0!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

@media(max-width:767.98px){
  :where(
    .academic-hero,.bill-hero,.care-heading,.project-hero,.sa-hero,.acc-hero,
    .jawda-page-heading,.teacher-messages-heading,.leq-hero,.qb-hero,
    .events-page-heading,.leqs-head,.readiness-page-head,.responsible-welcome,
    .billing-workspace-head,.lectures-hero-box,.chgcat-hero,.teacher-pay-hero
  ){
    min-height:48px!important;
    padding:7px 9px!important;
    border-radius:11px!important;
    gap:7px!important;
  }
  :where(
    .academic-hero>div,.bill-hero>div,.care-heading>div,.project-hero>div,.sa-hero>div,
    .jawda-page-heading-copy,.responsible-welcome>div,.billing-workspace-title>div
  ){gap:7px!important}
  :where(
    .academic-hero,.bill-hero,.care-heading,.project-hero,.sa-hero,.acc-hero,
    .jawda-page-heading,.teacher-messages-heading,.leq-hero,.qb-hero,
    .events-page-heading,.leqs-head,.readiness-page-head,.responsible-welcome,
    .billing-workspace-head,.lectures-hero-box,.chgcat-hero,.teacher-pay-hero
  ) :is(h1,h2,h3,.qb-hero-title){font-size:.88rem!important}
  :where(
    .academic-hero,.bill-hero,.care-heading,.project-hero,.sa-hero,.acc-hero,
    .jawda-page-heading,.leq-hero,.qb-hero,.events-page-heading,.leqs-head,
    .readiness-page-head,.responsible-welcome,.billing-workspace-head
  ) :is(p,small,.qb-hero-sub,.text-muted){font-size:.64rem!important}
  :where(.jx-page-icon,.academic-hero>.academic-art,.jawda-page-heading-icon){width:31px!important;height:31px!important;flex-basis:31px!important}
  :where(.jx-page-icon svg,.academic-hero>.academic-art svg,.jawda-page-heading-icon :is(svg,.tw-icon)){width:27px!important;height:27px!important}
  /* On narrow phones the action button is icon-sized; title row stays one line. */
  :where(.project-hero,.sa-hero,.events-page-heading,.leqs-head)>:is(a,.btn){
    min-height:31px!important;padding:5px 8px!important;font-size:.64rem!important;
  }
}

@media(max-width:430px){
  /* Preserve the one-line identity; description gracefully disappears before the title wraps. */
  :where(
    .academic-hero,.bill-hero,.care-heading,.project-hero,.sa-hero,.acc-hero,
    .jawda-page-heading,.leq-hero,.qb-hero,.events-page-heading,.leqs-head,
    .readiness-page-head,.responsible-welcome,.billing-workspace-head
  ) :is(p,small,.qb-hero-sub,.text-muted){display:none!important}
}