.map-layout {
    display: flex;
    height: calc(100vh - 70px); /* Ajuste conforme o height da sua navbar */
    overflow: hidden;
}

/* Sidebar */
.map-sidebar {
    width: 350px;
    background: #fff;
    box-shadow: 2px 0 10px rgba(0,0,0,0.05);
    display: flex;
    flex-direction: column;
    z-index: 1000; /* Ficar acima do mapa */
}

.sidebar-header { padding: 20px; border-bottom: 1px solid #eee; }
.sidebar-header h2 { margin: 0; font-size: 1.5rem; }
.sidebar-header p { margin: 5px 0 0; color: #666; font-size: 0.9rem; }

.search-group { padding: 16px 20px; border-bottom: 1px solid #eee; background: #fafafa; }
.student-search-input {
    width: 100%;
    padding: 10px 14px;
    border-radius: 8px;
    border: 1.5px solid #ccc;
    font-family: 'Inter', sans-serif;
    font-size: 0.95rem;
    box-sizing: border-box;
    transition: border-color 0.2s, box-shadow 0.2s;
    outline: none;
}
.student-search-input:focus {
    border-color: #0056b3;
    box-shadow: 0 0 0 3px rgba(0, 86, 179, 0.12);
}

.stats-mini { padding: 15px 20px; font-size: 0.9rem; background: #fff; border-bottom: 1px solid #eee; }

/* Lista de alunos */
.student-list { flex: 1; overflow-y: auto; padding: 10px 20px; }
.student-card { padding: 12px; border: 1px solid #eee; border-radius: 8px; margin-bottom: 10px; cursor: pointer; transition: 0.15s; }
.student-card:hover { border-color: #0056b3; background: #f4f9ff; }
.student-card.active { border-color: #0056b3; background: #e8f0fb; }
.student-card strong { display: block; font-size: 0.95rem; color: #222; margin-bottom: 2px; }
.student-card span { display: block; font-size: 0.82rem; color: #555; }
.student-card small { display: block; font-size: 0.78rem; color: #999; margin-top: 3px; }

/* Placeholder (estado inicial — sem pesquisa) */
.search-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 40px 24px;
    color: #999;
}
.search-placeholder-icon {
    width: 40px;
    height: 40px;
    margin-bottom: 14px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23bbb'%3E%3Ccircle cx='11' cy='11' r='7' stroke-width='2'/%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M16.5 16.5l4 4'/%3E%3C/svg%3E") center/contain no-repeat;
}
.search-placeholder p { font-size: 0.88rem; margin: 0 0 8px; line-height: 1.5; }
.search-placeholder small { font-size: 0.8rem; color: #bbb; }

/* Estado sem resultados */
.search-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 40px 24px;
    color: #999;
}
.search-empty p { font-size: 0.9rem; margin: 0 0 6px; font-weight: 600; color: #555; }
.search-empty small { font-size: 0.8rem; color: #bbb; }

/* Mapa */
.map-container { flex: 1; position: relative; z-index: 1; }

/* Custom Popup do Leaflet */
.map-popup h4 { margin: 0 0 5px; font-size: 1.1rem; }
.map-popup .badge { display: inline-block; background: #eee; padding: 4px 8px; border-radius: 4px; font-size: 0.8rem; margin-bottom: 10px; font-weight: 600; }
.map-popup p { margin: 4px 0; font-size: 0.9rem; }
.map-popup .btn { display: inline-block; margin-top: 10px; text-decoration: none; font-size: 0.85rem; padding: 6px 12px;}

/* Botão de toggle da sidebar (visível apenas no mobile) */
.sidebar-toggle-btn {
    display: none;
    width: 100%;
    padding: 10px 20px;
    background: #f4f9ff;
    border: none;
    border-bottom: 1px solid #eee;
    color: #0056b3;
    font-weight: 600;
    font-size: 0.9rem;
    cursor: pointer;
    text-align: left;
    font-family: 'Inter', sans-serif;
}
.sidebar-toggle-btn::after {
    content: ' ▲';
    float: right;
}
.sidebar-toggle-btn.collapsed::after {
    content: ' ▼';
}

/* Responsivo para celular */
@media (max-width: 768px) {
    .map-layout { flex-direction: column; height: auto; min-height: 100dvh; }
    .map-sidebar { width: 100%; height: auto; max-height: 45vh; transition: max-height 0.3s ease; overflow: hidden; }
    .map-sidebar.collapsed { max-height: 48px; overflow: hidden; }
    .map-container { height: 55vh; min-height: 300px; }
    .sidebar-toggle-btn { display: block; }
    .sidebar-header { padding: 14px 20px; }
    .sidebar-header h2 { font-size: 1.2rem; }
    .search-group { padding: 12px 16px; }
    .student-list { max-height: 180px; }
}

@media (max-width: 480px) {
    .map-container { height: 50vh; }
}