/**
 * Projeto: RGLog CAOA
 * Arquivo: card.css
 * Autor: Djeferson Capelli
 * Versão: 1.0.0
 * Descrição: Componente card — superfície elevada com header/body/footer
 */

.card {
  background-color: var(--c-bg-elevated);
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}

.card-header {
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--c-border);
  display: flex;
  align-items: center;
  gap: 12px;
}
.card-header h2,
.card-header h3 { margin: 0; }
.card-header .spacer { flex: 1; }

.card-body { padding: 1.25rem; }

.card-footer {
  padding: 0.875rem 1.25rem;
  border-top: 1px solid var(--c-border);
  background-color: var(--c-bg-subtle);
}

/* Card "elevado" (login etc) */
.card-elevated { box-shadow: var(--shadow-lg); border-color: transparent; }

/* Badges de status */
.badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
}
.badge-success { background: var(--c-success-soft); color: var(--c-success); }
.badge-warning { background: var(--c-warning-soft); color: var(--c-warning); }
.badge-danger  { background: var(--c-danger-soft);  color: var(--c-danger); }
.badge-info    { background: var(--c-info-soft);    color: var(--c-info); }
.badge-muted   { background: var(--c-bg-subtle);    color: var(--c-text-muted); }

/* Alert (notificação inline) */
.alert {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 12px 16px;
  border-radius: var(--radius-sm);
  font-size: 14px;
  border: 1px solid transparent;
}
.alert-success { background: var(--c-success-soft); color: var(--c-success); border-color: var(--c-success); }
.alert-warning { background: var(--c-warning-soft); color: var(--c-warning); border-color: var(--c-warning); }
.alert-danger  { background: var(--c-danger-soft);  color: var(--c-danger);  border-color: var(--c-danger); }
.alert-info    { background: var(--c-info-soft);    color: var(--c-info);    border-color: var(--c-info); }