/* ============================================================
   유니마인드랩 — 모던 헤더 + 다크모드 오버레이 (정적 포팅 위에 덧입힘)
   레거시 Polo 테마 마크업은 그대로 두고 시각만 현대화한다.
   브랜드 네이비: #16307a / 라이트 네이비 틴트
   ============================================================ */
:root{
  --uml-navy:#16307a;
  --uml-navy-2:#1e3f9c;
  --uml-blue:#16307a;      /* 유니블루(헤더 배경) */
  --uml-blue-2:#1b52b8;
  --uml-ink:#1f2733;
  --uml-line:rgba(17,24,39,.08);
  --uml-head-h:90px;
}

/* ---------- 모던 헤더 ---------- */
#header{
  position:-webkit-sticky !important;
  position:sticky !important;
  top:0 !important;
  height:var(--uml-head-h) !important;
  line-height:var(--uml-head-h) !important;
  z-index:1000 !important;
  transition:height .25s ease, background .25s ease, box-shadow .25s ease;
}
#header .header-inner, #header #header-wrap{
  height:var(--uml-head-h) !important;
  background:linear-gradient(90deg, var(--uml-blue) 0%, var(--uml-blue-2) 100%) !important;
  -webkit-backdrop-filter:saturate(160%) blur(8px);
  backdrop-filter:saturate(160%) blur(8px);
  border-bottom:1px solid rgba(255,255,255,.10);
  transition:height .25s ease, background .25s ease, box-shadow .25s ease;
}
/* 스크롤 시 (JS가 .is-stuck 부여) — 더 단단하게 + 그림자 */
#header.is-stuck{ --uml-head-h:74px; }
#header.is-stuck .header-inner, #header.is-stuck #header-wrap{
  background:linear-gradient(90deg, #122863 0%, #1746a8 100%) !important;
  box-shadow:0 6px 28px rgba(8,18,46,.34);
}
/* 로고 */
#header #logo a > img{ height:auto !important; width:50px !important; transition:width .25s ease; }
#header.is-stuck #logo a > img{ width:44px !important; }
#header .header-inner #logo, #header #header-wrap #logo{ height:var(--uml-head-h) !important; }

/* 메뉴 항목 — 굵기/자간 + 호버 언더라인 */
#mainMenu nav > ul > li > a{
  font-weight:600 !important;
  font-size:15px !important;
  letter-spacing:-.01em !important;
  color:rgba(255,255,255,.92) !important;
  position:relative;
  transition:color .2s ease;
}
#mainMenu nav > ul > li > a::after{
  content:""; position:absolute; left:18px; right:18px; bottom:20px; height:2px;
  background:#ffffff; border-radius:2px;
  transform:scaleX(0); transform-origin:center; transition:transform .25s ease;
}
#mainMenu nav > ul > li:hover > a, #mainMenu nav > ul > li.active > a{ color:#ffffff !important; }
#mainMenu nav > ul > li:hover > a::after{ transform:scaleX(1); }

/* 드롭다운 — 투명→솔리드 카드 */
#mainMenu nav > ul > li .dropdown-menu{
  background:linear-gradient(180deg, var(--uml-blue) 0%, var(--uml-blue-2) 100%) !important;
  border-radius:14px !important;
  box-shadow:0 18px 48px rgba(8,18,46,.34) !important;
  padding:8px !important;
  margin-top:8px !important;
  min-width:210px;
  opacity:0; transform:translateY(8px); pointer-events:none;
  transition:opacity .22s ease, transform .22s ease;
}
#mainMenu nav > ul > li:hover .dropdown-menu{ opacity:1; transform:translateY(0); pointer-events:auto; }
#mainMenu nav > ul > li .dropdown-menu > li > a{
  color:rgba(255,255,255,.90) !important; font-weight:500 !important; font-size:13.5px !important;
  border-radius:9px; padding:10px 14px !important; line-height:1.3 !important;
  transition:background .18s ease, color .18s ease;
}
#mainMenu nav > ul > li .dropdown-menu > li > a:hover{
  background:rgba(255,255,255,.15) !important; color:#fff !important;
}
#mainMenu nav > ul > li .dropdown-menu > li > a sup{ color:#bcd3ff; font-weight:700; }

