/* Fully Managed card + cart (brief 08c): the ONLY styles this design adds.
   Everything else is the live myzone.ai CSS in site/css (unchanged copies).
   Uses live tokens only (--primary, --dark, --grey-*, --co-*). */

/* Pricing card: Annual view on Managed = book a call for the 12-month plan */
.mg-annual { font-size: .85rem; background: var(--co-blue-bg); border: 1px solid var(--co-blue-line); border-radius: var(--radius-lg); padding: .55rem .75rem; margin: 0 0 .75rem; }
.mg-annual a { color: var(--primary); font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }

/* Pricing card: note under the CTA while Canadian prices are being updated */
.mg-cta-note { font-size: .8125rem; color: var(--co-muted); text-align: center; margin-top: .6rem; }

/* Fine print under the Managed grid */
.mg-fine { font-size: .8125rem; color: var(--co-muted); text-align: center; max-width: 880px; margin: 1.5rem auto 0; }

/* "Canadian prices being updated" (pricing page and cart): live .co-banner.warn + a button */
.plans-managed .mg-stale { max-width: 880px; margin: 0 auto 2rem; }
.mg-stale .mg-stale-btn { display: table; margin-top: .7rem; padding: .6rem 1.4rem; }

/* Cart summary additions */
.mg-plan-meta { margin-top: .4rem; }
.mg-bank { margin-top: .9rem; }
.mg-bank .co-linkbtn { font-weight: 700; }

/* Fix: on the live pricing page ".cta-wrap .btn { display:block }" beats ".co-cta", so the
   "Get started" button runs its two lines together ("Get started3 ways to pay…", also on the
   live Developer cards on staging). This restores the stacked layout .co-cta intends. */
.cta-wrap .btn.co-cta { display: flex; flex-direction: column; align-items: center; }
/* On phones the live style.css forces every pricing button to inline-block/auto width with
   !important, which collapses the two-line CTA again. Keep the CTA stacked and full width. */
.pricing-card .cta-wrap .btn.co-cta { display: flex !important; width: 100% !important; }
.pricing-card .cta-wrap .btn.mg-book { display: block !important; width: 100% !important; }

/* Cart tier summary (copy set v1 §1.2): name, "Change tier" link, detail line */
.mg-tier { margin: .25rem 0 .9rem; }
.mg-tier-top { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; }
.mg-tier-name { font-size: 1.05rem; font-weight: 700; color: var(--dark); }
.mg-tier .co-sum-ctl { margin-top: .5rem; }
.mg-tier .mg-plan-meta { margin-top: .35rem; }
/* "plus applicable taxes" sits right under the Due today amount */
.co-due-note.mg-tax-inline { text-align: right; margin-top: .1rem; }
/* Mobile "Due today" strip above Continue (copy set v1 §1.3): phones and tablets only,
   where the order summary is no longer beside the button */
.mg-due-strip { display: none; }
@media (max-width: 1024px) {
  .mg-due-strip { display: block; margin: 0 0 .6rem; padding: .6rem .75rem; background: var(--co-blue-bg, #eef2ff); border-radius: var(--radius); font-size: .9375rem; text-align: center; }
}
.mg-tier-top .co-linkbtn { white-space: nowrap; flex-shrink: 0; }