:root {
    --header-height: 135px; /* Altura aumentada para comportar o logo maior e o texto adicional */
}

/* 1. Ajuste do Corpo */
body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background-color: #f8f9fa;
    padding-top: var(--header-height); /* Empurra o conteúdo para baixo do header */
}

/* 2. Cabeçalho (Sistema Malharia) */
header.navbar {
    height: var(--header-height);
    background-color: #212529; /* Cor escura */
    z-index: 1030; /* Garante que fica ACIMA de tudo */
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    padding: 0; /* Reset de padding */
}

.navbar-brand {
    height: 100%; /* Ocupa toda a altura do header */
    display: flex;
    align-items: center;
    justify-content: center;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    background-color: rgba(0, 0, 0, 0.25); /* Fundo levemente diferente */
    font-size: 1.1rem;
    white-space: nowrap;
}

/* 3. Barra Lateral (Sidebar) */
.sidebar {
    position: fixed;
    top: var(--header-height); /* Começa EXATAMENTE abaixo do header */
    bottom: 0;
    left: 0;
    z-index: 100;
    background-color: #f8f9fa; /* Alterado para cinza padrão */
    padding-top: 20px; /* Espaço interno no topo da lista */
    box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
    overflow-y: auto; /* Permite rolar se o menu for muito longo */
}

/* Links da Sidebar */
.sidebar .nav-link {
    font-weight: 500;
    color: #495057; /* Texto cinza escuro para contrastar com o fundo claro */
    padding: 12px 24px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.sidebar .nav-link:hover,
.sidebar .nav-link.active {
    color: #0d6efd; /* Azul principal do bootstrap para hover e ativo */
    background-color: rgba(0, 0, 0, .05); /* Escurece levemente o fundo no hover */
    border-left: 4px solid #0d6efd;
}

.sidebar .nav-link i {
    font-size: 1.2rem;
}

/* 4. Ajustes Responsivos (Mobile) */
@media (max-width: 767.98px) {
    .sidebar {
        top: var(--header-height);
        height: auto; /* Altura automática */
        position: static; /* Deixa de ser fixa */
        width: 100%; /* Ocupa largura total */
        background-color: #f8f9fa;
    }
    
    body {
        padding-top: var(--header-height); /* Mantém o padding */
    }

    .navbar-brand {
        width: auto; /* No mobile, o brand não precisa ter largura fixa de coluna */
        background-color: transparent;
        box-shadow: none;
    }
}

/* Badges de Status */
.status-concluido { background-color: #198754; color: white; }
.status-parcial { background-color: #ffc107; color: black; }
.status-nao-iniciado { background-color: #dc3545; color: white; }