/* ============================================================
   ChiCamp Select Menu – Frontend styles
   ============================================================ */

.chicamp-select-menu {
	position: relative;
	display: inline-block;
	min-width: 220px;
	max-width: 100%;
	font-family: inherit;
	-webkit-user-select: none;
	user-select: none;
	z-index: 200;
}

/* ---- Trigger (button) ---------------------------------------- */

.csm-trigger {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 11px 18px;
	border-radius: 10px;
	cursor: pointer;
	color: #fff;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: .01em;
	transition: filter .18s ease, border-radius .25s ease;
	box-shadow: 0 2px 8px rgba(0,0,0,.18);
}

.csm-trigger:hover {
	filter: brightness(1.08);
}

.chicamp-select-menu--open .csm-trigger {
	border-radius: 10px 10px 0 0;
	filter: brightness(1.05);
}

.csm-trigger__label {
	flex: 1;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.csm-trigger__arrow {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	transition: transform .25s ease;
	opacity: .85;
}

.chicamp-select-menu--open .csm-trigger__arrow {
	transform: rotate(180deg);
}

/* ---- Dropdown ------------------------------------------------- */

.csm-dropdown {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 100%;
	background: #fff;
	border-radius: 0 0 10px 10px;
	box-shadow: 0 6px 24px rgba(0,0,0,.14);
	overflow: hidden;
	border-top: 2px solid transparent; /* colour set inline */
	z-index: 999;
	animation: csm-slide-in .2s ease;
}

@keyframes csm-slide-in {
	from { opacity: 0; transform: translateY(-6px); }
	to   { opacity: 1; transform: translateY(0);    }
}

.chicamp-select-menu--open .csm-dropdown {
	display: block;
}

/* ---- Items ---------------------------------------------------- */

.csm-item {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	cursor: pointer;
	color: #2a2a2a;
	font-size: 14px;
	line-height: 1.3;
	white-space: nowrap;
	transition: background .12s ease;
	background: #fff;
}

.csm-item:hover,
.csm-item:focus {
	background: #f2f2f2;
	outline: none;
}

.csm-item:active {
	background: #e8e8e8;
}

/* Last item – rounded bottom corners */
.csm-item:last-child {
	border-radius: 0 0 10px 10px;
}

/* Child indentation */
.csm-item--depth-1 { padding-left: 32px; }
.csm-item--depth-2 { padding-left: 46px; }
.csm-item--depth-3 { padding-left: 60px; }

/* Indent visual marker (small bar) */
.csm-item__indent {
	display: inline-block;
	width: 3px;
	height: 14px;
	background: #ccc;
	border-radius: 2px;
	flex-shrink: 0;
	margin-right: 2px;
}

.csm-item__label {
	flex: 1;
}
