.pg_turf_calculator_layout_container {
	width: 100%;
}

.pg_turf_calculator_layout_title h4{
	font-size: 24px; /* Adjust this value to your preferred size */
	font-weight: bold;
	text-align: center;
	margin: 10px 0; /* Adjust margin for spacing around the heading */
	padding: 10px 0; /* Optional padding for spacing within the element */
	color: black;
}

.pg_turf_calculator_layout_content_outside {
	width: 100%;
	display: flex;
	flex-direction: row;
}

.turf_title {
	background-color: #9A1B32;
	width: 100%;
	height: 80px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
}

select.pg_turf_calculator_layout_select {
	visibility: hidden;
}

.block_turf_outer {
	width: 50%;
	background-color: #f1f1f1;
	border: 1px solid #dee2e6;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.form_turf_space {
	padding-right: 20px !important;
	padding-left: 20px !important;
}

.enter_turf_title {
	width: 100%;
	font-size: 14px;
	font-weight: bold;
	color: black;
	margin: 15px 0 5px;
}

.enter_turf_select_title {
	width: 100%;
	font-size: 14px;
	font-weight: bold;
	color: black;
	margin: 15px 0 5px;
}

.turf_main_row {
	width:100%
}

.turf_main_row label{
	width: 100%;
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 5px;
	display: block;
}

.turf_main_row input[type="number"] {
	width: 100%;
	padding: 10px;
	margin-bottom: 15px;
	border: 1px solid #28a745;
	border-radius: 4px;
	box-sizing: border-box;
	font-size: 14px;
}

/* Styles when the input is disabled */
.turf_main_row input[type="number"]:disabled {
	background-color: #d3d3d3; /* Gray background */
	color: #808080; /* Gray text */
	border: 1px solid #a0a0a0; /* Gray border */
	cursor: not-allowed; /* Disabled cursor */
}


.turf_width_main, .turf_length_main, .turf_areas_main, .pg_turf_calculator_select_type, .pg_turf_tape_length {
	padding-right: 8px !important;
	padding-left: 8px !important;
}

.block_turf_title {
	font-size: 18px;
	color: white !important;
	font-weight: bold;
	margin: 0;
	padding: 0;
}

