/* Global Button Styles
--------------------------------------------- */

.wp-block-button__link {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	line-height: normal !important;
	border-radius: 0 !important;
}

/* Button - Outline Style
--------------------------------------------- */

.wp-block-button.is-style-outline .wp-block-button__link {
	border: none;
	background-color: transparent;
	outline: 2px solid currentColor;
	outline-offset: -3.5px;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	color: var(--wp--preset--color--main) !important;
	outline-color: var(--wp--preset--color--main);
}

/* Button - CFP Secondary Style
--------------------------------------------- */

.wp-block-button.is-style-cfp-secondary .wp-block-button__link {
	border: 2px solid var(--wp--preset--color--primary);
	background-color: transparent;
	color: var(--wp--preset--color--primary);
	font-family: 'Arial Black', Arial, 'Helvetica Neue', Helvetica, sans-serif;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	transition: all 0.3s ease;
}

.wp-block-button.is-style-cfp-secondary .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
	border-color: var(--wp--preset--color--primary);
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.wp-block-button.is-style-cfp-secondary .wp-block-button__link:focus {
	outline: 2px solid var(--wp--preset--color--primary-accent);
	outline-offset: 2px;
}

/* Button - Orange Text White Border Style
--------------------------------------------- */

.wp-block-button.is-style-orange-white-border .wp-block-button__link {
	border: 2px solid #ffffff !important;
	background-color: transparent !important;
	color: var(--wp--preset--color--primary) !important;
	transition: all 0.3s ease;
}

.wp-block-button.is-style-orange-white-border .wp-block-button__link:hover {
	background-color: transparent !important;
	color: #ffffff !important;
	text-decoration: underline !important;
}

.wp-block-button.is-style-orange-white-border .wp-block-button__link:focus {
	outline: 2px solid #ffffff;
	outline-offset: 2px;
}

/* Orange arrow turns white on hover for orange-white-border style */
.wp-block-button.is-style-orange-white-border.orange-arrow-after .wp-block-button__link:hover::after {
	filter: brightness(0) invert(1) !important;
}

/* Button - Arrow After Styles
--------------------------------------------- */

/* Orange Arrow After */
.wp-block-button.orange-arrow-after .wp-block-button__link::after,
.wp-block-button.grey-arrow-after .wp-block-button__link::after {
	padding:0 !important;
	margin:0 !important;
	content: '' !important;
	display: inline-block !important;
	background-size: cover !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
	vertical-align: top !important;
	text-decoration: none !important; 
	/*outline: 1px solid red !important;*/
}

/* Orange Arrow After */
.wp-block-button.orange-arrow-after .wp-block-button__link::after{
	background-image: url('/wp-content/uploads/2025/10/right-arrow-orange.svg') !important;
	width: 14px !important;
	height: 22px !important; 
	margin-left: 7px !important; 
}
	
/* Grey Arrow After */
.wp-block-button.grey-arrow-after .wp-block-button__link::after {
	background-image: url('/wp-content/uploads/2025/10/right-arrow-grey.svg') !important; 
	width: 20px !important;
	height: 35px !important;
	line-height: 35px !important;
	margin-left: 5px !important; 
}

.wp-block-button.orange-arrow-after .wp-block-button__link:hover::after {
	text-decoration: none !important;
}


.wp-block-button.grey-arrow-after .wp-block-button__link:hover::after {
	text-decoration: none !important;
}

/* Read More Block - Grey Arrow After
--------------------------------------------- */

/* Base styles for read-more with grey arrow */
a.wp-block-read-more.grey-arrow-after {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	line-height: normal !important;
}

a.wp-block-read-more.grey-arrow-after::after {
	padding: 0 !important;
	margin: 0 !important;
	content: '' !important;
	display: inline-block !important;
	background-size: cover !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
	flex-shrink: 0 !important;
	text-decoration: none !important;
	background-image: url('/wp-content/uploads/2025/10/right-arrow-grey.svg') !important;
	width: 14px !important;
	height: 22px !important;
	margin-left: 7px !important;
}

a.wp-block-read-more.grey-arrow-after:hover::after {
	text-decoration: none !important;
}

/* ============================================
   BUTTON ARROW VARIANTS - REM UNITS
   Screen zoom compatible (1rem = 16px)
   Default: Medium arrow (1.125rem / 18px)
   Override with: sm-btn-arrow or lg-btn-arrow
   ============================================ */

