/* =========================================================
   HAPROLAB · Biblioteca Científica HOCl (#biblioteca)
   Usa las mismas variables y medidas que el resto de la web.
   ========================================================= */

/* Menú: con la nueva entrada "Biblioteca" el menú tiene 7 enlaces.
   En pantallas anchas se compacta un poco para que siga cabiendo en una sola línea. */
@media (min-width: 1200px) {
    header.sticky-nav .nav-row { gap: 1rem; }
    header.sticky-nav .nav-list .nav-link { white-space: nowrap; padding: .5rem .5rem; font-size: .875rem; }
    html[lang="fr"] header.sticky-nav .nav-list .nav-link { font-size: .85rem; padding: .5rem .45rem; }
}
@media (min-width: 900px) and (max-width: 1199.98px) {
    header.sticky-nav .nav-row { gap: .75rem; }
    header.sticky-nav .nav-list .nav-link { padding: .45rem .45rem; font-size: .85rem; }
    header.sticky-nav .lang-switcher .lang-pill { padding: .35rem .45rem; }
    header.sticky-nav .lang-switcher .lang-pill span:not(.lang-flag) { display: none; }
}

#biblioteca {
    background: var(--bg-light);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
}

/* Cifras clave (mismo estilo que las tarjetas de "Quiénes Somos") */
.grid-cards.bib-stats { margin-top: 2rem; grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 900px) { .grid-cards.bib-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; } }
.bib-stats .card { text-align: center; }
.bib-stat-num { font-size: 2rem; font-weight: 800; color: var(--primary-dark); margin: 0; line-height: 1.15; font-variant-numeric: tabular-nums; }
.bib-stat-label { font-size: .85rem; color: var(--text-light); margin: .25rem 0 0; }

/* Contenedor de la herramienta */
.card.bib-app { margin-top: 2rem; padding: 1.5rem; }
@media (min-width: 900px) { .card.bib-app { padding: 2rem; } }

