/* font_shibi: 命盤テーブル共通の右寄せ・上揃え（旧サイト互換）
   shibi_simple_unit.php の各宮セルや shibi_main_unit.php で使用 */
.font_shibi td {
   text-align: right;
   vertical-align: top;
}
/* 簡易命盤の宮セル: 入れ子テーブル（左:星名 / 右:十二支+宮名） */
#base_shibi .shibi-palace {
   line-height: 1.3;
}

/* 命盤グリッドの行高さ統一
   2段目（福徳・疾厄など星が多い行）に合わせて全 td を同じ高さに揃える。
   星数の少ない宮でも縦書き列が同じ長さで表示され、グリッドが整う。 */
#base_shibi table > tbody > tr > td {
   height: 7em;
   vertical-align: top;
}

/* 星名エリア: 縦書きの各星を「右から左」に並べる
   表示例（廉貞・食狼・天鉞）:
      天 食 廉
      鉞 狼 貞
*/
#base_shibi .shibi-stars-wrap {
   display: flex;
   flex-direction: row-reverse;   /* 右から左に並べる */
   flex-wrap: wrap-reverse;       /* 折返し時も右から左 */
   /* 注意: row-reverse 状態では justify-content の方向が反転する。
      flex-start を指定すると視覚的に「右端」寄せ（main-axis の start = 右端）。
      flex-end を指定すると視覚的に左端寄せになるため逆効果。 */
   justify-content: flex-start;
   align-items: flex-start;
   width: 100%;
   min-height: 3em;
}
#base_shibi .shibi-star {
   writing-mode: vertical-rl;     /* 縦書き */
   white-space: nowrap;
   margin-left: 0.15em;           /* 縦書きでは「列間隔」 */
   line-height: 1.2;
}
/* 命盤四化星ラベル（禄/権/科/忌）
   親 .shibi-star が writing-mode: vertical-rl のため、inline のまま
   縦書きフローに乗せれば星名直下に自然に流れる。
   display:block を指定すると縦書きフローが崩れるため inline-block を使用。
   min-height で四化星なしの空 span でも 1 文字分のスペースを確保し、
   四化星あり/なしで隣り合う星の縦位置がずれないようにする。 */
#base_shibi .shibi-sika {
   display: inline-block;
   min-height: 1em;
   font-size: 0.7em;
   color: #c00;
   line-height: 1.2;
}

/* 十二支・宮名エリア（右側）も縦書き */
#base_shibi .shibi-meta-wrap {
   display: flex;
   flex-direction: row;
   justify-content: flex-end;
   align-items: flex-start;
}
#base_shibi .shibi-kanshi {
   writing-mode: vertical-rl;
   white-space: nowrap;
   color: #666;
   font-size: 0.85em;
   margin-left: 0.2em;
}
#base_shibi .shibi-guname {
   writing-mode: vertical-rl;
   white-space: nowrap;
   font-weight: bold;
   margin-left: 0.2em;
}

@page { size: 210mm 297mm }
@media print {
   html{
      font-size:10px;
   }
   #base_shibi table{
      font-size:10px;
      margin:0;
      padding:0;
   }

   #base_shibi table tr{
      font-size:10px;
      margin:0;
      padding:0;
   }

   #base_shibi table tr td{
      font-size:10px;
      margin:0;
      padding-left:1;
      padding-right:1;
   }
}

@media screen and (max-width:576px){

   #base_shibi table{
      font-size:6px;
      margin:0;
      padding:0;
   }

   #base_shibi table tr{
      font-size:6px;
      margin:0;
      padding:0;
   }

   #base_shibi table tr td{
      font-size:6px;
      margin:0;
      padding:0;
   }

}

@media  screen and (max-width:768px){

   #base_shibi table{
      font-size:6px;
      margin:0;
      padding:0;
   }

   #base_shibi table tr{
      font-size:6px;
      margin:0;
      padding:0;
   }

   #base_shibi table tr td{
      font-size:6px;
      margin:0;
      padding:0;
   }

}

@media screen and (max-width:992px){

   #base_shibi table{
      font-size:8px;
      margin:0;
      padding:0;
   }

   #base_shibi table tr{
      font-size:8px;
      margin:0;
      padding:0;
   }

   #base_shibi table tr td{
      font-size:8px;
      margin:0;
      padding:0;
   }

}

@media screen and (max-width:1200px){


}

@media screen and (max-width:1400px){


}

