/* =========================
   PALETA ALICIA
========================= */
:root {
  --concytec-azul-1: #005B7F;
  --concytec-azul-2: #007EA6;
  --concytec-azul-3: #2AA7C9;
  --concytec-verde: #B6C600;
  --concytec-blanco: #FFFFFF;
  --concytec-gris: #E0E0E0;
  --concytec-texto: #333333;
  --concytec-rojo: #E53935;
  --concytec-amarillo: #FFEB3B;
}

/* RESET DEL MODO OSCURO */
body.dark-mode {
  background: var(--concytec-blanco) !important;
  color: var(--concytec-texto) !important;
}
/* Mostrar SOLO el logo desktop */
.header-brand-img.desktop-lgo {
  display: inline-block !important;
}

/* Ocultar los otros logos */
.header-brand-img.mobile-logo,
.header-brand-img.darkmobile-logo {
  display: none !important;
}
/* HEADER */
.hor-header.header {
  background: var(--concytec-blanco) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  padding: 15px 0;
}

.header-brand-img {
  filter: none !important;
  max-height: 50px;
}
.header-brand-img {
    height: 50px !important;
}

/* BUSCADOR */
.header-search {
  border-radius: 30px !important;
  padding: 10px 20px !important;
  border: 1px solid #ccc !important;
  font-size: 16px;
  width: 280px;
  transition: border-color 0.3s ease;
}

.header-search:focus {
  border-color: var(--concytec-azul-3) !important;
  outline: none;
}

/* BOTÓN BUSCAR */
.btn-primary-color {
  background: var(--concytec-verde) !important;
  border-radius: 30px !important;
  border: none !important;
  color: var(--concytec-blanco) !important;
  padding: 10px 25px;
  font-weight: 600;
  transition: background-color 0.3s ease;
}

.btn-primary-color:hover {
  background: #9EB500 !important; /* verde un poco más oscuro */
}

/* MENÚ HORIZONTAL */
.horizontal-main {
  background: var(--concytec-gris) !important;
  padding: 10px 0;
}

.horizontalMenu > .horizontalMenu-list > li > a {
  color: var(--concytec-texto) !important;
  font-weight: 600;
  font-size: 15px;
  padding: 10px 15px;
  transition: color 0.3s ease;
}

.horizontalMenu > .horizontalMenu-list > li > a:hover,
.horizontalMenu > .horizontalMenu-list > li.active > a {
  color: var(--concytec-azul-3) !important;
}

/* HERO / CABECERA CENTRAL */
.page-header {
  background: linear-gradient(180deg, var(--concytec-azul-1), var(--concytec-azul-2), var(--concytec-azul-3)) !important;
  color: var(--concytec-blanco) !important;
  padding: 40px !important;
  border-radius: 12px;
  font-family: 'Arial', sans-serif;
  font-size: 22px;
  font-weight: 600;
  text-align: center;
}

/* TARJETAS / CARDS */

/* ICONO PDF */
.fa-file-pdf-o {
  color: var(--concytec-rojo) !important;
}

/* MODAL */
.modal-content {
  border-radius: 14px !important;
}

/* CAMPOS MODAL */
#titulo, #autor, #resumen, #fecha, #palabra_clave, #editorial, #descripcion, #archivo {
  display: inline-block;
  white-space: normal;
  direction: rtl;
  text-align: left;
}

/* CAPTCHA */
#div_cod {
  font-size: 20pt;
  user-select: none;
  color: var(--concytec-azul-1);
}

#div_error {
  border-radius: 5px;
  display: none;
  color: var(--concytec-rojo);
}

#op_descargar {
  border-radius: 10px;
  color: var(--concytec-blanco);
  background: var(--concytec-verde);
  display: none;
  padding: 10px;
  text-decoration: none;
}

/* FOOTER */
.footer {
  background: var(--concytec-gris) !important;
  color: #555 !important;
}

