/* ===== Estilos da página de gestão ===== */

* {
margin: 0;
padding: 0;
box-sizing: border-box;
}

:root {
--primary-color: #3498db;
--secondary-color: #2c3e50;
--success-color: #27ae60;
--danger-color: #e74c3c;
--warning-color: #f39c12;
--light-bg: #ecf0f1;
--white: #ffffff;
--shadow: 0 2px 8px rgba(0,0,0,0.1);
--transition: all 0.3s ease;
}

:root {
--primary-color: #005461;
--secondary-color: #0C7779;
--success-color: #27ae60;
--danger-color: #e74c3c;
--warning-color: #f39c12;
--light-bg: #092d39;
--white: #ffffff;
--shadow: 0 2px 8px rgba(0,0,0,0.1);
--transition: all 0.3s ease;
}

body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background: linear-gradient(135deg,#005461,#0C7779);
color: rgb(24, 23, 23);
line-height: 1.6;
min-height: 100vh;
}

/* HEADER */

.home-header{
display:flex;
justify-content:space-between;
align-items:center;
padding:20px 50px;
background:#005461;
color:white;
}

.home-header nav a{
margin-left:20px;
color:white;
text-decoration:none;
font-weight:bold;
}

/* CONTAINER */

.container{
max-width:1200px;
margin:auto;
}

/* HEADER PRINCIPAL */

.header{
background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));
color:white;
padding:40px 20px;
text-align:center;
box-shadow:var(--shadow);
}

.header-content h1{
font-size:2.5rem;
margin-bottom:10px;
}

/* NAVBAR */

.navbar{
display:flex;
background:white;
box-shadow:var(--shadow);
position:sticky;
top:0;
}

.nav-btn{
flex:1;
padding:15px;
background:none;
border:none;
cursor:pointer;
font-size:1rem;
border-bottom:3px solid transparent;
transition:var(--transition);
}

.nav-btn:hover{
background:var(--light-bg);
}

.nav-btn.active{
border-bottom-color:var(--primary-color);
color:var(--primary-color);
}

/* MAIN */

.main-content{
padding:30px 20px;
}

/* SEÇÕES */

.view{
display:none;
}

.view.active{
display:block;
}

/* TITULOS */

.section-header h2{
font-size:2rem;
margin-bottom:20px;
}

/* ===== Menu mobile (desktop hide) ===== */
.menu-toggle{
    display:none;
    background:none;
    border:none;
    color:white;
    font-size:1.6rem;
    cursor:pointer;
}

@media(max-width:768px){
    .menu-toggle{
        display:block;
    }

    .home-header nav{
        display:none;
        position:absolute;
        top:64px;
        left:0;
        right:0;
        background:linear-gradient(135deg,#2c3e50,#3498db);
        padding:10px 20px;
        z-index:200;
    }

    .home-header nav.show{
        display:block;
    }

    .home-header nav a{
        display:block;
        margin:10px 0;
    }
}
/* FILTROS */

.filters{
display:flex;
gap:10px;
flex-wrap:wrap;
}

.filter-select{
padding:10px;
border:2px solid var(--light-bg);
border-radius:5px;
}

/* BOTÕES */

.btn{
padding:10px 20px;
border:none;
border-radius:5px;
cursor:pointer;
font-weight:600;
}

.btn-primary{
background:var(--primary-color);
color:white;
}

.btn-danger{
background:var(--danger-color);
color:white;
}

.btn-warning{
background:var(--warning-color);
color:white;
}

/* FORMULÁRIO */

.form-aula{
background:var(--primary-color);
padding:30px;
border-radius:8px;
box-shadow:var(--shadow);
}

.form-row{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:20px;
margin-bottom:20px;
}

.form-group{
display:flex;
flex-direction:column;
}

.form-group label{
font-weight:600;
margin-bottom:8px;
}

.form-group input,
.form-group select{
padding:12px;
border:2px solid var(--light-bg);
border-radius:5px;
}

/* HORÁRIOS */

.horarios-grid{
display:grid;
grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
gap:20px;
}

.horario-card{
background:white;
border-left:5px solid var(--primary-color);
padding:20px;
border-radius:8px;
box-shadow:var(--shadow);
}

.horario-card.disponivel{
border-left-color:var(--success-color);
}

.horario-card.conflito{
border-left-color:var(--danger-color);
}

.card-header{
display:flex;
justify-content:space-between;
margin-bottom:15px;
}

.card-dia{
background:var(--primary-color);
color:white;
padding:6px 12px;
border-radius:20px;
}

.card-horario{
font-size:1.6rem;
font-weight:bold;
color:var(--primary-color);
}

.card-actions{
display:flex;
gap:10px;
margin-top:15px;
}

/* TABELA */

.tabela-container{
overflow-x:auto;
background:white;
border-radius:8px;
box-shadow:var(--shadow);
}

.tabela-aulas{
width:100%;
border-collapse:collapse;
}

.tabela-aulas thead{
background:var(--primary-color);
color:white;
}

.tabela-aulas th,
.tabela-aulas td{
padding:15px;
border-bottom:1px solid var(--light-bg);
}

.tabela-aulas tr:hover{
background:#f8f9fa;
}

.acoes-coluna{
display:flex;
gap:8px;
}

/* ALERTAS */

.alert{
padding:15px;
border-radius:5px;
margin-bottom:20px;
}

.alert-success{
background:#d4edda;
color:#155724;
}

.alert-danger{
background:#f8d7da;
color:#721c24;
}

.alert-warning{
background:#fff3cd;
color:#856404;
}

/* MODAL */

.modal{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.6);
display:flex;
align-items:center;
justify-content:center;
}

.modal-content{
background:white;
border-radius:8px;
width:90%;
max-width:600px;
}

.modal-header{
display:flex;
justify-content:space-between;
padding:20px;
border-bottom:2px solid var(--light-bg);
}

.close-btn{
font-size:2rem;
background:none;
border:none;
cursor:pointer;
}

/* RESPONSIVO */

@media(max-width:768px){

.navbar{
flex-direction:column;
}

.nav-btn{
border-left:3px solid transparent;
}

.nav-btn.active{
border-left-color:var(--primary-color);
}

.horarios-grid{
grid-template-columns:1fr;
}

.form-row{
grid-template-columns:1fr;
}

.card-actions{
flex-direction:column;
}

.acoes-coluna{
flex-direction:column;
}

}