/**
 * Datei: standorte-dropdown.css
 * Modul: Listings (Single Listing)
 * Autor: MARKS MEDIA
 *
 * Zweck:
 *   Styling für das Dropdown-Element "Standort auswählen"
 *   im Single Listing (Frontend)
 */

/* ============================================================
   1. Wrapper
============================================================ */
.mp-location-wrapper {
	position: relative;
	display: block;
	width: 100%;
	margin-top: 10px;
}

/* Wenn nur 1 Standort → Button ausblenden */
.mp-location-wrapper.single-location .mp-pill-location {
	display: none !important;
}
.mp-location-wrapper.single-location .mp-location-list {
	display: none !important;
}

/* ============================================================
   2. Hauptbutton (optisch wie mp-pill)
============================================================ */
.mp-pill-location {
	display: block;
	width: 100%;
	padding: 10px 14px;
	font-size: 15px;
	border: 1px solid var(--pill-border);
	border-radius: var(--pill-radius);
	background: var(--pill-bg);
	color: var(--pill-color);
	text-align: left;
	text-decoration: none;
	cursor: pointer;
	box-sizing: border-box;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.mp-pill-location:hover {
	background: var(--pill-bg-active);
	color: #fff;
	border-color: var(--pill-bg-active);
}

/* ============================================================
   3. Dropdown-Liste
============================================================ */
.mp-location-list {
	display: none;
	position: absolute;
	left: 0;
	top: 100%;
	width: 100%;
	border: 1px solid var(--color-6);
	border-radius: 6px;
	margin-top: 4px;
	background: var(--color-8);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	z-index: 50;
	overflow: hidden;
}

/* ============================================================
   4. Einträge
============================================================ */
.mp-location-option {
	padding: 10px 14px;
	cursor: pointer;
	font-size: 15px;
	color: var(--color-4);
	border-bottom: 1px solid var(--color-6);
	transition: background-color 0.15s ease;
}

.mp-location-option:last-child {
	border-bottom: none;
}

.mp-location-option:hover {
	background: #f4f4f4;
}

/* Aktiver Eintrag */
.mp-location-option.active {
	background: var(--pill-bg-active);
	color: #fff;
}