:root {
    --color-rojo-app: #E32B35;
    --color-azul-app: #2756A1;
    --color-blanco: #ffffff;
}

body {
    /* font-family: 'Poppins', sans-serif; */
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background: 
        linear-gradient(rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.85)),
        url('../img/login-bg.svg') no-repeat;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}


main {
    flex: 1;
    padding-bottom: 3rem;
}

/* Header institucional */
.bg-app {
    background-color: var(--color-azul-app);
    color: var(--color-blanco);
}



/* Personalización de tarjetas */
.card-candidato {
    border: 1px solid #ccc;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.card-candidato .img-thumbnail {
    border-radius: 4px;
    max-height: 150px;
}

/* Footer */
/* footer {
    background-color: #212529;
    color: white;
    padding: 20px 0;
    text-align: center;
} */

footer {
    display: block;
    unicode-bidi: isolate;
}

/* .btn-app {
    background-color: #002366;
    color: #fff;
    border: none;
    transition: background-color 0.3s ease;
}

.btn-app:hover {
    background-color: #d71920;
    color: #fff;
} */

.btn-app {
    background-color: var(--color-rojo-app);
    color: var(--color-blanco);
    border: none !important;
    box-shadow: none;
    transition: all 0.3s ease;
}

/* Hover */
.btn-app:hover {
    background-color: var(--color-azul-app);
    color: var(--color-blanco) !important;
    border: none !important;
}

/* Click (activo) */
.btn-app:active,
.btn-app:focus {
    background-color: var(--color-azul-app); /* Puedes usar el mismo que en hover */
    color: var(--color-blanco) !important;
    outline: none;
    box-shadow: none;
}

/* Si se está usando Bootstrap, evita también estas clases que podrían entrar por defecto */
.btn-app:focus-visible {
    outline: none !important;
}


.bg-light-subtle {
    background-color: #f8f9fa !important;
}

/* .hover-highlight {
    transition: color 0.3s ease, font-weight 0.3s ease;
    cursor: pointer;
} */

/* .hover-highlight:hover {
    color: var(--color-rojo-app);
    font-weight: bold;
} */


header .ri-facebook-circle-fill,
header .ri-twitter-x-line,
header .ri-youtube-fill,
header .ri-instagram-fill {
    transition: transform 0.3s ease, color 0.3s ease;
}

/* header a:hover i {
    transform: scale(1.2);
    color: var(--color-rojo-app);
} */

footer a:hover {
    color: var(--color-rojo-app);
    transition: color 0.3s ease;
}

.text-justify {
    text-align: justify;
}



.btn{
    border-radius: 0px !important;
}

.candidato-card {
    background-color: #f9fafc; /* Blanco azulado suave */
    border-radius: 0; /* Sin redondeado */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
    border: 1px solid #e2e8f0; /* Borde sutil */
}

.candidato-card:hover {
    transform: scale(1.03);
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
    z-index: 2;
}

.text-justify{
    text-align: justify !important;
}
.texto-justificado{
    text-align: justify !important;
}

.no-download-img {
    pointer-events: none;
    user-select: none;
    -webkit-user-drag: none;
}

.modal-content {
    border-radius: 0 !important;
}
/* 
h1, h1 span {
    font-family: Arvo;
    font-size: 36px;
    font-display: swap;
}

.section-title {
    text-align: center;
    font-weight: 700 !important;
} */



/* 
.pagination .page-link {
    color: var(--color-azul-app);
    border-color: var(--color-azul-app);
    transition: background-color 0.3s ease, color 0.3s ease;
}

.pagination .page-item.active .page-link {
    background-color: var(--color-azul-app);
    color: var(--color-blanco);
    border-color: var(--color-azul-app);
}

.pagination .page-link:hover {
    background-color: var(--color-rojo-app);
    color: var(--color-blanco);
    border-color: var(--color-rojo-app);
} */



/* Paginación personalizada para landing */
.pagination-landing .page-item .page-link {
    color: var(--color-blanco);
    border: none;
    margin: 0 4px;
    background-color: #fff;
    transition: all 0.3s ease;
    border-radius: 0 !important;
    padding: 0.5rem 0.9rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    background-color: var(--color-rojo-app);
}

.pagination-landing .page-item.active .page-link {
    background-color: var(--color-azul-app);
    color: #fff;
    font-weight: bold;
}

.pagination-landing .page-item .page-link:hover {
    background-color: var(--color-azul-app);
    color: #fff;
}

.pagination-landing .page-item.disabled .page-link {
    color: #999;
    background-color: #eee;
    pointer-events: none;
}

.page-link {
    font-size: 1.5rem !important;
   
}



.top-header a {
    text-decoration: none !important;
}

.top-header a:hover {
    text-decoration: none !important;
}

.header-nav-actions a:hover {
    text-decoration: none !important;
}




