/* ═══════════════════════════════════════════════════════════════
   Pop-ups · lo carga tanto la web publica como la vista previa del
   panel, para que lo que se ve al editar sea lo que ve el visitante.
   ═══════════════════════════════════════════════════════════════ */

.oz-popup { position: fixed; z-index: 9000; color: #0E0E10; }
.oz-popup[hidden] { display: none !important; }

.oz-popup__panel {
  position: relative; background: #fff; border-radius: 14px; overflow: hidden;
  box-shadow: 0 8px 24px rgba(0,0,0,.12), 0 24px 60px rgba(0,0,0,.16);
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
}

.oz-popup__close {
  position: absolute; top: 8px; right: 10px; z-index: 2;
  width: 30px; height: 30px; border: 0; border-radius: 50%; cursor: pointer;
  background: rgba(255,255,255,.88); color: #0E0E10;
  font-size: 22px; line-height: 1; padding: 0;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 1px 3px rgba(0,0,0,.14);
}
.oz-popup__close:hover { background: #fff; }

.oz-popup__media img { display: block; width: 100%; height: auto; }
.oz-popup__media[hidden] { display: none; }

.oz-popup__content { padding: 22px 24px 24px; }
.oz-popup__title   { margin: 0 0 8px; font-size: 20px; line-height: 1.25; font-weight: 700; }
.oz-popup__body    { margin: 0; font-size: 15px; line-height: 1.55; color: #4A4A52; }
.oz-popup__cta {
  display: inline-block; margin-top: 16px; padding: 11px 22px;
  background: #0E0E10; color: #fff; text-decoration: none;
  border-radius: 8px; font-size: 14.5px; font-weight: 600;
}
.oz-popup__cta:hover { opacity: .88; }
.oz-popup__cta[hidden], .oz-popup__title[hidden], .oz-popup__body[hidden] { display: none; }

/* ── Ventana centrada ───────────────────────────────────────── */
.oz-popup--modal {
  inset: 0; display: flex; align-items: center; justify-content: center;
  padding: 20px; background: rgba(14,14,16,.55);
}
.oz-popup--modal .oz-popup__panel { width: 100%; max-width: 420px; }

/* ── Esquina inferior derecha ───────────────────────────────── */
.oz-popup--corner { right: 20px; bottom: 20px; max-width: 340px; }
.oz-popup--corner .oz-popup__panel { width: 100%; }
.oz-popup--corner .oz-popup__content { padding: 18px 20px 20px; }
.oz-popup--corner .oz-popup__title { font-size: 17px; }
.oz-popup--corner .oz-popup__body { font-size: 14px; }

/* ── Barra superior ─────────────────────────────────────────── */
.oz-popup--bar { top: 0; left: 0; right: 0; }
.oz-popup--bar .oz-popup__panel { border-radius: 0; box-shadow: 0 2px 10px rgba(0,0,0,.1); }
.oz-popup--bar .oz-popup__media { display: none; }
.oz-popup--bar .oz-popup__content {
  display: flex; align-items: center; justify-content: center; gap: 18px;
  flex-wrap: wrap; padding: 13px 54px 13px 24px; text-align: center;
}
.oz-popup--bar .oz-popup__title { margin: 0; font-size: 16px; }
.oz-popup--bar .oz-popup__body  { font-size: 14px; }
.oz-popup--bar .oz-popup__cta   { margin-top: 0; padding: 8px 18px; font-size: 14px; }

/* ── Vista previa del panel: suelto dentro de la tarjeta ────── */
.oz-popup--preview { position: static; inset: auto; padding: 0; background: none; display: block; }
.oz-popup--preview .oz-popup__panel { max-width: 100%; margin: 0 auto; }
.oz-popup--preview.oz-popup--corner { right: auto; bottom: auto; max-width: 320px; }
.oz-popup--preview.oz-popup--bar .oz-popup__panel { border-radius: 10px; }
.oz-popup--preview .oz-popup__close { cursor: default; }

@media (max-width: 560px) {
  .oz-popup--corner { left: 16px; right: 16px; bottom: 16px; max-width: none; }
  .oz-popup--bar .oz-popup__content { padding: 12px 48px 12px 16px; gap: 10px; }
}
