/* responsive.css — スマホ縦横の見やすさ底上げ（全ページ共通）
 * 方針: 小画面(スマホ)にだけ効く控えめな上書きで、既存デザインを壊さない。
 *       幅広の表は responsive.js が .rtable で横スクロール化。
 */

/* iOS のフォーカス時オートズーム防止（入力欄のみ16px）＝画面が飛ばず入力しやすい */
@media (max-width: 760px) {
  input:not([type=checkbox]):not([type=radio]):not([type=range]),
  select, textarea { font-size: 16px !important; }
}

/* 幅広の表を横スクロール可能に（responsive.js が付与） */
.rtable { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }
.rtable > table { min-width: max-content; }

/* 横スクロールのヒント（表の上に小さく） */
.rscroll-hint { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #5b6672;
  background: #eef4fb; border: 1px solid #d4e2f2; border-radius: 8px; padding: 5px 10px; margin: 6px 0; }
.rscroll-hint b { color: #0f4c81; }

/* 縦画面で幅広の表がある時だけ出る「横向き推奨」バー */
#rotateHint { position: fixed; left: 0; right: 0; bottom: 0; z-index: 99998; background: #0f4c81; color: #fff;
  font-size: 12.5px; padding: 9px 14px; display: none; align-items: center; gap: 10px;
  box-shadow: 0 -3px 12px rgba(0,0,0,.22); padding-bottom: calc(9px + env(safe-area-inset-bottom, 0px)); }
#rotateHint.on { display: flex; }
#rotateHint .x { margin-left: auto; background: rgba(255,255,255,.22); border: 0; color: #fff; border-radius: 14px;
  padding: 5px 12px; font-weight: 700; cursor: pointer; }

/* 小画面: モーダル/カードを画面幅にフィット（はみ出し防止） */
@media (max-width: 640px) {
  .md, .mo > .md, .sheet, .mo, .dinfo, .modal .box, .vtcard { max-width: 96vw !important; }
}

/* 小画面: ツールバー系は折り返して縦に積む（ボタンが画面外に消えない） */
@media (max-width: 640px) {
  .bar, .top, .toolbar, .ctl { flex-wrap: wrap !important; }
}

/* ===== 2026-09-02 使いやすさ改善（タッチ端末のみ pointer:coarse＝PCは不変） ===== */
/* フォーム入力は16px以上に（iOS Safariのフォーカス時 自動ズーム防止）。密集表のセルは据え置き。 */
@media (pointer:coarse){
  input:not([type=checkbox]):not([type=radio]):not([type=range]), select, textarea { font-size:16px !important; }
  table input, table select, table textarea,
  .sheet input, .sheet select, .xtbl input, .xtbl select,
  .up-matrix input, .up-mtab input, .up-mtab select { font-size:12px !important; }
}
/* 主要ボタンのタップ目標を44px以上に（密集表・カレンダー等の小ボタンは除外） */
@media (pointer:coarse){
  button, .btn, .vs, .tab { min-height:44px; }
  table button, .xtbl button, .sheet button,
  .up-wk, .up-chip, .up-mode, .up-vt, .up-mtab button,
  .msgact, .iconbtn, .expbtn, .kbtn, .ic { min-height:0; }
}
