/**
 * Custom Search Block Styles
 *
 * @package made-to-thrive-2026-base
 * @since 1.0.0
 */

/* Screen reader text for accessibility */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
	word-wrap: normal !important;
}

/* Custom Search Container */
.custom-search {
	width: 100%;
	padding: 85px 0px 100px;
	background-color: #013D36;
	color: #FFFFFF;
}

.custom-search-container {
	max-width: 1400px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: 25px;
	padding: 0 60px;
}

/* Heading */
.custom-search-heading {
	font-size: 54px;
	font-weight: 400;
	color: #FFFFFF;
	text-align: left;
	margin: 0;
	line-height: 83px;
}

/* Form Wrapper */
.custom-search-form-wrapper {
	width: 100%;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-start;
	gap: 25px;
	flex-wrap: wrap;
}

/* Search Form */
.custom-search-form {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 0;
	flex: 1;
	min-width: 54%;
	max-width: 806px;
	gap: 28px;
}


/* Search Input */
.custom-search-input {
	background-color: transparent;
	line-height: 1.5;
	width: 100%;
	padding: 0.875rem 30px;
	border: 1px solid white;
	color: #ffffff;
	text-decoration: none;
	border-radius: 30px;
	font-size: 17px;
	font-weight: 500;
	transition: background-color 0.3s ease, transform 0.2s ease, outline 0.2s ease;
	cursor: pointer;
	white-space: nowrap;
	letter-spacing: 0.03rem;
	height: 60px;
}

.custom-search-input::placeholder {
	color: #FFFFFF;
	opacity: 1;
}

.custom-search-input:focus {
	outline: 2px solid #FFFFFF;
	outline-offset: 2px;
	background-color: rgba(255, 255, 255, 0.1);
}

.custom-search-input:focus-visible {
	outline: 3px solid #FFFFFF;
	outline-offset: 2px;
}

/* Search Button */
.custom-search-button {
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	display: inline-flex;
	align-items: center;
	gap: 0.75rem;
	padding: 0.875rem 30px;
	background-color: var(--button-bg-color, #013D36);
	color: #ffffff;
	text-decoration: none;
	border-radius: 30px;
	font-size: 14px;
	font-weight: 500;
	transition: background-color 0.3s ease, transform 0.2s ease, outline 0.2s ease;
	border: none;
	cursor: pointer;
	white-space: nowrap;
	text-transform: uppercase;
	letter-spacing: 0.1rem;
	height: 60px;
}

.custom-search-button:hover {
	background-color: #6B7861;
}

.custom-search-icon {
	width: 18px;
height: 18px;
object-fit: contain;
display: block;
}

.custom-search-button-text {
	line-height: 1;
}

/* Read All Button */
.custom-search-read-all-button {
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	display: inline-flex;
	align-items: center;
	gap: 0.75rem;
	padding: 0.875rem 30px;
	background-color: var(--button-bg-color, #013D36);
	color: #ffffff;
	text-decoration: none;
	border-radius: 30px;
	font-size: 14px;
	font-weight: 100;
	transition: background-color 0.3s ease, transform 0.2s ease, outline 0.2s ease;
	border: none;
	cursor: pointer;
	white-space: nowrap;
	text-transform: uppercase;
	letter-spacing: 0.1rem;
	height: 60px;
}

.custom-search-read-all-button:hover {
	background-color: #6B7861;
}

.custom-search-read-all-icon {
	width: 20px;
	height: 20px;
	object-fit: contain;
	display: block;
}

.custom-search-read-all-text {
	line-height: 1;
}

/* Responsive Design */
@media (max-width: 768px) {
	.custom-search {
		padding:50px 30px;
	}
	.custom-search-container {
		padding:0;
		gap:20px;
	}
	.custom-search-heading {
		font-size:46px;
		line-height:54px;
	}
	.custom-search-form {
	width: 100%;
	flex-wrap: wrap;
	}
	.custom-search-form-wrapper {
		flex-wrap:wrap;
		position:relative;
		display: block;
	}
	.custom-search-read-all-button {
		position:absolute;
		bottom: 0px;
		left: 178px;
		width:170px
	}
}

@media (max-width: 480px) {
	.custom-search-heading {
		font-size: 34px;
		line-height: 1;
	}

	.custom-search-input,
	.custom-search-button,
	.custom-search-read-all-button {
		padding: 12px 20px;
		font-size: 0.8125rem;
	}
	.custom-search-button,
	.custom-search-read-all-button  {
		        width: 160px;
        align-items: center;
        justify-content: center;
	}
}