/* --- CSS VARIABLES (The Core of the Theme) --- */
:root {
    --primary: #4F46E5;
    --secondary: #1e293b;
    --font-main: 'Inter', sans-serif;
    --radius: 8px;
}

body { 
    font-family: var(--font-main); 
    background-color: #f9fafb; 
    color: #1f2937; 
}

/* --- BRANDING HELPERS --- */
.text-primary { color: var(--primary) !important; }
.bg-primary { background-color: var(--primary) !important; }
.text-secondary { color: var(--secondary) !important; }

/* SIDEBAR HEADER LOGIC: 
   Background = Primary Color
   Text/Icons = Secondary Color
*/
.brand-header {
    background-color: var(--primary) !important;
    color: var(--secondary) !important;
}
.brand-header i, 
.brand-header h1, 
.brand-header button {
    color: var(--secondary) !important;
}

/* --- COMPONENTS --- */

/* Brand Button */
.btn-brand {
    background-color: var(--primary);
    color: #fff;
    border-radius: var(--radius);
    transition: transform 0.1s ease, box-shadow 0.2s ease;
}
.btn-brand:hover { 
    transform: translateY(-1px); 
    box-shadow: 0 4px 12px rgba(0,0,0,0.15); 
}

/* Cards (White containers) */
.card {
    background: white;
    border-radius: var(--radius);
    border: 1px solid #e5e7eb;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    transition: all 0.2s;
}
.card:hover { 
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1); 
}

/* Input Fields */
.input-field {
    border-radius: var(--radius);
    border: 1px solid #d1d5db;
    transition: all 0.2s;
}
.input-field:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary), transparent 85%);
}

/* Sidebar Navigation Items */
.nav-item { 
    border-radius: var(--radius); 
    font-weight: 500; 
}
.nav-item:hover { 
    background-color: #f9fafb; 
    color: var(--primary); 
}
.nav-item.active {
    background-color: color-mix(in srgb, var(--primary), white 90%);
    color: var(--primary);
    border-right: 3px solid var(--primary);
}

/* Terminal Scrollbar (for Logs) */
.terminal-scroll::-webkit-scrollbar { width: 8px; }
.terminal-scroll::-webkit-scrollbar-track { background: #1f2937; }
.terminal-scroll::-webkit-scrollbar-thumb { background: #4b5563; border-radius: 4px; }
.terminal-scroll::-webkit-scrollbar-thumb:hover { background: #6b7280; }