/* ==========================================================================
   PTC — Le tiroir de lecture.

   Règle arbitrée par Déb le 20/08/2026 : « ce qui est traité dans une
   page/outil n'a plus besoin de l'être dans une fiche. Laissons la fiche être
   une encyclopédie, et les pages être de vrais outils pratiques. »

   Conséquence directe : depuis une page-outil, une fiche doit s'ouvrir À CÔTÉ
   et jamais à la place. Le panneau glisse à droite et RESSERRE la page — la
   saisie en cours reste visible, et surtout utilisable. Perdre son formulaire
   pour lire une définition, c'est ce qui fait qu'on ne lit pas.

   Maquette de référence : sitepartagé/strategie/quatre-registres.html
   ========================================================================== */

.ptc-tiroir{
  position:fixed;top:0;right:0;bottom:0;z-index:9500;
  width:min(520px,94vw);background:#fdfcfa;
  border-left:1px solid #e5e0d7;
  box-shadow:-20px 0 60px rgba(26,45,74,.16);
  transform:translateX(102%);
  transition:transform .26s cubic-bezier(.32,.72,.32,1);
  display:flex;flex-direction:column;
  font-family:'DM Sans',system-ui,sans-serif;color:#33404f;
}
.ptc-tiroir[data-ouvert="1"]{transform:translateX(0)}

.ptc-tiroir__tete{
  padding:18px 22px 15px;border-bottom:1px solid #e5e0d7;flex:0 0 auto;
  display:flex;align-items:flex-start;justify-content:space-between;gap:14px;
}
.ptc-tiroir__marqueur{
  display:inline-flex;align-items:center;gap:7px;
  background:#ddeaf8;color:#1a2d4a;border:1px solid #c3d9ec;border-radius:999px;
  padding:4px 11px;margin-bottom:9px;
  font-family:'Syne','Poppins',sans-serif;font-weight:800;
  font-size:.58rem;letter-spacing:.11em;text-transform:uppercase;
}
.ptc-tiroir__tete h2{
  font-family:'Poppins','DM Sans',sans-serif;font-size:1.06rem;font-weight:700;
  line-height:1.22;letter-spacing:-.01em;color:#1a2d4a;margin:0;
}
.ptc-tiroir__fermer{
  flex:0 0 auto;width:34px;height:34px;border-radius:50%;
  border:1px solid #e5e0d7;background:#fff;color:#8f8577;
  cursor:pointer;display:grid;place-items:center;
}
.ptc-tiroir__fermer:hover{border-color:#c9bfb1;color:#33404f}
.ptc-tiroir__fermer:focus-visible{outline:2px solid #e8541a;outline-offset:2px}

.ptc-tiroir__corps{padding:20px 22px 26px;overflow-y:auto;flex:1;font-size:.93rem;line-height:1.62}
.ptc-tiroir__corps h2,
.ptc-tiroir__corps h3{font-family:'Poppins','DM Sans',sans-serif;font-size:.99rem;font-weight:700;color:#1a2d4a;margin:20px 0 8px;line-height:1.3}
.ptc-tiroir__corps h2:first-child,
.ptc-tiroir__corps h3:first-child{margin-top:0}
.ptc-tiroir__corps p{margin:0 0 11px}
.ptc-tiroir__corps ul,.ptc-tiroir__corps ol{margin:0 0 12px;padding-left:20px}
.ptc-tiroir__corps li{margin-bottom:5px}
.ptc-tiroir__corps b,.ptc-tiroir__corps strong{color:#1a2d4a;font-weight:700}
.ptc-tiroir__corps a{color:#c4400f;font-weight:600}
.ptc-tiroir__corps table{width:100%;border-collapse:collapse;font-size:.86rem;margin:0 0 12px}
.ptc-tiroir__corps th,.ptc-tiroir__corps td{border:1px solid #e5e0d7;padding:7px 9px;text-align:left;vertical-align:top}
.ptc-tiroir__corps th{background:#f6f2ec;color:#1a2d4a;font-weight:700}
.ptc-tiroir__corps img{max-width:100%;height:auto;border-radius:10px}

.ptc-tiroir__chapeau{font-size:.97rem;color:#5a4636;margin:0 0 16px}
.ptc-tiroir__attente{color:#8f8577;font-size:.88rem}

.ptc-tiroir__renvoi{
  display:block;margin-top:20px;padding-top:15px;border-top:1px solid #e5e0d7;
  font-size:.83rem;color:#8f8577;
}
.ptc-tiroir__renvoi a{color:#c4400f;font-weight:700}

/* La page reste utilisable : on le dit, parce que ça ne se devine pas. */
.ptc-tiroir-note{
  position:fixed;left:16px;bottom:16px;z-index:9499;
  background:#1a2d4a;color:#fff;border-radius:999px;padding:9px 15px;
  font-family:'DM Sans',system-ui,sans-serif;font-size:.78rem;font-weight:700;
  box-shadow:0 12px 30px rgba(26,45,74,.28);
  opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s;
}
.ptc-tiroir-note[data-ouvert="1"]{opacity:1;visibility:visible}

/* Le resserrement. En dessous de 1080 px il n'y a pas la place : le tiroir
   recouvre, et la note disparaît puisqu'elle serait fausse. */
.wrap{transition:max-width .26s cubic-bezier(.32,.72,.32,1),margin .26s cubic-bezier(.32,.72,.32,1)}
@media (min-width:1080px){
  body[data-lecture="1"] .wrap{
    max-width:calc(100vw - 600px);margin-left:32px;margin-right:auto;
  }
}
@media (max-width:1079px){
  .ptc-tiroir-note{display:none}
}
@media (max-width:600px){
  .ptc-tiroir{width:100vw;border-left:0}
}
@media (prefers-reduced-motion:reduce){
  .ptc-tiroir,.wrap{transition:none}
}
@media print{
  .ptc-tiroir,.ptc-tiroir-note{display:none!important}
}