/* Campos de aplicación (chips) */
.bib-group-label { display: block; font-size: .8rem; font-weight: 700; color: var(--text); margin: 0 0 .6rem; }
.bib-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 1.5rem; padding: 0; list-style: none; }
.bib-chip {
    display: inline-flex; align-items: center; gap: .45rem;
    padding: .45rem .9rem; border-radius: 999px;
    background: #fff; border: 1px solid var(--border);
    font: inherit; font-size: .85rem; font-weight: 500; color: var(--text); text-align: left;
    cursor: pointer; transition: background .15s, border-color .15s, color .15s;
}
.bib-chip:hover { background: var(--bg-light); border-color: #90caf9; }
.bib-chip[aria-pressed="true"] { background: #e3f2fd; border-color: #90caf9; color: var(--primary-dark); font-weight: 600; }
.bib-chip:disabled { cursor: default; opacity: .7; }
.bib-chip-count { font-size: .75rem; font-weight: 600; color: var(--text-light); font-variant-numeric: tabular-nums; }
.bib-chip[aria-pressed="true"] .bib-chip-count { color: var(--primary-dark); }

/* Barra de búsqueda y filtros */
.bib-search { position: relative; margin-bottom: 1rem; }
.bib-search svg { position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); color: var(--text-light); pointer-events: none; }
.bib-input, .bib-select {
    width: 100%; font: inherit; font-size: .95rem; color: var(--text);
    background: #fff; border: 1px solid #cfe3f5; border-radius: .75rem;
    padding: .7rem .9rem; min-height: 2.9rem;
    transition: border-color .15s, box-shadow .15s;
}
.bib-search .bib-input { padding-left: 2.75rem; border-radius: 999px; }
.bib-input:focus, .bib-select:focus, .bib-chip:focus-visible, .bib-btn:focus-visible, .bib-title:focus-visible, .bib-link:focus-visible {
    outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(30,136,229,.18);
}
.bib-input:disabled, .bib-select:disabled { background: var(--bg-light); color: var(--text-light); }
.bib-filters { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .75rem 1rem; }
.bib-field label { display: block; font-size: .8rem; font-weight: 700; color: var(--text); margin-bottom: .35rem; }
.bib-years { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.bib-quick { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin-top: 1rem; }
.bib-quick .bib-chip { padding: .3rem .75rem; font-size: .8rem; }
.bib-btn {
    display: inline-flex; align-items: center; gap: .4rem;
    font: inherit; font-size: .85rem; font-weight: 600; color: var(--primary-dark);
    background: transparent; border: 0; border-radius: .5rem; padding: .35rem .6rem; cursor: pointer;
}
.bib-btn:hover { background: var(--bg-light); }
.bib-clear { margin-left: auto; }
.bib-clear[hidden] { display: none; }

/* Recuento */
.bib-count { margin: 1.5rem 0 0; padding-bottom: .9rem; border-bottom: 1px solid var(--border); color: var(--text-light); font-size: .95rem; }
.bib-count strong { color: var(--text); font-size: 1.05rem; font-variant-numeric: tabular-nums; }

/* Lista de estudios */
.bib-list { list-style: none; margin: 0; padding: 0; }
.bib-item { display: flex; gap: 1.25rem; padding: 1.15rem 0; border-bottom: 1px solid var(--border); }
.bib-year { flex: 0 0 3.25rem; font-size: 1.15rem; font-weight: 800; color: var(--primary-dark); line-height: 1.4; font-variant-numeric: tabular-nums; }
.bib-body { min-width: 0; flex: 1; }
.bib-title { display: block; color: var(--text); font-weight: 600; font-size: 1rem; line-height: 1.45; text-decoration: none; overflow-wrap: anywhere; border-radius: .25rem; }
.bib-title:hover { color: var(--primary-dark); text-decoration: underline; text-decoration-color: rgba(21,101,192,.4); text-underline-offset: 2px; }
.bib-source { margin: .3rem 0 0; font-size: .85rem; font-style: italic; color: var(--text-light); line-height: 1.4; }
.bib-tags { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin-top: .65rem; }
.bib-tag { display: inline-flex; align-items: center; padding: .2rem .65rem; border-radius: 999px; font-size: .75rem; font-weight: 500; line-height: 1.4; background: var(--bg-light); color: var(--text); border: 1px solid var(--border); }
.bib-tag--germ { background: #e0f7fa; border-color: #b2ebf2; color: #006064; }
.bib-link { margin-left: auto; display: inline-flex; align-items: center; gap: .3rem; font-size: .8rem; font-weight: 600; color: var(--primary-dark); text-decoration: none; padding: .2rem .4rem; border-radius: .4rem; }
.bib-link:hover { background: var(--bg-light); }
.bib-empty { padding: 2.5rem 1rem; text-align: center; color: var(--text-light); }
.bib-more { display: flex; justify-content: center; margin-top: 1.5rem; }
.bib-more[hidden] { display: none; }
.bib-more .btn { cursor: pointer; font: inherit; font-weight: 600; }

/* Notas */
.bib-notes { margin-top: 1.25rem; font-size: .8rem; color: var(--text-light); line-height: 1.55; max-width: 90ch; }
.bib-notes p { margin: 0 0 .4rem; }

@media (max-width: 640px) {
    .card.bib-app { padding: 1.1rem; }
    /* Campos de aplicación en una fila deslizable para no ocupar media pantalla */
    .bib-chips { flex-wrap: nowrap; overflow-x: auto; margin-right: -1.1rem; padding: 0 1.1rem .4rem 0; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
    .bib-chips li { flex: 0 0 auto; }
    .bib-chips .bib-chip { white-space: nowrap; }
    .bib-stats .card { padding: 1rem .75rem; }
    .bib-item { flex-direction: column; gap: .2rem; }
    .bib-year { flex: none; font-size: .9rem; }
    .bib-link { margin-left: 0; }
    .bib-stat-num { font-size: 1.4rem; white-space: nowrap; }
}