/* flaskapp/static/css/pricing.css */

/* Requested palette */
:root{
  --afd-muted: #6C6F7F;
  --afd-border: #DBDBDB;
  --afd-accent: #986C6A;
  --afd-bg: #FCFCFC;
  --afd-ink: #02111B;
}

/* Theme-aware fallbacks (keeps it looking correct in dark/light BS themes) */
:root{
  --afd-bg-theme: var(--bs-body-bg, var(--afd-bg));
  --afd-ink-theme: var(--bs-body-color, var(--afd-ink));
  --afd-border-theme: var(--bs-border-color, var(--afd-border));
}

/* Plan cards */
.plan-card{
  border-radius: 1.25rem;
  transition: transform 140ms ease, box-shadow 140ms ease;
}
.plan-card:hover{ transform: translateY(-2px); }
.plan-card.is-popular{
  border: 2px solid var(--afd-accent) !important;
}

/* Keep the CTA blocks aligned at the bottom */
.plan-form{ margin-top: auto; }

.plan-price,
.plan-total{ font-variant-numeric: tabular-nums; }

/* Features list */
.plan-features{ padding-left: 1.1rem; }
.plan-features li{ margin-bottom: .35rem; }
.plan-features li:last-child{ margin-bottom: 0; }

/* Most popular badge (palette) */
.badge-popular{
  background: var(--afd-accent);
  color: var(--afd-bg);
  border: 1px solid var(--afd-accent);
  border-radius: 999px;
  padding: .35rem .6rem;
  font-size: .70rem;
  letter-spacing: .04em;
  white-space: nowrap;
}

/* Compact seat stepper (replaces native number spinners + avoids bulky controls) */
.seat-stepper{
  display: inline-flex;
  align-items: stretch;
  border: 1px solid var(--afd-border-theme);
  background: var(--afd-bg-theme);
  border-radius: .65rem;
  overflow: hidden;
  height: 34px;
}
.seat-step-btn{
  width: 34px;
  border: 0;
  background: transparent;
  color: var(--afd-ink-theme);
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  user-select: none;
}
.seat-step-btn:hover{ background: rgba(2, 17, 27, 0.04); }
.seat-step-btn:active{ background: rgba(2, 17, 27, 0.08); }

.seat-step-input{
  width: 46px;
  border: 0;
  padding: 0;
  text-align: center;
  background: transparent;
  color: var(--afd-ink-theme);
  font-variant-numeric: tabular-nums;
}
.seat-step-input:focus{ outline: none; }
.seat-stepper:focus-within{
  outline: 2px solid rgba(152, 108, 106, 0.45);
  outline-offset: 2px;
}

/* Remove browser number spinners (reduces "redundant" selector UI) */
.qty-input::-webkit-outer-spin-button,
.qty-input::-webkit-inner-spin-button{
  -webkit-appearance: none;
  margin: 0;
}
.qty-input[type="number"]{ -moz-appearance: textfield; }

/* Compare table */
.pricing-compare th,
.pricing-compare td{ vertical-align: middle; }
.pricing-compare .plan-col{ min-width: 210px; }
.pricing-compare .feature-col{ min-width: 220px; }
.pricing-compare .sticky-col{
  position: sticky;
  left: 0;
  background: var(--bs-body-bg);
  z-index: 2;
}
.pricing-compare thead th.sticky-col{ z-index: 3; }
.pricing-compare .yes{ font-weight: 600; }

/* Collapsible compare */
details.pricing-details > summary{
  cursor: pointer;
  list-style: none;
}
details.pricing-details > summary::-webkit-details-marker{ display: none; }
.details-summary{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
}