/* =============================================== */
/* ESTILOS GLOBAIS BÁSICOS (se ainda não tiver)    */
/* =============================================== */
body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    color: #333;
    line-height: 1.6;
    background-color: #f4f7f6; /* Um fundo global suave */
    margin: 0;
    display: flex;
    flex-direction: column;
    min-height: 100vh; /* Garante que o footer fique no fim */
}

main {
    flex: 1; /* Ocupa o espaço disponível */
}

/* Ajustes na navbar escura padrão do Bootstrap (bg-dark) se necessário */
/* .navbar.bg-dark { */
    /* Pode adicionar ou sobrescrever estilos aqui se o padrão do Bootstrap não for suficiente */
    /* Exemplo: border-bottom: 3px solid #01b4e4; */
/* } */

.navbar.bg-dark .navbar-brand {
    font-weight: 600;
}
.navbar.bg-dark .nav-link {
    font-weight: 500;
}
.navbar.bg-dark .nav-link.active {
    color: #ffffff !important; /* Garante que o link ativo fique branco */
}


/* =============================================== */
/* ESTILOS PARA PÁGINA DE LOGIN (complementa o Bootstrap) */
/* =============================================== */
/* main.py-5 já dá um bom padding, mas se quiser um fundo diferente para o main do login: */
/*
body:has(main.login-main-content) { // Seletor moderno, pode não ter suporte total
    background-color: #e9ecef;
}
main.login-main-content { // Você pode adicionar essa classe ao main do Login.html
    // Estilos específicos para o main do login se o py-5 não for suficiente
}
*/

.login-container.card { /* Já tem a classe card, podemos refinar */
    border: none; /* Remove a borda padrão do card se preferir só a sombra */
    margin-top: 2rem; /* Espaço acima do card de login */
    margin-bottom: 2rem; /* Espaço abaixo */
}

.login-container h1.h3 { /* Estiliza o h1 que tem a classe h3 */
    color: #0d2d52; /* Cor escura para o título */
    font-weight: 600;
}

/* Inputs e Botão já usam classes do Bootstrap (form-control-lg, btn-lg) */
/* Você pode adicionar :focus styles mais personalizados se desejar */
.form-control-lg:focus {
    border-color: #01b4e4; /* Cor de destaque no foco */
    box-shadow: 0 0 0 0.25rem rgba(1, 180, 228, 0.25);
}
.btn-lg.btn-primary { /* Botão de login */
    background-color: #01b4e4;
    border-color: #01b4e4;
}
.btn-lg.btn-primary:hover {
    background-color: #0295be;
    border-color: #0295be;
}


/* =============================================== */
/* ESTILOS PARA FEEDBACK MESSAGES (reutilizável)   */
/* =============================================== */
.feedback-message {
    padding: 0.75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: .25rem; /* Bootstrap padrão de borda */
    text-align: center;
    font-size: 0.95rem;
    display: none; /* Começa escondido, JS mostra */
}
.feedback-message.success {
    color: #0f5132;
    background-color: #d1e7dd;
    border-color: #badbcc;
}
.feedback-message.error {
    color: #842029;
    background-color: #f8d7da;
    border-color: #f5c2c7;
}

