/* =========================================
   ベース：全体の標準フォント
   ========================================= */
body {
  font-family: "Noto Sans JP", -apple-system, BlinkMacSystemFont,
               "Hiragino Kaku Gothic ProN", "Yu Gothic", "YuGothic",
               "Meiryo", sans-serif;
  font-weight: 400;
  line-height: 1.7;
}

/* 英字メインのロゴ・大見出しなど（MENS ALIGNとか） */
.site-title,
.logo-text,
h1.site-title,
.header-logo-text {
  font-family: "Montserrat", "Noto Sans JP", -apple-system,
               BlinkMacSystemFont, "Hiragino Kaku Gothic ProN",
               "Yu Gothic", "YuGothic", "Meiryo", sans-serif;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* 見出し系（日本語＋英語混在想定） */
h1, h2, h3, h4 {
  font-family: "Noto Sans JP", "Montserrat", -apple-system,
               BlinkMacSystemFont, "Hiragino Kaku Gothic ProN",
               "Yu Gothic", "YuGothic", "Meiryo", sans-serif;
  font-weight: 500;
  line-height: 1.5;
}

/* 小見出し・ラベルなど（少しだけ強調） */
.section-title,
.menu-title,
.card-title {
  font-family: "Noto Sans JP", "Montserrat", -apple-system,
               BlinkMacSystemFont, "Hiragino Kaku Gothic ProN",
               "Yu Gothic", "YuGothic", "Meiryo", sans-serif;
  font-weight: 500;
  letter-spacing: 0.04em;
}

/* ボタン・CTAまわり */
button,
.btn,
a.button,
a.btn-reserve {
  font-family: "Noto Sans JP", "Montserrat", -apple-system,
               BlinkMacSystemFont, "Hiragino Kaku Gothic ProN",
               "Yu Gothic", "YuGothic", "Meiryo", sans-serif;
  font-weight: 500;
  letter-spacing: 0.06em;
}

/* PC/SP 出し分け：デフォルトはPC表示 */
.pc-only {
  display: block;
}
.sp-only {
  display: none !important;
}

/* スマホ幅（959px以下）では逆転させる */
@media screen and (max-width: 959px) {
  .pc-only {
    display: none !important;
  }
  .sp-only {
    display: block !important;
  }
}

/* フッタの "Powered by ..." 非表示 */
.site-footer-copyright p:nth-child(2){
  display:none;
}

/* reCAPTCHA の位置調整 */
.grecaptcha-badge{
  margin-bottom:80px;
}


/* =========================================
   シフトグリッド（[staff_schedule_matrix]）用
   ========================================= */

/* 全体コンテナ */
.ss-grid {
  margin: 24px 0;
}

/* 週ナビ（前の週 / 次の週） */
.ss-grid .week-nav {
  display: flex;
  justify-content: flex-start;      /* 左寄せ */
  gap: 8px;
  margin-bottom: 16px;
}

/* 枠線だけのボタン */
.ss-grid .ss-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 18px;
  border-radius: 999px;
  background: #fff;
  color: #0b63b0;
  border: 1px solid #0b63b0;
  text-decoration: none;
  font-size: 13px;
  line-height: 1.3;
  font-weight: 500;
}
.ss-grid .ss-btn:hover {
  background: #0b63b0;
  color: #fff;
}

/* テーブル基本 */
.ss-grid table {
  border-collapse: collapse;
  width: 100%;
  background: #fff;
}

.ss-grid th,
.ss-grid td {
  padding: 8px 10px;
  border: 1px solid #eee;
  font-size: 13px;
  vertical-align: middle;          /* 縦中央寄せ */
  text-align: center;
}

.ss-grid thead th {
  background: #f7f9fc;
  font-weight: 600;
}

/* 奇数行のうっすら背景（お好みで） */
.ss-grid tbody tr:nth-child(odd) {
  background: #fcfdff;
}

/* スタッフ列（1列目）を少し強調 */
.ss-grid th:first-child,
.ss-grid td:first-child {
  background: #fff;
  white-space: nowrap;
}

/* スタッフ写真 */
.ss-grid img {
  border-radius: 8px;
  display: block;
  margin: 0 auto;
}

/* =========================================
   ステータス表示用バッジ
   （PHP側で class を付けてあります）
   ========================================= */

/* 受付終了 */
.ss-cell-full {
  display: inline-block;
  padding: 2px 12px;
  border-radius: 16px;
  background: #ffe5ea;   /* 薄いピンク */
  color: #d23b3b;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
}

/* 何も無い日の「-」 */
.ss-cell-empty {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 16px;
  background: #f3f6fb;   /* 薄いグレー青 */
  color: #a0a7b3;
  font-size: 12px;
  line-height: 1.4;
}

/* 「要確認」「※当日予約不可」は通常テキストでOKに */
.ss-cell-note {
  font-size: 12px;
  color: #555;
}

/* 送信ボタン中央寄せ */
.submit-center{ display:block; margin:0 auto; }

/*=========================================
シフト表スタッフ列が左に寄る問題の修正
原因:セル内の要素がflexレイアウトで左寄せ
対策:セル自体ではなく中身ごと中央寄せに上書き
=========================================*/

/* スタッフ列セル自体の基準位置を中央に固定 */
.ss-grid th:first-child,
.ss-grid td:first-child{
text-align:center!important;
vertical-align:middle!important;
}

/* スタッフ列の中身をflex前提で中央配置に変更 */
.ss-grid td:first-child{
display:flex!important;
flex-direction:column!important;
align-items:center!important;
justify-content:center!important;
}

/* 見出し行のスタッフ列も中央寄せ */
.ss-grid th:first-child{
text-align:center!important;
}

/* スタッフ名や状態テキストなど内部要素を中央に寄せる */
.ss-grid td:first-child>div,
.ss-grid td:first-child>a,
.ss-grid td:first-child>p,
.ss-grid td:first-child>span{
margin-left:auto!important;
margin-right:auto!important;
text-align:center!important;
}

/* スタッフ写真がある場合のズレ防止 */
.ss-grid td:first-child img{
margin-left:auto!important;
margin-right:auto!important;
}