/* V26 — contrast, layout, and navigation QA fixes.
   Loaded LAST across public / school / admin / committee pages. */

/* A restrained white identity area up to the brand separator; do not change
   the dark purple/emerald menu surface to its right. */
html body.public-site.hybrid-navigation .topbar.public-premium-topbar > a.hybrid-brand{
  position:relative;
  z-index:1;
  isolation:isolate;
  min-height:62px;
  border-radius:16px;
  padding:6px 9px!important;
  margin-left:-6px;
  background:linear-gradient(110deg, #ffffff 0%,#f6faf8 73%,rgba(246,250,248,.87) 96%)!important;
  border:1px solid rgba(255,255,255,.48);
  box-shadow:inset 0 1px 0 #fff,0 4px 18px rgba(14,29,25,.08);
}
html body.public-site.hybrid-navigation .hybrid-brand .hybrid-brand-name strong{
  color:#20394c!important;-webkit-text-fill-color:#20394c!important;
}
html body.public-site.hybrid-navigation .hybrid-brand .hybrid-brand-name small{
  color:#5d7280!important;-webkit-text-fill-color:#5d7280!important;
}
html body.public-site.hybrid-navigation .hybrid-brand .hybrid-brand-spark{
  background:linear-gradient(180deg,transparent 0%,#ccb17f 22%,#42886d 65%,transparent 100%)!important;
  opacity:1!important;
}
/* Nav: only the current page, or the one OPEN dropdown, gets an outlined chip. */
html body.public-site.hybrid-navigation .hybrid-main-nav:has(>details[open]) > .hybrid-nav-link.active,
html body.public-site.hybrid-navigation .hybrid-main-nav:has(>details[open]) > details.active:not([open]) > summary,
html body.public-site.hybrid-navigation .hybrid-main-nav.has-open-dropdown > .hybrid-nav-link.active,
html body.public-site.hybrid-navigation .hybrid-main-nav.has-open-dropdown > details.active:not([open]) > summary{
  border-color:transparent!important;
  box-shadow:none!important;
  background:transparent!important;
  color:#f7f6fa!important;-webkit-text-fill-color:#f7f6fa!important;
}
html body.public-site.hybrid-navigation .hybrid-main-nav>details[open]>summary{
  border-color:rgba(128,213,167,.68)!important;
  background:rgba(255,255,255,.12)!important;
  box-shadow:inset 0 -2px #81cfa5!important;
}
/* The dropdown itself should be one floating surface, not a second dark chip. */
html body.public-site.hybrid-navigation .hybrid-main-nav>details[open]>.hybrid-dropdown{
  border:1px solid #d9e7df!important;
  border-radius:15px!important;
  background:#fff!important;
  color:#244b3c!important;
  overflow:visible!important;
}

/* Role-dashboard hero: older styles forced near-white on every span, even
   inside pale status pills. All pills must use dark readable text. */
html body:is(.user-body,.admin-body,.committee-body) .dashboard-hero .dashboard-chip-row .dashboard-chip{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  gap:7px!important;
  padding:9px 13px!important;
  background:#f5f7fb!important;
  border:1px solid #d9e2eb!important;
  color:#263b50!important;
  -webkit-text-fill-color:#263b50!important;
  opacity:1!important;
  font-size:12px!important;
  font-weight:850!important;
  text-shadow:none!important;
}
html body:is(.user-body,.admin-body,.committee-body) .dashboard-hero .dashboard-chip-row .dashboard-chip.is-live{
  background:#e9f8ef!important;border-color:#b7e0ca!important;
  color:#155b40!important;-webkit-text-fill-color:#155b40!important;
}
html body:is(.user-body,.admin-body,.committee-body) .dashboard-hero .dashboard-chip-row .dashboard-chip.is-warn{
  background:#fff2e8!important;border-color:#f3d4b7!important;
  color:#8a471d!important;-webkit-text-fill-color:#8a471d!important;
}
html body:is(.user-body,.admin-body,.committee-body) .dashboard-hero .dashboard-chip-row .dashboard-chip :is(b,strong,small,span){
  color:inherit!important;-webkit-text-fill-color:currentColor!important;
}
html body:is(.user-body,.admin-body,.committee-body) .dashboard-hero .dashboard-eyebrow{
  color:#f1c983!important;-webkit-text-fill-color:#f1c983!important;
}

/* School name stays together with its crest, both in the school sidebar and
   in the school dashboard. The icon must not strand the name on another row. */
html body.user-body .portal-identity.portal-user-identity{
  padding:14px 13px!important;
}
html body.user-body .portal-identity .portal-school-name,
html body.user-body .portal-identity .school-name-logo{
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr)!important;
  gap:10px!important;
  align-items:center!important;
  margin:8px 0 0!important;
  width:100%!important;
  min-width:0!important;
  text-align:left!important;
}
html body.user-body .portal-identity .portal-school-name>.school-logo,
html body.user-body .portal-identity .portal-school-name>.school-logo-fallback{
  grid-column:1;
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  flex:none!important;
  margin:0!important;
  background:#fff!important;
  border-radius:11px!important;
}
html body.user-body .portal-identity .portal-school-name>.school-name-text{
  display:block!important;grid-column:2!important;
  min-width:0!important;
  font-size:12.5px!important;
  line-height:1.48!important;
  font-weight:850!important;
  color:#1e5140!important;-webkit-text-fill-color:#1e5140!important;
  overflow-wrap:normal!important;word-break:normal!important;
}
html body.user-body .school-dashboard-hero .school-dashboard-name{
  display:flex!important;align-items:center!important;flex-wrap:nowrap!important;
  gap:12px!important;
  font-size:clamp(21px,2.7vw,34px)!important;
  line-height:1.38!important;
  min-width:0!important;
  overflow-wrap:normal!important;word-break:normal!important;
}
html body.user-body .school-dashboard-hero .school-dashboard-name :is(.school-logo,.school-logo-fallback){
  flex:0 0 42px!important;width:42px!important;height:42px!important;
  min-width:42px!important;margin:0!important;
  border-radius:11px!important;
}

/* All public-page section headers: a single coherent rounded shell, with
   appropriate colors for light vs dark category banners. */
html body.public-site:not(.page-index) :is(.section-heading,.public-page-hero,.contact-page-hero,.guide-real-hero){
  min-height:120px;
  border-radius:22px!important;
  padding:22px 27px!important;
  gap:15px;
  margin-bottom:17px!important;
}
html body.public-site:not(.page-index) .section-heading>div,
html body.public-site:not(.page-index) .public-page-hero>div,
html body.public-site:not(.page-index) .contact-page-hero>div{
  min-width:0;
}
html body.public-site:not(.page-index) :is(.section-heading,.public-page-hero,.contact-page-hero,.guide-real-hero) :is(.section-title,h1,h2){
  line-height:1.32!important;
  margin-top:4px!important;
}
/* Fix the Athletes directory, which had the wrong CSS shape and almost no rounding. */
html body.public-site.page-athletes .section-heading{
  background:linear-gradient(105deg,#f0f5fa 0%,#f6f4fb 50%,#eaf6ef 100%)!important;
  box-shadow:0 14px 27px rgba(25,38,50,.07)!important;
  border:1px solid #dce5ed!important;
  border-radius:22px!important;
}
html body.public-site.page-athletes .section-heading .section-title{
  color:#244269!important;-webkit-text-fill-color:#244269!important;
}
html body.public-site.page-athletes .section-heading .eyebrow{
  color:#6b5193!important;-webkit-text-fill-color:#6b5193!important;
}
html body.public-site.page-athletes .section-heading .muted{
  color:#5f7185!important;-webkit-text-fill-color:#5f7185!important;
}
html body.public-site.page-athletes .athlete-school-card>summary{
  display:flex!important;align-items:center!important;min-height:76px!important;
  gap:12px!important;
  background:linear-gradient(105deg,#f8fafc,#f3f7fb)!important;
}
html body.public-site.page-athletes .athlete-school-card .school-directory-identity{
  display:flex!important;align-items:center!important;gap:12px!important;
  font-size:15px!important;line-height:1.5!important;
  min-width:0!important;
}
html body.public-site.page-athletes .school-directory-identity .school-name-text{
  color:#264362!important;-webkit-text-fill-color:#264362!important;
  display:inline!important;
  word-break:normal!important;overflow-wrap:normal!important;
}
html body.public-site.page-athletes .school-directory-identity :is(.school-logo,.school-logo-fallback){
  flex:0 0 42px!important;width:42px!important;height:42px!important;
  margin:0!important;
}
html body.public-site.page-schools .public-school-row-identity{
  display:inline-flex!important;align-items:center!important;gap:12px!important;
  min-width:0!important;
}
html body.public-site.page-schools .public-school-row-identity .school-name-text{
  display:inline!important;line-height:1.5!important;
  font-weight:750!important;color:#244a64!important;
  -webkit-text-fill-color:#244a64!important;
  word-break:normal!important;overflow-wrap:normal!important;
}

/* Help/FAQ: strong dark lettering on white panels, including the disclosure
   label and FAQ navigation, no inheriting pale text from dark hero banners. */
html body.public-site.page-help-center .help-center-section :is(.help-topic-link,.help-topic-link strong,.help-intro-card h3,.help-section-head h2,.help-questions summary,.help-instruction-list h3){
  color:#203e55!important;-webkit-text-fill-color:#203e55!important;
  opacity:1!important;
}
html body.public-site.page-help-center .help-questions details,
html body.public-site.page-help-center .help-content-panel{
  background:#ffffff!important;
  border-color:#dce7ec!important;
}
html body.public-site.page-help-center .help-questions details>summary{
  color:#20445b!important;-webkit-text-fill-color:#20445b!important;
  background:#ffffff!important;
}
html body.public-site.page-help-center .help-questions details[open]>summary{
  background:#eaf4f1!important;
  color:#1e5749!important;-webkit-text-fill-color:#1e5749!important;
}
html body.public-site.page-help-center .help-questions details>p,
html body.public-site.page-help-center .help-section-head p{
  color:#52697a!important;-webkit-text-fill-color:#52697a!important;
}
html body.public-site.page-help-center .help-questions details>a,
html body.public-site.page-help-center .help-instruction-list a{
  color:#116c54!important;-webkit-text-fill-color:#116c54!important;
}
/* Contact banner FAQ link: always legible, like a real white CTA. */
html body.public-site.page-contact .contact-page-hero>a[href*="help-center"]{
  display:inline-flex!important;align-items:center!important;gap:8px!important;
  width:max-content;max-width:100%;
  min-height:39px!important;
  padding:8px 14px!important;
  border-radius:11px!important;
  background:#ffffff!important;border:1px solid #d3e5dd!important;
  color:#19513e!important;-webkit-text-fill-color:#19513e!important;
  font-size:13px!important;font-weight:850!important;
  text-decoration:none!important;
  box-shadow:0 8px 18px rgba(20,49,56,.1)!important;
}
html body.public-site.page-contact .contact-page-hero>a[href*="help-center"] span{
  color:inherit!important;-webkit-text-fill-color:currentColor!important;
}

/* Registration steps: premium, readable, not the washed-out former pastels.
   Retain three steps and form behavior unchanged. */
html body.public-site.page-apply .registration-steps{
  display:grid!important;gap:11px!important;
}
html body.public-site.page-apply .registration-steps>span{
  background:linear-gradient(145deg,#e5eef8,#edf3fb)!important;
  border:1px solid #aec7e6!important;
  border-top:3px solid #2b609a!important;
  color:#173f70!important;-webkit-text-fill-color:#173f70!important;
  font-size:12px!important;font-weight:900!important;
  box-shadow:0 7px 15px rgba(33,54,74,.06)!important;
  border-radius:13px!important;
  min-height:46px!important;
  text-align:center!important;
}
html body.public-site.page-apply .registration-steps>span:nth-child(2){
  background:linear-gradient(145deg,#e2f3ea,#e9f7ee)!important;
  border-color:#a7d8c1!important;
  border-top-color:#147b58!important;
  color:#165842!important;-webkit-text-fill-color:#165842!important;
}
html body.public-site.page-apply .registration-steps>span:nth-child(3){
  background:linear-gradient(145deg,#fff0e1,#fff6ed)!important;
  border-color:#efcaa5!important;
  border-top-color:#ba672b!important;
  color:#804316!important;-webkit-text-fill-color:#804316!important;
}
/* Keep headings and step labels dark on light background */
html body.public-site.page-apply .registration-step-heading :is(h2,h3,strong),
html body.public-site.page-apply .registration-block .registration-block-title{
  color:#243f5c!important;-webkit-text-fill-color:#243f5c!important;
}

@media(max-width:920px){
  html body.public-site:not(.page-index) :is(.section-heading,.public-page-hero,.contact-page-hero,.guide-real-hero){
    min-height:105px;padding:17px 19px!important;
  }
  html body.public-site.hybrid-navigation .topbar.public-premium-topbar>a.hybrid-brand{
    min-height:50px;padding:4px 6px!important;border-radius:12px;
  }
}
@media(max-width:620px){
  html body.public-site:not(.page-index) :is(.section-heading,.public-page-hero,.contact-page-hero,.guide-real-hero){
    padding:15px 16px!important;border-radius:16px!important;
  }
  html body.user-body .school-dashboard-hero .school-dashboard-name{font-size:21px!important;}
  html body.public-site.page-athletes .athlete-school-card .school-directory-identity{font-size:13px!important;}
}

/* Solid-but-sophisticated registration step ribbon. Explicit nth-child selectors
   override the older very pale step color rules from help-visual-refresh.css. */
html body.public-site.page-apply .registration-steps>span:nth-child(1){
  background:linear-gradient(125deg,#155f4c,#1a795c)!important;
  border:1px solid #185f4b!important;border-top:3px solid #a5ddc4!important;
  color:#fff!important;-webkit-text-fill-color:#fff!important;
  text-shadow:none!important;box-shadow:0 8px 18px rgba(17,87,66,.14)!important;
}
html body.public-site.page-apply .registration-steps>span:nth-child(2){
  background:linear-gradient(125deg,#31527e,#346e98)!important;
  border:1px solid #345b83!important;border-top:3px solid #b9d8ee!important;
  color:#fff!important;-webkit-text-fill-color:#fff!important;
  text-shadow:none!important;box-shadow:0 8px 18px rgba(33,75,113,.14)!important;
}
html body.public-site.page-apply .registration-steps>span:nth-child(3){
  background:linear-gradient(125deg,#945331,#b36a3f)!important;
  border:1px solid #9d613e!important;border-top:3px solid #f5c49d!important;
  color:#fff!important;-webkit-text-fill-color:#fff!important;
  text-shadow:none!important;box-shadow:0 8px 18px rgba(116,69,37,.14)!important;
}