/**
 * AVYN researcher popup — the reference ResearcherGate design: full-screen
 * ink overlay, centred paper card with the molecule motif, checklist with
 * data-orange dashes, confirm + leave buttons, mono fine print. Also styles
 * the static admin preview (.avyn-gate--preview).
 */

.avyn-gate {
  position: fixed; inset: 0; z-index: 90;
  display: flex; align-items: center; justify-content: center;
  padding: 1rem; background: rgba(18, 22, 24, 0.8);
  animation: avyn-gate-in 200ms ease both;
}
.avyn-gate[hidden] { display: none; }
@keyframes avyn-gate-in { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .avyn-gate { animation: none; } }

.avyn-gate-card {
  position: relative; width: 100%; max-width: 32rem; overflow: hidden;
  border: 1px solid var(--avyn-rule); background: var(--avyn-paper);
  box-shadow: 0 24px 64px rgba(18, 22, 24, 0.35);
}
.avyn-gate-motif {
  position: absolute; left: 0; right: 0; top: 0; height: 8rem; width: 100%;
  color: var(--avyn-brand); pointer-events: none;
}
.avyn-gate-inner { position: relative; padding: 1.75rem 1.5rem; }
@media (min-width: 640px) { .avyn-gate-inner { padding: 2.25rem; } }

.avyn-gate-close {
  position: absolute; top: 0.75rem; right: 0.75rem; z-index: 1;
  display: flex; align-items: center; justify-content: center;
  width: 2.25rem; height: 2.25rem; padding: 0; border: 0; border-radius: 50%;
  background: transparent; color: var(--avyn-slate); cursor: pointer;
  transition: background-color 140ms ease, color 140ms ease;
}
.avyn-gate-close:hover { background: rgba(18, 22, 24, 0.06); color: var(--avyn-ink); }

.avyn-gate-label {
  margin: 0; font-family: var(--avyn-mono); font-size: 0.6875rem; line-height: 1;
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--avyn-slate);
}
.avyn-gate-title {
  margin: 0.5rem 0 0; font-size: 1.5rem; font-weight: 600; line-height: 1.25;
  letter-spacing: -0.022em; color: var(--avyn-ink);
}
.avyn-gate-body { margin: 1rem 0 0; font-size: 0.875rem; line-height: 1.625; color: var(--avyn-graphite); }
.avyn-gate-body strong { color: var(--avyn-ink); font-weight: 600; }
.avyn-gate-body a { color: var(--avyn-brand); text-decoration: underline; text-underline-offset: 3px; }

.avyn-gate-items { list-style: none; margin: 1rem 0 0; padding: 0; font-size: 0.875rem; color: var(--avyn-graphite); }
.avyn-gate-items[hidden] { display: none; }
.avyn-gate-items li { display: flex; gap: 0.625rem; }
.avyn-gate-items li + li { margin-top: 0.5rem; }
.avyn-gate-dash { margin-top: 0.6875rem; height: 1px; width: 0.75rem; flex-shrink: 0; background: var(--avyn-data); }

.avyn-gate-actions { display: flex; flex-direction: column; gap: 0.625rem; margin-top: 1.5rem; }
@media (min-width: 640px) { .avyn-gate-actions { flex-direction: row; } }
.avyn-gate .avyn-gate-actions .avyn-btn { flex: 1; justify-content: center; }
/* Standalone styles so the popup is complete even where the chrome/pages
   button bundles are absent (a boxed page, a stripped template). */
.avyn-gate .avyn-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
  min-height: 44px; padding: 0.6rem 1.25rem; border: 1px solid transparent; border-radius: 0;
  font-size: 0.875rem; font-weight: 600; letter-spacing: 0.01em; line-height: 1.2;
  cursor: pointer; text-decoration: none; box-shadow: none;
  transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease;
}
.avyn-gate .avyn-btn-brand { background: var(--avyn-brand); border-color: var(--avyn-brand); color: var(--avyn-panel); }
.avyn-gate .avyn-btn-brand:hover, .avyn-gate .avyn-btn-brand:focus { background: var(--avyn-brand-deep); border-color: var(--avyn-brand-deep); color: var(--avyn-panel); }
.avyn-gate .avyn-btn-quiet { background: var(--avyn-panel); border-color: var(--avyn-rule); color: var(--avyn-ink); }
.avyn-gate .avyn-btn-quiet:hover, .avyn-gate .avyn-btn-quiet:focus { border-color: var(--avyn-ink); color: var(--avyn-ink); }

.avyn-gate-fine {
  margin: 1rem 0 0; font-family: var(--avyn-mono); font-size: 0.75rem;
  line-height: 1.625; color: var(--avyn-slate);
}

/* ── Admin live preview: the same card, laid out statically ─────────── */
.avyn-gate--preview { position: static; inset: auto; z-index: auto; padding: 2rem 1rem; animation: none; border-radius: 4px; }
.avyn-popup-preview { background: rgba(18, 22, 24, 0.8); border-radius: 4px; }
.avyn-popup-preview .avyn-gate-card { margin: 0 auto; }
.avyn-popup-cols { display: grid; gap: 20px; align-items: start; max-width: 1520px; }
@media (min-width: 1100px) { .avyn-popup-cols { grid-template-columns: minmax(0, 1fr) minmax(420px, 620px); } }
.avyn-pop-card { background: #fff; border: 1px solid #c3c4c7; border-radius: 6px; padding: 18px 20px; margin: 0 0 16px; }
.avyn-pop-card h2 { margin: 0 0 12px; font-size: 14px; color: #124945; }
.avyn-pop-toggle { display: block; margin: 0 0 8px; }
.avyn-pop-unit input { width: 90px; }
.avyn-pop-sticky { position: sticky; top: 48px; }
.avyn-popup-admin .avyn-fields textarea { width: 100%; }