body {
  background-color: #1a1a1a;
  margin: 0;
  font-family: Arial, sans-serif;
  color: white;
}

/* === Consistent vertical sizing for red menu and white banner === */
:root { --bar-height: 56px; }

/* Menu bar uses fixed height; links vertically centered via line-height */

/* White banner matches height and centers text */
.banner { min-height: var(--bar-height); display: flex; align-items: center; justify-content: center; padding: 0 10px; }

header img {
  display: block;
  margin: 20px auto;
  width: 400px;
}
.chevron::after {
  content: " ›";
  font-weight: bold;
}
.banner {
  background-color: white;
  color: #cc0000;
  font-weight: bold;
  font-size: 1.5em;
  text-align: center;
  padding: 10px;
}
.content {
  text-align: center;
  padding: 20px;
  font-size: 1.1em;
  letter-spacing: 0.25px;
  line-height: 1.6;
}


.home-content {
  margin-left: auto;
  margin-right: auto;
  padding: 20px;
  font-size: 1.1em;
  letter-spacing: 0.25px;
  line-height: 1.6;
  width: 900px;
  text-align: left;
}

.site-logo {
  width: 400px;
  height: auto;
}


/* --- Fix submenu visibility over white banner --- */
.banner { position: relative; z-index: 10; }


/* === Tryout Registration Form page (scoped) === */
body.tryout-form {
  background: #000;
  color: #fff;
}
body.tryout-form header img {
  max-width: 280px;
  height: auto;
}
body.tryout-form .page-banner {
  background: #fff;
  color: #b30000;
  font-weight: bold;
  font-size: 1.5em;
  padding: 12px 16px;
  text-transform: none;
}
body.tryout-form .container {
  max-width: 980px;
  margin: 20px auto;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 10px;
  padding: 20px;
}
body.tryout-form h2.section {
  margin: 28px 0 12px;
  font-size: 1.25em;
  color: #fff;
  border-left: 4px solid #b30000;
  padding-left: 8px;
}
body.tryout-form .grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 12px;
}
body.tryout-form .col-6 { grid-column: span 6; }
body.tryout-form .col-4 { grid-column: span 4; }
body.tryout-form .col-3 { grid-column: span 3; }
body.tryout-form .col-12 { grid-column: span 12; }
body.tryout-form label {
  display: block;
  font-weight: bold;
  margin-bottom: 6px;
}
body.tryout-form select,
body.tryout-form input[type="text"],
body.tryout-form input[type="date"],
body.tryout-form input[type="email"],
body.tryout-form input[type="tel"] {
  width: 100%;
  padding: 10px;
  border-radius: 6px;
  border: 1px solid #444;
  background: #111;
  color: #fff;
}
body.tryout-form .note { font-size: 0.9em; color: #ccc; }
body.tryout-form .advisory {
  background: rgba(179,0,0,0.15);
  border-left: 4px solid #b30000;
  padding: 10px 12px;
  margin: 8px 0 16px;
  color: #fff;
}
body.tryout-form .actions {
  margin-top: 10px;
  display: flex;
  gap: 12px;
}
body.tryout-form .btn {
  background: #b30000;
  color: #fff;
  border: none;
  padding: 12px 18px;
  border-radius: 8px;
  font-weight: bold;
  cursor: pointer;
}
body.tryout-form .btn:disabled { opacity: 0.6; cursor: not-allowed; }
body.tryout-form .inline-readonly {
  display: inline-block;
  min-width: 140px;
  padding: 10px;
  margin-left: 8px;
  background:#111;border:1px solid #444;border-radius:6px;color:#fff;
}


/* === Tryout Registration Section 1 (vertical) === */
.tryout-s1 label { display:block; font-weight:700; margin:8px 0 6px; color:#fff; }
.tryout-s1 .form-row {   }
.tryout-s1 input, .tryout-s1 select { width:100%; padding:10px; border-radius:6px; border:1px solid #444; background:#111; color:#fff; font-family: Arial, sans-serif; font-size: 16px; }


/* === Section 1 visual adjustments (v2) === */
.tryout-s1 { padding-left: 56px; } /* left indent for headers and fields */
.tryout-s1 h2 { color: #fff !important; }
.tryout-s1 .form-row { margin-left: 0;  } /* rows follow container padding */
.tryout-s1 label { color: #fff !important; }
 /* reduce field width by ~50% */



/* Inline height selects */
.height-inline { display: flex; align-items: center; gap: 8px; }
#playerHeightFeet, #playerHeightInches { width: 12ch !important; max-width: 100%; }


/* Narrower widths for specific form fields */
#playerState, 


/* Narrow width for DOB manual entry */


/* Narrow dropdowns for Primary and Secondary Position based on content length */
#playerPrimaryPos, #playerSecondaryPos {
  width: auto !important;
  max-width: 100%;
}


/* DOB text input sized to MM/DD/YYYY length */


/* Primary/Secondary selects sized to content */
#playerPrimaryPos, #playerSecondaryPos { width: auto !important; min-width: 24ch; }

/* v13 fixes */
#playerState, 
/* State width override for full visibility */
.tryout-s1 #playerState { width: 24ch !important; }

/* DelVal required red (CMYK 0,100,100,10 -> #E60012) */

.optional { color: #E60012; font-weight: 600; }

/* Ensure section note margins and optional styles */

.section-note .optional {
  font-weight: normal;
}
/* Make optional in labels red, unbolded, including parentheses */
label .optional {
  color: #E60012;
  font-weight: normal;
}

/* Normalize spacing around Section 1 heading and note */


/* Ensure equal spacing below the note into the first field row */

/* Keep optional styling rules */
.section-note .optional { font-weight: normal; }
label .optional { color: #E60012; font-weight: normal; }


/* ---- Equalized spacing around Section 1 note (no margin collapse) ---- */
.container.tryout-s1 h2 {
  color: #ffffff;
  margin: 28px 0 14px; /* fixed bottom spacing */
  font-size: 1.5em;
  font-weight: 700;
}
.section-note {
  color: #E60012;
  margin: 0;              /* prevent margin collapse */
  padding: 0 0 14px 0;    /* fixed space below */
}
/* Ensure the first field row doesn't add extra space above */
.section-note + .form-row { margin-top: 0;  }

/* Typography for optional */
.section-note .optional { font-weight: normal; }
label .optional { color: #E60012; font-weight: normal; }



/* Match DOB field font/style to other entry fields */
#playerDob[type="date"],



/* Ensure date input displays same font as other fields */


/* Tame internal parts of Chrome date input */
#playerDOB::-webkit-datetime-edit,
#playerDOB::-webkit-datetime-edit-text,
#playerDOB::-webkit-datetime-edit-year-field,
#playerDOB::-webkit-datetime-edit-month-field,
#playerDOB::-webkit-datetime-edit-day-field {
  font-family: Arial, sans-serif;
  font-size: 16px;
  color: #fff;
}
#playerDOB::-webkit-calendar-picker-indicator {
  filter: invert(1);
}



/* Match Player's Zip Code field width to label width */
#playerZip {
  width: 11ch; /* approx width of 'Player's Zip Code' */
}

/* Match Player's Date of Birth field width to label width */



#playerZip, #playerDOB { width: auto; display: inline-block; }

/* Inline age display next to DOB input */
.age-display { color: #ffffff; margin-left: 16px !important; white-space: nowrap; font-size: 16px; }
#playerAge { color: #E60012; font-weight: 600; }

/* Ensure consistent label-to-field spacing for all form rows */
.form-row label + div { margin-top: 3px; }

/* Match label-to-field spacing for Height and Weight rows to Zip Code field */
#playerHeightFeet, #playerHeightInches, #playerWeight {
    margin-top: 0;
}
.form-row label + div#playerHeightWrapper,
.form-row label + div#playerWeightWrapper {
    margin-top: 0;
}

/* Ensure consistent top spacing before Player's Weight row */
#playerWeight {
    margin-top: 0;
}
#playerWeight
/* Ensure consistent top spacing before Player's Weight row */


.form-row { margin-bottom: 20px; }

.field-note { color: #E60012; margin: 6px 0; }

/* Section headings for Parent / Guardian blocks */
.section-heading {
  color: #ffffff;
  font-weight: 700;
  font-size: 20px;
  margin: 28px 0 14px;
  border-top: 1px solid #333;
  padding-top: 8px;
}


/* Strong red section divider for form sections */
.section-divider {
  border: 0;
  height: 4px;
  background-color: #E60000; /* CMYK 0,100,100,10 */
  margin: 24px 0;
}



/* Ensure section headers match in style */
h2 {
  font-size: 1.5em;
  font-weight: bold;
}



/* Ensure all form labels have the same font size */
form label {
  font-size: 1em;
}



/* Ensure all section headings have same font size */
h2 {
  font-size: 1.5em;
  font-weight: bold;
}



/* Ensure consistent label font size for Player's and Parent / Guardian fields */
form label {
  font-size: 1em;
}


                 /* ensure baseline alignment */

/* Top-level items: vertically center using the bar height */

/* Submenus: reset spacing so line-height from top-level doesn't leak down */

/* Submenu containers: consistent positioning */

/* Ensure no unexpected wrapping on top-level */



/* === Submenu spacing uniformity (TRYOUT INFO fix) === */


/* === FINAL OVERRIDES: Menu & Banner height lock ===
   Reason: previous 'height' + existing vertical padding made bars look taller. /* keep consistent sitewide */


.banner {
  height: var(--bar-height);       /* match menu height exactly */
  padding: 0 10px;                 /* horizontal padding only */
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

                   /* ensure no flex gap */

.banner { margin: 0; border-top: 0; }        /* no top edge gap */             /* belt-and-suspenders */


/* === RIGHT-EDGE SEAM FIX ===
   Ensure bars paint to the very edge and avoid sub-pixel gaps at some zoom levels.
*/
html, body { margin: 0; padding: 0; overflow-x: hidden; }
/* Clip any fractional overdraw that can show as a 1px sliver at the viewport edge */


/* === DROPDOWN RESTORE (v96) ===
   Undo overflow clipping that hid second/third-level menus.
   Keep seam fixes without clipping absolutely-positioned submenus.
*/  /* allow dropdowns to escape */      /* ensure nav sits above banner */                    /* ensure submenus sit above nav/banner */


/* === SEAM OVERLAP (v97) ===
.banner { position: relative; z-index: 0; margin-top: -1px; border-top: 0; }


/* === DROPDOWN H-OVERFLOW RESTORE (v98) ===
   Reason: body/html { overflow-x: hidden } was clipping wide right-opening submenus.
   Fix: allow horizontal overflow so full submenu remains visible.
*/
html, body { overflow-x: visible !important; }

/* === SEAM FINAL (v99) ===





/* === DESKTOP: precise widths for guardian fields to match Section I (v107) === */
@media (min-width: 1024px) {
  #guardian1First { width: 60ch !important; max-width: 60ch; flex: 0 0 60ch; }
  #guardian2First { width: 60ch !important; max-width: 60ch; flex: 0 0 60ch; }
  #guardian1Last { width: 60ch !important; max-width: 60ch; flex: 0 0 60ch; }
  #guardian2Last { width: 60ch !important; max-width: 60ch; flex: 0 0 60ch; }
  #guardian1Street { width: 80ch !important; max-width: 80ch; flex: 0 0 80ch; }
  #guardian2Street { width: 80ch !important; max-width: 80ch; flex: 0 0 80ch; }
  #guardian1City { width: 60ch !important; max-width: 60ch; flex: 0 0 60ch; }
  #guardian2City { width: 60ch !important; max-width: 60ch; flex: 0 0 60ch; }
  #guardian1Cell { width: 20ch !important; max-width: 20ch; flex: 0 0 20ch; }
  #guardian2Cell { width: 20ch !important; max-width: 20ch; flex: 0 0 20ch; }
  #guardian1Email { width: 60ch !important; max-width: 60ch; flex: 0 0 60ch; }
  #guardian2Email { width: 60ch !important; max-width: 60ch; flex: 0 0 60ch; }
}


.section-header.section-spacer {
  max-width: 980px;        /* match .container */
  margin: 28px auto 8px;   /* center in page and mimic spacing */
  padding: 0 20px;         /* match .container padding */
  color: #ffffff;          /* match Section I h2 color */
  font-size: 1.5em;        /* match Section I h2 size */
  font-weight: 700;        /* match Section I h2 weight */
}


@media (min-width: 768px) {
  .section-header.section-spacer {
    max-width: 980px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}



@media (min-width: 768px) {
  .container .section-header.section-spacer {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}


/* === v113 Pitching Roles Multi-Select (scoped) === */




/* === v114 Pitching opt-in and unified details === */
#pitchingOptInGroup { margin-top: 7px; }
#pitchingDetails { display: none; margin-top: 4px; }




/* === v116 Roles dropdown under each frequency row === */
.pitch-roles-group .roles-multiselect { position: relative; display: inline-block; width: 40ch; }
.pitch-roles-group .roles-trigger {
  width: 100%; text-align: left; padding: 8px 10px; border: 1px solid #ccc; border-radius: 4px;
  background: #fff; cursor: pointer; font: inherit;
}
.pitch-roles-group .roles-trigger::after { content: "▾"; float: right; }
.pitch-roles-group .roles-panel {
  position: absolute; top: calc(100% + 4px); left: 0; width: 100%;
  border: 1px solid #ccc; border-radius: 6px; background: #fff; box-shadow: 0 6px 16px rgba(0,0,0,.12);
  padding: 8px 0; display: none; z-index: 2600; max-height: 240px; overflow: auto;
}
.pitch-roles-group .roles-item { display: flex; align-items: center; gap: 8px; padding: 6px 10px; }
.pitch-roles-group .roles-item:hover { background: #f6f6f6; }
.pitch-roles-group .roles-error { color: #E60000; font-size: .9em; margin-top: 3px; display: none; }
.pitch-roles-group .roles-multiselect.open .roles-panel { display: block; }



/* === v118 Pitching utilization dropdown polish === */
.pitch-roles-group { position: relative; overflow: visible; }                /* allow panel to overflow */
.container.tryout-s1, #tryoutForm, #tryoutForm .form-row { overflow: visible; } /* extra safety */

.pitch-roles-group .roles-trigger {
  background: #fff;
  color: #333;
  border: 1px solid #bfbfbf;
  border-radius: 4px;
  padding: 8px 10px;
  width: 100%;
  text-align: left;
  font: inherit;
}
.pitch-roles-group .roles-trigger:focus {
  outline: 2px solid rgba(0, 123, 255, 0.35);
  outline-offset: 1px;
}

.pitch-roles-group .roles-panel {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  width: 100%;
  border: 1px solid #bfbfbf;
  border-radius: 6px;
  background: #fff;
  color: #333;
  box-shadow: 0 6px 16px rgba(0,0,0,.12);
  padding: 6px 0;
  display: none;
  z-index: 5000;          /* ensure above other content */
  max-height: 240px;
  overflow: auto;
}

.pitch-roles-group .roles-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
}
.pitch-roles-group .roles-item:hover { background: #f6f6f6; }
.pitch-roles-group .roles-item input[type="checkbox"] { accent-color: #E60000; } /* brand red */

.pitch-roles-group .roles-error {
  color: #E60000;
  font-size: .9em;
  margin-top: 3px;
  display: none;
}

.pitch-roles-group .roles-multiselect { position: relative; display: inline-block; }
.pitch-roles-group .roles-multiselect.open .roles-panel { display: block; }

/* Caret styling consistent with selects */
.pitch-roles-group .roles-trigger::after {
  content: "▾";
  float: right;
}



.tryout-s1 input.width15ch, .tryout-s1 select.width15ch { width: 15ch !important; max-width: 100%; }
.tryout-s1 input.width20ch, .tryout-s1 select.width20ch { width: 20ch !important; max-width: 100%; }
.tryout-s1 input.width40ch, .tryout-s1 select.width40ch { width: 40ch !important; max-width: 100%; }
.tryout-s1 input.width50ch, .tryout-s1 select.width50ch { width: 50ch !important; max-width: 100%; }
.tryout-s1 input.width60ch, .tryout-s1 select.width60ch { width: 60ch !important; max-width: 100%; }
.tryout-s1 input.width75ch, .tryout-s1 select.width75ch { width: 75ch !important; max-width: 100%; }
.tryout-s1 input.width80ch, .tryout-s1 select.width80ch { width: 80ch !important; max-width: 100%; }

/* Apply the 110ch default ONLY when no width class is present */
.tryout-s1 input:not([class*="width"]), 
.tryout-s1 select:not([class*="width"]) {
  width: 110ch; max-width: 100%;
}

/* Keep global 100% rule from overriding explicit width classes */
body.tryout-form input[class*="width"], 
body.tryout-form select[class*="width"] {
  width: auto; /* the class-specific rules above set the exact ch width */
}


/* Canonical width classes for tryout form (moved to stylesheet in v124) */
/* Canonical width classes for tryout form */
form select.width15ch, form input.width15ch, form textarea.width15ch { width: 15ch !important; max-width: 100%; }
form select.width20ch, form input.width20ch, form textarea.width20ch { width: 20ch !important; max-width: 100%; }
form select.width40ch, form input.width40ch, form textarea.width40ch { width: 40ch !important; max-width: 100%; }
form select.width50ch, form input.width50ch, form textarea.width50ch { width: 50ch !important; max-width: 100%; }
form select.width60ch, form input.width60ch, form textarea.width60ch { width: 60ch !important; max-width: 100%; }
form select.width75ch, form input.width75ch, form textarea.width75ch { width: 75ch !important; max-width: 100%; }
form select.width80ch, form input.width80ch, form textarea.width80ch { width: 80ch !important; max-width: 100%; }


/* === v126: Pitching utilization dropdown — match site theme & visibility === */
.pitch-roles-group { position: relative; overflow: visible; }
.pitch-roles-group .roles-trigger {
  background: #111;
  color: #fff;
  border: 1px solid #444;
  border-radius: 6px;
  padding: 10px;
  width: 100%;
  text-align: left;
  font: inherit;
}
.pitch-roles-group .roles-trigger:focus {
  outline: 2px solid rgba(230,0,0,0.35);
  outline-offset: 1px;
}
.pitch-roles-group .roles-panel {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  width: 100%;
  border: 1px solid #444;
  border-radius: 6px;
  background: #111;
  color: #fff;
  box-shadow: 0 6px 16px rgba(0,0,0,.35);
  padding: 6px 0;
  display: none;
  z-index: 6000;
  max-height: 260px;
  overflow: auto;
}
.pitch-roles-group .roles-item { display:flex; align-items:center; gap:8px; padding: 8px 10px; }
.pitch-roles-group .roles-item:hover { background: #1a1a1a; }
.pitch-roles-group .roles-item input[type="checkbox"] { accent-color: #E60000; }
.pitch-roles-group .roles-error { color:#E60000; font-size:.9em; margin-top:3px; display:none; }
.pitch-roles-group .roles-multiselect { position:relative; display:inline-block; }
.pitch-roles-group .roles-multiselect.open .roles-panel { display:block; }
.pitch-roles-group .roles-trigger::after { content:"▾"; float:right; }


/* v126: added 45ch width utility */
form select.width45ch, form input.width45ch, form textarea.width45ch { width: 45ch !important; max-width: 100%; }

/* v135: 24ch width utility for selects/inputs */
form select.width24ch, form input.width24ch, form textarea.width24ch { width: 24ch !important; max-width: 100%; }


/* keep red text */
}
#soleGuardianRow input[type="checkbox"] {
  margin-left: 0 !important; 
  margin-right: 8px; 
}
/* Some themes add left padding to .form-row; remove it here only */
.tryout-s1 #soleGuardianRow.form-row { padding-left: 0 !important; }
/* Ensure the row follows the same width as labels (flush with h2 text) */
.tryout-s1 h2 + #soleGuardianRow { margin-top: 4px; }



/* red text */
}
.section-followup input[type="checkbox"] {
  margin: 0; /* flush-left alignment under the S of SECTION II */
}





/* v142: Sole guardian note styling to match section notes */
#soleGuardianNote .sole-guardian-label{
  display:inline-flex; align-items:center; gap:6px;
  color:#E60000; font-weight:400; line-height:1.3;
  margin:0; padding:0;
}
#soleGuardianNote input[type="checkbox"]{ margin:0; }
 /* uniform gap */

/* v146 sole-guardian-note: match Section I note alignment */
.section-note.sole-guardian-note{
  display: flex; align-items: center; gap: 6px;
  margin: 6px 0 14px 0; padding: 0;
}
.section-note.sole-guardian-note label{ 
  display: inline-flex; align-items: center; gap: 6px; 
  margin: 0; padding: 0; color: #E60000; font-weight: 400; 
}
.section-note.sole-guardian-note input[type="checkbox"]{ margin: 0; }

/* v147: (debug) measurement visuals added via JS */

/* v149: Section II header+note moved outside form to mirror Section I */


/* ==== v153 First-level menu spacing & fit (DVHD) ====
   Goals:
   - All first-level items fit on desktop without overflow.
   - Equal left/right padding per item.
   - Even distribution across the full red bar.
   - No wrapping of item labels.
*/
:root {
  --menu-xpad: clamp(8px, 0.9vw, 16px);
  --menu-font: clamp(14px, 1vw, 16px);
}

/* Layout the top UL as a flex row that fills the bar */

/* Make each first-level LI share the width evenly */

/* Anchor/span hit areas with equal side padding and no wrap */

/* Ensure dropdown caret/chevron elements don't cause width explosion */


/* ==== v154 Menu rescue: minimal fit + revert flex on items ====
   - Keep existing even distribution (space-evenly) from your base CSS.
   - Ensure items don't overflow on desktop.
   - Equal horizontal padding per item; labels don't wrap.
*/
:root {
  --menu-xpad: clamp(6px, 0.8vw, 12px);
  --menu-font: clamp(13px, 0.95vw, 16px);
}

/* Revert any previous flex:1 on top-level LIs */

/* Tighten side padding and font a touch so all items fit */

/* Keep the UL edge padding modest */

/* === v155 menu from v138 injected === */
nav { height: var(--bar-height); }

nav ul li a { line-height: var(--bar-height); padding-top: 0; padding-bottom: 0; }

nav {
  background-color: #cc0000;
  color: white;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  font-weight: bold;
  padding: 10px 0;
  flex-wrap: wrap;
}

nav > ul {
  list-style: none;
  display: flex;
  justify-content: space-evenly;
  width: 100%;
  padding: 0;
  margin: 0;
}

nav > ul > li {
  position: relative;
}

nav a, nav span {
  color: white;
  text-decoration: none;
  padding: 6px 14px;
  display: block;
  white-space: nowrap;
}

nav span {
  cursor: default;
}

nav a:hover, nav span:hover {
  background-color: #cc0000;
}

nav ul ul {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background-color: #cc0000;
  list-style: none;
  padding: 0;
  margin: 0;
  min-width: 220px;
}

nav ul li:hover > ul {
  display: block;
}

nav ul ul li {
  position: relative;
}

nav ul ul ul {
  top: 0;
  left: 100%;
}

nav li:has(ul) > a:not(:only-child)::after,
nav li:has(ul) > span.chevron::after {
  content: " ›";
}

nav li > a:only-child::after {
  content: "";
}

/* --- NAV LAYOUT SAFETY NET --- */
nav { display: flex; justify-content: space-evenly; align-items: center; font-weight: bold; padding: 10px 0; flex-wrap: wrap; }

nav > ul { list-style: none; display: flex; justify-content: space-evenly; width: 100%; padding: 0; margin: 0; }

nav ul li { position: relative; white-space: nowrap; }

nav ul li a, nav ul li span.chevron { display: block; padding: 10px 20px; color: white; text-decoration: none; font-weight: bold; }

nav ul li a:hover, nav ul li span.chevron:hover { text-decoration: underline; }

nav ul ul { display: none; position: absolute; top: 100%; left: 0; background-color: #cc0000; list-style: none; padding: 0; margin: 0; min-width: 220px; }

nav ul li:hover > ul { display: block; }

nav ul ul ul { top: 0; left: 100%; }

nav { position: relative; z-index: 1000; }

nav ul ul { z-index: 2000; }

/* === NAV FIX (scoped) ===
   Restore clean top-level alignment and consistent submenu spacing.
   - Only top-level links use the bar height for vertical centering.
   - Submenu links use natural line-height and uniform padding.
*/
nav { display: flex; align-items: center; }

nav > ul { display: flex; align-items: center; width: 100%; justify-content: space-evenly; }

nav > ul > li { display: flex; align-items: stretch; }

nav > ul > li > a,
nav > ul > li > span.chevron {
  line-height: var(--bar-height);
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
  align-items: center;
}

nav ul ul a,
nav ul ul span.chevron {
  line-height: 1.4;
  padding: 10px 16px;
  display: block;
}

nav ul ul { top: 100%; left: 0; }

nav ul ul ul { top: 0; left: 100%; }

nav > ul > li { white-space: nowrap; }

nav ul ul li, 
nav ul ul a {
  white-space: nowrap;   /* prevent two-line wrap on long labels */
}

nav ul ul a {
  margin: 0;             /* remove any inherited margins */
  padding: 10px 16px;    /* keep consistent padding */
  line-height: 1.4;      /* consistent line height */
}

   Fix: zero out vertical padding on nav, set explicit height on both, and use box-sizing.
*/
:root { --bar-height: 56px; }

nav {
  height: var(--bar-height);
  padding: 0;                 /* remove vertical padding so height is exact */
  box-sizing: border-box;
}

nav > ul > li > a,
nav > ul > li > span.chevron {
  line-height: var(--bar-height);  /* vertically center top-level items */
  padding-top: 0;
  padding-bottom: 0;
}

/* === SEAM FIX: eliminate tiny gap between nav and banner ===
   Cause: default margins on UL or content leading to perceived gap (margin escape / rounding).
   Fix: zero margins on nav + ul + banner and explicitly zero the adjacent margin.
*/
nav { margin: 0; gap: 0; }

nav > ul { margin: 0; padding: 0; }

nav > ul > li { margin: 0; }

nav + .banner { margin-top: 0; }

nav, .banner { width: 100%; max-width: 100%; margin-right: 0; border-right: 0; box-sizing: border-box; }

nav, .banner { overflow: hidden; }

nav, .banner { overflow: visible !important; }

nav { position: relative; z-index: 1000; }

nav ul ul { z-index: 2000; }

   Hide any sub-pixel gap by tucking the white banner 1px under the red nav.
   Keeps overflow visible so dropdowns render correctly.
*/
nav { position: relative; z-index: 1000; }

   Replace margin overlap with a painted seam: an inset 1px top line in banner matching nav's red.
   This eliminates gaps at all zooms and edges without touching overflow.
*/
.banner { margin-top: 0 !important; box-shadow: inset 0 1px 0 #cc0000; }

nav { height: var(--bar-height); }

nav ul li a { line-height: var(--bar-height); padding-top: 0; padding-bottom: 0; }

nav {
  background-color: #cc0000;
  color: white;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  font-weight: bold;
  padding: 10px 0;
  flex-wrap: wrap;
}

nav > ul {
  list-style: none;
  display: flex;
  justify-content: space-evenly;
  width: 100%;
  padding: 0;
  margin: 0;
}

nav > ul > li {
  position: relative;
}

nav a, nav span {
  color: white;
  text-decoration: none;
  padding: 6px 14px;
  display: block;
  white-space: nowrap;
}

nav span {
  cursor: default;
}

nav a:hover, nav span:hover {
  background-color: #cc0000;
}

nav ul ul {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background-color: #cc0000;
  list-style: none;
  padding: 0;
  margin: 0;
  min-width: 220px;
}

nav ul li:hover > ul {
  display: block;
}

nav ul ul li {
  position: relative;
}

nav ul ul ul {
  top: 0;
  left: 100%;
}

nav li:has(ul) > a:not(:only-child)::after,
nav li:has(ul) > span.chevron::after {
  content: " ›";
}

nav li > a:only-child::after {
  content: "";
}

/* --- NAV LAYOUT SAFETY NET --- */
nav { display: flex; justify-content: space-evenly; align-items: center; font-weight: bold; padding: 10px 0; flex-wrap: wrap; }

nav > ul { list-style: none; display: flex; justify-content: space-evenly; width: 100%; padding: 0; margin: 0; }

nav ul li { position: relative; white-space: nowrap; }

nav ul li a, nav ul li span.chevron { display: block; padding: 10px 20px; color: white; text-decoration: none; font-weight: bold; }

nav ul li a:hover, nav ul li span.chevron:hover { text-decoration: underline; }

nav ul ul { display: none; position: absolute; top: 100%; left: 0; background-color: #cc0000; list-style: none; padding: 0; margin: 0; min-width: 220px; }

nav ul li:hover > ul { display: block; }

nav ul ul ul { top: 0; left: 100%; }

nav { position: relative; z-index: 1000; }

nav ul ul { z-index: 2000; }

/* === NAV FIX (scoped) ===
   Restore clean top-level alignment and consistent submenu spacing.
   - Only top-level links use the bar height for vertical centering.
   - Submenu links use natural line-height and uniform padding.
*/
nav { display: flex; align-items: center; }

nav > ul { display: flex; align-items: center; width: 100%; justify-content: space-evenly; }

nav > ul > li { display: flex; align-items: stretch; }

nav > ul > li > a,
nav > ul > li > span.chevron {
  line-height: var(--bar-height);
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
  align-items: center;
}

nav ul ul a,
nav ul ul span.chevron {
  line-height: 1.4;
  padding: 10px 16px;
  display: block;
}

nav ul ul { top: 100%; left: 0; }

nav ul ul ul { top: 0; left: 100%; }

nav > ul > li { white-space: nowrap; }

nav ul ul li, 
nav ul ul a {
  white-space: nowrap;   /* prevent two-line wrap on long labels */
}

nav ul ul a {
  margin: 0;             /* remove any inherited margins */
  padding: 10px 16px;    /* keep consistent padding */
  line-height: 1.4;      /* consistent line height */
}

   Fix: zero out vertical padding on nav, set explicit height on both, and use box-sizing.
*/
:root { --bar-height: 56px; }

nav {
  height: var(--bar-height);
  padding: 0;                 /* remove vertical padding so height is exact */
  box-sizing: border-box;
}

nav > ul > li > a,
nav > ul > li > span.chevron {
  line-height: var(--bar-height);  /* vertically center top-level items */
  padding-top: 0;
  padding-bottom: 0;
}

/* === SEAM FIX: eliminate tiny gap between nav and banner ===
   Cause: default margins on UL or content leading to perceived gap (margin escape / rounding).
   Fix: zero margins on nav + ul + banner and explicitly zero the adjacent margin.
*/
nav { margin: 0; gap: 0; }

nav > ul { margin: 0; padding: 0; }

nav > ul > li { margin: 0; }

nav + .banner { margin-top: 0; }

nav, .banner { width: 100%; max-width: 100%; margin-right: 0; border-right: 0; box-sizing: border-box; }

nav, .banner { overflow: hidden; }

nav, .banner { overflow: visible !important; }

nav { position: relative; z-index: 1000; }

nav ul ul { z-index: 2000; }

   Hide any sub-pixel gap by tucking the white banner 1px under the red nav.
   Keeps overflow visible so dropdowns render correctly.
*/
nav { position: relative; z-index: 1000; }

   Replace margin overlap with a painted seam: an inset 1px top line in banner matching nav's red.
   This eliminates gaps at all zooms and edges without touching overflow.
*/
.banner { margin-top: 0 !important; box-shadow: inset 0 1px 0 #cc0000; }
/* v160 logo link helper */
.logo-link{display:inline-block;text-decoration:none;}
.logo-link img{display:block;}


/* v161 logo centering fix */
header .logo-link {
  display: block;
  width: 400px;            /* match existing logo width spec */
  margin: 20px auto;       /* center horizontally + keep vertical spacing */
  text-decoration: none;
}
header .logo-link img {
  display: block;
  width: 100%;             /* ensures image fills the anchor width */
  height: auto;
}


#medicalConditionsText::placeholder {
  font-style: italic;
}


#currentTeams::placeholder {
  font-style: italic;
}


#otherTeamsText::placeholder {
  font-style: italic;
}


#playerCurrentProgramsList::placeholder {
  font-style: italic;
}


#playerRemainProgramsList::placeholder {
  font-style: italic;
}

/* v404: restore default spacing for pitching role rows */
.pitch-roles-group .form-row { margin-bottom: 20px !important; }

/* v405: normalize LR→CL spacing to global */


/* v407: normalize LR→CL spacing to match global rhythm */
#pitchingDetails .form-row { margin-bottom: 20px !important; }


/* v417: Normalize vertical rhythm inside pitching details */
#pitchingDetails {
  row-gap: 0 !important;
  grid-row-gap: 0 !important;
}
#pitchingDetails .form-row {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
#pitchingDetails .form-row + .form-row {
  margin-top: 10px !important;
}


/* === DVHD v489: Guardian #1 Relationship stack — exact 20px rhythm ===
Target stack:
  #guardian1RelationshipRow (dropdown)
    ↳ #guardian1RelationshipOtherRow (conditional, child; shown only on Other)
  #guardian1StreetRow (next row)

Goals:
  - Conditional CLOSED: 20px between dropdown and Street.
  - Conditional OPEN:   20px between dropdown and conditional, and 20px from (Relationship block) to Street.
  - Mirror First↔Last Name spacing (20px) consistently.
*/

:root { --dvhd-row-gap: 20px; }

/* Relationship parent behaves like a normal row: provides 20px below to the next row */
form#tryoutForm #guardian1RelationshipRow {
  margin-top: 0 !important;
  margin-bottom: var(--dvhd-row-gap) !important; /* ensures 20px to Street when conditional is closed */
  padding-bottom: 0 !important;
  gap: 0 !important;
  row-gap: 0 !important;
}

/* Conditional child spacing inside the Relationship block */
form#tryoutForm #guardian1RelationshipRow #guardian1RelationshipOtherRow {
  display: block;                    /* visible when toggled; leave toggle to JS */
  margin-top: var(--dvhd-row-gap) !important;   /* dropdown → conditional = 20px */
  margin-bottom: 0 !important;       /* prevents stacking with parent bottom margin */
  padding: 0 !important;
}
/* Hidden state must be gapless */
form#tryoutForm #guardian1RelationshipRow #guardian1RelationshipOtherRow[hidden],
form#tryoutForm #guardian1RelationshipRow #guardian1RelationshipOtherRow.hidden {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Street Address row: never add extra top spacing; spacing comes from the block above */
form#tryoutForm #guardian1StreetRow {
  margin-top: 0 !important;
  padding-top: 0 !important;
}


/* === DVHD v491: Strict 20px rhythm from Guardian Count through Guardian #1 Email === */
:root { --dvhd-row-gap: 20px; }
#dvhd_does-the-player-have-any-medical-history-or-medica_row { margin-top: 0 !important; }
#guardian1RelationshipRow #guardian1RelationshipOtherRow { margin-top: var(--dvhd-row-gap) !important; }
#guardian1RelationshipRow #guardian1RelationshipOtherRow[hidden],
#guardian1RelationshipRow #guardian1RelationshipOtherRow.hidden { margin-top: 0 !important; display:none !important; }
/* === End DVHD v491 === */


/* === DVHD v492: Guardian #1 stack strict 20px (defense-in-depth) === */
:root { --g1-gap: 20px; }
.form-row.g1-20 { margin-top: 0 !important; margin-bottom: var(--g1-gap) !important; }
#numGuardiansRow.g1-20 { margin-top: 8px !important; }
form#tryoutForm #guardian1RelationshipRow { margin-bottom: var(--g1-gap) !important; }
form#tryoutForm #guardian1RelationshipRow #guardian1RelationshipOtherRow {
  margin-top: var(--g1-gap) !important;
  margin-bottom: 0 !important;
}
form#tryoutForm #guardian1RelationshipRow #guardian1RelationshipOtherRow[hidden],
form#tryoutForm #guardian1RelationshipRow #guardian1RelationshipOtherRow.hidden {
  display: none !important;
  margin: 0 !important; padding: 0 !important;
}
/* === End DVHD v492 === */



