/* why: post-verify course card and the pre-verify upsell block in a sent embed */
.mfo-upsell{position:fixed;right:var(--s-16);bottom:var(--s-16);z-index:60;display:grid;gap:var(--s-8);width:min(18rem,calc(100vw - 2*var(--s-16)));box-sizing:border-box;padding:var(--s-16);background:var(--bg);border:1px solid var(--line-strong);border-radius:var(--r-container)}
.mfo-upsell__x{position:absolute;right:var(--s-4);top:var(--s-4);width:32px;height:32px;border:0;background:none;font:400 24px/1 var(--sans);color:var(--ink-2);cursor:pointer}
.mfo-upsell__x:hover{color:var(--ink)}
.mfo-upsell__go,.mfo--embed .mfo__up button{height:44px;padding:0 var(--s-16);border:1px solid transparent;border-radius:var(--r-control);background:var(--accent);color:var(--on-accent);font:500 var(--t-14)/1 var(--sans);cursor:pointer;transition:background-color var(--fast) var(--ease)}
.mfo-upsell__go{margin-top:var(--s-16)}
.mfo-upsell__go:hover,.mfo--embed .mfo__up button:hover{background:var(--accent-hover)}
.mfo-upsell__go:disabled,.mfo--embed .mfo__up button:disabled{cursor:progress;background:var(--accent-hover)}
.mfo-upsell__err{margin:0;color:var(--neg);font-size:var(--t-14)}
.mfo-upsell__done{margin:var(--s-16) var(--s-32) 0 0;font:500 var(--t-14)/1.4 var(--sans);color:var(--ink)}
.mfo-upsell__err[hidden],.mfo--embed .mfo__up[hidden]{display:none}
.mfo--embed .mfo__up{display:grid;gap:var(--s-8);justify-items:start;margin-top:var(--s-12)}
.mfo--embed .mfo__up .mfo__err{margin:0}
@media(max-width:600px){.mfo-upsell{right:var(--s-8);bottom:var(--s-8);width:calc(100vw - 2*var(--s-8))}}
@media(prefers-reduced-motion:reduce){.mfo-upsell__go,.mfo--embed .mfo__up button{transition:none}}
@media(max-width:767px){.mfo-upsell{bottom:calc(var(--s-16) + 52px)}}
