:root{
  --ssw-bg: #f6f7fb;
  --ssw-card: #ffffff;
  --ssw-card2: rgba(0,0,0,0.02);
  --ssw-border: rgba(0,0,0,0.10);
  --ssw-text: rgba(0,0,0,0.88);
  --ssw-muted: rgba(0,0,0,0.60);
  --ssw-shadow: 0 18px 48px rgba(0,0,0,0.12);
  --ssw-primary: #15803d;
  --ssw-primary2: #16a34a;
  --ssw-primary-hover2: #15803d;

  /* Design tokens */
  --ssw-radius: 22px;
  --ssw-radius2: 18px;
  --ssw-radius3: 14px;
  --ssw-accent: rgba(29,78,216,0.14);
  --ssw-accent-border: rgba(29,78,216,0.30);
}

/* Stronger specificity to override theme button styles */
.ssw-root .ssw-btn.ssw-primary {
  border-radius: 999px;
  background: var(--ssw-primary2) !important;
  border-color: var(--ssw-primary2) !important;
  color: #fff !important;
}
.ssw-root .ssw-btn.ssw-primary:hover{
  background: var(--ssw-primary-hover2) !important;
  border-color: var(--ssw-primary-hover2) !important;
}
.ssw-root .ssw-btn{
  color: #111 !important;
}

.ssw-root{
  min-height: 70vh;
  display:flex;
  justify-content:center;
  padding: 28px 14px;
  color: var(--ssw-text);
  background: var(--ssw-bg);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
}

.ssw-root * { box-sizing: border-box; }

.ssw-card{
  width: min(980px, 100%);
  background: var(--ssw-card);
  border: 1px solid var(--ssw-border);
  border-radius: var(--ssw-radius);
  box-shadow: var(--ssw-shadow);
  padding: 26px;
  color: var(--ssw-text);
}

.ssw-top{
  width: min(980px, 100%);
  margin-bottom: 14px;
}

.ssw-badge{
  display:flex;
  align-items:center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(0,0,0,0.08);
  box-shadow: 0 10px 28px rgba(0,0,0,0.08);
}
.ssw-badge-logo{
  width: 48px;
  height: 48px;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  display: grid;
  place-items: center;
  box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}
.ssw-badge-logo img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ssw-actions-3{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: flex-end;
}
.ssw-actions-3 .ssw-btn{
  min-width: 140px;
}

.ssw-badge-title{
  font-weight: 700;
  font-size: 14px;
  line-height: 18px;
}

.ssw-badge-sub{
  color: var(--ssw-muted);
  font-size: 12px;
  line-height: 16px;
}

.ssw-card h2{
  margin: 0 0 10px;
  font-size: 28px;
  letter-spacing: -0.02em;
  line-height: 1.12;
  position: relative;
}

.ssw-card h2::after{
  content: "";
  display:block;
  width: 52px;
  height: 4px;
  border-radius: 999px;
  background: var(--ssw-accent);
  border: 1px solid var(--ssw-accent-border);
  margin-top: 10px;
}

.ssw-card p{
  margin: 0 0 18px;
  color: var(--ssw-muted);
  font-size: 15px;
}

.ssw-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  align-items: stretch;
}

/* Utility: 2-column grid (used for the Start screen) */
.ssw-grid-2{
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 900px){
  .ssw-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 768px){
  /* Phones: make tiles full width so text doesn't wrap vertically */
  .ssw-grid{ grid-template-columns: 1fr; }
  .ssw-card{ padding: 18px; }
  .ssw-card h2{ font-size: 22px; line-height: 1.15; }
  .ssw-tile{ width: 100%; }
}

.ssw-tile{
  text-align:left;
  padding: 14px;
  border-radius: var(--ssw-radius2);
  background: var(--ssw-card2);
  border: 1px solid var(--ssw-border);
  cursor:pointer;
  transition: transform .08s ease, background .12s ease, border-color .12s ease;
  color: var(--ssw-text);
  display:flex;
  flex-direction:column;
  height: 100%;
}

.ssw-tile:hover{ transform: translateY(-1px); }
.ssw-tile.ssw-selected{
  border-color: rgba(43,182,115,0.85);
  background: rgba(43,182,115,0.14);
}

/* Start-screen CTA tiles: centered, more "button-like" */
.ssw-tile-cta{
  text-align:center;
  padding: 16px;
  background: rgba(255,255,255,0.75);
}

