/* ─── YMM Selector ────────────────────────────────────────────────────────── */

.ap-ymm { width: 100%; }

.ap-ymm__form {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: flex-end;
}

.ap-ymm__group {
	display: flex;
	flex-direction: column;
	gap: 6px;
	flex: 1;
	min-width: 120px;
}

.ap-ymm__label {
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .6px;
	color: inherit;
	opacity: .8;
}

.ap-ymm__select {
	width: 100%;
	padding: 10px 36px 10px 12px;
	border: 2px solid rgba(255,255,255,.2);
	border-radius: var(--ap-radius);
	background: rgba(255,255,255,.1);
	color: inherit;
	font-size: 14px;
	font-family: var(--ap-font);
	cursor: pointer;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	transition: border-color var(--ap-transition);
}

.ap-ymm__select:not(:disabled):hover { border-color: rgba(255,255,255,.6); }
.ap-ymm__select:disabled { opacity: .5; cursor: not-allowed; }

.ap-ymm__select:focus {
	outline: none;
	border-color: var(--ap-white);
}

.ap-ymm__submit {
	height: 42px;
	flex-shrink: 0;
	white-space: nowrap;
}

/* Inside filter sidebar (dark bg not guaranteed) */
.ap-filter-section .ap-ymm__select {
	border-color: var(--ap-border);
	background: var(--ap-white);
	color: var(--ap-black);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
}

.ap-filter-section .ap-ymm__label { color: var(--ap-black); opacity: 1; }

/* Widget wrapper */
.ap-ymm-widget { }

.ap-ymm-widget__heading {
	font-size: 24px;
	font-weight: 700;
	margin: 0 0 8px;
}

.ap-ymm-widget__sub {
	margin: 0 0 24px;
	opacity: .8;
}

/* ─── Responsive ──────────────────────────────────────────────────────────── */

@media (max-width: 768px) {
	.ap-ymm__form { flex-direction: column; }
	.ap-ymm__group { min-width: 100%; }
	.ap-ymm__submit { width: 100%; }
}