/* הודעות קופצות (popups.js): חלון במרכז, מגירה מלמטה, הודעה בפינה ופס צף למעלה.
   הצבע של כל הודעה (rpop-tone-*) נקבע מהטוקנים של "אולפן לילה" — נכון בתמה הכהה ובבהירה.
   אותן מחלקות גם בתצוגה המקדימה בניהול (.is-preview — בתוך המסגרת, בלי מיקום קבוע). */

.rpop {
  --rp: var(--gold); --rp-ink: #15110a; --rp-soft: rgb(var(--gold-rgb) / .16); --rp-line: rgb(var(--gold-rgb) / .5);
  position: fixed; z-index: 95; box-sizing: border-box; margin: 0; padding: 0;
  border: 1px solid var(--rp-line); border-radius: 22px; color: var(--text);
  background: linear-gradient(160deg, var(--rp-soft), transparent 55%), var(--glass-3);
  -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
  box-shadow: 0 24px 60px var(--sh-3), inset 0 1px 0 var(--inset-hi);
  font-size: 15px; line-height: 1.65; overflow: hidden;
  opacity: 0; transition: opacity .28s var(--ease, ease), transform .32s var(--ease, ease);
}
.rpop.in { opacity: 1; transform: none; }
.rpop.out { opacity: 0; }
.rpop-tone-violet { --rp: var(--violet); --rp-ink: #fff; --rp-soft: rgb(var(--violet-rgb) / .2); --rp-line: rgb(var(--violet-rgb) / .55); }
.rpop-tone-teal { --rp: var(--teal); --rp-ink: #062b33; --rp-soft: var(--teal-bg); --rp-line: var(--teal-border); }
.rpop-tone-success { --rp: var(--success); --rp-ink: #062b21; --rp-soft: var(--success-bg); --rp-line: var(--success-border); }
.rpop-tone-danger { --rp: var(--error-solid); --rp-ink: #fff; --rp-soft: var(--error-bg); --rp-line: var(--error-border); }
.rpop-tone-night { --rp: var(--text-strong); --rp-ink: var(--bg); --rp-soft: rgb(var(--fg-rgb) / .06); --rp-line: var(--border-strong); }

.rpop-main { display: flex; gap: 14px; align-items: flex-start; padding: 20px 22px; padding-inline-end: 52px; }
.rpop-mark { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--rp); color: var(--rp-ink); font-size: 18px; font-weight: 900; box-shadow: 0 0 0 6px var(--rp-soft); }
.rpop-copy { min-width: 0; flex: 1; display: grid; gap: 6px; }
.rpop-title { margin: 0; font-family: var(--display); font-weight: 700; font-size: 32px; line-height: 1.05; color: var(--text-strong); overflow-wrap: anywhere; }
.rpop-text { color: var(--text-2); overflow-wrap: anywhere; }
.rpop-text p { margin: 0 0 6px; }
.rpop-text p:last-child { margin-bottom: 0; }
.rpop-text a { color: var(--rp); }
.rpop-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.rpop-tone-violet .rpop-actions .btn.primary, .rpop-tone-teal .rpop-actions .btn.primary, .rpop-tone-success .rpop-actions .btn.primary, .rpop-tone-danger .rpop-actions .btn.primary, .rpop-tone-night .rpop-actions .btn.primary { background: var(--rp); border-color: var(--rp); color: var(--rp-ink); }
.rpop-x { position: absolute; top: 12px; inset-inline-end: 12px; z-index: 2; width: 34px; height: 34px; border: 0; border-radius: 50%; background: rgb(var(--fg-rgb) / .08); color: var(--muted); font-size: 16px; line-height: 1; cursor: pointer; }
.rpop-x:hover { background: rgb(var(--fg-rgb) / .16); color: var(--text-strong); }
.rpop-x:focus-visible, .rpop .btn:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.rpop-img { background: rgb(var(--fg-rgb) / .05); }
.rpop-img img { display: block; width: 100%; max-height: 260px; object-fit: cover; }
.rpop-timer { position: absolute; inset-inline: 0; bottom: 0; height: 3px; background: var(--rp); transform-origin: right; animation: rpop-timer var(--rpop-t) linear forwards; }
.rpop.paused .rpop-timer { animation-play-state: paused; }
@keyframes rpop-timer { from { transform: scaleX(1); } to { transform: scaleX(0); } }

/* חלון במרכז */
dialog.rpop-modal, .rpop-modal { inset: 0; margin: auto; width: min(520px, calc(100% - 32px)); max-height: calc(100dvh - 48px); overflow: auto; transform: translateY(18px) scale(.96); }
dialog.rpop-modal::backdrop, dialog.rpop-sheet::backdrop { background: var(--backdrop); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.rpop-modal .rpop-main { flex-direction: column; align-items: center; text-align: center; padding: 30px 28px 26px; }
.rpop-modal .rpop-mark { width: 56px; height: 56px; font-size: 24px; }
.rpop-modal .rpop-title { font-size: 44px; }
.rpop-modal .rpop-actions { justify-content: center; }
.rpop-modal.has-img .rpop-main { padding-top: 22px; }
.rpop-modal.has-img .rpop-mark { margin-top: -50px; box-shadow: 0 0 0 6px var(--glass-solid); }

/* מגירה מלמטה */
dialog.rpop-sheet, .rpop-sheet { inset: auto 0 0; margin: 0 auto; width: min(720px, 100%); max-width: 100%; max-height: 80dvh; overflow: auto; border-radius: 26px 26px 0 0; border-bottom: 0; padding-bottom: env(safe-area-inset-bottom, 0px); transform: translateY(100%); }
.rpop-sheet::before { content: ""; display: block; width: 44px; height: 5px; margin: 10px auto 0; border-radius: 9px; background: rgb(var(--fg-rgb) / .2); }
.rpop-sheet.has-img .rpop-img { margin-top: 10px; }

/* הודעה בפינה */
.rpop-zone { position: fixed; z-index: 92; inset-inline-start: 16px; bottom: calc(max(var(--dock-height, 0px), env(safe-area-inset-bottom, 0px)) + 16px); display: grid; gap: 10px; width: min(400px, calc(100% - 32px)); pointer-events: none; }
.rpop-toast { position: relative; pointer-events: auto; transform: translateY(16px) scale(.97); }
.rpop-toast .rpop-main { padding: 16px 18px; padding-inline-end: 50px; }
.rpop-toast .rpop-title { font-size: 26px; }
.rpop-toast .rpop-img img { max-height: 150px; }
.rpop-toast .rpop-actions .btn { padding-block: 7px; font-size: 13px; }

/* פס צף למעלה */
.rpop-bar { top: 12px; inset-inline: 0; margin: 0 auto; width: min(980px, calc(100% - 24px)); border-radius: 18px; transform: translateY(-140%); }
.rpop-bar .rpop-main { align-items: center; padding: 10px 16px; padding-inline-end: 52px; }
.rpop-bar .rpop-mark { width: 30px; height: 30px; font-size: 14px; box-shadow: none; }
.rpop-bar .rpop-copy { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; }
.rpop-bar .rpop-title { font-family: inherit; font-size: 15px; font-weight: 800; line-height: 1.4; }
.rpop-bar .rpop-actions { margin: 0; }
.rpop-bar .rpop-actions .btn { padding-block: 6px; font-size: 13px; }
.rpop-bar .rpop-x { top: 50%; margin-top: -17px; }

/* תצוגה מקדימה בניהול: בתוך המסגרת */
.rpop.is-preview { position: relative; inset: auto; margin: 0 auto; opacity: 1; transform: none; transition: none; max-height: none; }
.rpop.is-preview .rpop-timer { animation-iteration-count: infinite; }

@media (max-width: 640px) {
  .rpop-modal .rpop-title { font-size: 36px; }
  .rpop-zone { inset-inline: 12px; width: auto; }
  .rpop-bar { top: 8px; }
  .rpop-bar .rpop-copy { display: grid; }
}
@media (prefers-reduced-motion: reduce) {
  .rpop { transition: none; transform: none; }
  .rpop-timer { animation: none; display: none; }
}
:root[data-lite="1"] .rpop { transition: none; transform: none; }
:root[data-lite="1"] .rpop-timer { animation: none; display: none; }