/* Marketing StarNails — Fase 6.2.5
   Ponte de compatibilidade: aplica o Design System aos componentes legados
   sem alterar regras, IDs ou contratos JavaScript. */

/* Superfícies */
.card,.panel,.mini,.health-card,.optout-kpi,.sync,.opportunity,
.campaign-row,.template-card,.audience-preview-card,.preview-box,
.readiness,.whatsapp-box,.metric {
  border-color: var(--st-color-border) !important;
  border-radius: var(--st-radius-lg) !important;
  box-shadow: var(--st-shadow-sm);
  background: var(--st-color-surface);
}
.card,.mini,.health-card,.optout-kpi,.metric { padding: var(--st-space-4); }
.panel { padding: var(--st-space-5); }

/* Controles */
input:not([type="checkbox"]):not([type="radio"]),select,textarea {
  min-height: var(--st-control-height-md);
  border: 1px solid #dcd6ca !important;
  border-radius: var(--st-radius-md) !important;
  padding: 9px 11px;
  background: #fff;
  color: var(--st-color-text);
  transition: border-color .18s,box-shadow .18s,background .18s;
}
input:hover,select:hover,textarea:hover { border-color:#cdbf9f !important; }
input:disabled,select:disabled,textarea:disabled { background:#f3f4f6;color:#8b9097;cursor:not-allowed; }
label { color:#655c4d; }

/* Botões */
button,.button {
  min-height: var(--st-control-height-md);
  border-radius: var(--st-radius-md) !important;
  padding: 9px 14px;
  gap: 7px;
  font-weight: 750;
  box-shadow: none;
}
button.secondary,.button.secondary { background:#fff;color:#5f5136;border:1px solid #dcd2bf; }
button.danger,.button.danger { background:var(--st-color-danger);color:#fff; }
button:disabled,.button[aria-disabled="true"] { opacity:.5;cursor:not-allowed;transform:none; }
.template-actions button,.campaign-actions button,.sync-button { min-height:var(--st-control-height-sm);padding:6px 10px;font-size:12px; }
.actions,.campaign-actions,.template-actions,.whatsapp-actions,.variable-buttons { gap:var(--st-space-2); }

/* Badges, chips e estados */
.badge,.pill,.template-meta-chip,.template-status,.classification-badge,.rfm-badge,
.status-DRAFT,.status-READY,.status-SCHEDULED,.status-CANCELLED,.status-COMPLETED {
  display:inline-flex;align-items:center;gap:6px;border-radius:var(--st-radius-pill);
  white-space:nowrap;font-size:11px;font-weight:800;padding:5px 9px;
}
.pill,.template-meta-chip { border:1px solid #ead8ad;background:#fff7e5;color:#7a5a1e; }
.ok,.status-READY { background:#e7f5ed;color:var(--st-color-success); }
.warn,.status-SCHEDULED { background:#fff1d4;color:var(--st-color-warning); }
.bad,.status-CANCELLED { background:#fde9e9;color:var(--st-color-danger); }
.status-DRAFT { background:#eef0f3;color:#555d68; }
.status-COMPLETED { background:#eaf3fb;color:var(--st-color-info); }

/* KPIs */
.label,.mini span,.health-card span,.optout-kpi span,.metric small {
  font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:#8b7a58;font-weight:750;
}
.value,.mini strong,.health-card strong,.optout-kpi strong {
  margin-top:7px;font-size:24px;line-height:1.1;font-weight:850;color:var(--st-color-text);
}

/* Tabelas */
.customers,.table-wrap,.optout-table { overflow:auto;border:1px solid #eee7d9;border-radius:var(--st-radius-md);background:#fff; }
.customers table,.table-wrap table,.optout-table table,.health-table { width:100%;border-collapse:collapse; }
.customers th,.optout-table th,.health-table th,.table-wrap th {
  background:#faf8f4;color:#675f52;font-size:11px;text-transform:uppercase;letter-spacing:.05em;font-weight:800;
}
.customers th,.customers td,.optout-table th,.optout-table td,.health-table th,.health-table td,.table-wrap th,.table-wrap td {
  text-align:left;padding:10px 11px;border-bottom:1px solid #eee7d9;font-size:13px;
}
.customers tbody tr:hover,.optout-table tbody tr:hover,.health-table tbody tr:hover,.table-wrap tbody tr:hover { background:#fffdf8; }

/* Alertas e estados vazios */
.notice,.risk-banner,.readiness,.modal-message { border-radius:var(--st-radius-md) !important;padding:12px 14px; }
.notice.ok { border:1px solid #c8e8d6;background:#e7f5ed;color:#245e3e; }
.notice.warn,.readiness { border:1px solid #ecd39e;background:#fff1d4;color:#805400; }
.notice.bad { border:1px solid #efcaca;background:#fde9e9;color:#8e3434; }
.empty-state,.optout-empty { padding:var(--st-space-8);text-align:center;color:var(--st-color-muted);border:1px dashed #d9cfbd;border-radius:var(--st-radius-lg);background:#fffdf9; }

/* Listas e modais */
.list-row,.status-line,.diagnostic-check { min-height:44px;align-items:center; }
.modal { border-radius:var(--st-radius-lg) !important;padding:var(--st-space-5);box-shadow:var(--st-shadow-lg); }
.modal-head { align-items:flex-start;gap:var(--st-space-3); }
.modal-actions { display:flex;justify-content:flex-end;gap:var(--st-space-2);margin-top:var(--st-space-4); }

/* Carregamento acessível e consistente */
[aria-busy="true"] { cursor:progress; }
.loading,.skeleton { position:relative;overflow:hidden;background:#f0ede7 !important;color:transparent !important; }
.loading::after,.skeleton::after { content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);animation:st-shimmer 1.35s infinite; }
@keyframes st-shimmer { to { transform:translateX(100%); } }

@media(max-width:620px){
  button,.button { min-height:42px; }
  .actions,.campaign-actions,.template-actions,.whatsapp-actions { display:flex;flex-wrap:wrap; }
  .actions>*,.campaign-actions>*,.template-actions>* { flex:1 1 auto; }
  .modal-actions { flex-direction:column-reverse; }
  .modal-actions>* { width:100%; }
}