/* 언어 바꾸기 메뉴 (2026-11, 다국어) — 그리는 코드: inc/edm_lang.lib.php의 edm_lang_menu_html()
   - 컴퓨터(1024px 이상): 오른쪽 위 화면 모드 단추 옆 지구본 단추. 누르면 아래로 언어 목록이 펼쳐져요 (.edm-lang)
   - 좁은 컴퓨터(720~1023px): 윗줄 자리가 모자라서(영어·일본어 로그인 단추가 길어요) 왼쪽 메뉴 맨 위 '언어' 고르기 칸 (.edm-lang-row)
   - 휴대폰(719px 이하): ☰ 메뉴 맨 위 같은 고르기 칸
   - 화이트 모드 색은 theme/basic/theme-light.css의 [data-theme="light"] 아래에 있어요 (다른 화이트 색과 한곳에)
   - 목록 맨 아래 'IP Geolocation by DB-IP'는 나라 자료를 쓰는 조건이라 숨기면 안 돼요 */

.edm-lang { position: relative; display: inline-flex; flex: none; }

.edm-lang-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 31px;
  height: 31px;
  padding: 0;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.22);
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
}
.edm-lang-btn:hover,
.edm-lang.open .edm-lang-btn { background: rgba(255, 255, 255, 0.16); }
.edm-lang-btn svg { display: block; width: 16px; height: 16px; }

.edm-lang-pop {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 1001;
  min-width: 168px;
  padding: 6px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: #1b1b1f;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.45);
}
.edm-lang.open .edm-lang-pop { display: block; }

.edm-lang-pop button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 8px 10px;
  border: 0;
  border-radius: 8px;
  background: none;
  color: #ddd;
  font: inherit;
  font-size: 14px;
  text-align: left;
  cursor: pointer;
}
.edm-lang-pop button:hover { background: rgba(255, 255, 255, 0.08); color: #fff; }
.edm-lang-pop button[aria-checked="true"] { color: #fff; font-weight: 700; }
.edm-lang-pop button[aria-checked="true"]::after { content: "✓"; color: #ff2e63; font-weight: 700; }

.edm-lang-credit {
  display: block;
  margin: 4px 4px 0;
  padding: 6px 6px 2px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  color: #888 !important;
  font-size: 11px;
  text-decoration: none;
}
.edm-lang-credit:hover { text-decoration: underline; }

/* 왼쪽 메뉴(휴대폰은 ☰ 메뉴) 맨 위 고르기 칸: 1023px 이하에서만 보이고, 그때는 윗줄 지구본 단추를 숨겨요 */
.edm-lang-row { margin: 0 0 12px; }
@media (min-width: 1024px) { .edm-lang-row { display: none; } }
@media (max-width: 1023px) { .va-login-area .edm-lang { display: none; } }
.edm-lang-row label {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.06);
  color: #ddd;
  font-size: 14px;
}
.edm-lang-row svg { flex: none; width: 16px; height: 16px; }
.edm-lang-row select {
  flex: 1 1 auto;
  min-width: 0;
  margin-left: auto;
  padding: 6px 8px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: #111;
  color: #fff;
  font: inherit;
  font-size: 14px;
}
.edm-lang-row .edm-lang-credit { border-top: 0; margin: 2px 0 0; padding: 2px 10px 0; }

/* 언어별 글꼴: 사이트 글꼴(Pretendard·맑은 고딕)은 한국어용이라 일본어·중국어 글자가 벌어지고 모양이 달라 보여서,
   그 언어 글꼴을 앞에 둬요. 아이콘 글꼴(.fa-*)은 따로 정해져 있어서 영향이 없어요. 한글은 뒤쪽 한국어 글꼴이 그려요 */
html:lang(ja) body, html:lang(ja) h1, html:lang(ja) h2, html:lang(ja) h3, html:lang(ja) h4, html:lang(ja) h5, html:lang(ja) h6,
html:lang(ja) input, html:lang(ja) button, html:lang(ja) textarea, html:lang(ja) select {
  font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic UI", "Yu Gothic", Meiryo, "Noto Sans JP", "Pretendard", "Noto Sans KR", "Malgun Gothic", sans-serif;
}
html:lang(zh-CN) body, html:lang(zh-CN) h1, html:lang(zh-CN) h2, html:lang(zh-CN) h3, html:lang(zh-CN) h4, html:lang(zh-CN) h5, html:lang(zh-CN) h6,
html:lang(zh-CN) input, html:lang(zh-CN) button, html:lang(zh-CN) textarea, html:lang(zh-CN) select {
  font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans SC", "Pretendard", "Noto Sans KR", "Malgun Gothic", sans-serif;
}
html:lang(zh-TW) body, html:lang(zh-TW) h1, html:lang(zh-TW) h2, html:lang(zh-TW) h3, html:lang(zh-TW) h4, html:lang(zh-TW) h5, html:lang(zh-TW) h6,
html:lang(zh-TW) input, html:lang(zh-TW) button, html:lang(zh-TW) textarea, html:lang(zh-TW) select {
  font-family: "PingFang TC", "Microsoft JhengHei", "Noto Sans TC", "Pretendard", "Noto Sans KR", "Malgun Gothic", sans-serif;
}