.ssw-tile-cta:hover{
  box-shadow: 0 14px 32px rgba(0,0,0,0.10);
}

.ssw-tile-img{
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 12px;
  display:block;
  margin-bottom: 12px;
  border: 1px solid rgba(255,255,255,0.12);
}

.ssw-tile-icon{
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 40px;
  background: rgba(0,0,0,0.20);
  border: 1px solid rgba(255,255,255,0.12);
  margin-bottom: 12px;
}

.ssw-tile-title{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 10px;
  font-weight: 900;
  font-size: 16px;
  line-height: 1.15;
  margin: 0 0 6px;
}

.ssw-tile-title-text{ min-width: 0; }

.ssw-pill{
  display:inline-block;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: var(--ssw-accent);
  border: 1px solid var(--ssw-accent-border);
  color: rgba(0,0,0,0.78);
  flex: 0 0 auto;
}

/* In CTA tiles, stack title + pill nicely */
.ssw-tile-cta .ssw-tile-title{
  justify-content: center;
  flex-direction: column;
  gap: 8px;
  margin-top: 2px;
}

.ssw-tile-body{
  color: var(--ssw-muted);
  font-size: 13px;
  line-height: 1.35;
  min-height: 2.7em; /* keep cards visually even when text wraps */
  flex: 1 1 auto;
}

.ssw-field{
  margin-bottom: 14px;
}
.ssw-field label{
  display:block;
  margin-bottom: 6px;
  font-size: 13px;
  color: var(--ssw-muted);
}

.ssw-field input{
  width: 100%;
  padding: 11px 12px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.85);
  border: 1px solid var(--ssw-border);
  color: var(--ssw-text);
}

.ssw-field input:focus{
  outline: 3px solid rgba(59,130,246,0.25);
  outline-offset: 2px;
}

.ssw-hidden{ display:none !important; }

.ssw-actions{
  display:flex;
  gap: 10px;
  justify-content:flex-end;
  margin-top: 14px;
}

.ssw-btn{
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.06);
  color: var(--ssw-text);
  padding: 10px 14px;
  border-radius: 999px;
  cursor:pointer;
  font-weight: 700;
}

/* Inline helper actions (e.g., copy phone) */
.ssw-btn-inline{
  padding: 7px 12px;
  font-size: 12px;
}

.ssw-phone-helper{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
}

@media (max-width: 520px){
  .ssw-phone-helper{ flex-direction: column; align-items:flex-start; }
}

.ssw-btn:focus{
  outline: 3px solid rgba(59,130,246,0.25);
  outline-offset: 2px;
}

/* Progress bar */
.ssw-progress{
  display:flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  align-items:center;
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 16px;
  border: 1px solid rgba(0,0,0,0.08);
  background: rgba(255,255,255,0.72);
}

.ssw-progress-step{
  display:flex;
  align-items:center;
  gap: 8px;
  color: rgba(0,0,0,0.55);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.ssw-progress-dot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  border: 2px solid rgba(0,0,0,0.18);
  background: rgba(0,0,0,0.02);
}

.ssw-progress-step.is-done{
  color: rgba(0,0,0,0.70);
}
.ssw-progress-step.is-done .ssw-progress-dot{
  background: rgba(16,185,129,0.45);
  border-color: rgba(16,185,129,0.65);
}

.ssw-progress-step.is-active{
  color: rgba(0,0,0,0.88);
}
.ssw-progress-step.is-active .ssw-progress-dot{
  background: rgba(59,130,246,0.35);
  border-color: rgba(59,130,246,0.55);
}

@media (max-width: 520px){
  .ssw-progress-label{ display:none; }
}

.ssw-btn:hover{ background: rgba(255,255,255,0.10); }

.ssw-primary{
  background: var(--ssw-primary2);
  border-color: var(--ssw-primary2);
  color: #fff;
}
.ssw-primary:hover{ background: var(--ssw-primary); }

.ssw-alert{
  border-radius: 12px;
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,0.14);
  margin: 12px 0 0;
  font-size: 13px;
}
.ssw-alert-error{
  background: rgba(179,38,30,0.20);
  border-color: rgba(179,38,30,0.45);
}
.ssw-alert-ok{
  background: rgba(43,182,115,0.14);
  border-color: rgba(43,182,115,0.35);
}

