/**
 * Theme Name: NMMA 2021 Child
 * Template:   twentytwentyone
 * This CSS file overrides the parent theme's. I've tried to keep this as lean as possible.
 *
 */

 /* CATEGORY 01-03 */

 /*These override the theme style's variables used on various classes*/
 /*Variables */
 :root {
   /* Font Family */
   --font-sans: 'Commissioner', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', 'Liberation Sans', sans-serif;
   --font-display: 'Cutive', Georgia, Cambria, 'Times New Roman', Times, serif;
	--global--font-secondary: var(--font-base, 'Commissioner', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif);

   /* Font Size */
	--global--font-size-xxxs: .5rem;
	--global--font-size-xxs: .9rem;
   --global--font-size-xxl: 3rem;
   --global--font-size-xxxl: 3.25rem;
   --primary-nav--font-size: var(--global--font-size-xxs);
	--primary-nav--font-size-sub-menu: var(--global--font-size-xs);
	--primary-nav--font-size-mobile: var(--global--font-size-sm);
	--primary-nav--font-size-sub-menu-mobile: var(--global--font-size-sm);

   /* Headings */
	--heading--font-family: var(--font-display);
   --primary-nav--font-family: var(--font-display);
	--primary-nav--font-family-mobile: var(--font-display);


   /* Spacing */
   --global--spacing-vertical: 12px;
   --global--spacing-horizontal: 8px;

   /* Colors */
   --global--color-background: var(--global--color-white);
   --global--color-brand-main: #3B2D4C;
   --global--color-brand-bright: #623A96;
   --global--color-brand-main-darkx2: #242028;
   --global--color-brand-secondary: #03B2A9;
   --global--color-brand-link: #146F94;
   --global-color-background: #F2F2F2;
   --footer--color-text: var(--global--color-white);
   --footer--color-link: var(--global--color-white);
   --global--color-border: var(--global--color-brand-secondary); /* Used for borders (separators) */


   	/* Buttons */
   --button--color-text: var(--global--color-background);
   --button--color-text-hover: var(--global--color-brand-main);
   --button--color-text-active: var(--global--color-brand-main-darkx2);
   --button--color-background: var(--global--color-brand-link);
   --button--color-background-active: var(--global--color-brand-link);
   --button--font-family: var(--font-sans);
   --button--font-size: var(--global--font-size-base);
   --button--font-weight: 500;
   --button--line-height: 1.5;
   --button--border-width: 0;
   --button--border-radius: 0;
   --button--padding-vertical: 8px;
   --button--padding-horizontal: calc(1.5 * var(--button--padding-vertical));

	/* Footer */
	--footer--color-text: var(--global--color-white);
	--footer--color-link: var(--global--color-white);
	--footer--color-link-hover: var(--global--color-brand-secondary);
	--footer--font-family: var(--font-sans);
	--footer--font-size: var(--global--font-size-sm);
}

html {
	font-family: var(--font-sans);
}

body {
    margin: 0;
    padding: 0;
}

.entry-content > h2, .entry-content > h3 {
   margin-top: calc(4 * var(--global--spacing-vertical));
}

h3, .h3 {
   font-size: calc(1.3 * var(--global--font-size-lg));
}

h3, .h3, h4, .h4 {
   font-family: var(--global--font-secondary);
}

ul {
   padding-left: calc(4 * var(--global--spacing-horizontal));
}

a {
	color: var(--wp--style--color--link, var(--global--color-brand-link));
}

.has-white-background-color a {
   color: var(--wp--style--color--link, var(--global--color-brand-link));
}

.wp-block-columns.wp-block-columns-is-layout-flex {
   margin-top: calc(4 * var(--global--spacing-vertical));
   margin-bottom: calc(4 * var(--global--spacing-vertical));
}

 /*Med size variable rewrites*/
 @media only screen and (min-width: 652px) {

	:root {
		--global--font-size-xxl: 3rem;
		--global--font-size-xxxl: 3.25rem;
      --heading--font-size-h2: var(--global--font-size-xl);
      --heading--font-size-h3: var(--global--font-size-lg);
	}
}

 /*Large size variable rewrites*/
@media only screen and (min-width: 822px) {
   /*Resetting container widths*/
	:root {
		--responsive--aligndefault-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), 1200px);
		--responsive--alignwide-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), 1440px);
	}
}

/* CATEGORY 06 style overrides and new styling
 /* Category 06 contains all "bigger" components which contain elements of the previous two categories like header, footer, page template, single template, comments section, archives, ... */


/**HEADER STUFF**/
 /*HEADING WRAPPER - Adding a wrapper to the header*/
.header-wrapper {
   background-color: var(--global--color-brand-main);
   width: 100%;
}

