/* ============ Insurance Demo Visualization (.insurance-viz) ============
 * Sister component to .booking-viz — shares CSS variables (--amber,
 * --charcoal, --cream, etc.) defined in styles.css but lives under a
 * fully scoped .insurance-viz / .iv-* namespace so the two demos can
 * sit on the same page without collision.
 *
 * Layout: left column = Aria's verification workspace (3 stacked
 * cards). Right column = stylized PDF benefits summary that fills in
 * live as Aria speaks.
 * ===================================================================== */

.insurance-viz-hint{display:flex;align-items:center;gap:10px;padding:12px 16px;background:linear-gradient(90deg,var(--amber-50) 0%,rgba(255,243,214,0.4) 100%);border:1px solid rgba(212,149,42,0.18);border-radius:10px;font-size:13px;color:var(--charcoal-70);margin:0 0 16px;line-height:1.5}
.insurance-viz-hint svg{flex-shrink:0;color:var(--amber)}
.insurance-viz-hint strong{color:var(--charcoal);font-weight:600}

.insurance-viz{display:grid;grid-template-columns:1fr;gap:20px;margin:24px 0 8px;font-family:'Sora',sans-serif}
@media(min-width:880px){.insurance-viz{grid-template-columns:1.15fr 0.85fr;gap:24px;align-items:start}}
@media(min-width:1100px){.insurance-viz{gap:36px}}
@media(min-width:1320px){.insurance-viz{gap:48px}}
.insurance-viz-col{display:flex;flex-direction:column;gap:16px;min-width:0}
.insurance-viz-col-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.14em;color:var(--charcoal-50);padding:0 4px;display:flex;align-items:center;gap:8px}
.insurance-viz-col-label::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--amber);box-shadow:0 0 0 4px rgba(212,149,42,0.12)}

