/* hina-television v7.155.0 — 固定ボトムバー（HINTV_Tabbar）／v7.157.0 先読みは半円タブ
 * 色・角丸・書体はトップページ（.ohm-top）とゲスト導線バナー（.hintv-gret）に合わせてある。
 * 黒地のプレーヤー系には持ち込まない（メイン画面では JS が出さない）。
 */
:root{--hintv-tabbar-h:0px;--hintv-tabbar-half:0px}
/* v7.157.0: 先読みの半円タブが出ているあいだだけ、その高さぶん下の余白を足す */
html.hintv-has-tabbar.hintv-tabbar-has-half{--hintv-tabbar-half:40px}
html.hintv-has-tabbar{--hintv-tabbar-h:calc(56px + env(safe-area-inset-bottom,0px))}

.hintv-tabbar{position:fixed;left:0;right:0;bottom:0;z-index:9990;margin:0;
  padding:0 0 env(safe-area-inset-bottom,0px);
  background:rgba(255,255,255,.96);border-top:1px solid #b8dff2;
  box-shadow:0 -3px 12px rgba(0,80,140,.10);
  font-family:'Hiragino Kaku Gothic ProN','BIZ UDPGothic',sans-serif;
  transition:transform .2s ease}
.hintv-tabbar[hidden]{display:none}
.hintv-tabbar.is-typing{transform:translateY(110%)}

.hintv-tabbar-row{display:flex;list-style:none;margin:0 auto;padding:0;max-width:680px;height:56px}
.hintv-tabbar-row li{flex:1 1 0;min-width:0;margin:0;padding:0;list-style:none}
.hintv-tabbar-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  height:100%;padding:0 2px;text-decoration:none!important;color:#6a7a84!important;
  -webkit-tap-highlight-color:transparent;position:relative}
.hintv-tabbar-ic{font-size:20px;line-height:1;filter:grayscale(.55);opacity:.8}
.hintv-tabbar-lb{font-size:11px;font-weight:700;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.hintv-tabbar-item:active{transform:scale(.96)}

.hintv-tabbar-item.is-active{color:#0d5a8a!important}
.hintv-tabbar-item.is-active .hintv-tabbar-ic{filter:none;opacity:1}
.hintv-tabbar-item.is-active::before{content:'';position:absolute;top:0;left:22%;right:22%;height:3px;
  background:#7cc7e8;border-radius:0 0 3px 3px}

/* v7.157.0: 先読みバー＝5つの枠はそのまま、バー中央の上に半円のタブを生やす。
   （v7.155.0〜 は真ん中の枠を差し替えていたため、その日にスケジュールが押せなかった） */
.hintv-tabbar-half{position:absolute;left:50%;bottom:calc(100% - 1px);z-index:1;
  min-width:132px;height:40px;padding:6px 18px 0;box-sizing:border-box;
  display:flex;align-items:center;justify-content:center;gap:6px;
  border-radius:70px 70px 0 0;background:#0d5a8a;color:#fff!important;text-decoration:none!important;
  box-shadow:0 -3px 10px rgba(0,80,140,.18);-webkit-tap-highlight-color:transparent;
  opacity:0;transform:translate(-50%,14px);transition:opacity .22s ease,transform .22s ease}
.hintv-tabbar-half[hidden]{display:none}
.hintv-tabbar-half.is-on{opacity:1;transform:translate(-50%,0)}
.hintv-tabbar-half:active{transform:translate(-50%,1px) scale(.97)}
.hintv-tabbar-half-ic{font-size:17px;line-height:1}
.hintv-tabbar-half-lb{font-size:12px;font-weight:800;line-height:1;white-space:nowrap;letter-spacing:.02em}
.hintv-tabbar-half:focus-visible{outline:2px solid #ffd700;outline-offset:2px}
@media (prefers-reduced-motion:reduce){.hintv-tabbar-half{transition:none}}
/* 旧方式（枠の差し替え）の見た目。JS からは付けなくなったが、古いキャッシュのJSが混ざっても崩れないよう残す */
.hintv-tabbar-item.is-flex{color:#0d5a8a!important}
.hintv-tabbar-item.is-flex .hintv-tabbar-lb{font-weight:800}

/* v7.154.0: ひなテレのメイン画面用。プレーヤー系の言語（hintv-player.css）＝黒地・フラット・角丸ゼロ・影なし */
.hintv-tabbar.is-dark{background:#0f1621;border-top:1px solid #1e2d45;box-shadow:none;font-family:inherit}
.hintv-tabbar.is-dark .hintv-tabbar-item{color:#5a7a9a!important}
.hintv-tabbar.is-dark .hintv-tabbar-ic{filter:grayscale(.7);opacity:.7}
.hintv-tabbar.is-dark .hintv-tabbar-item.is-active{color:#4a9eff!important}
.hintv-tabbar.is-dark .hintv-tabbar-item.is-active .hintv-tabbar-ic{filter:none;opacity:1}
.hintv-tabbar.is-dark .hintv-tabbar-item.is-active::before{left:0;right:0;height:2px;background:#4a9eff;border-radius:0}
/* 視聴に専念するモードでは隠す（余白も返す） */
body.pseudo-fs-active .hintv-tabbar,body.hinata-theater-active .hintv-tabbar,body.theater-mobile-active .hintv-tabbar,
body.sleep-active .hintv-tabbar,body.hinata-dim-active .hintv-tabbar,body.hintv-tv-on .hintv-tabbar,
html.hintv-tv-video .hintv-tabbar{display:none}
body.pseudo-fs-active,body.hinata-theater-active,body.theater-mobile-active,body.sleep-active,
body.hinata-dim-active,body.hintv-tv-on{--hintv-tabbar-h:0px;--hintv-tabbar-half:0px}

/* バーの高さぶん、ページ末尾と下に固定されている部品を持ち上げる */
html.hintv-has-tabbar body{padding-bottom:calc(var(--hintv-tabbar-h) + var(--hintv-tabbar-half))}
html.hintv-has-tabbar .hintv-gret{bottom:calc(12px + var(--hintv-tabbar-h) + var(--hintv-tabbar-half))}
html.hintv-has-tabbar .hintv-dzr-chip{bottom:calc(14px + var(--hintv-tabbar-h) + var(--hintv-tabbar-half))}
html.hintv-has-tabbar #hintv-live-banner{bottom:calc(16px + var(--hintv-tabbar-h) + var(--hintv-tabbar-half))!important}
html.hintv-has-tabbar .omhb-ev-toast{bottom:calc(24px + var(--hintv-tabbar-h) + var(--hintv-tabbar-half))}

/* 既定はスマホ幅だけ。PCでも出す設定のときは .is-desktop が付く */
@media (min-width:783px){
  .hintv-tabbar:not(.is-desktop){display:none}
  html.hintv-has-tabbar:not(.hintv-tabbar-desktop){--hintv-tabbar-h:0px;--hintv-tabbar-half:0px}
}
@media print{.hintv-tabbar{display:none}html.hintv-has-tabbar{--hintv-tabbar-h:0px;--hintv-tabbar-half:0px}}