/* Vendas e inscrições: page-only styles, every selector under .p-vendas */
.p-vendas .vd-cover { position: relative; height: 150px; padding: 20px 24px; color: #fff; display: flex; flex-direction: column; justify-content: flex-end;
  background:
    radial-gradient(40% 70% at 22% 0%, rgba(255,236,190,.55), transparent 70%),
    radial-gradient(30% 60% at 70% 10%, rgba(160,220,230,.35), transparent 70%),
    radial-gradient(120% 40% at 50% 110%, rgba(4,20,26,.9), transparent 70%),
    linear-gradient(160deg, #0F6474 0%, #0B4F5C 45%, #062F38 100%); }
.p-vendas .vd-cover::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 46px; background: radial-gradient(9px 11px at 10px 46px, rgba(2,14,18,.9) 98%, transparent) 0 0 / 22px 46px repeat-x; opacity: .7; }
.p-vendas .vd-cover > * { position: relative; }
.p-vendas .vd-org { font: 400 11px/16px var(--f-mono); letter-spacing: .08em; text-transform: uppercase; opacity: .85; }
.p-vendas .vd-title { font: 600 28px/32px var(--f-display); letter-spacing: -.015em; margin-top: 4px; }
.p-vendas .vd-when { font: 400 13px/18px var(--f-sans); opacity: .9; margin-top: 2px; }
.p-vendas .vd-body { padding: 20px 24px 24px; display: grid; gap: 12px; }
.p-vendas .vd-tt { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; border: 1px solid var(--site-line); border-radius: 10px; padding: 12px 14px; font: 600 14px/20px var(--f-sans); }
.p-vendas .vd-tt small { display: block; font: 400 12px/16px var(--f-sans); color: var(--site-ink-3); margin-top: 2px; }
.p-vendas .vd-tt.on { border: 1.5px solid var(--org-1); background: #F3F8F9; }
.p-vendas .vd-step { display: inline-flex; align-items: center; border: 1px solid var(--site-line-strong); border-radius: 8px; height: 32px; font: 500 14px/20px var(--f-sans); background: #fff; }
.p-vendas .vd-step span { width: 30px; text-align: center; color: var(--site-ink-3); }
.p-vendas .vd-step b { width: 26px; text-align: center; }
.p-vendas .vd-price { font: 500 14px/20px var(--f-sans); font-variant-numeric: tabular-nums; }
.p-vendas .vd-order { right: 28px; bottom: 56px; width: 260px; }
.p-vendas .vd-order-h { padding: 14px 16px 10px; font: 600 14px/20px var(--f-sans); display: flex; justify-content: space-between; }
.p-vendas .vd-order-r { display: flex; justify-content: space-between; gap: 8px; padding: 8px 16px; border-top: 1px solid var(--site-line); font: 400 13px/18px var(--f-sans); color: var(--site-ink-2); }
.p-vendas .vd-order-r b { color: var(--site-ink); font-weight: 500; }
.p-vendas .vd-order-t { display: flex; justify-content: space-between; padding: 12px 16px; border-top: 1px solid var(--site-line); font: 600 15px/20px var(--f-sans); font-variant-numeric: tabular-nums; }
.p-vendas .vd-order .pp-btn { margin: 0 16px 16px; width: calc(100% - 32px); height: 40px; background: var(--org-1); }

/* three styles */
.p-vendas .vd-styles .vd-pg { display: none; }
.p-vendas .vd-styles[data-state="palco"] .vd-pg-palco,
.p-vendas .vd-styles[data-state="cartaz"] .vd-pg-cartaz,
.p-vendas .vd-styles[data-state="atmosfera"] .vd-pg-atmosfera { display: block; animation: vd-in .3s var(--ease); }
@keyframes vd-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.p-vendas .vd-pg-palco .vd-cover { background:
    radial-gradient(40% 70% at 78% 0%, rgba(255,230,200,.5), transparent 70%),
    radial-gradient(120% 40% at 50% 110%, rgba(10,14,40,.9), transparent 70%),
    linear-gradient(160deg, #3A55B5 0%, #1F3B8C 50%, #0F1F55 100%); height: 170px; }
.p-vendas .vd-cartaz { background: #6B2A3A; color: #F6ECE7; padding: 28px 28px 24px; }
.p-vendas .vd-cartaz .vd-org { opacity: .8; }
.p-vendas .vd-cartaz-t { font: 600 54px/52px var(--f-display); letter-spacing: -.03em; margin: 14px 0 18px; }
.p-vendas .vd-cartaz-m { display: flex; gap: 18px; font: 400 12px/16px var(--f-mono); letter-spacing: .06em; text-transform: uppercase; border-top: 1px solid rgba(246,236,231,.3); padding-top: 12px; }
.p-vendas .vd-paper { background: #F6ECE7; }
.p-vendas .vd-paper .vd-tt { background: #fff; border-color: #EAD9D2; }
.p-vendas .vd-paper .vd-tt.on { border-color: #6B2A3A; background: #fff; }
.p-vendas .vd-atm { background: radial-gradient(80% 90% at 0% 0%, #2F5D3A 0%, transparent 60%), radial-gradient(70% 80% at 100% 100%, #8DBF97 0%, transparent 60%), #4C7D57; padding: 34px 34px 0; }
.p-vendas .vd-atm-card { background: #fff; border-radius: 14px 14px 0 0; padding: 22px 22px 18px; }
.p-vendas .vd-atm-card .vd-org { color: #2F5D3A; opacity: 1; }
.p-vendas .vd-atm-card .vd-title { color: var(--site-ink); }
.p-vendas .vd-atm-card .vd-when { color: var(--site-ink-2); opacity: 1; margin-bottom: 14px; }
.p-vendas .vd-atm-card .vd-tt.on { border-color: #2F5D3A; background: #F2F7F3; }

/* ticket types screen */
.p-vendas .vd-tbl-h, .p-vendas .vd-tbl-r { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) 100px; gap: 12px; align-items: center; padding: 11px 16px; }
.p-vendas .vd-tbl-h { font: 400 11px/16px var(--f-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--site-ink-3); border-bottom: 1px solid var(--site-line); }
.p-vendas .vd-tbl-r { border-bottom: 1px solid var(--site-line); font: 500 14px/20px var(--f-sans); }
.p-vendas .vd-tbl-r small { display: block; font: 400 12px/16px var(--f-sans); color: var(--site-ink-3); }
.p-vendas .vd-tbl-r.is-sub { padding-left: 34px; font-weight: 400; color: var(--site-ink-2); }
.p-vendas .vd-meter { height: 5px; border-radius: 3px; background: var(--site-line); overflow: hidden; margin-top: 6px; }
.p-vendas .vd-meter i { display: block; height: 100%; background: var(--site-ink); }
.p-vendas .vd-cnt { font: 400 12px/16px var(--f-mono); color: var(--site-ink-2); font-variant-numeric: tabular-nums; }
.p-vendas .vd-coupon { right: 24px; bottom: 44px; width: 250px; padding: 16px; display: grid; gap: 10px; }
.p-vendas .vd-code { font: 400 15px/20px var(--f-mono); letter-spacing: .06em; border: 1px dashed var(--site-line-strong); border-radius: 8px; padding: 8px 10px; display: flex; justify-content: space-between; }

/* form builder */
.p-vendas .vd-fb-r { display: grid; grid-template-columns: 16px minmax(0, 1fr) auto auto; gap: 12px; align-items: center; padding: 11px 16px; border-top: 1px solid var(--site-line); font: 500 14px/20px var(--f-sans); }
.p-vendas .vd-fb-r small { display: block; font: 400 12px/16px var(--f-sans); color: var(--site-ink-3); }
.p-vendas .vd-grip { width: 10px; height: 14px; background-image: radial-gradient(var(--site-control) 1.2px, transparent 1.4px); background-size: 5px 5px; }
.p-vendas .vd-rule { right: 24px; bottom: 40px; width: 290px; padding: 16px; display: grid; gap: 10px; }
.p-vendas .vd-rule-l { display: flex; gap: 10px; align-items: flex-start; font: 400 13px/18px var(--f-sans); color: var(--site-ink-2); }
.p-vendas .vd-rule-l svg { width: 16px; height: 16px; flex: none; fill: none; stroke: var(--site-ink); stroke-width: 1.6; stroke-linecap: round; margin-top: 1px; }

/* checkout */
.p-vendas .vd-co { display: grid; grid-template-columns: minmax(0, 1fr) 210px; }
.p-vendas .vd-co-l { padding: 20px; display: grid; gap: 12px; align-content: start; }
.p-vendas .vd-co-r { background: var(--site-panel); border-left: 1px solid var(--site-line); padding: 20px 18px; display: grid; gap: 10px; align-content: start; font: 400 13px/18px var(--f-sans); color: var(--site-ink-2); }
.p-vendas .vd-co-r b { color: var(--site-ink); font-weight: 600; }
.p-vendas .vd-co-tk { border: 1px solid var(--site-line); border-radius: 10px; padding: 12px; display: grid; gap: 10px; }
.p-vendas .vd-co-tk .pp-mono { text-transform: uppercase; }
.p-vendas .vd-mail { left: 230px; top: 270px; width: 300px; }
.p-vendas .vd-mail-h { padding: 12px 16px; border-bottom: 1px solid var(--site-line); font: 400 12px/16px var(--f-sans); color: var(--site-ink-3); }
.p-vendas .vd-mail-h b { display: block; color: var(--site-ink); font: 600 14px/20px var(--f-sans); }
.p-vendas .vd-mail-b { padding: 14px 16px; display: grid; grid-template-columns: minmax(0, 1fr) 64px; gap: 12px; align-items: center; }
.p-vendas .vd-mail-b .pp-qr { width: 64px; height: 64px; }
.p-vendas .vd-mail-n { font: 600 18px/22px var(--f-display); }

@container site (max-width: 719px) {
  .p-vendas .vd-order { right: 12px; bottom: 30px; width: 220px; }
  .p-vendas .vd-coupon, .p-vendas .vd-rule { right: 12px; bottom: 24px; width: 240px; }
  .p-vendas .vd-mail { left: 70px; top: 230px; width: 270px; }
  .p-vendas .vd-cartaz-t { font-size: 44px; line-height: 44px; }
}