/* Modern Color Theme Variables */
:root {
    /* Primary Brand Colors - Kırmızı Tonları (Öncü Döner) */
    --primary-50: #fef2f2;
    --primary-100: #fee2e2;
    --primary-200: #fecaca;
    --primary-300: #fca5a5;
    --primary-400: #f87171;
    --primary-500: #ef4444;
    --primary-600: #dc2626;
    --primary-700: #b91c1c;
    --primary-800: #991b1b;
    --primary-900: #7f1d1d;
    
    /* Neutral Colors */
    --neutral-50: #fafafa;
    --neutral-100: #f5f5f5;
    --neutral-200: #e5e5e5;
    --neutral-300: #d4d4d4;
    --neutral-400: #a3a3a3;
    --neutral-500: #737373;
    --neutral-600: #525252;
    --neutral-700: #404040;
    --neutral-800: #262626;
    --neutral-900: #171717;
    
    /* Success */
    --success-500: #10b981;
    --success-600: #059669;
    
    /* Warning */
    --warning-500: #f59e0b;
    --warning-600: #d97706;
    
    /* Danger */
    --danger-500: #ef4444;
    --danger-600: #dc2626;
    
    /* Info */
    --info-500: #3b82f6;
    --info-600: #2563eb;
}

/* Sidebar Gradient */
.sidebar-gradient {
    background: linear-gradient(180deg, var(--primary-700) 0%, var(--primary-900) 100%);
}

/* Card Styles */
.card-modern {
    background: white;
    border-radius: 1rem;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    transition: box-shadow 0.3s ease;
}

.card-modern:hover {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

/* Button Styles */
.btn-primary {
    background-color: var(--primary-600);
    color: white;
    padding: 0.5rem 1rem;
    border-radius: 0.5rem;
    font-weight: 500;
    transition: all 0.3s ease;
}

.btn-primary:hover {
    background-color: var(--primary-700);
    transform: translateY(-1px);
    box-shadow: 0 4px 6px -1px rgba(220, 38, 38, 0.3);
}

/* Icon Unified Styles - HEPSİ BEYAZ */
.icon-primary,
.icon-success,
.icon-warning,
.icon-danger,
.icon-info {
    color: white !important;
}

/* Nav Item Hover Effect - YENİ BEYAZ SİDEBAR İÇİN */
a.flex.items-center,
button.flex.items-center {
    transition: all 0.2s ease;
}

a.flex.items-center:hover,
button.flex.items-center:hover {
    background-color: #fef2f2 !important;
    color: #dc2626 !important;
}

a.flex.items-center.active,
a.flex.items-center[href].active {
    background-color: #dc2626 !important;
    color: white !important;
    font-weight: 600;
}

a.flex.items-center.active i,
a.flex.items-center[href].active i {
    color: white !important;
}

/* Nav Item Hover Effect - ESKİ */
.nav-item-modern {
    display: flex;
    align-items: center;
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    color: rgba(255, 255, 255, 0.8);
    transition: all 0.2s ease;
    gap: 0.75rem;
}

.nav-item-modern:hover {
    background-color: rgba(255, 255, 255, 0.1);
    color: white;
    transform: translateX(4px);
}

.nav-item-modern.active {
    background-color: rgba(255, 255, 255, 0.15);
    color: white;
    font-weight: 600;
}

/* Logo Container */
.logo-container {
    background: white;
    padding: 0.5rem;
    border-radius: 0.75rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}

/* Smooth Animations */
@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-slide-in {
    animation: slideIn 0.3s ease-out;
}

/* Page Header */
.page-header-modern {
    background: linear-gradient(135deg, var(--primary-600) 0%, var(--primary-800) 100%);
    color: white;
    padding: 1.5rem;
    border-radius: 1rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 4px 6px -1px rgba(220, 38, 38, 0.2);
}

/* Stat Card */
.stat-card {
    background: white;
    border-radius: 1rem;
    padding: 1.5rem;
    border-left: 4px solid var(--primary-600);
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.stat-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}