/*
 * 占い師スケジュールタブ（週×時間グリッド）
 * ワイヤー: 占い師スケジュール.html
 */

.teller-schedule-tab .schedule-title-section { background:#fff; padding:20px 16px 12px; }
.teller-schedule-tab .schedule-title-section h2 { font-size:20px; font-weight:500; font-family:'Noto Sans JP', sans-serif; color:rgba(0,0,0,0.87); margin:0 0 8px; }
.teller-schedule-tab .info-link { display:flex; align-items:center; gap:4px; font-size:13px; color:#1976d2; cursor:pointer; }

.teller-schedule-tab .week-nav { background:#fff; padding:8px 16px 12px; display:flex; align-items:center; justify-content:space-between; }
/* #tellerScheduleTop へジャンプした時に mini-header(75px) + tabs(56px) の裏に隠れないよう
   週ナビ自身のスクロールマージンで下に押し下げる */
.teller-schedule-tab .week-nav#tellerScheduleTop { scroll-margin-top:132px; }
.teller-schedule-tab .week-nav-btn { font-size:13px; font-weight:500; color:#1976d2; cursor:pointer; background:none; border:none; font-family:inherit; display:flex; align-items:center; gap:4px; }
.teller-schedule-tab .week-nav-btn:disabled { color:rgba(0,0,0,0.2); cursor:default; }
.teller-schedule-tab .week-nav-btn:disabled svg path { stroke:rgba(0,0,0,0.2); }
.teller-schedule-tab .week-label { font-size:12px; font-weight:500; color:#616161; }

/* Sticky date header */
.teller-schedule-tab .date-header-sticky { position:sticky; top:56px; z-index:50; background:#fff; border-bottom:2px solid rgba(0,0,0,0.15); }
.teller-schedule-tab .date-header-grid { display:grid; grid-template-columns:50px repeat(7, 1fr); min-width:100%; }
.teller-schedule-tab .date-header-grid .date-cell { border-bottom:none; }
.teller-schedule-tab .date-header-grid .time-header-cell { border-bottom:none; }

.teller-schedule-tab .date-cell { height:44px; display:flex; flex-direction:column; align-items:center; justify-content:center; font-size:11px; font-weight:500; color:#616161; background:#fff; border-bottom:2px solid rgba(0,0,0,0.15); line-height:1.3; }
.teller-schedule-tab .date-cell .day-label { font-size:10px; font-weight:400; color:#9e9e9e; }
.teller-schedule-tab .today-cell { background:#e3f2fd !important; }
.teller-schedule-tab .today-cell span:first-child { font-weight:500; color:#1976d2; }
.teller-schedule-tab .time-header-cell { height:44px; display:flex; align-items:center; justify-content:center; font-size:9px; font-weight:500; color:#616161; background:#fafafa; border-bottom:2px solid rgba(0,0,0,0.15); }

.teller-schedule-tab .schedule-grid-wrapper { background:#fff; overflow-x:auto; }
.teller-schedule-tab .schedule-grid-wrapper::-webkit-scrollbar { display:none; }
.teller-schedule-tab .schedule-grid { display:grid; grid-template-columns:50px repeat(7, 1fr); min-width:100%; }

.teller-schedule-tab .time-cell { height:44px; display:flex; flex-direction:column; align-items:center; justify-content:center; font-size:10px; font-weight:500; color:#616161; background:#fafafa; border-bottom:1px solid rgba(0,0,0,0.08); border-right:1px solid rgba(0,0,0,0.08); line-height:1.2; }
.teller-schedule-tab .time-cell .sub { font-size:8px; font-weight:400; color:#9e9e9e; }
.teller-schedule-tab .time-cell.past-cell { color:#bdbdbd; }

.teller-schedule-tab .g-cell { height:44px; border-bottom:1px solid rgba(0,0,0,0.08); border-right:1px solid rgba(0,0,0,0.06); display:flex; flex-direction:column; min-height:0; position:relative; }

.teller-schedule-tab .g-imasugu, .teller-schedule-tab .g-cont-imasugu,
.teller-schedule-tab .g-sokuji, .teller-schedule-tab .g-cont-sokuji,
.teller-schedule-tab .g-request, .teller-schedule-tab .g-cont-request,
.teller-schedule-tab .g-machi,   .teller-schedule-tab .g-cont-machi { cursor:pointer; }

/* imasugu (green) */
.teller-schedule-tab .g-imasugu { background:#d0ffcf; }
.teller-schedule-tab .g-imasugu .g-bar   { background:#2fb605; height:14px; display:flex; align-items:center; justify-content:center; font-size:9px; font-weight:500; color:#fff; flex-shrink:0; }
.teller-schedule-tab .g-imasugu .g-label { flex:1; display:flex; align-items:center; justify-content:center; font-size:9px; font-weight:500; color:#2fb605; }
.teller-schedule-tab .g-cont-imasugu { background:#d0ffcf; }

/* sokuji (blue) */
.teller-schedule-tab .g-sokuji { background:#e3f2fd; }
.teller-schedule-tab .g-sokuji .g-bar   { background:#1976d2; height:14px; display:flex; align-items:center; justify-content:center; font-size:9px; font-weight:500; color:#fff; flex-shrink:0; }
.teller-schedule-tab .g-sokuji .g-label { flex:1; display:flex; align-items:center; justify-content:center; font-size:9px; font-weight:500; color:#1976d2; }
.teller-schedule-tab .g-cont-sokuji { background:#e3f2fd; }

/* request (dark blue) */
.teller-schedule-tab .g-request { background:#e3f2fd; }
.teller-schedule-tab .g-request .g-bar   { background:#1d61a5; height:14px; display:flex; align-items:center; justify-content:center; font-size:9px; font-weight:500; color:#fff; flex-shrink:0; }
.teller-schedule-tab .g-request .g-label { flex:1; display:flex; align-items:center; justify-content:center; font-size:9px; font-weight:500; color:#1976d2; }
.teller-schedule-tab .g-cont-request { background:#e3f2fd; }

/* machi (purple) */
.teller-schedule-tab .g-machi { background:#ede7f6; }
.teller-schedule-tab .g-machi .g-bar   { background:#9c27b0; height:14px; display:flex; align-items:center; justify-content:center; font-size:9px; font-weight:500; color:#fff; flex-shrink:0; }
.teller-schedule-tab .g-machi .g-label { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; font-size:8px; font-weight:500; color:#9c27b0; line-height:1.2; }
.teller-schedule-tab .g-cont-machi { background:#ede7f6; }

/* taiki (dashed pink) */
.teller-schedule-tab .g-taiki        { position:relative; background:rgba(219,191,208,0.4); }
.teller-schedule-tab .g-taiki::before { content:''; position:absolute; inset:3px; border:1px dashed rgba(0,0,0,0.18); border-radius:3px; }
.teller-schedule-tab .g-taiki .g-taiki-label { position:relative; z-index:1; display:flex; align-items:center; justify-content:center; height:100%; font-size:9px; font-weight:500; color:#994E7C; }
.teller-schedule-tab .g-taiki-first::before { inset:3px 3px 0 3px; border:1px dashed rgba(0,0,0,0.18); border-bottom:none; border-radius:3px 3px 0 0; }
.teller-schedule-tab .g-cont-taiki        { position:relative; background:rgba(219,191,208,0.4); }
.teller-schedule-tab .g-cont-taiki::before { content:''; position:absolute; top:0; bottom:0; left:3px; right:3px; border-left:1px dashed rgba(0,0,0,0.18); border-right:1px dashed rgba(0,0,0,0.18); }
.teller-schedule-tab .g-cont-taiki-last::before { bottom:3px; border-bottom:1px dashed rgba(0,0,0,0.18); border-radius:0 0 3px 3px; }

/* シフト外: 無地の空セル（バーも文字も出さない） */
.teller-schedule-tab .g-unavail { display:flex; align-items:center; justify-content:center; }
/* 予約済み: 過去セルと同じグレー塗り（#e0e0e0）+ 薄文字「予約済み」。クリック不可。 */
.teller-schedule-tab .g-reserved { display:flex; align-items:center; justify-content:center; background:#e0e0e0; font-size:9px; color:rgba(0,0,0,0.12); cursor:default; }

/* 半セル描画（30分単位）: シフトが :30 開始 / :30 終了の場合、対象セルの半分だけ塗る。
   タップ領域は g-cell 全体(44px)のままで、内側コンテンツを 22px ぶんずらす。
   下半分が窮屈なため、バー＋ラベルは隣の cont セル(同色)に染み出して描画する。 */
.teller-schedule-tab .g-cell.g-half-start { padding-top:22px; overflow:visible; z-index:2; }
.teller-schedule-tab .g-cell.g-half-end   { padding-bottom:22px; overflow:visible; z-index:2; }
/* 半セルでも通常セルと同じ寸法でバー＋ラベルを描く。
   足りないぶんは下隣の cont セル(同色)にはみ出して重ねる。
   - .g-label: 通常時 flex:1 で 30px (44 - 14) に伸びるのを、半セルでは 30px 固定にする
   - .g-taiki-label: 通常時 height:100% で 44px、半セルでも 44px に固定 */
.teller-schedule-tab .g-cell.g-half-start .g-label,
.teller-schedule-tab .g-cell.g-half-end   .g-label       { flex:0 0 30px; }
.teller-schedule-tab .g-cell.g-half-start .g-taiki-label,
.teller-schedule-tab .g-cell.g-half-end   .g-taiki-label { height:44px; }

/* imasugu */
.teller-schedule-tab .g-imasugu.g-half-start      { background:linear-gradient(to bottom, transparent 50%, #d0ffcf 50%); }
.teller-schedule-tab .g-imasugu.g-half-end,
.teller-schedule-tab .g-cont-imasugu.g-half-end   { background:linear-gradient(to bottom, #d0ffcf 50%, transparent 50%); }
/* sokuji */
.teller-schedule-tab .g-sokuji.g-half-start       { background:linear-gradient(to bottom, transparent 50%, #e3f2fd 50%); }
.teller-schedule-tab .g-sokuji.g-half-end,
.teller-schedule-tab .g-cont-sokuji.g-half-end    { background:linear-gradient(to bottom, #e3f2fd 50%, transparent 50%); }
/* request */
.teller-schedule-tab .g-request.g-half-start      { background:linear-gradient(to bottom, transparent 50%, #e3f2fd 50%); }
.teller-schedule-tab .g-request.g-half-end,
.teller-schedule-tab .g-cont-request.g-half-end   { background:linear-gradient(to bottom, #e3f2fd 50%, transparent 50%); }
/* machi */
.teller-schedule-tab .g-machi.g-half-start        { background:linear-gradient(to bottom, transparent 50%, #ede7f6 50%); }
.teller-schedule-tab .g-machi.g-half-end,
.teller-schedule-tab .g-cont-machi.g-half-end     { background:linear-gradient(to bottom, #ede7f6 50%, transparent 50%); }

/* ── reserved 半セル（即時/リクの半枠予約済み） ──
   g-half-start/end の「空白側」をグレー(#e0e0e0)で塗りつぶす。
   sokuji/request 両系統 + cont バリエーションも対応。 */
/* 上半分 reserved + 下半分が即時 */
.teller-schedule-tab .g-sokuji.g-half-start.g-rf-top         { background:linear-gradient(to bottom, #e0e0e0 50%, #e3f2fd 50%); }
.teller-schedule-tab .g-request.g-half-start.g-rf-top        { background:linear-gradient(to bottom, #e0e0e0 50%, #e3f2fd 50%); }
/* 下半分 reserved + 上半分が即時 */
.teller-schedule-tab .g-sokuji.g-half-end.g-rf-bot,
.teller-schedule-tab .g-cont-sokuji.g-half-end.g-rf-bot      { background:linear-gradient(to bottom, #e3f2fd 50%, #e0e0e0 50%); }
.teller-schedule-tab .g-request.g-half-end.g-rf-bot,
.teller-schedule-tab .g-cont-request.g-half-end.g-rf-bot     { background:linear-gradient(to bottom, #e3f2fd 50%, #e0e0e0 50%); }

/* taiki: 破線ボーダーの ::before も半分位置に寄せる */
.teller-schedule-tab .g-taiki.g-half-start        { background:linear-gradient(to bottom, transparent 50%, rgba(219,191,208,0.4) 50%); }
.teller-schedule-tab .g-taiki.g-half-end          { background:linear-gradient(to bottom, rgba(219,191,208,0.4) 50%, transparent 50%); }
.teller-schedule-tab .g-cont-taiki.g-half-end     { background:linear-gradient(to bottom, rgba(219,191,208,0.4) 50%, transparent 50%); }
/* half-mark から 3px 内側に破線ボックスを配置（通常セルが上下 3px 余白を持つのに揃える） */
.teller-schedule-tab .g-taiki.g-half-start::before        { top:25px; }
.teller-schedule-tab .g-taiki-first.g-half-start::before  { top:25px; }
.teller-schedule-tab .g-taiki.g-half-end::before          { bottom:25px; border-bottom:1px dashed rgba(0,0,0,0.18); border-radius:3px 3px 3px 3px; }
.teller-schedule-tab .g-cont-taiki-last.g-half-end::before{ bottom:25px; }

/* past rows (gray out on week 0) */
.teller-schedule-tab .g-cell.past-cell { background:#e0e0e0 !important; }
.teller-schedule-tab .g-cell.past-cell * { display:none; }
.teller-schedule-tab .g-cell.past-cell::before,
.teller-schedule-tab .g-cell.past-cell::after { display:none; }

/* now marker */
.teller-schedule-tab .now-marker { position:absolute; left:0; right:0; height:2px; background:#e53935; z-index:5; pointer-events:none; }
.teller-schedule-tab .now-marker::before { content:''; position:absolute; left:-4px; top:-3px; width:8px; height:8px; border-radius:50%; background:#e53935; }

/* bottom back button */
.teller-schedule-tab .bottom-actions { background:#fff; padding:20px 16px; display:flex; flex-direction:column; gap:12px; }
.teller-schedule-tab .btn-back { width:100%; padding:12px; border:1px solid rgba(0,0,0,0.5); border-radius:4px; background:#fff; font-size:14px; font-weight:500; color:rgba(0,0,0,0.87); cursor:pointer; font-family:inherit; text-align:center; text-decoration:none; display:block; }
