/**
 * Geo-Fin Farbschema
 * Primärfarbe: #155C30 (Waldgrün)
 *
 * Generiert aus der Primärfarbe mit harmonischen Abstufungen
 */

:root {
    /* ========================================
       PRIMARY - Waldgrün (#155C30)
       ======================================== */
    --primary-50:  #e8f5ed;
    --primary-100: #c6e7d2;
    --primary-200: #9dd6b3;
    --primary-300: #6fc291;
    --primary-400: #3fa96d;
    --primary-500: #1a7a42;
    --primary-600: #155C30;  /* Hauptfarbe */
    --primary-700: #124d28;
    --primary-800: #0e3d20;
    --primary-900: #0a2e18;
    --primary-950: #061f10;

    /* ========================================
       SECONDARY - Blaugrün (Komplementär)
       ======================================== */
    --secondary-50:  #e6f4f7;
    --secondary-100: #cce9ef;
    --secondary-200: #99d3df;
    --secondary-300: #66bdcf;
    --secondary-400: #33a7bf;
    --secondary-500: #1a8a9e;
    --secondary-600: #156e7e;
    --secondary-700: #10535f;
    --secondary-800: #0b3940;
    --secondary-900: #061e21;
    --secondary-950: #030f11;

    /* ========================================
       ACCENT - Goldgelb (Akzent)
       ======================================== */
    --accent-50:  #fef9e6;
    --accent-100: #fdf0bf;
    --accent-200: #fbe699;
    --accent-300: #f9d966;
    --accent-400: #f7c933;
    --accent-500: #e5b000;
    --accent-600: #b38900;
    --accent-700: #806300;
    --accent-800: #4d3c00;
    --accent-900: #1a1400;
    --accent-950: #0d0a00;

    /* ========================================
       NEUTRAL - Schiefergrau
       ======================================== */
    --neutral-50:  #f8fafc;
    --neutral-100: #f1f5f9;
    --neutral-200: #e2e8f0;
    --neutral-300: #cbd5e1;
    --neutral-400: #94a3b8;
    --neutral-500: #64748b;
    --neutral-600: #475569;
    --neutral-700: #334155;
    --neutral-800: #1e293b;
    --neutral-900: #0f172a;
    --neutral-950: #020617;

    /* ========================================
       SEMANTIC COLORS
       ======================================== */

    /* Success - Grün (basierend auf Primary) */
    --success-light: #d1fae5;
    --success: #10b981;
    --success-dark: #065f46;

    /* Warning - Bernstein */
    --warning-light: #fef3c7;
    --warning: #f59e0b;
    --warning-dark: #92400e;

    /* Error - Rot */
    --error-light: #fee2e2;
    --error: #ef4444;
    --error-dark: #991b1b;

    /* Info - Blau */
    --info-light: #dbeafe;
    --info: #3b82f6;
    --info-dark: #1e40af;

    /* ========================================
       SURFACE COLORS (Hintergründe)
       ======================================== */
    --surface-light: #ffffff;
    --surface-muted: #f8fafc;
    --surface-subtle: #f1f5f9;
    --surface-dark: #0f172a;

    /* ========================================
       TEXT COLORS
       ======================================== */
    --text-primary: #0f172a;
    --text-secondary: #475569;
    --text-muted: #94a3b8;
    --text-inverted: #ffffff;

    /* ========================================
       BORDER COLORS
       ======================================== */
    --border-light: #e2e8f0;
    --border-default: #cbd5e1;
    --border-dark: #94a3b8;

    /* ========================================
       SHADOWS
       ======================================== */
    --shadow-color: 21 92 48;  /* RGB von Primary für grünliche Schatten */
    --shadow-sm: 0 1px 2px 0 rgb(var(--shadow-color) / 0.05);
    --shadow-md: 0 4px 6px -1px rgb(var(--shadow-color) / 0.1), 0 2px 4px -2px rgb(var(--shadow-color) / 0.1);
    --shadow-lg: 0 10px 15px -3px rgb(var(--shadow-color) / 0.1), 0 4px 6px -4px rgb(var(--shadow-color) / 0.1);
    --shadow-xl: 0 20px 25px -5px rgb(var(--shadow-color) / 0.1), 0 8px 10px -6px rgb(var(--shadow-color) / 0.1);

    /* ========================================
       GRADIENTS
       ======================================== */
    --gradient-primary: linear-gradient(135deg, var(--primary-500) 0%, var(--primary-700) 100%);
    --gradient-primary-dark: linear-gradient(135deg, var(--primary-600) 0%, var(--primary-900) 100%);
    --gradient-hero: linear-gradient(135deg, var(--primary-600) 0%, var(--primary-800) 50%, var(--neutral-900) 100%);
    --gradient-accent: linear-gradient(135deg, var(--primary-500) 0%, var(--secondary-500) 100%);
}

