/* ---------- HERO CONTAINER: full-bleed + cleanup ---------- */

/* Full-bleed: forces the hero container to span edge-to-edge,
   even if the theme wraps content in a constrained column */
.hero-spotlight {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
		
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Prevent tiny left/right gaps created by global padding wrappers */
.hero-spotlight.uagb-is-root-container,
.hero-spotlight.wp-block-uagb-container {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.hero-spotlight .uagb-container-inner-blocks-wrap {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;   /* keep it at bottom */
  align-items: center;         /* center horizontally */
  text-align: center;
  width: 100%;
}




/* ---------- HERO TITLE: font, size, readability ---------- */

.hero-title .uagb-heading-text {
  
  font-family: "Montserrat", "Segoe UI", Roboto, Arial, sans-serif;
  
  font-weight: 800;
  letter-spacing: 0.8px;
  line-height: 1.05;
  margin: 0;

  color: #ffffff;
		
  /* crisp edge */
  -webkit-text-stroke: 1.5px rgba(0,0,0,0.6);
		
  /* readability + glow */
  text-shadow:  
    0 3px 12px rgba(0,0,0,0.75),     /* base shadow */
    0 0 12px rgba(255, 120, 0, 0.7), /* inner glow */
    0 0 22px rgba(255, 80, 0, 0.6),  
    0 0 40px rgba(255, 40, 0, 0.5),  
    0 0 70px rgba(200, 20, 0, 0.35);
		
		font-size: 70px;
}

.hero-title {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  max-width: 800px;
}



/* Animate the slide background - subtle zoom */
.hero-spotlight .swiper-slide {
  position: relative;
  overflow: hidden;
}

.hero-spotlight .swiper-slide .swiper-content {
  height: 100%;
  transform: scale(1);
  animation: heroZoom 10s ease-in-out infinite alternate;
  will-change: transform;
}

/* Smooth zoom animation */
@keyframes heroZoom {
  0% {
    transform: scale(1.00);
  }
  100% {
    transform: scale(1.06);
  }
}







/*************** HEADER ***************/

/* =========================
   HEADER BASE (all pages)
========================= */
header.wp-block-template-part {
  width: 100% !important;
  max-width: 100% !important;
  position: relative;
  background: #ffffff; /* light grey for normal pages */
  z-index: 100;
}

/* Remove ANY hover background changes */
header.wp-block-template-part:hover {
  background: #ffffff !important;
}

/* =========================
   HOMEPAGE OVERLAY HEADER
========================= */
body.page-id-362 .wp-site-blocks {
  padding-top: 0 !important;
  margin-top: -80px !important;
}

body.page-id-362 header.wp-block-template-part {
  position: fixed !important;
  top: 0;
  left: 0;
  width: 100% !important;
  min-height: 56px !important;
  padding-top: 10px !important;              
  padding-bottom: 10px !important;           
  z-index: 1000 !important;
  background: rgba(0,0,0,0.35) !important;
}


/* Logged-in only: offset fixed header below WP admin bar */
body.admin-bar.page-id-362 header.wp-block-template-part {
  top: 32px !important;
}


/* Keep the overlay stable on hover (prevents flash/white background changes) */
body.page-id-362 header.wp-block-template-part:hover {
  background: rgba(0,0,0,0.15) !important;
}


/* =========================
   NAVIGATION LAYOUT
========================= */
/* Make the nav block and its container span full width so centering works */
.wp-block-navigation {
  width: 100% !important;
}

.wp-block-navigation__container {
  display: flex !important;
  justify-content: center !important;
  width: auto !important;
}

/* spacing between items (no gap) */
.wp-block-navigation-item {
  margin: 0 18px;
}


/* =========================
   TEXT COLORS
========================= */

.wp-block-navigation a {
  color: #ffffff !important;
  background: transparent !important;
	transition: color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
  border-radius: 999px;               /* pill shape */
  padding: 6px 12px;                  /* gives room for the pill */
}

body.page-id-362 .utility-brand {
	color: #ffffff !important;
	text-shadow: 0 1px 3px rgba(0,0,0,0.6);
}



/* Homepage: better hover look for menu visibility on image - this also adds the same menu look on other pages, for consistency (header and footer) */

.wp-block-navigation a:hover {
  color: #126BC5 !important;          
  background-color: #E8F5FA !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
}




/***** FOOTER *****/

/* All footer links */
footer a,
footer a:visited,
footer .wp-block-navigation a,
footer .wp-block-navigation a:visited,
footer .wp-block-navigation-item__content {
  color: #123B5D !important;
}

/* Hover / focus */
footer a:hover,
footer a:focus,
footer .wp-block-navigation a:hover,
footer .wp-block-navigation a:focus,
footer .wp-block-navigation-item__content:hover,
footer .wp-block-navigation-item__content:focus {
  color: #126BC5 !important;
}





/***** LOGIN PAGE *****/

/* Login form container (optional clean width) */
.tml {
  max-width: 200px;
  margin: 0 auto;
}

/* Theme My Login: target the actual field class it outputs */
.tml input.tml-field {
  height: 48px !important;
  padding: 0 12px !important;
  line-height: 48px !important;  /* vertically centers text */
  font-size: 16px !important;
  box-sizing: border-box !important;
  border-radius: 4px;
}

/* If the TML version outputs the input without the tml-field class, this catches it too */
.tml input[type="text"],
.tml input[type="email"],
.tml input[type="password"] {
  height: 48px !important;
  padding: 0 12px !important;
  line-height: 48px !important;
  font-size: 16px !important;
  box-sizing: border-box !important;
  border-radius: 4px;
}

/* Keep spacing between fields */
.tml .tml-field-wrap {
  margin-bottom: 15px !important;
}

/* Replace the username/email label text visually */
.tml .tml-log-wrap .tml-label {
  font-size: 0 !important;          /* hide original text */
  line-height: 0 !important;
}

.tml .tml-log-wrap .tml-label::after {
  content: "Username" !important;   /* new label text */
  font-size: 18px !important;       /* restore readable size */
  line-height: 1.4 !important;
  display: inline-block !important;
}

.tml .tml-button {
  height: 48px !important;
  padding: 0 22px !important;
  font-size: 18px !important;
  line-height: 48px !important;
  border-radius: 6px !important;
  cursor: pointer;
}



/* Hiding "Submit an Article" button on the Members page, unless user is Contributor/Admin (has edit rights) */
/* Hide the Submit Article button by default */
.submit-article-link {
  display: none !important;
}

/* Show it only for Contributors and Administrators */
body.role-contributor .submit-article-link,
body.role-contributor_plus .submit-article-link,
body.role-contributor_plus_plus .submit-article-link,
body.role-administrator .submit-article-link {
  display: inline-block !important;
}


/* Hiding the "My Articles" button on the Members page, unless user is Contributor/Admin (has edit rights) */
/* Hide My Articles button by default */
.my-articles-link {
  display: none !important;
}

/* Show only for contributors and admins */
body.role-contributor .my-articles-link,
body.role-contributor_plus .my-articles-link,
body.role-contributor_plus_plus .my-articles-link,
body.role-administrator .my-articles-link {
  display: inline-block !important;
}


/* Hiding the "Reports" button on the Members page, unless user is Contributor Plus / Admin */
/* Hide reports button by default */
.reports-link {
  display: none !important;
}

/* Show only for Contributor Plus and Admin */
body.role-contributor_plus .reports-link,
body.role-contributor_plus_plus .reports-link,
body.role-administrator .reports-link {
  display: inline-block !important;
}




/* Styling the Logout button on the Members page */
.logout-link {
  display: inline-block;
  margin-top: 15px;
  padding: 8px 16px;
  border: 1px solid #d0d4d9;
  border-radius: 8px;
  background: #ffffff;
  color: #444 !important;
  text-decoration: none;
  font-weight: 600;
  box-shadow: 0 2px 6px rgba(0,0,0,0.06);
  transition: all 0.15s ease;
}

.logout-link:hover {
  color: #126BC5 !important;
  border-color: #126BC5;
  box-shadow: 0 4px 10px rgba(0,0,0,0.10);
  transform: translateY(-1px);
  text-decoration: none;
}








/* Query Loop card style - this is on the News and Fire Safety pages to display summary info for a post/article that was created by a user (the "members article" page) */
.wp-block-post {
  border: 1px solid #e5e5e5;
  border-radius: 8px;
  padding: 16px;
  background: #ffffff;
  margin-bottom: 20px;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

/* Hover effect */
.wp-block-post:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.08);
}

.wp-block-read-more {
  margin-top: 12px;
  font-weight: 600;
  color: #ffffff !important;
  background: #D8292F;
  padding: 8px 16px;
  border-radius: 999px;
  text-decoration: none;
  display: table;
  margin-left: auto !important;
  margin-right: auto !important;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
}

/* Hover effect */
.wp-block-read-more:hover {
  background: #ffffff;
  color: #D8292F !important;
  border: 1px solid #D8292F;
  transform: translateY(-1px);
  text-decoration: none;
}

.wp-block-post-template {
  list-style: none;
  padding: 20px;
	background-color: #f7f7f7;
}

.wp-block-post > * {
  margin-bottom: 10px;
}

/* Center the featured image block itself */
.wp-block-post-featured-image {
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center;
}

/* Center the image inside if needed */
.wp-block-post-featured-image img {
  display: block;
  margin-left: auto !important;
  margin-right: auto !important;
}

.wp-block-post-title {
  text-align: center;
  font-size: 24px !important;
  line-height: 1.3;
  margin-top: 10px;
  margin-bottom: 8px;
}

/* Raised rectangular title frame */
.wp-block-post-title a {
  display: inline-block;
  min-width: 100%;
	box-sizing: border-box;
  padding: 10px 18px;
	background: linear-gradient(to bottom, #f8f9fa, #eceff1);
  border: 1px solid #d9dce1;
  border-radius: 8px;
  text-decoration: none;
  color: #123B5D !important;
	box-shadow: 0 3px 8px rgba(0,0,0,0.07);
}

/* Hover for title frame */
.wp-block-post-title a:hover {
  background: #ffffff;
  color: #126BC5 !important;
}

.wp-block-post-excerpt {
  font-size: 15px;
  color: #444;
  line-height: 1.5;
  background: #fafafa;
  border-left: 4px solid #126BC5;
  padding: 12px 14px;
  border-radius: 6px;
}



/* Hover button */
.wp-block-button__link:hover,
.uagb-button__link:hover {
background-color: #123B5D !important;
color: #ffffff !important;
}


/* FYI, custom CSS has a 500 line limit... the rest of the CSS is under Customize > Additional CSS */