/*
 * GnC Tech brand CSS for Roundcube Elastic (덮어씀)
 * Modified by Claude Code: 2026-07-28 - PILLETTO(코랄) -> GnC Tech(Navy·Cyan) 리브랜딩
 * 브랜드가이드_통합.html 기준:
 *   Primary  Midnight Navy #1B2A4A  (헤더/텍스트/CTA, 로고 G)
 *   Accent   Bright Cyan   #22C1E0  (포인트·강조, 로고 C — 좁게 사용)
 *   원칙: Flat & Square(모서리 0–4px, 소프트섀도우 지양), Hairline 위계, 절제된 색
 */

:root {
  --gnc-navy:      #1B2A4A;   /* primary */
  --gnc-navy-sub:  #12203A;   /* navy hover/active */
  --gnc-cyan:      #22C1E0;   /* accent */
  --gnc-cyan-sub:  #17A6C4;   /* cyan hover */
  --gnc-tint:      #E9F6FB;   /* 선택 행 배경 (cyan 틴트) */
  --gnc-line:      #E0E0E0;   /* hairline */
  --gnc-gray:      #8C8C8C;
}

/* ---------- 헤더 / 상단 네비 (Navy) ---------- */
#layout-menu,
.menu.toolbar.popupmenu,
html.layout-large #layout-menu {
  background-color: var(--gnc-navy) !important;
}
#layout-menu a,
#layout-menu .button,
#layout-menu li > a { color: #FFFFFF !important; }
#layout-menu li.selected > a,
#layout-menu li > a:hover {
  background-color: var(--gnc-navy-sub) !important;
  color: #FFFFFF !important;
}

/* ---------- 액션 버튼 / CTA (Navy) ---------- */
.formbuttons .btn-primary,
.btn-primary, button.btn-primary,
input.button.mainaction {
  background-color: var(--gnc-navy) !important;
  border-color: var(--gnc-navy) !important;
  color: #FFFFFF !important;
  border-radius: 3px !important;   /* Flat & Square */
}
.btn-primary:hover, button.btn-primary:hover, input.button.mainaction:hover {
  background-color: var(--gnc-navy-sub) !important;
  border-color: var(--gnc-navy-sub) !important;
}

/* ---------- 링크 = Accent(Cyan), 좁게 ---------- */
a, a:hover { color: var(--gnc-cyan); }
a:hover { color: var(--gnc-cyan-sub); }

/* ---------- 리스트 선택 강조 (cyan 틴트 + hairline) ---------- */
.listing tbody tr.selected,
.listing tbody tr.selected td,
.listing li.selected,
.menu li > a.selected {
  background-color: var(--gnc-tint) !important;
  color: var(--gnc-navy) !important;
  border-color: var(--gnc-cyan) !important;
}

/* ---------- 로그인 페이지 (Navy→Cyan 그라데이션) ---------- */
body.task-login #layout {
  background: linear-gradient(135deg, #1B2A4A 0%, #22C1E0 100%);
}
body.task-login .box { border-top: 3px solid var(--gnc-cyan); border-radius: 4px; }
body.task-login #login-form .formbuttons input[type="submit"] {
  background-color: var(--gnc-navy) !important;
  border-color: var(--gnc-navy) !important;
}
body.task-login #login-form .formbuttons input[type="submit"]:hover {
  background-color: var(--gnc-navy-sub) !important;
}

/* ---------- 사이드바 / 폴더 활성 ---------- */
.treelist li.selected > div,
.treelist li.selected > a {
  background-color: var(--gnc-tint) !important;
  color: var(--gnc-navy) !important;
}

/* ---------- 다크 모드 (Navy 더 어둡게, 전경 Cyan) ---------- */
html.dark-mode #layout-menu { background-color: #0E1830 !important; }
html.dark-mode a { color: #5FD3EC; }
html.dark-mode .btn-primary,
html.dark-mode button.btn-primary,
html.dark-mode input.button.mainaction {
  background-color: var(--gnc-navy) !important;
  border-color: var(--gnc-navy) !important;
}

/* ---------- 포커스 링 (Cyan) ---------- */
*:focus, input:focus, textarea:focus, button:focus {
  outline-color: var(--gnc-cyan) !important;
}

/* ---------- 체크박스 (Navy) ---------- */
input[type="checkbox"]:checked + label::before,
input[type="checkbox"]:checked::before {
  background-color: var(--gnc-navy);
  border-color: var(--gnc-navy);
}

/* ---------- Flat & Square: 카드 hairline, 라운드 최소화 ---------- */
.formcontent, .boxpane, .record, .contactfieldgroup { border-radius: 2px !important; }

/* ---------- 로고 (GnC Tech GC 모노그램) ---------- */
#logo {
  content: url("../images/gnctech-logo.png");
  height: auto; width: auto; max-width: 100%;
  background: transparent !important;
}
/* 로그인 화면 — 어두운 그라데이션 위, 흰 칩으로 대비 확보(브랜드가이드: 다크배경 반전) */
body.task-login #logo {
  display: block; margin: 0 auto 20px;
  max-width: 170px; max-height: 150px; object-fit: contain;
  background: #FFFFFF !important; padding: 18px 22px; border-radius: 4px;
}
/* 좌측 사이드바 상단 — Navy 위 흰 칩으로 표시 */
#layout-menu .popover-header #logo,
#layout-menu #logo {
  content: url("../images/gnctech-logo.png");
  display: block; margin: 8px auto;
  max-width: 60px; max-height: 44px; width: auto; height: auto;
  object-fit: contain;
  background: #FFFFFF !important;
  padding: 4px; border-radius: 3px;
}

/* ---------- 모바일 슬라이드 액션 메뉴: Navy 배경 위 흰 글자 ---------- */
.menu.toolbar.popupmenu,
.menu.toolbar.popupmenu *,
.menu.toolbar.popupmenu a,
.menu.toolbar.popupmenu a .inner,
.menu.toolbar.popupmenu a span,
.menu.toolbar.popupmenu a::before,
.menu.toolbar.popupmenu .button,
.menu.toolbar.popupmenu .button .inner,
.menu.toolbar.popupmenu .button::before,
.menu.toolbar.popupmenu li.disabled,
.menu.toolbar.popupmenu li.disabled *,
.menu.toolbar.popupmenu .listing li.disabled,
.menu.toolbar.popupmenu .listing li.disabled * {
  color: #FFFFFF !important;
}
.menu.toolbar.popupmenu li.disabled a::before,
.menu.toolbar.popupmenu .listing li.disabled a::before { color: #FFFFFF !important; }
.menu.toolbar.popupmenu .disabled,
.menu.toolbar.popupmenu a.disabled,
.menu.toolbar.popupmenu .button.disabled { opacity: 1 !important; }
.menu.toolbar.popupmenu a:hover,
.menu.toolbar.popupmenu a:focus,
.menu.toolbar.popupmenu .button:hover,
.menu.toolbar.popupmenu .button:focus {
  background-color: var(--gnc-navy-sub) !important;
  color: #FFFFFF !important;
}