:root {
  --alfa-bg: #ffffff;
  --alfa-fg: #1f2937;
  --alfa-muted: #6b7280;
  --alfa-border: #e5e7eb;
  --alfa-primary: #2563eb; /* azul elegante */
  --alfa-primary-contrast: #ffffff;
  --alfa-surface: #f8fafc;
  --alfa-shadow: 0 8px 28px rgba(0,0,0,.08);
  --alfa-radius: 14px;
}

@media (prefers-color-scheme: dark) {
  :root {
    --alfa-bg: #0b1220;
    --alfa-fg: #e5e7eb;
    --alfa-muted: #9ca3af;
    --alfa-border: #1f2937;
    --alfa-primary: #60a5fa;
    --alfa-primary-contrast: #0b1220;
    --alfa-surface: #111827;
    --alfa-shadow: 0 10px 30px rgba(0,0,0,.35);
  }
}

.alfa-pdf {
  margin: clamp(18px, 3vw, 28px) 0;
  color: var(--alfa-fg);
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, "Helvetica Neue", Arial;
}

.alfa-pdf__frame {
  background: var(--alfa-surface);
  border: 1px solid var(--alfa-border);
  border-radius: var(--alfa-radius);
  overflow: hidden;
  box-shadow: var(--alfa-shadow);
}

/* relación de aspecto fluida en móviles */
.ratio {
  position: relative;
}
@media (max-width: 640px) {
  .ratio { padding-top: 140%; } /* 1:1.4 móvil */
  .ratio > iframe {
    position: absolute; inset: 0; width: 100%; height: 100%;
  }
}

.alfa-pdf__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}

.alfa-pdf__btn,
.alfa-pdf__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 42px;
  padding: 0 16px;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 600;
  letter-spacing: .2px;
  transition: transform .08s ease, box-shadow .2s ease, filter .2s ease;
  will-change: transform;
}

.alfa-pdf__btn {
  background: var(--alfa-primary);
  color: var(--alfa-primary-contrast) !important;
  box-shadow: 0 6px 18px rgba(37,99,235,.22);
}
.alfa-pdf__btn:hover { filter: brightness(1.05); transform: translateY(-1px); }
.alfa-pdf__btn:active { transform: translateY(0); }

.alfa-pdf__link {
  background: var(--alfa-bg);
  color: var(--alfa-fg) !important;
  border: 1px solid var(--alfa-border);
}
.alfa-pdf__link:hover { filter: brightness(1.02); transform: translateY(-1px); }
.alfa-pdf__link:active { transform: translateY(0); }

.alfa-pdf .error { color: #ef4444; }