/* ============================================================
   SDP empty/loading/error states redesigned
   Scope: body.sdp-redesigned. CSS-only state patterns.
   ============================================================ */

body.sdp-redesigned {
  --sdp-state-surface: var(--sdp-preview-panel, #FFFEFA);
  --sdp-state-ink: var(--sdp-preview-ink, #172033);
  --sdp-state-muted: var(--sdp-preview-muted, #697386);
  --sdp-state-line: var(--sdp-preview-line, rgba(31, 45, 74, 0.12));
  --sdp-state-navy: var(--sdp-preview-navy, #17243C);
  --sdp-state-teal: var(--sdp-preview-teal, #1D766F);
  --sdp-state-gold: var(--sdp-preview-gold, #B5904A);
  --sdp-state-danger: #A12B2B;
  --sdp-state-warning: #94620E;
  --sdp-state-success: #1F7A4D;
}

body.sdp-redesigned .empty-state,
body.sdp-redesigned .empty-state-premium,
body.sdp-redesigned .loading-state,
body.sdp-redesigned .error-state,
body.sdp-redesigned .no-data,
body.sdp-redesigned .sem-dados,
body.sdp-redesigned .placeholder-state {
  position: relative;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 10px;
  min-height: 190px;
  padding: 30px 22px;
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 254, 250, 0.88), rgba(244, 241, 232, 0.50)),
    var(--sdp-state-surface);
  color: var(--sdp-state-muted) !important;
  text-align: center;
}

body.sdp-redesigned td .empty-state,
body.sdp-redesigned td .empty-state-premium,
body.sdp-redesigned td .loading-state,
body.sdp-redesigned td .error-state {
  min-height: 168px;
  margin: 0;
  background: transparent;
}

body.sdp-redesigned .empty-state::before,
body.sdp-redesigned .empty-state-premium::before,
body.sdp-redesigned .loading-state::before,
body.sdp-redesigned .error-state::before,
body.sdp-redesigned .no-data::before,
body.sdp-redesigned .sem-dados::before,
body.sdp-redesigned .placeholder-state::before {
  content: "";
  position: absolute;
  inset: 14px;
  border-radius: 8px;
  border: 1px dashed rgba(31, 45, 74, 0.14);
  pointer-events: none;
}

body.sdp-redesigned .empty-icon,
body.sdp-redesigned .state-icon,
body.sdp-redesigned .loading-icon,
body.sdp-redesigned .error-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 8px;
  background: rgba(181, 144, 74, 0.14);
  color: #7A5F23;
  box-shadow: inset 0 0 0 1px rgba(181, 144, 74, 0.16);
}

body.sdp-redesigned .empty-icon svg,
body.sdp-redesigned .state-icon svg,
body.sdp-redesigned .loading-icon svg,
body.sdp-redesigned .error-icon svg {
  width: 24px;
  height: 24px;
}

body.sdp-redesigned .empty-state h3,
body.sdp-redesigned .empty-state-premium h3,
body.sdp-redesigned .loading-state h3,
body.sdp-redesigned .error-state h3,
body.sdp-redesigned .no-data h3,
body.sdp-redesigned .sem-dados h3,
body.sdp-redesigned .placeholder-state h3 {
  margin: 0;
  color: var(--sdp-state-ink) !important;
  font-family: var(--font-family-base);
  font-size: 1.02rem;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: 0;
}

body.sdp-redesigned .empty-state p,
body.sdp-redesigned .empty-state-premium p,
body.sdp-redesigned .loading-state p,
body.sdp-redesigned .error-state p,
body.sdp-redesigned .no-data p,
body.sdp-redesigned .sem-dados p,
body.sdp-redesigned .placeholder-state p {
  max-width: 420px;
  margin: 0;
  color: var(--sdp-state-muted) !important;
  font-size: 0.9rem;
  line-height: 1.5;
}

body.sdp-redesigned .loading-state .loading-icon,
body.sdp-redesigned .loading-spinner,
body.sdp-redesigned .spinner {
  background: rgba(29, 118, 111, 0.12);
  color: var(--sdp-state-teal);
}

body.sdp-redesigned .loading-spinner,
body.sdp-redesigned .spinner {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 3px solid rgba(29, 118, 111, 0.18);
  border-top-color: var(--sdp-state-teal);
  animation: sdp-state-spin 850ms linear infinite;
}

body.sdp-redesigned .error-state,
body.sdp-redesigned .alert-error,
body.sdp-redesigned .error-message {
  background:
    linear-gradient(180deg, rgba(161, 43, 43, 0.07), rgba(255, 254, 250, 0.86)),
    var(--sdp-state-surface);
}

body.sdp-redesigned .error-state .error-icon,
body.sdp-redesigned .alert-error .state-icon {
  background: rgba(161, 43, 43, 0.10);
  color: var(--sdp-state-danger);
  box-shadow: inset 0 0 0 1px rgba(161, 43, 43, 0.16);
}

body.sdp-redesigned .alert,
body.sdp-redesigned .alert-info,
body.sdp-redesigned .alert-warning,
body.sdp-redesigned .alert-success,
body.sdp-redesigned .alert-error,
body.sdp-redesigned .error-message,
body.sdp-redesigned .success-message,
body.sdp-redesigned .warning-message {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  width: 100%;
  margin: 0 0 14px;
  padding: 12px 14px;
  border-radius: 8px;
  border: 1px solid rgba(31, 45, 74, 0.12);
  background: rgba(255, 254, 250, 0.86);
  color: var(--sdp-state-ink) !important;
  font-size: 0.9rem;
  line-height: 1.45;
  box-shadow: 0 1px 1px rgba(31, 45, 74, 0.04);
}

body.sdp-redesigned .alert-info {
  border-color: rgba(29, 118, 111, 0.24);
  background: rgba(29, 118, 111, 0.08);
}

body.sdp-redesigned .alert-warning,
body.sdp-redesigned .warning-message {
  border-color: rgba(148, 98, 14, 0.24);
  background: rgba(148, 98, 14, 0.08);
}

body.sdp-redesigned .alert-success,
body.sdp-redesigned .success-message {
  border-color: rgba(31, 122, 77, 0.24);
  background: rgba(31, 122, 77, 0.08);
}

body.sdp-redesigned .alert-error,
body.sdp-redesigned .error-message {
  border-color: rgba(161, 43, 43, 0.24);
}

body.sdp-redesigned .skeleton,
body.sdp-redesigned .skeleton-line,
body.sdp-redesigned .loading-placeholder {
  position: relative;
  overflow: hidden;
  min-height: 12px;
  border-radius: 999px;
  background: rgba(31, 45, 74, 0.08);
}

body.sdp-redesigned .skeleton::after,
body.sdp-redesigned .skeleton-line::after,
body.sdp-redesigned .loading-placeholder::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.62), transparent);
  animation: sdp-state-shimmer 1300ms ease-in-out infinite;
}

