/* Template sections: Pricing variants (template-sections/pricing.html). V1 is the homepage pricing (css/sections/pricing.css).
   Billing toggles and the seat slider are wired by js/library/library.js ([data-ts-billing], [data-ts-range]). */
.ts-price p { color: var(--text-medium); }
.ts-price__amount { display: flex; align-items: baseline; gap: var(--space-2); }
.ts-price__amount b { font-family: var(--font-heading); font-weight: var(--fw-heading); font-size: var(--h2-size); line-height: 1; letter-spacing: var(--h2-ls); color: var(--text-strong); font-variant-numeric: tabular-nums; }
.ts-price__amount span { font-size: var(--body-sm-size); color: var(--text-low); }
.ts-price__label { font-weight: var(--fw-medium); font-size: var(--body-sm-size); color: var(--text-low) !important; }

/* V2 three tiers */
.ts-price__toggle { display: inline-flex; padding: 4px; border-radius: var(--radius-pill); background: var(--base-medium); }
.ts-price__toggle button { display: inline-flex; align-items: center; gap: var(--space-2); height: 36px; padding-inline: var(--space-4); border-radius: var(--radius-pill); font-weight: var(--fw-medium); font-size: var(--body-md-size); color: var(--text-medium); transition: background var(--dur) var(--ease), color var(--dur) var(--ease); }
.ts-price__toggle button[aria-pressed="true"] { background: var(--base-high); color: var(--text-strong); box-shadow: var(--shadow-sm); }
.ts-price__toggle em, .ts-price__switch em { padding: 1px 6px; border-radius: var(--radius-pill); background: var(--mint-100); font-style: normal; font-size: 12px; color: var(--emerald-600); }
.ts-price__tiers { display: grid; gap: var(--space-4); align-items: stretch; }
.ts-price__tier { position: relative; display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-8) var(--space-6); border: 1px solid var(--border-thin); border-radius: var(--radius-xl); background: var(--base-high); }
.ts-price__tier .ts-checks { padding-top: var(--space-5); border-top: 1px solid var(--border-thin); }
.ts-price__desc { min-height: 2lh; }
.ts-price__tier--featured { border-color: transparent; background: var(--ts-surface); box-shadow: var(--shadow-lg); }
.ts-price__badge { position: absolute; top: var(--space-6); right: var(--space-6); padding: 2px 10px; border-radius: var(--radius-pill); background: var(--accent); font-weight: var(--fw-medium); font-size: 12px; color: #fff !important; }
@media (min-width: 1024px) {
  .ts-price__tiers { grid-template-columns: repeat(3, 1fr); align-items: center; }
  .ts-price__tier--featured { padding-block: var(--space-12); }
}

/* V3 two plans */
.ts-price__switch { display: inline-flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); font-weight: var(--fw-medium); font-size: var(--body-md-size); color: var(--text-strong); }
.ts-price__pair { display: grid; gap: var(--space-4); }
.ts-price__plan { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); padding: var(--space-6); border: 1px solid var(--border-thin); border-radius: var(--radius-xl); background: var(--stone-50); }
.ts-price__plan .ts-checks { flex: 1; }
.ts-price__plan-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: var(--space-2); width: 100%; }
.ts-price__plan--accent { background: var(--peach-100); border-color: transparent; }
.ts-price__enterprise { display: grid; gap: var(--space-4); margin-top: var(--space-4); padding: var(--space-6); border: 1px dashed var(--border-strong); border-radius: var(--radius-xl); }
.ts-price__enterprise b { margin-right: var(--space-2); font-weight: var(--fw-medium); color: var(--text-strong); }
.ts-price__enterprise .btn { justify-self: start; }
@media (min-width: 768px) {
  .ts-price__pair { grid-template-columns: 1fr 1fr; }
  .ts-price__plan { padding: var(--space-10); }
  .ts-price__enterprise { grid-template-columns: auto 1fr auto; align-items: center; padding: var(--space-5) var(--space-8); }
}

