/*
Theme Name: VENUS Child
Theme URI: https://example.com/
Description: Child theme for VENUS (tcd038). Safe custom CSS only.
Author: Akemi (with ChatGPT)
Author URI: https://example.com/
Template: venus_tcd038
Text Domain: venus-child
Version: 4.1.1
*/

/* ==========================
   共通・微調整
========================== */

/* Sparkle cursor が viewport に影響しないよう保険 */
canvas[style*="position:fixed"][style*="pointer-events:none"] {
  max-width: none !important;
  max-height: none !important;
}

/* スマホのタップ時の濃いハイライトを全体で弱める（必要範囲） */
.krc_calendar a,
#global_menu a,
#mobile_menu a,
#drawer_menu a {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}

/* （安全策）リンクのフォーカス輪郭は通常は消し、キーボード操作時だけ表示
   ※必要な場面だけ .is-keyboard などをJSで付与して使えます */
a:focus { outline: none; }
.is-keyboard a:focus { outline: 2px solid #4da3ff; outline-offset: 2px; }

/* ==========================
   モバイル・バーガー（見た目補強）
========================== */

/* 親テーマの #drawer_menu_button と、念のため .drawer_menu_button 両対応 */
#drawer_menu_button,
.drawer_menu_button {
  display: inline-block;
  width: 36px; height: 28px;
  position: relative;
  cursor: pointer;
}
#drawer_menu_button span,
.drawer_menu_button span {
  display: block;
  position: absolute;
  left: 0; right: 0;
  height: 3px;
  margin: 0 auto;
  background: #333;
  border-radius: 2px;
  transition: transform .25s ease, top .25s ease, opacity .2s ease;
}
#drawer_menu_button span:nth-child(1),
.drawer_menu_button span:nth-child(1) { top: 3px; }
#drawer_menu_button span:nth-child(2),
.drawer_menu_button span:nth-child(2) { top: 12px; }
#drawer_menu_button span:nth-child(3),
.drawer_menu_button span:nth-child(3) { top: 21px; }

/* ==========================
   Flickity（ギャラリー）
========================== */

.cast-gallery { width:100%; max-width:100%; margin:16px 0 28px; }
.cast-gallery .js-flickity { width:100%; }

/* セル */
.cast-gallery .js-flickity .gallery-cell {
  height:400px;
  margin-right:8px;
  overflow:hidden;
  border-radius:8px;
}

/* 画像フィット */
.cast-gallery .js-flickity .gallery-cell img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:8px;
}

/* PC:4 / SP:1 */
.cast-gallery .js-flickity .gallery-cell { width:25%; }
@media (max-width:657px){
  .cast-gallery .js-flickity .gallery-cell { width:100%; }
  .cast-gallery .js-flickity .gallery-cell img {
    height:auto; max-height:60vh; object-fit:contain;
  }
}

/* 未初期化フォールバック */
.cast-gallery .js-flickity:not(.flickity-enabled){
  display:flex; flex-wrap:wrap; gap:8px;
}
.cast-gallery .js-flickity:not(.flickity-enabled) .gallery-cell{
  flex:0 0 25%; max-width:25%;
}
@media (max-width:657px){
  .cast-gallery .js-flickity:not(.flickity-enabled) .gallery-cell{
    flex-basis:100%; max-width:100%;
  }
}

/* 矢印・ドット */
.cast-gallery .flickity-prev-next-button { width:28px; height:28px; }
.cast-gallery .flickity-prev-next-button .flickity-button-icon { left:6px; top:6px; width:16px; height:16px; }
.cast-gallery .flickity-page-dots { bottom:-18px; }
.cast-gallery .flickity-page-dots .dot { width:6px; height:6px; margin:0 4px; background:#888; opacity:.5; }
.cast-gallery .flickity-page-dots .dot.is-selected { background:#cb7684; opacity:1; }

/* ==========================
   スケジュール（FooTable）
   ─ トグル展開前提：横スクロールなしで安定表示 ─
========================== */

.table-scroll-schedule {
  overflow-x: visible;                  /* 横スクロールはさせず、FooTableの＋で展開 */
  -webkit-overflow-scrolling: touch;
}
.table-scroll-schedule table {
  min-width: 0;                         /* 固定幅を解除 */
  width: 100%;
  table-layout: fixed;                  /* セル幅を均等化 */
}

/* ── 見出しカラー（強制上書き） ── */
.krc_calendar .footable thead th {
  background-color: #d0d0d0 !important; /* ←お好みで */
  color: #fff !important;
  border: 2.5px solid #ccc !important;
  font-weight: bold !important;
  text-align: center !important;
}

/* 見出し内のリンクは“見た目テキスト化”してクリック不可（ソート誤作動防止） */
.krc_calendar .footable thead th a {
  color: #fff !important;
  text-decoration: none !important;
  pointer-events: none;                 /* ←ここが効き目！ */
  cursor: default;
}

/* 本文セル */
.krc_calendar .footable tbody td {
  background-color: #ffffff !important; /* 背景白で統一 */
  color: #333 !important;
  border: 1px solid #ddd !important;
  word-break: break-word;
  white-space: normal;
}
.krc_calendar .footable tbody tr:nth-child(even) td {
  background-color: #fafafa !important; /* 偶数行グレー */
}

/* トグルボタン＆詳細行 */
.footable-toggle { cursor: pointer; }
.footable .footable-row-detail-name { white-space: nowrap; }

/* ── スケジュール表内リンクの青い “縁取り” 無効化 ── */
.krc_calendar .footable,
.krc_calendar .footable th,
.krc_calendar .footable td { outline: none !important; }

.krc_calendar .footable a {
  color: inherit !important;              /* 文字色は周囲に合わせる */
  text-decoration: none !important;
  -webkit-tap-highlight-color: rgba(0,0,0,0); /* iOS青帯を消す */
}
.krc_calendar .footable a:focus,
.krc_calendar .footable a:focus-visible,
.krc_calendar .footable th:focus,
.krc_calendar .footable td:focus {
  outline: none !important;
  box-shadow: none !important;
}

/* ── 念のため：ソート系UIは非表示（JSを読んでなくても保険） ── */
.krc_calendar .footable .footable-sortable,
.krc_calendar .footable .footable-sort-indicator,
.krc_calendar .footable th.footable-sortable > a:after {
  display: none !important;
  content: none !important;
}