/* ========================================
   DARK MODE
   ======================================== */
.dark {
    /* Surface Colors invertiert */
    --surface-light: #0f172a;
    --surface-muted: #1e293b;
    --surface-subtle: #334155;
    --surface-dark: #f8fafc;

    /* Text Colors invertiert */
    --text-primary: #f1f5f9;
    --text-secondary: #cbd5e1;
    --text-muted: #64748b;
    --text-inverted: #0f172a;

    /* Border Colors angepasst */
    --border-light: #334155;
    --border-default: #475569;
    --border-dark: #64748b;

    /* Semantic Colors für Dark Mode */
    --success-light: #064e3b;
    --success: #10b981;
    --success-dark: #d1fae5;

    --warning-light: #78350f;
    --warning: #fbbf24;
    --warning-dark: #fef3c7;

    --error-light: #7f1d1d;
    --error: #f87171;
    --error-dark: #fee2e2;

    --info-light: #1e3a8a;
    --info: #60a5fa;
    --info-dark: #dbeafe;
}

/* ========================================
   UTILITY CLASSES
   ======================================== */

/* Backgrounds */
.bg-primary { background-color: var(--primary-600); }
.bg-primary-light { background-color: var(--primary-100); }
.bg-primary-dark { background-color: var(--primary-800); }
.bg-secondary { background-color: var(--secondary-600); }
.bg-accent { background-color: var(--accent-500); }
.bg-surface { background-color: var(--surface-light); }
.bg-surface-muted { background-color: var(--surface-muted); }

/* Text Colors */
.text-primary { color: var(--primary-600); }
.text-primary-light { color: var(--primary-400); }
.text-primary-dark { color: var(--primary-800); }
.text-secondary { color: var(--secondary-600); }
.text-accent { color: var(--accent-500); }
.text-body { color: var(--text-primary); }
.text-body-secondary { color: var(--text-secondary); }
.text-muted { color: var(--text-muted); }

/* Borders */
.border-primary { border-color: var(--primary-600); }
.border-t-primary { border-top-color: var(--primary-600); }
.border-light { border-color: var(--border-light); }
.border-default { border-color: var(--border-default); }

/* Form Accent */
.accent-primary { accent-color: var(--primary-600); }

/* Gradients */
.gradient-primary { background: var(--gradient-primary); }
.gradient-hero { background: var(--gradient-hero); }
.gradient-accent { background: var(--gradient-accent); }

/* Buttons */
.btn-primary {
    background-color: var(--primary-600);
    color: var(--text-inverted);
    transition: background-color 0.2s ease;
}
.btn-primary:hover {
    background-color: var(--primary-700);
}
.btn-primary:focus {
    outline: 2px solid var(--primary-400);
    outline-offset: 2px;
}

.btn-secondary {
    background-color: var(--secondary-600);
    color: var(--text-inverted);
    transition: background-color 0.2s ease;
}
.btn-secondary:hover {
    background-color: var(--secondary-700);
}

.btn-accent {
    background-color: var(--accent-500);
    color: var(--primary-900);
    transition: background-color 0.2s ease;
}
.btn-accent:hover {
    background-color: var(--accent-600);
}

.btn-outline {
    background-color: transparent;
    border: 2px solid var(--primary-600);
    color: var(--primary-600);
    transition: all 0.2s ease;
}
.btn-outline:hover {
    background-color: var(--primary-600);
    color: var(--text-inverted);
}

/* Dark Mode: btn-outline */
.dark .btn-outline {
    border-color: var(--neutral-300);
    color: var(--neutral-100);
}
.dark .btn-outline:hover {
    border-color: var(--primary-400);
    background-color: transparent;
    color: var(--primary-400);
}

/* Cards */
.card {
    background-color: var(--surface-light);
    border: 1px solid var(--border-light);
    border-radius: 0.75rem;
    box-shadow: var(--shadow-md);
}

