/* ============================================
   public/css/base.css — Variables & reset
   ============================================ */

:root {
  /* Couleurs principales */
  --bg-root:    #0f1117;
  --bg-card:    #1a1d27;
  --bg-hover:   #21253a;
  --border:     rgba(255,255,255,0.08);
  --accent:     #6c63ff;
  --accent-2:   #a78bfa;

  /* Statuts */
  --statut-brouillon: #888;
  --statut-envoye:    #3498db;
  --statut-accepte:   #2ecc71;
  --statut-refuse:    #e74c3c;
  --statut-urgent:    #e74c3c;
  --statut-attente:   #f39c12;
  --statut-traite:    #2ecc71;

  /* Typographie */
  --font: 'Segoe UI', system-ui, -apple-system, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: var(--font);
  background: var(--bg-root);
  color: #e2e8f0;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}

/* Badges de statut */
.badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.badge-brouillon { background: rgba(136,136,136,0.15); color: #888; }
.badge-envoye    { background: rgba(52,152,219,0.15);  color: #3498db; }
.badge-accepte   { background: rgba(46,204,113,0.15);  color: #2ecc71; }
.badge-refuse    { background: rgba(231,76,60,0.15);   color: #e74c3c; }
.badge-urgent    { background: rgba(231,76,60,0.2);    color: #ff6b6b; animation: pulse 1.5s ease infinite; }
.badge-attente   { background: rgba(243,156,18,0.15);  color: #f39c12; }
.badge-traite    { background: rgba(46,204,113,0.15);  color: #2ecc71; }

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.7; }
}

/* Toast notifications */
.toast-container {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.toast {
  background: #1a1d27;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 10px;
  padding: 12px 18px;
  font-size: 13px;
  color: #e2e8f0;
  box-shadow: 0 8px 32px rgba(0,0,0,0.4);
  animation: slide-in 0.25s ease;
  max-width: 320px;
}
.toast.success { border-left: 3px solid #2ecc71; }
.toast.error   { border-left: 3px solid #e74c3c; }
.toast.info    { border-left: 3px solid #3498db; }

@keyframes slide-in {
  from { transform: translateX(20px); opacity: 0; }
  to   { transform: translateX(0);    opacity: 1; }
}