/* Silver Ivy presentation layer for ReCurr on WooCommerce surfaces. */
.ivy-recurr-billing-note{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  align-items:start;
  gap:13px;
  width:100%;
  max-width:100%;
  margin:0 0 18px;
  padding:15px 16px;
  border:1px solid rgba(100,177,255,.28);
  border-radius:15px;
  background:linear-gradient(145deg,rgba(9,25,45,.96),rgba(12,37,61,.94));
  box-shadow:0 14px 34px rgba(3,12,25,.14);
  box-sizing:border-box;
  color:#eaf4ff;
}
.ivy-recurr-billing-note--cart{margin-top:0}
.ivy-recurr-billing-note__icon{
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border:1px solid rgba(102,218,169,.35);
  border-radius:12px;
  background:rgba(62,190,132,.13);
  color:#a9f1ce;
  font-size:16px;
  font-weight:900;
  line-height:1;
}
.ivy-recurr-billing-note strong{
  display:block;
  margin:1px 0 4px;
  color:#f3f8ff;
  font-size:14px;
  font-weight:800;
  line-height:1.35;
}
.ivy-recurr-billing-note span{
  display:block;
  color:#b6c8df;
  font-size:13px;
  line-height:1.55;
}
.crb-period-label{
  display:inline-block;
  margin-left:5px;
  color:inherit;
  font-size:.62em;
  font-weight:700;
  opacity:.8;
  white-space:nowrap;
}
.crb-annual-savings,.crb-quarterly-savings,.crb-monthly-equiv,.crb-trial-badge{line-height:1.45}
.ivy-fixed-qty{
  display:inline-grid;
  place-items:center;
  min-width:34px;
  min-height:34px;
  padding:4px 10px;
  border:1px solid rgba(135,158,187,.24);
  border-radius:10px;
  background:rgba(13,27,45,.08);
  font-weight:750;
}
@media(max-width:480px){
  .ivy-recurr-billing-note{grid-template-columns:36px minmax(0,1fr);gap:11px;padding:14px}
  .ivy-recurr-billing-note__icon{width:34px;height:34px}
}

