/* --- Configurações Gerais e Cores --- */
:root {
    --cor-fundo: #f4f7f6;
    --cor-menu: #e9ecef;
    --cor-fonte-principal: #212529;
    --cor-azul-vibrante: #007bff;
    --cor-borda: #dee2e6;
    --sidebar-width: 280px;
}

body { background-color: var(--cor-fundo); color: var(--cor-fonte-principal); }
.page-wrapper { display: flex; }

/* --- Botões --- */
.btn-primary { background-color: var(--cor-azul-vibrante); border-color: var(--cor-azul-vibrante); color: white; }
.btn-primary:hover { background-color: #0056b3; border-color: #0056b3; }

/* --- Menu Lateral (Sidebar) --- */
.sidebar { width: var(--sidebar-width); height: 100vh; position: fixed; top: 0; left: 0; background-color: var(--cor-menu); border-right: 1px solid var(--cor-borda); display: flex; flex-direction: column; transition: margin-left 0.3s ease; z-index: 1000; }
.sidebar-header { padding: 1rem 1rem; border-bottom: 1px solid var(--cor-borda); }
.sidebar-brand { text-decoration: none; color: var(--cor-fonte-principal); }
.sidebar-logo { max-width: 80px; height: auto; margin-bottom: 0.5rem; }
.sidebar-nav { flex-grow: 1; overflow-y: auto; padding: 1rem; }
.sidebar .nav-link { font-size: 1rem; padding: 12px 15px; border-radius: 8px; margin-bottom: 5px; color: var(--cor-fonte-principal); transition: background-color 0.2s; }
.sidebar > .nav > .nav-item > .nav-link { font-weight: 500; }
#menuAgendamentos .nav-link, #menuPacientes .nav-link, #menuEstagiarios .nav-link, #menuAdmin .nav-link { font-size: 0.95rem; }
.sidebar .nav-link.active { background-color: var(--cor-azul-vibrante); color: white; font-weight: 500; }
.sidebar .nav-link:not(.active):hover { background-color: #d8dde2; }
.sidebar-footer { padding: 1rem; border-top: 1px solid var(--cor-borda); }

/* --- Conteúdo Principal --- */
.main-content-wrapper { margin-left: var(--sidebar-width); width: calc(100% - var(--sidebar-width)); transition: margin-left 0.3s ease, width 0.3s ease; }
.main-header {
    padding: 0.75rem 1rem;
    background-color: #fff;
    border-bottom: 1px solid var(--cor-borda);
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: sticky; /* Fica fixo no topo da área de conteúdo */
    top: 0;
    z-index: 999;
}

/* --- Lógica de Toggle --- */
.sidebar.collapsed {
    margin-left: calc(-1 * var(--sidebar-width));
}

.main-content-wrapper.expanded {
    margin-left: 0;
    width: 100%;
}

/* --- Card de Paciente --- */
#lista-pacientes .list-group-item-action { cursor: pointer; }
#lista-pacientes .list-group-item-action:hover { background-color: #f8f9fa; }

/* --- Estilos do Calendário --- */
.calendario-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 10px; }
.calendario-header { font-weight: bold; color: #6c757d; padding-bottom: 10px; }
.calendario-dia { padding: 15px; border: 1px solid var(--cor-borda); border-radius: 8px; cursor: pointer; transition: all 0.2s ease-in-out; }
.calendario-dia:hover:not(.dia-inativo) { background-color: #e9ecef; transform: scale(1.05); }
.calendario-dia.dia-inativo { background-color: #f8f9fa; color: #ced4da; cursor: not-allowed; }
.calendario-dia.dia-selecionado { background-color: var(--cor-azul-vibrante); color: white; font-weight: bold; }

/* --- Estilos da Tabela de Horários --- */
#tabela-horarios-container { max-height: 60vh; }
.tabela-horarios { width: 100%; border-collapse: separate; border-spacing: 0 5px; }
.tabela-horarios th, .tabela-horarios td { text-align: center; padding: 12px; vertical-align: middle; }
.tabela-horarios th { font-weight: 500; font-size: 0.9rem; color: #495057; }
.tabela-horarios .sala-header { text-align: left; font-weight: bold; min-width: 100px; }
.tabela-horarios td { border: 1px solid transparent; }
.slot-disponivel { background-color: #e0f2f1; color: #00796b; font-weight: 500; border-radius: 6px; cursor: pointer; transition: all 0.2s ease-in-out; }
.slot-disponivel:hover { background-color: #b2dfdb; transform: scale(1.05); }
.slot-indisponivel { background-color: #fbe9e7; color: #d84315; border-radius: 6px; cursor: not-allowed; }
.slot-selecionado { background-color: var(--cor-azul-vibrante); color: white; font-weight: bold; box-shadow: 0 0 10px rgba(0, 123, 255, 0.5); transform: scale(1.05); }

.alert-warning {
    --bs-alert-bg: #fff3cd;
    --bs-alert-color: #664d03;
    --bs-alert-border-color: #ffecb5;
}

/* --- Responsividade Mobile --- */
@media (max-width: 768px) {
    /* Sidebar oculta por padrão em mobile */
    .sidebar {
        margin-left: calc(-1 * var(--sidebar-width));
        box-shadow: 2px 0 10px rgba(0,0,0,0.1);
    }
    
    .sidebar.show {
        margin-left: 0;
    }
    
    /* Conteúdo ocupa tela toda */
    .main-content-wrapper {
        margin-left: 0;
        width: 100%;
    }
    
    /* Botão de fechar dentro da sidebar */
    #sidebarCloseMobile {
        display: block !important;
        z-index: 1001;
    }
    
    /* Header mobile */
    .main-header {
        padding: 0.5rem;
    }
    
    /* Calendário responsivo */
    .calendario-grid {
        gap: 5px;
    }
    
    .calendario-dia {
        padding: 8px;
        font-size: 0.85rem;
    }
    
    /* Tabela de horários scroll horizontal */
    #tabela-horarios-container {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    
    .tabela-horarios th,
    .tabela-horarios td {
        padding: 8px;
        font-size: 0.85rem;
        min-width: 80px;
    }
    
    .tabela-horarios .sala-header {
        min-width: 80px;
        position: sticky;
        left: 0;
        background-color: #fff;
        z-index: 1;
    }
    
    /* Cards e containers */
    .card {
        margin-bottom: 1rem;
    }
    
    .card-body {
        padding: 1rem;
    }
    
    /* Botões mobile */
    .btn {
        padding: 0.5rem 0.75rem;
        font-size: 0.9rem;
    }
    
    .btn-group {
        flex-wrap: wrap;
    }
    
    /* Formulários */
    .form-label {
        font-size: 0.9rem;
    }
    
    .form-control,
    .form-select {
        font-size: 0.9rem;
    }
    
    /* Modais */
    .modal-dialog {
        margin: 0.5rem;
    }
    
    /* Tabelas responsivas */
    .table-responsive {
        font-size: 0.85rem;
    }
    
    /* Badges e labels */
    .badge {
        font-size: 0.75rem;
        max-width: 100%;
        white-space: normal;
        word-wrap: break-word;
    }
}

@media (max-width: 576px) {
    /* Ajustes para telas muito pequenas */
    .calendario-grid {
        gap: 3px;
    }
    
    .calendario-dia {
        padding: 5px;
        font-size: 0.75rem;
    }
    
    .calendario-header {
        font-size: 0.8rem;
        padding-bottom: 5px;
    }
    
    .tabela-horarios th,
    .tabela-horarios td {
        padding: 6px;
        font-size: 0.75rem;
        min-width: 70px;
    }
    
    .card-body {
        padding: 0.75rem;
    }
    
    /* Prevenir overflow horizontal */
    body {
        overflow-x: hidden;
    }
    
    .container-fluid {
        overflow-x: hidden;
    }
    
    h1 { font-size: 1.5rem; }
    h2 { font-size: 1.3rem; }
    h3 { font-size: 1.1rem; }
    h4 { font-size: 1rem; }
    h5 { font-size: 0.9rem; }
}

/* Landscape mobile */
@media (max-width: 900px) and (orientation: landscape) {
    :root {
        --sidebar-width: 200px;
    }
    
    .sidebar {
        width: var(--sidebar-width);
    }
    
    .sidebar-header {
        padding: 0.5rem;
    }
    
    .sidebar-logo {
        max-width: 40px !important;
    }
    
    .sidebar-header h5 {
        font-size: 0.85rem;
    }
    
    .sidebar-nav {
        padding: 0.5rem;
    }
    
    .sidebar .nav-link {
        padding: 8px 10px;
        font-size: 0.85rem;
    }
    
    .sidebar-footer {
        padding: 0.5rem;
    }
    
    .sidebar-footer .btn {
        padding: 0.4rem;
        font-size: 0.8rem;
    }
    
    .sidebar-footer > div {
        font-size: 0.6rem !important;
    }
}