/* ============================================================
   v1.3.26 — UI layout stability / scale-control bug fix
   디자인·배치 전용 오버레이. 업무 로직/API/DB/FIFO/예측/권한은 변경하지 않는다.
   - v1.3.25 PC 본문 이중 오프셋(left + margin-left) 제거
   - 크기 조절 UI를 상단바를 밀어내지 않는 팝오버로 변경
   - 큰 글자/큰 메뉴에서도 세부 설정창이 다른 메뉴 아래로 잘리지 않게 함
   - 모바일에서는 저장된 PC 본문 확대값을 강제로 적용하지 않음
   ============================================================ */
:root{ --fh26-sidebar:186px; }

html:not([data-theme="dark"]) body{
  font-family:"IBM Plex Sans KR","Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",sans-serif!important;
}

@media(min-width:960px){
  /* 레이아웃 기준은 한 번만 적용한다. 사이드바는 상단바 아래, 본문은 그 오른쪽. */
  body .topbar.topbar-v119{
    left:0!important;
    right:0!important;
    width:100%!important;
    margin-left:0!important;
    overflow:visible!important;
    z-index:1000!important;
  }
  body .sidebar-nav{
    width:var(--fh26-sidebar)!important;
  }
  html:not([data-theme="dark"]) body #mainContent{
    left:var(--fh26-sidebar)!important;
    right:0!important;
    width:auto!important;
    margin-left:0!important;
    max-width:none!important;
    overflow-x:auto!important;
  }

  /* v1.0.49의 overflow-x:auto가 드롭다운/세부창을 잘라내던 문제를 최종 우선순위에서 해제한다. */
  body .topbar .top-actions{
    overflow:visible!important;
    min-width:0!important;
    position:relative!important;
  }
  body .topbar .ui-setting-cluster{
    position:relative!important;
    overflow:visible!important;
    flex:0 0 auto!important;
    gap:4px!important;
  }

  /* 화면 크기 조절은 상단 공간을 계속 넓히는 방식이 아니라, 버튼 1개 + 떠 있는 패널 방식. */
  body .ui-scale-popover{
    position:relative!important;
    flex:0 0 auto!important;
  }
  body .ui-scale-popover>summary{
    list-style:none!important;
    cursor:pointer!important;
    min-height:calc(var(--v119-topbar,44px) - 10px)!important;
    display:inline-flex!important;
    align-items:center!important;
    gap:6px!important;
    padding:0 9px!important;
    border:1px solid #d8e5f1!important;
    border-radius:9px!important;
    background:#fff!important;
    color:#355d83!important;
    white-space:nowrap!important;
    box-shadow:0 1px 3px rgba(35,74,111,.035)!important;
    font-size:max(11px,calc(var(--ui119-topbar-font,14px) - 2px))!important;
    font-weight:900!important;
    box-sizing:border-box!important;
  }
  body .ui-scale-popover>summary::-webkit-details-marker{display:none!important}
  body .ui-scale-popover>summary::after{content:"▾";font-size:10px;color:#7190ad!important}
  body .ui-scale-popover[open]>summary{background:#edf6ff!important;border-color:#b9d6ef!important;color:#176ac7!important}
  body .ui-scale-popover[open]>summary::after{content:"▴"}
  body .ui-scale-popover>summary strong{
    color:#176ac7!important;
    font-size:inherit!important;
    font-weight:950!important;
  }
  body .ui-scale-popover-panel{
    position:fixed!important;
    top:calc(var(--v119-topbar,44px) + 8px)!important;
    right:12px!important;
    z-index:5000!important;
    width:min(360px,calc(100vw - 24px))!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    padding:12px!important;
    border:1px solid #cad9e8!important;
    border-radius:12px!important;
    background:#fff!important;
    box-shadow:0 16px 36px rgba(22,57,92,.24)!important;
    box-sizing:border-box!important;
    white-space:normal!important;
  }
  body .ui-scale-popover:not([open])>.ui-scale-popover-panel{display:none!important}
  body .ui-scale-popover-panel>.ui-scale-main,
  body .ui-scale-popover-panel>.ui-scale-body{
    height:auto!important;
    min-height:64px!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    align-content:start!important;
    gap:5px!important;
    padding:8px!important;
    border:1px solid #e0e9f2!important;
    border-radius:9px!important;
    background:#f8fbfe!important;
  }
  body .ui-scale-popover-panel>.ui-scale-main>span,
  body .ui-scale-popover-panel>.ui-scale-body>span{
    display:block!important;
    color:#526d87!important;
    font-size:11px!important;
    font-weight:900!important;
  }
  body .ui-scale-popover-panel>.ui-scale-main select,
  body .ui-scale-popover-panel>.ui-scale-body select{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:34px!important;
    min-height:34px!important;
    padding:0 28px 0 9px!important;
    border:1px solid #cbd9e6!important;
    border-radius:7px!important;
    background:#fff!important;
    color:#173b5d!important;
    font-size:12px!important;
    font-weight:850!important;
  }
  body .ui-scale-popover-panel .ui-setting-detail{
    grid-column:1/-1!important;
    position:static!important;
    width:auto!important;
  }
  body .ui-scale-popover-panel .ui-setting-detail>summary{
    height:36px!important;
    min-height:36px!important;
    padding:0 10px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    border:1px solid #dce7f0!important;
    border-radius:8px!important;
    background:#f6f9fc!important;
    color:#486681!important;
    font-size:11px!important;
    font-weight:900!important;
    box-sizing:border-box!important;
  }
  body .ui-scale-popover-panel .ui-setting-detail>summary::after{content:"＋";color:#7890a8}
  body .ui-scale-popover-panel .ui-setting-detail[open]>summary::after{content:"－"}
  body .ui-scale-popover-panel .ui-setting-detail-grid{
    position:static!important;
    width:auto!important;
    margin-top:7px!important;
    padding:9px!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
    border:1px solid #e0e8f0!important;
    border-radius:8px!important;
    background:#fbfdff!important;
    box-shadow:none!important;
  }
  body .ui-scale-popover-panel .ui-setting-detail-grid label{
    height:auto!important;
    min-height:0!important;
    display:grid!important;
    gap:4px!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
  }
  body .ui-scale-popover-panel .ui-setting-detail-grid input{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:32px!important;
    min-height:32px!important;
    box-sizing:border-box!important;
  }

}

/* 큰 글씨에서 상단바가 다시 붐비지 않도록 부가 기능부터 단계적으로 정리한다. */
@media(min-width:960px) and (max-width:1480px){
  body .topbar-brand-v119{min-width:170px!important;max-width:205px!important}
}
@media(min-width:960px) and (max-width:1200px){
  body .topbar #versionChip,
  body .topbar #briefThemeToggle{display:none!important}
  body .topbar-brand-v119 small{display:none!important}
}
@media(min-width:960px) and (max-width:1060px){
  body .topbar #navForward{display:none!important}
  body .topbar-brand-v119{min-width:150px!important;max-width:170px!important}
}

/* 모바일은 PC에서 저장한 125~145% 본문 확대를 그대로 물려받지 않는다. */
@media(max-width:959px){
  body #mainContent>*{zoom:1!important}
}

/* 다크모드에서도 크기 팝오버의 가독성과 레이어 안정성은 동일하게 보장. */
html[data-theme="dark"] .ui-scale-popover>summary{
  background:#173653!important;border-color:#365672!important;color:#eef6ff!important;
}
html[data-theme="dark"] .ui-scale-popover>summary strong{color:#8bc2ff!important}
html[data-theme="dark"] .ui-scale-popover-panel{
  background:#102a43!important;border-color:#35536d!important;color:#edf5fc!important;
}
html[data-theme="dark"] .ui-scale-popover-panel>.ui-scale-main,
html[data-theme="dark"] .ui-scale-popover-panel>.ui-scale-body,
html[data-theme="dark"] .ui-scale-popover-panel .ui-setting-detail-grid{
  background:#15324d!important;border-color:#36536c!important;
}
html[data-theme="dark"] .ui-scale-popover-panel>.ui-scale-main>span,
html[data-theme="dark"] .ui-scale-popover-panel>.ui-scale-body>span,
html[data-theme="dark"] .ui-scale-popover-panel .ui-setting-detail-grid label>span{color:#c9d9e8!important}

/* ============================================================
   v1.3.27 안정화 — 상단 주요 버튼 대비 / 자료상태 카드
   ============================================================ */
@media(min-width:960px){
  html:not([data-theme="dark"]) body .topbar #notificationButton,
  html:not([data-theme="dark"]) body .topbar #globalSearchButton,
  html:not([data-theme="dark"]) body .topbar .app-install-button,
  html:not([data-theme="dark"]) body .topbar #passwordButton,
  html:not([data-theme="dark"]) body .topbar #logoutButton{
    min-height:32px!important;
    padding:0 9px!important;
    border:1px solid #c8d8e7!important;
    border-radius:8px!important;
    background:#fff!important;
    color:#183c5d!important;
    box-shadow:0 1px 2px rgba(23,59,93,.05)!important;
  }
  html:not([data-theme="dark"]) body .topbar #notificationButton:hover,
  html:not([data-theme="dark"]) body .topbar #globalSearchButton:hover,
  html:not([data-theme="dark"]) body .topbar .app-install-button:hover,
  html:not([data-theme="dark"]) body .topbar #passwordButton:hover,
  html:not([data-theme="dark"]) body .topbar #logoutButton:hover{
    background:#edf6ff!important;
    border-color:#9fc5e8!important;
    color:#0c5eaa!important;
  }
  html:not([data-theme="dark"]) body .topbar #notificationButton:focus-visible,
  html:not([data-theme="dark"]) body .topbar #globalSearchButton:focus-visible,
  html:not([data-theme="dark"]) body .topbar .app-install-button:focus-visible,
  html:not([data-theme="dark"]) body .topbar #passwordButton:focus-visible,
  html:not([data-theme="dark"]) body .topbar #logoutButton:focus-visible{
    outline:3px solid rgba(21,112,205,.28)!important;
    outline-offset:2px!important;
  }
  html[data-theme="dark"] body .topbar #notificationButton,
  html[data-theme="dark"] body .topbar #globalSearchButton,
  html[data-theme="dark"] body .topbar .app-install-button,
  html[data-theme="dark"] body .topbar #passwordButton,
  html[data-theme="dark"] body .topbar #logoutButton{
    min-height:32px!important;
    padding:0 9px!important;
    border:1px solid #42617d!important;
    border-radius:8px!important;
    background:#173653!important;
    color:#eef6ff!important;
  }
  html[data-theme="dark"] body .topbar #notificationButton:hover,
  html[data-theme="dark"] body .topbar #globalSearchButton:hover,
  html[data-theme="dark"] body .topbar .app-install-button:hover,
  html[data-theme="dark"] body .topbar #passwordButton:hover,
  html[data-theme="dark"] body .topbar #logoutButton:hover{
    background:#244966!important;
    border-color:#6b8dab!important;
  }
  html[data-theme="dark"] body .topbar #notificationButton:focus-visible,
  html[data-theme="dark"] body .topbar #globalSearchButton:focus-visible,
  html[data-theme="dark"] body .topbar .app-install-button:focus-visible,
  html[data-theme="dark"] body .topbar #passwordButton:focus-visible,
  html[data-theme="dark"] body .topbar #logoutButton:focus-visible{
    outline:3px solid rgba(139,194,255,.32)!important;
    outline-offset:2px!important;
  }
}

.v1327-data-states{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.v1327-data-state{min-height:86px!important;display:grid!important;grid-template-columns:auto 1fr!important;align-content:center!important;gap:3px 8px!important;padding:10px 12px!important;text-align:left!important;border:1px solid #dbe5ee!important;border-radius:10px!important;background:#f8fbfd!important;color:#193b59!important}
.v1327-data-state b{font-size:12px!important;color:#60788e!important}
.v1327-data-state span{justify-self:end;font-size:13px!important;font-weight:900!important}
.v1327-data-state small{grid-column:1/-1;color:#6a7f91!important;font-size:11px!important;line-height:1.35!important}
.v1327-data-state.ok{border-color:#bcdcca!important;background:#f4fbf7!important}
.v1327-data-state.warn{border-color:#efd49a!important;background:#fffaf0!important}
.v1327-data-state.bad{border-color:#efb7b2!important;background:#fff6f5!important}
html[data-theme="dark"] .v1327-data-state{border-color:#36536c!important;background:#15324d!important;color:#eef6ff!important}
html[data-theme="dark"] .v1327-data-state b,html[data-theme="dark"] .v1327-data-state small{color:#b8ccdd!important}
@media(max-width:959px){.v1327-data-states{grid-template-columns:1fr}}
