/* ================================================
   栖王ヴァルハラ３丁目 統一カラーパレット
   Created: 2025
   ================================================ */

:root {
  /* メインカラーパレット */
  --primary-color: #fd7e14;           /* メインオレンジ */
  --primary-hover: #e67e22;           /* オレンジホバー */
  --primary-gradient-start: #fd7e14;  /* グラデーション開始 */
  --primary-gradient-end: #ff922b;    /* グラデーション終了 */
  
  /* アクセントカラー */
  --link-color: #ba4165;              /* リンクカラー（ローズ） */
  --link-hover: #a03857;              /* リンクホバー */
  
  /* ニュートラルカラー */
  --dark-text: #212529;               /* ダークテキスト */
  --medium-text: #495057;             /* ミディアムテキスト */
  --light-text: #6c757d;              /* ライトテキスト */
  --muted-text: #999999;              /* ミュートテキスト */
  
  /* 背景カラー */
  --bg-primary: #ffffff;              /* メイン背景 */
  --bg-secondary: #f8f9fa;            /* セカンダリ背景 */
  --bg-tertiary: #ebe3de;             /* サイト背景（ベージュ） */
  --bg-accent: #f2eee6;               /* アクセント背景 */
  
  /* ボーダー・区切り線 */
  --border-light: #e9ecef;            /* ライトボーダー */
  --border-medium: #dee2e6;           /* ミディアムボーダー */
  --border-dark: #cccccc;             /* ダークボーダー */
  
  /* 状態カラー */
  --success-color: #28a745;           /* 成功 */
  --warning-color: #ffc107;           /* 警告 */
  --danger-color: #dc3545;            /* エラー */
  --info-color: #007bff;              /* 情報 */
  
  /* シャドウ */
  --shadow-light: 0 2px 8px rgba(0,0,0,0.1);
  --shadow-medium: 0 4px 12px rgba(0,0,0,0.15);
  --shadow-heavy: 0 8px 24px rgba(0,0,0,0.2);
  --shadow-primary: 0 2px 8px rgba(253, 126, 20, 0.25);
  
  /* グラデーション */
  --gradient-primary: linear-gradient(135deg, var(--primary-gradient-start) 0%, var(--primary-gradient-end) 100%);
  --gradient-background: linear-gradient(to right, var(--bg-secondary), var(--bg-primary));
  
  /* トランジション */
  --transition-fast: 0.2s ease;
  --transition-normal: 0.3s ease;
  --transition-slow: 0.5s ease;
}

/* ダークモード対応（将来的な拡張用） */
@media (prefers-color-scheme: dark) {
  :root {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #0d1117;
    --dark-text: #f0f6fc;
    --medium-text: #c9d1d9;
    --light-text: #8b949e;
    --border-light: #30363d;
    --border-medium: #21262d;
  }
}

/* カラーユーティリティクラス */
.text-primary { color: var(--primary-color) !important; }
.text-link { color: var(--link-color) !important; }
.text-dark { color: var(--dark-text) !important; }
.text-medium { color: var(--medium-text) !important; }
.text-light { color: var(--light-text) !important; }
.text-muted { color: var(--muted-text) !important; }

.bg-primary { background-color: var(--bg-primary) !important; }
.bg-secondary { background-color: var(--bg-secondary) !important; }
.bg-tertiary { background-color: var(--bg-tertiary) !important; }
.bg-accent { background-color: var(--bg-accent) !important; }

.border-light { border-color: var(--border-light) !important; }
.border-medium { border-color: var(--border-medium) !important; }
.border-dark { border-color: var(--border-dark) !important; }

.shadow-light { box-shadow: var(--shadow-light) !important; }
.shadow-medium { box-shadow: var(--shadow-medium) !important; }
.shadow-heavy { box-shadow: var(--shadow-heavy) !important; }
.shadow-primary { box-shadow: var(--shadow-primary) !important; }

.gradient-primary { background: var(--gradient-primary) !important; }
.gradient-background { background: var(--gradient-background) !important; } 