/* ================================================================
   가온 모바일 공통 보정 (mobile-base.css)
   적용: views/pwa-head.ejs 안에
         <link rel="stylesheet" href="/mobile-base.css">
   한 줄 추가 → 전 화면 일괄 적용 (개별 ejs 수정 불필요)
   ================================================================ */

/* ① iOS 입력 확대 방지 — 16px 미만 입력창 포커스 시 강제 확대되는 문제 */
input[type="text"], input[type="search"], input[type="date"],
input[type="number"], input[type="password"], input:not([type]),
select, textarea {
  font-size: 16px !important;
}

/* 커진 글자에 맞춰 입력창 높이만 소폭 보정 (레이아웃 붕괴 방지) */
input[type="text"], input[type="search"], input[type="date"], select {
  min-height: 36px;
  box-sizing: border-box;
}

/* ② PWA 노치·하단바 안전영역 (홈화면 설치 시 헤더 가림 방지) */
body {
  padding-top: env(safe-area-inset-top);
  padding-bottom: env(safe-area-inset-bottom);
}

/* ③ 탭 대상 최소 높이 살짝 보강 (기준탭·지표탭류) */
.base-tab, .metric-tab, .type, .mt {
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ④ 폼 컨트롤 규격 통일 (2026-09-11) — 화면마다 달랐던 셀렉트 31~38·모서리 4~8·글꼴 12~15 를 하나로
   · 셀렉트·텍스트/날짜 입력: 높이 36 · 모서리 6 · 테두리 #ccd5df · 글꼴 16(iOS 확대 방지, 위 ①과 동일)
   · 버튼: 모서리 6 · 글꼴 하한 13. 높이는 화면 의도(큰 터치 버튼·헤더 소형 버튼)를 존중해 강제하지 않음 */
select, input[type="text"], input[type="search"], input[type="date"], input[type="number"] {
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 10px !important;
  border: 1px solid #ccd5df !important;
  border-radius: 6px !important;
  background-color: #fff;
  color: #333;
  box-sizing: border-box;
}
select:focus, input:focus { outline: none; border-color: #336699 !important; box-shadow: 0 0 0 2px rgba(51,102,153,.15); }
button, .btn { border-radius: 6px !important; font-size: max(13px, 1em); }
button { line-height: 1.2; }

/* ⑤ 날짜 입력칸 보정 (2026-10-14) — 설치 앱(안드로이드 크롬 독립 실행)은 빈 날짜칸에 "연도. 월. 일." 안내를 그리며
   그 글자 폭만큼 칸을 넓혀, ④의 16px·여백 10px 과 합쳐지면 한 줄(시작일·종료일·버튼)을 넘어 화면 밖으로 나감.
   날짜칸은 네이티브 선택기가 떠서 iOS 확대 문제가 없으므로 14px 로 낮추고, 여백을 줄이며, 폭을 가용 폭 안으로 제한 */
input[type="date"] {
  font-size: 14px !important;
  padding: 0 6px !important;
  min-width: 0 !important;
  max-width: 100%;
  width: auto;
  flex: 1 1 0;
  -webkit-appearance: none; appearance: none;
}
input[type="date"]::-webkit-date-and-time-value { text-align: left; }
input[type="date"]::-webkit-calendar-picker-indicator { padding: 0; margin-left: 2px; }
