/* Fibre Herd — « Lire la fiche » (bouton sur 8 volets + panneau sous le volet).
   Pas de widget flottant : le panneau s'insère dans la page, sous le titre du volet. */
.fh-lire-bar {
  display: flex;
  justify-content: flex-end;
  margin: -.35rem 0 .6rem;
}
.fh-lire-btn {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .38rem .75rem;
  border: 1px solid #c9d8a8;
  border-radius: 999px;
  background: #f5fae8;
  color: #3f4a2a;
  font: inherit;
  font-size: .84rem;
  font-weight: 700;
  line-height: 1.2;
  cursor: pointer;
}
.fh-lire-btn:hover { background: #eef6d6; border-color: #6A9440; }
.fh-lire-btn:focus-visible { outline: 3px solid rgba(106, 148, 64, .45); outline-offset: 2px; }
.fh-lire-btn[aria-expanded="true"] { background: #6A9440; border-color: #6A9440; color: #fff; }
.fh-lire-btn svg { width: 15px; height: 15px; flex: 0 0 auto; }
.fh-v2-secnav .fh-lire-btn--nav {
  flex: 0 0 auto;
  margin-left: auto;
  padding: .42rem .7rem;
  font-size: .8rem;
}

.fh-lire-panel {
  /* Sous la barre sticky (header + secnav) quand on scrolle vers le panneau. */
  scroll-margin-top: calc(var(--fh-header-h, 3.6rem) + 3.4rem);
  margin: 0 0 1rem;
  padding: .85rem .95rem;
  border: 1px solid #d7e8a8;
  border-left: 4px solid #6A9440;
  border-radius: 12px;
  background: #fbfdf5;
  color: #2d2f28;
}
.fh-lire-panel[hidden] { display: none; }
.fh-lire-head { display: flex; align-items: baseline; gap: .5rem; margin: 0 0 .35rem; }
.fh-lire-head strong { font-size: 1rem; color: #484844; }
.fh-lire-volet { color: #5b6250; font-size: .88rem; }
.fh-lire-close {
  margin-left: auto;
  border: 0;
  background: transparent;
  font: inherit;
  font-size: 1.25rem;
  line-height: 1;
  color: #484844;
  cursor: pointer;
  padding: 0 .25rem;
}
.fh-lire-lead { margin: 0 0 .65rem; font-size: .86rem; color: #5b6250; }
.fh-lire-demo {
  margin: 0 0 .65rem;
  padding: .4rem .6rem;
  border: 1px solid #e8c96a;
  border-radius: 8px;
  background: #fffbeb;
  font-size: .8rem;
  color: #6b5200;
}
.fh-lire-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .45rem; }
.fh-lire-action {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .15rem;
  padding: .55rem .7rem;
  border: 1px solid #dfe5d4;
  border-radius: 10px;
  background: #fff;
  font: inherit;
  text-align: left;
  cursor: pointer;
  color: inherit;
}
.fh-lire-action:hover { border-color: #6A9440; }
.fh-lire-action:focus-visible { outline: 3px solid rgba(106, 148, 64, .45); outline-offset: 2px; }
.fh-lire-action b { font-size: .9rem; color: #33372b; }
.fh-lire-action span { font-size: .76rem; color: #5b6250; line-height: 1.3; }
.fh-lire-action.is-suggested { border-color: #b9d27c; }
.fh-lire-action[aria-pressed="true"] { border-color: #6A9440; background: #eef6d6; box-shadow: 0 0 0 1px #6A9440 inset; }
.fh-lire-mate { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin: .6rem 0 0; font-size: .85rem; }
.fh-lire-mate[hidden] { display: none; }
.fh-lire-mate select { font: inherit; font-size: .85rem; padding: .25rem .4rem; border: 1px solid #d5dacb; border-radius: 8px; background: #fff; max-width: 100%; }
.fh-lire-result { margin-top: .75rem; padding: .75rem .85rem; border: 1px solid #e2e6dc; border-radius: 10px; background: #fff; }
.fh-lire-result[hidden] { display: none; }
.fh-lire-title { margin: 0 0 .45rem; font-weight: 700; font-size: .95rem; color: #33372b; }
.fh-lire-text { margin: 0; white-space: pre-line; font-size: .92rem; line-height: 1.5; overflow-wrap: anywhere; }
.fh-lire-status { margin: .6rem 0 0; font-size: .85rem; color: #5b6250; }
.fh-lire-status.is-error { color: #8a2b20; }
.fh-lire-sources { margin: .65rem 0 0; padding: .5rem 0 0; border-top: 1px dashed #dfe5d4; list-style: none; font-size: .74rem; color: #6b7160; line-height: 1.45; }
.fh-lire-sources li { margin: 0; }
.fh-lire-sources-head { font-weight: 700; }
.fh-lire-tools[hidden] { display: none; }
.fh-lire-tools { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-top: .6rem; }
.fh-lire-copy {
  padding: .35rem .8rem;
  border: 1px solid #6A9440;
  border-radius: 8px;
  background: #fff;
  color: #3f4a2a;
  font: inherit;
  font-size: .84rem;
  font-weight: 700;
  cursor: pointer;
}
.fh-lire-copy:hover { background: #eef6d6; }
.fh-lire-fill {
  padding: .35rem .8rem;
  border: 1px solid #c9d8a8;
  border-radius: 8px;
  background: #f5fae8;
  color: #3f4a2a;
  font: inherit;
  font-size: .84rem;
  font-weight: 700;
  cursor: pointer;
}
.fh-lire-fill:hover { background: #eef6d6; border-color: #6A9440; }
.fh-lire-host {
  margin: 0 0 1rem;
  padding: .85rem .95rem;
  border: 1px dashed #d7e8a8;
  border-radius: 12px;
  background: #fbfdf5;
}
.fh-lire-host > .fh-lire-bar { margin: 0 0 .5rem; justify-content: flex-start; }
.fh-lire-host-note { margin: 0 0 .5rem; font-size: .88rem; color: #5b6250; }
.fh-lire-copied { font-size: .8rem; color: #3f6b1a; }
.fh-lire-note { font-size: .76rem; color: #6b7160; }
@media (max-width: 560px) {
  .fh-lire-actions { grid-template-columns: 1fr; }
  .fh-lire-bar { justify-content: flex-start; margin-top: 0; }
}
@media print {
  .fh-lire-bar, .fh-lire-panel, .fh-lire-btn { display: none !important; }
}