:root{--bg:#07111f;--panel:#0d1b2d;--panel2:#12243a;--line:#213955;--text:#eef6ff;--muted:#8fa7c2;--accent:#35d0a5;--blue:#55a7ff;--warn:#ffbd59;--danger:#ff6b6b}*{box-sizing:border-box}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text)}header{height:72px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 24px;background:#091524;position:sticky;top:0;z-index:5}.brand{display:flex;gap:12px;align-items:center}.logo{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--accent),var(--blue));display:grid;place-items:center;color:#06101b;font-weight:900;font-size:22px}.brand span{display:block;color:var(--muted);font-size:12px;margin-top:3px}.top-actions{display:flex;gap:10px;align-items:center}.pill,select,button{border:1px solid var(--line);background:var(--panel);color:var(--text);padding:9px 12px;border-radius:9px}button{cursor:pointer}.shell{display:grid;grid-template-columns:235px 1fr;min-height:calc(100vh - 72px)}aside{border-right:1px solid var(--line);padding:18px 12px;display:flex;flex-direction:column;justify-content:space-between}nav button{width:100%;text-align:left;border:0;background:transparent;margin:2px 0;color:var(--muted)}nav button.active,nav button:hover{background:var(--panel2);color:white}.aside-foot{display:grid;gap:5px;padding:12px}.aside-foot small{color:var(--muted);margin-top:8px}main{padding:26px;max-width:1500px}.eyebrow{color:var(--accent);font-weight:700;text-transform:uppercase;font-size:12px;letter-spacing:.12em}h1{font-size:30px;margin:6px 0}p.sub{color:var(--muted);margin-top:0}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:20px 0}.card{background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:16px;padding:18px}.metric b{font-size:28px;display:block}.metric span,.muted{color:var(--muted);font-size:13px}.two{display:grid;grid-template-columns:1.5fr 1fr;gap:16px}.three{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.table{width:100%;border-collapse:collapse}.table th,.table td{text-align:left;padding:12px;border-bottom:1px solid var(--line);font-size:13px}.table th{color:var(--muted)}.status{padding:5px 8px;border-radius:999px;font-size:11px;background:#163b37;color:#7cf0d0}.status.warn{background:#3b3118;color:#ffd27a}.status.blue{background:#153452;color:#8fc7ff}.btn{background:var(--accent);color:#06101b;border:0;font-weight:800}.btn.secondary{background:var(--panel2);color:white;border:1px solid var(--line)}.chat{display:flex;flex-direction:column;gap:10px;min-height:280px}.bubble{max-width:78%;padding:11px 13px;border-radius:14px;background:var(--panel2)}.bubble.ai{align-self:flex-start;border-left:3px solid var(--accent)}.bubble.user{align-self:flex-end;background:#173b5f}.composer{display:flex;gap:8px;margin-top:12px}.composer input{flex:1;background:#07111f;border:1px solid var(--line);color:white;padding:12px;border-radius:10px}.map{height:280px;border-radius:14px;background:radial-gradient(circle at 30% 40%,#1c4660 0 3px,transparent 4px),radial-gradient(circle at 70% 60%,#35d0a5 0 5px,transparent 6px),linear-gradient(25deg,transparent 48%,#213955 49% 51%,transparent 52%),linear-gradient(120deg,#0a1726,#102a3a);position:relative;overflow:hidden}.map:after{content:'LLOYDMINSTER • SIMULATED MAP';position:absolute;bottom:12px;left:12px;color:var(--muted);font-size:11px}.call{border:1px solid var(--accent);box-shadow:0 0 30px #35d0a51a}.call-head{display:flex;justify-content:space-between;align-items:center}.dot{width:9px;height:9px;background:var(--accent);border-radius:50%;display:inline-block;margin-right:7px}.audit{font-family:ui-monospace,Consolas,monospace;font-size:12px;color:#b9c9da}.banner{padding:13px 16px;border:1px solid #275a4d;background:#0d2a25;border-radius:12px;color:#a8f3dc;margin:14px 0}.hidden{display:none}@media(max-width:950px){.shell{grid-template-columns:1fr}aside{display:none}.grid,.three,.two{grid-template-columns:1fr 1fr}}@media(max-width:650px){.grid,.three,.two{grid-template-columns:1fr}.pill{display:none}header{padding:0 12px}.top-actions{gap:5px}main{padding:16px}}
.live-map{position:relative;overflow:hidden;min-height:300px;background:linear-gradient(135deg,#0b1626,#11243a)!important;border:1px solid #243d58;border-radius:16px}.road{position:absolute;background:#33485d;opacity:.65}.r1{width:130%;height:18px;left:-15%;top:48%;transform:rotate(-12deg)}.r2{height:130%;width:18px;left:54%;top:-15%;transform:rotate(18deg)}.cab,.pin{position:absolute;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-weight:800;box-shadow:0 8px 22px #0008}.cab{background:#f6c344;color:#111}.c1{left:24%;top:33%}.c2{left:67%;top:22%}.c3{left:57%;top:67%}.c4{left:78%;top:54%}.pin{background:#fff;color:#111}.pickup{left:14%;top:68%}.drop{right:12%;top:18%}.map-label{position:absolute;bottom:12px;left:14px;font-size:11px;letter-spacing:1.5px;opacity:.65}.moving{animation:drive 4s ease-in-out infinite alternate}@keyframes drive{to{transform:translate(130px,-55px)}}.driver-shell,.tracking-wrap{display:grid;grid-template-columns:minmax(300px,430px) 1fr;gap:18px}.phone{min-height:520px;border-radius:30px;padding:24px}.phone-top{display:flex;justify-content:space-between}.route{font-size:24px;display:flex;flex-direction:column;gap:12px;margin:45px 0}.driver-actions{margin-top:40px}.track-card{text-align:center}.track-brand{display:flex;justify-content:space-between}.customer-map{margin:20px 0}.eta{font-size:64px;font-weight:800}.eta small{display:block;font-size:11px;letter-spacing:2px}.presentation aside{display:none}.presentation .shell{grid-template-columns:1fr}@media(max-width:850px){.driver-shell,.tracking-wrap{grid-template-columns:1fr}}

code{font-family:ui-monospace,Consolas,monospace;color:#9ed0ff;font-size:12px}.approval-row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 0;border-bottom:1px solid var(--line)}.approval-row:last-child{border-bottom:0}.timeline{padding:8px 18px}.event{display:grid;grid-template-columns:90px 1fr;gap:18px;padding:18px 0;border-bottom:1px solid var(--line);position:relative}.event:before{content:'';position:absolute;left:78px;top:24px;width:8px;height:8px;border-radius:50%;background:var(--accent)}.event-time{color:var(--muted);font-family:ui-monospace,Consolas,monospace;font-size:12px}.event p{margin:5px 0}.setting,.policy{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:13px 0;border-bottom:1px solid var(--line)}label{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em;margin-top:15px}.policy span{color:#a8f3dc;font-size:12px;text-align:right}
.voice-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(320px,.8fr);gap:16px}.voice-console{min-height:620px;border-color:#2b7968}.voice-wave{height:80px;display:flex;gap:6px;align-items:center;justify-content:center;margin:18px 0;background:#081622;border-radius:14px}.voice-wave i{display:block;width:5px;height:15px;background:var(--accent);border-radius:9px;opacity:.35}.voice-wave.active i{animation:wave .8s ease-in-out infinite alternate;opacity:1}.voice-wave.active i:nth-child(2n){animation-delay:.15s}.voice-wave.active i:nth-child(3n){animation-delay:.3s}@keyframes wave{to{height:52px}}.pulse{animation:pulse 1s infinite}@keyframes pulse{50%{box-shadow:0 0 0 8px #35d0a522}}.transcript{min-height:335px;max-height:390px;overflow:auto}.empty-call{text-align:center;margin:auto;max-width:520px}.empty-call h2{font-size:32px}.call-controls{display:flex;justify-content:space-between;margin-top:15px}.danger-btn{background:#4b2228!important;color:#ffc2c8!important;border:1px solid #6a3038!important}.contract-panel .extract-row{display:flex;justify-content:space-between;gap:20px;padding:14px 0;border-bottom:1px solid var(--line)}.contract-panel .extract-row span{color:var(--muted)}.contract-panel .extract-row b{text-align:right}.contract-box,.invoice-preview{font-family:ui-monospace,Consolas,monospace;font-size:12px;background:#081522;border:1px solid var(--line);border-radius:12px;padding:14px;margin-top:18px;color:#b9d0e8;line-height:1.7}.voucher{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:18px;padding:16px 0;border-bottom:1px solid var(--line)}.voucher p{margin:4px 0}.voucher>div:nth-child(2){display:flex;flex-direction:column;align-items:flex-end;gap:5px}@media(max-width:900px){.voice-grid{grid-template-columns:1fr}.voucher{grid-template-columns:1fr auto}.voucher button{grid-column:1/-1}}

/* MVP 3.3 approved presentation redesign */
:root{
  --bg:#071321;
  --panel:#0b1b2e;
  --panel2:#12253c;
  --line:#233d59;
  --text:#f4f7fb;
  --muted:#9db0c6;
  --accent:#3ae0a6;
  --blue:#4f7cff;
}
body{background:linear-gradient(180deg,#06111f 0%,#0a1b2e 100%);}
header{
  height:72px;
  background:#071321;
  border-bottom:1px solid #1f3550;
  padding:0 28px;
}
.brand-row{display:flex;align-items:center;gap:24px}
.faimara-wordmark{font-weight:900;font-size:26px;letter-spacing:.04em}
.product-name{font-weight:800;font-size:17px;color:#6f92ff}
.org-chip{
  display:flex;align-items:center;gap:10px;
  border:1px solid #2a4058;background:#101f32;padding:10px 14px;border-radius:10px;
  color:#fff;font-weight:700
}
.live-badge{display:flex;align-items:center;gap:9px}
.live-badge small{display:block;color:#40e2a8;font-size:11px;margin-top:2px}
#role{min-width:130px;background:#101f32;font-weight:700}
#presentation{background:#101f32}
.voice-home .shell{display:block;min-height:calc(100vh - 72px)}
.voice-home aside{display:none}
.voice-home main{max-width:none;padding:28px 32px 34px}
.approved-demo-layout{
  display:grid;
  grid-template-columns:minmax(330px,0.78fr) minmax(760px,1.55fr);
  gap:28px;
  max-width:1600px;
  margin:0 auto;
}
.walkthrough-panel{
  min-height:720px;
  border:1px solid #18314b;
  border-radius:28px;
  padding:38px 44px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  background:
    radial-gradient(circle at 35% 35%,rgba(37,91,150,.20),transparent 34%),
    linear-gradient(160deg,#0d2036 0%,#071526 70%);
  box-shadow:0 24px 70px rgba(0,0,0,.22);
}
.concept-label,.step-label{
  color:#7ea6ff;font-size:12px;font-weight:800;letter-spacing:.13em
}
.concept-label{color:#bcd0e8}
.walkthrough-copy{max-width:480px}
.walkthrough-copy h1{
  font-size:48px;
  line-height:1.35;
  margin:20px 0 18px;
  letter-spacing:-.02em
}
.walkthrough-copy p{
  color:#a8b9ce;
  font-size:18px;
  line-height:1.7;
  margin-bottom:22px
}
.feature-pills{display:flex;gap:10px;flex-wrap:wrap}
.feature-pills span{
  border:1px solid #33527a;
  padding:10px 14px;
  border-radius:999px;
  color:#e7edf7;
  font-size:13px
}
.walkthrough-footer{display:flex;align-items:center;gap:18px}
.square-btn,.light-btn{height:46px}
.square-btn{width:46px;background:transparent;border:1px solid #314865}
.light-btn{margin-left:auto;background:#fff;color:#071321;border:0;padding:0 18px;font-weight:800}
.step-dots{display:flex;gap:8px}
.step-dots i{width:9px;height:9px;background:#40516a;border-radius:50%}
.step-dots i.active{width:28px;border-radius:99px;background:#5d89ff}
.command-frame{
  min-height:720px;
  display:grid;
  grid-template-columns:150px 1fr;
  border:1px solid #253c57;
  border-radius:28px;
  overflow:hidden;
  background:#0a1728;
  box-shadow:0 24px 70px rgba(0,0,0,.25)
}
.command-sidebar{
  padding:24px 12px;
  border-right:1px solid #203752;
  background:#0b192b
}
.mini-brand{
  font-weight:900;font-size:13px;letter-spacing:.05em;
  margin:8px 8px 28px
}
.mini-brand span{display:block;color:#6c90ff;margin-top:4px}
.command-sidebar button{
  width:100%;
  text-align:left;
  background:transparent;
  border:0;
  color:#9fb2ca;
  padding:13px 14px;
  border-radius:9px;
  margin-bottom:5px
}
.command-sidebar button.active,.command-sidebar button:hover{
  background:#1a3e7a;
  color:white
}
.command-content{padding:24px 28px 30px}
.command-title-row{display:flex;justify-content:space-between;align-items:center}
.command-title-row h2{font-size:21px;margin:0}
.system-online{
  background:#173b33;color:#5eedbd;
  padding:9px 12px;border-radius:999px;font-size:12px
}
.call-metrics{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin:24px 0
}
.metric-card{
  border:1px solid #2a405b;
  border-radius:14px;
  padding:18px;
  background:linear-gradient(180deg,#112239,#0d1d31)
}
.metric-card span{font-size:12px;color:#9bb0c8}
.metric-card b{display:block;font-size:24px;margin:10px 0}
.metric-card small{color:#b8c6d6}
.green-dot{display:inline-block;width:7px;height:7px;background:#3ae0a6;border-radius:50%;margin-left:5px}
.incoming-card{
  border:1px solid #2a405a;
  border-radius:16px;
  padding:20px;
  background:linear-gradient(180deg,#10223a,#0c1b2f)
}
.incoming-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}
.incoming-head h3{margin:0 0 14px}
.incoming-head p{color:#c3d0df;margin:0 0 18px}
.voice-tag{
  background:#183b6c;color:#7eabff;
  padding:8px 10px;border-radius:9px;font-size:11px;font-weight:800
}
.call-detail-list{
  border:1px solid #2b4057;border-radius:12px;overflow:hidden
}
.call-detail-list>div{
  display:flex;justify-content:space-between;gap:30px;
  padding:14px 15px;
  border-bottom:1px solid #263c55
}
.call-detail-list>div:last-child{border-bottom:0}
.call-detail-list span{color:#d9e4f0}
.call-detail-list b{text-align:right}
.voice-demo-lower{
  display:grid;
  grid-template-columns:150px 1fr;
  gap:14px;
  align-items:stretch;
  margin-top:16px
}
.compact-transcript{
  min-height:130px;
  max-height:190px;
  overflow:auto;
  background:#081522;
  border:1px solid #223951;
  padding:12px;
  border-radius:12px
}
.compact-transcript .bubble{font-size:12px}
.voice-demo-lower .voice-wave{margin:0;height:auto;min-height:130px}
.command-actions{display:flex;gap:12px;margin-top:16px}
.command-actions .btn{flex:1;padding:13px 14px}
.command-actions .btn:last-child{background:linear-gradient(135deg,#1f6fd9,#269c70);color:#fff}
.voice-home .presentation .walkthrough-panel{display:none}
@media(max-width:1180px){
  .approved-demo-layout{grid-template-columns:1fr}
  .walkthrough-panel{min-height:520px}
  .command-frame{min-height:650px}
}
@media(max-width:820px){
  .command-frame{grid-template-columns:1fr}
  .command-sidebar{display:none}
  .call-metrics{grid-template-columns:1fr 1fr}
  .voice-demo-lower{grid-template-columns:1fr}
  .walkthrough-copy h1{font-size:38px}
}
@media(max-width:560px){
  .voice-home main{padding:14px}
  .walkthrough-panel{padding:28px 24px}
  .command-content{padding:18px}
  .call-metrics{grid-template-columns:1fr}
  .walkthrough-copy h1{font-size:32px}
  .brand-row{gap:10px}
  .org-chip{display:none}
  .product-name{font-size:13px}
  #presentation{display:none}
}

/* MVP 3.3 Voice-first customer call interaction */
.call-first-layout{grid-template-columns:minmax(360px,.72fr) minmax(760px,1.55fr)}
.customer-call-panel{justify-content:flex-start;gap:22px}
.customer-call-panel .walkthrough-copy h1{font-size:43px;margin-bottom:12px}
.customer-call-panel .walkthrough-copy p{font-size:16px;line-height:1.55;margin-bottom:0}
.customer-phone{width:min(100%,390px);margin:0 auto;background:#050b13;border:1px solid #31465d;border-radius:34px;padding:16px 18px 18px;box-shadow:inset 0 0 0 5px #0a111b;min-height:405px;display:flex;flex-direction:column}
.phone-status{display:flex;justify-content:space-between;color:#8ea0b5;font-size:10px;padding:2px 5px 10px}.signal{letter-spacing:1px;color:#61e8b3}
.phone-contact{text-align:center;padding:4px 0 10px}.phone-contact h2{font-size:18px;margin:8px 0 3px}.phone-contact p{font-size:12px;margin:0;color:#8fa5bc}.taxi-avatar{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;margin:auto;background:#15283d;font-size:28px;border:1px solid #294761}
.customer-call-transcript{background:#0b1622;border:1px solid #1e3348;border-radius:16px;min-height:185px;max-height:210px;overflow:auto;padding:12px;margin:8px 0 12px;font-size:12px;line-height:1.45}.phone-empty{color:#879bb0;text-align:center;padding:58px 12px}.phone-call-line{padding:8px 9px;margin-bottom:7px;border-radius:10px;background:#101f31;color:#c7d4e3}.customer-line{background:#162c25;color:#d8f7eb}.ai-line{border-left:3px solid #5883ff}.success-line{border-left:3px solid #3ae0a6;background:#102820}
.customer-phone-actions{margin-top:auto}.call-taxi-btn,.customer-reply-btn{width:100%;border:0;border-radius:999px;padding:14px 16px;font-weight:800;cursor:pointer}.call-taxi-btn{background:#1eaf74;color:white}.call-taxi-btn.disabled{opacity:.65;cursor:default}.customer-reply-btn{background:#325fc1;color:white}.phone-demo-note{display:block;text-align:center;color:#6f8297;font-size:9px;margin-top:9px}
.live-call-stage{display:grid;grid-template-columns:150px 1fr;gap:14px;align-items:stretch;margin:14px 0}.live-call-stage .voice-wave{margin:0;height:auto;min-height:145px}.live-ai-transcript{min-height:145px;max-height:205px;overflow:auto;background:#081522;border:1px solid #223951;border-radius:12px;padding:12px}.ringing-card{border-color:#456693;animation:ringBorder 1s ease-in-out infinite alternate}@keyframes ringBorder{to{border-color:#69e3b3}}
.extracted-fields>div b{transition:.2s}.voice-pipeline{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:14px;color:#71859b;font-size:11px}.voice-pipeline span{border:1px solid #283e56;border-radius:999px;padding:7px 10px}.voice-pipeline span.done{color:#c9f8e7;border-color:#2b8a68;background:#123126}.voice-pipeline b{color:#425b74}
@media(max-width:1180px){.call-first-layout{grid-template-columns:1fr}.customer-phone{width:min(100%,420px)}}
@media(max-width:720px){.live-call-stage{grid-template-columns:1fr}.call-metrics{grid-template-columns:repeat(2,1fr)}}

.mic-help{margin-top:10px;padding:10px 12px;border:1px solid rgba(255,255,255,.12);border-radius:10px;font-size:12px;line-height:1.4;color:#b9c6d8;background:rgba(255,255,255,.04)}
.listening-btn{animation:micPulse 1s infinite alternate}
.listening-line{border-color:#49d3a1!important;background:rgba(73,211,161,.12)!important}
@keyframes micPulse{from{transform:scale(1);opacity:.82}to{transform:scale(1.02);opacity:1}}

/* Dispatch-only external demo */
#role:disabled{
  opacity:1;
  cursor:default;
  font-weight:700;
}
aside nav button{
  min-height:44px;
}

/* v17.22 — Faimara TaxiFlow external demo: white premium presentation */
html,body{background:#f7f9fc!important;color:#13243a}
body:before{content:"";position:fixed;inset:0;z-index:-1;background:linear-gradient(180deg,#ffffff 0%,#f6f9fd 100%)}
.shell,.app-shell,.workspace,.main,.content,.main-content{background:#fff}
header,.topbar,.app-header{background:rgba(255,255,255,.97)!important;border-bottom:1px solid #e3eaf2!important;box-shadow:0 6px 24px rgba(24,45,72,.05)}
aside,.sidebar{background:#fbfcfe!important;border-right:1px solid #e3eaf2!important}
aside nav button,.sidebar button{color:#40536b}
aside nav button.active,.sidebar button.active{background:#eaf2ff!important;color:#155dc4!important}
.card,.panel,.call-card,.voice-card,.metric-card{background:#fff;border-color:#dfe7f0;box-shadow:0 12px 34px rgba(26,48,76,.07)}


/* =========================================================
   v17.23 — TaxiFlow LIGHT PRODUCT EXPERIENCE
   BarberFlow-inspired white application canvas
   ========================================================= */

:root{
  --tf-navy:#0b1d33;
  --tf-navy-2:#102842;
  --tf-blue:#2f68e8;
  --tf-blue-soft:#edf4ff;
  --tf-bg:#f3f6fa;
  --tf-card:#ffffff;
  --tf-border:#dce5ef;
  --tf-text:#10243d;
  --tf-muted:#667b94;
  --tf-green:#18a870;
}

/* Entire page */
html,
body{
  background:#f3f6fa !important;
  color:var(--tf-text) !important;
}

body:before{
  background:linear-gradient(180deg,#ffffff 0%,#f4f7fb 100%) !important;
}

/* App header — white like BarberFlow */
#app > header,
body > header,
header{
  background:#ffffff !important;
  color:var(--tf-text) !important;
  border-bottom:1px solid var(--tf-border) !important;
  box-shadow:0 4px 18px rgba(18,42,68,.05) !important;
}

.faimara-wordmark{
  color:var(--tf-navy) !important;
}

.product-name{
  color:#5a79ef !important;
}

.org-chip{
  background:var(--tf-navy) !important;
  color:#fff !important;
  border-color:var(--tf-navy) !important;
}

.live-badge{
  color:var(--tf-text) !important;
}

.live-badge small{
  color:var(--tf-green) !important;
}

#role,
#presentation{
  background:var(--tf-navy) !important;
  color:#fff !important;
  border-color:var(--tf-navy) !important;
}

/* Main application frame */
.shell{
  background:var(--tf-bg) !important;
}

/* Left nav remains navy, like BarberFlow */
.shell > aside,
aside{
  background:var(--tf-navy) !important;
  color:#fff !important;
  border-right:0 !important;
}

aside nav button{
  color:#c8d7e8 !important;
  background:transparent !important;
}

aside nav button:hover{
  background:rgba(255,255,255,.07) !important;
  color:#fff !important;
}

aside nav button.active{
  background:#1f4e93 !important;
  color:#fff !important;
}

.aside-foot{
  color:#b7c7d9 !important;
}

.aside-foot b{
  color:#fff !important;
}

/* Main content area */
.shell > main,
main#main,
main{
  background:var(--tf-bg) !important;
  color:var(--tf-text) !important;
}

/* Voice demo layout itself */
.approved-demo-layout,
.call-first-layout{
  background:var(--tf-bg) !important;
}

/* Left customer story panel: LIGHT, not navy */
.walkthrough-panel,
.customer-call-panel{
  background:#ffffff !important;
  color:var(--tf-text) !important;
  border:1px solid var(--tf-border) !important;
  box-shadow:0 14px 36px rgba(18,42,68,.08) !important;
}

.walkthrough-panel h1,
.walkthrough-panel h2,
.walkthrough-panel h3,
.walkthrough-copy h1{
  color:var(--tf-text) !important;
}

.walkthrough-panel p,
.walkthrough-copy p{
  color:#58708b !important;
}

.concept-label,
.step-label{
  color:#2f68e8 !important;
}

.concept-label .dot{
  background:#35c98d !important;
}

/* Customer phone becomes light premium */
.customer-phone{
  background:#f8fafc !important;
  border:1px solid var(--tf-border) !important;
  color:var(--tf-text) !important;
  box-shadow:none !important;
}

.phone-status,
.phone-contact h2,
.phone-contact p{
  color:var(--tf-text) !important;
}

.customer-call-transcript{
  background:#ffffff !important;
  border:1px solid var(--tf-border) !important;
  color:var(--tf-text) !important;
}

.phone-empty,
.phone-call-line{
  color:#516a84 !important;
}

.ai-line{
  background:#eef4ff !important;
  color:#24486f !important;
  border-color:#d8e5fa !important;
}

.customer-line{
  background:#f0faf6 !important;
  color:#245f4a !important;
  border-color:#d7efe5 !important;
}

.success-line{
  background:#eaf9f2 !important;
  color:#14744e !important;
  border-color:#cfeede !important;
}

.mic-help{
  background:#ffffff !important;
  color:#5e728a !important;
  border-color:var(--tf-border) !important;
}

.phone-demo-note{
  color:#73869a !important;
}

.feature-pills span{
  background:#f7f9fc !important;
  border:1px solid var(--tf-border) !important;
  color:#4b627c !important;
}

/* Command center — fully light */
.command-frame{
  background:#ffffff !important;
  border:1px solid var(--tf-border) !important;
  box-shadow:0 14px 36px rgba(18,42,68,.08) !important;
}

.command-sidebar{
  background:#edf3fa !important;
  border-right:1px solid var(--tf-border) !important;
}

.mini-brand{
  color:var(--tf-navy) !important;
}

.mini-brand span{
  color:#3567dc !important;
}

.command-sidebar button{
  background:transparent !important;
  color:#536d89 !important;
}

.command-sidebar button.active{
  background:#ffffff !important;
  color:#175dc4 !important;
  box-shadow:0 2px 10px rgba(30,72,116,.07) !important;
}

.command-content{
  background:#f7f9fc !important;
  color:var(--tf-text) !important;
}

.command-title-row h2{
  color:var(--tf-text) !important;
}

.command-title-row small,
.muted{
  color:#6d8096 !important;
}

.system-online{
  background:#e9f9f2 !important;
  color:#187b58 !important;
}

/* Metrics */
.call-metrics .metric-card,
.metric-card{
  background:#ffffff !important;
  color:var(--tf-text) !important;
  border:1px solid var(--tf-border) !important;
  box-shadow:none !important;
}

.metric-card span,
.metric-card small{
  color:#75879c !important;
}

.metric-card b{
  color:var(--tf-text) !important;
}

/* Main incoming call / booking card */
.incoming-card,
.live-call-stage,
.call-detail-list,
.extracted-fields{
  background:#ffffff !important;
  color:var(--tf-text) !important;
  border-color:var(--tf-border) !important;
}

.incoming-head h3{
  color:var(--tf-text) !important;
}

.incoming-head p{
  color:#62758d !important;
}

.voice-tag{
  background:#eaf1ff !important;
  color:#3567dc !important;
}

/* Voice waveform card */
.voice-wave{
  background:#eef7f4 !important;
  border:1px solid #d8eee6 !important;
}

.voice-wave i{
  background:#28a67b !important;
}

/* Conversation bubbles */
.live-ai-transcript,
.chat{
  background:#ffffff !important;
  color:var(--tf-text) !important;
}

.bubble{
  border:1px solid var(--tf-border) !important;
}

.bubble.ai{
  background:#edf4ff !important;
  color:#24486f !important;
}

.bubble.user{
  background:#f0faf6 !important;
  color:#245f4a !important;
}

/* Extracted booking rows */
.call-detail-list > div,
.extracted-fields > div{
  background:#f8fafc !important;
  border-color:#e3eaf2 !important;
  color:var(--tf-text) !important;
}

.call-detail-list span,
.extracted-fields span{
  color:#58718c !important;
}

.call-detail-list b,
.extracted-fields b{
  color:var(--tf-text) !important;
}

/* Buttons */
.call-taxi-btn,
.customer-reply-btn,
.command-actions .btn:not(.secondary){
  background:#2f68e8 !important;
  color:#fff !important;
  border-color:#2f68e8 !important;
}

.command-actions .btn.secondary{
  background:#ffffff !important;
  color:#23425f !important;
  border-color:#cfdbe7 !important;
}

/* Pipeline */
.voice-pipeline{
  background:#ffffff !important;
  border:1px solid var(--tf-border) !important;
  color:#61758c !important;
}

.voice-pipeline span{
  background:#f5f8fc !important;
  color:#5f748c !important;
  border-color:#dce5ef !important;
}

.voice-pipeline span.done{
  background:#eaf9f2 !important;
  color:#177b58 !important;
  border-color:#cfeade !important;
}

/* Other app panels beyond Voice screen */
.card,
.panel,
.table-card,
.data-card,
.dashboard-card,
.trip-card,
.driver-card,
.booking-card{
  background:#ffffff !important;
  color:var(--tf-text) !important;
  border:1px solid var(--tf-border) !important;
  box-shadow:0 8px 24px rgba(18,42,68,.05) !important;
}

/* Bottom back button */
body > div[style*="position:fixed"] a{
  background:#ffffff !important;
  color:var(--tf-navy) !important;
  border:1px solid var(--tf-border) !important;
  box-shadow:0 5px 18px rgba(18,42,68,.08) !important;
}

/* Responsive */
@media(max-width:900px){
  .command-frame,
  .walkthrough-panel{
    box-shadow:none !important;
  }
}