/* =======================================================================
   0) UNIVERSAL
   ======================================================================= */

/*IF ANYTHING SHOULD BE SIMPLIFIED, PLEASE DO IT*/

/*start Universal*/
/* Make the File block's Download text white (keep whatever bg you already have) */
.make-download-white .wp-block-file__button,
.make-download-white a.wp-block-file__button,
.make-download-white .wp-block-file__button.wp-element-button {
  color: #fff !important;                 /* button label */
  /* no background change here */
}

/*makes the form section to inter information white instead of dark gray)(on page ushrab.org/circuit-rider-archivesit-program) */
/* make all form fields white, everywhere */
input, textarea, select { background:#fff !important; color:#222 !important; }

form input[type="text"],
form input[type="email"],
form input[type="url"],
form input[type="tel"],
form input[type="search"],
form textarea,
form select {
  width: 100% !important;
  padding: 10px 12px;
  font-size: 16px;
  box-sizing: border-box;
}


/*End makes the form...*/


/*end Universal*/


/* =======================================================================
   1) HEADER / NAVIGATION
   ======================================================================= */

/*Header start*/

/* Force background color on the horizontal nav bar */
.wp-block-navigation.custom-nav{
  background-color: #1F4E66 !important; /* your teal */
}

/* Remove any global top padding above the landscape image */
.wp-site-blocks { padding: 0 !important; }

header .wp-block-group:has(> nav.wp-block-navigation) {
  padding-block: 0 !important;    /* top & bottom */
  margin-block: 0 !important;
}

/* Vertical gap inside the blue nav bar */
.wp-block-navigation.custom-nav{
  padding-block: 12px;
  /* top & bottom */
  /* you already have: padding-inline: 20px; */
}

/*start navbar size */
/* this changed how the navbar reacts in size - remains on one line until needed to wrap*/

/* Keep the nav bar full width */
header .wp-block-group:has(> nav.wp-block-navigation){
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Small edge padding so links can use the width */
.wp-block-navigation.custom-nav{
  padding-inline: 6px !important;
}

/* Natural wrap only when there isn't space */
.wp-block-navigation.custom-nav .wp-block-navigation__container{
  flex-wrap: wrap;          /* stays one line until it runs out of room */
  gap: 20px;                /* adjust spacing between items as you like */
}

/* Keep each label flat (no internal line breaks) */
.wp-block-navigation.custom-nav .wp-block-navigation-item__content,
.wp-block-navigation.custom-nav .wp-block-navigation-item__label{
  white-space: nowrap;
}
/* end navbar size*/

/* Remove the space between the header image and the nav bar */
.header-no-gap { gap: 0 !important; }
.header-no-gap > * { margin: 0 !important; }  /* clears any child margins */

/* Mobile Version Bigger hamburger / close button */
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close{
  inline-size: 56px;   /* button width  */
  block-size: 56px;    /* button height */
  display: grid;
  place-items: center;
  padding: 0;
}

/* Bigger icon inside the button */
.wp-block-navigation__responsive-container-open svg,
.wp-block-navigation__responsive-container-close svg{
  width: 56px;
  height: 56px;
}
/* end Mobile Version Bigger hamburger / close button */

/* Make each link label start at the far left edge */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content,
.wp-block-navigation__responsive-dialog.is-menu-open .wp-block-navigation-item__content {
  justify-content:flex-start !important;
  text-align:left !important;
  width:100%;
}

/*xxxxxxxxxxxxxxxxxxxxx*/
/* Start - the hamburger menu still needs work aligning links(tab like function isn't consistent) */


	
  /* Make everything align left cleanly */
  .is-menu-open .wp-block-navigation__container,
  .is-menu-open .wp-block-navigation__submenu-container {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }

  /* Make each item take full width and align text left */
  .is-menu-open .wp-block-navigation-item,
  .is-menu-open .wp-block-navigation-item__content {
    margin: 0 !important;
    padding: 8px 0 !important;
    text-align: left !important;
    width: 100%;
  }

  /* Give submenus a tiny, consistent indent */
  .is-menu-open .wp-block-navigation__submenu-container {
    padding-left: 16px !important;
  }

  /* Parent links (those with children) – bold and colored */
  .is-menu-open .wp-block-navigation-item.has-child > .wp-block-navigation-item__content {
    font-weight: bold; /* bold */
    color: #fff;      /* choose your highlight color */
  }


/* Smaller hero on mobile */

/*end xxxxxxxxxxxxxxxxxxxxx*/

/* 1) Undo the desktop nowrap inside the hamburger menu */
.wp-block-navigation__responsive-container .wp-block-navigation-item__content,
.wp-block-navigation__responsive-container .wp-block-navigation-item__label,
.wp-block-navigation__responsive-dialog .wp-block-navigation-item__content,
.wp-block-navigation__responsive-dialog .wp-block-navigation-item__label{
  white-space: normal !important;
  line-height: 1.3;
}

/* 2) Consistent left indent for submenus (1st level) */
.wp-block-navigation__responsive-container .wp-block-navigation__submenu-container,
.wp-block-navigation__responsive-dialog .wp-block-navigation__submenu-container{
  padding-left: 16px !important;   /* adjust 14–20px to taste */
  margin: 0 !important;
}

/* Bold parents only */
.wp-block-navigation .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
  font-weight: 700 !important;
}

/* Slightly lighter child links */
.wp-block-navigation .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation-item__content {
  font-weight: 500 !important;
}
/*end - the hamburger menu still needs work aligning links*/

/*Header end*/


/* =======================================================================
   2) BODY / GLOBAL CONTENT
   ======================================================================= */

/*Body start*/
/* Provide a margin on left and right side of Body section*/
.wp-block-heading.responsive-heading,
.responsive-heading.has-small-font-size,
.responsive-heading.has-medium-font-size,
.responsive-heading.has-large-font-size,
.responsive-heading.has-x-large-font-size,
.responsive-heading.has-xxl-font-size {
  font-size: clamp(1rem, 5vw, 2.3rem) !important;
  line-height: 1.15;
}

/* ===== Site-wide content width ===== */
:root{
  --content-max: 1200px;   /* change to 1140/1280/etc if you prefer */
  --content-gutter: 20px;  /* side padding on small/medium screens */
}

.wp-site-blocks > main,
.wp-site-blocks .wp-block-post-content{
  max-width: var(--content-max);
  width: 100%;
  margin-inline: auto;                    /* center */
  padding-inline: var(--content-gutter);  /* left/right gutters */
  box-sizing: border-box;
}











/*start - Public Newsletter Archives page*/
/* Change Mailchimp archive link color */
.display_archive a,
.display_archive a:visited {
    color: #1F4E66 !important;   /* your USHRAB teal */
}

/* Optional: hover effect */
.display_archive a:hover {
    color: #0e2d3a !important;   /* darker teal */
    text-decoration: underline;
}
.display_archive {
    font-size: 1rem;   /* roughly 16px – matches standard paragraph */
}

/*end - Public Newsletter Archives page*/

/* =======================================================================
   3) COMPONENTS / SIDEBAR, CARDS
   ======================================================================= */





/* Body end */


/* =======================================================================
   5) FOOTER
   ======================================================================= */

/*Footer*/
/* Make Mailchimp input field full width and readable */
.mc4wp-form input[type="email"],
form input[type="email"] {
  width: 100% !important;
  max-width: 400px;     /* adjust as needed */
  padding: 10px 12px;
  font-size: 16px;
  box-sizing: border-box;
}

/*footer end*/