/* 사용자 설정 팝업 */
.account-menu {
	position: absolute;
	z-index: 1100;
	top: calc(100% + 10px);
	right: 0;

	width: min(300px, calc(100vw - 28px));
	padding: 18px;

	border: 1px solid rgba(23, 37, 30, 0.09);
	border-radius: 18px;

	color: #17251e;
	background: rgba(255, 255, 255, 0.98);
	box-shadow: 0 18px 50px rgba(19, 37, 28, 0.2);
	backdrop-filter: blur(18px);
}

/* hidden 속성이 확실하게 적용되도록 설정 */
.account-menu[hidden] {
	display: none;
}

/* 팝업 상단 */
.account-menu_header {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin-bottom: 14px;
	padding: 0 2px 14px;

	border-bottom: 1px solid rgba(23, 37, 30, 0.08);
}

.account-menu_header strong {
	color: #17251e;
	font-size: 16px;
	font-weight: 800;
	line-height: 1.3;
}

.account-menu_header small {
	color: #718078;
	font-size: 12px;
	line-height: 1.5;
}

/* 개별 설정 행 */
.account-menu_setting {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;

	min-height: 48px;
	padding: 8px 2px;

	color: #435249;
	font-size: 13px;
	font-weight: 600;
}

.account-menu_setting + .account-menu_setting {
	border-top: 1px solid rgba(23, 37, 30, 0.06);
}

/* 설정 select */
.account-menu_setting select {
	min-width: 116px;
	height: 36px;
	padding: 0 30px 0 11px;

	border: 1px solid rgba(23, 37, 30, 0.12);
	border-radius: 10px;
	outline: none;

	color: #17251e;
	background-color: #f7f9f8;

	font-family: inherit;
	font-size: 13px;
	font-weight: 700;

	cursor: pointer;
}

.account-menu_setting select:hover {
	border-color: rgba(35, 115, 76, 0.25);
	background-color: #fff;
}

.account-menu_setting select:focus {
	border-color: #4c9870;
	box-shadow: 0 0 0 3px rgba(35, 115, 76, 0.1);
}

/* 로그인 버튼 */
#loginButton {
	width: 100%;
	min-height: 44px;
	margin-top: 14px;
	padding: 0 14px;

	border: 0;
	border-radius: 12px;

	color: #fff;
	background: #17251e;

	font-family: inherit;
	font-size: 14px;
	font-weight: 800;

	cursor: pointer;
}

#loginButton:hover {
	background: #234031;
}

/* 설정 초기화 */
#resetSettingsButton {
	width: 100%;
	min-height: 40px;
	margin-top: 8px;
	padding: 0 14px;

	border: 0;
	border-radius: 11px;

	color: #a13d38;
	background: #f9eeee;

	font-family: inherit;
	font-size: 13px;
	font-weight: 700;

	cursor: pointer;
}

#resetSettingsButton:hover {
	color: #842e2a;
	background: #f5dfde;
}

#loginButton:focus-visible,
#resetSettingsButton:focus-visible {
	outline: 3px solid rgba(35, 115, 76, 0.2);
	outline-offset: 2px;
}