/* Le fonds d'occasion : la recherche publique dans l'inventaire de la bouquinerie (07/10/2026).
   S'appuie sur les variables et les boutons de styles.css, et sur la barre des pages du journal (actualites.css). */

[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- le bandeau : on descend à la bouquinerie ---------- */
.fonds-tete{background:var(--nuit);color:var(--papier);padding:64px 0 54px;position:relative}
.fonds-tete::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;
  background:repeating-linear-gradient(90deg,var(--nuit-2) 0 22px,#2c231d 22px 30px,var(--nuit-2) 30px 41px,#33281f 41px 46px)}
.fonds-tete h1{font-size:clamp(2.5rem,6vw,4.1rem);color:var(--papier);margin-bottom:.9rem}
.fonds-lead{font-size:clamp(1.1rem,1.8vw,1.32rem);color:rgba(247,242,231,.84);max-width:40ch;margin-bottom:1.6rem}
.fonds-form{display:flex;gap:10px;max-width:640px}
.fonds-form input{flex:1;min-width:0;font-family:var(--serif);font-size:1.25rem;padding:13px 16px;border-radius:var(--r);
  border:1px solid rgba(247,242,231,.35);background:var(--papier);color:var(--encre);outline:none}
.fonds-form input::placeholder{color:#8f8378}
.fonds-form input:focus{border-color:var(--papier);box-shadow:0 0 0 3px rgba(212,64,75,.45)}
.fonds-form .btn{flex:none}
.fonds-etat{margin:14px 0 0;font-family:var(--sans);font-size:.78rem;letter-spacing:.02em;color:var(--sienne-clair);min-height:1.3em}

/* ---------- les rayons ---------- */
.fonds-corps{padding:34px 0 70px}
.rayons{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:26px}
.rayon{font-family:var(--sans);font-size:.82rem;font-weight:600;padding:8px 14px;border-radius:20px;border:1px solid var(--filet);
  background:transparent;color:var(--encre-2);cursor:pointer;display:inline-flex;gap:7px;align-items:baseline}
.rayon small{font-weight:500;color:var(--gris);font-size:.74rem}
.rayon:hover{border-color:var(--encre)}
.rayon[aria-pressed="true"]{background:var(--encre);border-color:var(--encre);color:var(--papier)}
.rayon[aria-pressed="true"] small{color:var(--sienne-clair)}

/* ---------- les résultats ---------- */
.fonds-res{min-height:120px}
.res-tete{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;border-bottom:1.5px solid var(--encre);
  padding-bottom:8px;margin-bottom:4px}
.res-tete h2{font-size:clamp(1.4rem,2.6vw,1.9rem)}
.res-tete p{margin:0;font-family:var(--sans);font-size:.8rem;color:var(--gris)}
.res-tete button{font-family:var(--sans);font-size:.8rem;font-weight:600;color:var(--rouge);background:none;border:0;cursor:pointer;padding:4px 0}
.res-note{font-family:var(--sans);font-size:.85rem;color:var(--sienne);margin:10px 0 0}
.res-vide{padding:26px 0 8px;color:var(--encre-2);font-size:1.1rem}
.res-vide b{font-weight:600}

.livres-f{list-style:none;margin:0;padding:0}
.fl{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 28px;padding:20px 0;border-bottom:1px solid var(--filet)}
.fl-t{font-size:1.32rem;line-height:1.22;font-weight:500}
.fl-t.caps,.fl-a.caps{font-variant-caps:small-caps;letter-spacing:.02em}
.fl-a{margin:.2rem 0 0;font-style:italic;color:var(--encre-2);font-size:1.05rem}
.fl-e{margin:.35rem 0 0;font-family:var(--sans);font-size:.76rem;color:var(--gris);letter-spacing:.01em}
.fl-cote{display:inline-block;margin-top:.7rem;font-family:var(--sans);font-size:.78rem;font-weight:600;color:var(--rouge);text-decoration:none}
.fl-cote:hover{text-decoration:underline}
.fl-enligne{margin-left:18px;color:var(--encre-2)}
.fl-enligne::before{content:"↗ ";color:var(--sienne)}

/* « Le voir en rayon » et les photos des étagères (09/10/2026) */
button.fl-cote{background:none;border:0;padding:0;cursor:pointer;font:inherit;font-family:var(--sans);font-size:.78rem;font-weight:600}
.fl-voir{margin-left:18px;color:var(--rouge)}
.fl-voir::before{content:"◉ ";color:var(--rouge)}
.fl-photo{grid-column:1/-1;margin:6px 0 0;display:grid;gap:6px;justify-items:start}
.fl-court .fl-photo{grid-column:2}
.fl-photo img{display:block;max-width:100%;height:auto;max-height:420px;border-radius:var(--r);background:var(--papier-2);box-shadow:0 1px 6px rgba(28,22,19,.18)}
.fl-photo figcaption{font-family:var(--sans);font-size:.76rem;color:var(--gris);max-width:46ch}
.etg-vitrine{margin:6px 0 10px}
.etg-photos{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:6px;scrollbar-width:thin}
.etg-ph{flex:none;height:190px;padding:0;border:0;border-radius:var(--r);overflow:hidden;background:var(--papier-2);cursor:zoom-in;scroll-snap-align:start}
.etg-ph img{display:block;width:100%;height:100%;object-fit:cover}
.etg-note{margin:2px 0 0;font-family:var(--sans);font-size:.74rem;color:var(--gris)}
@media (min-width:980px){
  .etg.avec-photos{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 32px;align-items:start}
  .etg.avec-photos>h3{grid-column:1/-1}
  .etg.avec-photos .etg-vitrine{position:sticky;top:96px;margin-top:10px}
  .etg-ph{height:300px}
}
.visio{border:0;padding:0;background:transparent;max-width:min(1100px,100% - 24px);max-height:100dvh}
.visio::backdrop{background:rgba(23,19,16,.86)}
.visio-in{display:grid;gap:10px;justify-items:center}
.visio-in img{display:block;max-width:100%;max-height:78dvh;width:auto;height:auto;border-radius:var(--r);background:#2c231d}
.visio-in p{margin:0;font-family:var(--sans);font-size:.8rem;color:#e9e1d3;text-align:center}
.visio-btns{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.visio-btns .btn-s{color:#f7f2e7;border-color:rgba(247,242,231,.5)}
.visio-btns button:disabled{opacity:.35}

/* l'emplacement : un petit plan du montant, l'étagère et le livre en rouge */
.fl-ou{display:grid;grid-template-columns:auto auto;gap:14px;align-items:center;align-self:start;
  background:var(--papier-2);border-radius:var(--r);padding:12px 16px 12px 12px;min-width:250px}
.fl-plan{width:58px;height:74px;flex:none}
.fl-ou p{margin:0;font-family:var(--sans);font-size:.8rem;line-height:1.45;color:var(--encre-2)}
.fl-ou .r{display:block;font-family:var(--serif);font-size:1.08rem;font-weight:600;color:var(--encre);margin-bottom:2px}
.fl-ou .ici{color:var(--rouge-fonce);font-weight:600}

/* parcourir un rayon : les étagères dans l'ordre, chaque livre à sa place */
.etg{margin-top:26px}
.etg>h3{font-family:var(--sans);font-size:.74rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--sienne);
  margin:0 0 4px;padding-bottom:6px;border-bottom:1px solid var(--filet)}
.fl-court{display:grid;grid-template-columns:2.4rem minmax(0,1fr);gap:2px 12px;padding:11px 0;border-bottom:1px solid var(--filet)}
.fl-court .n{font-size:1.15rem;color:var(--gris);text-align:right;line-height:1.3}
.fl-court .fl-t{font-size:1.14rem}
.fl-court .fl-a{font-size:.98rem}
.fl-court .fl-e,.fl-court .fl-cote{grid-column:2}

.fonds-suite{text-align:center;margin:26px 0 0}

/* ---------- l'aide ---------- */
.fonds-aide{display:grid;grid-template-columns:1fr 1fr;gap:44px;margin-top:64px;padding-top:40px;border-top:1px solid var(--filet)}
.fonds-aide h2{font-size:clamp(1.45rem,2.6vw,1.95rem);margin-bottom:.7rem}
.fonds-aide p{color:var(--encre-2);font-size:1.04rem}
.fonds-aide a:not(.btn){color:var(--rouge-fonce)}

@media (max-width:760px){
  .fonds-tete{padding:40px 0 38px}
  .fonds-form{flex-direction:column}
  .fonds-form .btn{justify-content:center}
  .fl{grid-template-columns:minmax(0,1fr)}
  .fl-ou{min-width:0;justify-self:stretch}
  .fonds-aide{grid-template-columns:1fr;gap:30px;margin-top:48px}
  .wrap{padding:0 18px}
}