/* ============================================================
   shibi_main_unit.php フル版グリッド共通 CSS
   （2026-04-28 共通化: practice_reading_v3.php から移管 / senjutsu でも共有）
   Ver2 では Bootstrap の table-bordered + bd_* / nbd_* を使うが、Ver3 では
   Bootstrap を読まないため最低限の border / 高さ / フォント等を再定義する。
   ============================================================ */
#base_shibi table { border-collapse:collapse; width:100%; }
#base_shibi table.table-bordered td { border:0.5px solid var(--hairline); }
#base_shibi table.table-borderless td { border:none; }
#base_shibi td.bd_left   { border-left:0.5px solid var(--sumi) !important; }
#base_shibi td.bd_right  { border-right:0.5px solid var(--sumi) !important; }
#base_shibi td.bd_top    { border-top:0.5px solid var(--sumi) !important; }
#base_shibi td.bd_bottom { border-bottom:0.5px solid var(--sumi) !important; }
#base_shibi td.nbd_left   { border-left:none !important; }
#base_shibi td.nbd_right  { border-right:none !important; }
#base_shibi td.nbd_top    { border-top:none !important; }
#base_shibi td.nbd_bottom { border-bottom:none !important; }
#base_shibi td.tblbd     { border:0.5px solid var(--sumi); padding:0; }
#base_shibi .font_shibi td { text-align:right; vertical-align:top; }
/* Bootstrap .table-sm 互換（セル padding 縮小）*/
#base_shibi .table-sm td,
#base_shibi .table-sm th {
   padding: 2px 4px;
}
/* Bootstrap .table-light 互換（宮セル背景色）*/
#base_shibi .table-light {
   background-color: var(--washi, #f8f4ef);
}
/* 外側テーブルの宮セル高さ統一（shibi.css の height:7em を上書き） */
#base_shibi > div > table > tbody > tr > td {
   height: auto;
   min-height: 0;
   vertical-align: top;
}
/* 内側テーブル（宮内）の行高さ均一化 */
#base_shibi .font_shibi > tbody > tr > td,
#base_shibi table.table-borderless td {
   height: 1.6em;
   line-height: 1.6;
   padding: 1px 3px;
   vertical-align: top;
   white-space: nowrap;
}
/* 外側テーブルのセルサイズ均等化 */
#base_shibi table.table-bordered {
   table-layout: fixed;
}
#base_shibi table.table-bordered > tbody > tr > td {
   width: 25%;
   padding: 4px;
   vertical-align: top;
}
/* 文字サイズ */
#base_shibi .font_shibi {
   font-size: 0.75rem;
}
/* 命盤ヘッダ（card.shadow-sm）*/
#base_shibi .card {
   background: transparent;
   border: none;
   padding: 0;
   margin-bottom: 8px;
}
#base_shibi .card.shadow-sm {
   box-shadow: none;
}
/* table-responsive 互換 */
#base_shibi .table-responsive {
   overflow-x: auto;
   -webkit-overflow-scrolling: touch;
}
/* 中央セル（五行局・生年月日・対象日時）を中央寄せ */
#base_shibi .shibi-center-cell {
   text-align: center !important;
}
#base_shibi .shibi-center-cell table.table-borderless td {
   text-align: center;
   white-space: normal;
}
/* 命盤フォント統一（Ver3 明朝で統一・select / button も含める） */
#base_shibi,
#base_shibi table,
#base_shibi td,
#base_shibi th,
#base_shibi span,
#base_shibi b,
#base_shibi div,
#base_shibi select,
#base_shibi button {
   font-family: "Shippori Mincho B1", "Noto Serif JP", YuMincho, "Yu Mincho", serif !important;
}
/* 縦書きセル（干支・宮名）の高さ制約を解除 + 縦書き描画 */
#base_shibi td.shibi-vert-cell {
   height: auto !important;
   min-height: 0 !important;
   width: 1.4em !important;
   padding: 2px !important;
   vertical-align: middle !important;
}
#base_shibi td.shibi-vert-cell > div.shibi-vert-inner {
   height: auto !important;
   min-height: 2.4em;
   display: block !important;
   writing-mode: vertical-rl;
   text-orientation: mixed;
   font-size: .8rem;
   white-space: nowrap;
   margin: 0 auto;
}
/* 命盤テーブルラッパ（横スクロール用・外枠は table.table-bordered の cell border が担う） */
#base_shibi .shibi-board-wrap {
   overflow-x: auto;
   -webkit-overflow-scrolling: touch;
}
