/*
Theme Name: kai-rinkou
Description: Lightning テーマの子テーマ
Template: lightning
Version: 1.0.0
Author: Your Name
*/

/* 
親テーマのスタイルは functions.php で読み込みます
子テーマ独自のスタイルをここに追加してください
*/

/* ==================================================
 * 縦書き対応CSS（Figmaデザイン準拠）
 * ================================================== */

/* 縦書きクラス - 基本設定 */
.kai-rinkou-vertical {
  writing-mode: vertical-rl;
  /* 右から左に縦書き */
  text-orientation: upright;
  /* 文字を正立させる */
  font-feature-settings: "vkrn";
  /* 縦書き用カーニング */
  -webkit-text-orientation: upright;
  -webkit-writing-mode: vertical-rl;
}

/* 縦書き - 混在文字対応 */
.kai-rinkou-vertical--mixed {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  /* 漢字・ひらがなは正立、英数字は横向き */
  -webkit-text-orientation: mixed;
  -webkit-writing-mode: vertical-rl;
}

/* 縦書き用コンテナ */
.kai-rinkou-vertical-container {
  height: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  display: flex;
  flex-direction: row-reverse;
  /* 右から左に配置 */
}

/* 縦書き用行間・文字間調整 */
.kai-rinkou-vertical-title {
  writing-mode: vertical-rl;
  text-orientation: upright;
  letter-spacing: 0.2em;
  line-height: 1.8;
  margin: 0 1em 0 0;
  -webkit-writing-mode: vertical-rl;
  -webkit-text-orientation: upright;
}

/* 縦書き用段落 */
.kai-rinkou-vertical-text {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  line-height: 2.0;
  letter-spacing: 0.1em;
  margin: 0 2em 0 0;
  -webkit-writing-mode: vertical-rl;
  -webkit-text-orientation: mixed;
}

/* 縦書き用見出し調整 */
.kai-rinkou-vertical-heading {
  writing-mode: vertical-rl;
  text-orientation: upright;
  font-weight: 700;
  letter-spacing: 0.25em;
  line-height: 1.6;
  margin: 0 1.5em 0 0;
  -webkit-writing-mode: vertical-rl;
  -webkit-text-orientation: upright;
}

/* 縦書き用フォント設定 */
.kai-rinkou-vertical-font {
  font-feature-settings: "vpal", "vkrn";
  /* 縦書き用プロポーショナル・カーニング */
}

/* レスポンシブ対応 - 縦書きスタイル */
@media (max-width: 768px) {

  .kai-rinkou-vertical,
  .kai-rinkou-vertical-title,
  .kai-rinkou-vertical-text,
  .kai-rinkou-vertical-heading {
    writing-mode: horizontal-tb;
    /* スマホでは横書きに */
    text-orientation: mixed;
    -webkit-writing-mode: horizontal-tb;
    -webkit-text-orientation: mixed;
  }

  .kai-rinkou-vertical-container {
    flex-direction: column;
    overflow-x: hidden;
    overflow-y: auto;
  }
}