/*
 * e-Wikidversity custom brand CSS
 * 베이스: 라이트 (nginx Set-Cookie colorMode=light)
 * 메인 색상: #15B886 (mint green) — 라이트/다크 공통 브랜드 컬러
 * 액센트:    #14B8A6 (teal)
 * 다크 모드 (사용자가 토글 시): #1A1B26 배경 + 민트 그린 강조 유지
 */

:root {
  --ewiki-main: #15B886;
  --ewiki-main-hover: #0E7C66;
  --ewiki-accent: #14B8A6;
  --ewiki-light-bg: #F4FBF8;
  --ewiki-light-border: #D1FAE5;
  --ewiki-dark-bg: #1A1B26;
  --ewiki-dark-bg-deep: #11121A;
  --ewiki-dark-text: #C0CAF5;
  --ewiki-dark-text-dim: #8B92AD;
  --ewiki-dark-border: #2A2D3E;
}

/* =========================================================
 * 라이트 모드 (기본)
 * ========================================================= */

/* ---------- 액션 버튼 ---------- */
.formbuttons .btn-primary,
.btn-primary,
button.btn-primary,
input.button.mainaction {
  background-color: var(--ewiki-main) !important;
  border-color: var(--ewiki-main) !important;
  color: #FFFFFF !important;
  font-weight: 600;
}

.btn-primary:hover,
button.btn-primary:hover,
input.button.mainaction:hover {
  background-color: var(--ewiki-main-hover) !important;
  border-color: var(--ewiki-main-hover) !important;
  color: #FFFFFF !important;
}

/* ---------- 링크 ---------- */
a, a:link, a:visited {
  color: var(--ewiki-main-hover);
}

a:hover, a:active {
  color: var(--ewiki-main);
}

/* ---------- 좌측 메뉴 selected/hover 강조 ---------- */
#layout-menu li.selected > a,
#layout-menu li > a:hover {
  background-color: var(--ewiki-main) !important;
  color: #FFFFFF !important;
}

/* ---------- 리스트 선택 강조 ---------- */
.listing tbody tr.selected,
.listing tbody tr.selected td,
.listing li.selected,
.menu li > a.selected,
.treelist li.selected > div,
.treelist li.selected > a {
  background-color: var(--ewiki-light-bg) !important;
  color: var(--ewiki-main-hover) !important;
  border-color: var(--ewiki-main) !important;
}

/* ---------- 로그인 페이지 ---------- */
body.task-login {
  background: linear-gradient(135deg, #E8F8F2 0%, #F4FBF8 100%);
}

body.task-login #layout {
  background: transparent;
}

body.task-login .box {
  background-color: #FFFFFF;
  border-top: 4px solid var(--ewiki-main);
  box-shadow: 0 8px 32px rgba(21, 184, 134, 0.12);
}

body.task-login #login-form .formbuttons input[type="submit"] {
  background-color: var(--ewiki-main) !important;
  border-color: var(--ewiki-main) !important;
  color: #FFFFFF !important;
}

body.task-login #login-form .formbuttons input[type="submit"]:hover {
  background-color: var(--ewiki-main-hover) !important;
}

body.task-login input[type="text"]:focus,
body.task-login input[type="password"]:focus {
  border-color: var(--ewiki-main);
  outline-color: var(--ewiki-main);
  box-shadow: 0 0 0 2px rgba(21, 184, 134, 0.15);
}

/* ---------- 포커스 / 체크박스 ---------- */
*:focus,
input:focus,
textarea:focus,
button:focus {
  outline-color: var(--ewiki-main) !important;
}

input[type="checkbox"]:checked + label::before,
input[type="checkbox"]:checked::before {
  background-color: var(--ewiki-main);
  border-color: var(--ewiki-main);
}

/* ---------- 읽지 않은 메일 강조 ---------- */
.listing tbody tr.unread {
  font-weight: 700;
}

.listing tbody tr.unread .subject {
  color: var(--ewiki-main-hover);
}

/* =========================================================
 * 다크 모드 (사용자가 토글로 전환했을 때만)
 * ========================================================= */

html.dark-mode #layout-menu {
  background-color: var(--ewiki-dark-bg-deep) !important;
  border-right: 1px solid var(--ewiki-dark-border) !important;
}

html.dark-mode #layout-menu a {
  color: var(--ewiki-dark-text-dim) !important;
}

html.dark-mode #layout-menu li.selected > a,
html.dark-mode #layout-menu li > a:hover {
  background-color: var(--ewiki-main) !important;
  color: #0F1419 !important;
}

html.dark-mode .listing tbody tr.selected,
html.dark-mode .listing tbody tr.selected td {
  background-color: var(--ewiki-main) !important;
  color: #0F1419 !important;
}

html.dark-mode body.task-login {
  background: linear-gradient(135deg, #1A1B26 0%, #11121A 100%);
}

html.dark-mode body.task-login .box {
  background-color: rgba(26, 27, 38, 0.95);
  border-top: 4px solid var(--ewiki-main);
  color: var(--ewiki-dark-text);
  box-shadow: 0 8px 32px rgba(21, 184, 134, 0.15);
}

html.dark-mode body.task-login input[type="text"],
html.dark-mode body.task-login input[type="password"] {
  background-color: rgba(17, 18, 26, 0.5);
  border: 1px solid var(--ewiki-dark-border);
  color: var(--ewiki-dark-text);
}

html.dark-mode a {
  color: var(--ewiki-accent);
}

html.dark-mode .listing tbody tr.unread .subject {
  color: var(--ewiki-main);
}