/* Base Button Container - Flex Alignment for Arrow Classes 
   Note: Excludes .wp-block-button to prevent double arrows */
.sm-btn-arrow:not(.wp-block-button),
.md-btn-arrow:not(.wp-block-button),
.lg-btn-arrow:not(.wp-block-button) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
	font-size: 1rem; /* Medium default (16px) */
}

/* Base Arrow Styles - Medium by Default
   Applied to: sm-btn-arrow, md-btn-arrow, lg-btn-arrow (but NOT .wp-block-button) */
.sm-btn-arrow:not(.wp-block-button)::after,
.md-btn-arrow:not(.wp-block-button)::after,
.lg-btn-arrow:not(.wp-block-button)::after {
	content: '';
	display: block;
	width: 1.2em;
	height: 1.2em;
	margin-left: 0.25em;
	background-color: currentColor;
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'%3E%3C/polyline%3E%3C/svg%3E");
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'%3E%3C/polyline%3E%3C/svg%3E");
	-webkit-mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	transition: transform 0.2s ease;
	flex-shrink: 0;
}

.sm-btn-arrow:not(.wp-block-button):hover::after,
.md-btn-arrow:not(.wp-block-button):hover::after,
.lg-btn-arrow:not(.wp-block-button):hover::after {
	transform: translateX(0.25rem);
}

/* Small Button Arrow Override - 0.875rem (14px equivalent)
   Use class: sm-btn-arrow to override default medium size */
.sm-btn-arrow:not(.wp-block-button) {
	font-size: 0.875rem; /* Small text (14px) */
}

/* Arrow size automatically scales with em units - no override needed */

.sm-btn-arrow:not(.wp-block-button):hover::after {
	transform: translateX(0.1875rem);
}

/* Large Button Arrow Override - 1.5rem (24px equivalent)
   Use class: lg-btn-arrow to override default medium size */
.lg-btn-arrow:not(.wp-block-button) {
	font-size: 1.25rem; /* Large text (20px) */
}

/* Large arrow gets extra size boost beyond font-size scaling */
.lg-btn-arrow:not(.wp-block-button)::after {
	width: 1.4em;
	height: 1.4em;
}

.lg-btn-arrow:not(.wp-block-button):hover::after {
	transform: translateX(0.3125rem);
}

/* WordPress Block Button Integration
   Medium arrow by default, override with sm-btn-arrow or lg-btn-arrow */
.wp-block-button.sm-btn-arrow .wp-block-button__link::after,
.wp-block-button.md-btn-arrow .wp-block-button__link::after,
.wp-block-button.lg-btn-arrow .wp-block-button__link::after {
	content: '';
	display: block;
	width: 1.2em;
	height: 1.2em;
	margin-left: 0.25em;
	background-color: currentColor;
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'%3E%3C/polyline%3E%3C/svg%3E");
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 18 15 12 9 6'%3E%3C/polyline%3E%3C/svg%3E");
	-webkit-mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	transition: transform 0.2s ease;
	flex-shrink: 0;
}

.wp-block-button.sm-btn-arrow .wp-block-button__link:hover::after,
.wp-block-button.md-btn-arrow .wp-block-button__link:hover::after,
.wp-block-button.lg-btn-arrow .wp-block-button__link:hover::after {
	transform: translateX(0.25rem);
}

/* Font-size overrides for WordPress blocks - arrows auto-scale with em units */
.wp-block-button.sm-btn-arrow .wp-block-button__link {
	font-size: 0.875rem; /* Small text (14px) */
}

.wp-block-button.sm-btn-arrow .wp-block-button__link:hover::after {
	transform: translateX(0.1875rem);
}

.wp-block-button.md-btn-arrow .wp-block-button__link {
	font-size: 1rem; /* Medium text (16px) - default */
}

.wp-block-button.lg-btn-arrow .wp-block-button__link {
	font-size: 1.25rem; /* Large text (20px) */
}

/* Large arrow gets extra size boost beyond font-size scaling */
.wp-block-button.lg-btn-arrow .wp-block-button__link::after {
	width: 1.4em;
	height: 1.4em;
}

.wp-block-button.lg-btn-arrow .wp-block-button__link:hover::after {
	transform: translateX(0.3125rem);
}