/* The order / free-trial popup (shared). Each template sets the look through these variables in its own style.css:
   --o-bg, --o-ink, --o-mute, --o-line, --o-accent, --o-accent-ink, --o-radius, --o-font, --o-display */
.tv-modal { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 16px; background: rgba(10, 10, 20, .55); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); overflow-y: auto; }
.tv-modal[hidden] { display: none; }
.tv-card { position: relative; width: min(460px, 100%); padding: 30px 28px 24px; border-radius: var(--o-radius, 22px); background: var(--o-bg, #fff); color: var(--o-ink, #111); font-family: var(--o-font, system-ui, sans-serif); box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .55); animation: tvpop .35s cubic-bezier(.2, .9, .3, 1.2); }
@keyframes tvpop { from { transform: translateY(20px) scale(.96); opacity: 0; } }
.tv-x { position: absolute; top: 12px; inset-inline-end: 12px; width: 38px; height: 38px; border: 0; border-radius: 50%; background: var(--o-line, #eee); color: inherit; font-size: 22px; line-height: 1; cursor: pointer; }
.tv-kick { margin: 0; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--o-accent, #e33); }
html[dir="rtl"] .tv-kick { letter-spacing: 0; font-size: 14px; }
.tv-card h3 { margin: 6px 0 2px; font: 700 26px/1.2 var(--o-display, inherit); }
.tv-price { margin: 0 0 18px; color: var(--o-mute, #666); font-weight: 600; }
.tv-card form { display: grid; gap: 12px; }
.tv-card label { display: grid; gap: 5px; font-size: 13px; font-weight: 600; color: var(--o-mute, #666); }
.tv-card input, .tv-card select { width: 100%; height: 48px; padding: 0 14px; border-radius: calc(var(--o-radius, 22px) * .5); border: 1.5px solid var(--o-line, #e5e5e5); background: transparent; color: var(--o-ink, #111); font: 500 16px var(--o-font, system-ui); }
.tv-card input:focus, .tv-card select:focus { outline: 0; border-color: var(--o-accent, #e33); }
.tv-hp { position: absolute !important; width: 1px !important; height: 1px !important; opacity: 0; pointer-events: none; }
.tv-err { margin: 0; min-height: 1.2em; color: #D32F2F; font-size: 14px; font-weight: 600; }
.tv-go { display: inline-flex; align-items: center; justify-content: center; width: 100%; min-height: 52px; border: 0; border-radius: calc(var(--o-radius, 22px) * .6); background: var(--o-accent, #e33); color: var(--o-accent-ink, #fff); font: 700 16px var(--o-font, system-ui); cursor: pointer; text-decoration: none; }
.tv-go:disabled { opacity: .6; }
.tv-fine { margin: 0; font-size: 13px; color: var(--o-mute, #666); text-align: center; }
.tv-done { text-align: center; padding: 10px 0 4px; }
.tv-tick { width: 70px; height: 70px; margin: 0 auto 14px; border-radius: 50%; display: grid; place-items: center; background: var(--o-accent, #e33); color: var(--o-accent-ink, #fff); font-size: 34px; font-weight: 800; }
.tv-done p { color: var(--o-mute, #666); }
.tv-done .tv-go { margin-top: 10px; }
.tv-back { background: var(--o-line, #eee); color: var(--o-ink, #111); }