.ssw-alert-info{
  background: rgba(29,78,216,0.10);
  border-color: rgba(29,78,216,0.30);
}

.ssw-h3{
  margin: 18px 0 8px;
  font-size: 16px;
}

.ssw-sub-row{
  display:flex;
  gap: 12px;
  align-items:flex-start;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.04);
  margin-bottom: 10px;
  cursor:pointer;
}
.ssw-sub-row input{ margin-top: 4px; }

.ssw-sub-body{ flex: 1; }
.ssw-sub-top{
  display:flex;
  justify-content:space-between;
  gap: 10px;
  margin-bottom: 4px;
}
.ssw-sub-name{ font-weight: 800; }
.ssw-sub-price{ color: rgba(255,255,255,0.90); font-weight: 800; }

.ssw-sub-desc{ color: var(--ssw-muted); font-size: 13px; }

.ssw-sub-img {
  width: 160px;
  height: 90px;
  object-fit: contain;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.12);
}

/* Subscriptions on phones: move the icon above the copy for better readability */
@media (max-width: 640px){
  #ssw-root .ssw-sub-row{
    flex-direction: column;
    align-items: stretch;
    position: relative;
  }

  /* Place the subscription image on top */
  #ssw-root .ssw-sub-img{
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    order: -1;
    margin: 0 0 10px 0;
    object-fit: contain;
  }

  /* Keep text full width */
  #ssw-root .ssw-sub-body{ width: 100%; }
  #ssw-root .ssw-sub-top{ flex-wrap: wrap; }

  /* Move the radio/checkbox into a fixed spot so layout stays clean */
  #ssw-root .ssw-sub-row > input{
    position: absolute;
    top: 12px;
    left: 12px;
    margin: 0;
    z-index: 2;
    transform: scale(1.05);
    background: rgba(255,255,255,0.95);
    border-radius: 999px;
    padding: 2px;
  }
}

.ssw-sub-selected{
  border-color: rgba(43,182,115,0.75);
  background: rgba(43,182,115,0.12);
}

/* Free offer block (checkbox) */
.ssw-sub-free-wrap {
  width: 100%;
  margin: 14px 0 18px;
  padding: 14px;
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 18px;
  background: rgba(255,255,255,0.04);
}

.ssw-sub-free-wrap.is-checked {
  border-color: rgba(43,182,115,0.75);
  background: rgba(43,182,115,0.10);
}

.ssw-sub-free-wrap .ssw-sub-row {
  margin: 0;
}

.ssw-cc-iframe{
  width: 100%;
  height: 520px;
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 14px;
  background: rgba(0,0,0,0.20);
}

.ssw-cc-framewrap{
  width: 100%;
  border-radius: var(--ssw-radius2, 16px);
  overflow: hidden;
  background: #fff;
}

.ssw-payment-hint{
  margin-top: 10px;
  font-size: 13px;
  color: var(--ssw-muted, #6b7280);
  line-height: 1.35;
}

.ssw-payment-hint a{
  text-decoration: underline;
}

.ssw-payment-probe{
  margin-top: 10px;
  font-size: 13px;
  color: var(--ssw-muted, #6b7280);
  line-height: 1.35;
}

.ssw-payment-fallback{
  margin-top: 10px;
}

.ssw-payment-open-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(21, 60, 120, 0.20);
  background: rgba(255,255,255,0.90);
  cursor: pointer;
  font-weight: 600;
}

.ssw-payment-open-btn:hover{
  background: rgba(245, 248, 255, 1);
}

.ssw-payment-poll{
  margin-top: 10px;
  font-size: 13px;
  color: var(--ssw-muted, #6b7280);
  line-height: 1.35;
}

/* =========================================
   MOBILE: force 1-column layout (badge on top)
   ========================================= */
@media (max-width: 900px){

  /* Force overall wizard container to stack */
  #ssw-root{
    display: block !important;
  }

  /* Badge + card full width */
  #ssw-root .ssw-top,
  #ssw-root .ssw-card{
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 12px 0 !important;
  }

  /* Tiles: 1 column */
  #ssw-root .ssw-card .ssw-grid{
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  #ssw-root .ssw-card .ssw-tile{
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* Make subscription price clearly visible */
#ssw-root .ssw-sub-price,
#ssw-root [class*="price"]{
  color: rgba(0,0,0,0.78) !important;
  font-weight: 700 !important;
}