/*HEADER - Alignment overrides*/
.site-header {
   max-width: var(--responsive--aligndefault-width);
}
.wp-custom-logo .site-header {
   align-items: end;
}
.primary-navigation > div > .menu-wrapper {
   justify-content: center;
}

/*HEADER - text style overrides*/
.site-header a:hover, .site-header a:link, .site-header a:visited, .primary-navigation > div > .menu-wrapper .sub-menu-toggle {
   color: var(--global--color-white);
}
.site-header button.sub-menu-toggle:not(:hover):not(:active):not(.has-background) {
   background-color: transparent;
}
.site-header .sub-menu a {
   color: var(--global--color-brand-link);
   font-family: var(--font-sans);
   font-weight: 500;
}

/*MOBILE MENU - style overrides*/
.menu-button-container #primary-mobile-menu {
   color: var(--global--color-white);
}
.primary-navigation-open .menu-button-container {
   background-color: var(--global--color-brand-main);
}
.primary-navigation > .primary-menu-container {
   background-color: var(--global--color-brand-main);
}


/*UTILITY - Added a utility nav, not an override*/
.secondary-nav {
   width: 100%;
   position: relative;
   margin-left: auto;
   text-transform: uppercase;
   z-index: 999;
}
.secondary-nav ul.utility {
   text-align: right;
}
.secondary-nav ul.utility li {
   display: inline;
   margin-left: calc(3 * var(--global--spacing-horizontal));
   font-size: var(--global--font-size-xs);
}
.secondary-nav a {
   color: var(--global--color-white);
}

/*DROPDOWNS - Style overrides*/
.primary-navigation .sub-menu {
  border: 0px; 
}


/* FOOTER - */

/*FOOTER WRAPPER - Adding a wrapper to the footer*/
.footer-wrapper {
      width: 100%;
      background: var(--global--color-brand-main-darkx2);
}
/*FOOTER - custom styles*/
.site-footer {
   text-align: center;
}
.site-footer .column-1, .site-footer .column-2 {
   width: 100%;
   margin-bottom: calc(2 * var(--global--spacing-vertical));
}
.site-footer h2 {
   font-size: large;
}
/*FOOTER - overriding theme styling*/
.site-footer > .site-info {
   border: 0;
}
/*FOOTER - mailerlite sign up*/
.mailerlite-form-title h3 {
   font-size: large;
   font-family: var(--heading--font-family);
}
.mailerlite-form-inputs label {
   font-size: small;
}
.mailerlite-form-field, .mailerlite-subscribe-button-container {
   display: inline;
}
button.mailerlite-subscribe-submit {
   padding-top: 13px;
   padding-bottom: 13px;
}
/*FOOTER - waiver btn*/
.waiver button {
   display: inline-flex;
   align-items: center;
}

.waiver button span {
   vertical-align: middle;
}
.waiver button svg { width: 40px; fill: var(--global--color-white); }


/**MOBILE ONLY STYLES**/
@media only screen and (max-width: 481.98px) {

   /*UTILITY - Moving to the bottom*/
   .secondary-nav {
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      width: 100%;
      padding: 0;
      background-color: var(--global--color-white);
   }
   .secondary-nav ul.utility {
      display: inline-flex;
      width: 100%;
      text-align: center;
      padding: 0px;
   }
   .secondary-nav ul.utility li {
      width: 50%;
      margin: 0px;
      padding: calc(2 * var(--global--spacing-horizontal));
      color: var(--global--color-brand-link);
      background-color: var(--global--color-brand-main);
      border: 1px solid var(--global--color-brand-main-darkx2);
   }
   .secondary-nav ul.utility li a {
      color: var(--global--color-white);
      box-sizing:border-box;
   }

   /*HEADER - Setting height for wrapper container so it doesn't shrink too small*/
   .site-header {
      min-height: 60px;
   }

   /*MENU - Style overrides*/
   .site-header .sub-menu a {
      color: var(--global--color-white);
   }

   /*FOOTER - Style overrides*/
   .site-footer {
      padding-bottom: 100px;
   }

}

/**TABLET MAX**/
@media only screen and (max-width: 782px) {
   /*Keeping single column layout for longer before breaking into columns*/
   .wp-block-post-template-is-layout-grid.wp-block-post-template-is-layout-grid.wp-block-post-template-is-layout-grid.wp-block-post-template-is-layout-grid {
      grid-template-columns: 1fr;
   }
}

