/* Dark Mode Support (Optional) */
:root {
    color-scheme: dark;
    /* Primary Colors */
    --primary-dark: #f0f2ff;
    --primary-light: #4c63d2;
    
    /* Secondary Colors */
    --secondary-dark: #f8f9fa;
    
    /* Status Colors */
    --success-dark: #d4edda;
    --success-light: #155724;
    
    --warning-dark: #fff3cd;
    --warning-light: #856404;
    
    --danger-dark: #f8d7da;
    --danger-light: #721c24;
    
    --info-dark: #d1ecf1;
    --info-light: #0c5460;
    
    /* Text Colors */
    --text-primary: #ffffff;
    --text-secondary: #f8f9fa;
    --text-muted: #999999;
    --text-light: #ffffff;
    
    /* Background Colors */
    --bg-primary: #111;
    --bg-secondary: #333;
    --bg-dark: #343a40;
    --bg-overlay: #0007;
    --bg-gradient: linear-gradient(90deg, #000 0%, #ac12bf 70%);

    /* Border Colors */
    --border-color: #212529;
    --border-light: #101010;
    --border-dark: #2e1216;

    /* Card Colors */
    --card-primary: #f0f2ff;
    --card-secondary: #4c63d2;
    --bg-card-gradient: linear-gradient(90deg, #81c 0%, #dc22ef 70%);
    
}
    
.modal-content,
.form-control,
.table {
    background-color: var(--bg-primary);
    border-color: var(--border-color);
}
    
.navbar {
    background-color: var(--bg-primary);
    border-color: var(--border-color);
}