/* boatbook 共通の追加スタイル (FishOn charter-admin.css と charter-pages.css の上書き) */

/* iOS フォントズーム抑制(charter-admin.css 既定値踏襲) */
body.ca-body { background:#e8f2f9; min-height:100vh; }

/* ============================================================
   フォントサイズ切替 (中=デフォルト / 大)
   common.js が html[data-font-size] を切り替えます.
   ============================================================ */
html[data-font-size="large"] body { font-size: 16px; }
html[data-font-size="large"] input,
html[data-font-size="large"] select,
html[data-font-size="large"] textarea { font-size: 16px; }

/* ヘッダー */
html[data-font-size="large"] .ca-header__title { font-size: 18px; }
html[data-font-size="large"] .ca-header__user { font-size: 15px; }

/* ボタン */
html[data-font-size="large"] .ca-btn { font-size: 15px; }
html[data-font-size="large"] .ca-btn--sm { font-size: 14px; }
html[data-font-size="large"] .ca-btn--lg, html[data-font-size="large"] .cp-btn-lg { font-size: 17px; }

/* 予約一覧カード — spec: 名前 16→17px, メタ 13→15px */
html[data-font-size="large"] .cp-list-item__name { font-size: 17px; }
html[data-font-size="large"] .cp-list-item__date { font-size: 15px; }
html[data-font-size="large"] .cp-list-item__meta { font-size: 15px; }

/* 詳細パネル */
html[data-font-size="large"] .cp-detail-row { font-size: 17px; }
html[data-font-size="large"] .cp-detail-row__label { font-size: 16px; }
html[data-font-size="large"] .cp-detail-row__value { font-size: 18px; }
html[data-font-size="large"] .cp-detail-header h3 { font-size: 19px; }

/* タブ */
html[data-font-size="large"] .cp-tab { font-size: 16px; }
html[data-font-size="large"] .ca-tab { font-size: 15px; }

/* フォーム */
html[data-font-size="large"] .cp-form-group label { font-size: 15px; }
html[data-font-size="large"] .ca-form-group label { font-size: 14px; }

/* 検索 */
html[data-font-size="large"] .ca-search-bar input { font-size: 17px; }

/* メニューカード */
html[data-font-size="large"] .ca-menu-card { font-size: 14px; }
html[data-font-size="large"] .ca-menu-card span { font-size: 14px; }

/* 月別詳細 */
html[data-font-size="large"] .sb-booking__name { font-size: 18px; }
html[data-font-size="large"] .sb-booking__meta { font-size: 15px; }
html[data-font-size="large"] .sb-input-row__label { font-size: 14px; }
html[data-font-size="large"] .sb-day__date-md { font-size: 22px; }
html[data-font-size="large"] .sb-day__date-dow { font-size: 16px; }
html[data-font-size="large"] .sb-day__total-row { font-size: 16px; }
html[data-font-size="large"] .day-total-amount { font-size: 18px; }

/* 割り振りレーン */
html[data-font-size="large"] .lane__header { font-size: 15px; }
html[data-font-size="large"] .assign-card__name { font-size: 16px; }
html[data-font-size="large"] .assign-card__meta { font-size: 13px; }

/* 顧客名簿 */
html[data-font-size="large"] .ca-roster-item__name { font-size: 16px; }
html[data-font-size="large"] .ca-roster-item__phone { font-size: 14px; }

/* マスタ */
html[data-font-size="large"] .ca-master-item__name { font-size: 16px; }
html[data-font-size="large"] .ca-master-item__meta { font-size: 14px; }

/* ダッシュボード予約一覧 (ca-schedule-item) */
html[data-font-size="large"] .ca-schedule-item__date { font-size: 20px; }
html[data-font-size="large"] .ca-schedule-badge { font-size: 13px; }
html[data-font-size="large"] .ca-booking-card__name { font-size: 16px; }
html[data-font-size="large"] .ca-booking-card__meta { font-size: 14px; }

/* バッジ — spec: 11-12 → 13px */
html[data-font-size="large"] .cp-badge { font-size: 13px; padding: 3px 10px; }
html[data-font-size="large"] .sb-ship, html[data-font-size="large"] .sb-tag { font-size: 13px; }
html[data-font-size="large"] .ca-badge { font-size: 13px; }

/* トースト */
html[data-font-size="large"] .ca-toast { font-size: 15px; }

/* 確認ダイアログ */
html[data-font-size="large"] .cp-confirm-box h3 { font-size: 18px; }
html[data-font-size="large"] .cp-confirm-msg { font-size: 16px; }

/* ============================================================
   PC 用幅制約レイアウト
   FishOn はモバイルPWA前提なので PC 表示が崩れる。
   タブレット以上で全セクションを 1080px に集約して中央寄せ。
   ============================================================ */
@media (min-width: 768px) {
  .ca-alert-banner,
  .ca-grid-register,
  .ca-menu-grid,
  .ca-schedule-section,
  .cp-container {
    max-width: 1080px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .cp-container { padding: 20px; }

  /* メニューグリッドは PC 1080px だと1カード約160px。OKだが文字を大きめに */
  .ca-menu-card { font-size: 14px; padding: 18px 8px; }
  .ca-menu-card i { font-size: 26px; }

  /* 予約登録パネル：6カラム→デスクトップでは2列×3段の方が読みやすい */
  .reg-form-compact .ca-form-group[style*="span 2"] { grid-column: span 2; }
  .reg-form-compact .ca-form-group[style*="span 3"] { grid-column: span 3; }
  .reg-form-compact .ca-form-group[style*="span 5"] { grid-column: span 5; }
  .reg-form-compact .ca-form-group[style*="span 1"] { grid-column: span 1; }
  .ca-grid-register { padding: 20px; }
  .ca-grid-register .ca-panel__body { padding: 20px 24px; }
  .reg-form-compact .ca-form-group label { font-size: 13px; }
  .reg-form-compact .ca-form-group input,
  .reg-form-compact .ca-form-group select,
  .reg-form-compact .ca-form-group textarea { padding: 8px 12px; font-size: 15px; }

  /* 予約者一覧パネル(=cp-container)を広く */
  .cp-list-item { padding: 16px 20px; }
  .cp-list-item__name { font-size: 16px; }
}

@media (min-width: 1280px) {
  .ca-alert-banner,
  .ca-grid-register,
  .ca-menu-grid,
  .ca-schedule-section,
  .cp-container {
    max-width: 1200px !important;
  }
}

/* assign 画面: 船は常に縦 2 列で並べる (3船以上は2列で折り返し). 未割振は上に全幅。 */
.assign-grid { grid-template-columns: 1fr 1fr !important; }
.assign-grid > .lane--unassigned { grid-column: 1 / -1; }
@media (min-width: 1024px) {
  .assign-grid { max-width: 1200px; margin-left: auto; margin-right: auto; }
}

/* 月別詳細: PC で 2 列にする */
@media (min-width: 1024px) {
  .sb-list { display:grid; grid-template-columns: 1fr 1fr; gap:16px; }
}

/* ヘッダ自体は全幅 (sticky)。ロゴが大きいので高さを少し確保 */
.ca-header { position: sticky; top: 0; z-index: 100; height: 58px; }

/* ヘッダー右側ナビ */
.ca-header__nav {
  display: flex; align-items: center; gap: 10px;
}
.ca-header__user { color: rgba(255,255,255,.85); font-size: 13px; }

/* ヘッダー右側: 船宿名 / ユーザー名 を縦2段 */
.ca-header__user {
  display: flex; flex-direction: column; align-items: flex-end;
  line-height: 1.2; gap: 1px;
}
.ca-user__name { font-size: 14px; font-weight: 700; color: #fff; white-space: nowrap; }
.ca-user__shop { font-size: 11px; color: rgba(255,255,255,.78); white-space: nowrap; }
html[data-font-size="large"] .ca-user__name { font-size: 16px; }
html[data-font-size="large"] .ca-user__shop { font-size: 13px; }

/* ブランドロゴ (BoatBook / 予約管理 を縦2段) */
.ca-brand { display: flex; align-items: center; gap: 10px; min-width: 0; }
.ca-brand__logo { height: 46px; width: auto; display: block; flex-shrink: 0; }
.ca-brand__text { display: flex; flex-direction: column; line-height: 1.15; }
.ca-brand__name { font-size: 17px; font-weight: 700; letter-spacing: .5px; color: #fff; }
.ca-brand__sub { font-size: 11px; font-weight: 600; color: rgba(255,255,255,.78); }
html[data-font-size="large"] .ca-brand__name { font-size: 19px; }
html[data-font-size="large"] .ca-brand__sub { font-size: 13px; }
.ca-back-btn {
  color: #fff; font-size: 18px; padding: 4px 10px; cursor: pointer;
  background: none; border: none; opacity: .85;
}
.ca-back-btn:hover { opacity: 1; }
.ca-btn--header {
  background: rgba(255,255,255,.15); color: #fff;
  border: 1px solid rgba(255,255,255,.4); padding: 4px 10px;
  border-radius: 6px; font-size: 12px; font-weight: 700; cursor: pointer;
  text-decoration: none; display: inline-flex; align-items: center; gap: 4px;
}
.ca-btn--header:hover { background: rgba(255,255,255,.25); }
.ca-btn--gray { background: #e5e7eb; color: #374151; border: none; padding: 8px 14px; border-radius: 6px; font-size: 13px; font-weight: 700; cursor: pointer; }

/* 予約一覧スライドアップ用詳細パネル拡張 */
.cp-detail-overlay { display: none; }
.cp-detail-overlay.is-open { display: flex; }
.cp-confirm-overlay { display: none; }
.cp-confirm-overlay.is-open { display: flex; }
.cp-confirm-box h3 { font-size:16px; font-weight:700; color:#023e6e; margin-bottom:14px; }
.cp-confirm-msg { font-size:14px; color:#1a2e42; margin-bottom:20px; white-space: pre-line; line-height: 1.6; }
.cp-confirm-footer { display:flex; gap:10px; }
.cp-confirm-footer .ca-btn { flex: 1; padding: 12px; font-size: 14px; }

/* 釣種タグ */
.cp-fish-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; min-height: 22px; }
.cp-fish-tag {
  display: inline-flex; align-items: center; gap: 4px;
  background: #e8f4fd; color: #1a3a5c;
  padding: 4px 10px; border-radius: 18px; font-size: 13px;
}
.cp-fish-tag button {
  background: none; border: none; color: #3d5670; cursor: pointer;
  font-size: 14px; line-height: 1; padding: 0;
}

/* バッジ補完 */
.cp-badge--source  { background: #e8f4fd; color: #1a3a5c; }
.cp-badge--fish    { background: #fef3c7; color: #92400e; }
.cp-badge--plan    { background: #e5e7eb; color: #374151; }
.cp-badge--cancelled { background: #9ca3af; color: #fff; }
.cp-badge--blue    { background:#dbeafe; color:#1e40af; }
.cp-badge--teal    { background:#ccfbf1; color:#115e59; }

/* 予約一覧 (day-grouped schedule) — boatbook 用拡張 */
.ca-day-card { background:#fff; border-radius:10px; overflow:hidden; margin-bottom:10px; box-shadow:0 1px 4px rgba(0,0,0,.08); }
.ca-day-card__header {
  background:#f5f9ff; padding:10px 14px; cursor:pointer;
  display:flex; justify-content:space-between; align-items:center;
  border-left:4px solid #0077b6;
}
.ca-day-card__header.is-holiday { border-left-color:#9ca3af; background:#f3f4f6; }
.ca-day-card__date { font-weight:700; font-size:15px; color:#023e6e; }
.ca-day-card__total { font-size:12px; color:#3d5670; font-weight:700; }
.ca-day-card__lines { padding:6px 14px 4px; font-size:12px; color:#3d5670; display:flex; flex-wrap:wrap; gap:8px; }
.ca-day-card__ship-line { display:inline-flex; align-items:center; gap:6px; }
.ca-day-card__ship-bar { display:inline-block; width:4px; height:14px; border-radius:2px; vertical-align:middle; }
.ca-day-card__body { display:none; padding:8px 14px 14px; }
.ca-day-card.is-open .ca-day-card__body { display:block; }
.ca-day-card.is-open .ca-day-card__chev { transform: rotate(180deg); }
.ca-day-card__chev { color:#3d5670; font-size:12px; transition: transform .2s; }

.ca-day-booking {
  background:#f8fbfd; border-radius:6px; padding:8px 10px;
  margin-bottom:6px; border-left:3px solid #c5dff0;
  cursor:pointer; transition: background .15s;
  display:flex; justify-content:space-between; align-items:center; gap:8px;
}
.ca-day-booking:hover { background:#e0eefa; }
.ca-day-booking__main { flex:1; min-width:0; }
.ca-day-booking__name { font-weight:700; font-size:14px; color:#1a2e42; }
.ca-day-booking__meta { font-size:11px; color:#3d5670; margin-top:2px; display:flex; gap:6px; flex-wrap:wrap; }

/* メニューグリッド (FishOn .ca-menu-grid を踏襲 - 6カラムだが5カラムにも対応) */
@media (max-width: 480px) {
  .ca-menu-grid { grid-template-columns: repeat(3, 1fr) !important; }
}

/* ログイン画面 */
.login-shell {
  display: flex; align-items: center; justify-content: center;
  min-height: 100vh; padding: 16px; background: #023e6e;
}
.login-box {
  background: #fff; border-radius: 14px; padding: 28px;
  max-width: 380px; width: 100%; box-shadow: 0 6px 24px rgba(0,0,0,.3);
}
.login-box h1 {
  margin: 0 0 4px; font-size: 22px; color: #023e6e; text-align: center;
}
.login-sub {
  text-align: center; color: #3d5670; font-size: 13px; margin-bottom: 20px;
}
.login-error {
  background: #fde8e8; color: #c53030; border: 1px solid #f5b5b5;
  border-radius: 8px; padding: 10px; margin-bottom: 12px; font-size: 13px;
  display: none;
}
.login-host-hint {
  font-size: 11px; color: #465e7a; margin-top: 14px;
  border-top: 1px solid #eef2f7; padding-top: 10px; text-align: center;
}

/* register.html / etc で旧クラスを使っているページ用 (元 admin.css 名残) */
.cp-container { padding:14px; max-width:720px; margin:0 auto; }
.cp-tabs { display: flex; gap: 6px; margin-bottom: 12px; }
.cp-tab {
  flex: 1; background: #fff; color: #3d5670;
  border: 1.5px solid #d7e2ed; border-radius: 8px;
  padding: 9px 12px; font-size: 14px; font-weight: 700;
  cursor: pointer; transition: all .15s;
}
.cp-tab:hover { background: #f0f7fc; }
.cp-tab--active { background: #0077b6; color: #fff; border-color: #0077b6; }

.cp-list-item {
  background: #fff; border-radius: 10px;
  padding: 14px 16px; margin-bottom: 10px;
  box-shadow: 0 2px 8px rgba(0,119,182,.08);
  cursor: pointer; transition: background .15s;
  border-left: 4px solid #0077b6;
  display: flex; gap: 10px; align-items: flex-start;
}
.cp-list-item:hover { background: #f0f7fc; }
.cp-list-item.is-unassigned { border-left-color: #fb923c; }
.cp-list-item.is-cancelled { border-left-color: #9ca3af; opacity: .7; }
.cp-list-item__main { flex: 1; min-width: 0; }
.cp-list-item__date {
  font-size: 13px; color: #3d5670; margin-bottom: 4px;
  display: flex; gap: 6px; flex-wrap: wrap; align-items: center;
}
.cp-list-item__name { font-size: 17px; font-weight: 700; color: #1a2e42; }
.cp-list-item__meta {
  font-size: 13px; color: #3d5670; margin-top: 4px;
  display: flex; gap: 10px; flex-wrap: wrap;
}

.cp-detail-overlay {
  position: fixed; inset: 0; z-index: 250;
  background: rgba(0,0,0,.5);
  align-items: flex-end;
}
.cp-detail-panel {
  background: #fff; width: 100%; max-width: 720px;
  margin: 0 auto;
  border-radius: 16px 16px 0 0;
  max-height: 92vh; overflow-y: auto;
  animation: slideUp .28s ease;
}
@keyframes slideUp { from { transform: translateY(100%); } to { transform: translateY(0); } }
.cp-detail-header {
  position: sticky; top: 0; background: #fff;
  display: flex; align-items: center; gap: 10px;
  padding: 14px 16px; border-bottom: 1px solid #e8f2f9; z-index: 10;
}
.cp-detail-close {
  background: #f0f7fc; border: none; border-radius: 50%;
  width: 36px; height: 36px; font-size: 18px; color: #3d5670;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; flex-shrink: 0;
}
.cp-detail-header h3 {
  flex: 1; font-size: 17px; font-weight: 700; color: #023e6e;
}
.cp-detail-actions { display: flex; gap: 6px; }
.cp-detail-body { padding: 14px 16px; }
.cp-detail-row {
  display: flex; align-items: baseline; gap: 12px;
  padding: 10px 0; border-bottom: 1px solid #f0f7fc; font-size: 15px;
}
.cp-detail-row:last-child { border-bottom: none; }
.cp-detail-row__label { color: #3d5670; font-size: 13px; min-width: 90px; flex-shrink: 0; }
.cp-detail-row__value { color: #1a2e42; font-weight: 600; flex: 1; word-break: break-word; }
.cp-detail-row__value a { color: #0077b6; }
.cp-edit-form { padding: 14px 16px; border-top: 2px solid #e8f2f9; display:none; }

.cp-form-group { display: flex; flex-direction: column; gap: 6px; margin-bottom: 12px; }
.cp-form-group label { font-size: 13px; font-weight: 600; color: #3d5670; }
.cp-form-group input,
.cp-form-group select,
.cp-form-group textarea {
  width: 100%; padding: 10px 12px;
  border: 1px solid #c5dff0; border-radius: 8px;
  font-size: 16px; color: #1a2e42; background: #fff;
  -webkit-appearance: none;
}
.cp-form-group textarea { min-height: 70px; resize: vertical; }
/* チェックボックスは width:100%/padding/appearance:none を打ち消してネイティブ描画に戻す */
.cp-form-group input[type="checkbox"],
.cp-form-group input[type="radio"] {
  width: 18px !important; height: 18px !important;
  padding: 0 !important; margin: 0;
  border: 1px solid #c5dff0; border-radius: 3px;
  -webkit-appearance: checkbox !important; appearance: checkbox !important;
  cursor: pointer; flex-shrink: 0;
}
.cp-form-group input[type="color"] {
  width: 60px !important; height: 40px !important; padding: 0 !important;
  -webkit-appearance: auto !important; appearance: auto !important;
}
.ca-req { color: #d04a4a; }
.cp-form-footer { display: flex; gap: 10px; margin-top: 14px; }
.cp-btn-lg { flex: 1; padding: 14px; font-size: 15px; }

/* 検索バー個別 */
.ca-search-bar input { font-size: 15px; }