/* ISG2 모바일/터치 최적화 — gas-version/index.html 안 건드리고 /app 응답에 inject.
   원본 데스크탑 동작은 그대로, 모바일 폭에서만 override.
*/

/* iOS Safari 안전영역(노치) 고려 */
@supports (padding: env(safe-area-inset-top)) {
  body {
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
    box-sizing: border-box;
  }
}

/* ── 좁은 화면(폰 portrait + 작은 태블릿) — 768px 이하 ──────────────────── */
@media (max-width: 768px) {
  /* body flex 가로배치 깨고 자유 흐름 */
  body { display: block !important; overflow: auto !important; min-height: 100vh; }

  /* 사이드바 — 기본 접힘, 펼치면 본문 위로 오버레이 */
  .sidebar {
    position: fixed !important;
    top: 0; left: 0; bottom: 0;
    width: 78vw !important;
    max-width: 320px;
    margin-left: -100vw !important;
    transition: margin-left 0.25s ease !important;
    z-index: 1080 !important;
    box-shadow: 4px 0 24px rgba(0,0,0,0.35);
  }
  .sidebar:not(.collapsed) { margin-left: 0 !important; }
  .sidebar.collapsed       { margin-left: -100vw !important; }

  /* 사이드바 펼친 동안 본문 어둡게 */
  body:has(.sidebar:not(.collapsed))::before {
    content: '';
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.45);
    z-index: 1070;
    animation: ai-sidebar-fade 0.2s ease;
  }
  @keyframes ai-sidebar-fade { from { opacity: 0; } to { opacity: 1; } }

  /* 사이드바 토글 — 모바일에선 항상 좌상단 */
  #sidebar-toggle {
    top: max(8px, env(safe-area-inset-top, 0)) !important;
    left: 8px !important;
    width: 44px !important;
    height: 44px !important;
    z-index: 1090 !important;
  }
  .sidebar.collapsed ~ #sidebar-toggle,
  .sidebar:not(.collapsed) ~ #sidebar-toggle { left: auto !important; right: 12px !important; }

  /* 상단 알림/다크모드 버튼 — 토글과 겹치지 않게 우측으로 */
  #top-bar { top: max(6px, env(safe-area-inset-top, 0)) !important; right: 60px !important; }
  #top-bar button { width: 40px !important; height: 40px !important; }

  /* 메인 콘텐츠 — 패딩 줄이고 가로 스크롤 차단 */
  .main-content {
    padding: 60px 12px 24px 12px !important;
    height: auto !important;
    min-height: 100vh;
    overflow-y: visible !important;
    overflow-x: hidden !important;
  }

  /* 카드 패딩 축소 */
  .card-body  { padding: 0.9rem 1rem !important; }
  .card-header { padding: 0.7rem 1rem !important; font-size: 0.95rem; }

  /* 표 — 가로 스크롤 wrapper (Bootstrap table-responsive 미사용 영역 대비) */
  .main-content table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    max-width: 100vw;
  }
  .main-content table thead, .main-content table tbody { white-space: nowrap; }

  /* 모달 — 풀스크린에 가깝게 */
  .modal-dialog {
    margin: 0.5rem !important;
    max-width: calc(100vw - 1rem) !important;
  }
  .modal-content { border-radius: 14px !important; }
  .modal-body { padding: 1rem !important; }

  /* 검색창/입력 — 폰 줌 차단 (16px 미만이면 iOS Safari 가 자동 줌) */
  input, select, textarea, .form-control, .form-select {
    font-size: 16px !important;
  }

  /* AI 챗봇 floating 버튼 — 우하단 안전영역 고려 */
  #ai-chat-btn {
    right: max(14px, env(safe-area-inset-right, 14px)) !important;
    bottom: max(18px, env(safe-area-inset-bottom, 18px)) !important;
  }
  #ai-chat-panel {
    width: calc(100vw - 16px) !important;
    height: 75vh !important;
    right: 8px !important;
    bottom: 12px !important;
    border-radius: 16px !important;
  }

  /* Gantt / wide chart 컨테이너 가로 스크롤 */
  .gantt-container, .chart-wrap, [data-wide] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* rich-text 에디터 폰트 작게 잡혀있던 거 보정 */
  .rich-text-toolbar { flex-wrap: wrap !important; }
  .rich-text-editable { min-height: 160px !important; }
}

/* ── 아주 좁은 화면 (480px 이하) ──────────────────────────────────────── */
@media (max-width: 480px) {
  .main-content { padding: 58px 8px 18px 8px !important; }
  .card-body  { padding: 0.7rem 0.8rem !important; }
  h1, h2, h3, h4 { font-size: 1.05rem !important; }
  .btn { padding: 0.4rem 0.7rem !important; font-size: 0.9rem !important; }
}

/* ── 모바일에서 사이드바 메뉴 항목 클릭 시 자동 닫힘 (JS 없이 :target trick 안되므로 onclick 으로) ── */
/* 메뉴 클릭 후 사이드바 자동 접힘은 inject 한 JS 가 처리 — mobile_polish.js (옵션) */

/* ── 데스크탑(>=769px) — 원본 동작 보존 ───────────────────────────────── */