.pg_turf_calculator_area_outside, .pg_turf_calculator_tape_usage_outside, .pg_turf_calculator_select_type_outside {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.pg_turf_tape_length {
	width: 100%;
}

.pg_turf_tape_length input[type="number"] {
	width: 100%;
	padding: 10px;
	margin-bottom: 15px;
	border: 1px solid #28a745;
	border-radius: 4px;
	box-sizing: border-box;
	font-size: 14px;
}

/* Styles when the input is disabled */
.pg_turf_tape_length input[type="number"]:disabled {
	background-color: #d3d3d3; /* Gray background */
	color: #808080; /* Gray text */
	border: 1px solid #a0a0a0; /* Gray border */
	cursor: not-allowed; /* Disabled cursor */
}


.enter_turf_tape_usage {
	width: 100%;
	font-size: 14px;
	font-weight: bold;
	color: black;
	margin: 5px 0;
}

.pg_turf_left_btn_main {
	display: flex;
	flex-direction: row;
	text-align: center;
	justify-content: center;
	margin-top: 20px;
	margin-bottom: 10px;
}

.pg_turf_btn {
	padding: 10px 20px;
	margin: 5px 0 10px;
	border: none;
	border-radius: 4px;
	background-color: #28a745;
	color: #ffffff;
	font-size: 16px;
	cursor: pointer;
	transition: background-color 0.3s ease;
}

.pg_turf_btn.calculate_turf {
	margin-right: 20px;
}

.pg_turf_btn.reset_turf {
	margin-left: 20px;
}

.pg_turf_calculator_select_type {
	display: flex;
	flex-direction: row;
	margin-top: 10px;
	width: 100%;
}

.pg_turf_calculator_display {
	width: 65%;
	padding: 10px;
	border: 1px solid #28a745;
	border-radius: 4px;
	box-sizing: border-box;
	font-size: 14px;
	margin-left: 20px;
	font-weight: bold;
	align-items: center;
	justify-content: center;
	flex-direction: row;
	display: flex;
}

.pg_turf_calculator_layout_select_outside {
	width: 35%;
	height: auto;
}

.select2-container--turfTheme .select2-selection--single {
	background-color: #f1f1f1 !important;
	color: black !important;
	border: 1px solid #28a745 !important;
	font-weight: bold !important;
	font-size: 14px !important;
	width: 100% !important;
	height: 45px !important; /* Fixed height */
	padding: 0 10px !important; /* Padding to prevent content from sticking to the edges */
	border-radius: 4px !important; /* Rounded corners */
	display: flex !important;
	align-items: center; /* Vertically center the content */
	justify-content: center !important; /* Align text and arrow at the ends */
}

.select2-container--turfTheme .select2-results__option {
	display: flex !important;
	font-size: 14px !important;
	color: black !important;
	align-items: center !important;
	justify-content: center !important;
	text-align: center !important;
	width: 100%;
	height: 40px !important;
	line-height: 40px !important;
	padding: 0 10px !important;
}


.select2-container--turfTheme .select2-selection--single .select2-selection__arrow {
	background-color: transparent !important; /* Make the arrow background transparent */
	height: 100% !important; /* Match the arrow area height with the selection box */
	display: flex !important;
	align-items: center !important; /* Vertically center the arrow */
	justify-content: center !important; /* Horizontally center the arrow */
	padding: 0 5px !important; /* Padding for the arrow area */
}

.select2-container--turfTheme .select2-selection--single .select2-selection__arrow b {
	border-color: black transparent transparent transparent; /* Set the arrow color to white */
	border-width: 5px 5px 0 5px; /* Adjust the size of the arrow */
	border-style: solid; /* Use solid lines for the arrow */
	width: 0; /* Ensure arrow width is correct */
	height: 0; /* Ensure arrow height is correct */
	display: inline-block; /* Ensure the arrow is displayed correctly */
	margin: 0 auto; /* Center the arrow horizontally */
}

.pg_calc_turf_result_error {
	font-size: 18px;
	width: 100%;
	height: 45px;
	color: #721c24;
	display: none;
	margin-top: 20px;
	align-items: center;
	justify-content: center;
}

.pg_calc_turf_final_values {
	width: 100%;
	height: auto;
	background-color: #ffdddd;
	border: 1px solid #f5c6cb;
	padding: 5px 0;
	border-radius: 4px;
	color: red;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.pg_turf_results_outside_main_outside {
	width: 100%;
	height: auto;
	display: none;
}

.pg_turf_results_lock_deck_outside {
	width: 100%;
	height: auto;
	display: none;
}

.pg_turf_lock_deck_type_recommendation_class, .pg_turf_lock_grass_type_recommendation_class , .pg_turf_product_roll_cut_recommendation_class, .pg_turf_product_roll_cut{
	display: none;
}

.pg_turf_results_outside_main {
	width: 100%;
	height: auto;
	display: flex;
	flex-direction: column;
	margin-top: 20px;
	margin-bottom: 20px;
	align-items: center;
	justify-content: center;
}

.pg_turf_results_main_layout {
	width: 100%;
	height: auto;
	display: flex;
	flex-direction: column;
	margin-top: 20px;
	margin-bottom: 20px;
	align-items: center;
	justify-content: center;
}

.pg_turf_specific_lock_deck_outside {
	width: 100%;
	height: auto;
	display: flex;
	flex-direction: column;
	padding: 20px;
	border-radius: 6px;
	background-color: white;
	border: 1px solid #28a745;
}

.pg_turf_specific_lock_deck_outside:hover {
	border: 2px solid #007bff;
}

.pg_turf_specific_lock_corner_edge_outside {
	width: 100%;
	height: auto;
	display: flex;
	flex-direction: column;
	padding: 20px;
	border-radius: 6px;
	background-color: white;
	border: 1px solid #28a745;
}

.pg_turf_specific_lock_corner_edge_outside:hover {
	border: 2px solid #007bff;
}

.pg_turf_results_main_layout div {
	font-size: 16px;
	font-weight: bold;
	color: black;
	margin: 5px 0;
}

.pg_turf_lock_deck_first_title {
	font-size: 22px; /* Adjust this value to your preferred size */
	font-weight: bold;
	margin: 0 0 15px 0 !important;
	padding: 0 !important; /* Optional padding for spacing within the element */
	color: black;
}

.pg_turf_lock_deck_second_title {
	font-size: 22px; /* Adjust this value to your preferred size */
	font-weight: bold;
	margin: 0 0 15px 0 !important;
	padding: 0 !important; /* Optional padding for spacing within the element */
	color: black;
}

.pg_turf_product_outside {
	width: 100%;
	height: auto;
	display: flex;
	flex-direction: column;
	padding: 20px;
	border-radius: 6px;
	background-color: white;
	border: 1px solid #28a745;
}

.pg_turf_product_outside:hover {
	border: 2px solid #007bff;
}

.pg_turf_product_outside h4 {
	font-size: 22px; /* Adjust this value to your preferred size */
	font-weight: bold;
	margin: 0 0 15px 0 !important;
	padding: 0 !important; /* Optional padding for spacing within the element */
	color: black;
}

.pg_turf_product_outside div {
	font-size: 16px;
	font-weight: bold;
	color: black;
	margin: 5px 0;
}

.pg_turf_tape_calculating_info {
	width: 100%;
	height: auto;
	display: flex;
	flex-direction: column;
	margin-top: 15px;
	padding: 20px;
	border-radius: 6px;
	background-color: white;
	border: 1px solid #28a745;
}

.pg_turf_tape_calculating_info:hover {
	border: 2px solid #007bff;
}

.pg_turf_tape_calculating_info h4 {
	font-size: 22px; /* Adjust this value to your preferred size */
	font-weight: bold;
	margin: 0 0 15px 0 !important;
	padding: 0 !important; /* Optional padding for spacing within the element */
	color: black;
}

.pg_turf_tape_calculating_info div {
	font-size: 16px;
	font-weight: bold;
	color: black;
	margin: 5px 0;
}

@media (max-width: 768px) {
	p:empty {
		display: none;
	}

	br {
		display: none;
	}

	.pg_turf_calculator_layout_content_outside {
		width: 100%;
		display: flex;
		flex-direction: column;
	}

	.block_turf_outer {
		width: 100% !important;
		height: auto !important;
		background-color: #f1f1f1;
		border: 1px solid #dee2e6;
		box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	}

	.pg_turf_results_outside_main {
		width: 100%;
		height: auto;
		display: flex;
		flex-direction: column;
		margin-top: 20px !important;
		align-items: center;
		justify-content: center;
	}

	.pg_turf_tape_calculating_info {
		width: 100%;
		height: auto;
		display: flex;
		flex-direction: column;
		margin-top: 15px;
		margin-bottom: 20px !important;
		padding: 20px;
		border-radius: 6px;
		background-color: white;
		border: 1px solid #28a745;
	}
}