/* Readmio bannery (inc/readmio.php): pozice úvod, pohádka, výpis, lišta dole, popup.
   Barvy z proměnných šablony (assets/pz.css), takže sedí ve dne i v noci; zaoblení karet --r. */

.pz-rm { margin: 0 auto; max-width: 100%; text-align: center; }
.pz-rm iframe { display: block; width: 100%; border: 0; background: transparent; }

/* pružné kreativy (holčička, čtení/poslech, kategorie) vyplní šířku, poměr drží box */
.pz-rm--pruzny { position: relative; width: 100%; max-width: 420px; aspect-ratio: var(--pz-rm-pomer, 1 / 1);
  overflow: hidden; border-radius: var(--r, 18px); }
.pz-rm--pruzny iframe { position: absolute; inset: 0; height: 100%; }

/* pevné kreativy doškáluje readmio.js (transform: scale) */
.pz-rm--pevny { width: 100%; }
.pz-rm__ram { position: relative; width: 100%; overflow: hidden; border-radius: var(--r, 18px); }
.pz-rm--pevny iframe { position: absolute; top: 0; left: 0; transform-origin: top left; }

/* pevná kreativa s pomer_mobil (kategorie-wide): na mobilu pružný box v poměru pomer_mobil, kreativa se přeskládá sama */
@media (max-width: 599px) {
  .pz-rm--mobil-pruzny { max-width: 420px !important; }
  .pz-rm--mobil-pruzny .pz-rm__ram { aspect-ratio: var(--pz-rm-pomer-mobil, 2 / 3) !important; }
  .pz-rm--mobil-pruzny iframe { inset: 0; width: 100%; height: 100%; }
}

/* pozice v obsahu */
.pozice--pohadka { margin: 32px 0; }
.mrizka > .pozice { grid-column: 1 / -1; margin: 8px 0; }   /* ve výpisu přes celou řádku mřížky */

/* noc: bannery jsou světlé, trochu je ztlumit, ať v tmě neoslní */
:root[data-rezim="noc"] .pz-rm iframe { filter: brightness(.88); }
@media (prefers-color-scheme: dark) { :root:not([data-rezim="den"]) .pz-rm iframe { filter: brightness(.88); } }

/* křížek (lišta i popup) */
.pz-rm-zavrit { position: absolute; z-index: 1; display: grid; place-items: center; width: 34px; height: 34px; padding: 0; margin: 0;
  border: 0; border-radius: 50%; background: var(--vino, #7f1b1c); color: var(--na-vine, #fff); font: 700 22px/1 var(--ui, sans-serif);
  cursor: pointer; box-shadow: 0 2px 8px rgba(0, 0, 0, .35); }
.pz-rm-zavrit:hover { background: var(--vino-2, #5e1415); }

/* lišta dole */
.pz-rm-lista { position: fixed; left: 0; right: 0; bottom: 0; z-index: 35; display: flex; justify-content: center; padding: 10px 12px;
  background: var(--bila, #fff); border-top: 1px solid var(--linka, #eee); box-shadow: 0 -4px 18px rgba(0, 0, 0, .14); }
.pz-rm-lista .pz-rm-slot { width: 100%; max-width: 480px; }   /* obal kreativ je položka flexu – bez šířky se smrskl na 0 a zbyl jen křížek */
.pz-rm-lista .pz-rm { width: 100%; max-width: 480px !important; }
.pz-rm-lista .pz-rm-zavrit { top: -16px; right: 10px; width: 30px; height: 30px; font-size: 19px; }
.pz-rm-s-listou .nahoru { bottom: calc(var(--pz-rm-lista, 120px) + 16px); }   /* šipka nahoru nad lištou, ne pod ní */
.pz-rm-s-listou body { padding-bottom: var(--pz-rm-lista, 120px); }            /* lišta nezakryje patičku */

/* popup: box drží poměr kreativy a vejde se na výšku i šířku okna; banner ho vyplní */
.pz-rm-popup { position: fixed; inset: 0; z-index: 60; display: flex; align-items: center; justify-content: center; padding: 20px;
  background: rgba(0, 0, 0, .72); }
.pz-rm-popup__in { position: relative; aspect-ratio: var(--pz-rm-pomer, 1 / 2);
  width: min(var(--pz-rm-max, 300px), calc(100vw - 40px), calc((100vh - 56px) * var(--pz-rm-pomer, 1 / 2))); }
@supports (height: 1svh) {
  .pz-rm-popup__in { width: min(var(--pz-rm-max, 300px), calc(100vw - 40px), calc((100svh - 56px) * var(--pz-rm-pomer, 1 / 2))); }
}
@media (max-width: 600px) {   /* mobil: vyplnit displej jako celostránková reklama */
  .pz-rm-popup__in { width: min(calc(100vw - 40px), calc((100svh - 56px) * var(--pz-rm-pomer, 1 / 2))); }
}
.pz-rm-popup__in .pz-rm { width: 100%; height: 100%; max-width: none !important; }
.pz-rm-popup__in .pz-rm--pruzny { aspect-ratio: auto; }
.pz-rm-popup .pz-rm-zavrit { top: -17px; right: -10px; background: var(--bila, #fff); color: var(--text, #222); }
.pz-rm-popup .pz-rm-zavrit:hover { background: var(--krem, #fdf5ea); }

.pz-rm-lista[hidden], .pz-rm-popup[hidden] { display: none; }

/* bannery jsou skryté, dokud readmio.js nevybere kreativu; při losu „AdSense“ zmizí i obal pozice */
.pz-rm[hidden] { display: none !important; }
html.pz-sys-adsense .pozice:has(.pz-rm-slot) { display: none !important; }