/* Website package checkout contract. Scoped to mapped monthly Ivy products only. */
.ivy-website-contract{
  --ivy-contract-line:rgba(123,183,255,.22);
  width:100%;
  max-width:100%;
  margin:0 0 20px;
  padding:clamp(18px,2.2vw,26px);
  border:1px solid var(--ivy-contract-line);
  border-radius:20px;
  background:
    radial-gradient(circle at 96% 0,rgba(103,188,255,.13),transparent 32%),
    linear-gradient(145deg,rgba(15,34,58,.98),rgba(6,18,34,.98));
  box-shadow:0 20px 52px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.04);
  box-sizing:border-box;
  color:#eef6ff;
}
.ivy-website-contract__head{max-width:830px}
.ivy-website-contract__eyebrow{
  display:block;
  margin:0 0 6px;
  color:#8fc6ff;
  font-size:11px;
  font-weight:850;
  line-height:1.3;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.ivy-website-contract h2{
  margin:0 0 7px!important;
  color:#f5f9ff!important;
  font-size:clamp(21px,2.3vw,28px)!important;
  font-weight:850!important;
  line-height:1.16!important;
  letter-spacing:-.025em!important;
}
.ivy-website-contract__head p{
  margin:0!important;
  color:#b7c9df!important;
  font-size:14px!important;
  line-height:1.62!important;
}
.ivy-website-contract__timeline{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin:18px 0 13px;
}
.ivy-website-contract__step{
  position:relative;
  min-width:0;
  padding:14px;
  border:1px solid rgba(137,180,231,.15);
  border-radius:14px;
  background:rgba(5,17,32,.58);
}
.ivy-website-contract__step::before{
  content:"";
  position:absolute;
  top:-1px;
  left:14px;
  width:32px;
  height:2px;
  border-radius:99px;
  background:#6baeff;
  opacity:.72;
}
.ivy-website-contract__step.is-now{
  border-color:rgba(101,220,167,.28);
  background:linear-gradient(145deg,rgba(35,110,82,.18),rgba(5,17,32,.64));
}
.ivy-website-contract__step.is-now::before{background:#65dda8}
.ivy-website-contract__step span,
.ivy-website-contract__step strong,
.ivy-website-contract__step small{display:block}
.ivy-website-contract__step span{
  margin-bottom:7px;
  color:#8fa6c3;
  font-size:10px;
  font-weight:850;
  line-height:1.3;
  letter-spacing:.055em;
  text-transform:uppercase;
}
.ivy-website-contract__step strong{
  color:#f5f9ff;
  font-size:clamp(16px,1.6vw,20px);
  font-weight:850;
  line-height:1.25;
  overflow-wrap:anywhere;
}
.ivy-website-contract__step strong .woocommerce-Price-amount{color:inherit!important}
.ivy-website-contract__step small{
  margin-top:5px;
  color:#9fb3cd!important;
  font-size:12px!important;
  line-height:1.45!important;
}
.ivy-website-contract__promise{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:start;
  gap:9px 12px;
  padding:12px 14px;
  border:1px solid rgba(244,202,114,.22);
  border-radius:13px;
  background:rgba(115,78,24,.12);
}
.ivy-website-contract__promise strong{color:#ffe3a1;font-size:12px;font-weight:850;line-height:1.45;white-space:nowrap}
.ivy-website-contract__promise span{color:#c8d5e7;font-size:12px;line-height:1.55}
.ivy-website-contract__approval{
  margin:12px 1px 0!important;
  color:#91a8c4!important;
  font-size:11.5px!important;
  line-height:1.55!important;
}
body.ivy-commerce-page .woocommerce .shop_table .variation,
body.ivy-commerce-page .woocommerce .wc-item-meta{margin:8px 0 0!important;color:#aabbd1!important;font-size:12px!important;line-height:1.45!important}
body.ivy-commerce-page .woocommerce .shop_table .variation dt,
body.ivy-commerce-page .woocommerce .shop_table .variation dd,
body.ivy-commerce-page .woocommerce .wc-item-meta li{margin:3px 0!important;padding:0!important;color:#aabbd1!important;font-size:12px!important;line-height:1.45!important}
body.ivy-commerce-page .woocommerce .shop_table .variation dt{color:#d9e8fb!important;font-weight:800!important}
.ivy-contract-muted{color:#8fa4bf;font-size:11px;font-weight:650}
body.ivy-commerce-page .ivy-website-first-payment th,
body.ivy-commerce-page .ivy-website-first-payment td{background:rgba(99,163,239,.055)!important}
body.ivy-commerce-page .ivy-website-first-payment td{color:#eaf3ff!important;font-weight:800!important;text-align:right!important}
body.ivy-commerce-page .ivy-website-first-payment small,
.ivy-website-due-label{
  display:block;
  margin-top:4px;
  color:#8fa6c3!important;
  font-size:11px!important;
  font-weight:650!important;
  line-height:1.4!important;
}
.ivy-website-consent{
  margin:0 0 15px!important;
  padding:13px 14px!important;
  border:1px solid rgba(121,177,255,.24)!important;
  border-radius:13px!important;
  background:rgba(94,156,230,.07)!important;
}
body.ivy-commerce-page .ivy-website-consent label{
  display:grid!important;
  grid-template-columns:20px minmax(0,1fr) auto!important;
  align-items:start!important;
  gap:9px!important;
  margin:0!important;
  color:#dbe9fa!important;
  font-size:12px!important;
  font-weight:680!important;
  line-height:1.55!important;
  cursor:pointer;
}
body.ivy-commerce-page .ivy-website-consent input[type="checkbox"]{
  width:18px!important;
  height:18px!important;
  margin:1px 0 0!important;
  accent-color:#72b2ff;
}
.ivy-order-contract{
  margin:22px 0;
  padding:18px 20px;
  border:1px solid rgba(123,183,255,.22);
  border-radius:16px;
  background:linear-gradient(145deg,rgba(15,34,58,.96),rgba(6,18,34,.98));
  color:#eaf3ff;
}
.ivy-order-contract h2{margin:0 0 9px!important;color:#f5f9ff!important;font-size:20px!important}
.ivy-order-contract p{margin:0!important;color:#b7c9df!important;font-size:13px!important;line-height:1.7!important}
.ivy-order-contract strong{color:#eef6ff}
@media(max-width:760px){
  .ivy-website-contract{padding:17px;border-radius:17px}
  .ivy-website-contract__timeline{grid-template-columns:1fr}
  .ivy-website-contract__step{padding:13px}
  .ivy-website-contract__promise{grid-template-columns:1fr;gap:4px}
  .ivy-website-contract__promise strong{white-space:normal}
}
@media(max-width:480px){
  .ivy-website-contract{margin-bottom:16px;padding:15px}
  .ivy-website-contract h2{font-size:21px!important}
  .ivy-website-contract__head p{font-size:13px!important}
  body.ivy-commerce-page .ivy-website-first-payment th,
  body.ivy-commerce-page .ivy-website-first-payment td{display:block!important;width:100%!important;text-align:left!important}
}

/* Website-contract precision notes. These explain tax and cart isolation without
   competing with the primary payment timeline. */
.ivy-website-contract__tax,
.ivy-website-contract__separate {
  margin: 10px 0 0 !important;
  color: #aebfd5 !important;
  font-size: 12px !important;
  font-weight: 560 !important;
  line-height: 1.5 !important;
}

.ivy-website-contract__tax strong,
.ivy-website-contract__separate strong {
  color: #eaf2ff !important;
  font-weight: 760 !important;
}
