/* === Auron Dark Theme — Obras 360 === */

body {
  background: linear-gradient(135deg, hsl(240, 10%, 3.9%) 0%, hsl(240, 12%, 6%) 50%, hsl(240, 10%, 3.9%) 100%);
  min-height: 100vh;
}

/* Glow card */
.card-glow {
  position: relative;
  border: 1px solid hsl(240, 3.7%, 15.9%);
  border-radius: 0.75rem;
  background: hsl(240, 10%, 5%);
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}
.card-glow:hover {
  border-color: hsl(240, 5%, 25%);
  box-shadow: 0 0 24px rgba(255, 255, 255, 0.03);
}

/* Sentiment badges */
.badge-muito-insatisfeito { background: hsl(0, 72%, 25%); color: hsl(0, 100%, 90%); }
.badge-insatisfeito { background: hsl(25, 70%, 25%); color: hsl(25, 100%, 90%); }
.badge-neutro { background: hsl(240, 5%, 20%); color: hsl(240, 5%, 75%); }
.badge-satisfeito { background: hsl(142, 50%, 20%); color: hsl(142, 80%, 80%); }
.badge-muito-satisfeito { background: hsl(142, 72%, 22%); color: hsl(142, 100%, 88%); }
.badge-pendente { background: hsl(240, 5%, 15%); color: hsl(240, 5%, 55%); }

/* Workflow badge */
.badge-workflow {
  background: hsl(220, 50%, 18%);
  color: hsl(220, 80%, 75%);
  border: 1px solid hsl(220, 40%, 28%);
}

/* KPI card */
.kpi-value {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
}
.kpi-value-sm {
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1;
}
.kpi-label {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: hsl(240, 5%, 55%);
  margin-top: 0.25rem;
}

/* Section accent */
.section-accent {
  border-left: 3px solid hsl(220, 40%, 35%);
  padding-left: 1rem;
}

/* Audio player dark override */
audio::-webkit-media-controls-panel {
  background-color: hsl(240, 3.7%, 15.9%);
}

/* Pulse animation */
@keyframes pulse-ring {
  0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.4); }
  70% { box-shadow: 0 0 0 10px rgba(34, 197, 94, 0); }
  100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); }
}
.pulse-green { animation: pulse-ring 2s infinite; }

/* Clickable row */
.row-clickable {
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.row-clickable:hover {
  background-color: hsl(240, 5%, 8%);
}

/* Page enter animation */
.page-enter { animation: fadeIn 0.3s ease; }
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Button loading state */
.btn-loading {
  pointer-events: none;
  opacity: 0.6;
}
.btn-loading::after {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  border: 2px solid transparent;
  border-top-color: currentColor;
  border-radius: 50%;
  animation: spin 0.6s linear infinite;
  margin-left: 8px;
  vertical-align: middle;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* Tier badges */
.tier-premium { background: hsl(45, 80%, 25%); color: hsl(45, 100%, 85%); }
.tier-enterprise { background: hsl(270, 50%, 25%); color: hsl(270, 80%, 85%); }
.tier-standard { background: hsl(240, 5%, 20%); color: hsl(240, 5%, 75%); }

/* Modal overlay */
.modal-overlay {
  background: rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(4px);
}

/* Line clamp */
.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.line-clamp-1 {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
