body.insuremytrip #main > #algolia-plan-listing {
	padding-block: 0;

	.plan-listing {
		display: grid;
		grid-template-columns: 1fr;
		gap: 30px;
		margin-bottom: 30px;
	}

	.algolia-filters.two-column {
		display: grid;
		gap: 20px;
		grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));

		@media (min-width: 1000px) {
			padding-inline: 170px;
		}
	}

	& > .filter-result {
		display: grid;
		grid-template-columns: 1fr 1fr;


		.filter-result__title {
			display: none;
		}

		.toggle-show-filters,
		.select-field--sort select {
			height: 100%;
			background-color: white;
			border: 1px solid #dedede;
			border-radius: 12px;
			padding: 10px;
			width: 100%;
			font-weight: normal;
			font-size: 16px;
			text-align: left;
			box-shadow: 0 0 24px rgba(0, 0, 0, 0.09);
		}

		.select-field--sort {
			position: relative;
			padding: 0;
			border: 0;
			background: transparent;
			box-shadow: none;

			&::after {
				content: "";
				position: absolute;
				top: 50%;
				right: 14px;
				width: 10px;
				height: 10px;
				border-right: 2px solid currentColor;
				border-bottom: 2px solid currentColor;
				transform: translateY(-65%) rotate(45deg);
				pointer-events: none;
			}

			select {
				appearance: none;
				-webkit-appearance: none;
				cursor: pointer;
				padding-right: 40px;
			}
		}

		@media (width > 1024px) {
			margin-bottom: 32px;

			.select-field--sort {
				width: auto;
			}

			.filter-result__title {
				display: inline-block;
			}

			.toggle-show-filters {
				display: none;
			}
		}
	}

	& > .container {
		display: grid;
		grid-template-columns: 1fr;
		column-gap: 35px;

		@media (width > 1024px) {
			grid-template-columns: 300px 1fr;
		}

		.filter-form__title {
			padding-bottom: 20px;
		}

		.filter-header {
			display: block;
			font-weight: 600;
			padding-block: 12px;
			padding-inline-start: 24px;
			color: white;
			background-color: var(--brand-color);
		}

		.filter-form.open {
			z-index: 1000;
		}

		.filter-form:has(.algolia-filters.three-column) {
			display: block;
			transition: max-height 0.3s ease;
			padding-block: 0;
			padding-inline: 0;

			@media (width < 1025px) {
				background-color: #fff;
				position: fixed;
				width: 100vw;
				height: 100dvh;
				overflow-y: auto;
				overscroll-behavior: contain;
				-webkit-overflow-scrolling: touch;

				padding-block: var(--main-header-height, 132px) 80px;

				.logged-in & {
					padding-block: calc(var(--main-header-height, 132px) + 46px) 80px;
				}

				padding-inline: 0;
				top: 0;
				left: -100%;
				transition: left 0.3s ease;

				.filter-form__see-plans-btn.close {
					display: block !important;
					background-color: #0270c0;
					color: #fff;
					border: none;
					padding-block: 12px;
					width: calc(100vw - 24px);
					margin-inline: auto;
					box-shadow: none;
					border-radius: 5px;
					position: fixed;
					z-index: 1000;
					left: 50%;
					bottom: 16px;
					transform: translateX(-50%);
				}

				&:has(.algolia-filters.three-column.open) {
					left: 0;
				}
			}

			.filter-form__see-plans-btn {
				display: none;
			}
		}

		.radio-list__item {
			position: relative;
			border-bottom: 1px solid #dedede;
			cursor: pointer;

			@media (width < 1025px) {
				padding-inline-start: 12px;
			}

			@media (width > 1024px) {
				&:active > span,
				&:hover > span {
					padding-left: 24px;
				}
			}

			&:has(:focus-visible) > span {
				outline: -webkit-focus-ring-color auto 1px;
			}

			&:has(:focus-visible) > input {
				outline: none;
			}

			&:has(:checked) > span {
				padding-inline-start: 24px;

				&::before {
					opacity: 1;
				}
			}

			&.is-disabled {
				cursor: not-allowed;

				& > span {
					color: #2126294D;
				}
			}

			& > span {
				z-index: 0;
				padding: 12px;
				padding-inline-start: 12px;
				display: block;
				position: relative;
				background-color: white;
				outline: 1px solid transparent;
				transition: all 0.3s ease;

				&::before {
					content: "";
					width: 40px;
					height: 10px;
					position: absolute;
					opacity: 0;
					left: 0;
					top: 50%;
					transform: translateY(-50%); /* rotate(90deg);*/
					background-repeat: no-repeat;
					background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' stroke='%23000' viewBox='0 0 78.369 78.369'%3E%3Cpath d='M78.049 19.015 29.458 67.606a1.094 1.094 0 0 1-1.548 0L.32 40.015a1.094 1.094 0 0 1 0-1.547l6.704-6.704a1.095 1.095 0 0 1 1.548 0l20.113 20.112 41.113-41.113a1.095 1.095 0 0 1 1.548 0l6.703 6.704a1.094 1.094 0 0 1 0 1.548z'/%3E%3C/svg%3E");

					transition: all 0.3s ease;
				}
			}

			input {
				z-index: -1;
				position: absolute;
				inset: 0;
				width: 100%;
				height: 100%;
				margin: 0;
				opacity: 0;
				appearance: none;
				-webkit-appearance: none;
				border: 0;
				background: transparent;

				&:disabled {
					cursor: not-allowed;
				}
			}
		}
	}

	@media (min-width: 1024px) {
		.plan-card {
			grid-template-columns: 325px 1fr;
			padding-left: 40px;
			padding-right: 40px;
			padding-bottom: 25px;

		}
	}

	.plan-card {
		&:hover {
			.card-provider__title {
				text-decoration: none;
			}
		}

		.card-provider__logo {
			border-bottom: none;
		}

		.content {
			display: flex;
			flex-direction: column;
			row-gap: 10px;

			.tag__btn:empty {
				display: none;
			}
		}

		.card-provider__title > a {
			text-decoration-line: underline; /* Ensures the line is present */
			text-decoration-color: transparent; /* Start with an invisible underline */
			transition: text-decoration-color 0.3s ease-in-out;

			&:hover, &:focus-visible {
				text-decoration-color: currentColor;
			}
		}

		.action-container {
			margin-top: auto;
			display: flex;
			align-items: center;
			justify-content: center;
			column-gap: 10px;

			& > a {
				--_accent-color: #0270c0;
				flex: 1;
				font-weight: 700;
				border: 2px solid var(--_accent-color);
				color: var(--_accent-color);
				text-transform: uppercase;
				text-align: center;
				padding: 10px;
				border-radius: 5px;
				text-decoration-thickness: 2px;
				text-decoration-line: underline; /* Ensures the line is present */
				text-decoration-color: transparent; /* Start with an invisible underline */
				transition: text-decoration-color 0.3s ease-in-out;

				&:hover, &:focus-visible {
					text-decoration-color: currentColor;
				}
			}

			.get-quote {
				--_accent-color: #77bb33;
			}
		}

		details {
			summary {
				cursor: pointer;

				::marker {
					background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none'%3E%3Cpath fill='%23000' d='M9.115 6 10 5.098 5 0 0 5.098.885 6 5 1.805z'/%3E%3C/svg%3E");
				}
			}
		}

		details {

			summary {
				font-weight: 700;
				padding-left: 20px;
				position: relative;
				padding-block: 15px;
				display: flex;
				align-items: center;
				border-bottom: 1px solid #dedede;

				&::before {
					content: "";
					width: 10px;
					height: 10px;
					position: absolute;
					left: 0;
					top: 50%;
					/*transform-origin: 5px;*/
					transform: rotate(180deg) translateY(5px);
					background-repeat: no-repeat;
					background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none'%3E%3Cpath fill='%23000' d='M9.115 6 10 5.098 5 0 0 5.098.885 6 5 1.805z'/%3E%3C/svg%3E");
					transition: transform 0.3s ease;
				}

				&::marker {
					content: " + ";
				}
			}

			&:has(.description:empty) {
				display: none
			}
		}

		details[open] {
			padding-bottom: 0.5rem; /* Additional styles when open */

			summary:before {
				transform: rotate(0deg) translateY(0px);
			}
		}

		.vp__row {
			display: grid;
			grid-template-columns: 1fr 1fr;
			gap: 10px;
			padding-block: 12px;
			padding-left: 20px;
			border-bottom: 1px solid #dedede;
		}
	}
}

body.imt-plan-listing-scroll-lock {
	overflow: hidden;
}