/* OTROS ESTILOS */
body, html {
  font-family: 'Arial', sans-serif;
}

a {
  text-decoration: none;
  color: var(--concytec-azul-1);
}

a:hover {
  text-decoration: none;
  color: var(--concytec-azul-2);
}

button {
  cursor: pointer;
  font-family: 'Arial', sans-serif;
}

/* INPUTS */
input.form-control {
  border-radius: 6px;
  border: 1px solid #ccc;
  font-size: 15px;
}

/* AVATAR */
.avatar {
  background-size: cover;
  background-position: center;
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .page-header {
    padding: 20px;
    font-size: 18px;
  }
  .card {
    margin-bottom: 20px;
  }
  .header-search {
    width: 100% !important;
    margin-bottom: 10px;
  }

  
}
/* TARJETAS MODERNAS PROYECTOS */
.card.overflow-hidden {
    border: none !important;
    border-radius: 12px !important;
    background: linear-gradient(145deg, #FFFFFF 0%, #FFFFFF 100%) !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06), 0 1px 4px rgba(0,0,0,0.04) !important;
    border-top: 3px solid var(--concytec-verde) !important;
    transition: all 0.25s ease !important;
}

.card.overflow-hidden:hover {
    box-shadow: 0 12px 32px rgba(0,0,0,0.10), 0 4px 16px rgba(0,0,0,0.06) !important;
    border-top-color: var(--concytec-azul-2) !important;
}

.card h4 a {
    color: var(--concytec-azul-1) !important;
    font-size: 1.2rem !important;
    font-weight: 600 !important;
    line-height: 1.4;
    margin: 0 0 16px 0 !important;
    padding-bottom: 8px;
    border-bottom: 2px solid transparent;
    transition: all 0.2s ease;
}

.card h4 a:hover {
    color: var(--concytec-azul-3) !important;
    border-bottom-color: var(--concytec-verde);
}

.card .text-muted {
    color: #5A6C7D !important;
    font-size: 0.9rem !important;
    line-height: 1.6;
    margin-bottom: 12px;
}

.card .text-muted[style*="text-align: right"] {
    color: var(--concytec-azul-1) !important;
    background: linear-gradient(90deg, var(--concytec-verde), var(--concytec-azul-3));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 500 !important;
    font-size: 0.85rem !important;
}

.avatar.brround.avatar-md {
    border-radius: 10px !important;
    box-shadow: 0 3px 12px rgba(0,0,0,0.08);
    border: 1px solid #E5E7EB !important;
}

.font-weight-semibold {
    color: var(--concytec-texto) !important;
    font-weight: 600 !important;
    font-size: 0.98rem !important;
}

.text-warning {
    color: var(--concytec-verde) !important;
    font-weight: 600;
}

.modal-effect.btn {
   
    border-radius: 10px !important;
    padding: 10px 16px !important;
    border: none !important;
    box-shadow: 0 3px 12px rgb(8 8 8 / 25%) !important;
    transition: all 0.2s ease !important;
    min-height: 44px;
}

.modal-effect.btn:hover {
  box-shadow: 0 3px 12px rgb(9 218 249 / 25%) !important;
    transform: translateY(-1px);
}

/* FONDO SOMBRADO card-body */
.card-body.d-flex {
    background: white !important;
    box-shadow: inset 0 2px 8px rgba(0,0,0,0.04), inset 0 -1px 4px rgba(0,0,0,0.02) !important;
}


/* BOTÓN BACK TO TOP - CONCYTEC ALICIA + LATIDO */
#back-to-top {
    background: linear-gradient(135deg, var(--concytec-verde), var(--concytec-azul-3)) !important;
    color: var(--concytec-blanco) !important;
    position: fixed !important;
    bottom: 20px !important;
    right: 20px !important;
    z-index: 1000 !important;
    display: none;
    text-align: center !important;
    border-radius: 50px !important;
    height: 55px !important;
    width: 55px !important;
    line-height: 55px !important;
    box-shadow: 0 8px 25px rgba(182, 198, 0, 0.4) !important;
    border: none !important;
    font-size: 20px !important;
    font-weight: 600 !important;
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

/* EFECTO LATIDO */
#back-to-top.show {
    display: block !important;
    animation: heartbeat 2s infinite ease-in-out !important;
}