[data-theme="dark"] body.sdp-redesigned .empty-state,
[data-theme="dark"] body.sdp-redesigned .empty-state-premium,
[data-theme="dark"] body.sdp-redesigned .loading-state,
[data-theme="dark"] body.sdp-redesigned .error-state,
[data-theme="dark"] body.sdp-redesigned .no-data,
[data-theme="dark"] body.sdp-redesigned .sem-dados,
[data-theme="dark"] body.sdp-redesigned .placeholder-state {
  background:
    linear-gradient(180deg, rgba(18, 29, 46, 0.86), rgba(13, 21, 35, 0.62)),
    var(--sdp-state-surface);
}

[data-theme="dark"] body.sdp-redesigned .empty-state::before,
[data-theme="dark"] body.sdp-redesigned .empty-state-premium::before,
[data-theme="dark"] body.sdp-redesigned .loading-state::before,
[data-theme="dark"] body.sdp-redesigned .error-state::before,
[data-theme="dark"] body.sdp-redesigned .no-data::before,
[data-theme="dark"] body.sdp-redesigned .sem-dados::before,
[data-theme="dark"] body.sdp-redesigned .placeholder-state::before {
  border-color: rgba(255, 255, 255, 0.12);
}

[data-theme="dark"] body.sdp-redesigned .alert,
[data-theme="dark"] body.sdp-redesigned .alert-info,
[data-theme="dark"] body.sdp-redesigned .alert-warning,
[data-theme="dark"] body.sdp-redesigned .alert-success,
[data-theme="dark"] body.sdp-redesigned .alert-error,
[data-theme="dark"] body.sdp-redesigned .error-message,
[data-theme="dark"] body.sdp-redesigned .success-message,
[data-theme="dark"] body.sdp-redesigned .warning-message {
  background: rgba(18, 29, 46, 0.82);
  border-color: rgba(255, 255, 255, 0.12);
}