/* 데스크톱: 헤더를 단일행 플렉스로 — 로고 | 메뉴(중앙) | 액션(우측) */
@media (min-width:992px){
  #header .header-inner > .container{
    display:flex !important; align-items:center !important; flex-wrap:nowrap !important;
    width:min(1280px,94%) !important; max-width:none !important; height:var(--uml-head-h) !important;
  }
  #header #logo{ height:var(--uml-head-h) !important; display:flex !important; align-items:center; float:none !important; }
  #header #search{ display:none !important; }
  #header #mainMenu-trigger, #header .dim_bg{ display:none !important; }
  #header #mainMenu{
    flex:1 1 auto !important; display:flex !important; align-items:center !important;
    justify-content:center !important; height:var(--uml-head-h) !important;
    position:static !important; float:none !important;
  }
  #header #mainMenu > .container{ width:auto !important; max-width:none !important; flex:0 1 auto; padding:0 !important; margin:0 !important; }
  #header #mainMenu nav{ float:none !important; margin:0 !important; }
}
/* 우측 액션 그룹 (JS가 .uml-actions 로 묶음) */
.uml-actions{
  display:flex; align-items:center; gap:12px; height:var(--uml-head-h);
  margin-left:18px; flex:0 0 auto; transition:height .25s ease;
}
.uml-actions > a{ font-weight:600 !important; font-size:14px !important; color:rgba(255,255,255,.85) !important; transition:color .2s ease; white-space:nowrap; }
.uml-actions > a:hover{ color:#ffffff !important; }
.uml-actions > a[href="#contact"]{
  background:#ffffff; color:var(--uml-blue) !important;
  padding:0 18px; height:38px; line-height:38px; border-radius:999px;
  box-shadow:0 6px 16px rgba(8,18,46,.28); transition:all .2s ease;
}
.uml-actions > a[href="#contact"]:hover{ background:#eaf0ff; color:var(--uml-blue) !important; transform:translateY(-1px); box-shadow:0 10px 22px rgba(8,18,46,.34); }
#header.is-stuck .uml-actions > a[href="#contact"]{ height:34px; line-height:34px; }

/* 다크모드 토글 버튼 (JS 주입) */
#uml-theme-toggle{
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; margin-left:14px; border:none; cursor:pointer;
  border-radius:999px; background:rgba(255,255,255,.16); color:#fff;
  font-size:16px; vertical-align:middle; transition:background .2s ease, color .2s ease, transform .2s ease;
}
#uml-theme-toggle:hover{ background:rgba(255,255,255,.28); color:#fff; transform:translateY(-1px); }

/* ============================================================
   다크모드  (html.uml-dark)
   ============================================================ */
html.uml-dark{ --uml-ink:#e6e9f2; }
html.uml-dark, html.uml-dark body, html.uml-dark .body-inner, html.uml-dark #wrapper{
  background:#0e1320 !important; color:#cdd3e0 !important;
}
html.uml-dark #header .header-inner, html.uml-dark #header #header-wrap{
  background:rgba(15,20,33,.78) !important; border-bottom-color:rgba(255,255,255,.08);
}
html.uml-dark #header.is-stuck .header-inner, html.uml-dark #header.is-stuck #header-wrap{
  background:rgba(15,20,33,.92) !important; box-shadow:0 6px 28px rgba(0,0,0,.5);
}
html.uml-dark #mainMenu nav > ul > li > a{ color:#e6e9f2 !important; }
html.uml-dark #mainMenu nav > ul > li:hover > a{ color:#90b4ff !important; }
html.uml-dark #mainMenu nav > ul > li > a::after{ background:#90b4ff; }
html.uml-dark #mainMenu nav > ul > li .dropdown-menu{ background:#161d2e !important; box-shadow:0 18px 48px rgba(0,0,0,.55) !important; }
html.uml-dark #mainMenu nav > ul > li .dropdown-menu > li > a{ color:#c5ccdb !important; }
html.uml-dark #mainMenu nav > ul > li .dropdown-menu > li > a:hover{ background:rgba(144,180,255,.14) !important; color:#bcd3ff !important; }
html.uml-dark .uml-actions > a{ color:#aab2c2 !important; }
html.uml-dark .uml-actions > a:hover{ color:#bcd3ff !important; }
html.uml-dark #uml-theme-toggle{ background:rgba(255,255,255,.08); color:#e6e9f2; }

/* 본문 표면 — 흰 배경/밝은 텍스트 인라인 스타일까지 강제 오버라이드 */
html.uml-dark section, html.uml-dark .section, html.uml-dark .container,
html.uml-dark .row, html.uml-dark .col-md-12, html.uml-dark article{ background-color:transparent !important; }
html.uml-dark [style*="background:#fff"], html.uml-dark [style*="background: #fff"],
html.uml-dark [style*="background:#ffffff"], html.uml-dark [style*="background: #ffffff"],
html.uml-dark [style*="background-color:#fff"], html.uml-dark [style*="background-color: #fff"],
html.uml-dark [style*="background:#FFF"], html.uml-dark [style*="background-color:#FFFFFF"],
html.uml-dark .bg-light, html.uml-dark .bg-white{
  background-color:#141b2b !important; background-image:none !important;
}
/* 어두운 인라인 텍스트색 → 밝게 */
html.uml-dark [style*="color:#000"], html.uml-dark [style*="color: #000"],
html.uml-dark [style*="color:#111"], html.uml-dark [style*="color:#222"],
html.uml-dark [style*="color:#333"], html.uml-dark [style*="color: #333"],
html.uml-dark [style*="color:#444"], html.uml-dark [style*="color:#555"],
html.uml-dark h1, html.uml-dark h2, html.uml-dark h3, html.uml-dark h4, html.uml-dark h5, html.uml-dark p, html.uml-dark li, html.uml-dark td, html.uml-dark span, html.uml-dark div{
  color:#cdd3e0 !important;
}
/* 단, 밝은 배경 위 의도적 흰 텍스트(히어로/CTA 등)는 유지 */
html.uml-dark [style*="color:#fff"], html.uml-dark [style*="color: #fff"],
html.uml-dark [style*="color:#ffffff"], html.uml-dark .text-light, html.uml-dark .text-white{ color:#ffffff !important; }
/* 카드/보더/인풋 */
html.uml-dark .panel, html.uml-dark .card, html.uml-dark .well, html.uml-dark .thumbnail,
html.uml-dark .board_list, html.uml-dark table{ background-color:#141b2b !important; border-color:rgba(255,255,255,.08) !important; }
html.uml-dark input, html.uml-dark textarea, html.uml-dark select{
  background:#10172a !important; color:#e6e9f2 !important; border-color:rgba(255,255,255,.12) !important;
}
html.uml-dark img{ filter:brightness(.92); }
html.uml-dark a{ color:#9db8ff; }

/* 부드러운 테마 전환 */
body, .body-inner, #header .header-inner, section, .dropdown-menu, .panel, .card{ transition:background-color .3s ease, color .3s ease, border-color .3s ease; }

/* ---------- 모바일 ---------- */
@media (max-width:991px){
  #header #logo a > img{ width:44px !important; }
  #mainMenu > a[href="#contact"]{ height:34px; line-height:34px; }
}
