/* assets/css/style.css */
:root {
    --rojo-principal: #ba000d;
    --rojo-hover: #9c000b;
    --azul-voto: #0d6efd;
    --gris-fondo: #f8f9fa;
}

body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background-color: var(--gris-fondo); margin: 0; padding: 0; display: flex; min-height: 100vh; }

/* SIDEBAR */
.sidebar { width: 250px; background-color: var(--rojo-principal); color: white; padding: 20px; box-shadow: 2px 0 10px rgba(0,0,0,0.2); z-index: 30; display: flex; flex-direction: column; }
.header-sidebar { display: flex; justify-content: space-between; align-items: center; border-bottom: 2px solid rgba(255,255,255,0.2); padding-bottom: 15px; }
.header-sidebar h2 { margin: 0; font-size: 20px; }

.menu-links { margin-top: 20px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.enlace-menu { color: white; text-decoration: none; font-size: 16px; padding: 12px 15px; border-radius: 8px; background-color: rgba(255,255,255,0.1); transition: all 0.3s; display: block; }
.enlace-menu:hover { background-color: rgba(255,255,255,0.25); transform: translateX(5px); }
.enlace-activo { background-color: white !important; color: var(--rojo-principal) !important; font-weight: bold; }

/* CONTENIDO PRINCIPAL */
.contenido-principal { flex: 1; display: flex; flex-direction: column; overflow-x: hidden; }
.encabezado-rojo { background-color: var(--rojo-principal); height: 70px; width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 0 20px; box-sizing: border-box; box-shadow: 0 4px 8px rgba(0,0,0,0.1); color: white; font-weight: bold; }

/* COMPONENTES DE USUARIO */
.user-menu { position: relative; }
.user-btn { background: rgba(255,255,255,0.1); color: white; border: 1px solid rgba(255,255,255,0.3); padding: 8px 15px; border-radius: 20px; cursor: pointer; }
.user-dropdown-content { display: none; position: absolute; right: 0; top: 110%; background: white; min-width: 180px; box-shadow: 0 8px 16px rgba(0,0,0,0.2); border-radius: 8px; z-index: 100; }
.user-dropdown-content a { color: #333; padding: 12px 16px; text-decoration: none; display: block; }
.mostrar { display: block !important; }

/* RESPONSIVE HAMBURGUESA */
.btn-hamburguesa { display: none; background: none; border: 1px solid white; color: white; font-size: 20px; padding: 5px 10px; border-radius: 5px; cursor: pointer; }

@media (max-width: 900px) {
    body { flex-direction: column; }
    .sidebar { width: 100%; height: auto; padding: 15px; box-sizing: border-box; }
    .btn-hamburguesa { display: block; }
    .menu-links { display: none; }
    .menu-links.mostrar-menu { display: flex; }
    .encabezado-rojo { height: auto; padding: 15px; flex-direction: column; gap: 10px; }
}

/* --- ESTILOS ESPECÍFICOS RESTAURADOS --- */
.foto-perfil { 
    width: 380px; 
    height: 140px; 
    background-color: white; 
    border-radius: 10px; 
    border: 4px solid white; 
    background-image: url('../image/kz2026.jpg'); 
    background-size: cover; 
    background-position: center; 
    background-repeat: no-repeat; 
    box-shadow: 0px 10px 20px rgba(0,0,0,0.25); 
    position: relative; 
    top: 40px; 
    transition: transform 0.3s ease;
}
.foto-perfil:hover { transform: translateY(-5px); box-shadow: 0px 15px 25px rgba(0,0,0,0.3); }

/* Contenedor centrado para los textos (como estaba originalmente) */
.contenedor { 
    max-width: 800px; 
    width: 100%; 
    margin: 0 auto; 
    padding: 40px 20px; 
    padding-top: 70px; 
    text-align: center; 
    box-sizing: border-box; 
}
h1 { color: #333; margin-top: 10px; margin-bottom: 5px; font-size: 32px; text-shadow: 1px 1px 2px rgba(0,0,0,0.1); }
p.subtitulo { color: #666; font-size: 16px; margin-top: 0; margin-bottom: 25px; line-height: 1.5;}

/* Media query para la foto en celulares */
@media (max-width: 900px) {
    .foto-perfil { margin: 15px auto; width: 240px; height: 90px; top: 0; border-width: 2px; box-shadow: 0px 3px 6px rgba(0,0,0,0.2);}
}