/* ===========================================
   GESTIOLEX - Status Badges Design System
   Badge unificati per stati e categorie
   =========================================== */

/* ===========================================
   BASE BADGE STYLES
   =========================================== */

.status-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  font-size: 0.75rem;
  font-weight: 600;
  border-radius: 20px;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  white-space: nowrap;
  transition: all 0.2s ease;
}

.status-badge i,
.status-badge .badge-icon {
  font-size: 0.7rem;
}

/* Versione piccola */
.status-badge-sm {
  padding: 2px 8px;
  font-size: 0.7rem;
}

/* Versione grande */
.status-badge-lg {
  padding: 6px 14px;
  font-size: 0.85rem;
}

/* ===========================================
   STATI DOCUMENTI CONTABILI
   =========================================== */

/* Bozza - Grigio */
.status-badge-bozza {
  background-color: #e9ecef;
  color: #495057;
  border: 1px solid #dee2e6;
}

.status-badge-bozza::before {
  content: "📝";
  margin-right: 4px;
}

/* Inviata - Blu */
.status-badge-inviata {
  background-color: #cfe2ff;
  color: #084298;
  border: 1px solid #b6d4fe;
}

.status-badge-inviata::before {
  content: "📤";
  margin-right: 4px;
}

/* Emessa - Primary/Teal */
.status-badge-emessa {
  background-color: #d1ecf1;
  color: #0B5E70;
  border: 1px solid #bee5eb;
}

.status-badge-emessa::before {
  content: "📄";
  margin-right: 4px;
}

/* Pagata - Verde */
.status-badge-pagata {
  background-color: #d1e7dd;
  color: #0f5132;
  border: 1px solid #badbcc;
}

.status-badge-pagata::before {
  content: "✅";
  margin-right: 4px;
}

/* Parzialmente Pagata - Giallo/Arancio */
.status-badge-parziale {
  background-color: #fff3cd;
  color: #664d03;
  border: 1px solid #ffecb5;
}

.status-badge-parziale::before {
  content: "⏳";
  margin-right: 4px;
}

/* Scaduta - Rosso */
.status-badge-scaduta {
  background-color: #f8d7da;
  color: #842029;
  border: 1px solid #f5c2c7;
}

.status-badge-scaduta::before {
  content: "⚠️";
  margin-right: 4px;
}

/* Annullata - Rosso scuro */
.status-badge-annullata {
  background-color: #f1aeb5;
  color: #58151c;
  border: 1px solid #e9a0a8;
  text-decoration: line-through;
}

.status-badge-annullata::before {
  content: "🚫";
  margin-right: 4px;
}

/* ===========================================
   STATI PRATICHE
   =========================================== */

/* In corso - Verde */
.status-badge-in-corso {
  background-color: #d1e7dd;
  color: #0f5132;
  border: 1px solid #badbcc;
}

.status-badge-in-corso::before {
  content: "▶️";
  margin-right: 4px;
}

/* In archivio - Grigio */
.status-badge-archiviata {
  background-color: #e9ecef;
  color: #495057;
  border: 1px solid #dee2e6;
}

.status-badge-archiviata::before {
  content: "📦";
  margin-right: 4px;
}

/* ===========================================
   STATI UTENTI
   =========================================== */

/* Admin */
.status-badge-admin {
  background-color: #cfe2ff;
  color: #084298;
  border: 1px solid #b6d4fe;
}

.status-badge-admin::before {
  content: "👑";
  margin-right: 4px;
}

/* Utente normale */
.status-badge-user {
  background-color: #e9ecef;
  color: #495057;
  border: 1px solid #dee2e6;
}

.status-badge-user::before {
  content: "👤";
  margin-right: 4px;
}

/* Attivo */
.status-badge-attivo {
  background-color: #d1e7dd;
  color: #0f5132;
  border: 1px solid #badbcc;
}

.status-badge-attivo::before {
  content: "✓";
  margin-right: 4px;
}

/* Disattivo */
.status-badge-disattivo {
  background-color: #f8d7da;
  color: #842029;
  border: 1px solid #f5c2c7;
}

