/**
 * Tango Puzzle Game - CSS Variables & Themes
 * 
 * 機能概要:
 * - 基本パレットと共通変数の定義 (:root)
 * - ライトモード各テーマ (Purple, Mint, Peach) のCSS変数定義
 * - ダークモード各テーマ (Midnight, Forest, Crimson) のCSS変数定義
 */

:root {
    --bg-color: #f0f2f5;
    --panel-bg: #ffffff;
    --primary: #6c5ce7;
    --accent: #00b894;
    --danger: #ff7675;
    --text: #2d3436;
    --text-muted: #636e72;
    --cell-bg: #f1f2f6;
    --cell-locked: #dfe6e9;
    --sun-color: #ff9f43; 
    --moon-color: #5f27cd; 
    --hint-eq: #00b894;
    --hint-diff: #ff7675;
    --control-bg: #ffffff;
    --control-border: #dfe6e9;
    --board-bg: #ffffff;
    
    --cell-size: 45px;
    --gap-size: 14px;
    --board-padding: 12px;
}

/* ライトテーマ: Purple (default) */
[data-theme="light-purple"] {
    --bg-color: #f0f2f5;
    --panel-bg: #ffffff;
    --primary: #6c5ce7;
    --accent: #00b894;
    --text: #2d3436;
    --text-muted: #636e72;
    --cell-bg: #f1f2f6;
    --cell-locked: #dfe6e9;
    --sun-color: #ff9f43;
    --moon-color: #5f27cd;
    --control-bg: #ffffff;
    --control-border: #dfe6e9;
    --board-bg: #ffffff;
}

/* ライトテーマ: Mint */
[data-theme="light-ocean"] {
    --bg-color: #f5fffe;
    --panel-bg: #ffffff;
    --primary: #14b8a6;
    --accent: #06b6d4;
    --text: #1e293b;
    --text-muted: #64748b;
    --cell-bg: #f0fdfa;
    --cell-locked: #ccfbf1;
    --sun-color: #f59e0b;
    --moon-color: #0891b2;
    --control-bg: #ffffff;
    --control-border: #99f6e4;
    --board-bg: #ffffff;
}

/* ライトテーマ: Peach */
[data-theme="light-rose"] {
    --bg-color: #fff7ed;
    --panel-bg: #ffffff;
    --primary: #ea580c;
    --accent: #f97316;
    --text: #1c1917;
    --text-muted: #78716c;
    --cell-bg: #fff7ed;
    --cell-locked: #fed7aa;
    --sun-color: #dc2626;
    --moon-color: #c2410c;
    --control-bg: #ffffff;
    --control-border: #fdba74;
    --board-bg: #ffffff;
}

/* ダークテーマ: Midnight */
[data-theme="dark-midnight"] {
    --bg-color: #0f0f1a;
    --panel-bg: #1a1a2e;
    --primary: #818cf8;
    --accent: #34d399;
    --danger: #f87171;
    --text: #ffffff;
    --text-muted: #b0b0b0;
    --cell-bg: #252540;
    --cell-locked: #3a3a5c;
    --sun-color: #fcd34d;
    --moon-color: #a78bfa;
    --hint-eq: #34d399;
    --hint-diff: #f87171;
    --control-bg: #1a1a2e;
    --control-border: #252540;
    --board-bg: #1a1a2e;
}

/* ダークテーマ: Forest */
[data-theme="dark-forest"] {
    --bg-color: #0d1117;
    --panel-bg: #161b22;
    --primary: #3fb950;
    --accent: #58a6ff;
    --danger: #f85149;
    --text: #f0f6fc;
    --text-muted: #8b949e;
    --cell-bg: #21262d;
    --cell-locked: #30363d;
    --sun-color: #ffd33d;
    --moon-color: #58a6ff;
    --hint-eq: #3fb950;
    --hint-diff: #f85149;
    --control-bg: #21262d;
    --control-border: #30363d;
    --board-bg: #161b22;
}

/* ダークテーマ: Crimson */
[data-theme="dark-crimson"] {
    --bg-color: #1a1a1a;
    --panel-bg: #262626;
    --primary: #ef4444;
    --accent: #fbbf24;
    --danger: #ef4444;
    --text: #fafafa;
    --text-muted: #a3a3a3;
    --cell-bg: #333333;
    --cell-locked: #444444;
    --sun-color: #fbbf24;
    --moon-color: #f87171;
    --hint-eq: #fbbf24;
    --hint-diff: #f87171;
    --control-bg: #333333;
    --control-border: #444444;
    --board-bg: #262626;
}