/**
 * diagnosis-quiz-colors.css
 * カラーテーマ設定専用ファイル（分離・修正版）
 */

/* ==============================================
   カラーテーマ変数定義
   ============================================== */

:root {
    /* メインカラーテーマ - デフォルト（紫系） */
    --dq-primary-start: #667eea;
    --dq-primary-end: #764ba2;
    --dq-primary-alpha: rgba(102, 126, 234, 0.3);
    
    /* アクセントカラー */
    --dq-accent-gold: #ffd700;
    --dq-accent-warning: #ff6b6b;
    --dq-accent-success: #10b981;
    --dq-accent-info: #3b82f6;
    
    /* テキストカラー */
    --dq-text-primary: #ffffff;
    --dq-text-secondary: rgba(255, 255, 255, 0.9);
    --dq-text-muted: rgba(255, 255, 255, 0.8);
    --dq-text-dark: #1f2937;
    --dq-text-light: #6b7280;
    
    /* 結果カード用グラデーション */
    --dq-result-card-start: #8B5CF6;
    --dq-result-card-end: #EC4899;
    --dq-result-card-alpha: rgba(139, 92, 246, 0.3);
    
    /* ロックメッセージ用グラデーション */
    --dq-locked-start: #ff4757;
    --dq-locked-end: #ff6b7a;
    --dq-locked-alpha: rgba(255, 71, 87, 0.3);
    
    /* ボタンカラー */
    --dq-button-gradient-start: #ff6b6b;
    --dq-button-gradient-end: #feca57;
    --dq-button-email: #3b82f6;
    --dq-button-line: #10b981;
    
    /* 背景・透明度 */
    --dq-card-bg: rgba(255, 255, 255, 0.1);
    --dq-card-border: rgba(255, 255, 255, 0.2);
    --dq-backdrop-blur: blur(10px);
    
    /* セクション背景色 */
    --dq-features-bg: #f8fafc;
    --dq-recommendations-bg: #ebf8ff;
    --dq-monetization-bg: #f0fdf4;
    --dq-result-content-bg: #ffffff;
}

/* ==============================================
   メインカラーテーマ適用
   ============================================== */

/* メインコンテナ背景 */
.diagnosis-quiz-container,
.business-ai-enhanced {
    background: linear-gradient(135deg, var(--dq-primary-start) 0%, var(--dq-primary-end) 100%) !important;
    color: var(--dq-text-primary) !important;
}

/* カード背景 */
.diagnosis-quiz-card {
    background: var(--dq-card-bg) !important;
    border: 1px solid var(--dq-card-border) !important;
    backdrop-filter: var(--dq-backdrop-blur) !important;
}

/* ヘッダーテキスト */
.diagnosis-quiz-title {
    color: var(--dq-text-primary) !important;
}

.diagnosis-quiz-subtitle {
    color: var(--dq-text-secondary) !important;
}

.diagnosis-quiz-description {
    color: var(--dq-text-muted) !important;
}

/* ビジネスタイプエリア */
.business-types-preview {
    background: var(--dq-card-bg) !important;
    border: 1px solid var(--dq-card-border) !important;
}

.business-types-preview h2 {
    color: var(--dq-text-primary) !important;
}

.business-types-preview p {
    color: var(--dq-text-secondary) !important;
}

/* アイコンアイテム */
.business-icon-item,
.diagnosis-quiz-type-item {
    background: var(--dq-card-bg) !important;
    border: 1px solid var(--dq-card-border) !important;
}

.business-icon-item:hover,
.diagnosis-quiz-type-item:hover {
    background: rgba(255, 255, 255, 0.2) !important;
}

.business-icon-item i,
.diagnosis-quiz-type-item i {
    color: var(--dq-accent-gold) !important;
}

.business-icon-item span,
.diagnosis-quiz-type-item span,
.business-icon-item p,
.diagnosis-quiz-type-item p {
    color: var(--dq-text-primary) !important;
}