/* Best value badge */
#ssw-root .ssw-badge-best{
  display: inline-block;
  margin-left: 10px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  background: rgba(16, 185, 129, 0.18); /* soft green */
  border: 1px solid rgba(16, 185, 129, 0.35);
  color: rgba(0,0,0,0.78);
}

/* Optional: highlight the row */
#ssw-root .ssw-sub-best{
  border-color: rgba(16, 185, 129, 0.45) !important;
}

/* Price label */
#ssw-root .ssw-sub-price-label{
  font-size: 12px;
  font-weight: 600;
  opacity: 0.65;
  margin-left: 6px;
}

.ssw-badge-best{
  display:inline-block;
  margin-left:10px;
  padding:4px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  background:#e7f7ee;
  color:#146c2e;
  border:1px solid rgba(0,0,0,0.10);
}

.ssw-sub-best{
  outline:2px solid rgba(20,108,46,0.25);
}

/* allow tiles to be <a> tags */
#ssw-root a.ssw-tile{color:inherit;text-decoration:none;}

/* Final-screen "Learn More" card (single CTA on the Done screen)
   NOTE: keep selectors aligned with markup in signup.js (ssw-learnmore-card + ssw-learnmore-icon, etc.). */
#ssw-root .ssw-learnmore-wrap{
  display:flex;
  justify-content:center;
  margin-top: 14px;
}

#ssw-root .ssw-learnmore-card{
  width: min(460px, 100%);
  display:flex;
  gap: 12px;
  align-items:center;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,0.12);
  background: rgba(255,255,255,0.90);
  box-shadow: 0 8px 22px rgba(0,0,0,0.06);
  cursor:pointer;
  text-align:left;
}

#ssw-root .ssw-learnmore-card:hover{ transform: translateY(-1px); }
#ssw-root .ssw-learnmore-card:active{ transform: translateY(0px); }

#ssw-root .ssw-learnmore-card:focus{
  outline: 3px solid rgba(59,130,246,0.35);
  outline-offset: 3px;
}

/* In case a theme adds default <button> styles */
#ssw-root .ssw-learnmore-card{
  appearance:none;
  -webkit-appearance:none;
  border-radius: 14px;
}

#ssw-root .ssw-learnmore-icon{
  width: 72px;
  height: 72px;
  border-radius: 12px;
  object-fit: contain;
  background: rgba(0,0,0,0.02);
  border: 1px solid rgba(0,0,0,0.08);
  flex: 0 0 auto;
}

#ssw-root .ssw-learnmore-text{ min-width: 0; }

#ssw-root .ssw-learnmore-title{
  font-size: 18px;
  font-weight: 700;
  margin: 0 0 4px 0;
  line-height: 1.15;
}

#ssw-root .ssw-learnmore-body{
  margin: 0;
  font-size: 13px;
  opacity: 0.8;
  line-height: 1.35;
}

@media (max-width: 420px){
  #ssw-root .ssw-learnmore-card{
    width: 100%;
    gap: 10px;
    padding: 12px;
  }
  #ssw-root .ssw-learnmore-icon{ width: 64px; height: 64px; }
  #ssw-root .ssw-learnmore-title{ font-size: 16px; }
}


