/**
 * REBORN Brand Color System
 * ブランドロゴに基づく統一カラーパレット
 *
 * @version 2.1
 * @date 2025-11-13
 * @update-reason Cloudflareキャッシュ強制更新
 * @author Claude (Frontend Architect)
 * @description REBORNロゴのスカイブルー/デニムカラー (#40B4E5) を軸にした
 *              ブランドアイデンティティ統一カラーシステム
 */

:root {
  /* ============================================
     PRIMARY COLORS - REBORNブランドカラー
     ============================================ */

  /* Primary - ロゴ完全一致（背景・アクセント用） */
  --reborn-primary: #40B4E5;
  --reborn-primary-rgb: 64, 180, 229;

  /* Primary Dark - AA基準（ボタン・リンク用） */
  --reborn-primary-dark: #1E8FBF;
  --reborn-primary-dark-rgb: 30, 143, 191;

  /* Primary Darkest - AAA基準（重要テキスト用） */
  --reborn-primary-darkest: #1A7AA3;

  /* Primary Light - hover・背景用 */
  --reborn-primary-light: #69CBF0;
  --reborn-primary-lighter: #A8E1F7;
  --reborn-primary-lightest: #E3F6FC;

  /* ============================================
     ACCENT COLORS - アクセントカラー
     ============================================ */

  /* Accent - ロゴのオレンジ（CTAボタン・強調要素） */
  --reborn-accent: #FF8C42;
  --reborn-accent-dark: #E67535;
  --reborn-accent-light: #FFAB70;
  --reborn-accent-lightest: #FFD6B8;

  /* ============================================
     SEMANTIC COLORS - 意味的カラー
     ============================================ */

  /* Success */
  --success: #10b981;
  --success-light: #6ee7b7;
  --success-dark: #059669;

  /* Warning */
  --warning: #f59e0b;
  --warning-light: #fbbf24;
  --warning-dark: #d97706;

  /* Danger */
  --danger: #ef4444;
  --danger-light: #f87171;
  --danger-dark: #dc2626;

  /* Info - Primary と統一 */
  --info: var(--reborn-primary);
  --info-light: var(--reborn-primary-light);
  --info-dark: var(--reborn-primary-dark);

  /* ============================================
     NEUTRAL COLORS - ニュートラルカラー
     ============================================ */

  /* Gray Scale */
  --gray-50: #f9fafb;
  --gray-100: #f3f4f6;
  --gray-200: #e5e7eb;
  --gray-300: #d1d5db;
  --gray-400: #9ca3af;
  --gray-500: #6b7280;
  --gray-600: #4b5563;
  --gray-700: #374151;
  --gray-800: #1f2937;
  --gray-900: #111827;

  /* Text Colors */
  --text-primary: #111827;
  --text-secondary: #4b5563;
  --text-tertiary: #9ca3af;
  --text-inverse: #ffffff;

  /* Background Colors */
  --bg-primary: #ffffff;
  --bg-secondary: #f9fafb;
  --bg-tertiary: #f3f4f6;

  /* Border Colors */
  --border-light: #e5e7eb;
  --border-medium: #d1d5db;
  --border-dark: #9ca3af;

  /* ============================================
     COMPONENT COLORS - コンポーネント用カラー
     ============================================ */

  /* Buttons */
  --btn-primary-bg: var(--reborn-primary);
  --btn-primary-hover: var(--reborn-primary-dark);
  --btn-primary-active: var(--reborn-primary-darkest);
  --btn-primary-text: var(--text-inverse);

  --btn-accent-bg: var(--reborn-accent);
  --btn-accent-hover: var(--reborn-accent-dark);
  --btn-accent-text: var(--text-inverse);

  /* Links */
  --link-default: var(--reborn-primary-dark);
  --link-hover: var(--reborn-primary-darkest);
  --link-visited: var(--reborn-primary-darkest);

  /* Headers */
  --header-bg: var(--reborn-primary);
  --header-text: var(--text-inverse);
  --header-icon: var(--text-inverse);

  /* Navigation */
  --nav-bg: var(--reborn-primary);
  --nav-text: var(--text-inverse);
  --nav-hover: var(--reborn-primary-dark);
  --nav-active: var(--reborn-primary-darkest);

  /* Cards */
  --card-bg: var(--bg-primary);
  --card-border: var(--border-light);
  --card-shadow: rgba(64, 180, 229, 0.1);

  /* Badges */
  --badge-primary: var(--reborn-primary);
  --badge-accent: var(--reborn-accent);
  --badge-text: var(--text-inverse);

  /* Chat Bubbles */
  --chat-sent-bg: var(--reborn-primary);
  --chat-sent-text: var(--text-inverse);
  --chat-received-bg: var(--gray-100);
  --chat-received-text: var(--text-primary);

  /* ============================================
     UTILITY COLORS - ユーティリティカラー
     ============================================ */

  /* Shadows */
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1);

  /* Overlays */
  --overlay-light: rgba(0, 0, 0, 0.5);
  --overlay-dark: rgba(0, 0, 0, 0.75);

  /* Focus Ring */
  --focus-ring: 0 0 0 3px rgba(64, 180, 229, 0.3);
}

/* ============================================
   UTILITY CLASSES - ユーティリティクラス
   ============================================ */

/* Background Colors */
.bg-primary { background-color: var(--reborn-primary) !important; }
.bg-primary-dark { background-color: var(--reborn-primary-dark) !important; }
.bg-primary-light { background-color: var(--reborn-primary-light) !important; }
.bg-accent { background-color: var(--reborn-accent) !important; }

/* Text Colors */
.text-primary { color: var(--reborn-primary) !important; }
.text-primary-dark { color: var(--reborn-primary-dark) !important; }
.text-accent { color: var(--reborn-accent) !important; }

/* Border Colors */
.border-primary { border-color: var(--reborn-primary) !important; }
.border-primary-dark { border-color: var(--reborn-primary-dark) !important; }

/* Button Styles */
.btn-reborn-primary {
  background-color: var(--btn-primary-bg) !important;
  color: var(--btn-primary-text) !important;
  border-color: var(--btn-primary-bg) !important;
}

.btn-reborn-primary:hover {
  background-color: var(--btn-primary-hover) !important;
  border-color: var(--btn-primary-hover) !important;
}

.btn-reborn-primary:active {
  background-color: var(--btn-primary-active) !important;
  border-color: var(--btn-primary-active) !important;
}

.btn-reborn-accent {
  background-color: var(--btn-accent-bg) !important;
  color: var(--btn-accent-text) !important;
  border-color: var(--btn-accent-bg) !important;
}

.btn-reborn-accent:hover {
  background-color: var(--btn-accent-hover) !important;
  border-color: var(--btn-accent-hover) !important;
}

/* Link Styles */
.link-reborn {
  color: var(--link-default) !important;
  text-decoration: none;
}

.link-reborn:hover {
  color: var(--link-hover) !important;
  text-decoration: underline;
}

/* Badge Styles */
.badge-reborn-primary {
  background-color: var(--badge-primary) !important;
  color: var(--badge-text) !important;
}

.badge-reborn-accent {
  background-color: var(--badge-accent) !important;
  color: var(--badge-text) !important;
}