/* ==========================================================================
   AVANCE UI — camada visual compartilhada (opt-in)

   Esta folha fornece tokens semânticos e componentes prefixados `.av-ui-*`.
   Nenhum seletor de módulo é alterado automaticamente: cada superfície adere
   explicitamente aos aliases ou às classes abaixo.
   ========================================================================== */

:root {
  /* Superfícies e conteúdo */
  --av-ui-bg: transparent;
  --av-ui-surface-1: #18121f;
  --av-ui-surface-2: #1d1526;
  --av-ui-surface-3: #23172d;
  --av-ui-surface-soft: #2d1b39;
  --av-ui-border: #35263f;
  --av-ui-border-strong: #51335f;
  --av-ui-text: #fbf8fc;
  --av-ui-text-muted: #aa9eb2;
  --av-ui-text-subtle: #807387;

  /* Marca, direção e estado */
  --av-ui-accent: var(--av-roxo, #5b1f7e);
  --av-ui-accent-strong: #873cac;
  --av-ui-accent-soft: #34203f;
  --av-ui-action: var(--av-ouro, #d4af37);
  --av-ui-action-strong: #e4bd35;
  --av-ui-success: #42d5a0;
  --av-ui-danger: #f56072;
  --av-ui-info: #68a9ff;

  /* Forma, profundidade e movimento */
  --av-ui-radius-sm: 10px;
  --av-ui-radius-md: 13px;
  --av-ui-radius-lg: 18px;
  --av-ui-radius-control: var(--av-ui-radius-sm);
  --av-ui-radius-card: var(--av-ui-radius-lg);
  --av-ui-radius-pill: 999px;
  --av-ui-shadow-card: 0 14px 34px rgba(0, 0, 0, .16);
  --av-ui-shadow-focus: 0 0 0 3px color-mix(in srgb, var(--av-ui-action) 82%, white);
  --av-ui-motion-fast: 120ms;
  --av-ui-motion-base: 180ms;
  --av-ui-motion-slow: 350ms;
  --av-ui-ease-standard: cubic-bezier(.2, 0, 0, 1);

  /* Tipografia e interação */
  --av-ui-font-body: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --av-ui-font-title: Poppins, Inter, system-ui, sans-serif;
  --av-font-body: var(--av-ui-font-body);
  --av-font-heading: var(--av-ui-font-title);
  --av-ui-touch-target: 44px;
}

body.theme-light,
[data-av-theme="light"] {
  --av-ui-surface-1: #fff;
  --av-ui-surface-2: #faf7fc;
  --av-ui-surface-3: #f3edf7;
  --av-ui-surface-soft: #efe5f4;
  --av-ui-border: #dfd3e5;
  --av-ui-border-strong: #b99fc7;
  --av-ui-text: #241b36;
  --av-ui-text-muted: #665a73;
  --av-ui-text-subtle: #807389;
  --av-ui-shadow-card: 0 5px 18px rgba(54, 24, 71, .07);
}

/* Base deliberadamente opt-in. */
.av-ui-root {
  min-width: 0;
  color: var(--av-ui-text);
  font-family: var(--av-ui-font-body);
}

.av-ui-root *,
.av-ui-root *::before,
.av-ui-root *::after { box-sizing: border-box; }

.av-ui-root :where(button, a, [role="button"]):focus-visible,
:where(.av-ui-button, .av-ui-icon-button, .av-ui-card--interactive):focus-visible {
  outline: 3px solid color-mix(in srgb, var(--av-ui-action) 82%, white);
  outline-offset: 3px;
}

.av-ui-card {
  min-width: 0;
  border: 1px solid var(--av-ui-border);
  border-radius: var(--av-ui-radius-lg);
  background: var(--av-ui-surface-1);
  box-shadow: var(--av-ui-shadow-card);
  color: var(--av-ui-text);
}

.av-ui-card--soft {
  border-color: var(--av-ui-border);
  background: var(--av-ui-surface-2);
  box-shadow: none;
}

.av-ui-card--interactive {
  cursor: pointer;
  transition:
    border-color var(--av-ui-motion-base) var(--av-ui-ease-standard),
    background-color var(--av-ui-motion-base) var(--av-ui-ease-standard),
    transform var(--av-ui-motion-fast) var(--av-ui-ease-standard);
}

.av-ui-card--interactive:hover { border-color: var(--av-ui-border-strong); }
.av-ui-card--interactive:active { transform: translateY(1px); }

.av-ui-button,
.av-ui-icon-button {
  display: inline-flex;
  min-height: var(--av-ui-touch-target);
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid transparent;
  border-radius: var(--av-ui-radius-sm);
  font-family: var(--av-ui-font-body);
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
  transition:
    border-color var(--av-ui-motion-base) var(--av-ui-ease-standard),
    background-color var(--av-ui-motion-base) var(--av-ui-ease-standard),
    color var(--av-ui-motion-base) var(--av-ui-ease-standard),
    transform var(--av-ui-motion-fast) var(--av-ui-ease-standard);
}

.av-ui-button { padding: 0 16px; }
.av-ui-icon-button { width: var(--av-ui-touch-target); padding: 0; }
.av-ui-button:active,
.av-ui-icon-button:active { transform: translateY(1px); }

.av-ui-button--primary {
  border-color: color-mix(in srgb, var(--av-ui-action) 72%, #000);
  background: linear-gradient(135deg, var(--av-ui-action-strong), var(--av-ui-action));
  color: #241b0a;
}

.av-ui-button--secondary,
.av-ui-icon-button {
  border-color: var(--av-ui-border-strong);
  background: var(--av-ui-surface-3);
  color: var(--av-ui-text);
}

.av-ui-button--quiet {
  border-color: var(--av-ui-border);
  background: transparent;
  color: var(--av-ui-text-muted);
}

.av-ui-button--danger {
  border-color: color-mix(in srgb, var(--av-ui-danger) 48%, transparent);
  background: color-mix(in srgb, var(--av-ui-danger) 12%, var(--av-ui-surface-1));
  color: var(--av-ui-danger);
}

.av-ui-button:disabled,
.av-ui-icon-button:disabled,
.av-ui-button[aria-disabled="true"],
.av-ui-icon-button[aria-disabled="true"] {
  opacity: .52;
  pointer-events: none;
  cursor: not-allowed;
}

.av-ui-eyebrow {
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--av-ui-action-strong);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.av-ui-title {
  margin: 0;
  color: var(--av-ui-text);
  font-family: var(--av-ui-font-title);
  font-weight: 800;
  line-height: 1.2;
}

.av-ui-muted { color: var(--av-ui-text-muted); }
.av-ui-subtle { color: var(--av-ui-text-subtle); }

.av-ui-section-head {
  display: flex;
  min-width: 0;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.av-ui-section-head > :first-child { min-width: 0; }

.av-ui-stat {
  min-width: 0;
  padding: 14px;
  border: 1px solid var(--av-ui-border);
  border-radius: var(--av-ui-radius-md);
  background: var(--av-ui-surface-2);
  color: var(--av-ui-text-muted);
  font-size: 11px;
}

.av-ui-stat > strong {
  display: block;
  margin-bottom: 3px;
  color: var(--av-ui-text);
  font: 800 20px/1.15 var(--av-ui-font-title);
}

.av-ui-badge {
  display: inline-flex;
  min-height: 26px;
  align-items: center;
  gap: 6px;
  padding: 4px 9px;
  border: 1px solid var(--av-ui-border);
  border-radius: var(--av-ui-radius-pill);
  background: var(--av-ui-surface-2);
  color: var(--av-ui-text-muted);
  font-size: 10px;
  font-weight: 800;
  line-height: 1.2;
}

.av-ui-badge--action { border-color: color-mix(in srgb, var(--av-ui-action) 45%, transparent); color: var(--av-ui-action-strong); }
.av-ui-badge--success { border-color: color-mix(in srgb, var(--av-ui-success) 45%, transparent); color: var(--av-ui-success); }
.av-ui-badge--danger { border-color: color-mix(in srgb, var(--av-ui-danger) 45%, transparent); color: var(--av-ui-danger); }
.av-ui-badge--info { border-color: color-mix(in srgb, var(--av-ui-info) 45%, transparent); color: var(--av-ui-info); }

.av-ui-progress {
  width: 100%;
  height: 7px;
  overflow: hidden;
  border-radius: var(--av-ui-radius-pill);
  background: var(--av-ui-surface-soft);
}

.av-ui-progress > span {
  display: block;
  width: var(--av-ui-progress, 0%);
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--av-ui-accent-strong), var(--av-ui-action));
  transition: width var(--av-ui-motion-slow) var(--av-ui-ease-standard);
}

.av-ui-disclosure {
  border: 1px solid var(--av-ui-border);
  border-radius: var(--av-ui-radius-md);
  background: var(--av-ui-surface-1);
}

.av-ui-disclosure > summary {
  display: flex;
  min-height: var(--av-ui-touch-target);
  align-items: center;
  gap: 10px;
  padding: 10px 13px;
  color: var(--av-ui-text);
  font-weight: 800;
  list-style: none;
  cursor: pointer;
}

.av-ui-disclosure > summary::-webkit-details-marker { display: none; }
.av-ui-disclosure > :not(summary) { margin: 0; padding: 0 13px 13px; }

.av-ui-scroll-strip {
  display: flex;
  max-width: 100%;
  gap: 8px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-width: thin;
  scroll-snap-type: inline proximity;
}

.av-ui-scroll-strip > * { flex: 0 0 auto; scroll-snap-align: start; }

.av-ui-skeleton {
  display: block;
  overflow: hidden;
  border-radius: 8px;
  background: linear-gradient(100deg, rgba(255,255,255,.045) 20%, rgba(255,255,255,.105) 38%, rgba(255,255,255,.045) 56%);
  background-size: 220% 100%;
  animation: avUiShimmer 1.35s ease-in-out infinite;
}

@keyframes avUiShimmer {
  from { background-position: 100% 0; }
  to { background-position: -120% 0; }
}

.av-ui-status,
.av-ui-empty {
  border: 1px solid var(--av-ui-border);
  border-radius: var(--av-ui-radius-md);
  background: var(--av-ui-surface-2);
  color: var(--av-ui-text-muted);
}

.av-ui-status {
  display: flex;
  min-height: var(--av-ui-touch-target);
  align-items: center;
  gap: 10px;
  padding: 10px 13px;
  font-size: 12px;
}

.av-ui-status--success { border-color: color-mix(in srgb, var(--av-ui-success) 45%, var(--av-ui-border)); }
.av-ui-status--danger { border-color: color-mix(in srgb, var(--av-ui-danger) 50%, var(--av-ui-border)); color: color-mix(in srgb, var(--av-ui-danger) 76%, white); }
.av-ui-status--info { border-color: color-mix(in srgb, var(--av-ui-info) 45%, var(--av-ui-border)); }
.av-ui-empty { padding: 22px; text-align: center; font-size: 13px; line-height: 1.5; }

.av-ui-sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

@media (prefers-reduced-motion: reduce) {
  .av-ui-card--interactive,
  .av-ui-button,
  .av-ui-icon-button,
  .av-ui-progress > span { transition-duration: 0.01ms !important; }
  .av-ui-skeleton { animation: none !important; }
}