#navbar .menu-item.current_page_ancestor > a, #navbar .menu-item.current_page_item > a, #navbar .menu-item:hover > a {
    background: #E32B35 !important;
	color:#fff;
}

#navbar .menu-item > a,
                                .navbar-nav .search_products a,
                                .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus,
                                .navbar-default .navbar-nav > li > a{color:#1A1B22;}#navbar .menu-item.current_page_ancestor.current_page_parent > a, 
                                    #navbar .menu-item.current_page_item.current_page_parent > a, 
                                    #navbar .menu-item:hover > a{background:#E32B35;}#navbar .sub-menu, .navbar ul li ul.sub-menu{background-color:#FFFFFF;}#navbar ul.sub-menu li a{color:#1A1B22;}#navbar ul.sub-menu li a:hover{background-color:transparent;}#navbar ul.sub-menu li a:hover{color:#E32B35;}body{font-family:"Open Sans";}h1,h1 span{font-family:Arvo;line-height:36px;font-size:36px;}h2{font-family:Arvo;line-height:30px;font-size:30px;}h3{font-family:Arvo;line-height:24px;font-size:24px;}h4{font-family:Arvo;line-height:18px;font-size:18px;}h5{font-family:Arvo;line-height:14px;font-size:14px;}h6{font-family:Arvo;line-height:12px;font-size:12px;}input,textarea{font-family:"Open Sans";}input[type="submit"]{font-family:"Open Sans";}header .top-header{background-color:#2756a1;}header .top-header .left-side a{color:#FFFFFF;}.navbar-default{background-color:#fff;}



.navbar {
    --bs-navbar-padding-x: 0;
    --bs-navbar-padding-y: 0rem;
    
    
    padding: var(--bs-navbar-padding-y) var(--bs-navbar-padding-x);
}

.form-select-lg {
    padding-top: 0.7rem;
    padding-bottom: 0.9rem;
    padding-left: 1rem;
    font-size: 1.25rem;
    border-radius: var(--bs-border-radius-lg);
}


.redes-icones-vistosos .btn-icon {
    width: 40px; /* Aumentado */
    height: 40px; /* Aumentado */
    font-size: 2.2rem; /* Ícono más grande */
    background-color: #3560a6; /* Gris claro */
    color: #444; /* Ícono gris oscuro */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all 0.3s ease;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
    margin-bottom: 1rem;
    margin-top: 1rem;
  }

  /* Hover suave: oscurece un poco o aplica sombra extra */
  .redes-icones-vistosos .btn-icon:hover {
    filter: brightness(1.2); /* Más clarito */
    transform: scale(1.1);
    box-shadow: 0 6px 12px rgba(214, 214, 214, 0.3);
  }
  
  /* Mejora de contraste en fondos claros */
  .redes-icones-vistosos .snapchat:hover,
  .redes-icones-vistosos .kick:hover {
    color: #000 !important;
  }

  
  /* Hover: cambia solo el color del ícono */
  /* .redes-icones-vistosos .btn-icon.facebook:hover i    { color: #1877F2; }
  .redes-icones-vistosos .btn-icon.x:hover i           { color: #000000; }
  .redes-icones-vistosos .btn-icon.instagram:hover i   { color: #E1306C; }
  .redes-icones-vistosos .btn-icon.linkedin:hover i    { color: #0077B5; }
  .redes-icones-vistosos .btn-icon.youtube:hover i     { color: #FF0000; }
  .redes-icones-vistosos .btn-icon.tiktok:hover i      { color: #000000; }
  .redes-icones-vistosos .btn-icon.snapchat:hover i    { color: #FFFC00; }
  .redes-icones-vistosos .btn-icon.pinterest:hover i   { color: #E60023; }
  .redes-icones-vistosos .btn-icon.reddit:hover i      { color: #FF4500; }
  .redes-icones-vistosos .btn-icon.whatsapp:hover i    { color: #25D366; }
  .redes-icones-vistosos .btn-icon.telegram:hover i    { color: #0088CC; }
  .redes-icones-vistosos .btn-icon.messenger:hover i   { color: #00B2FF; }
  .redes-icones-vistosos .btn-icon.wechat:hover i      { color: #7BB32E; }
  .redes-icones-vistosos .btn-icon.discord:hover i     { color: #7289DA; }
  .redes-icones-vistosos .btn-icon.twitch:hover i      { color: #9146FF; }
  .redes-icones-vistosos .btn-icon.spotify:hover i     { color: #1DB954; }
  .redes-icones-vistosos .btn-icon.soundcloud:hover i  { color: #FF7700; }
  .redes-icones-vistosos .btn-icon.github:hover i      { color: #171515; }
  .redes-icones-vistosos .btn-icon.mastodon:hover i    { color: #3088D4; }
  .redes-icones-vistosos .btn-icon.threads:hover i     { color: #000000; }
  .redes-icones-vistosos .btn-icon.bluesky:hover i     { color: #0085FF; }
  .redes-icones-vistosos .btn-icon.kick:hover i        { color: #53FC18; } */

  .redes-icones-vistosos .btn-icon.facebook:hover i    { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.x:hover i           { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.instagram:hover i   { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.linkedin:hover i    { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.youtube:hover i     { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.tiktok:hover i      { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.snapchat:hover i    { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.pinterest:hover i   { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.reddit:hover i      { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.whatsapp:hover i    { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.telegram:hover i    { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.messenger:hover i   { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.wechat:hover i      { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.discord:hover i     { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.twitch:hover i      { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.spotify:hover i     { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.soundcloud:hover i  { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.github:hover i      { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.mastodon:hover i    { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.threads:hover i     { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.bluesky:hover i     { color: #FFFFFF }
  .redes-icones-vistosos .btn-icon.kick:hover i        { color: #FFFFFF }
  
  
  
  

  .fancybox-wrapper {
    display: inline-block;
    width: 100%;
    height: 100%;
  }


  .redes-sociales a {
    width: 36px;
    height: 36px;
    /* border-radius: 50%; */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.2rem;
    transition: all 0.3s ease;
    box-shadow: 0 2px 5px rgba(0,0,0,0.3);
    text-decoration: none;
  }
  
  /* Icono dentro del botón */
  .redes-sociales a i {
    color: #fff;
    transition: transform 0.3s ease;
  }
  
  .redes-sociales a:hover i {
    transform: scale(1.2);
  }
  
  /* Colores base por red social */
 /*  .redes-sociales .facebook    { background-color: #1877F2; }
  .redes-sociales .x           { background-color: #000000; }
  .redes-sociales .instagram   { background-color: #E1306C; }
  .redes-sociales .youtube     { background-color: #FF0000; } */
  
  /* Hover más oscuro */
  .redes-sociales .facebook:hover    { background-color: #145dc2; }
  .redes-sociales .x:hover           { background-color: #1a1a1a; }
  .redes-sociales .instagram:hover   { background-color: #c01e5a; }
  .redes-sociales .youtube:hover     { background-color: #cc0000; }
  
  

  
  .vc_custom_1738959837828 {
    margin-top: -12px !important;
    margin-bottom: 0px !important;
    padding-top: 80px !important;
    padding-bottom: 80px !important;
    background: #1E73BE url(https://app.pe/wp-content/uploads/2025/02/erradicar-la-pobreza-1.jpg?id=7303) !important;
}

.vc_row {
    margin-left: -15px;
    margin-right: -15px;
}



h1, h1 span {
    font-family: Arvo !important;
    line-height: 36px !important;
    font-size: 36px !important;
}

h1 {
    font-size: 2em;
    margin: 0.67em 0;
}

h1 {
    display: block;
    font-size: 2em;
    margin-block-start: 0.67em;
    margin-block-end: 0.67em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
    unicode-bidi: isolate;
    line-height: 4.1;
}


.titulo-tipo-eleccion {
    letter-spacing: 1.6px; /* Puedes probar con 2px o más si deseas mayor separación */
  }


  h4 {
    font-family: Arvo;
    line-height: 18px;
    font-size: 18px;
}




.btnnnn {
    --bs-btn-padding-x: 0.75rem;
    --bs-btn-padding-y: 0.375rem;
    --bs-btn-font-family: ;
    --bs-btn-font-size: 0.9rem;
    --bs-btn-font-weight: 400;
    --bs-btn-line-height: 1.5;
    --bs-btn-color: var(--bs-body-color);
    --bs-btn-bg: transparent;
    --bs-btn-border-width: var(--bs-border-width);
    --bs-btn-border-color: transparent;
    --bs-btn-border-radius: var(--bs-border-radius);
    --bs-btn-hover-border-color: transparent;
    --bs-btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(15, 17, 21, 0.075);
    --bs-btn-disabled-opacity: 0.65;
    --bs-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);
    display: inline-block;
    padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
    font-family: var(--bs-btn-font-family);
    font-size: var(--bs-btn-font-size);
    font-weight: var(--bs-btn-font-weight);
    line-height: var(--bs-btn-line-height);
    color: var(--bs-btn-color);
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);
    border-radius: var(--bs-btn-border-radius);
    background-color: var(--bs-btn-bg);
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    font-size: 14px;
}

.btnnnn {
    box-shadow: inset 1.5px 1.5px 0px rgba(255, 255, 255, .25), inset -1.5px -1.5px 0px rgba(0, 0, 0, .1);
}

.btn-outline-secondaryyy {
    --bs-btn-color: #6c757d !important;
    --bs-btn-border-color: #6c757d !important;
    --bs-btn-hover-color: #fff !important;
    --bs-btn-hover-bg: #6c757d !important;
    --bs-btn-hover-border-color: #6c757d !important;
    --bs-btn-focus-shadow-rgb: 108, 117, 125 !important;
    --bs-btn-active-color: #fff !important;
    --bs-btn-active-bg: #6c757d !important;
    --bs-btn-disabled-border-color: #6c757d !important;
    --bs-gradient: none !important;
}

.btn-outline-secondaryyy:hover{color:#272727 !important; text-decoration: none;}.btn-outline-secondaryyy.active{color:#272727 !important}



.list-view .post-details {
    align-self: center !important;
    padding: 30px !important;
    position: relative !important;
}
a{
    text-decoration: none !important;
}


.post-name-propuestas {
    line-height: 1.5em !important;
    color: #1a1b22 !important ;
    font-weight: bold !important;
}


.descripcion-propuesta {
    color: rgb(69, 70, 70) !important;
    font-size: 16px !important;
    font-weight: 300 !important;
    line-height: 1.63043em !important;
}


.interlineado-1-5 {
    line-height: 1.5em !important; 
}

.espacio-entre-iconos {
    display: inline-block;
    margin-bottom: 15px;
  }
  
  /* Espaciado horizontal y vertical entre botones */
  .espacio-entre-iconos > a {
    margin: 5px 5px;
    display: inline-block;
  }
 
  
  .espacio-entre-botones {
    display: block;
    margin-bottom: 15px;
  }
  
  /* Espaciado horizontal y vertical entre botones */
  .espacio-entre-botones > a {
    margin: 5px 5px;
    display: inline-block;
  }

/* .espacio-entre-botones{
    gap: 2rem !important;
} */

.btn-lg, .btn-group-lg>.btn {
    padding: 10px 16px !important;
    font-size: 15px !important;
    line-height: 1.33 !important;
    border-radius: 0px !important;
}
.btn-lg2, .btn-group-lg>.btn {
    padding: 10px 16px !important;
    font-size: 14px !important;
    line-height: 1.33 !important;
    border-radius: 0px !important;
}


.nombre-candidato-propuesta{
    margin-top: 0px !important;
    margin-bottom: 10px;
}

/* @media (max-width: 767.98px) {
    #navbar {
      display: none;
    }
  
    #navbar.mostrar {
      display: block;
    }
  } */


  .fila-responsiva {
	position: relative !important;
	box-sizing: border-box !important;
	width: 100vw !important;
	max-width: 100vw !important;
	left: 0 !important;
	margin-left: calc(-50vw + 50%) !important;
	margin-right: calc(-50vw + 50%) !important;
}


/* @media (max-width: 992px) {
	.fila-responsiva {
		padding-left: 40px;
		padding-right: 40px;
	}
}

@media (max-width: 576px) {
	.fila-responsiva {
		padding-left: 15px;
		padding-right: 15px;
	}
} */




/* HEADER GENERAL */
/* .header1 .top-header {
    padding: 0.5rem 0;
    font-size: 0.9rem;
  }
  
  .header1 .navbar-header img {
    max-height: 50px;
  } */
  
  /* AJUSTE RESPONSIVO */
 /*  @media (max-width: 991.98px) {
    .header1 .top-header .left-side,
    .header1 .top-header .right-side {
      text-align: center !important;
      justify-content: center !important;
    }
  
    .navbar-collapse {
      padding-top: 1rem;
      padding-bottom: 1rem;
      background-color: #fff;
    }
  
    .navbar-nav {
      flex-direction: column;
      align-items: start;
      padding-left: 1rem;
    }
  
    .navbar-toggler {
      margin-left: auto;
    }
  
    .header-nav-actions {
      justify-content: flex-start;
      margin-bottom: 1rem;
      padding-left: 1rem;
    }
  } */
  
/* Asegura que las tarjetas tengan altura igual y bien distribuida */
.row.igual-altura > .col {
    display: flex;
  }
  
  .card.h-100,
  .candidato-card {
    display: flex;
    flex-direction: column;
    height: 100%;
  }
  
  /* Este es el cuerpo que se estira para mantener altura pareja */
  .candidato-card .card-body {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-bottom: 1rem;
  }
  
  /* El footer siempre abajo */
  .candidato-card .card-footer {
    margin-top: auto;
  }
  
  /* Normalizar alturas de títulos y párrafos */
  .candidato-card h4,
  .candidato-card p {
    margin-bottom: 0.5rem;
  }
  
  /* Establecer una altura mínima para imágenes */
  .vc_single_image-wrapper img {
    max-height: 300px;
    object-fit: cover;
  }

  .text-white{
    color: #FFFFFF !important;
  }
    
  
  .espacio-entre-botones-horizontal {
    display: inline-block !important;
    margin-bottom: 5px !important;
  }