/* 공통 스위치 스타일 */
.switch, .lang-switch, .currency-switch {
  position: relative;
  display: inline-block;
  width: 50px;
  height: 26px;
  margin-left: 10px;
  vertical-align: middle;
}

/* 언어 / 환율 토글은 더 넓음 */
.lang-switch,
.currency-switch {
  width: 60px;
}

/* 공통 숨김 체크박스 */
.switch input, .lang-switch input, .currency-switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* 공통 슬라이더 */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0; left: 0; right: 0; bottom: 0;
  background-color: #ccc;
  transition: .4s;
  border-radius: 34px;
}

/* 공통 원형 핸들 */
.slider:before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 3px;
  bottom: 3px;
  background-color: white;
  transition: .4s;
  border-radius: 50%;
  z-index: 2;
}

/* ON 상태 배경 */
input:checked + .slider {
  background-color: #4079BF;
}

/* ON 상태 핸들 이동 (기본) */
input:checked + .slider:before {
  transform: translateX(24px);
}

/* 둥근 스위치 전용 */
.slider.round {
  border-radius: 34px;
}
.slider.round:before {
  border-radius: 50%;
}

/* ✅ 언어 전환 토글 스타일 */
.lang-switch .slider,
.currency-switch .slider {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 7px;
  font-size: 10px;
  color: white;
  box-sizing: border-box;
}

.lang-switch .label-ko,
.lang-switch .label-en,
.currency-switch .label-krw,
.currency-switch .label-usd {
  z-index: 1;
  pointer-events: none;
  position: relative;
}

/* ✅ 슬라이더 핸들 이동 거리 조정 */
.lang-switch input:checked + .slider:before,
.currency-switch input:checked + .slider:before {
  transform: translateX(34px);
}