.status-badge-disattivo::before {
  content: "✗";
  margin-right: 4px;
}

/* ===========================================
   RUOLI PERSONE
   =========================================== */

/* Cliente */
.status-badge-cliente {
  background-color: #d1e7dd;
  color: #0f5132;
  border: 1px solid #badbcc;
}

.status-badge-cliente::before {
  content: "👤";
  margin-right: 4px;
}

/* Controparte */
.status-badge-controparte {
  background-color: #f8d7da;
  color: #842029;
  border: 1px solid #f5c2c7;
}

.status-badge-controparte::before {
  content: "⚖️";
  margin-right: 4px;
}

/* Avvocato */
.status-badge-avvocato {
  background-color: #cfe2ff;
  color: #084298;
  border: 1px solid #b6d4fe;
}

.status-badge-avvocato::before {
  content: "⚖️";
  margin-right: 4px;
}

/* Consulente */
.status-badge-consulente {
  background-color: #e2e3e5;
  color: #41464b;
  border: 1px solid #d3d6d8;
}

.status-badge-consulente::before {
  content: "📊";
  margin-right: 4px;
}

/* Giudice */
.status-badge-giudice {
  background-color: #fff3cd;
  color: #664d03;
  border: 1px solid #ffecb5;
}

.status-badge-giudice::before {
  content: "🔨";
  margin-right: 4px;
}

/* ===========================================
   STATI EMAIL/PEC
   =========================================== */

/* Letta */
.status-badge-letta {
  background-color: #e9ecef;
  color: #495057;
  border: 1px solid #dee2e6;
}

/* Non letta */
.status-badge-non-letta {
  background-color: #cfe2ff;
  color: #084298;
  border: 1px solid #b6d4fe;
  font-weight: 700;
}

.status-badge-non-letta::before {
  content: "●";
  margin-right: 4px;
  color: #0d6efd;
}

/* PEC */
.status-badge-pec {
  background-color: #d1ecf1;
  color: #0B5E70;
  border: 1px solid #bee5eb;
}

.status-badge-pec::before {
  content: "📧";
  margin-right: 4px;
}

/* ===========================================
   BADGE NUMERICI (contatori)
   =========================================== */

.count-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  font-size: 0.75rem;
  font-weight: 700;
  border-radius: 11px;
  background-color: #6c757d;
  color: white;
}

.count-badge-primary {
  background-color: #0B5E70;
}

.count-badge-success {
  background-color: #198754;
}

.count-badge-warning {
  background-color: #ffc107;
  color: #000;
}

.count-badge-danger {
  background-color: #dc3545;
}

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

.priority-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  font-size: 0.7rem;
  font-weight: 600;
  border-radius: 4px;
  text-transform: uppercase;
}

.priority-badge-alta {
  background-color: #f8d7da;
  color: #842029;
}

.priority-badge-alta::before {
  content: "🔴";
}

.priority-badge-media {
  background-color: #fff3cd;
  color: #664d03;
}

.priority-badge-media::before {
  content: "🟡";
}

.priority-badge-bassa {
  background-color: #d1e7dd;
  color: #0f5132;
}

.priority-badge-bassa::before {
  content: "🟢";
}

/* ===========================================
   HOVER EFFECTS
   =========================================== */

.status-badge:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Link badge */
a.status-badge {
  text-decoration: none;
}

a.status-badge:hover {
  filter: brightness(0.95);
}

/* ===========================================
   VARIANTE SENZA EMOJI (con icone FA)
   Usa classe .status-badge-icon-only
   =========================================== */

.status-badge-icon-only::before {
  content: none !important;
}

/* ===========================================
   MOBILE ADJUSTMENTS
   =========================================== */

@media (max-width: 767.98px) {
  .status-badge {
    padding: 3px 8px;
    font-size: 0.7rem;
  }
  
  .status-badge-sm {
    padding: 2px 6px;
    font-size: 0.65rem;
  }
  
  /* Nascondi emoji su mobile per risparmiare spazio */
  .status-badge-compact::before {
    content: none !important;
  }
}