/* css/sidebar_styles.css */

/* --- Configurações de Transição e Tamanhos --- */
:root {
    --sidebar-width-expanded: 230px;
    --sidebar-width-collapsed: 80px;
}

/* Transições suaves */
.sidebar, .content, #sidebar-toggle-button, .sidebar .nav-link, .sidebar .btn {
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

/* --- ESTADO RECOLHIDO (COLLAPSED) --- */

/* 1. Ajuste da Largura da Sidebar e Conteúdo */
body.sidebar-collapsed .sidebar {
    width: var(--sidebar-width-collapsed) !important;
    padding: 0 !important;
}

body.sidebar-collapsed .content {
    margin-left: var(--sidebar-width-collapsed) !important;
}

/* 2. LOGOTIPO: Correção de Duplicidade e Centralização */
/* 2. LOGOTIPO: Correção de Duplicidade e Centralização */
body.sidebar-collapsed .sidebar .text-center {
    padding: 15px 0 !important;
    margin: 0 !important;
    /* display: flex; <--- REMOVIDO DO PADRÃO conforme solicitado */
    height: 60px; /* Altura fixa para manter layout estável */
}

/* APENAS APLICA FLEX SE TIVER IMAGEM (LOGO) */
/* Isso centraliza perfeitamente o logo quando ele existe */
body.sidebar-collapsed .sidebar .text-center:has(img) {
    display: flex !important;
    justify-content: center;
    align-items: center;
}




/* IMPORTANTE: Não forçar display:block aqui para não anular a lógica do tema dark/light */
body.sidebar-collapsed .sidebar .text-center img {
    max-width: 40px !important;
    height: auto !important;
    margin: 0 !important;
    padding-top: 26px;
    padding-bottom: 26px;	
    /* display: block;  <-- REMOVIDO para respeitar a classe .logo-light/.logo-dark do index.php */
}

/* Ocultar textos do cabeçalho (Título TAREFAS ou subtítulos) */
body.sidebar-collapsed .sidebar h2, 
body.sidebar-collapsed .sidebar .text-muted, body.sidebar-collapsed .sidebar .text-truncate, 
body.sidebar-collapsed .sidebar p {
    display: none !important;
}

/* 3. ITENS DO MENU (Links): Centralizar Ícones */
body.sidebar-collapsed .sidebar .nav-link {
    text-align: center !important;
    /* padding: 15px 0 !important; <-- REMOVIDO do geral conforme solicitado */
    justify-content: center !important;
    display: flex !important;
    width: 100% !important;
	/**/font-size:0px !important;
}

/* APLICAR PADDING ESPECÍFICO APENAS PARA TAREFAS E MURAL */
body.sidebar-collapsed .sidebar .nav-link[href*="view=tasks"],
body.sidebar-collapsed .sidebar .nav-link[href*="view=mural"] {
    /*padding: 15px 0 !important;*/
	padding-right: 10px;
	
}

body.sidebar-collapsed .sidebar .nav-link i {
    margin-right: 0 !important;
    font-size: 1.4rem !important; /* Ícones levemente maiores */
    width: 24px; /* Largura fixa para garantir alinhamento */
    text-align: center;
}

/* Ocultar todo texto, badges e setas */
body.sidebar-collapsed .sidebar .nav-link span,
body.sidebar-collapsed .sidebar .nav-link:after,
body.sidebar-collapsed .sidebar h6 {
    display: none !important;
}

/* 4. ÁREA DO PERFIL (Footer): Layout Vertical Limpo */
body.sidebar-collapsed .sidebar .mt-auto {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 15px 0 !important;
    width: 100%;
}

/* Avatar: Container centralizado */
body.sidebar-collapsed .sidebar .mt-auto .d-flex {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px !important;
    width: 100%;
}

/* Avatar: A imagem/círculo em si */
body.sidebar-collapsed .sidebar .mt-auto .d-flex > div:first-child,
body.sidebar-collapsed .sidebar .mt-auto .d-flex .rounded-circle {
    margin-right: 0 !important;
    margin-bottom: 5px;
    width: 40px !important;
    height: 40px !important;
}

/* Ocultar Nome e Email (Segundo filho do d-flex) */
body.sidebar-collapsed .sidebar .mt-auto .d-flex > div:nth-child(2) {
    display: none !important;
}

/* 5. BOTÕES DO RODAPÉ (Perfil, Tema, Sair) */
/* Transformar em ícones redondos */
body.sidebar-collapsed .sidebar .mt-auto .btn,
body.sidebar-collapsed .sidebar .mt-auto a.btn {
    width: 45px !important;
    height: 45px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    margin: 4px auto !important;
    font-size: 0 !important; /* Truque para esconder qualquer texto solto */
}

/* Garantir que o ícone dentro do botão fique visível e no tamanho certo */
body.sidebar-collapsed .sidebar .mt-auto .btn i,
body.sidebar-collapsed .sidebar .mt-auto a.btn i {
    font-size: 1.2rem !important; /* Restaura tamanho do ícone */
    margin: 0 !important;
    display: block !important;
}

/* Ocultar spans dentro dos botões (caso existam) */
body.sidebar-collapsed .sidebar .mt-auto .btn span {
    display: none !important;
}

/* --- BOTÃO DE TOGGLE (SETINHA) --- */
#sidebar-toggle-button {
    position: fixed;
    top: 25px; /* Ajustado para alinhar melhor com o topo */
    left: var(--sidebar-width-expanded); 
    width: 28px;
    height: 28px;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 1060; 
    transform: translateX(-50%); 
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    color: #6c757d;
}

#sidebar-toggle-button:hover {
    color: var(--sys-primary);
    border-color: var(--sys-primary);
    background-color: #f8f9fa;
}

/* Posição quando recolhido */
body.sidebar-collapsed #sidebar-toggle-button {
    left: var(--sidebar-width-collapsed);
}

/* Mobile: Reset total */
@media (max-width: 768px) {
    #sidebar-toggle-button { display: none !important; }
    body.sidebar-collapsed .sidebar { width: 80% !important; max-width: 300px !important; }
    body.sidebar-collapsed .content { margin-left: 0 !important; }
}

/* Ajuste Responsivo para Date Details e Tasks */
@media (min-width: 992px) {
    body.sidebar-collapsed .date-details-responsive-padding {
        padding-left: var(--sidebar-width-collapsed) !important;
    }
    body:not(.sidebar-collapsed) .date-details-responsive-padding {
        padding-left: var(--sidebar-width-expanded) !important;
    }
}