.pideqr-track-wrap { max-width: 28rem; margin: 0 auto; padding: 2rem 1.25rem; min-height: 80vh; font-family: system-ui, sans-serif; }
.pideqr-track-header { text-align: center; margin-bottom: 1.5rem; }
.pideqr-track-header p { color: #71717a; margin: 0; font-size: .875rem; }
.pideqr-track-header h1 { margin: .25rem 0; font-size: 2rem; font-weight: 800; }
.pideqr-track-sub { color: #71717a !important; }
.pideqr-track-status-card { background: #fff; border-radius: 1rem; padding: 1.25rem; text-align: center; box-shadow: 0 1px 3px rgba(0,0,0,.08); margin-bottom: 1.5rem; }
.pideqr-track-badge { display: inline-flex; align-items: center; gap: .5rem; color: #fff; padding: .375rem 1rem; border-radius: 999px; font-size: .875rem; font-weight: 700; }
.pideqr-track-status-card p { margin: .5rem 0 0; font-size: .75rem; color: #a1a1aa; }
.pideqr-track-steps { list-style: none; margin: 0 0 1.5rem; padding: 0; }
.pideqr-track-step { display: flex; align-items: center; gap: .75rem; padding: .5rem 0; font-size: .875rem; color: #a1a1aa; }
.pideqr-track-step.done { color: #3f3f46; }
.pideqr-track-step.active { font-weight: 700; color: #18181b; }
.pideqr-track-dot { width: 2rem; height: 2rem; border-radius: 50%; background: #e4e4e7; display: flex; align-items: center; justify-content: center; color: #fff; font-size: .75rem; font-weight: 700; flex-shrink: 0; }
.pideqr-track-summary { background: #fff; border-radius: 1rem; padding: 1rem; box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.pideqr-track-summary ul { list-style: none; margin: .5rem 0; padding: 0; font-size: .875rem; }
.pideqr-track-summary li { display: flex; justify-content: space-between; color: #52525b; margin-bottom: .25rem; }
.pideqr-track-total { display: flex; justify-content: space-between; font-weight: 700; border-top: 1px solid #f4f4f5; padding-top: .5rem; margin-top: .5rem; }
.pideqr-track-bs { text-align: right; font-size: .75rem; color: #a1a1aa; margin: .25rem 0 0; }
.pideqr-track-note { text-align: center; font-size: .75rem; color: #a1a1aa; margin-top: 1rem; }
.pideqr-track-back { display: block; text-align: center; margin-top: 1rem; color: var(--pideqr-brand, #e11d48); font-weight: 600; text-decoration: none; }
.pideqr-track-cancelled { background: #fff1f2; color: #be123c; text-align: center; padding: 1.5rem; border-radius: 1rem; font-weight: 700; margin-bottom: 1rem; }
.pideqr-track-empty { text-align: center; padding: 3rem 1rem; color: #71717a; }

/* Banner de pedido recién creado */
.pideqr-track-celebrate {
  display: flex; align-items: center; gap: .85rem;
  background: linear-gradient(135deg, #ecfdf5, #d1fae5);
  border: 1px solid #a7f3d0; border-radius: 1rem;
  padding: 1rem 1.15rem; margin-bottom: 1.25rem;
  box-shadow: 0 10px 30px -16px rgba(16, 185, 129, .55);
  animation: pideqr-track-pop .4s cubic-bezier(.22,1,.36,1) both;
}
.pideqr-track-celebrate-icon {
  flex-shrink: 0; width: 2.5rem; height: 2.5rem; border-radius: 50%;
  background: #10b981; color: #fff; font-size: 1.25rem; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 16px -6px rgba(16,185,129,.8);
}
.pideqr-track-celebrate strong { display: block; color: #065f46; font-size: .95rem; }
.pideqr-track-celebrate span { display: block; color: #047857; font-size: .8rem; margin-top: .1rem; }
@keyframes pideqr-track-pop { from { opacity: 0; transform: translateY(-8px) scale(.98);} to { opacity: 1; transform: translateY(0) scale(1);} }

/* Botón WhatsApp profesional */
.pideqr-track-wa {
  display: flex; align-items: center; justify-content: center; gap: .6rem;
  width: 100%; margin: 0 0 .4rem; padding: .9rem 1rem;
  background: linear-gradient(135deg, #25d366, #1ebe5d);
  color: #fff !important; font-weight: 700; font-size: .95rem;
  border-radius: 999px; text-decoration: none !important;
  box-shadow: 0 12px 26px -12px rgba(37, 211, 102, .8);
  transition: transform .15s cubic-bezier(.22,1,.36,1), box-shadow .2s ease, filter .2s ease;
}
.pideqr-track-wa:hover { transform: translateY(-1px); filter: brightness(1.03); }
.pideqr-track-wa:active { transform: scale(.99); }
.pideqr-track-wa svg { width: 1.35rem; height: 1.35rem; flex-shrink: 0; }
.pideqr-track-wa-hint { text-align: center; font-size: .72rem; color: #a1a1aa; margin: 0 0 1.25rem; }

/* ---- Capa Premium Tier 1 (seguimiento) ---- */
.pideqr-track-wrap {
  background:
    radial-gradient(900px 400px at 100% -10%, color-mix(in srgb, var(--pideqr-brand, #e11d48) 8%, transparent), transparent 60%),
    transparent;
}
.pideqr-track-header h1 {
  background: linear-gradient(120deg, #18181b, #52525b);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.pideqr-track-status-card {
  border: 1px solid rgba(24,24,27,.05);
  box-shadow: 0 2px 8px -2px rgba(24,24,27,.08), 0 16px 40px -20px rgba(24,24,27,.18);
  animation: pideqr-fade-in-up .35s cubic-bezier(.22,1,.36,1) both;
}
.pideqr-track-badge { box-shadow: 0 8px 20px -8px color-mix(in srgb, var(--pideqr-brand, #e11d48) 60%, transparent); }
.pideqr-track-dot { transition: background .3s ease, transform .3s cubic-bezier(.22,1,.36,1); }
.pideqr-track-step.active .pideqr-track-dot {
  background: var(--pideqr-brand, #e11d48) !important;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--pideqr-brand, #e11d48) 18%, transparent);
  transform: scale(1.08);
}
.pideqr-track-step.done .pideqr-track-dot { background: #10b981; }
.pideqr-track-summary {
  border: 1px solid rgba(24,24,27,.05);
  box-shadow: 0 2px 8px -2px rgba(24,24,27,.08), 0 16px 40px -20px rgba(24,24,27,.16);
}
.pideqr-track-back { transition: opacity .2s ease; }
/* Blindaje: el tema activo no debe cambiar el color/subrayado del enlace */
.pideqr-app .pideqr-track-back,
.pideqr-app .pideqr-track-back:hover,
.pideqr-app .pideqr-track-back:focus {
  color: var(--pideqr-brand, #e11d48);
  text-decoration: none;
}
.pideqr-track-back:hover { opacity: .75; }
.pideqr-track-back:focus-visible {
  outline: 2px solid var(--pideqr-brand, #e11d48);
  outline-offset: 3px;
  border-radius: 8px;
}
@keyframes pideqr-fade-in-up { from { opacity: 0; transform: translateY(8px);} to { opacity: 1; transform: translateY(0);} }