:root {
    --lilac-primary: #9b59b6; /* Lilás principal */
    --lilac-dark: #8e44ad;    /* Lilás mais escuro para hover */
    --lilac-light: #f4ecf7;   /* Fundo bem clarinho */
}

body {
    background-color: #f8f9fa;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

/* Sobrescrevendo classes utilitárias */
.bg-lilac {
    background-color: var(--lilac-primary) !important;
    color: white;
}

.text-lilac {
    color: var(--lilac-primary) !important;
}

/* Botões Personalizados */
.btn-lilac {
    background-color: var(--lilac-primary);
    color: white;
    border: none;
}

.btn-lilac:hover {
    background-color: var(--lilac-dark);
    color: white;
}

/* Sidebar do Dashboard */
.sidebar {
    min-height: 100vh;
    background-color: #2c3e50; /* Cinza escuro fica elegante com lilás */
}

.sidebar a {
    color: #bdc3c7;
    text-decoration: none;
    padding: 15px;
    display: block;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    transition: 0.3s;
}

.sidebar a:hover, .sidebar a.active {
    background-color: var(--lilac-primary);
    color: white;
    padding-left: 25px; /* Efeito de deslize */
}

/* Card de Login */
.login-card {
    border: none;
    border-radius: 15px;
    box-shadow: 0 10px 25px rgba(155, 89, 182, 0.2);
}

.login-header {
    background-color: var(--lilac-primary);
    color: white;
    border-radius: 15px 15px 0 0;
    padding: 20px;
    text-align: center;
}