/* Premium invitation dialog (templates/partials/_premium_popup.php).
   Enamelware tokens only; native <dialog> owns focus/Escape. */

dialog.pm-popup {
  margin: auto; /* the site reset removes the UA centering — restore it */
  border: 2px solid var(--ink-deep);
  background: #fff;
  color: var(--text-primary);
  width: min(460px, calc(100vw - 32px));
  max-height: calc(100dvh - 40px);
  overflow: auto;
  padding: 0;
  box-shadow: 8px 8px 0 var(--ink-deep);
}
dialog.pm-popup::backdrop {
  background: rgba(11, 27, 30, 0.58);
}
.pm-popup-inner { padding: 22px 24px 20px; }
.pm-popup-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.pm-popup-head form { margin: 0; }
.pm-popup-kicker { font-weight: 800; margin: 2px 0 0; display: flex; align-items: center; gap: 8px; }
.pm-popup-dot { width: 11px; height: 11px; border-radius: 50%; background: var(--tomato); box-shadow: 0 0 0 3px var(--tomato-soft); flex: none; }
.pm-popup-close {
  appearance: none; border: 2px solid var(--ink-deep); background: #fff; color: var(--text-primary);
  width: 38px; height: 38px; font-size: 1.35rem; line-height: 1; cursor: pointer; flex: none;
}
.pm-popup-close:hover { background: var(--saffron-soft); }
.pm-popup-close:focus-visible, .pm-popup a:focus-visible, .pm-popup button:focus-visible {
  outline: 3px solid var(--saffron); outline-offset: 2px;
}
dialog.pm-popup h2 {
  font-family: var(--font-display); font-weight: 800; font-stretch: 92%;
  letter-spacing: -0.03em; line-height: 1.05; font-size: clamp(1.7rem, 6vw, 2.2rem);
  margin: 12px 0 10px;
}
.pm-popup-lead { line-height: 1.55; color: var(--text-secondary); margin: 0 0 16px; }
.pm-popup-week { list-style: none; margin: 0 0 16px; padding: 0; border: 1.5px solid var(--ink-deep); background: var(--saffron-soft); }
.pm-popup-week li { display: flex; gap: 12px; align-items: baseline; padding: 8px 12px; border-bottom: 1px solid rgba(11,27,30,.18); font-weight: 600; }
.pm-popup-week li:last-child { border-bottom: 0; }
.pm-popup-week li span { font-size: 0.8rem; font-weight: 800; color: var(--tomato-deep); min-width: 40px; }
.pm-popup-week a { color: var(--text-primary); }
.pm-popup-week-more { color: var(--text-secondary); }
.pm-popup-points { list-style: none; margin: 0 0 18px; padding: 0; display: grid; gap: 7px; }
.pm-popup-points li { padding-left: 24px; position: relative; line-height: 1.45; }
.pm-popup-points li::before { content: "—"; position: absolute; left: 0; color: var(--tomato); font-weight: 800; }
.pm-popup-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.pm-popup-foot { font-size: 0.92rem; color: var(--text-secondary); line-height: 1.5; margin: 14px 0 0; }
.pm-popup-foot a { color: var(--tomato-deep); font-weight: 700; }
.pm-popup-dismiss {
  appearance: none; border: 0; background: none; padding: 0; font: inherit;
  color: var(--text-secondary); text-decoration: underline; cursor: pointer;
}

/* Entry motion: quiet rise, nothing bouncy. Backdrop fades with it. */
@media (prefers-reduced-motion: no-preference) {
  dialog.pm-popup[open] { animation: pm-popup-in 0.34s cubic-bezier(0.22, 1, 0.36, 1) both; }
  dialog.pm-popup[open]::backdrop { animation: pm-popup-fade 0.3s ease-out both; }
  .pm-popup-week li { animation: pm-popup-in 0.4s cubic-bezier(0.22, 1, 0.36, 1) both; animation-delay: calc(var(--pm-i, 0) * 60ms + 90ms); }
  .pm-popup-week li:nth-child(1) { --pm-i: 0; }
  .pm-popup-week li:nth-child(2) { --pm-i: 1; }
  .pm-popup-week li:nth-child(3) { --pm-i: 2; }
  .pm-popup-week li:nth-child(4) { --pm-i: 3; }
}
@keyframes pm-popup-in {
  from { opacity: 0; transform: translateY(16px) scale(0.985); }
  to { opacity: 1; transform: none; }
}
@keyframes pm-popup-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}

@media (max-width: 560px) {
  dialog.pm-popup {
    width: calc(100vw - 20px);
    margin: auto auto 10px;
    box-shadow: 5px 5px 0 var(--ink-deep);
  }
  .pm-popup-inner { padding: 18px 18px 16px; }
  .pm-popup-actions .btn { flex: 1 1 100%; text-align: center; }
}