@keyframes heartbeat {
    0% { transform: scale(1); }
    14% { transform: scale(1.1); }
    28% { transform: scale(1); }
    42% { transform: scale(1.1); }
    70% { transform: scale(1); }
}

/* HOVER */
#back-to-top:hover {
    background: linear-gradient(135deg, var(--concytec-azul-3), var(--concytec-verde)) !important;
    transform: translateY(-3px) scale(1.05) !important;
    box-shadow: 0 12px 35px rgba(182, 198, 0, 0.6) !important;
}

/* RESPONSIVE */
@media (max-width: 768px) {
    #back-to-top {
        bottom: 15px !important;
        right: 15px !important;
        height: 50px !important;
        width: 50px !important;
        line-height: 50px !important;
        font-size: 18px !important;
    }
}
/* OCULTAR/MOSTRAR BOTONES RESPONSIVE */
@media (max-width: 767.98px) {
    /* Pantallas PEQUEÑAS: mostrar solo botón MOBILE, ocultar form */
    .form-inline_ .btn-primary-color.btn-search {
        display: none !important;
    }
    .navsearch {
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        border-radius: 12px;
        background: var(--concytec-verde) !important;
        margin-right: 10px;
        transition: all 0.3s ease;
        box-shadow: 0 4px 12px rgba(182, 198, 0, 0.3);
    }
    
    .navsearch:hover {
        background: #9EB500 !important;
        transform: scale(1.05);
        box-shadow: 0 6px 16px rgba(182, 198, 0, 0.4);
    }
    
    .navsearch svg {
        width: 18px !important;
        height: 18px !important;
        stroke: var(--concytec-blanco) !important;
        stroke-width: 2 !important;
    }
}

@media (min-width: 768px) {
    /* Pantallas GRANDES: mostrar form, ocultar mobile */
    .form-inline_ .btn-primary-color.btn-search {
        display: flex !important;
    }
    .navsearch {
        display: none !important;
    }
}



/* ESTILO UNIFORME BOTÓN FORM (pantallas grandes) */
.btn-primary-color.btn-search {
    background: var(--concytec-verde) !important;
    border-radius: 12px !important;
    border: none !important;
    box-shadow: 0 4px 12px rgba(182, 198, 0, 0.3) !important;
    transition: all 0.3s ease !important;
}

.btn-primary-color.btn-search:hover {
    background: #9EB500 !important;
    transform: translateY(-1px) scale(1.02) !important;
    box-shadow: 0 6px 16px rgba(182, 198, 0, 0.4) !important;
}

.btn-primary-color.btn-search svg {
    stroke: var(--concytec-blanco) !important;
    stroke-width: 2 !important;
}
/* RESPONSIVE: SOLO FUENTES MÁS PEQUEÑAS */
@media (max-width: 767.98px) {
    .d-flex.align-items-center.mt-auto {
        font-size: 0.80rem !important;
    }
    
    .font-weight-semibold {
        font-size: 0.7rem !important;
    }
    
    .avatar.brround.avatar-md {
        width: 32px !important;
        height: 32px !important;
    }
    
    small.d-block.text-muted {
        font-size: 0.70rem !important;
    }
    
    .modal-effect.btn i {
        font-size: 14px !important;
    }
    
    /* Carrera más pequeña */
    .text-warning {
        font-size: 0.7rem !important;
    }
}

@media (max-width: 575px) {
    .font-weight-semibold {
        font-size: 0.85rem !important;
    }
    
    small.d-block.text-muted {
        font-size: 0.7rem !important;
    }
}
