/* ========================
   PALETTE PRINCIPALE
   ======================== */

:root {
  --crm-dark-green: #00401A;
  --crm-light-green: #9de6ba;
  --crm-cream-green: #E1EDE1;
  --crm-secondary: #400026;
  --crm-secondary-hover: #9953DF;
  --crm-alert: #C0392B;
  --crm-alert-light: #FF6B6B;
}

/* ========================
   TEXTES ET FONDS
   ======================== */

.bg-crm {
  background-color: var(--crm-dark-green) !important;
  color: white !important;
}

.text-crm {
  color: var(--crm-dark-green) !important;
}

.bg-crm-n {
  background-color: var(--crm-light-green) !important;
  color: black !important;
  border: 1px solid var(--crm-light-green) !important;
}

.bg-crm-secondary {
  background-color: var(--crm-secondary) !important;
  color: white !important;
}

.light-green {
  background-color: var(--crm-cream-green) !important;
}

/* ========================
   BOUTONS
   ======================== */

.btn-crm {
  background-color: var(--crm-dark-green) !important;
  color: white !important;
  border: 1px solid var(--crm-light-green) !important;
  transition: all 0.3s ease;
}

.btn-crm:hover,
.btn-crm:focus {
  background-color: var(--crm-light-green) !important;
  color: black !important;
  box-shadow: 0 0 8px rgba(157, 230, 186, 0.6);
}

.btn-crm-n {
  background-color: var(--crm-light-green) !important;
  color: black !important;
  border: 1px solid var(--crm-light-green) !important;
  transition: all 0.3s ease;
}

.btn-crm-n:hover,
.btn-crm-n:focus {
  background-color: var(--crm-dark-green) !important;
  color: white !important;
}

.btn-crm-secondary {
  background-color: var(--crm-secondary) !important;
  color: white !important;
  border: 1px solid var(--crm-secondary) !important;
  transition: all 0.3s ease;
}

.btn-crm-secondary:hover,
.btn-crm-secondary:focus {
  background-color: var(--crm-secondary-hover) !important;
  color: white !important;
  box-shadow: 0 0 10px rgba(153, 83, 223, 0.5);
}

/* ========================
   BADGES
   ======================== */

.badge-dark.pending-callback-numbers {
 
  box-shadow: 0 0 6px rgba(192, 57, 43, 0.6);
}

/* ========================
   BOUTON BLINK EFFECT
   ======================== */
/* === STRONGER URGENT BLINK === */
.btn-blink {
  animation: crm-blink 1.9s infinite, crm-vibrate 0.4s infinite;
  background-color: var(--crm-alert) !important;
  color: #fff !important;
  border: 2px solid var(--crm-alert-light) !important;
  text-shadow: 0 0 4px rgba(255,255,255,0.7);
  box-shadow: 0 0 12px rgba(255,71,87,0.7);
  transition: all 0.2s ease;
}

@keyframes crm-blink {
  0% {
    background-color: var(--crm-alert);
    box-shadow: 0 0 12px rgba(255,71,87,0.7);
    transform: scale(1);
  }
  50% {
    background-color: #ff2a2a;
    box-shadow: 0 0 28px rgba(255,71,87,1);
    transform: scale(1.05);
  }
  100% {
    background-color: var(--crm-alert);
    box-shadow: 0 0 12px rgba(255,71,87,0.7);
    transform: scale(1);
  }
}

/* === VIBRATION (unchanged, still subtle) === */
@keyframes crm-vibrate {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-0.5px); }
  75% { transform: translateX(0.5px); }
}


/* ========================
   ÉTATS GÉNÉRIQUES
   ======================== */

.d-none {
  display: none !important;
}
.d-inline {
  display: inline-block !important;
}

/* Hover/focus universel doux */
button:focus, a:focus {
  outline: none !important;
  box-shadow: 0 0 4px var(--crm-light-green);
}

/* Boutons désactivés visuellement cohérents */
button:disabled, .btn.disabled {
  opacity: 0.6;
  cursor: not-allowed;
}