/* Route schedule step */
#ssw-root .ssw-route-head{display:flex;align-items:center;justify-content:space-between;gap:12px;}
#ssw-root .ssw-route-meta{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0;}
#ssw-root .ssw-meta-k{font-size:12px;letter-spacing:.02em;text-transform:uppercase;opacity:.7;margin-bottom:4px;}
#ssw-root .ssw-meta-v{font-size:14px;}
#ssw-root .ssw-store-card{border:1px solid rgba(0,0,0,.08);border-radius:14px;padding:12px;background:#fff;}
#ssw-root .ssw-store-title{font-size:16px;font-weight:700;margin-top:2px;}
#ssw-root .ssw-store-sub{font-size:13px;font-weight:500;opacity:.75;margin-top:2px;}
#ssw-root .ssw-store-row{display:flex;gap:8px;align-items:flex-start;margin-top:8px;}
#ssw-root .ssw-store-ico{width:18px;opacity:.8;line-height:1.2;}
#ssw-root .ssw-store-val{flex:1;font-size:13px;}
#ssw-root a.ssw-store-link{text-decoration:none;}
#ssw-root a.ssw-store-link:hover{text-decoration:underline;}
#ssw-root .ssw-rating{display:inline-flex;align-items:center;gap:8px;text-decoration:none;}
#ssw-root .ssw-rating-num{font-weight:700;}
#ssw-root .ssw-stars{display:inline-flex;gap:2px;}
#ssw-root .ssw-star{opacity:.25;font-size:14px;line-height:1;}
#ssw-root .ssw-star.is-on{opacity:1;}
#ssw-root .ssw-rating-count{opacity:.7;font-size:13px;}
#ssw-root .ssw-date-pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;}
#ssw-root .ssw-date-pill{border:1px solid rgba(17,24,39,.18);background:#fff;border-radius:999px;padding:8px 12px;font-weight:600;cursor:pointer;}
#ssw-root .ssw-date-pill.is-sel{border-color:rgba(17,24,39,.55);box-shadow:0 1px 0 rgba(17,24,39,.10);}
#ssw-root .ssw-slot-list{display:flex;flex-direction:column;gap:8px;margin-top:8px;}
#ssw-root .ssw-slot-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid rgba(17,24,39,.12);border-radius:12px;background:#fff;cursor:pointer;}
#ssw-root .ssw-slot-row input{transform:translateY(-1px);}
#ssw-root .ssw-muted{opacity:.75;}
@media (max-width: 720px){
  #ssw-root .ssw-route-meta{grid-template-columns:1fr;}
}

/* --------------------------
   New-customer welcome popup (v71)
   -------------------------- */
#ssw-welcome-modal.ssw-modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;z-index:999999;padding:18px;}
#ssw-welcome-modal .ssw-modal{width:min(560px,100%);background:#fff;border-radius:18px;padding:22px 20px 18px;box-shadow:0 20px 60px rgba(0,0,0,.35);position:relative;overflow:hidden;}
#ssw-welcome-modal .ssw-modal-title{margin:0 0 10px 0;font-size:22px;font-weight:800;}
#ssw-welcome-modal .ssw-modal-body{font-size:15px;line-height:1.45;opacity:.92;}
#ssw-welcome-modal .ssw-modal-actions{margin-top:16px;display:flex;justify-content:flex-end;}

/* v155: New-customer confirmation modal */
#ssw-confirm-modal.ssw-modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;z-index:999999;padding:18px;}
#ssw-confirm-modal .ssw-modal{width:min(560px,100%);background:#fff;border-radius:18px;padding:22px 20px 18px;box-shadow:0 20px 60px rgba(0,0,0,.35);position:relative;overflow:hidden;}
#ssw-confirm-modal .ssw-modal-title{margin:0 0 10px 0;font-size:22px;font-weight:800;}
#ssw-confirm-modal .ssw-modal-body{font-size:15px;line-height:1.45;opacity:.92;}
#ssw-confirm-modal .ssw-modal-actions{margin-top:16px;display:flex;justify-content:flex-end;gap:10px;}

/* Subscription success modal (shown after paid subscription payment). */
#ssw-sub-success-modal.ssw-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;z-index:999999;padding:18px;}
#ssw-sub-success-modal .ssw-modal{width:min(560px,100%);background:#fff;border-radius:18px;padding:22px 20px 18px;box-shadow:0 20px 60px rgba(0,0,0,.35);position:relative;overflow:hidden;}
#ssw-welcome-modal .ssw-confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden;}
#ssw-welcome-modal .ssw-confetti-piece{position:absolute;top:-18px;width:10px;height:16px;border-radius:2px;opacity:.95;animation-name:ssw-confetti-fall;animation-timing-function:ease-in;animation-fill-mode:forwards;}
#ssw-welcome-modal .ssw-confetti-c1{background:#ff6b6b;}
#ssw-welcome-modal .ssw-confetti-c2{background:#ffd93d;}
#ssw-welcome-modal .ssw-confetti-c3{background:#6bcBef;}
#ssw-welcome-modal .ssw-confetti-c4{background:#6bcb77;}
@keyframes ssw-confetti-fall{
  0%{transform:translateY(-18px) rotate(var(--ssw-rot,0deg));opacity:1;}
  100%{transform:translateY(520px) rotate(calc(var(--ssw-rot,0deg) + 360deg));opacity:0;}
}


/* Link-styled button for 'Open secure payment form' */
.ssw-linkbtn{
  background: none;
  border: none;
  padding: 0;
  font: inherit;
  color: inherit;
  text-decoration: underline;
  cursor: pointer;
}



