/**
 * BADGES.CSS
 * Componentes relacionados
 */

/* ============================================
   SCHEDULING BADGES (Badges de agendamento)
   ============================================ */

.scheduling-badge {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 8px;
  font-size: 11px;
  line-height: 1.4;
}

.scheduling-badge--scheduled {
  background: #f39c12;
  color: white;
}

.scheduling-badge--published {
  background: #27ae60;
  color: #ffffff;
}

.scheduling-badge--no-date,
.scheduling-badge--dash {
  background-color: #999;
  color: #ffffff;
}

/* Dark theme support */
[data-theme="dark"] .scheduling-badge--scheduled {
  background: #f39c12;
  color: var(--surface);
}

[data-theme="dark"] .scheduling-badge--published {
  background-color  : #27ae60;
  color: var(--surface);
}

[data-theme="dark"] .scheduling-badge--no-date,
[data-theme="dark"] .scheduling-badge--dash {
  background-color: #999;
  color: var(--surface);
}


/* ============================================
   STATUS BADGES (Badges de status)
   ============================================ */

.status-badge {
  display: inline-block;
  padding: 3px 8px;
  border-radius: 8px;
  font-size: 11px;
  line-height: 1.4;
  color: white;
}

.status-badge--draft {
  background: #999;
}

.status-badge--review {
  background: #f39c12;
}

.status-badge--published {
  background: #27ae60;
}

.status-badge--archived {
  background: #e74c3c;
}

/* Dark theme support */
[data-theme="dark"] .status-badge--draft {
  background: #666;
}

[data-theme="dark"] .status-badge--review {
  background: #f39c12;
}

[data-theme="dark"] .status-badge--published {
  background: #27ae60;
}

[data-theme="dark"] .status-badge--archived {
  background: #e74c3c;
}

/* Badges para programação de destaques */
.status-badge--active {
  background: #27ae60;
}

.status-badge--scheduled {
  background: #f39c12;
}

.status-badge--expired {
  background: #95a5a6;
}

.status-badge--inactive {
  background: #e74c3c;
}

/* Dark theme support para badges de programação */
[data-theme="dark"] .status-badge--active {
  background: #27ae60;
}

[data-theme="dark"] .status-badge--scheduled {
  background: #f39c12;
}

[data-theme="dark"] .status-badge--expired {
  background: #7f8c8d;
}

[data-theme="dark"] .status-badge--inactive {
  background: #e74c3c;
}


/* ============================================
   TRANSLATION WARNING (Aviso de tradução faltando)
   ============================================ */

.translation-warning {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 600;
  background: #fff3cd;
  color: #856404;
  border: 1px solid #ffc107;
  animation: pulse-warning 2s ease-in-out infinite;
}

.translation-warning i {
  font-size: 11px;
}

/* Dark theme support */
[data-theme="dark"] .translation-warning {
  background: #3d2f00;
  color: #ffc107;
  border-color: #ffc107;
}

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

/* ============================================
   ALERTS (com suporte a tema)
   ============================================ */

.alert {
  padding: 0.75rem 1rem;
  margin-bottom: 1rem;
  border: 1px solid transparent;
  border-radius: 8px;
  font-size: var(--text-sm);
  line-height: 1.5;
}

.alert-info {
  background-color: rgba(52, 152, 219, 0.1);
  border-color: rgba(52, 152, 219, 0.3);
  color: #3498db;
}

.alert-danger {
  background-color: rgba(231, 76, 60, 0.1);
  border-color: rgba(231, 76, 60, 0.3);
  color: #e74c3c;
}

.alert-warning {
  background-color: rgba(243, 156, 18, 0.1);
  border-color: rgba(243, 156, 18, 0.3);
  color: #f39c12;
}

.alert-success {
  background-color: rgba(39, 174, 96, 0.1);
  border-color: rgba(39, 174, 96, 0.3);
  color: #27ae60;
}

/* Dark theme support */
[data-theme="dark"] .alert-info {
  background-color: rgba(52, 152, 219, 0.15);
  border-color: rgba(52, 152, 219, 0.4);
  color: #5dade2;
}

[data-theme="dark"] .alert-danger {
  background-color: rgba(231, 76, 60, 0.15);
  border-color: rgba(231, 76, 60, 0.4);
  color: #ec7063;
}

[data-theme="dark"] .alert-warning {
  background-color: rgba(243, 156, 18, 0.15);
  border-color: rgba(243, 156, 18, 0.4);
  color: #f7dc6f;
}

[data-theme="dark"] .alert-success {
  background-color: rgba(39, 174, 96, 0.15);
  border-color: rgba(39, 174, 96, 0.4);
  color: #58d68d;
}