/* Popup z czytaniami liturgicznymi — wspolny dla strony glownej i kalendarza. */

/* Ponomar — krój cerkiewnosłowiański (Ponomar Project, licencja SIL OFL).
   Ten sam, którego używa cerkiew.pl; trzymamy go u siebie, bez obcego CDN. */
@font-face{
  font-family:'Ponomar';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('/fonts/Ponomar-Regular.woff2') format('woff2');
}

#czytModal{ position:fixed; inset:0; z-index:120; display:none; align-items:center; justify-content:center;
  padding:20px; background:var(--lightbox-bg, rgba(22,25,20,.94)); backdrop-filter:blur(4px); }
#czytModal.open{ display:flex; }
.czyt-card{ position:relative; width:100%; max-width:720px; max-height:calc(100vh - 40px);
  display:flex; flex-direction:column; min-height:0;
  background:var(--panel, #2b2f36); color:var(--ink, #f3f1eb); border:1px solid var(--line, rgba(127,171,107,.32));
  border-radius:18px; overflow:hidden; box-shadow:0 24px 60px rgba(0,0,0,.4); }
.czyt-head{ flex:0 0 auto; padding:20px 54px 14px 22px; border-bottom:1px solid var(--line, rgba(127,171,107,.32)); }
.czyt-kicker{ font-size:11px; text-transform:uppercase; letter-spacing:1.5px; font-weight:800; color:var(--green, #7fab6b); }
.czyt-head h3{ margin:6px 0 0; font-family:Georgia,"Times New Roman",serif; font-size:20px; line-height:1.25; }
.czyt-close{ position:absolute; top:12px; right:12px; width:34px; height:34px; display:flex; align-items:center; justify-content:center;
  font-size:23px; line-height:1; border:1px solid var(--line, rgba(127,171,107,.32)); border-radius:9px;
  background:none; color:var(--ink, #f3f1eb); cursor:pointer; }
.czyt-close:hover{ background:rgba(0,0,0,.25); }
.czyt-langs{ display:flex; gap:6px; margin-top:12px; flex-wrap:wrap; }
.czyt-lang{ border:1px solid var(--line, rgba(127,171,107,.32)); background:none; color:var(--muted, #b7c2af);
  font:inherit; font-size:12.5px; font-weight:700; padding:6px 11px; border-radius:8px; cursor:pointer; transition:all .15s; }
.czyt-lang:hover{ color:var(--green-deep, #ddead4); }
.czyt-lang.on{ background:var(--action, #385a2c); border-color:var(--action, #385a2c); color:#fff; }

/* Przewijanie: element w kolumnie flex musi miec min-height:0, inaczej nie
   kurczy sie i pasek przewijania w ogole sie nie pojawia. overscroll-behavior
   trzyma przewijanie w oknie, zeby nie ciagnelo strony pod spodem. */
.czyt-body{ flex:1 1 auto; min-height:0; padding:18px 22px 26px; overflow-y:auto; overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin; scrollbar-color:var(--green, #7fab6b) transparent; }
.czyt-body::-webkit-scrollbar{ width:10px; }
.czyt-body::-webkit-scrollbar-track{ background:transparent; }
.czyt-body::-webkit-scrollbar-thumb{ background:color-mix(in srgb, var(--green, #7fab6b) 55%, transparent);
  border-radius:99px; border:3px solid transparent; background-clip:content-box; }
.czyt-body::-webkit-scrollbar-thumb:hover{ background:var(--green, #7fab6b); background-clip:content-box; }

.czyt-section + .czyt-section{ margin-top:26px; padding-top:20px; border-top:1px solid var(--line, rgba(127,171,107,.32)); }
.czyt-cat{ font-size:12px; text-transform:uppercase; letter-spacing:1.2px; font-weight:800; color:var(--green, #7fab6b); }
.czyt-ref{ font-family:Georgia,"Times New Roman",serif; font-size:18px; margin:4px 0 14px; }
.czyt-verse{ margin:0 0 11px; line-height:1.75; font-size:15.5px; color:var(--soft, #ddead4); }
.czyt-verse .n{ color:var(--green, #7fab6b); font-size:11px; font-weight:800; vertical-align:super; line-height:0; margin-right:5px; }
/* Tekst cerkiewnosłowiański — Ponomar, wydzielony delikatnym tłem jak na cerkiew.pl */
.czyt-verse.cs{ font-family:'Ponomar', Georgia, serif; font-size:17px; line-height:1.95;
  color:var(--muted, #b7c2af); background:rgba(127,171,107,.09); border-radius:6px; padding:7px 11px; }
.czyt-note{ margin-top:22px; padding-top:14px; border-top:1px solid var(--line, rgba(127,171,107,.32));
  font-size:12.5px; color:var(--muted, #b7c2af); line-height:1.6; }
.czyt-note a{ color:var(--green, #7fab6b); }
.czyt-state{ padding:26px 4px; text-align:center; color:var(--muted, #b7c2af); font-size:14px; }

/* wyzwalacz w tekscie strony */
.czyt-open{ background:none; border:0; padding:0; font:inherit; color:var(--green-deep, #ddead4);
  text-decoration:underline; text-underline-offset:3px; cursor:pointer; text-align:left; }
.czyt-open:hover{ color:var(--green, #7fab6b); }

@media(max-width:560px){
  #czytModal{ padding:0; }
  .czyt-card{ max-width:none; height:100%; max-height:100%; border-radius:0; border:0; }
  .czyt-head{ padding:16px 50px 12px 16px; }
  .czyt-body{ padding:16px 16px 30px; }
}

/* werset bez tlumaczenia — pokazujemy polski, delikatnie oznaczony */
.czyt-verse.fallback{ opacity:.85; }
.czyt-missing{ margin:0 0 14px; padding:9px 12px; border-radius:8px; font-size:13px; line-height:1.5;
  color:var(--muted, #b7c2af); background:rgba(127,171,107,.10); border:1px dashed var(--line, rgba(127,171,107,.32)); }