:root { --brand: #0f4c81; }
* { -webkit-tap-highlight-color: transparent; }
body { font-family: -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Yu Gothic UI", "Meiryo", sans-serif; }

/* ステップバー */
.step-dot { transition: all .2s; }

/* タップ操作のボタン */
.tap-btn { transition: transform .1s, background-color .15s; }
.tap-btn:active { transform: scale(0.96); }

/* トースト */
.toast { animation: slideIn .25s ease; }
@keyframes slideIn { from { opacity: 0; transform: translateX(20px); } to { opacity: 1; transform: translateX(0); } }

/* モーダル */
.modal-enter { animation: fadeUp .2s ease; }
@keyframes fadeUp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

/* スクロールバー */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }

/* 下部ナビ用余白 (モバイル) */
.has-bottom-nav { padding-bottom: 72px; }

/* バッジ点滅 */
.pulse-dot { animation: pulse 2s infinite; }
@keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: .4; } }

/* カレンダーセル */
.cal-cell {
  min-height: 58px;
  border-right: 1px solid #f1f5f9;
  border-bottom: 1px solid #f1f5f9;
  padding: 4px 3px 3px;
  display: flex;
  flex-direction: column;
  align-items: center;
  transition: background-color .15s;
}
.cal-cell:nth-child(7n) { border-right: none; }
@media (min-width: 640px) {
  .cal-cell { min-height: 72px; }
}

/* ============================================================
   モバイル入力最適化（営業担当者向け）
   ============================================================ */
/* iOSのフォーカス時自動ズームを防ぐ：入力欄は最低16pxを保証 */
@media (max-width: 640px) {
  input[type="text"], input[type="number"], input[type="date"],
  input[type="email"], input[type="password"], input[type="search"],
  input[type="tel"], select, textarea {
    font-size: 16px !important;
  }
}

/* 入力欄のタップ快適化：高さ確保＋角丸＋フォーカス強調 */
.field-input {
  -webkit-appearance: none;
  appearance: none;
}
.field-input:focus {
  outline: none;
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(15, 76, 129, .12);
}

/* チップ/プリセットボタンのタップ領域確保 */
.chip-btn {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  transition: all .12s;
}
.chip-btn:active { transform: scale(0.94); }
.chip-btn.is-active {
  background-color: var(--brand);
  color: #fff;
}

/* iOS 日付入力の見た目を他の入力欄に揃える */
input[type="date"] {
  -webkit-appearance: none;
  appearance: none;
  min-height: 46px;
}
input[type="date"]::-webkit-date-and-time-value { text-align: left; }

/* 送信ボタンを画面下部に固定しやすく（モバイルフォーム） */
.sticky-submit {
  position: sticky;
  bottom: 76px;
  z-index: 10;
}

/* レンジスライダーのつまみを大きく（タップしやすく） */
input[type="range"] { height: 28px; }
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 26px; height: 26px;
  border-radius: 50%;
  background: var(--brand);
  cursor: pointer;
  box-shadow: 0 1px 4px rgba(0,0,0,.25);
}
input[type="range"]::-moz-range-thumb {
  width: 26px; height: 26px;
  border: none; border-radius: 50%;
  background: var(--brand);
}