/* V4 single plan */
.ts-price__single { display: grid; overflow: hidden; border: 1px solid var(--border-thin); border-radius: var(--radius-xl); background: var(--base-high); box-shadow: var(--shadow-md); }
.ts-price__single-copy { display: grid; gap: var(--space-4); padding: var(--space-8) var(--space-6); }
.ts-price__single-copy .ts-price__label { margin-top: var(--space-4); }
.ts-price__cols { grid-template-columns: 1fr; }
.ts-price__single-box { display: grid; justify-items: center; align-content: center; gap: var(--space-3); padding: var(--space-8) var(--space-6); background: var(--stone-100); text-align: center; }
.ts-price__big { font-family: var(--font-heading); font-weight: var(--fw-medium); font-size: 72px; line-height: 1; letter-spacing: -0.04em; color: var(--text-strong) !important; }
.ts-price__single-box .btn { margin-top: var(--space-3); }
@media (min-width: 480px) { .ts-price__cols { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) {
  .ts-price__single { grid-template-columns: 1.5fr 1fr; }
  .ts-price__single-copy { padding: var(--space-16); }
  .ts-price__single-box { padding: var(--space-12); }
}

/* V5 seat slider */
.ts-price__calc { display: grid; gap: var(--space-10); align-items: center; }
.ts-price__calc-copy { display: grid; gap: var(--space-4); }
.ts-price__volume { width: 100%; max-width: 360px; margin-top: var(--space-4); border-collapse: collapse; font-size: var(--para-sm-size); }
.ts-price__volume th { padding-bottom: var(--space-2); font-weight: var(--fw-medium); text-align: left; color: var(--text-low); }
.ts-price__volume td { padding-block: var(--space-3); border-top: 1px solid var(--border-thin); color: var(--text-strong); }
.ts-price__calc-card { display: grid; gap: var(--space-4); padding: var(--space-6); border: 1px solid var(--border-thin); border-radius: var(--radius-xl); background: var(--base-high); box-shadow: var(--shadow-md); }
.ts-price__calc-label { font-weight: var(--fw-medium); color: var(--text-strong); }
.ts-price__calc-label output { display: inline-block; min-width: 2ch; font-family: var(--font-heading); font-size: var(--h5-size); color: var(--accent); }
.ts-price__range { width: 100%; height: 28px; appearance: none; background: transparent; cursor: pointer; }
.ts-price__range::-webkit-slider-runnable-track { height: 6px; border-radius: 99px; background: linear-gradient(90deg, var(--accent) var(--fill, 20%), var(--base-low) 0); }
.ts-price__range::-moz-range-track { height: 6px; border-radius: 99px; background: linear-gradient(90deg, var(--accent) var(--fill, 20%), var(--base-low) 0); }
.ts-price__range::-webkit-slider-thumb { appearance: none; width: 22px; height: 22px; margin-top: -8px; border-radius: 50%; background: var(--base-high); border: 2px solid var(--accent); box-shadow: var(--shadow-md); }
.ts-price__range::-moz-range-thumb { width: 18px; height: 18px; border-radius: 50%; background: var(--base-high); border: 2px solid var(--accent); }
.ts-price__calc-scale { display: flex; justify-content: space-between; margin-top: calc(var(--space-2) * -1); font-size: 12px; color: var(--text-low); }
.ts-price__total { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: var(--space-4); padding: var(--space-5); border-radius: var(--radius-lg); background: var(--stone-100); }
.ts-price__total p { display: grid; }
.ts-price__total b { font-family: var(--font-heading); font-weight: var(--fw-heading); font-size: var(--h3-size); line-height: 1.1; color: var(--text-strong); font-variant-numeric: tabular-nums; }
@media (min-width: 1024px) { .ts-price__calc { grid-template-columns: 1fr 1.1fr; gap: var(--space-20); } .ts-price__calc-card { padding: var(--space-10); } }
