/**
 * MATTA locations accordion (Find MATTA) — frontend.
 *
 * @package Matta_Utility
 */

.sgmat-find-matta.find-matta {
	display: grid;
	grid-template-columns: 50% 50%;
	min-height: 600px;
	align-items: stretch;
}

.sgmat-find-matta .locations {
	padding: 0 40px 0 0;
}

@media only screen and (max-width: 1024px) {
	.sgmat-find-matta .locations {
		padding: 0;
	}
}

.sgmat-find-matta .desktop-map {
	height: 100%;
	min-height: 600px;
}

.sgmat-find-matta .desktop-map iframe,
.sgmat-find-matta .desktop-map .sgmat-map-frame {
	width: 100%;
	height: 100%;
	border: 0;
}

.sgmat-find-matta .accordion-item {
	border-bottom: 1px solid #ddd;
}

.sgmat-find-matta .accordion-header {
	cursor: pointer;
	padding: 18px 0;
	font-size: 18px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
}

.sgmat-find-matta .accordion-header__title {
	flex: 1;
	min-width: 0;
}

.sgmat-find-matta .accordion-header__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.sgmat-find-matta .accordion-header__chevron {
	display: block;
	width: 20px;
	height: 20px;
	object-fit: contain;
	transition: transform 0.3s ease;
}

.sgmat-find-matta .accordion-item.active .accordion-header__chevron {
	transform: rotate(180deg);
}

.sgmat-find-matta .accordion-content {
	display: none;
	padding-bottom: 20px;
}

.sgmat-find-matta .accordion-item.active .accordion-content {
	display: block;
}

.sgmat-find-matta .loc-address {
	margin: 10px 0 12px;
	color: #555;
}

.sgmat-find-matta .loc-actions {
	display: flex;
	align-items: center;
	gap: 25px;
}

.sgmat-find-matta .loc-phone,
.sgmat-find-matta .loc-directions {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.sgmat-find-matta .loc-phone img,
.sgmat-find-matta .loc-directions img {
	width: 16px;
	height: 16px;
}

.sgmat-find-matta .loc-phone a,
.sgmat-find-matta .loc-directions a {
	text-decoration: none;
	color: inherit;
	font-weight: 500;
}

.sgmat-find-matta .mobile-map iframe {
	width: 100%;
	height: 260px;
	border: 0;
	margin-top: 15px;
}

@media (max-width: 900px) {
	.sgmat-find-matta.find-matta {
		grid-template-columns: 1fr;
	}

	.sgmat-find-matta .desktop-map {
		display: none;
	}
}