/* Primary action button */
.ssw-btn.ssw-btn-primary{
  background: var(--ssw-primary2) !important;
  color: #fff !important;
  border: 1px solid var(--ssw-primary2) !important;
}
.ssw-btn.ssw-btn-primary:hover{
  background: var(--ssw-primary-hover2) !important;
  border-color: var(--ssw-primary-hover2) !important;
}
.ssw-btn.ssw-btn-secondary{
  background: transparent;
  border: 1px solid rgba(0,0,0,0.2);
}

/* Google Places Autocomplete dropdown can be hidden behind modal/card stacking contexts */
.pac-container{
  z-index: 2147483647 !important;
}


/* =========================================
   v152 – Mobile full-bleed breakout (escape theme containers)
          + edge-to-edge + typography + tile icon sizing
   ========================================= */

/* Add a little help for devices with notches (iOS safe areas) */
@supports (padding: max(0px)) {
  @media (max-width: 768px) {
    /* Apply safe-area padding regardless of extra classes */
    #ssw-root{
      padding-left: max(12px, env(safe-area-inset-left));
      padding-right: max(12px, env(safe-area-inset-right));
      padding-top: max(10px, env(safe-area-inset-top));
      padding-bottom: max(12px, env(safe-area-inset-bottom));
    }
  }
}

/* True edge-to-edge on mobile */
@media (max-width: 768px) {

  /*
    Full-bleed breakout:
    Many WP themes wrap content in a narrow container (max-width + side padding).
    This forces SMRT signup to break out and use the full device width.
  */
  #ssw-root{
    width: 100vw !important;
    max-width: 100vw !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
  }

  /* Remove the “centered/narrow” feel (keep safe-area padding if supported) */
  #ssw-root{
    display: block;
  }

  /* Let badge + card fill the phone width */
  #ssw-root .ssw-top,
  #ssw-root .ssw-card{
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Make it feel like an iOS app sheet */
  #ssw-root .ssw-card{
    border-radius: 0;
    border-left: 0;
    border-right: 0;
    box-shadow: none;
    padding: 18px 16px;
  }

  #ssw-root .ssw-top{
    margin: 0;
    padding: 12px 16px 8px;
  }

  /* Responsive headings/subtext (prevents oversized letters on phones) */
  #ssw-root .ssw-card h2{
    font-size: clamp(22px, 5.8vw, 28px);
    line-height: 1.15;
  }

  #ssw-root .ssw-card p{
    font-size: clamp(14px, 4.1vw, 16px);
    line-height: 1.45;
  }

  /* Buttons + inputs a bit denser for mobile */
  #ssw-root .ssw-btn{
    min-width: 0;
    padding: 12px 16px;
    font-size: 15px;
  }

  #ssw-root input,
  #ssw-root select,
  #ssw-root textarea{
    font-size: 15px;
    padding: 12px 14px;
  }

  /* Tiles: reduce padding + optimize icon size */
  #ssw-root .ssw-tiles{
    gap: 12px !important;
  }

  #ssw-root .ssw-tile{
    padding: 16px !important;
    border-radius: 16px;
  }

  /* Make tile images more “icon friendly” on phones (no cropping) */
  #ssw-root .ssw-tile-img{
    aspect-ratio: 4 / 3;
    object-fit: contain;
    background: rgba(0,0,0,0.03);
    border-radius: 12px;
    margin-bottom: 10px;
  }

  #ssw-root .ssw-tile-title{
    font-size: clamp(16px, 4.6vw, 18px);
  }

  /* Reduce extra whitespace under tiles */
  #ssw-root .ssw-tile p,
  #ssw-root .ssw-tile .ssw-muted{
    font-size: 14.5px;
    line-height: 1.35;
  }
}

/* Kiosk letter sizing (enabled via ?mode=kiosk) */
#ssw-root.ssw-kiosk .ssw-card h2{
  font-size: clamp(28px, 3.2vw, 36px);
  line-height: 1.12;
}

#ssw-root.ssw-kiosk .ssw-card p{
  font-size: clamp(16px, 2.1vw, 19px);
}

#ssw-root.ssw-kiosk .ssw-btn{
  font-size: 17px;
  padding: 14px 18px;
}

#ssw-root.ssw-kiosk .ssw-tile-title{
  font-size: 19px;
}