/* ============================================================
 * ecriVOSGES — Outils pour la recherche
 * Complément autonome à basiclayout.css — 27/08/2026
 * ============================================================ */

.outils-chercheurs {
  margin: 15px 0 18px;
  overflow: hidden;
  border: 1px solid #cfbea2;
  border-radius: 6px;
  background: #fbf7ee;
  color: #37322e;
  box-shadow: 0 4px 13px rgba(68, 51, 34, 0.07);
}

.outils-chercheurs summary {
  position: relative;
  display: flex;
  min-height: 50px;
  padding: 12px 44px 12px 16px;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  background: linear-gradient(90deg, #f1e5d0, #fbf7ee);
  color: #4b423a;
  cursor: pointer;
  list-style: none;
}

.outils-chercheurs summary::-webkit-details-marker { display: none; }

.outils-chercheurs summary::after {
  content: "+";
  position: absolute;
  top: 50%;
  right: 16px;
  color: #7a1512;
  font-family: Georgia, serif;
  font-size: 1.55rem;
  line-height: 1;
  transform: translateY(-52%);
}

.outils-chercheurs[open] summary::after { content: "−"; }

.outils-chercheurs-titre {
  color: #7a1512;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 1.25rem;
  font-weight: 700;
}

.outils-chercheurs-resume {
  color: #6c645c;
  font-size: 0.82rem;
}

.outils-chercheurs-contenu {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: 18px;
  padding: 17px 18px 14px;
  border-top: 1px solid #dfd1bd;
}

.outils-reference,
.outils-exports { min-width: 0; }

.outils-exports {
  padding-left: 18px;
  border-left: 1px solid #ded3c3;
}

.outils-libelle {
  margin: 0 0 7px;
  color: #7a1512;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.outils-reference-texte {
  margin: 0 0 11px;
  padding: 10px 12px;
  border-left: 3px solid #7a1512;
  background: #fff;
  color: #4c4640;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 0.86rem;
  line-height: 1.45;
}

.outils-actions {
  display: flex;
  gap: 7px;
  align-items: center;
  flex-wrap: wrap;
}

.outils-actions button,
.outils-actions a {
  display: inline-flex;
  min-height: 34px;
  padding: 7px 10px;
  align-items: center;
  border: 1px solid #a98574;
  border-radius: 3px;
  background: #fff;
  color: #7a1512 !important;
  font-family: 'Source Sans 3', Helvetica, Arial, sans-serif;
  font-size: 0.76rem;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none !important;
}

.outils-actions button:hover,
.outils-actions a:hover {
  border-color: #7a1512;
  background: #7a1512;
  color: #fff9eb !important;
}

.outil-indisponible {
  display: inline-flex;
  min-height: 34px;
  padding: 7px 10px;
  align-items: center;
  border: 1px dashed #cfc3b3;
  border-radius: 3px;
  color: #837b73;
  font-size: 0.76rem;
}

.outils-note {
  margin: 10px 0 0;
  color: #706960;
  font-size: 0.73rem;
  line-height: 1.35;
}

.outils-message {
  min-height: 1.25em;
  margin: 0;
  grid-column: 1 / -1;
  color: #37663e;
  font-size: 0.8rem;
  font-weight: 700;
  text-align: center;
}

.sources-chercheurs { padding: 4px 0 12px; }

.impression-rubrique { display: none; }

.sources-chercheurs .impression-rubrique {
  display: inline-block;
  margin-bottom: 8px;
}

.sources-introduction {
  max-width: 720px;
  margin: 2px 0 18px;
  color: #5c554e;
  font-size: 0.9rem;
  line-height: 1.5;
}

.sources-liste {
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: sources;
}

.sources-liste li {
  position: relative;
  min-height: 48px;
  margin: 0;
  padding: 10px 10px 10px 50px;
  border-top: 1px solid #e3dbcf;
  counter-increment: sources;
}

.sources-liste li:last-child { border-bottom: 1px solid #e3dbcf; }
.sources-liste li:nth-child(odd) { background: #fbf8f2; }

.sources-liste li::before {
  content: counter(sources);
  position: absolute;
  top: 10px;
  left: 10px;
  display: flex;
  width: 27px;
  height: 27px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #e7d8bf;
  color: #7a1512;
  font-family: Georgia, serif;
  font-size: 0.78rem;
  font-weight: 700;
}

.sources-liste strong {
  display: block;
  color: #7a1512;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 1rem;
  line-height: 1.2;
}

.sources-liste span {
  display: block;
  margin-top: 3px;
  color: #5f5953;
  font-size: 0.82rem;
  line-height: 1.4;
}

.citation-impression { display: none; }

/* Le bandeau d'impression est une vraie image, et non un arrière-plan :
   Firefox l'imprime ainsi même si l'option « Imprimer les arrière-plans »
   n'est pas cochée. */
.bandeau-impression { display: none; }

@media (max-width: 768px) {
  .outils-chercheurs summary {
    align-items: flex-start;
    flex-direction: column;
    gap: 2px;
  }

  .outils-chercheurs-contenu { grid-template-columns: 1fr; }

  .outils-exports {
    padding-top: 15px;
    padding-left: 0;
    border-top: 1px solid #ded3c3;
    border-left: 0;
  }

  .outils-actions button,
  .outils-actions a { flex: 1 1 185px; justify-content: center; text-align: center; }
}

@media print {
  @page {
    size: A4 portrait;
    /* Une première marge demandée à l'imprimante ; le contenu reçoit
       plus bas sa propre marge intérieure, indépendante de Firefox. */
    margin: 10mm 8mm 12mm;
  }

  html,
  body {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body {
    height: auto !important;
    background: #fff !important;
    color: #111 !important;
    font-size: 10.5pt;
  }

  #banner,
  #menu,
  #footer,
  .lien-evitement,
  .outils-chercheurs,
  .onglets,
  .contemporains-bloc,
  .reagir-zone,
  .reps,
  .gris2[style],
  .retour-haut { display: none !important; }

  .bandeau-impression {
    display: block !important;
    width: 100% !important;
    margin: 0 0 8mm !important;
    padding: 0 !important;
    break-inside: avoid;
    break-after: auto;
  }

  .bandeau-impression img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    border: 1px solid #111;
  }

  #wrapper {
    display: block !important;
    width: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    background: #fff !important;
  }

  #col2bis {
    width: auto !important;
    margin: 0 !important;
    /* Marge garantie même lorsque Firefox ignore les marges de @page. */
    padding: 0 10mm !important;
    box-sizing: border-box !important;
  }

  .container {
    width: auto !important;
    padding: 0 !important;
  }

  .panneau { border: 0 !important; padding: 0 !important; }

  table,
  .global,
  .fiche,
  .oeuvre,
  .oeuvre-texte,
  .biography,
  .notice {
    width: auto !important;
    max-width: 100% !important;
  }

  img {
    max-width: 100% !important;
    height: auto !important;
  }

  .biblio2,
  .biblio3,
  .biblio4,
  .notice,
  .chrono dd,
  .citation-impression {
    overflow-wrap: anywhere;
    word-break: normal;
  }

  h1 {
    margin: 0 0 8mm !important;
    color: #5c100e !important;
    font-size: 25pt !important;
  }

  .impression-rubrique,
  .sources-chercheurs .impression-rubrique {
    display: block !important;
    margin: 9mm 0 4mm !important;
    padding: 2mm 3mm !important;
    border-bottom: 1px solid #7a1512 !important;
    border-radius: 0 !important;
    background: #f0e8dc !important;
    color: #5c100e !important;
    font-size: 14pt !important;
    break-after: auto;
  }

  .chrono dt,
  .chrono dd,
  .notice,
  .biblio2,
  .biblio3,
  .biblio4 { color: #111 !important; }

  .sources-liste li { break-inside: avoid; }

  /* Une entrée biographique peut être longue. L'interdiction de la
     couper repoussait parfois toute la chronologie au feuillet suivant
     (cas Nicolas Mathieu), laissant la première page presque vide. */
  .chrono,
  .chrono dd,
  .biography,
  .encadre,
  .notice-bloc {
    break-before: auto !important;
    break-inside: auto !important;
    page-break-before: auto !important;
    page-break-inside: auto !important;
  }

  /* A l'ecran, les oeuvres illustrees utilisent deja deux colonnes.
     On conserve cette structure dans le PDF : une colonne reservee a
     la couverture et une colonne souple pour le texte. Le passage en
     simple bloc permettait a d'anciennes regles de flottement de faire
     glisser le texte sous l'image. */
  .oeuvre-illustree {
    display: flex !important;
    align-items: flex-start !important;
    gap: 4mm !important;
  }

  .oeuvre-couvs {
    flex: 0 0 30mm !important;
    width: 30mm !important;
    max-width: 30mm !important;
  }

  .oeuvre-texte {
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }

  .oeuvre-couvs,
  .oeuvre-texte,
  a.couverture,
  a.couverture img {
    float: none !important;
    position: static !important;
  }

  a.couverture,
  a.couverture img {
    width: 28mm !important;
    max-width: 28mm !important;
    height: auto !important;
  }

  /* Une notice d'oeuvre est courte et doit rester solidaire de sa
     couverture. Sans cette protection, Firefox pouvait couper l'image
     elle-meme et reporter une mince bande au feuillet suivant. */
  .oeuvre {
    break-before: auto !important;
    break-inside: avoid !important;
    page-break-before: auto !important;
    page-break-inside: avoid !important;
  }

  .oeuvre-couvs,
  a.couverture,
  a.couverture img {
    break-inside: avoid !important;
    page-break-inside: avoid !important;
  }

  /* L'intitule d'un genre (Films, Jeunesse...) accompagne au moins
     la premiere oeuvre et ne reste pas au bas d'une page. */
  .tete {
    clear: both !important;
    break-after: avoid !important;
    page-break-after: avoid !important;
  }

  .chrono dt {
    break-after: avoid;
    page-break-after: avoid;
  }

  p,
  li {
    orphans: 3;
    widows: 3;
  }

  .citation-impression {
    display: block !important;
    margin: 12mm 0 0;
    padding-top: 4mm;
    border-top: 1px solid #777;
    color: #333;
    font-size: 8.5pt;
    line-height: 1.45;
  }

  a { color: #111 !important; text-decoration: none !important; }
}