/* Technology of Austin — One Tap Experience Parity
   Single visual contract for the Door 2 phone preview and the real NFC customer page.
   The fake device bezel/status bar remains preview-only; everything inside the screen matches. */

.toa-app-scroll,
.toa-live-shell{
  --toa-exp-accent:var(--accent,var(--toa-business-accent,#20c7ff));
  box-sizing:border-box!important;
  color:#f7fbff!important;
  background:
    radial-gradient(circle at 92% 2%,color-mix(in srgb,var(--toa-exp-accent) 18%,transparent),transparent 28%),
    linear-gradient(180deg,#07111b,#04080d)!important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
}

body.toa-live-business-page{
  margin:0!important;
  min-height:100svh!important;
  background:#04080d!important;
  color:#f7fbff!important;
  overflow-x:hidden!important;
}
body.toa-live-business-page *{box-sizing:border-box!important}
.toa-live-shell{
  width:min(100%,405px)!important;
  min-height:100svh!important;
  margin:0 auto!important;
  padding:18px 16px 42px!important;
  box-shadow:none!important;
}

/* Brand */
.preview-brand,.toa-live-brand{
  display:flex!important;
  gap:12px!important;
  align-items:flex-start!important;
  padding:10px 1px 15px!important;
}
.preview-logo,.toa-live-logo{
  width:58px!important;height:58px!important;flex:0 0 58px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  border-radius:18px!important;
  border:1px solid color-mix(in srgb,var(--toa-exp-accent) 55%,#23485c)!important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--toa-exp-accent) 18%,#0b1822),#07111b)!important;
  color:var(--toa-exp-accent)!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:26px!important;
  overflow:hidden!important;
  box-shadow:none!important;
}
.preview-logo.has-image,.toa-live-logo.has-image{padding:0!important}
.preview-logo img,.toa-live-logo img{width:100%!important;height:100%!important;object-fit:cover!important}
.preview-brand small,.toa-live-brand small,
.preview-review-card small,.toa-live-review>small,
.preview-feature-card small,.toa-live-feature>small,
.preview-wifi-card small,.toa-live-wifi>small,
.preview-info-card small,.toa-live-info>small,.toa-live-about>small,
.preview-social-card small,.toa-live-social>small{
  display:block!important;
  color:var(--toa-exp-accent)!important;
  font-size:7px!important;
  line-height:1.2!important;
  font-weight:900!important;
  letter-spacing:.14em!important;
}
.preview-brand h3,.toa-live-brand h1{
  margin:4px 0!important;
  color:#fff!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:28px!important;
  line-height:1!important;
  letter-spacing:-.04em!important;
  font-weight:400!important;
}
.preview-brand p,.toa-live-brand p{
  margin:0!important;color:#8aa2b4!important;font-size:10px!important;line-height:1.42!important;
}

/* Primary action */
.preview-primary,.toa-live-primary{
  display:flex!important;
  width:100%!important;
  min-height:54px!important;
  margin:2px 0 10px!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 14px!important;
  border:1px solid color-mix(in srgb,var(--toa-exp-accent) 80%,white)!important;
  border-radius:16px!important;
  background:linear-gradient(135deg,color-mix(in srgb,var(--toa-exp-accent) 90%,#0b72ff),#0b72ff)!important;
  color:#fff!important;
  text-decoration:none!important;
  text-align:center!important;
  font-size:11px!important;
  line-height:1.2!important;
  font-weight:900!important;
  box-shadow:0 14px 34px color-mix(in srgb,var(--toa-exp-accent) 18%,transparent)!important;
  appearance:none!important;
  -webkit-appearance:none!important;
}

/* Action grid */
.preview-actions,.toa-live-actions{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:8px!important;
  margin:0!important;
}
.preview-action,.toa-live-action{
  min-height:58px!important;
  padding:0 13px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
  border:1px solid #1e465f!important;
  border-radius:15px!important;
  background:linear-gradient(180deg,#0a1926,#06101a)!important;
  color:#e3f2fb!important;
  text-decoration:none!important;
  font-size:10px!important;
  line-height:1.25!important;
  font-weight:800!important;
  text-align:left!important;
  appearance:none!important;
  -webkit-appearance:none!important;
}
.preview-action i,.toa-live-action i{
  font-style:normal!important;color:var(--toa-exp-accent)!important;font-size:18px!important;font-weight:400!important;
}

/* Shared content cards */
.preview-review-card,.preview-feature-card,.preview-wifi-card,.preview-info-card,.preview-social-card,
.toa-live-card{
  margin-top:10px!important;
  padding:14px!important;
  border:1px solid #1d435c!important;
  border-radius:17px!important;
  background:linear-gradient(180deg,#071521,#050c14)!important;
  box-shadow:none!important;
}
.preview-review-card,.toa-live-review{
  border-color:color-mix(in srgb,var(--toa-exp-accent) 42%,#1d435c)!important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--toa-exp-accent) 8%,#081521),#050c14)!important;
}
.preview-feature-card,.toa-live-feature{
  border-color:color-mix(in srgb,var(--toa-exp-accent) 38%,#1d435c)!important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--toa-exp-accent) 6%,#071521),#050c14)!important;
}
.preview-review-card h4,.preview-feature-card h4,.preview-wifi-card h4,
.toa-live-card h2{
  margin:6px 0 0!important;
  color:#fff!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:21px!important;
  line-height:1.08!important;
  font-weight:400!important;
  letter-spacing:-.025em!important;
}
.preview-stars,.toa-live-stars{
  margin:8px 0 4px!important;
  color:#f4c75f!important;
  font-size:18px!important;
  line-height:1!important;
  letter-spacing:.08em!important;
}
.preview-review-card p,.preview-wifi-card p,.toa-live-card p{
  margin:6px 0 0!important;
  color:#8da5b6!important;
  font-size:9px!important;
  line-height:1.5!important;
}
.preview-info-card p,.toa-live-info p,.toa-live-about p{
  margin:7px 0 0!important;
  color:#cfe2ee!important;
  font-size:9px!important;
  line-height:1.35!important;
}

/* Review + secondary buttons */
.preview-review-card button,.toa-live-review .toa-live-secondary{
  display:flex!important;
  width:100%!important;
  min-height:44px!important;
  margin-top:11px!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 12px!important;
  border:1px solid color-mix(in srgb,var(--toa-exp-accent) 70%,white)!important;
  border-radius:13px!important;
  background:#081b28!important;
  color:#fff!important;
  text-decoration:none!important;
  font-size:9px!important;
  font-weight:900!important;
  box-shadow:none!important;
}

/* Wi-Fi */
.preview-wifi-toggle,.toa-live-wifi .toa-live-secondary{
  display:flex!important;
  width:100%!important;
  min-height:42px!important;
  margin-top:10px!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 12px!important;
  border:1px solid color-mix(in srgb,var(--toa-exp-accent) 58%,#284d63)!important;
  border-radius:12px!important;
  background:rgba(8,27,42,.86)!important;
  color:#f2fbff!important;
  font-size:9px!important;
  font-weight:900!important;
  box-shadow:none!important;
  appearance:none!important;
  -webkit-appearance:none!important;
}
.preview-wifi-secret,.toa-live-wifi-secret{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  margin-top:9px!important;
  padding:10px 0 0!important;
  border-top:1px solid #17374d!important;
}
.preview-wifi-secret[hidden],.toa-live-wifi-secret[hidden]{display:none!important}
.preview-wifi-secret span,.toa-live-wifi-secret span{color:#7692a7!important;font-size:8px!important}
.preview-wifi-secret b,.toa-live-wifi-secret b{color:#fff!important;font-size:10px!important}
.toa-live-copy{
  min-height:30px!important;
  padding:0 9px!important;
  border:1px solid #214b65!important;
  border-radius:9px!important;
  background:#071521!important;
  color:#cfe5f2!important;
  font-size:8px!important;
  font-weight:900!important;
}

/* Info + social */
.toa-live-info a{color:#cfe2ee!important}
.toa-live-text-link{
  display:inline-flex!important;
  margin-top:8px!important;
  color:var(--toa-exp-accent)!important;
  text-decoration:none!important;
  font-size:9px!important;
  font-weight:900!important;
}
.preview-social-card>div,.toa-live-social>div{
  display:flex!important;gap:6px!important;flex-wrap:wrap!important;margin-top:9px!important;
}
.preview-social-card span,.toa-live-social a{
  display:inline-flex!important;
  min-height:28px!important;
  align-items:center!important;
  padding:0 9px!important;
  border:1px solid #214b65!important;
  border-radius:999px!important;
  color:#cfe5f2!important;
  text-decoration:none!important;
  font-size:8px!important;
  font-weight:800!important;
}

/* Powered by */
.preview-powered,.toa-live-powered{
  text-align:center!important;
  padding:20px 4px 6px!important;
  color:#506f83!important;
  font-size:6.5px!important;
  font-weight:900!important;
  letter-spacing:.13em!important;
}
.toa-live-powered span,.toa-live-powered small{
  display:inline!important;
  margin:0!important;
  color:inherit!important;
  font-size:inherit!important;
  font-weight:inherit!important;
  letter-spacing:inherit!important;
}
.toa-live-powered span::after{content:" BY "!important}

/* Interaction quality */
.preview-primary,.preview-action,.preview-review-card button,.preview-wifi-toggle,
.toa-live-primary,.toa-live-action,.toa-live-review .toa-live-secondary,.toa-live-wifi .toa-live-secondary,
.toa-live-social a,.toa-live-text-link,.toa-live-copy{
  transition:transform .18s ease,filter .18s ease,border-color .18s ease,box-shadow .18s ease!important;
}
@media(hover:hover){
  .preview-primary:hover,.preview-action:hover,.preview-review-card button:hover,.preview-wifi-toggle:hover,
  .toa-live-primary:hover,.toa-live-action:hover,.toa-live-review .toa-live-secondary:hover,.toa-live-wifi .toa-live-secondary:hover{
    transform:translateY(-1px)!important;
    filter:brightness(1.07)!important;
    border-color:color-mix(in srgb,var(--toa-exp-accent) 78%,white)!important;
  }
}
.preview-primary:focus-visible,.preview-action:focus-visible,.preview-review-card button:focus-visible,.preview-wifi-toggle:focus-visible,
.toa-live-primary:focus-visible,.toa-live-action:focus-visible,.toa-live-secondary:focus-visible,.toa-live-social a:focus-visible,.toa-live-text-link:focus-visible,.toa-live-copy:focus-visible{
  outline:2px solid #a7efff!important;
  outline-offset:2px!important;
  box-shadow:0 0 0 5px rgba(126,232,255,.10)!important;
}

/* Real customer-page toast */
.toa-live-toast{
  position:fixed!important;left:50%!important;bottom:22px!important;z-index:30!important;
  transform:translate(-50%,20px)!important;opacity:0!important;pointer-events:none!important;
  padding:10px 14px!important;border:1px solid rgba(155,238,255,.34)!important;border-radius:999px!important;
  background:rgba(4,16,29,.94)!important;color:#eafaff!important;font-size:10px!important;font-weight:800!important;
  box-shadow:0 14px 40px rgba(0,0,0,.3)!important;
  transition:opacity .2s ease,transform .2s ease!important;
}
.toa-live-toast.show{opacity:1!important;transform:translate(-50%,0)!important}

@media(max-width:390px){
  .toa-live-shell{padding-left:14px!important;padding-right:14px!important}
  .preview-actions,.toa-live-actions{grid-template-columns:1fr!important}
  .preview-action,.toa-live-action{min-height:56px!important}
}
@media(min-width:700px){
  body.toa-live-business-page{
    padding:28px 0!important;
    background:radial-gradient(circle at 50% 0%,#102338,#04080d 58%)!important;
  }
  .toa-live-shell{
    min-height:calc(100vh - 56px)!important;
    border:1px solid #1b2a34!important;
    border-radius:34px!important;
    overflow:hidden!important;
    box-shadow:0 28px 90px rgba(0,0,0,.42)!important;
  }
}
@media(prefers-reduced-motion:reduce){
  .preview-primary,.preview-action,.preview-review-card button,.preview-wifi-toggle,
  .toa-live-primary,.toa-live-action,.toa-live-secondary,.toa-live-toast{transition:none!important}
}
