/* ============================================================
   유니마인드랩 — 모던 헤더 + 다크모드 오버레이 (정적 포팅 위에 덧입힘)
   레거시 Polo 테마 마크업은 그대로 두고 시각만 현대화한다.
   브랜드 네이비: #16307a / 라이트 네이비 틴트
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Jua&display=swap');
: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{ min-width:0 !important; }   /* 레거시 min-width:150px 제거(메뉴 벌어짐 방지) */
#mainMenu nav > ul > li > a{
  font-family:'Jua','Noto Sans KR',sans-serif !important;   /* GNB도 주아체 */
  font-weight:400 !important;
  font-size:17px !important;
  letter-spacing:.01em !important;
  color:rgba(255,255,255,.95) !important;
  padding:0 22px !important;
  position:relative;
  transition:color .2s ease;
}
#mainMenu nav > ul > li > a::after{
  content:""; position:absolute; left:14px; right:14px; bottom:50%; margin-bottom:-15px; 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,
#mainMenu nav > ul > li.active > a::after{ transform:scaleX(1); }   /* 현재 페이지: 밑줄 고정 */

/* 드롭다운 — 투명→솔리드 카드 */
/* 드롭다운: li 기준 절대배치 + 갭 제거(hover 끊김 방지) */
/* li가 ul높이(200px)로 stretch되면 top:100%가 헤더 아래로 떨어짐 → center로 li를 콘텐츠높이로 */
#mainMenu nav > ul{ align-items:center !important; }
#mainMenu nav > ul > li{ position:relative !important; }
#mainMenu nav > ul > li .dropdown-menu{
  position:absolute !important; top:100% !important; left:50% !important; right:auto !important;
  background:linear-gradient(180deg, var(--uml-blue) 0%, var(--uml-blue-2) 100%) !important;
  border-radius:12px !important;
  border:1.5px solid rgba(255,255,255,.6) !important;   /* 어두운/파란 배경 구분용 흰 테두리 */
  box-shadow:0 16px 40px rgba(8,18,46,.5) !important;
  padding:6px !important;
  margin-top:0 !important;
  min-width:170px; width:max-content;
  line-height:normal !important;            /* 헤더 line-height(90px) 상속 제거 */
  opacity:0; transform:translateX(-50%) translateY(6px); pointer-events:none;
  transition:opacity .2s ease, transform .2s ease;
}
/* 항목 간격 정상화(상속된 큰 line-height 제거) */
#mainMenu nav > ul > li .dropdown-menu li{ line-height:normal !important; margin:0 !important; padding:0 !important; height:auto !important; display:block !important; }
/* 메뉴↔드롭다운 사이 투명 브리지(마우스 내려도 hover 유지) */
#mainMenu nav > ul > li .dropdown-menu::before{ content:""; position:absolute; left:0; right:0; top:-14px; height:16px; }
#mainMenu nav > ul > li:hover .dropdown-menu{ opacity:1; transform:translateX(-50%) translateY(0); pointer-events:auto; }
#mainMenu nav > ul > li .dropdown-menu > li > a{
  display:block !important; color:rgba(255,255,255,.92) !important; font-weight:500 !important; font-size:14px !important;
  border-radius:8px; padding:8px 16px !important; line-height:1.35 !important; white-space:nowrap;
  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; }
  #header #mainMenu nav > ul{ display:flex !important; align-items:center !important; height:var(--uml-head-h) !important; }
  /* li 높이를 헤더높이로 고정 → 드롭다운 top:100%가 헤더 바로 아래에 붙음(갭 제거) */
  #header #mainMenu nav > ul > li{ display:flex !important; align-items:center !important; height:var(--uml-head-h) !important; align-self:center !important; }
  /* 메뉴 링크를 헤더 전체 높이로 → 드롭다운이 헤더 바로 아래에서 끊김없이 */
  #header #mainMenu nav > ul > li > a{ display:flex !important; align-items:center !important; height:var(--uml-head-h) !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{
  position:relative; display:inline-flex; align-items:center;
  width:60px; height:30px; margin-left:14px; padding:0; border:none; cursor:pointer;
  border-radius:999px; background:rgba(255,255,255,.20);
  vertical-align:middle; transition:background .25s ease;
  -webkit-tap-highlight-color:transparent;
}
#uml-theme-toggle:hover{ background:rgba(255,255,255,.30); }
#uml-theme-toggle .uml-knob{
  position:absolute; top:3px; left:3px; width:24px; height:24px;
  display:flex; align-items:center; justify-content:center;
  border-radius:50%; background:#fff; font-size:13px; line-height:1;
  box-shadow:0 2px 6px rgba(8,18,46,.35);
  transition:transform .28s cubic-bezier(.34,1.4,.5,1);
}
#uml-theme-toggle[data-theme="dark"]{ background:rgba(8,16,38,.6); }
#uml-theme-toggle[data-theme="dark"] .uml-knob{ transform:translateX(30px); }

/* 언어 토글 KO/EN (JS 주입) */
.uml-lang{ display:inline-flex; align-items:center; margin-left:12px; border-radius:999px; overflow:hidden; border:1px solid rgba(255,255,255,.45); vertical-align:middle; }
.uml-lang button{ border:none; background:transparent; color:rgba(255,255,255,.82); font-size:12px; font-weight:700; padding:5px 10px; cursor:pointer; line-height:1; transition:background .2s ease, color .2s ease; }
.uml-lang button.active{ background:#fff; color:var(--uml-blue); }
.uml-lang button:not(.active):hover{ color:#fff; }
html.uml-dark .uml-lang{ border-color:rgba(255,255,255,.25); }
/* Google 자동번역 위젯 UI 숨김(상단 배너/툴팁) — 토글은 우리 KO/EN 사용 */
.goog-te-banner-frame, .goog-te-balloon-frame, #goog-gt-tt, .skiptranslate iframe{ display:none !important; }
body{ top:0 !important; position:static !important; }
.goog-text-highlight{ background:none !important; box-shadow:none !important; }
#uml-gte, .goog-te-gadget{ display:none !important; }
font[style]{ background:none !important; box-shadow:none !important; }

/* ============================================================
   다크모드  (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; }
}

/* ===== 배민 주아체(Google Fonts 'Jua') — 제목 디스플레이 폰트(둥근 끝, 로고와 통일) =====
   ※ jsdelivr BMJUA가 404라 Google Fonts Jua(=배민 주아체)로 교체. @import는 modern.css 최상단에 있음. */
h1, h2, h3,
.heading-text h1, .heading-text h2, .heading-section h1,
.center_title,
.uml-card .title, .uml-detail .dhd h2, .uml-rss-card .rt,
.uml-board h1, .thumb_area + * h1,
.search-title{
  font-family:'Jua','Noto Sans KR',sans-serif !important;
  letter-spacing:.01em;
}
/* 상단 로그인 버튼 제거(공개 회원 없음) */
.uml-actions > a[href*="Login"], .uml-actions > a[href*="login"]{ display:none !important; }

/* ===== 푸터 링크 가독성(어두운 배경에서 밝게) ===== */
#footer a, footer.inverted a, #footer .footer-content a{ color:rgba(255,255,255,.74) !important; transition:color .15s ease; }
#footer a:hover, footer.inverted a:hover, #footer .footer-content a:hover{ color:#fff !important; }
#footer h3, #footer h4, #footer strong, #footer .widget-title{ color:#fff !important; }