/* core/feedback.css

   Retours à l'utilisateur : notification, états vide ou erreur, chargement, fenêtres, barre d'enregistrement du formulaire.

   Chargé par index.html, dans l'ordre de css/README.md. Ne pas changer cet
   ordre sans relire la section « Ordre de chargement ». */

/* ---------- toast ---------- */

.toast {
  position: fixed;
  bottom: 26px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 12px 20px;
  border-radius: var(--r);
  font-size: var(--fs-3);
  z-index: 60;
  max-width: 90vw;
}

/* ---------- sélecteur de banque ---------- */

.modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(11, 10, 22, .72);
  display: grid;
  place-items: center;
  padding: 20px;
  z-index: 80;
}

.modal {
  width: 100%;
  max-width: 720px;
  max-height: 85vh;
  overflow-y: auto;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r);
  padding: 24px;
}

.modal-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 18px;
}

.modal-head h3 { margin: 0; font-size: var(--fs-5); font-weight: 600; }

@media (max-width: 640px) {
  .modal { padding: 18px; max-height: 92vh; }
}

/* ---------- barre d'enregistrement ---------- */

.save-bar {
  position: sticky;
  bottom: 0;
  z-index: 15;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r);
  padding: 14px 20px;
  margin-bottom: 24px;
}

.save-bar > div { display: flex; gap: 10px; }

@media (max-width: 640px) {
  .save-bar { flex-direction: column; align-items: stretch; }
  .save-bar > div { width: 100%; }
  .save-bar .btn { flex: 1; }
}

.skeleton { display: grid; gap: 10px; }

.skeleton-row {
  height: 88px;
  border-radius: var(--r-md);
  background: var(--surface);
  border: 1px solid var(--border);
  opacity: .55;
  animation: pulse 1.4s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce) {
  .skeleton-row { animation: none; }
}

@keyframes pulse { 50% { opacity: .3; } }

/* Démarrage raté : un écran n'a pas pu être chargé. Rare, mais jamais une page
   blanche sans explication. */
.boot-error {
  max-width: var(--w-read);
  margin: var(--s-6) auto;
  padding: var(--s-5);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r);
  text-align: center;
}
.boot-error p { margin: 0 0 var(--s-4); }
