/* ========= UX y gestos ========= */
.lift-pdf-canvas { touch-action: none; }
.lift-stage { cursor: grab; }
.lift-stage:active { cursor: grabbing; }

/* ===== Paleta por variables ===== */
.lift-pdf-container {
  --lift-accent: #c3a17f;
  --lift-bg: #ffffff;
  --lift-panel: var(--lift-accent);
  --lift-text-on-panel: #ffffff;
  --lift-btn-bg: #ffffff;
  --lift-btn-text: var(--lift-accent);
  --lift-btn-hover: #f1e7de;
  --lift-stage-bg: #fafafa;
  --lift-border: var(--lift-accent);

  color: #222;
  background: var(--lift-bg);
}

/* Caja general */
.lift-pdf-container {
  position: relative;
  border: 1px solid var(--lift-border) !important;
  border-radius: 10px;
  overflow: hidden;
  max-width: 100%;
  margin: 20px auto;
  -webkit-user-select: none;
  user-select: none;
  background: var(--lift-bg);
}

/* Área de visualización */
.lift-stage {
  position: relative;
  z-index: 1;
  overflow: auto;
  touch-action: none; /* pinch + pan personalizados */
  -webkit-overflow-scrolling: touch;
  background: var(--lift-stage-bg);
}

/* Canvas sin límite de ancho para permitir zoom > 100% */
.lift-pdf-canvas {
  display: block;
  /* Permitimos crecer más que el contenedor para zoom > 100% */
  max-width: none;
  /* Deja que JS fije width/height por estilo inline (no !important aquí) */
  background: #fff;
  margin: 0 auto;
}


/* ===== Única barra inferior ===== */
.lift-controls {
  position: relative;
  z-index: 2;
  background-color: var(--lift-panel) !important;
  color: var(--lift-text-on-panel);
  padding: 8px 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 14px;
}

.lift-controls .lift-left,
.lift-controls .lift-right {
  display: flex;
  align-items: center;
  gap: 6px;
}

.lift-controls button {
  pointer-events: auto;
  background: var(--lift-btn-bg);
  color: var(--lift-btn-text);
  border: none;
  border-radius: 6px;
  margin: 0 3px;
  padding: 6px 10px;
  cursor: pointer;
  font-weight: 700;
  line-height: 1;
}

.lift-controls button:hover {
  background: var(--lift-btn-hover);
}

/* Accesibilidad */
.lift-controls button:focus-visible {
  outline: 2px solid #0000;
  box-shadow: 0 0 0 2px rgba(0,0,0,0.15), 0 0 0 4px rgba(195,161,127,0.65);
}

/* Evitar callout iOS */
.lift-pdf-container * { -webkit-touch-callout: none; }

/* ===== Altura base (si NO pasas 'height' ni 'height_*' en el shortcode) ===== */
/* Puedes ajustar estos defaults globales si quieres */
@supports (height: 1svh) {
  .lift-stage { height: 70svh !important; } /* desktop medio por defecto */
}
@supports not (height: 1svh) {
  .lift-stage { height: 70vh !important; }
}

/* Breakpoints + orientación: sirven de base, pero
   si pasas height_m/t/d por shortcode, el CSS inyectado por instancia gana */
@media (max-width: 480px) and (orientation: portrait) {
  @supports (height: 1svh) { .lift-stage { height: 62svh !important; } }
  @supports not (height: 1svh) { .lift-stage { height: 62vh !important; } }
}
@media (max-width: 812px) and (orientation: landscape) {
  @supports (height: 1svh) { .lift-stage { height: 78svh !important; } }
  @supports not (height: 1svh) { .lift-stage { height: 78vh !important; } }
}
@media (min-width: 481px) and (max-width: 768px) and (orientation: portrait) {
  @supports (height: 1svh) { .lift-stage { height: 66svh !important; } }
  @supports not (height: 1svh) { .lift-stage { height: 66vh !important; } }
}
@media (min-width: 481px) and (max-width: 1024px) and (orientation: landscape) {
  @supports (height: 1svh) { .lift-stage { height: 82svh !important; } }
  @supports not (height: 1svh) { .lift-stage { height: 82vh !important; } }
}
@media (min-width: 1201px) {
  @supports (height: 1svh) { .lift-stage { height: 76svh !important; } }
  @supports not (height: 1svh) { .lift-stage { height: 76vh !important; } }
}
