/*!
 * OnePageCheckout Pro for WooCommerce — pro front-end styles.
 * Loaded after the core checkout stylesheet (handle 'opcw-checkout') as
 * 'opcw-pro' on the takeover checkout (classic + Block Mode) and thank-you
 * pages, only while pro is licensed. Same --opcw-* tokens as the core file;
 * the generic renderers (offer card, perks panel, summary progress) stay in
 * assets/css/checkout.css.
 */

/* ---------- design presets (body class opcw-skin-*, OPCW_Design) ---------- */
body.opcw-skin-minimal .opcw-section__head .opcw-kicker { display: none; }
body.opcw-skin-minimal .opcw-options, body.opcw-skin-minimal #payment ul.wc_payment_methods { box-shadow: none; }
body.opcw-skin-bold .opcw-h2 { font-size: 22px; letter-spacing: -.02em; }
body.opcw-skin-bold .opcw-btn-primary { height: 62px; font-size: 17px; }
body.opcw-skin-classic { --opcw-bg: #fff; }
body.opcw-skin-classic .opcw-summary { background: #fafafa; }

/* ---------- thank-you: progress tracker (opcw_thankyou_after_hero) ---------- */
.opcw-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 30px; }
.opcw-step { border: 1px solid var(--opcw-line); border-radius: var(--opcw-radius-sm); background: var(--opcw-surface);
	padding: 12px 14px; box-shadow: var(--opcw-shadow); }
.opcw-step__bar { display: block; height: 3px; border-radius: 2px; background: var(--opcw-line); margin-bottom: 10px; }
.opcw-step.is-done .opcw-step__bar, .opcw-step.is-now .opcw-step__bar { background: var(--opcw-success); }
.opcw-step__k { display: block; font-family: var(--opcw-font-mono); font-size: 10px; letter-spacing: .1em;
	text-transform: uppercase; color: var(--opcw-faint); min-height: 1.2em; }
.opcw-step__t { display: block; font-size: 13px; font-weight: 600; color: var(--opcw-ink); margin-top: 2px; }
.opcw-step.is-later { opacity: .55; }
@media (max-width: 560px) { .opcw-steps { grid-template-columns: 1fr; } }

/* ---------- thank-you: "what happens next" (opcw_thankyou_after_hero, after the tracker) ----------
   A section like "Order details" (same .opcw-section__head + .opcw-h2), but open rows instead of
   cards: the tracker above and the details grid below are both boxed, so this one breathes. */
.opcw-ty__next-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 24px; }
.opcw-ty__next-item { display: flex; gap: 12px; align-items: flex-start; margin: 0; }
.opcw-ty__next-icon { flex: none; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; color: var(--opcw-accent);
	background: var(--opcw-bg-summary); background: color-mix(in srgb, var(--opcw-accent) 8%, var(--opcw-surface)); }
.opcw-ty__next-icon svg { width: 18px; height: 18px; }
.opcw-ty__next-body { min-width: 0; padding-top: 2px; }
.opcw-ty__next-title { display: block; font-size: 13.5px; font-weight: 600; line-height: 1.35; color: var(--opcw-ink); }
.opcw-ty__next-text { display: block; margin-top: 2px; font-size: 13px; line-height: 1.5; color: var(--opcw-muted); }
@media (max-width: 560px) { .opcw-ty__next-list { grid-template-columns: minmax(0, 1fr); gap: 14px; } }