.card-elevated {
    background-color: var(--surface-light);
    border-radius: 0.75rem;
    box-shadow: var(--shadow-lg);
}

/* Links */
.link-primary {
    color: var(--primary-600);
    text-decoration: underline;
    transition: color 0.2s ease;
}
.link-primary:hover {
    color: var(--primary-800);
}

.dark .link-primary {
    color: var(--primary-400);
}
.dark .link-primary:hover {
    color: var(--primary-300);
}

/* Focus States */
.focus-primary:focus {
    outline: 2px solid var(--primary-500);
    outline-offset: 2px;
}

/* Status Badges */
.badge-success {
    background-color: var(--success-light);
    color: var(--success-dark);
    padding: 0.25rem 0.75rem;
    border-radius: 9999px;
    font-size: 0.875rem;
    font-weight: 500;
}

.badge-warning {
    background-color: var(--warning-light);
    color: var(--warning-dark);
    padding: 0.25rem 0.75rem;
    border-radius: 9999px;
    font-size: 0.875rem;
    font-weight: 500;
}

.badge-error {
    background-color: var(--error-light);
    color: var(--error-dark);
    padding: 0.25rem 0.75rem;
    border-radius: 9999px;
    font-size: 0.875rem;
    font-weight: 500;
}

.badge-info {
    background-color: var(--info-light);
    color: var(--info-dark);
    padding: 0.25rem 0.75rem;
    border-radius: 9999px;
    font-size: 0.875rem;
    font-weight: 500;
}

/* Navigation Links */
.nav-link {
    color: var(--text-secondary);
    transition: all 0.2s ease;
    padding: 0.5rem 0.75rem;
    border-radius: 0.375rem;
    position: relative;
}
.nav-link:hover {
    color: var(--primary-600);
    background-color: var(--primary-50);
}
.nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 2px;
    background-color: var(--primary-600);
    transition: all 0.2s ease;
    transform: translateX(-50%);
}
.nav-link:hover::after {
    width: 80%;
}
.dark .nav-link {
    color: var(--neutral-300);
}
.dark .nav-link:hover {
    color: var(--primary-400);
    background-color: var(--neutral-800);
}
.dark .nav-link::after {
    background-color: var(--primary-400);
}

/* Logo Hover */
.logo a:hover {
    color: var(--primary-700) !important;
}
.dark .logo a {
    color: var(--primary-400) !important;
}
.dark .logo a:hover {
    color: var(--primary-300) !important;
}

/* Dashboard "Meine Bereiche" Links - Dark Mode Hover Fix */
.dark .dashboard-area-link:hover {
    background-color: var(--neutral-700) !important;
}

/* Alternative: Falls keine spezielle Klasse verwendet wird */
.dark a[href*="/dashboard/"]:hover {
    background-color: var(--neutral-700);
}

/* Auth Links (Anmelden/Registrieren) */
.auth-link {
    color: var(--primary-600);
    transition: all 0.2s ease;
    padding-bottom: 2px;
    border-bottom: 2px solid transparent;
}
.auth-link:hover {
    color: var(--primary-700);
    border-bottom-color: var(--primary-500);
}
.dark .auth-link {
    color: var(--primary-400);
}
.dark .auth-link:hover {
    color: var(--primary-300);
    border-bottom-color: var(--primary-400);
}

/* Content Width - Desktop 1000px + 1rem Padding, Mobile full width */
@media (min-width: 768px) {
    .content-width {
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

/* Header Navigation - Mobile: kleines Padding */
.nav-main {
    padding-left: 1rem;
    padding-right: 1rem;
}

/* Header Navigation - Tablet (768px - 1279px): mittleres Padding */
@media (min-width: 768px) and (max-width: 1279px) {
    .nav-topbar {
        padding: 0 2rem;
    }
    .nav-main {
        padding: 0 2rem;
    }
    .nav-actions {
        margin-right: 0;
    }
}

/* Header Navigation - Desktop (1280px+): großes Padding */
@media (min-width: 1280px) {
    .nav-topbar {
        padding: 0 15rem;
    }
    .nav-main {
        padding: 0 15rem;
    }
    .nav-actions {
        margin-right: 5rem;
    }
}

/* Container max-width auf Desktop begrenzen - NICHT für Header */
@media (min-width: 768px) {
    main .container,
    section .container,
    .container:not(header .container) {
        max-width: 1000px !important;
        margin-left: auto;
        margin-right: auto;
    }
}