/* Dialog header scenes (Remotion) + college picker */

/* ---------- animated header band ---------- */
.rg__scene { position: relative; margin: -36px -32px 18px; height: 158px; overflow: hidden; border-radius: 28px 28px 0 0; background: #e6f0fd; }
.rg__vid { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; opacity: 0; transition: opacity .45s; }
.rg__vid.is-on { opacity: 1; }
.rg__scene::after { content: ""; position: absolute; inset: auto 0 0 0; height: 36px; background: linear-gradient(transparent, #fff); }
.rg__dialog--ok .rg__scene { display: none; }
.rg__prog { margin-right: 0; }
@media (max-width: 559.98px) { .rg__scene { margin: -30px -20px 16px; height: 128px; border-radius: 28px 28px 0 0; } }
@media (max-height: 760px) { .rg__scene { height: 100px; margin-bottom: 12px; } }

/* success band is now a video: keep it behind the badge and fade it out at the bottom */
.ok__rays { -webkit-mask-image: linear-gradient(#000 68%, transparent); mask-image: linear-gradient(#000 68%, transparent); }
.ok__rays video { width: 100%; height: 100%; object-fit: cover; object-position: 50% 0; }

/* ---------- college picker ---------- */
.rg__cb { position: relative; z-index: 6; }
.rg__cb .rg__input { padding-right: 46px; }
.rg__chev { position: absolute; right: 18px; top: 30px; pointer-events: none; transition: transform .2s; }
.rg__cb:has([aria-expanded="true"]) .rg__chev { transform: rotate(180deg); }
.rg__lb { position: absolute; z-index: 20; left: 0; right: 0; top: calc(100% + 6px); max-height: 276px; overflow-y: auto; margin: 0; padding: 6px; list-style: none; background: #fff; border: 1.5px solid #cfe3fc; border-radius: 18px; box-shadow: 0 24px 40px -18px rgba(10, 52, 140, .45); animation: rgIn .18s var(--rg-out, ease-out) both; --dx: 0px; }
.rg__lb[hidden] { display: none; }
.rg__lb li[role="option"] { display: grid; gap: 1px; padding: 10px 12px; border-radius: 12px; cursor: pointer; }
.rg__lb li b { font-size: 15px; font-weight: 700; line-height: 1.3; color: #0b1440; }
.rg__lb li small { font-size: 12.5px; color: #5a6275; }
.rg__lb li[aria-selected="true"] { background: #eaf3ff; }
.rg__lb-other { margin-top: 4px; border-top: 1px solid #e3edfb; border-radius: 0 0 12px 12px !important; }
.rg__lb-other b { color: #0079fd !important; }
.rg__lb-empty { padding: 12px; font-size: 13.5px; color: #5a6275; }
.rg__swap { display: block; margin-top: 10px; }
.rg__swap[hidden] { display: none; }

/* the list is a popover: it may extend past the dialog edge on desktop, and opens upward on phones (sheet sits at the bottom) */
.rg__dialog--cb { overflow: visible; }
@media (max-width: 559.98px) {
  .rg__dialog--cb { overflow: visible; }
  .rg__lb { top: auto; bottom: calc(100% + 6px); max-height: 232px; }
}

/* UPI intent payment (live mode): QR on desktop, app launcher on phones, waiting state */
.rg__upi { display: grid; justify-items: center; gap: 14px; margin-top: 22px; }
.rg__upi .btn { width: 100%; }
.rg__qr { display: grid; place-items: center; width: 244px; height: 244px; padding: 12px; border: 1.5px solid #dbe8fa; border-radius: 20px; background: #fff; text-align: center; font-size: 13.5px; color: #5a6275; }
.rg__qr img { display: block; width: 220px; height: 220px; border-radius: 8px; }
.rg__wait { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 0; font-size: 14.5px; font-weight: 600; color: #1b1f5e; }
.rg__pulse { width: 10px; height: 10px; border-radius: 50%; background: #0079fd; box-shadow: 0 0 0 0 rgba(0, 121, 253, .5); animation: rgpulse 1.4s ease-out infinite; }
@keyframes rgpulse { to { box-shadow: 0 0 0 12px rgba(0, 121, 253, 0); } }
.rg__spin--dark { display: block; border-color: rgba(0, 121, 253, .25); border-top-color: #0079fd; }
.rg__link--muted { font-weight: 600; color: #5a6275; }
.rg__fine--alt { margin-top: 10px; }
@media (prefers-reduced-motion: reduce) { .rg__pulse { animation: none; } }
