/**
 * colors.css - demond.de Farbpalette
 * Indigo, Violet, moderne Tech-Optik
 */

:root {
    /* demond.de Markenfarben */
    --color-indigo: #6366f1;
    --color-violet: #8b5cf6;
    --color-accent: #6366f1;
    --color-accent-hover: #4f46e5;
    --color-accent-light: #818cf8;
    --color-teal: #0d9488;
    --color-anthracite: #1e293b;
    --color-black: #0f172a;
    --color-white: #FFFFFF;
    --color-gray-10: #f8fafc;
    --color-gray-20: #e2e8f0;
    --color-gray-50: #64748b;

    /* Kompatibilität (Redirect) */
    --color-orange: var(--color-indigo);

    /* Backgrounds */
    --color-background: #FFFFFF;
    --color-surface: #ffffff;
    --color-surface-hover: #f8fafc;

    /* Primary/Accent */
    --color-primary: var(--color-indigo);
    --color-primary-hover: var(--color-accent-hover);
    --color-secondary: var(--color-violet);
    --color-tertiary: var(--color-teal);

    /* Text Colors */
    --color-text: var(--color-anthracite);
    --color-text-muted: var(--color-gray-50);
    --color-text-inverse: var(--color-white);
    --color-headline: var(--color-anthracite);

    /* Borders */
    --color-border: var(--color-gray-20);
    --color-border-highlight: #cbd5e1;
    --color-table-border: rgba(30, 41, 59, 0.12);

    /* Table */
    --color-table-row-bg: var(--color-white);
    --color-table-row-hover: rgba(99, 102, 241, 0.04);

    /* AI/Search */
    --color-ai-overview-bg: var(--color-white);
    --color-ai-overview-border: rgba(30, 41, 59, 0.12);
    --color-serp-title-link: #1a0dab;
    --color-serp-title-link-visited: #681da8;
    --color-serp-url-text: #0d652d;

    /* Status Colors */
    --color-success: #10b981;
    --color-error: #ef4444;
    --color-error-hover: #dc2626;
    --color-warning: #f59e0b;
    --color-info: #3b82f6;

    /* Message (Success, Error, Info) */
    --color-success-bg: #d4edda;
    --color-success-border: #c3e6cb;
    --color-success-text: #155724;
    --color-error-bg: #f8d7da;
    --color-error-border: #f5c6cb;
    --color-error-text: #721c24;
    --color-info-bg: #d1ecf1;
    --color-info-border: #bee5eb;
    --color-info-text: #0c5460;

    /* Gradients */
    --gradient-brand: linear-gradient(135deg, var(--color-indigo), var(--color-violet));
    --gradient-text: linear-gradient(to right, var(--color-indigo), var(--color-violet));
    --gradient-text-hero: linear-gradient(125deg, var(--color-indigo) 0%, var(--color-accent-light) 30%, var(--color-violet) 58%, var(--color-teal) 100%);
    --filter-home-hero-h1: drop-shadow(0 2px 20px rgba(99, 102, 241, 0.38)) drop-shadow(0 1px 2px rgba(139, 92, 246, 0.22));
    --color-de-gradient-start: #000000;
    --color-de-gradient-mid: #dd0000;
    --color-de-gradient-end: #ffcc00;
    --gradient-highlight-gold-text: linear-gradient(to right, var(--color-de-gradient-start), var(--color-de-gradient-mid), var(--color-de-gradient-end));

    /* Shadows */
    --shadow-sm: 0 2px 8px rgba(30, 41, 59, 0.08);
    --shadow-md: 0 4px 16px rgba(30, 41, 59, 0.1);
    --shadow-lg: 0 8px 32px rgba(30, 41, 59, 0.12);
    --shadow-hover: 0 12px 40px rgba(30, 41, 59, 0.14);
    --shadow-glow: 0 0 40px rgba(99, 102, 241, 0.12);
    --shadow-ki-suche-thumb: 0 4px 14px rgba(30, 41, 59, 0.12);
    --shadow-ki-suche-thumb-hover: 0 8px 22px rgba(30, 41, 59, 0.14), 0 0 0 1px rgba(99, 102, 241, 0.35), 0 0 24px rgba(99, 102, 241, 0.18);
    --shadow-ki-suche-serp-card: 0 1px 2px rgba(30, 41, 59, 0.05), 0 2px 10px rgba(30, 41, 59, 0.04);
    --shadow-ki-suche-serp-card-hover: 0 4px 18px rgba(30, 41, 59, 0.08), 0 0 0 1px rgba(99, 102, 241, 0.14);

    /* Transitions */
    --transition-fast: 0.2s ease;
    --transition-medium: 0.3s ease;
    --transition-slow: 0.5s ease;
}