/* === Width consistency: ensure lists don't indent beyond paragraph left edge === */
.home-content ul,
.home-content ol {
  margin-left: 0 !important;
  padding-left: 0 !important;
}

.home-content li {
  margin-left: 0 !important; /* align with paragraph edge */
  padding-left: 0 !important;
}

/* Optional: consistent text alignment within content blocks */
.home-content { text-align: left !important; }
















/* === DVHD v571: Container-level 35px top spacing; collapse-proof; identical on Home & Our Insurance === */
#dvhd-content-root {
  overflow: auto !important; /* prevent top margin collapsing from first child */
  padding-top: 0 !important; /* ensure no hidden offsets here */
}

/* Apply spacing to the content wrapper itself (not the <p>) */
#dvhd-content-root > .home-content,
#dvhd-content-root > section.dvhd-insurance > .home-content,
#dvhd-content-root > .content {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Ensure the very first child inside the wrapper doesn't add extra top margin */
#dvhd-content-root > .home-content > *:first-child,
#dvhd-content-root > section.dvhd-insurance > .home-content > *:first-child,
#dvhd-content-root > .content > *:first-child {
  margin-top: 0 !important;
}
/* === End DVHD v571 === */

/* v572: ensure wrapper doesn't add top offset that conflicts with 36px on first paragraph */
#dvhd-content-root > .home-content,
#dvhd-content-root > section.dvhd-insurance > .home-content,
#dvhd-content-root > .content { margin-top: 0 !important; padding-top: 0 !important; }

#dvhd-content-root > .home-content > *:first-child,
#dvhd-content-root > section.dvhd-insurance > .home-content > *:first-child,
#dvhd-content-root > .content > *:first-child { margin-top: 0 !important; }


/* === DVHD v577: Deterministic spacing alignment for Home & Our Insurance === */
/* 1) Horizontal edges */
.home-content { padding-left: 30px !important; }
.dvhd-insurance, section.dvhd-insurance { padding-left: 0 !important; padding-right: 0 !important; margin-left: 0 !important; margin-right: 0 !important; max-width: none !important; }

/* 2) Top offset directly after the banner - both pages */
.banner + .home-content { margin-top: 8px !important; } /* single source of truth */
.banner + section.dvhd-insurance,
.banner + section.dvhd-insurance .home-content { margin-top: 8px !important; } /* safety for older structure */

/* 3) First paragraph baseline */
.home-content > p:first-of-type { margin-top: 0 !important; }

/* 4) Lists inside home-content shouldn't shift left edge */
.home-content ul,
.home-content ol { margin-left: 0 !important; padding-left: 1.2rem !important; } /* bullet indent without moving column */