/**
 * push-reserve フロント表示ウィジェット — デフォルトスタイル
 *
 * このファイルはカスタマイズ用のベーススタイルです。
 * サイトのデザインに合わせて自由に上書き・修正してください。
 *
 * クラス一覧:
 *   .pr-widget             共通ラッパー
 *   .pr-widget--today      今日のみモード
 *   .pr-widget--week       week（横グリッド）モード
 *   .pr-badge              ステータスバッジ
 *   .pr-badge--ok          ◯ 空きあり
 *   .pr-badge--few         △ 残りわずか
 *   .pr-badge--full        × 満員
 *   .pr-badge--holiday     休診
 *   .pr-count              残り枠数（バッジ横の小さい数字）
 *   .pr-period             午前/午後の行（today モード）
 *   .pr-period-label       「午前」「午後」ラベル
 *   .pr-holiday            休診日ブロック（today モード）
 *   .pr-week-grid          グリッドコンテナ
 *   .pr-grid-row           グリッドの1行
 *   .pr-grid-row--header   ヘッダー行（日付）
 *   .pr-grid-row--am       午前行
 *   .pr-grid-row--pm       午後行
 *   .pr-grid-corner        ラベル列の角（空セル）
 *   .pr-grid-label         「午前」「午後」ラベルセル
 *   .pr-grid-date          日付ヘッダーセル
 *   .pr-grid-date--today   本日の日付セル
 *   .pr-grid-date--holiday 休診日の日付セル
 *   .pr-grid-cell          データセル
 *   .pr-grid-cell--today   本日のデータセル
 *   .pr-grid-cell--holiday 休診日のデータセル
 *   .pr-today-tag          「本日」タグ
 *   .pr-date-label         日付テキスト
 *   .pr-updated            更新日時テキスト
 *   .pr-empty              データなしメッセージ
 *   .pr-loading            読み込み中表示
 *   .pr-error              エラー表示
 */

/* ===========================================
   共通
   =========================================== */
.pr-widget {
    font-family: sans-serif;
    font-size: 14px;
    line-height: 1.5;
    color: #333;
}

/* ステータスバッジ */
.pr-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2em;
    padding: 0.2em 0.5em;
    border-radius: 4px;
    font-weight: bold;
    font-size: 1em;
    border: 1px solid transparent;
}
.pr-badge--ok      { background: #eaf5ef; color: #2a7158; border-color: #b8deca; }
.pr-badge--few     { background: #fef3e2; color: #b06000; border-color: #f5d69f; }
.pr-badge--full    { background: #fdecea; color: #c8281c; border-color: #f5bfbb; }
.pr-badge--holiday { background: #f5f5f5; color: #999;    border-color: #d8d8d9; }

/* 残り枠数 */
.pr-count {
    font-size: 0.78em;
    color: #999;
    margin-left: 3px;
    font-weight: normal;
    vertical-align: baseline;
}

/* 更新日時 */
.pr-updated {
    margin-top: 0.6em;
    font-size: 0.78em;
    color: #bbb;
}

/* データなし・エラー */
.pr-empty,
.pr-error-msg { color: #aaa; font-size: 0.9em; }

/* 読み込み中 */
.pr-loading { color: #bbb; font-size: 0.9em; }

/* ===========================================
   today モード
   =========================================== */
.pr-widget--today {
    /* ラッパー: サイトに合わせて変更 */
}

/* 午前/午後 行 */
.pr-period {
    display: flex;
    align-items: center;
    gap: 0.5em;
    padding: 0.3em 0;
}

/* 「午前」「午後」ラベル */
.pr-period-label {
    min-width: 2.5em;
    font-size: 0.9em;
    color: #888;
}

/* 休診ブロック */
.pr-holiday { padding: 0.3em 0; }

/* ===========================================
   week モード（横グリッド）
   =========================================== */

/* スクロール対応のラッパー（横幅が足りない場合にスクロール） */
.pr-widget--week {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* グリッド本体 */
.pr-week-grid {
    display: table;        /* 列幅を揃えるために table 表示を利用 */
    width: 100%;
    border-collapse: collapse;
    min-width: max-content; /* 内容が収まらない場合の最小幅 */
}

/* グリッド 各行 */
.pr-grid-row {
    display: table-row;
}

/* ヘッダー行の背景 */
.pr-grid-row--header {
    /* background: #f9f9f9; ← 必要に応じてコメントを外す */
}

/* 角セル（空白）と 午前/午後 ラベルセル */
.pr-grid-corner,
.pr-grid-label {
    display: table-cell;
    width: 3.5em;
    padding: 8px 6px;
    text-align: center;
    vertical-align: middle;
    font-size: 0.85em;
    color: #999;
    border-bottom: 1px solid #eee;
    border-right: 1px solid #eee;
    white-space: nowrap;
}

/* 日付ヘッダーセル */
.pr-grid-date {
    display: table-cell;
    padding: 8px 6px;
    text-align: center;
    vertical-align: middle;
    border-bottom: 1px solid #eee;
    border-right: 1px solid #eee;
    white-space: nowrap;
}
.pr-grid-date:last-child { border-right: none; }

/* 本日の列 */
.pr-grid-date--today {
    /* background: #fffaf5; ← 必要に応じてコメントを外す */
}

/* 休診日の列 */
.pr-grid-date--holiday { opacity: 0.5; }

/* 「本日」タグ */
.pr-today-tag {
    display: block; /* 日付の上に表示 */
    font-size: 0.75em;
    font-weight: bold;
    color: #fff;
    background: #c0392b;
    padding: 1px 6px;
    border-radius: 20px;
    margin-bottom: 3px;
    white-space: nowrap;
}

/* 日付テキスト */
.pr-date-label {
    font-size: 0.85em;
    display: block;
}

/* データセル（午前・午後の値） */
.pr-grid-cell {
    display: table-cell;
    padding: 8px 6px;
    text-align: center;
    vertical-align: middle;
    border-right: 1px solid #eee;
}
.pr-grid-cell:last-child { border-right: none; }

/* 本日列のデータセル */
.pr-grid-cell--today {
    /* background: #fffaf5; ← 必要に応じてコメントを外す */
}

/* 休診日のデータセル */
.pr-grid-cell--holiday { opacity: 0.5; }

/* データセル内のバッジ横に枠数が並ぶ */
.pr-grid-cell .pr-badge {
    display: inline-flex;
}
.pr-grid-cell .pr-count {
    display: block;
    font-size: 0.75em;
    color: #bbb;
    margin-top: 2px;
    margin-left: 0;
}