/*
 * CSS for registered block styles.
 * See inc/register-block-styles.php.
 */

/* ==========================================================================
   BLOCK STYLES
   ========================================================================== */

/* Flat button */
.is-style-nohsa-flat-button .wp-block-button__link,
.is-style-nohsa-flat-button .wp-block-button__link:hover,
.is-style-nohsa-flat-button .wp-block-button__link:focus,
.is-style-nohsa-flat-button .wp-block-button__link:active,
.is-style-nohsa-flat-button .wp-block-button__link:visited {
	box-shadow: none;
	border-radius: 0;
	margin-top: initial;
	margin-bottom: initial;
}

/* Box shadow */
.is-style-nohsa-box-shadow {
	box-shadow: var(--wp--preset--shadow--natural);
}

/* Underlined Lists */
.is-style-nohsa-list-underline li {
	border-bottom: 1px solid currentcolor;
}

.is-style-nohsa-list-underline ul {
	border-top: 1px solid currentcolor;
}

.is-style-nohsa-list-underline ul li {
	border: none;
}

/* Details Plus/Minus */
details.is-style-nohsa-plus > summary {
	list-style-type: "+ ";
}

details[open].is-style-nohsa-plus > summary {
	list-style-type: "- ";
}

details.is-style-nohsa-plus > summary::marker {
	font-weight: 700;
	font-size: 1.25rem;
	font-family: var(--wp--preset--font-family--monospace);
}

/* Make the interaction feel nicer */
.wp-block-details > summary {
  cursor: pointer;
}

/* Animate the content when opening */
.wp-block-details[open] > :not(summary) {
  animation: nohsa-details-reveal 320ms ease;
}