/* スタートボタン */
.diagnosis-quiz-start-button {
    background: linear-gradient(45deg, var(--dq-button-gradient-start), var(--dq-button-gradient-end)) !important;
    color: var(--dq-text-primary) !important;
    box-shadow: 0 8px 25px rgba(255, 107, 107, 0.3) !important;
}

.diagnosis-quiz-start-button:hover {
    box-shadow: 0 12px 35px rgba(255, 107, 107, 0.4) !important;
}

/* 進捗バー */
.diagnosis-quiz-progress-header {
    color: var(--dq-text-secondary) !important;
}

.diagnosis-quiz-progress-bar,
.diagnosis-quiz-progress-bar-bg {
    background: rgba(255, 255, 255, 0.2) !important;
}

.diagnosis-quiz-progress-indicator,
.diagnosis-quiz-progress-bar-fill {
    background: linear-gradient(90deg, var(--dq-accent-gold), #feca57) !important;
}

.diagnosis-quiz-progress-text {
    color: var(--dq-text-muted) !important;
}

/* 質問セクション */
.diagnosis-quiz-question-container {
    background: var(--dq-card-bg) !important;
    border: 1px solid var(--dq-card-border) !important;
}

.diagnosis-quiz-question-text {
    color: var(--dq-text-primary) !important;
}

/* 選択肢 */
.diagnosis-quiz-choice,
.diagnosis-quiz-answer-option {
    background: var(--dq-card-bg) !important;
    color: var(--dq-text-primary) !important;
    border: 2px solid transparent !important;
}

.diagnosis-quiz-choice:hover,
.diagnosis-quiz-answer-option:hover {
    background: rgba(255, 255, 255, 0.2) !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
}

.diagnosis-quiz-choice input[type="radio"]:checked + .diagnosis-quiz-choice-text,
.diagnosis-quiz-answer-option.selected {
    background: rgba(255, 215, 0, 0.3) !important;
    border-color: var(--dq-accent-gold) !important;
    color: var(--dq-accent-gold) !important;
    box-shadow: 0 4px 12px rgba(255, 215, 0, 0.3) !important;
}

.diagnosis-quiz-choice .check-icon,
.diagnosis-quiz-answer-option .check-icon {
    color: var(--dq-accent-gold) !important;
}

.diagnosis-quiz-choice input[type="radio"]:checked + .diagnosis-quiz-choice-text:after {
    background-color: var(--dq-accent-gold) !important;
}

/* エラー */
.diagnosis-quiz-error {
    color: var(--dq-accent-warning) !important;
}

/* ナビゲーションボタン */
.diagnosis-quiz-prev-btn,
.diagnosis-quiz-nav-button.prev {
    background: rgba(255, 255, 255, 0.2) !important;
    color: var(--dq-text-primary) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
}

.diagnosis-quiz-prev-btn:hover,
.diagnosis-quiz-nav-button.prev:hover {
    background: rgba(255, 255, 255, 0.3) !important;
}

.diagnosis-quiz-next-btn,
.diagnosis-quiz-submit-btn,
.diagnosis-quiz-nav-button.next {
    background: linear-gradient(45deg, var(--dq-button-gradient-start), var(--dq-button-gradient-end)) !important;
    color: var(--dq-text-primary) !important;
    box-shadow: 0 4px 12px rgba(255, 107, 107, 0.3) !important;
}

.diagnosis-quiz-next-btn:hover,
.diagnosis-quiz-submit-btn:hover,
.diagnosis-quiz-nav-button.next:hover {
    box-shadow: 0 6px 20px rgba(255, 107, 107, 0.4) !important;
}

.diagnosis-quiz-restart-btn {
    background: linear-gradient(135deg, var(--dq-primary-start) 0%, var(--dq-primary-end) 100%) !important;
    color: var(--dq-text-primary) !important;
    box-shadow: 0 4px 12px var(--dq-primary-alpha) !important;
}

.diagnosis-quiz-restart-btn:hover {
    box-shadow: 0 6px 20px var(--dq-primary-alpha) !important;
}

/* 診断結果 */
.diagnosis-quiz-result-header h2 {
    color: var(--dq-text-primary) !important;
}

.diagnosis-quiz-result-description {
    color: var(--dq-text-secondary) !important;
}

.diagnosis-quiz-result-icon {
    color: var(--dq-accent-gold) !important;
    text-shadow: 0 0 20px rgba(255, 215, 0, 0.5) !important;
}

/* 結果コンテンツエリア */
.diagnosis-quiz-result-content {
    background: var(--dq-result-content-bg) !important;
}

/* 結果カード */
.diagnosis-quiz-result-card {
    background: linear-gradient(135deg, var(--dq-result-card-start) 0%, var(--dq-result-card-end) 100%) !important;
    color: var(--dq-text-primary) !important;
    box-shadow: 0 8px 25px var(--dq-result-card-alpha) !important;
}

/* 特徴セクション */
.diagnosis-quiz-features-section {
    background: var(--dq-features-bg) !important;
}

.diagnosis-quiz-features-title {
    color: var(--dq-text-dark) !important;
}

.diagnosis-quiz-features-title i {
    color: #f59e0b !important;
}

.diagnosis-quiz-features-list li {
    color: #374151 !important;
}

.diagnosis-quiz-features-list li:before {
    color: var(--dq-text-light) !important;
}

/* 推奨アクション・収益化（通常時は白背景内） */
.diagnosis-quiz-recommendations-section {
    background: var(--dq-recommendations-bg) !important;
}

.diagnosis-quiz-recommendations-title {
    color: var(--dq-text-dark) !important;
}

.diagnosis-quiz-recommendations-title i {
    color: var(--dq-accent-info) !important;
}

.diagnosis-quiz-recommendations-list li {
    color: #374151 !important;
}

.diagnosis-quiz-recommendations-list li i {
    color: var(--dq-accent-success) !important;
}

.diagnosis-quiz-monetization-section {
    background: var(--dq-monetization-bg) !important;
}

.diagnosis-quiz-monetization-title {
    color: var(--dq-text-dark) !important;
}

.diagnosis-quiz-monetization-title i {
    color: var(--dq-accent-success) !important;
}

.diagnosis-quiz-monetization-list li {
    color: #374151 !important;
}

.diagnosis-quiz-monetization-list li:before {
    color: var(--dq-text-light) !important;
}

/* ブラー効果時の推奨アクション（外側の紫背景時） */
.diagnosis-quiz-blur-section .diagnosis-quiz-recommendations-section {
    background: transparent !important;
}

.diagnosis-quiz-blur-section .diagnosis-quiz-recommendations-title {
    color: var(--dq-accent-gold) !important;
}

.diagnosis-quiz-blur-section .diagnosis-quiz-recommendations-list li {
    color: var(--dq-text-primary) !important;
    background: var(--dq-card-bg) !important;
    border: 1px solid var(--dq-card-border) !important;
}

.diagnosis-quiz-blur-section .diagnosis-quiz-recommendations-list li:hover {
    background: rgba(255, 255, 255, 0.15) !important;
}

.diagnosis-quiz-blur-section .diagnosis-quiz-recommendations-list li i {
    color: #0ea5e9 !important;
}

/* ロックコンテンツ */
.diagnosis-quiz-locked-content {
    background: linear-gradient(135deg, var(--dq-locked-start) 0%, var(--dq-locked-end) 100%) !important;
    box-shadow: 0 15px 35px var(--dq-locked-alpha) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

.diagnosis-quiz-locked-content h4,
.diagnosis-quiz-locked-content p {
    color: var(--dq-text-primary) !important;
}

/* 登録ボタン */
.btn-email {
    background: linear-gradient(135deg, var(--dq-button-email), #2563eb) !important;
    color: var(--dq-text-primary) !important;
    box-shadow: 0 8px 15px rgba(59, 130, 246, 0.3) !important;
}

.btn-email:hover {
    box-shadow: 0 12px 25px rgba(59, 130, 246, 0.4) !important;
}

.btn-line {
    background: linear-gradient(135deg, var(--dq-button-line), #059669) !important;
    color: var(--dq-text-primary) !important;
    box-shadow: 0 8px 15px rgba(16, 185, 129, 0.3) !important;
}

.btn-line:hover {
    box-shadow: 0 12px 25px rgba(16, 185, 129, 0.4) !important;
}

/* リードフォーム */
.diagnosis-quiz-lead-form {
    background: var(--dq-card-bg) !important;
    border: 1px solid var(--dq-card-border) !important;
}

.diagnosis-quiz-lead-form h3 {
    color: var(--dq-text-primary) !important;
}

.diagnosis-quiz-lead-form > p {
    color: var(--dq-text-secondary) !important;
}

.diagnosis-quiz-form-group label {
    color: var(--dq-accent-gold) !important;
}

.diagnosis-quiz-form-group input {
    border: 2px solid rgba(255, 255, 255, 0.3) !important;
    background: var(--dq-card-bg) !important;
    color: var(--dq-text-primary) !important;
}

.diagnosis-quiz-form-group input::placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}

.diagnosis-quiz-form-group input:focus {
    border-color: var(--dq-accent-gold) !important;
    background: rgba(255, 255, 255, 0.2) !important;
    box-shadow: 0 0 20px rgba(255, 215, 0, 0.3) !important;
}

/* Business AI Enhanced フォーム */
.business-ai-enhanced .diagnosis-quiz-lead-form {
    background: linear-gradient(135deg, var(--dq-primary-start) 0%, var(--dq-primary-end) 100%) !important;
    color: var(--dq-text-primary) !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
}

.business-ai-enhanced .diagnosis-quiz-form-group input {
    background: rgba(255, 255, 255, 0.9) !important;
    border: 2px solid rgba(255, 255, 255, 0.1) !important;
    color: #000 !important;
}

.business-ai-enhanced .diagnosis-quiz-form-group input:focus {
    background: rgba(255, 255, 255, 1) !important;
}

.business-ai-enhanced .diagnosis-quiz-registration-button {
    background: linear-gradient(45deg, var(--dq-button-gradient-start), var(--dq-button-gradient-end)) !important;
    box-shadow: 0 8px 25px rgba(255, 107, 107, 0.3) !important;
}

.business-ai-enhanced .diagnosis-quiz-registration-button:hover {
    box-shadow: 0 12px 35px rgba(255, 107, 107, 0.4) !important;
}

/* ローディング・エラー */
.diagnosis-quiz-loading-text {
    color: #333 !important;
}

.business-ai-enhanced .diagnosis-quiz-loading-spinner {
    color: var(--dq-accent-gold) !important;
}

.business-ai-enhanced .diagnosis-quiz-loading-text {
    color: var(--dq-text-primary) !important;
}

.diagnosis-quiz-diagnosis-error,
.diagnosis-quiz-error-display {
    color: var(--dq-accent-warning) !important;
}

.diagnosis-quiz-retry-button {
    background: #dc2626 !important;
    color: var(--dq-text-primary) !important;
}

.success-checkmark {
    color: #00b894 !important;
}

/* アクションボタン */
.diagnosis-quiz-share-button {
    background: var(--dq-accent-success) !important;
    color: var(--dq-text-primary) !important;
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3) !important;
}

.diagnosis-quiz-share-button:hover {
    background: #059669 !important;
    box-shadow: 0 6px 20px rgba(16, 185, 129, 0.4) !important;
}

/* Basic Features */
.basic-features {
    background: rgba(255,255,255,0.05) !important;
}

.basic-features h4 {
    color: var(--dq-accent-gold) !important;
}

.basic-features li i {
    color: var(--dq-accent-gold) !important;
}

.basic-features .locked-notice {
    background: rgba(102, 126, 234, 0.1) !important;
    border: 2px solid rgba(102, 126, 234, 0.2) !important;
}

.basic-features .locked-notice p {
    color: #667eea !important;
}

.basic-features .locked-notice p:last-child {
    color: #5a6c7d !important;
}

.btn-primary {
    background: linear-gradient(45deg, var(--dq-button-gradient-start), var(--dq-button-gradient-end)) !important;
    color: var(--dq-text-primary) !important;
}

/* ==============================================
   代替カラーテーマ
   ============================================== */

/* ブルーテーマ */
.diagnosis-quiz-theme-blue {
    --dq-primary-start: #3b82f6;
    --dq-primary-end: #1e40af;
    --dq-primary-alpha: rgba(59, 130, 246, 0.3);
    --dq-result-card-start: #0ea5e9;
    --dq-result-card-end: #3b82f6;
    --dq-locked-start: #dc2626;
    --dq-locked-end: #ef4444;
}

/* グリーンテーマ */
.diagnosis-quiz-theme-green {
    --dq-primary-start: #10b981;
    --dq-primary-end: #047857;
    --dq-primary-alpha: rgba(16, 185, 129, 0.3);
    --dq-result-card-start: #059669;
    --dq-result-card-end: #10b981;
    --dq-locked-start: #f59e0b;
    --dq-locked-end: #d97706;
}

/* ピンクテーマ */
.diagnosis-quiz-theme-pink {
    --dq-primary-start: #ec4899;
    --dq-primary-end: #be185d;
    --dq-primary-alpha: rgba(236, 72, 153, 0.3);
    --dq-result-card-start: #f472b6;
    --dq-result-card-end: #ec4899;
    --dq-locked-start: #7c3aed;
    --dq-locked-end: #6d28d9;
}

/* ダークテーマ */
.diagnosis-quiz-theme-dark {
    --dq-primary-start: #1f2937;
    --dq-primary-end: #111827;
    --dq-primary-alpha: rgba(31, 41, 55, 0.3);
    --dq-result-card-start: #374151;
    --dq-result-card-end: #1f2937;
    --dq-locked-start: #991b1b;
    --dq-locked-end: #7f1d1d;
    --dq-card-bg: rgba(0, 0, 0, 0.3);
    --dq-card-border: rgba(255, 255, 255, 0.1);
}

/* 季節限定テーマ */
.diagnosis-quiz-theme-spring {
    --dq-primary-start: #fbbf24;
    --dq-primary-end: #f59e0b;
    --dq-result-card-start: #84cc16;
    --dq-result-card-end: #65a30d;
    --dq-accent-gold: #10b981;
}

.diagnosis-quiz-theme-summer {
    --dq-primary-start: #0ea5e9;
    --dq-primary-end: #0284c7;
    --dq-result-card-start: #06b6d4;
    --dq-result-card-end: #0891b2;
}

.diagnosis-quiz-theme-autumn {
    --dq-primary-start: #ea580c;
    --dq-primary-end: #c2410c;
    --dq-result-card-start: #dc2626;
    --dq-result-card-end: #b91c1c;
}

.diagnosis-quiz-theme-winter {
    --dq-primary-start: #1e40af;
    --dq-primary-end: #1e3a8a;
    --dq-result-card-start: #7c3aed;
    --dq-result-card-end: #6d28d9;
}

/* ビジネス向け専用テーマ */
.diagnosis-quiz-theme-corporate {
    --dq-primary-start: #1e40af;
    --dq-primary-end: #1e3a8a;
    --dq-result-card-start: #3730a3;
    --dq-result-card-end: #312e81;
    --dq-accent-gold: #f59e0b;
}

.diagnosis-quiz-theme-professional {
    --dq-primary-start: #374151;
    --dq-primary-end: #1f2937;
    --dq-result-card-start: #6b7280;
    --dq-result-card-end: #4b5563;
    --dq-accent-gold: #fbbf24;
}