/* 落ち着いたカラーパレット - グローバルオーバーライド */

/* カラー変数定義 */
:root {
    --navy-primary: #1e293b;
    --navy-secondary: #334155;
    --deep-blue: #1e40af;
    --deep-blue-light: #3b82f6;
    --accent-orange: #ea580c;
    --accent-orange-light: #fb923c;
    --bg-primary: #ffffff;
    --bg-secondary: #f8fafc;
    --bg-tertiary: #e2e8f0;
    --text-primary: #1e293b;
    --text-secondary: #475569;
    --text-muted: #64748b;
}

/* 基本要素のオーバーライド */
body {
    background-color: var(--bg-secondary) !important;
    color: var(--text-primary) !important;
}

/* ヘッダー */
header {
    background-color: var(--bg-primary) !important;
    border-bottom: 1px solid var(--bg-tertiary) !important;
}

/* プライマリーカラーの置き換え */
.text-primary {
    color: var(--deep-blue) !important;
}

.bg-primary {
    background-color: var(--deep-blue) !important;
}

.border-primary {
    border-color: var(--deep-blue) !important;
}

/* セカンダリーカラーの置き換え */
.text-secondary {
    color: var(--text-secondary) !important;
}

.bg-secondary {
    background-color: var(--accent-orange) !important;
}

/* アクセントカラーの置き換え */
.text-accent {
    color: var(--accent-orange) !important;
}

.bg-accent {
    background-color: var(--accent-orange) !important;
}

/* グレーカラーの調整 */
.text-gray-700 {
    color: var(--text-secondary) !important;
}

.text-gray-600 {
    color: var(--text-muted) !important;
}

.bg-gray-50 {
    background-color: var(--bg-secondary) !important;
}

.bg-gray-100 {
    background-color: var(--bg-tertiary) !important;
}

/* ボタンスタイルの改善 */
.bg-primary:hover {
    background-color: var(--deep-blue-light) !important;
}

.bg-secondary:hover {
    background-color: var(--accent-orange-light) !important;
}

/* Hero Section用グラデーション */
.bg-gradient-to-br.from-blue-900 {
    background: linear-gradient(to bottom right, var(--navy-primary), var(--deep-blue)) !important;
}

.bg-gradient-to-br.via-blue-800 {
    background: linear-gradient(to bottom right, var(--navy-primary), var(--navy-secondary), var(--deep-blue)) !important;
}

/* 黄色アクセントをオレンジアクセントに変更 */
.text-yellow-400 {
    color: var(--accent-orange) !important;
}

.bg-yellow-400 {
    background-color: var(--accent-orange) !important;
}

/* 赤色をオレンジに変更 */
.bg-red-600 {
    background-color: var(--accent-orange) !important;
}

.bg-red-600:hover {
    background-color: var(--accent-orange-light) !important;
}

/* ブルー系の統一 */
.bg-blue-800:hover {
    background-color: var(--navy-primary) !important;
}

.text-blue-800 {
    color: var(--navy-primary) !important;
}

/* 機能カード専用スタイル */
.feature-card {
    background-color: var(--bg-primary) !important;
    border: 1px solid var(--bg-tertiary) !important;
    box-shadow: 0 4px 6px -1px rgba(30, 41, 59, 0.1), 0 2px 4px -1px rgba(30, 41, 59, 0.06) !important;
}

.feature-card:hover {
    border-color: var(--deep-blue) !important;
    box-shadow: 0 10px 15px -3px rgba(30, 41, 59, 0.1), 0 4px 6px -2px rgba(30, 41, 59, 0.05) !important;
}

/* ブルー系カラーの統一 */
.text-blue-700 {
    color: var(--deep-blue) !important;
}

.text-blue-800 {
    color: var(--navy-primary) !important;
}

.bg-blue-50 {
    background: linear-gradient(135deg, rgba(30, 64, 175, 0.05), rgba(30, 41, 59, 0.05)) !important;
}

.bg-blue-100 {
    background: linear-gradient(135deg, rgba(30, 64, 175, 0.1), rgba(30, 41, 59, 0.1)) !important;
}

/* グリーン系の調整 */
.bg-green-50 {
    background: linear-gradient(135deg, rgba(30, 64, 175, 0.03), rgba(52, 65, 85, 0.05)) !important;
}

.text-green-700 {
    color: var(--deep-blue) !important;
}

.text-green-800 {
    color: var(--navy-primary) !important;
}

/* オレンジ系の統一 */
.bg-orange-50 {
    background: linear-gradient(135deg, rgba(234, 88, 12, 0.05), rgba(251, 146, 60, 0.05)) !important;
}

.text-orange-700 {
    color: var(--accent-orange) !important;
}

.text-orange-800 {
    color: var(--accent-orange) !important;
}

/* 他の色系統も統一 */
.text-purple-700,
.text-purple-800 {
    color: var(--navy-secondary) !important;
}

.text-teal-700,
.text-teal-800 {
    color: var(--deep-blue) !important;
}

.text-indigo-700,
.text-indigo-800 {
    color: var(--navy-primary) !important;
}

/* 背景グラデーション */
.bg-gradient-to-br.from-gray-50 {
    background: linear-gradient(to bottom right, var(--bg-secondary), var(--bg-primary)) !important;
}

/* チェックアイコンの色統一 */
.text-blue-500,
.text-green-500,
.text-orange-500,
.text-purple-500,
.text-teal-500,
.text-indigo-500 {
    color: var(--deep-blue) !important;
}