[data-theme="dark"] body.sdp-redesigned .empty-icon,
[data-theme="dark"] body.sdp-redesigned .state-icon,
[data-theme="dark"] body.sdp-redesigned .loading-icon,
[data-theme="dark"] body.sdp-redesigned .error-icon {
  background: rgba(181, 144, 74, 0.16);
  color: #F0D7A1;
  box-shadow: inset 0 0 0 1px rgba(181, 144, 74, 0.24);
}

[data-theme="dark"] body.sdp-redesigned .alert-info {
  border-color: rgba(45, 212, 191, 0.28);
  background: rgba(20, 184, 166, 0.12);
}

[data-theme="dark"] body.sdp-redesigned .alert-warning,
[data-theme="dark"] body.sdp-redesigned .warning-message {
  border-color: rgba(251, 191, 36, 0.32);
  background: rgba(245, 158, 11, 0.13);
}

[data-theme="dark"] body.sdp-redesigned .alert-success,
[data-theme="dark"] body.sdp-redesigned .success-message {
  border-color: rgba(74, 222, 128, 0.28);
  background: rgba(34, 197, 94, 0.12);
}

[data-theme="dark"] body.sdp-redesigned .alert-error,
[data-theme="dark"] body.sdp-redesigned .error-message,
[data-theme="dark"] body.sdp-redesigned .error-state {
  border-color: rgba(248, 113, 113, 0.32);
  background:
    linear-gradient(180deg, rgba(220, 38, 38, 0.13), rgba(18, 29, 46, 0.82)),
    var(--sdp-state-surface);
}

@keyframes sdp-state-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes sdp-state-shimmer {
  100% {
    transform: translateX(100%);
  }
}

@media (max-width: 768px) {
  body.sdp-redesigned .empty-state,
  body.sdp-redesigned .empty-state-premium,
  body.sdp-redesigned .loading-state,
  body.sdp-redesigned .error-state,
  body.sdp-redesigned .no-data,
  body.sdp-redesigned .sem-dados,
  body.sdp-redesigned .placeholder-state {
    min-height: 156px;
    padding: 24px 18px;
  }

  body.sdp-redesigned .empty-state::before,
  body.sdp-redesigned .empty-state-premium::before,
  body.sdp-redesigned .loading-state::before,
  body.sdp-redesigned .error-state::before,
  body.sdp-redesigned .no-data::before,
  body.sdp-redesigned .sem-dados::before,
  body.sdp-redesigned .placeholder-state::before {
    inset: 10px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.sdp-redesigned .loading-spinner,
  body.sdp-redesigned .spinner,
  body.sdp-redesigned .skeleton::after,
  body.sdp-redesigned .skeleton-line::after,
  body.sdp-redesigned .loading-placeholder::after {
    animation: none;
  }
}