/**MED SIZE AND UP STYLES**/
@media only screen and (min-width: 482px) {
   /*Logo positioning*/
   .site-branding {
      margin: auto;
   }
   /*HEADER - wrapper container*/
   .header-wrapper {
      border-top: 32px solid var(--global--color-brand-main-darkx2);
   }
   /*Navigation wrappers*/
   .nav-wrapper {
      position: relative;
      margin-left: auto;
   }
   /*HEADER - Adjusting padding*/
   .site-header {
      padding-top: var(--global--spacing-vertical);
      padding-bottom: 0px;
   }
   /*DROPDOWN TRIGGER - style overrides*/
   .primary-navigation > div > .menu-wrapper .sub-menu-toggle {
      display: inline;
      height: auto;
      padding-bottom: calc(var(--global--spacing-unit)/6);
   }
   .primary-navigation > div > .menu-wrapper .sub-menu-toggle:focus {
      outline: 0;
   }
   /*DROPDOWNS - Gets rid of the little carets on nav dropdowns*/
   .primary-navigation > div > .menu-wrapper > li > .sub-menu:before, .primary-navigation > div > .menu-wrapper > li > .sub-menu:after {
      display: none;
   }
   /*DROPDOWNS - overrides styles for dropdown menus*/
   .primary-navigation .sub-menu {
      border: 1px solid #DFDFDF;
      border-top: 4px solid var(--global--color-brand-secondary);
      border-radius: 0px 0px 4px 4px;
      overflow: hidden;
      padding-top: 0;
      background-color: var(--global--color-white);
   }
   /*DROPDOWNS - Replaces background color in dropdown menu items*/
   .primary-navigation > div > .menu-wrapper > li > .sub-menu li {
		background: var(--global--color-background);
	}

   /*
   **Custom layout styles**
   */

   /*Session table of classes*/
   .session-grid {
      grid-template-columns: repeat(3, minmax(0, 1fr));
   }

}

/**LRG SIZE AND UP STYLES**/
@media only screen and (min-width: 822px) {
  /*Logo positioning*/
   .site-branding {
      position: absolute;
   }
   /*FOOTER - custom styles*/
   .site-footer {
      position: relative;
      text-align: left;
      background: url('http://nmm-2025.local/wp-content/uploads/2025/08/Footer-Image.png');
      background-position: left top;
      background-repeat: no-repeat;
      background-size: contain;
   }
   .site-footer .site-info {
      width: 100%;
      padding-left: 20%;
      padding-top: calc(4 * var(--global--spacing-vertical));
      align-items: flex-start;
   }
   /*FOOTER - waiver button*/
   .site-footer .waiver {
      position: absolute;
      top: -40px;
      right: 0;
   }
}

/* PAGE CONTENT STUFF
   ========================================================================== */
   
/*Getting rid of the border below the title*/
.singular .entry-header {
	border-bottom: 0;
}


/**
 * Button
 */
.site .button:not(:hover):not(:active):not(.has-background),
button:not(:hover):not(:active):not(.has-background),
input[type=submit]:not(:hover):not(:active):not(.has-background),
input[type=reset]:not(:hover):not(:active):not(.has-background),
.wp-block-search .wp-block-search__button:not(:hover):not(:active):not(.has-background),
.wp-block-button .wp-block-button__link:not(:hover):not(:active):not(.has-background),
.wp-block-file a.wp-block-file__button:not(:hover):not(:active):not(.has-background) {
	background-color: var(--global--color-brand-link);
}

.wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-background) {
   background-color: var(--global--color-brand-link);
}

.site .button:hover,
.site .button:active,
button:hover,
button:active,
input[type=submit]:hover,
input[type=submit]:active,
input[type=reset]:hover,
input[type=reset]:active,
.wp-block-search .wp-block-search__button:hover,
.wp-block-search .wp-block-search__button:active,
.wp-block-button .wp-block-button__link:hover,
.wp-block-button .wp-block-button__link:active,
.wp-block-file a.wp-block-file__button:hover,
.wp-block-file a.wp-block-file__button:active {
	background-color: var(--global--color-brand-bright);
	border-color: currentColor;
	color: var(--global--color-white);
}

.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover, .wp-block-button:not(.is-style-outline) .wp-block-button__link:active {
   background-color: var(--global--color-brand-bright) !important;
	border-color: currentColor !important;
	color: var(--global--color-white) !important;
}

/**
* Content
**/
.wp-block-group.is-style-twentytwentyone-border {
   border: calc(3 * var(--separator--height)) solid var(--global--color-border);
}

/*Details dropdown styles*/
details.wp-block-details.is-layout-flow.wp-block-details-is-layout-flow summary {
   color: var(--global--color-brand-link);
   text-decoration: underline;
}

/*Automatically crop staff image into a circle*/
.staff-grid .wp-block-post-featured-image {
 clip-path: circle(50% at 50% 50%);;
}

/**
* Containers
*/

.entry-header {
   max-width: var(--responsive--aligndefault-width);
}

.entry-header > h1.entry-title {
   margin-top: calc(4 * var(--global--spacing-vertical));
   text-align: center;
}