/* lot 24 (23/10/2026, Hassan) : aperçu de la fiche de mission et petite fiche du chauffeur, sur l'écran. Bleu nuit, bleu, argent. */
body.sd24-bloque { overflow: hidden; }
.sd24-fond { position: fixed; inset: 0; z-index: 10050; background: rgba(8, 24, 48, .62); display: flex; align-items: center; justify-content: center; padding: 16px; animation: sd24In .18s ease-out both; }
@keyframes sd24In { from { opacity: 0; } to { opacity: 1; } }
.sd24-boite { background: #fff; color: #0F2A4A; border-radius: 16px; box-shadow: 0 24px 60px rgba(8, 24, 48, .45); display: flex; flex-direction: column; overflow: hidden; width: 100%; max-height: calc(100vh - 32px); animation: sd24Monte .22s cubic-bezier(.16, 1, .3, 1) both; }
@keyframes sd24Monte { from { transform: translateY(14px) scale(.985); opacity: 0; } to { transform: none; opacity: 1; } }
/* 24/10 (Hassan : « l'aperçu du PDF est beaucoup trop gros ») : fenêtre au format d'une feuille A4, la page entière visible */
.sd24-pdf .sd24-boite { max-width: 700px; height: min(calc(100vh - 32px), 980px); }
.sd24-chf .sd24-boite { max-width: 460px; }
.sd24-tete { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 12px 10px 18px; background: #0F2A4A; color: #fff; border-bottom: 3px solid #C4D3E6; }
.sd24-titre { flex: 1 1 auto; font-size: 15px; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sd24-act { display: flex; align-items: center; gap: 8px; }
.sd24-choix { display: inline-flex; border: 1px solid rgba(196, 211, 230, .5); border-radius: 10px; overflow: hidden; }
.sd24-choix button { min-height: 44px; padding: 0 14px; border: 0; background: transparent; color: #C4D3E6; font: inherit; font-size: 14px; cursor: pointer; }
.sd24-choix button[aria-pressed="true"] { background: #1E5AA8; color: #fff; font-weight: 600; }
.sd24-b { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 16px; border-radius: 10px; border: 1px solid #C4D3E6; background: #fff; color: #0F2A4A; font: inherit; font-size: 14px; font-weight: 600; text-decoration: none; cursor: pointer; }
.sd24-tete .sd24-b { background: transparent; color: #fff; border-color: rgba(196, 211, 230, .5); }
.sd24-b.plein { background: #1E5AA8; border-color: #1E5AA8; color: #fff; }
.sd24-b:disabled, .sd24-b[aria-disabled="true"] { opacity: .45; pointer-events: none; }
.sd24-b:hover, .sd24-choix button:hover { filter: brightness(1.08); }
.sd24-x { width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; border: 0; background: rgba(255, 255, 255, .12); color: #fff; cursor: pointer; }
.sd24-x:hover { background: rgba(255, 255, 255, .22); }
.sd24-corps { flex: 1 1 auto; overflow: auto; background: #EEF2F7; position: relative; }
.sd24-pdf .sd24-corps { display: flex; }
.sd24-pdf iframe { flex: 1 1 auto; width: 100%; height: 100%; border: 0; background: #EEF2F7; }
.sd24-attente { margin: auto; padding: 32px 20px; text-align: center; color: #4F6478; font-size: 15px; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.sd24-fond [hidden] { display: none !important; }
/* fiche chauffeur */
.sd24-chf .sd24-corps { background: #fff; padding: 18px; }
.sd24-id { display: flex; align-items: center; gap: 14px; }
.sd24-ph { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; flex: 0 0 64px; border: 2px solid #C4D3E6; }
.sd24-ini { display: inline-flex; align-items: center; justify-content: center; background: #0F2A4A; color: #fff; font-weight: 700; font-size: 22px; }
.sd24-nom { font-size: 19px; font-weight: 700; line-height: 1.2; }
.sd24-soc { color: #4F6478; font-size: 14px; margin-top: 2px; }
.sd24-pas { display: inline-block; margin-top: 6px; padding: 2px 8px; border-radius: 6px; background: #F4E3E6; color: #7A2E3A; font-size: 12.5px; font-weight: 600; }
.sd24-bts { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0 4px; }
.sd24-bts .sd24-b { flex: 1 1 auto; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sd24-sec { border-top: 1px solid #DCE4EF; margin-top: 14px; padding-top: 12px; }
.sd24-et { font-size: 11px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: #1E5AA8; margin-bottom: 8px; }
.sd24-v { font-size: 14.5px; margin: 4px 0; }
.sd24-pl { display: inline-block; padding: 1px 7px; border: 1px solid #0F2A4A; border-radius: 5px; font-size: 12.5px; font-weight: 700; letter-spacing: .5px; margin-left: 4px; }
.sd24-gr { color: #4F6478; font-size: 13px; margin-left: 4px; }
.sd24-puces { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.sd24-puces span { padding: 3px 9px; border-radius: 999px; background: #F4F7FB; border: 1px solid #C4D3E6; font-size: 12px; font-weight: 600; }
.sd24-docs { list-style: none; margin: 0; padding: 0; }
.sd24-docs li { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0; font-size: 13.5px; border-bottom: 1px dashed #E3E9F1; }
.sd24-docs li:last-child { border-bottom: 0; }
.sd24-docs li span:last-child { color: #4F6478; text-align: right; }
.sd24-docs li.ok span:last-child::before { content: "● "; color: #1E5AA8; }
.sd24-docs li.bientot span:last-child { color: #B4475A; }
.sd24-docs li.bientot span:last-child::before { content: "● "; }
.sd24-docs li.perime span:last-child, .sd24-docs li.manque span:last-child { color: #A3283B; font-weight: 600; }
.sd24-docs li.perime span:last-child::before, .sd24-docs li.manque span:last-child::before { content: "● "; }
.sd24-chiffres { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.sd24-chiffres div { background: #F4F7FB; border-radius: 10px; padding: 8px 6px; text-align: center; }
.sd24-chiffres b { display: block; font-size: 15px; }
.sd24-chiffres span { font-size: 11.5px; color: #4F6478; }
.sd24-pied { margin-top: 16px; display: flex; justify-content: flex-end; }
@media (max-width: 640px) {
  .sd24-fond { padding: 0; align-items: stretch; }
  .sd24-boite, .sd24-pdf .sd24-boite { max-width: none; max-height: none; height: 100%; border-radius: 0; }
  .sd24-tete { padding: 8px 8px 8px 14px; }
  .sd24-choix { order: 3; flex: 1 1 100%; }
  .sd24-choix button { flex: 1; }
  .sd24-chiffres { grid-template-columns: repeat(2, 1fr); }
}
@media (prefers-reduced-motion: reduce) { .sd24-fond, .sd24-boite { animation: none; } }
.sd24-mobile .sd24-attente b { color: #0F2A4A; font-size: 17px; }
