/* ============================================================
   Omna テーマトークン
   - :root       昼モードの色・値
   - .night-mode 夜モードで上書き
   ============================================================ */

:root {
  /* テキスト */
  --clr-text:        #1a3a52;
  --clr-text-sub:    #2c5a7a;
  --clr-text-body:   #2a4a62;
  --clr-text-muted:  #607080;

  /* ラベル・見出し */
  --clr-label:       #2c5a7a;

  /* カード・背景 */
  --clr-card-bg:     rgba(238, 244, 250, 0.35);

  /* リンク */
  --clr-link:        #1a3a52;

  /* アクセント（ボーダー・ボタン） */
  --clr-accent:      #2c5a7a;
  --clr-accent-hover:#3a6a8a;
  --clr-accent-strong:#1a3a52;

  /* ボーダー */
  --clr-border:      #2c5a7a;
  --clr-border-hover:#1a3a52;

  /* シャドウ */
  --shadow-card:     rgba(26, 58, 82, 0.15);
  --shadow-card-night:rgba(0, 0, 0, 0.3);

  /* フォーム（contact） */
  --clr-input-bg:    #fff;
  --clr-input-text:  #1a3a52;
  --clr-input-border:#c0c8d0;
}

body.night-mode {
  --clr-text:        #e8e6e3;
  --clr-text-sub:    #a8a098;
  --clr-text-body:   #c8c4be;
  --clr-text-muted:  #808890;

  --clr-label:       #a8b8c8;

  --clr-card-bg:     rgba(25, 34, 48, 0.6);

  --clr-link:        #a8a098;

  --clr-accent:      #5a6a7a;
  --clr-accent-hover:#8a9aaa;
  --clr-accent-strong:#e0ddd8;

  --clr-border:      #5a6a7a;
  --clr-border-hover:#8a9aaa;

  --clr-shadow-card: rgba(0, 0, 0, 0.3);

  --clr-input-bg:    #1a2332;
  --clr-input-text:  #e0e0e0;
  --clr-input-border:#3a4a5a;
}

/* ============================================================
   トップページ専用：昼夜で完全に別レイアウトにするためのユーティリティ
   使い方:
     - 昼だけ表示したい要素 → class="top-day-only"
     - 夜だけ表示したい要素 → class="top-night-only"
   ============================================================ */
body:not(.night-mode) .top-night-only { display: none !important; }
body.night-mode .top-day-only         { display: none !important; }