/* =============================================== */
/* SEUS ESTILOS EXISTENTES PARA INDEX.HTML         */
/* =============================================== */

            .hero-section {
                background-color: #032541;
                color: white;
                padding: 50px 0;
            }

            .movie-card {
                margin-bottom: 40px;
                transition: transform 0.3s;
                border-radius: 8px;
                overflow: hidden;
                box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            }

            .movie-card:hover {
                transform: translateY(-5px);
                box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
            }

            .movie-poster {
                position: relative;
                overflow: hidden;
            }

            .movie-poster img {
                width: 100%;
                transition: transform 0.5s;
            }

            .movie-card:hover .movie-poster img {
                transform: scale(1.05);
            }

            .movie-info {
                padding: 20px;
                background-color: white;
            }

            .movie-title {
                font-size: 1.4rem;
                font-weight: 600;
                margin-bottom: 10px;
            }

            .session-info {
                background-color: #f8f9fa;
                padding: 10px;
                margin-top: 10px;
                border-radius: 5px;
                font-size: 0.9rem;
            }

        .screenCinema {
            background-color: #333;
            width: 90%;
            height: 30px;
            margin: 10px auto;
            color: white;
            line-height: 25px;
            border-radius: 8px;
            text-align: center;
        }

            .btn-reserve {
                background-color: #01b4e4;
                color: white;
                border: none;
                padding: 8px 20px;
                border-radius: 30px;
                margin-top: 15px;
                transition: background-color 0.3s;
            }

            .btn-reserve:hover {
                background-color: #0295be;
                color: white;
            }

            footer {
                background-color: #032541;
                color: white;
                padding: 30px 0;
                margin-top: 50px;
            }

            .movie-summary {
                height: 100px;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 4;
                -webkit-box-orient: vertical;
            }

            .movie-details-btn {
                color: #01b4e4;
                text-decoration: none;
                margin-top: 10px;
                display: inline-block;
                font-weight: 500;
            }

/* ============================================================ */
/* ESTILO PARA A NAVEGAÇÃO EM ABAS NAS PAGINAS ADMINISTRATIVAS  */
/* ============================================================ */

.admin-content-card {
    background-color: #fff;
    padding: 1.5rem; 
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.075);
    margin-bottom: 2rem;
}
.panel-section-title {
    color: #032541;
    margin-bottom: 1.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid #01b4e4;
}
.admin-nav-tabs .nav-link { /* Para o estilo nav-pills que usamos */
    color: #032541;
    font-weight: 500;
    border: 1px solid transparent;
    border-bottom: 3px solid transparent;
    margin-right: 0.25rem; /* Espaçamento entre pills */
    border-radius: .25rem .25rem 0 0; /* Cantos arredondados no topo para pills */
}
.admin-nav-tabs .nav-link.active {
    color: #01b4e4;
    background-color: #f8f9fa; /* Fundo um pouco mais destacado para active pill */
    border-color: #dee2e6 #dee2e6 #01b4e4; /* Borda para efeito de aba */
}
.admin-nav-tabs .nav-link:hover:not(.active) {
    color: #01b4e4;
    background-color: #e9ecef; /* Fundo suave no hover */
    border-color: #dee2e6;
}

/* Estilos específicos para a lista de filmes e modais do PainelFilmes.php */
/* Se estes forem realmente SÓ para PainelFilmes, podem ficar aqui ou ir para styles.css com seletores mais específicos */
#filmsList .card { /* Aplicando diretamente aos cards gerados pelo JS */
    /* border: 1px solid #ddd; */ /* Bootstrap já tem borda, pode remover ou ajustar */
    background-color: #f9f9f9;
}
#filmsList .card img.img-fluid { 
    max-height: 180px; 
    object-fit: contain; /* Mudei para contain para ver o cartaz inteiro */
    border-radius: 4px;
    background-color: #e9ecef; /* Fundo para a área da imagem */
    padding: 5px; /* Pequeno padding em volta da imagem */
}
.sessions-info, .sessions-container { /* Para modais de filme */
    margin-top: 10px;
    padding: 10px;
    background-color: #f0f2f5; 
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    font-size: 0.9em;
}
.session-item { 
    padding: 8px 5px;
    border-bottom: 1px dashed #ccc;
}
.session-item:last-child {
    border-bottom: none;
}
.img-preview { 
    max-width: 150px; 
    max-height: 220px;
    margin-top: 10px;
    border: 1px solid #ddd;
    padding: 3px;
    background-color: #f8f9fa;
    display: none; 
}
.sessions-info-admin div { 
    margin-bottom: 0.3rem;
}
.movie-summary-admin { 
    font-size: 0.9em;
    color: #555;
    margin-bottom: 0.8rem;
}