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

/* ==========================================================================
   ORIGINAL HWL BLOCK STYLES
   ========================================================================== */

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

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

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

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

.is-style-her-website-launchpad-list-underline ul li {
	border: none;
}

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

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

details.is-style-her-website-launchpad-plus > summary::marker {
	font-weight: 700;
	font-size: 1em;
	font-family: var(--wp--preset--font-family--monospace);
}

/* ==========================================================================
   CLIENT SITE BLOCK STYLES
   ========================================================================== */

/* Checklist with ✓ marks */
ul.wp-block-list.is-style-checks {
	list-style: none;
	letter-spacing: normal;
	word-spacing: normal;
	font-size: 1em;
	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-cta .wp-block-button__link {
	background-color: var(--wp--preset--color--bright-accent);
	color: var(--wp--preset--color--base);
	/* border: 2px solid var(--wp--preset--color--bright-accent); */
	transition: all 0.2s ease-in-out;
}

.wp-block-button.is-style-cta .wp-block-button__link:hover,
.wp-block-button.is-style-cta .wp-block-button__link:focus {
	background-color: var(--wp--preset--color--accent);
	/* border-color: var(--wp--preset--color--bright-accent); */
}

/* CTA Minor Button Styles */
.wp-block-button.is-style-cta-minor .wp-block-button__link {
	background-color: var(--wp--preset--color--secondary);
	color: var(--wp--preset--color--base);
	transition: all 0.2s ease-in-out;
}

.wp-block-button.is-style-cta-minor .wp-block-button__link:hover,
.wp-block-button.is-style-cta-minor .wp-block-button__link:focus {
	background-color: var(--wp--preset--color--accent);
	/* border-color: var(--wp--preset--color--secondary); */
}

/* Card Style (Three Things) */
.wp-block-group.is-style-three-things {
	padding: 1em;
	border-style: solid;
	border-width: 1.5px;
	border-color: var(--wp--preset--color--accent);
	border-radius: var(--hwl-radius-medium, 12px);
	margin: 1em !important;
}

.wp-block-group.is-style-three-things.secondary {
	border-color: var(--wp--preset--color--secondary);
}

.wp-block-group.is-style-three-things.primary {
	border-color: var(--wp--preset--color--primary);
}

.wp-block-group.is-style-three-things p {
	margin-top: 0;
	padding-top: 0;
}

/* 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;
}

/* ==========================================================================
   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:1.25em;
	    line-height:1.2;
	}
}