/* ----- Workspace cards (shared scaffolding) ----- */
.iv-card{background:var(--warm-white);border:1px solid var(--border);border-radius:14px;padding:18px 18px 16px;box-shadow:0 1px 2px rgba(26,26,46,0.03);transition:border-color .4s ease,box-shadow .4s ease;position:relative;overflow:hidden}
.iv-card.is-active{border-color:rgba(212,149,42,0.45);box-shadow:0 4px 20px rgba(212,149,42,0.10)}
.iv-card.is-complete{border-color:rgba(74,124,89,0.32)}
.iv-card-head{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.iv-card-icon{width:30px;height:30px;border-radius:8px;background:var(--amber-50);color:var(--amber);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .4s ease,color .4s ease}
.iv-card.is-complete .iv-card-icon{background:rgba(232,240,232,0.7);color:var(--sage-deep)}
.iv-card-title{font-size:13px;font-weight:600;color:var(--charcoal);letter-spacing:-.005em}
.iv-card-sub{font-size:11px;color:var(--charcoal-50);margin-top:1px;font-weight:500}
.iv-status{margin-top:12px;display:flex;align-items:center;gap:8px;font-size:12px;color:var(--charcoal-70);min-height:18px;line-height:1.4}
.iv-status .iv-spinner{width:12px;height:12px;border-radius:50%;border:1.5px solid rgba(212,149,42,0.25);border-top-color:var(--amber);animation:iv-spin .8s linear infinite;flex-shrink:0}
.iv-status .iv-check{width:14px;height:14px;border-radius:50%;background:var(--sage-deep);color:#fff;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;opacity:0;transform:scale(0.6);transition:opacity .35s ease,transform .35s cubic-bezier(.2,1.2,.4,1)}
.iv-card.is-complete .iv-status .iv-check{opacity:1;transform:scale(1)}
.iv-status-text-idle,.iv-status-text-active,.iv-status-text-done{display:none}
.iv-card .iv-status-text-idle{display:inline}
.iv-card.is-active .iv-status-text-idle,.iv-card.is-complete .iv-status-text-idle{display:none}
.iv-card.is-active .iv-status-text-active{display:inline}
.iv-card.is-complete .iv-status-text-done{display:inline;color:var(--sage-deep);font-weight:500}
.iv-card .iv-spinner{display:none}
.iv-card.is-active .iv-spinner{display:inline-block}
@keyframes iv-spin{to{transform:rotate(360deg)}}

/* ----- Card 1: Member lookup (identity card) ----- */
.iv-idcard{position:relative;background:linear-gradient(135deg,#16162A 0%,#22223A 50%,#1A1A2E 100%);border-radius:12px;padding:16px 16px 14px;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,0.06),0 6px 18px rgba(26,26,46,0.18);overflow:hidden;margin-top:2px}
.iv-idcard::before{content:'';position:absolute;top:-30%;right:-20%;width:200px;height:200px;background:radial-gradient(circle,rgba(212,149,42,0.18) 0%,transparent 60%);pointer-events:none}
.iv-idcard-stripe{position:absolute;top:0;left:0;height:100%;width:5px;background:linear-gradient(180deg,var(--amber) 0%,#B87D1E 100%);opacity:0.85}
.iv-idcard-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;position:relative;z-index:2}
.iv-idcard-brand{font-size:9px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,0.55)}
.iv-idcard-logo{font-family:'Fraunces',serif;font-size:13px;font-weight:500;color:var(--amber-light);letter-spacing:.02em}
.iv-idcard-body{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;position:relative;z-index:2}
.iv-idcard-avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--amber) 0%,#E0A340 50%,#B87D1E 100%);display:flex;align-items:center;justify-content:center;color:#fff;font-family:'Fraunces',serif;font-size:18px;font-weight:500;letter-spacing:.02em;box-shadow:0 0 0 2px rgba(212,149,42,0.25)}
.iv-idcard-fields{min-width:0}
.iv-idcard-name{font-family:'Fraunces',serif;font-size:16px;font-weight:500;color:#fff;letter-spacing:-.005em;line-height:1.15;opacity:0;transform:translateY(4px);transition:opacity .45s ease,transform .45s ease}
.iv-idcard-name.is-shown{opacity:1;transform:translateY(0)}
.iv-idcard-pills{display:flex;flex-wrap:wrap;gap:5px 6px;margin-top:7px}
.iv-idcard-pill{display:inline-flex;align-items:center;gap:5px;padding:3px 8px;border-radius:50px;background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.10);font-size:10px;color:rgba(255,255,255,0.85);font-weight:500;letter-spacing:.01em;font-variant-numeric:tabular-nums;opacity:0;transform:translateY(3px);transition:opacity .45s ease,transform .45s ease}
.iv-idcard-pill.is-shown{opacity:1;transform:translateY(0)}
.iv-idcard-pill .iv-pill-key{color:rgba(255,255,255,0.45);font-weight:600;font-size:9px;text-transform:uppercase;letter-spacing:.08em}
.iv-idcard-pill .iv-pill-val{color:#fff}
.iv-idcard-pill.iv-pill-carrier{background:rgba(212,149,42,0.18);border-color:rgba(212,149,42,0.35)}
.iv-idcard-pill.iv-pill-carrier .iv-pill-val{color:var(--amber-light);font-weight:600}
.iv-idcard-scan{position:absolute;left:0;right:0;height:34%;top:-40%;background:linear-gradient(180deg,transparent 0%,rgba(212,149,42,0.22) 50%,transparent 100%);pointer-events:none;z-index:3;opacity:0}
.iv-card.is-active .iv-idcard-scan{opacity:1;animation:iv-scan 1.6s cubic-bezier(.4,0,.4,1) infinite}
@keyframes iv-scan{0%{top:-40%}100%{top:110%}}

/* ----- Card 2: Eligibility stamp ----- */
.iv-stamp-frame{position:relative;background:linear-gradient(180deg,#FAFAF7 0%,#F2EFE9 100%);border:1px solid var(--border);border-radius:12px;padding:22px 18px 20px;margin-top:2px;overflow:hidden;min-height:96px}
.iv-stamp-frame::before{content:'';position:absolute;top:8px;left:8px;right:8px;bottom:8px;border:1px dashed rgba(26,26,46,0.10);border-radius:8px;pointer-events:none}
.iv-stamp{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-8deg) scale(0.5);opacity:0;font-family:'Fraunces',serif;font-weight:700;font-size:34px;letter-spacing:.06em;color:#7BA486;border:3px solid #7BA486;padding:6px 22px 4px;border-radius:6px;text-transform:uppercase;text-shadow:0 0 0 transparent;transition:opacity .35s ease-out,transform .55s cubic-bezier(.2,1.6,.3,1);z-index:2;line-height:1;background:transparent}
.iv-card.is-complete .iv-stamp{opacity:0.92;transform:translate(-50%,-50%) rotate(-8deg) scale(1)}
.iv-stamp-sub{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.iv-stamp-meta{display:flex;flex-direction:column;gap:2px}
.iv-stamp-meta-key{font-size:9px;text-transform:uppercase;letter-spacing:.12em;color:var(--charcoal-50);font-weight:700}
.iv-stamp-meta-val{font-family:'Fraunces',serif;font-size:14px;color:var(--charcoal);font-weight:500;letter-spacing:-.005em}
.iv-stamp-meta-val.muted{color:var(--charcoal-50);font-weight:500;font-size:12px;font-family:'Sora',sans-serif}
.iv-stamp-active-dot{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:50px;background:rgba(123,164,134,0.14);border:1px solid rgba(123,164,134,0.28);font-size:10px;font-weight:600;color:#5C8870;letter-spacing:.04em;opacity:0;transform:scale(.8);transition:opacity .35s ease .15s,transform .35s ease .15s}
.iv-card.is-complete .iv-stamp-active-dot{opacity:1;transform:scale(1)}
.iv-stamp-active-dot::before{content:'';width:5px;height:5px;border-radius:50%;background:#7BA486;box-shadow:0 0 0 3px rgba(123,164,134,0.18)}

/* ----- Card 3: Benefits dashboard ----- */
.iv-bd{margin-top:2px}
.iv-bd-top{display:grid;grid-template-columns:1.1fr 0.9fr;gap:12px;margin-bottom:14px}
@media(max-width:520px){.iv-bd-top{grid-template-columns:1fr}}
.iv-bd-stat{background:var(--cream);border:1px solid var(--border);border-radius:10px;padding:12px 14px;position:relative;overflow:hidden}
.iv-bd-stat-label{font-size:9px;text-transform:uppercase;letter-spacing:.12em;color:var(--charcoal-50);font-weight:700;margin-bottom:4px}
.iv-bd-stat-num{font-family:'Fraunces',serif;font-size:26px;font-weight:600;color:var(--charcoal);line-height:1;letter-spacing:-.01em;font-variant-numeric:tabular-nums;display:flex;align-items:baseline;gap:1px}
.iv-bd-stat-num .iv-bd-stat-currency{font-size:15px;color:var(--charcoal-70);font-weight:500;margin-right:1px}
.iv-bd-stat-foot{font-size:10.5px;color:var(--charcoal-50);font-weight:500;margin-top:5px;display:flex;justify-content:space-between;gap:6px;letter-spacing:.005em}
.iv-bd-stat-foot strong{color:var(--charcoal-70);font-weight:600}
.iv-bd-progress{height:4px;border-radius:2px;background:rgba(212,149,42,0.10);margin-top:6px;overflow:hidden;position:relative}
.iv-bd-progress-fill{position:absolute;top:0;left:0;bottom:0;width:0;background:linear-gradient(90deg,var(--amber) 0%,#E0A340 100%);border-radius:2px;transition:width .9s cubic-bezier(.4,0,.2,1)}
.iv-bd-spark{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:120%;height:120%;pointer-events:none;opacity:0}
.iv-bd-stat.is-burst .iv-bd-spark{animation:iv-spark .9s ease-out forwards}
@keyframes iv-spark{0%{opacity:0;transform:translate(-50%,-50%) scale(.4)}30%{opacity:.85}100%{opacity:0;transform:translate(-50%,-50%) scale(1.4)}}
.iv-bd-spark span{position:absolute;color:var(--amber);font-size:13px;font-weight:700;text-shadow:0 0 8px rgba(212,149,42,0.6)}
.iv-bd-spark span:nth-child(1){top:8%;left:18%}
.iv-bd-spark span:nth-child(2){top:14%;right:14%}
.iv-bd-spark span:nth-child(3){bottom:10%;left:26%}
.iv-bd-spark span:nth-child(4){bottom:18%;right:18%}
.iv-bd-spark span:nth-child(5){top:42%;left:6%}
.iv-bd-spark span:nth-child(6){top:38%;right:6%}

/* Coverage tiers */
.iv-bd-tiers{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.iv-bd-tier{display:grid;grid-template-columns:88px 1fr 38px;gap:10px;align-items:center}
.iv-bd-tier-label{font-size:11px;color:var(--charcoal-70);font-weight:500;letter-spacing:.005em}
.iv-bd-tier-track{height:8px;border-radius:50px;background:var(--cream);border:1px solid var(--border);overflow:hidden;position:relative}
.iv-bd-tier-fill{position:absolute;top:0;left:0;bottom:0;width:0;border-radius:50px;background:linear-gradient(90deg,var(--amber) 0%,#E0A340 100%);transition:width 1.1s cubic-bezier(.33,1,.4,1)}
.iv-bd-tier[data-tier="basic"] .iv-bd-tier-fill{background:linear-gradient(90deg,#D4952A 0%,#C28525 100%);opacity:0.78}
.iv-bd-tier[data-tier="major"] .iv-bd-tier-fill{background:linear-gradient(90deg,#B87D1E 0%,#9B6818 100%);opacity:0.62}
.iv-bd-tier-pct{font-size:11px;color:var(--charcoal);font-weight:600;text-align:right;font-variant-numeric:tabular-nums}
.iv-bd-tier.is-shown .iv-bd-tier-fill{transition:width 1.1s cubic-bezier(.33,1,.4,1)}

/* Procedure checklist */
.iv-bd-procs{display:flex;flex-direction:column;gap:6px;padding-top:10px;border-top:1px dashed rgba(232,228,222,0.7)}
.iv-bd-procs-title{font-size:9px;text-transform:uppercase;letter-spacing:.12em;color:var(--charcoal-50);font-weight:700;margin-bottom:4px}
.iv-bd-proc{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--charcoal-70);opacity:0;transform:translateX(-4px);transition:opacity .4s ease,transform .4s ease;line-height:1.35}
.iv-bd-proc.is-shown{opacity:1;transform:translateX(0)}
.iv-bd-proc-check{width:14px;height:14px;border-radius:50%;background:#7BA486;color:#fff;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
.iv-bd-proc-check svg{width:8px;height:8px;stroke-width:3.5}
.iv-bd-proc-label{flex:1}
.iv-bd-proc-label strong{color:var(--charcoal);font-weight:600}
.iv-bd-proc-xray{flex-shrink:0;width:18px;height:18px;color:var(--amber);opacity:0;transform:scale(.7);transition:opacity .35s ease .25s,transform .45s cubic-bezier(.2,1.4,.3,1) .25s}
.iv-bd-proc.is-shown .iv-bd-proc-xray{opacity:0.85;transform:scale(1)}
.iv-bd-proc-xray svg{width:100%;height:100%}

/* ----- Right column: stylized PDF benefits summary ----- */
.iv-doc-wrap{position:sticky;top:24px}
@media(max-width:880px){.iv-doc-wrap{position:static}}
.iv-doc{background:#FFFFFF;border:1px solid var(--border);border-radius:12px;padding:24px 22px 20px;box-shadow:0 18px 38px rgba(26,26,46,0.10),0 2px 6px rgba(26,26,46,0.04);position:relative;overflow:hidden;font-family:'Sora',sans-serif}
.iv-doc::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--amber) 0%,#E0A340 60%,var(--amber) 100%)}
.iv-doc::after{content:'';position:absolute;top:48px;right:18px;font-family:'Fraunces',serif;font-size:10px;font-weight:600;letter-spacing:.18em;color:rgba(212,149,42,0.18);text-transform:uppercase;transform:rotate(-4deg);pointer-events:none}
.iv-doc-letterhead{text-align:center;padding-bottom:14px;border-bottom:1px solid var(--border);margin-bottom:14px}
.iv-doc-mark{font-family:'Fraunces',serif;font-size:18px;font-weight:600;color:var(--charcoal);letter-spacing:-.01em}
.iv-doc-mark span{color:var(--amber);font-style:italic}
.iv-doc-tagline{font-size:9px;text-transform:uppercase;letter-spacing:.18em;color:var(--charcoal-50);font-weight:600;margin-top:4px}

.iv-doc-patient{display:flex;align-items:center;gap:12px;padding:10px 12px;background:var(--cream);border-radius:10px;margin-bottom:14px;position:relative}
.iv-doc-patient-avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--amber) 0%,#E0A340 50%,#B87D1E 100%);color:#fff;display:flex;align-items:center;justify-content:center;font-family:'Fraunces',serif;font-size:16px;font-weight:500;flex-shrink:0;box-shadow:0 0 0 2px rgba(212,149,42,0.18)}
.iv-doc-patient-info{flex:1;min-width:0}
.iv-doc-patient-name{font-family:'Fraunces',serif;font-size:15px;color:var(--charcoal);font-weight:500;letter-spacing:-.005em;line-height:1.1}
.iv-doc-patient-id{font-size:10px;color:var(--charcoal-50);font-weight:500;margin-top:2px;letter-spacing:.04em}
.iv-doc-patient-badge{display:inline-flex;align-items:center;gap:5px;padding:4px 9px;border-radius:50px;background:rgba(123,164,134,0.10);border:1px solid rgba(123,164,134,0.25);font-size:10px;color:#5C8870;font-weight:600;letter-spacing:.02em;flex-shrink:0;opacity:0;transform:scale(.85);transition:opacity .4s ease,transform .4s cubic-bezier(.2,1.4,.3,1),box-shadow .4s ease}
.iv-doc-patient-badge.is-shown{opacity:1;transform:scale(1)}
.iv-doc-patient-badge.is-shown.is-glow{animation:iv-badge-glow 1.4s ease-in-out 1}
@keyframes iv-badge-glow{0%,100%{box-shadow:0 0 0 0 rgba(123,164,134,0)}40%{box-shadow:0 0 0 6px rgba(123,164,134,0.18)}}
.iv-doc-patient-badge svg{width:10px;height:10px}

.iv-doc-section{margin-bottom:12px}
.iv-doc-section-title{font-size:9px;text-transform:uppercase;letter-spacing:.12em;color:var(--charcoal-50);font-weight:700;margin-bottom:6px;display:flex;align-items:center;gap:6px}
.iv-doc-section-title::after{content:'';flex:1;height:1px;background:var(--border)}
.iv-doc-row{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:5px 0;border-bottom:1px dashed rgba(232,228,222,0.55);min-height:24px}
.iv-doc-row:last-child{border-bottom:none}
.iv-doc-key{font-size:10.5px;color:var(--charcoal-50);font-weight:500;flex-shrink:0;letter-spacing:.005em}
.iv-doc-val{font-size:11.5px;color:var(--charcoal);font-weight:500;text-align:right;font-family:'Sora',sans-serif;font-variant-numeric:tabular-nums;opacity:0;transform:translateY(3px);transition:opacity .4s ease,transform .4s ease}
.iv-doc-val.is-shown{opacity:1;transform:translateY(0)}
.iv-doc-val .iv-doc-val-em{color:var(--amber);font-weight:600}
.iv-doc-val .iv-doc-val-met{color:var(--charcoal-50);font-weight:500;font-size:10px}

.iv-doc-foot{margin-top:16px;padding-top:10px;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;font-size:9.5px;color:var(--charcoal-50);font-weight:500;letter-spacing:.04em}
.iv-doc-foot-mark{display:flex;align-items:center;gap:5px}
.iv-doc-foot-dot{width:5px;height:5px;border-radius:50%;background:var(--amber);box-shadow:0 0 0 3px rgba(212,149,42,0.18)}
.iv-doc-foot-stamp{font-variant-numeric:tabular-nums;color:var(--charcoal-70);font-weight:600;letter-spacing:.04em}

/* ----- Reduced motion ----- */
@media(prefers-reduced-motion:reduce){
  .insurance-viz *,.insurance-viz *::before,.insurance-viz *::after{transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}
  .iv-card.is-active .iv-idcard-scan{display:none}
}

@media(max-width:680px){
  .insurance-viz{margin:18px 0 4px}
  .iv-card{padding:16px 14px}
  .iv-doc{padding:20px 18px 16px}
  .iv-bd-tier{grid-template-columns:78px 1fr 36px;gap:8px}
}
