/**
 * Locations page — full map + scrollable card list layout.
 * Shared .btn-* / .section-label styles already live in assets/css/style.css.
 */


.map-full-wrap {
	position: sticky;
	top: 64px;
	height: calc(100vh - 64px);
	z-index: 10;
	overflow: hidden;
}
#map-locations { width: 100%; height: 100%; }

.locations-page-layout {
	display: grid;
	grid-template-columns: 1fr 520px;
	min-height: calc(100vh - 64px);
	position: relative;
}
.location-cards-col {
	padding: 3rem 2rem;
	background: var(--cream);
	overflow-y: auto;
}

.loc-card {
	background: white;
	border-radius: var(--radius);
	overflow: hidden;
	box-shadow: var(--shadow-sm);
	margin-bottom: 1.5rem;
	transition: transform var(--transition), box-shadow var(--transition), border-left var(--transition);
	border-left: 3px solid transparent;
	cursor: pointer;
}
.loc-card:hover, .loc-card.active {
	transform: translateX(4px);
	box-shadow: var(--shadow-md);
	border-left-color: var(--gold);
}
.loc-card-head {
	background: var(--navy);
	padding: 1.25rem 1.5rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.loc-card-head-left { display: flex; align-items: center; gap: 0.75rem; }
.loc-pin { width: 10px; height: 10px; border-radius: 50%; background: var(--gold); flex-shrink: 0; }
.loc-card-head h3 { font-family: 'Allumi Std', 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Yu Gothic', sans-serif; font-size: 0.95rem; color: white; }
.loc-card-head .loc-area { font-size: 0.72rem; color: rgba(255, 255, 255, 0.5); letter-spacing: 0.05em; }
.loc-card-body { padding: 1.25rem 1.5rem; }
.loc-detail {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	margin-bottom: 0.65rem;
	font-size: 0.83rem;
	color: var(--text-mid);
	line-height: 1.5;
}
.loc-detail svg { width: 15px; height: 15px; flex-shrink: 0; margin-top: 1px; color: var(--gold); }
.loc-card-actions {
	padding: 0 1.5rem 1.25rem;
	display: flex;
	gap: 0.6rem;
	flex-wrap: wrap;
}
.loc-card-actions a {
	font-size: 0.72rem;
	padding: 0.45rem 1rem;
}

@media (max-width: 900px) {
	.locations-page-layout { grid-template-columns: 1fr; }
	.map-full-wrap { position: relative; top: 0; height: 380px; }
	.location-cards-col { padding: 2rem 1.25rem; }
}