/* ============================================================
   Fish On 予約カレンダー (公開・管理共通)
   ============================================================ */
.foc{font-family:"Noto Sans JP",sans-serif;color:#1a3a5c;max-width:820px;margin:0 auto;background:#fff;border-radius:12px;box-shadow:0 4px 16px rgba(0,0,0,.06);padding:16px;box-sizing:border-box}
.foc *{box-sizing:border-box}
.foc-bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:8px;flex-wrap:wrap}
.foc-nav{display:flex;align-items:center;gap:8px}
.foc-nav button{background:#f2f6fa;border:1px solid #d7e2ed;color:#1a3a5c;border-radius:8px;width:34px;height:34px;font-size:16px;cursor:pointer;line-height:1}
.foc-nav button:hover{background:#e3ecf5}
.foc-title{font-size:17px;font-weight:700;min-width:120px;text-align:center}
.foc-tabs{display:flex;background:#f2f6fa;border-radius:8px;padding:3px;gap:2px}
.foc-tabs button{background:none;border:0;padding:6px 14px;border-radius:6px;font-size:13px;cursor:pointer;color:#5a7189;font-weight:600}
.foc-tabs button.on{background:#1a6fc4;color:#fff}

/* 凡例 */
.foc-legend{display:flex;flex-wrap:wrap;gap:8px;font-size:11px;margin-bottom:10px;color:#5a7189}
.foc-legend span{display:inline-flex;align-items:center;gap:4px}
.foc-legend i{width:10px;height:10px;border-radius:2px;display:inline-block}

/* グリッド */
.foc-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.foc-dow{text-align:center;font-size:11px;font-weight:700;padding:4px 0;color:#5a7189}
.foc-dow.sun{color:#d04a4a}
.foc-dow.sat{color:#2e6fd8}
.foc-day{background:#fafbfd;border:1px solid #e7edf3;border-radius:6px;min-height:76px;padding:4px;cursor:pointer;position:relative;overflow:hidden;transition:.12s}
.foc-day:hover{border-color:#1a6fc4;background:#fff}
.foc-day.empty{background:transparent;border:none;cursor:default}
.foc-day.other{opacity:.35}
.foc-day.today .foc-dnum{background:#1a6fc4;color:#fff;border-radius:50%;width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center}
.foc-dnum{font-size:12px;font-weight:700;display:inline-block}
.foc-day.sun .foc-dnum{color:#d04a4a}
.foc-day.sat .foc-dnum{color:#2e6fd8}
.foc-tags{display:flex;flex-direction:column;gap:2px;margin-top:4px}
.foc-tag{font-size:10px;padding:3px 4px;border-radius:3px;line-height:1.2;overflow:hidden}
.foc-tag-top,.foc-tag-bot{display:flex;justify-content:space-between;gap:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.foc-tag-top{font-weight:700}
.foc-tag-bot{font-size:9px;opacity:.92}
.foc-tag.open{background:#e6f4ea;color:#0b8043}
.foc-tag.few{background:#fff4d6;color:#b88600}
.foc-tag.full{background:#fde1e1;color:#c03030}
.foc-tag.charter{background:#fde1e1;color:#c03030;font-weight:700}
.foc-tag.holiday{background:#e5e7eb;color:#6b7280;font-weight:700}
.foc-tag.closed{background:#e5e7eb;color:#6b7280}

/* 週表示 */
.foc-week{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.foc-week .foc-day{min-height:140px}

/* 詳細モーダル */
.foc-modal{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:10050;display:flex;align-items:center;justify-content:center;padding:16px;animation:focIn .15s}
@keyframes focIn{from{opacity:0}to{opacity:1}}
.foc-modal-body{background:#fff;border-radius:12px;max-width:480px;width:100%;max-height:90vh;overflow:auto;padding:18px 20px;box-shadow:0 10px 40px rgba(0,0,0,.3)}
.foc-modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid #e7edf3}
.foc-modal-title{font-size:16px;font-weight:700}
.foc-modal-close{background:none;border:0;font-size:26px;cursor:pointer;color:#5a7189;padding:0 4px;line-height:1}
.foc-ship{border:1px solid #e7edf3;border-radius:8px;padding:10px 12px;margin-bottom:10px}
.foc-ship-h{display:flex;justify-content:space-between;align-items:center;font-weight:700;font-size:13px;margin-bottom:6px;padding-bottom:6px;border-bottom:1px solid #eef2f7}
.foc-ship.s1 .foc-ship-h{color:#1a6fc4}
.foc-ship.s2 .foc-ship-h{color:#0a8a7a}
.foc-ship.charter .foc-ship-h{color:#c03030}
.foc-ship-info{font-size:12px;color:#5a7189;line-height:1.6}
.foc-ship-info b{color:#1a3a5c}
.foc-book-list{margin-top:6px;font-size:12px}
.foc-book-list div{padding:3px 0;border-top:1px dashed #eef2f7}
.foc-empty{text-align:center;color:#94a3b8;font-size:12px;padding:8px}
.foc-load{text-align:center;padding:40px 0;color:#94a3b8;font-size:13px}

@media (max-width:600px){
  .foc{padding:10px}
  .foc-day{min-height:62px;padding:3px}
  .foc-tag{font-size:9px;padding:1px 3px}
  .foc-title{font-size:15px;min-width:100px}
  .foc-week .foc-day{min-height:110px}
}