@keyframes nohsa-details-reveal {
  from {
    opacity: 0;
    transform: translateY(-0.25rem);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .wp-block-details[open] > :not(summary) {
    animation: none;
  }
}


/* Checklist with ✓ marks */
ul.wp-block-list.is-style-checks {
	list-style: none;
	letter-spacing: normal;
	word-spacing: normal;
	font-size: 1rem;
	margin: 0;
	padding-left: 0;
}

ul.wp-block-list.is-style-checks li {
	padding: 0;
	margin: 0 0 0.5em 2.5em;
	line-height: 1.1;
	text-align: left;
}

ul.wp-block-list.is-style-checks li::before {
	content: "\2713\0020";
	font-size: 2rem;
	margin-left: -1em;
	position: relative;
	top: 0;
}

/* X-List with ✗ marks */
ul.wp-block-list.is-style-x-list li::before {
	content: '\2717\0020';
	color: red;
	margin-right: 0.35em;
}

/* CTA Button Styles */
.wp-block-button.is-style-gold-cta .wp-block-button__link {
	background-color: var(--wp--preset--color--gold);
	color: var(--wp--preset--color--white);
	border: 2px solid var(--wp--preset--color--gold); 
	transition: all 0.2s ease-in-out;
}

.wp-block-button.is-style-gold-cta .wp-block-button__link:hover,
.wp-block-button.is-style-gold-cta .wp-block-button__link:focus {
	background-color: var(--wp--preset--color--white);
	color:var(--wp--preset--color--gold);;
}

.wp-block-button.is-style-blue-cta .wp-block-button__link {
	background-color: var(--wp--preset--color--blue);
	color: var(--wp--preset--color--white);
	border: 2px solid var(--wp--preset--color--blue); 
	transition: all 0.2s ease-in-out;
}

.wp-block-button.is-style-blue-cta .wp-block-button__link:hover,
.wp-block-button.is-style-blue-cta .wp-block-button__link:focus {
	background-color: var(--wp--preset--color--white);
	color:var(--wp--preset--color--blue);
}
.wp-block-button.is-style-red-cta .wp-block-button__link {
	background-color: var(--wp--preset--color--red);
	color: var(--wp--preset--color--white);
	border: 2px solid var(--wp--preset--color--red); 
	transition: all 0.2s ease-in-out;
}

.wp-block-button.is-style-red-cta .wp-block-button__link:hover,
.wp-block-button.is-style-red-cta .wp-block-button__link:focus {
	background-color: var(--wp--preset--color--white);
	color:var(--wp--preset--color--red);
}

/* ===== Block Editor (Gutenberg) – show CTA styles in editor canvas ===== */
.editor-styles-wrapper .wp-block-button.is-style-gold-cta .wp-block-button__link {
  background-color: var(--wp--preset--color--gold);
  color: var(--wp--preset--color--white);
  border: 2px solid var(--wp--preset--color--gold);
  transition: all 0.2s ease-in-out;
}
.editor-styles-wrapper .wp-block-button.is-style-gold-cta .wp-block-button__link:hover,
.editor-styles-wrapper .wp-block-button.is-style-gold-cta .wp-block-button__link:focus {
  background-color: var(--wp--preset--color--white);
  color: var(--wp--preset--color--gold);
}

.editor-styles-wrapper .wp-block-button.is-style-blue-cta .wp-block-button__link {
  background-color: var(--wp--preset--color--blue);
  color: var(--wp--preset--color--white);
  border: 2px solid var(--wp--preset--color--blue);
  transition: all 0.2s ease-in-out;
}
.editor-styles-wrapper .wp-block-button.is-style-blue-cta .wp-block-button__link:hover,
.editor-styles-wrapper .wp-block-button.is-style-blue-cta .wp-block-button__link:focus {
  background-color: var(--wp--preset--color--white);
  color: var(--wp--preset--color--blue);
}

.editor-styles-wrapper .wp-block-button.is-style-red-cta .wp-block-button__link {
  background-color: var(--wp--preset--color--red);
  color: var(--wp--preset--color--white);
  border: 2px solid var(--wp--preset--color--red);
  transition: all 0.2s ease-in-out;
}
.editor-styles-wrapper .wp-block-button.is-style-red-cta .wp-block-button__link:hover,
.editor-styles-wrapper .wp-block-button.is-style-red-cta .wp-block-button__link:focus {
  background-color: var(--wp--preset--color--white);
  color: var(--wp--preset--color--red);
}

/* Optional: reduce motion for a11y (editor only) */
@media (prefers-reduced-motion: reduce) {
  .editor-styles-wrapper .wp-block-button__link { transition: none; }
}

/* Media-Text Image Styles */

/* Rounded Corners (Modern, Warm) */
.wp-block-media-text.is-style-has-border-radius .wp-block-media-text__media * {
	border-radius: var(--hwl-radius-image, 12px) !important;
	overflow: hidden !important;
}

/* Rounded Bottom (Modern, Warm) */
.wp-block-media-text.is-style-has-border-radius-bottom .wp-block-media-text__media * {
	border-radius: 0 0 var(--hwl-radius-image, 20px) var(--hwl-radius-image, 20px) !important;
	overflow: hidden !important;
}

/* Sharp Corners - override rounded defaults (Modern, Warm) */
.wp-block-media-text.is-style-sharp-corners .wp-block-media-text__media * {
	border-radius: 0 !important;
	overflow: hidden !important;
}

/* Extra Rounded (Warm only) */
.wp-block-media-text.is-style-extra-rounded .wp-block-media-text__media * {
	border-radius: 28px !important;
	overflow: hidden !important;
}

/* ============================================
   Width Block Styles
   ============================================ */

/* Content Width - Uses theme.json contentSize (940px) */
.is-style-content-width {
    width: 100%;
    max-width: var(--wp--style--global--content-size, 940px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Wide Width - Uses theme.json wideSize (1100px) */
.is-style-wide-width {
    width: 100%;
    max-width: var(--wp--style--global--wide-size, 1100px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Full Width - Edge to edge */
.is-style-full-width {
    width: 100% !important;
    max-width: none !important;
}

/* Break out of content container to be truly full width */
.wp-site-blocks .is-style-full-width {
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    width: 100vw !important;
    max-width: 100vw !important;
}

/* Ensure nested blocks respect the width */
.is-style-content-width > .wp-block-group__inner-container,
.is-style-wide-width > .wp-block-group__inner-container {
    max-width: 100%;
}

/* Optional: Add default padding to prevent edge-hugging on mobile */
.is-style-content-width,
.is-style-wide-width {
    padding-left: 1em;
    padding-right:1em;
}
/* ==========================================================================
   CUSTOM NOHSA BLOCKS
   ========================================================================== */
/* ------- NOHSA Cover: Hover Reveal (with stretched overlay link) ------- */
.wp-block-cover.is-style-nohsa-hover-reveal {
  position: relative;
  overflow: hidden;
  border-radius: var(--wp--custom--radius, 0); /* optional */
  aspect-ratio: 1 / 1; /* uniform tiles */
  min-width:33%;min-height:280px;padding:0;
}

/* Default: sepia */
.wp-block-cover.is-style-nohsa-hover-reveal .wp-block-cover__image-background {
  filter: sepia(1) saturate(0.7) contrast(0.95);
  opacity: 1;
  transition: filter .25s ease, opacity .25s ease;
}

/* Full-color + slightly dim on hover/focus */
.wp-block-cover.is-style-nohsa-hover-reveal:hover .wp-block-cover__image-background,
.wp-block-cover.is-style-nohsa-hover-reveal:focus-within .wp-block-cover__image-background {
  filter: none;
  opacity: 1;
}

/* Caption container: stick to bottom */
.wp-block-cover.is-style-nohsa-hover-reveal .nohsa-card__caption {
  position: absolute;
  inset: auto 0 0 0;
  background: var(--wp--preset--color--blue);
  color: var(--wp--preset--color--base, #fff);
  padding: .75rem 1rem;
  transition: max-height 1s ease-in-out;
  /* collapse to “title-only” by default */
  max-height: calc(1lh + 1.25rem);
  overflow: hidden;
  z-index: 2; /* sits above image */
}

.wp-block-cover.is-style-nohsa-hover-reveal .wp-block-cover__inner-container {margin-top:220px}

/* Title reset (so it never shrinks) */
.wp-block-cover.is-style-nohsa-hover-reveal .nohsa-card__caption h3 {
  margin: 0;
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; /* keep title to one line until reveal */
}

/* Hide extra text until reveal */
.wp-block-cover.is-style-nohsa-hover-reveal .nohsa-card__caption > *:not(h3) {
  display: none;
}

/* Reveal on hover + keyboard focus */
.wp-block-cover.is-style-nohsa-hover-reveal:hover .nohsa-card__caption,
.wp-block-cover.is-style-nohsa-hover-reveal:focus-within .nohsa-card__caption {
  max-height: 70vh; /* effectively "auto" with animation */
}
.wp-block-cover.is-style-nohsa-hover-reveal:hover .nohsa-card__caption > *:not(h3),
.wp-block-cover.is-style-nohsa-hover-reveal:focus-within .nohsa-card__caption > *:not(h3) {
  display: block;
}

/* ===== Stretched overlay link (Button block with class: nohsa-card__stretched-link) ===== */
.wp-block-cover.is-style-nohsa-hover-reveal .wp-block-button.nohsa-card__stretched-link {
  position: absolute;
  inset: 0;
  z-index: 3; /* above caption for full-tile click + visible focus ring */
  margin: 0 !important;
  padding: 0 !important;
}
.wp-block-cover.is-style-nohsa-hover-reveal .wp-block-button.nohsa-card__stretched-link > .wp-block-button__link {
  position: absolute;
  inset: 0;
  display: block;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  text-decoration: none;
  cursor: pointer;

  /* Hide visible text but keep it for AT (use the Button text as the accessible name) */
  text-indent: -9999px;
  white-space: nowrap;
  overflow: hidden;
}
.wp-block-cover.is-style-nohsa-hover-reveal .wp-block-button.nohsa-card__stretched-link > .wp-block-button__link:focus-visible {
  outline: 3px solid var(--wp--preset--color--contrast, #000);
  outline-offset: 3px;
  border-radius: 0;
}

/* Touch devices: no hover, show full caption by default */
@media (hover: none) {
  .wp-block-cover.is-style-nohsa-hover-reveal .nohsa-card__caption {
    max-height: 70vh;
  }
  .wp-block-cover.is-style-nohsa-hover-reveal .nohsa-card__caption > *:not(h3) {
    display: block;
  }
}

/* Reduced motion: disable transitions */
@media (prefers-reduced-motion: reduce) {
  .wp-block-cover.is-style-nohsa-hover-reveal .wp-block-cover__image-background,
  .wp-block-cover.is-style-nohsa-hover-reveal .nohsa-card__caption {
    transition: none;
  }
}

/* Windows High Contrast / forced colors */
@media (forced-colors: active) {
  .wp-block-cover.is-style-nohsa-hover-reveal .nohsa-card__caption {
    background: ButtonFace;
    color: ButtonText;
  }
  .wp-block-cover.is-style-nohsa-hover-reveal .wp-block-button.nohsa-card__stretched-link > .wp-block-button__link:focus-visible {
    outline-color: Highlight;
  }
}

/* ------- Editor preview tweaks ------- */
.editor-styles-wrapper .wp-block-cover.is-style-nohsa-hover-reveal { overflow: hidden; }
.editor-styles-wrapper .wp-block-cover.is-style-nohsa-hover-reveal .wp-block-cover__image-background {
  filter: sepia(1) saturate(0.7) contrast(0.95);
}
.editor-styles-wrapper .wp-block-cover.is-style-nohsa-hover-reveal .nohsa-card__caption {
  background: var(--wp--preset--color--blue);
  color: var(--wp--preset--color--base, #fff);
  position: absolute; inset: auto 0 0 0;
  padding: .75rem 1rem;
  max-height: calc(1lh + 1.25rem);
  overflow: hidden;
}

.wp-block-details.is-style-nohsa-event-details {
  /* background behind the block */
  padding:.5rem .3rem 0 .5rem
}

.wp-block-details.is-style-nohsa-event-details > summary li {
  padding-left: 1em;
}

/* Hide default marker and replace with your own on the right */
.wp-block-details.is-style-nohsa-event-details > summary {
  list-style: none;
}
.wp-block-details.is-style-nohsa-event-details > summary::-webkit-details-marker {
  display: none;
}
.wp-block-details.is-style-nohsa-event-details > summary::marker {
  content: "";
}
.wp-block-details.is-style-nohsa-event-details > summary::after {
  content: "►";
  float: right;
}
.wp-block-details.is-style-nohsa-event-details[open] > summary::after {
  content: "▼";
}
.wp-block-details.is-style-nohsa-event-details > summary {
  cursor: pointer;
}

.wp-block-details.is-style-nohsa-event-details a {text-decoration:none}

/* ==========================================================================
   RESPONSIVE ADJUSTMENTS
   ========================================================================== */

@media screen and (max-width: 480px) {
    /* Image is full width on mobile */
    .is-style-full-width-mobile {
        /* in some themes, 108%, with margins 0 -4%
        for edge to edge/bleed */
        width:100%;
        margin:0;
    }
    
	/* Checklist adjustments for mobile */
	ul.wp-block-list.is-style-checks {
		padding-left: 1em;
		padding-right: 1em;
	}
	ol.wp-block-list {
	    font-size:1rem;
	    line-height:1.2;
	}
}