.sample-content:has(.chat-demo){padding:0;min-height:0}.standalone-sample:has(.chat-demo){padding:0;box-shadow:none;border:0;background:transparent}.chat-demo{font-family:'Segoe UI',var(--font);font-size:14px;line-height:1.45;color:#242424;background:#fff;min-width:0}.chat-demo svg{width:18px;height:18px;flex-shrink:0;vertical-align:middle}.demo-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px;background:#fff}.demo-platforms{display:flex;gap:3px;padding:3px;border:1px solid #e5e6ed;border-radius:6px;background:#f6f7fa}.demo-platforms button{border:0;border-radius:4px;background:transparent;font-size:12px;padding:6px 9px;font-weight:500;white-space:nowrap;color:#747789}.demo-platforms button[aria-pressed=true]{background:#fff;box-shadow:0 1px 3px #17233720;color:#414368}.demo-label{font-size:9px;letter-spacing:.7px;color:#9299aa;white-space:nowrap}.chat-window{border-top:1px solid #e1e2e8;border-bottom:1px solid #e1e2e8;overflow:hidden}.chat-topbar{height:37px;background:#e9e8f2;display:flex;gap:12px;align-items:center;padding:0 10px}.chat-app-name{font-weight:600;font-size:11px;white-space:nowrap;color:#484660}.chat-search{font-size:11px;display:flex;align-items:center;gap:7px;padding:5px 9px;flex:1;background:#ffffffb0;border-radius:4px;color:#787786}.chat-search svg{width:12px;height:12px}.chat-profile{width:22px;height:22px;border-radius:50%;background:#ead7cf;font-size:9px;display:grid;place-items:center;color:#704f43}.chat-app-body{display:grid;grid-template-columns:45px 115px minmax(0,1fr);height:482px}.chat-rail{display:flex;flex-direction:column;align-items:stretch;background:#f0eff5;border-right:1px solid #e2e0eb;padding-top:8px;color:#73717e;gap:7px}.chat-rail>span{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 0;position:relative}.chat-rail small{font-size:8px;font-weight:500;line-height:1}.chat-rail .rail-selected{color:#6264a7;background:#e4e3ef}.chat-rail .rail-selected:before{content:'';width:3px;height:24px;background:#6264a7;position:absolute;left:0;top:5px;border-radius:3px}.chat-rail>span.rail-more{font-size:10px;letter-spacing:1px}.chat-sidebar{background:#f6f5f9;border-right:1px solid #e8e6ee;padding:15px 7px;overflow:hidden}.chat-sidebar h4{font-size:14px;margin:0 0 17px 4px;line-height:1.3}.chat-sidebar>span{display:flex;gap:5px;align-items:center;font-size:10px;padding:7px 5px;white-space:nowrap}.chat-sidebar .sidebar-section{font-size:9px;color:#8c8797;margin-top:13px;padding-bottom:4px}.sidebar-selected{background:#e7e6f6;border-radius:4px;color:#47468b;font-weight:600}.sidebar-f{width:16px;height:17px;display:grid;place-items:center;color:#fff;background:#2457e5;border-radius:4px;font-style:italic;font-size:14px;line-height:1;padding-right:2px}.sidebar-person{width:16px;height:16px;border-radius:50%;font-size:7px;font-style:normal;background:#e1e8de;display:grid;place-items:center;color:#57754f}.sidebar-filters{display:flex;gap:3px;font-size:8px;color:#888}.sidebar-filters span{padding:3px 5px;border:1px solid #dedce8;border-radius:10px}.chat-conversation{display:flex;flex-direction:column;min-width:0;background:#f7f6fa;overflow:hidden}.chat-conversation-header{padding:11px 12px;height:51px;background:#fff;display:flex;align-items:center;gap:6px;border-bottom:1px solid #efedf3}.chat-conversation-header>b{font-size:13px}.demo-avatar{background:#ead8d3;width:25px;height:25px;display:grid;place-items:center;flex-shrink:0;border-radius:50%;color:#7c534c;font-size:9px;align-self:flex-start}.demo-avatar.bot{background:var(--blue);color:#fff;font-family:Arial;font-weight:700;font-size:23px;font-style:italic;border-radius:6px;padding-right:3px}.chat-header-tools{display:flex;align-items:center;gap:10px;margin-left:auto;font-size:10px;color:#777382}.chat-header-tools svg{width:15px;height:15px}.demo-app-tag{font-size:8px;background:#efedf3;border-radius:3px;color:#9b94a2;padding:2px 3px;font-weight:500}.chat-content-tabs{display:flex;gap:19px;background:#fff;border-bottom:1px solid #e8e6ee;padding:0 13px;font-size:10px;flex-shrink:0}.chat-content-tabs span{padding:7px 0}.chat-content-tabs span:first-child{border-bottom:2px solid #6264a7;font-weight:600}.demo-log{padding:14px 11px;flex:1;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#dad5e3 transparent}.chat-date{font-size:9px;color:#8d8898;display:flex;align-items:center;gap:10px;margin:0 0 18px}.chat-date:before,.chat-date:after{content:'';height:1px;background:#e3e0eb;flex:1}.demo-message{display:flex;align-items:flex-start;gap:6px;margin-bottom:15px;animation:demo-message-in .25s ease-out}.demo-message-body{min-width:0;flex:1}.demo-author{font-size:10px;font-weight:600;display:flex;align-items:center;gap:5px;margin-bottom:5px;color:#44404c}.demo-author time{font-size:8px;font-weight:400;color:#9c96a5}.demo-bubble{font-size:12px;line-height:1.55;padding:9px 10px;background:#fff;border-radius:0 7px 7px 7px;box-shadow:0 1px 2px #19132605;overflow-wrap:anywhere}.teams .from-user{flex-direction:row-reverse;margin-left:25px}.teams .from-user>.demo-avatar{display:none}.teams .from-user .demo-author{justify-content:flex-end}.teams .from-user .demo-bubble{background:#e8e6fa;border-radius:7px 0 7px 7px}.teams .from-user .demo-author .demo-app-tag{display:none}.demo-typing{font-size:10px;color:#8d849d;display:flex;align-items:center;gap:7px;margin-left:31px;height:20px;margin-bottom:10px}.demo-typing[hidden]{display:none}.typing-dots{display:flex;gap:3px;align-items:center}.typing-dots i{width:4px;height:4px;border-radius:50%;background:#8c83a3;animation:demo-typing 1s infinite}.typing-dots i:nth-child(2){animation-delay:.15s}.typing-dots i:nth-child(3){animation-delay:.3s}.demo-composer{border:1px solid #dbd6e4;border-bottom:2px solid #7770af;border-radius:4px;background:#fff;margin:8px 10px 12px;flex-shrink:0}.composer-draft{font-size:11px;color:#a6a0ad;padding:10px;min-height:45px;line-height:1.45;overflow-wrap:anywhere}.composer-draft.is-typing{color:#39333e}.composer-draft.is-typing:after{content:'';display:inline-block;height:12px;width:1px;background:#777;vertical-align:middle;margin-left:2px;animation:demo-caret 1s step-end infinite}.composer-tools{display:flex;align-items:center;justify-content:space-between;color:#8d8697;font-size:12px;padding:0 9px 8px}.composer-tools svg{width:15px;height:15px;color:#7270ae}.demo-attachment{display:flex;align-items:center;gap:8px;margin-top:8px;background:#fff;border:1px solid #e2deeb;border-radius:5px;padding:8px;font-size:10px}.demo-attachment>svg{color:#ba5361;width:22px;height:22px}.demo-attachment b{font-size:10px;font-weight:600}.demo-attachment span{font-size:9px;color:#a5a0aa;display:block}.demo-card{margin-top:9px;border:1px solid #e4e0ec;border-top:3px solid #7675b7;border-radius:5px;background:#fff;padding:12px}.demo-card-label{font-size:8px;letter-spacing:1px;color:#aaa2b1;font-weight:600}.demo-route{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:9px 0 6px}.demo-route b{font-family:var(--display);font-size:23px;font-weight:600;letter-spacing:-.6px}.demo-route span{color:#aaa3b4}.demo-card-facts{display:flex;flex-direction:column;gap:4px;font-size:10px;color:#8a8296}.demo-card-facts strong{font-weight:500;color:#5c506b}.demo-outcome{margin-top:8px;background:#edf7f1;border-radius:5px;padding:9px;font-size:10px;color:#397855}.demo-outcome>span{margin-right:4px}.demo-outcome small{display:block;color:#7b9787;margin-top:4px;font-size:9px}.demo-expense-total{font-family:var(--display);font-size:24px;font-weight:600;letter-spacing:-.7px;margin:8px 0}.demo-expense-total>span{font-family:var(--font);font-size:9px;color:#aaa;letter-spacing:0;font-weight:400}.demo-card-status{margin-top:12px;border-top:1px solid #eee;padding-top:8px;font-size:10px;color:#6469ad}.demo-controls{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;gap:8px;background:#fff}.demo-play-state{font-size:9px;color:#8e96a5}.demo-controls>div{display:flex;gap:9px}.demo-controls button{border:0;background:transparent;padding:5px 0;display:flex;align-items:center;gap:4px;font-size:10px;color:#626f86}.demo-controls button:hover{color:var(--blue)}.demo-controls button:disabled{opacity:.35;cursor:default}.demo-controls button svg{width:12px;height:12px}.demo-progress{height:2px;background:#eef0f6;overflow:hidden}.demo-progress span{display:block;background:#777abe;height:2px;width:0}.demo-paused .typing-dots i,.demo-paused .composer-draft:after{animation-play-state:paused}.slack{font-family:Lato,'DM Sans',Arial,sans-serif}.slack .chat-topbar{background:#3c123e;color:#fff}.slack .chat-app-name{color:#fff;min-width:36px}.slack .chat-search{background:#ffffff25;color:#e5d9e8}.slack .chat-app-body{grid-template-columns:45px 115px minmax(0,1fr)}.slack .chat-rail{background:#3f1744;border-color:#522951;color:#eadfec}.slack .chat-rail .rail-selected{background:#754e76;color:#fff;border-radius:6px;margin:0 6px}.slack .chat-rail .rail-selected:before{display:none}.slack .chat-sidebar{background:#f5edf7;color:#4f3555;border-color:#e6dbe8}.slack .chat-sidebar h4{font-size:12px}.slack .sidebar-selected{background:#e7d5eb;color:#5d2166}.slack .sidebar-section{color:#967b9d}.slack .chat-conversation{background:#fff}.slack .chat-content-tabs span:first-child{border-color:#126954}.slack .demo-bubble{box-shadow:none;background:transparent;padding:0}.slack .demo-message{gap:8px}.slack .demo-avatar{border-radius:5px}.slack .demo-author{font-size:11px;color:#242424}.slack .chat-date{font-weight:600;color:#65606b}.slack .demo-composer{border:1px solid #c9c6cb;border-radius:7px}.slack .composer-tools svg{color:#2b805e}.slack .demo-card{border-top:1px solid #e4e0ec;border-left:3px solid #2c8d71}.slack .demo-card-status{color:#267b60}.slack .demo-log{padding-inline:12px}.slack .demo-author .demo-app-tag{font-size:7px}.slack .demo-card-facts{font-size:10px}.slack .demo-message.from-user .demo-bubble{font-size:12px}.slack .demo-outcome{background:#f2f8f5}@keyframes demo-message-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}@keyframes demo-typing{0%,60%,100%{opacity:.4;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}@keyframes demo-caret{50%{opacity:0}}
@media(max-width:1150px){.chat-app-body,.slack .chat-app-body{grid-template-columns:39px minmax(0,1fr)}.chat-sidebar{display:none}.demo-label{font-size:8px}.chat-rail small{font-size:7px}.chat-app-name{font-size:10px}}
@media(max-width:800px){.chat-app-body,.slack .chat-app-body{grid-template-columns:45px 125px minmax(0,1fr)}.chat-sidebar{display:block}.chat-rail small{font-size:8px}.demo-bubble{font-size:13px}.slack .demo-message.from-user .demo-bubble{font-size:13px}.chat-app-body{height:490px}}
@media(max-width:540px){.demo-toolbar{padding:9px 7px}.demo-platforms button{font-size:10px;padding:6px 7px}.demo-label{font-size:7px;letter-spacing:.3px}.chat-app-body,.slack .chat-app-body{grid-template-columns:33px minmax(0,1fr);height:490px}.chat-sidebar{display:none}.chat-rail svg{width:16px;height:16px}.chat-rail small{font-size:6px}.chat-rail .rail-selected{padding-inline:0}.slack .chat-rail .rail-selected{margin:0 3px}.chat-topbar{padding:0 7px;gap:8px}.chat-app-name{font-size:9px}.chat-search{font-size:9px}.demo-controls{padding:8px;gap:5px}.demo-controls button{font-size:9px}.demo-play-state{font-size:8px;max-width:145px}.demo-controls>div{gap:8px}.chat-date{margin-bottom:13px}.demo-log{padding-inline:8px}.demo-author{font-size:9px}.demo-bubble{font-size:12px}.slack .demo-message.from-user .demo-bubble{font-size:12px}.demo-avatar{width:21px;height:21px;font-size:8px}.demo-avatar.bot{font-size:19px}.chat-conversation-header{padding:10px}.teams .from-user{margin-left:15px}.chat-search svg{width:11px;height:11px}.demo-card{padding:10px}}
@media(prefers-reduced-motion:reduce){.demo-message,.typing-dots i,.composer-draft:after{animation:none!important}}
/* Compact multi-option Trips flow, based on the supplied Teams screenshots. */
.chat-demo[data-scenario=trips] .chat-sidebar{display:none}.chat-demo[data-scenario=trips] .chat-app-body{grid-template-columns:42px minmax(0,1fr);height:530px}.chat-demo[data-scenario=trips] .demo-log{padding:12px 12px}.chat-demo[data-scenario=trips] .demo-bubble{font-size:12px}.demo-flight-options{margin-top:10px;border:1px solid #e1dfe6;border-radius:5px;overflow:hidden;background:#fff}.flight-options-heading{display:flex;flex-direction:column;gap:3px;padding:10px 11px;background:#f4f3f8}.flight-options-heading>b{font-size:12px}.flight-options-heading>span{font-size:10px;color:#7e7888}.flight-options-heading>small{font-size:9px;color:#948c9e}.flight-option{padding:9px 11px;border-top:1px solid #e9e6ef}.flight-option-title{display:flex;align-items:center;justify-content:space-between;gap:7px;margin-bottom:7px}.flight-option-title>b{font-size:11px;font-weight:650}.flight-option-title>b>span{font-weight:400;color:#837b91;margin-left:2px}.recommended-tag{font-size:8px;color:#6261a4;font-weight:500;white-space:nowrap}.flight-option-facts{display:flex;align-items:center;gap:10px;justify-content:space-between}.flight-option-facts>span{display:flex;flex-direction:column;gap:3px}.flight-option-facts strong{font-size:12px;font-weight:450}.flight-option-facts small{font-size:9px;color:#968e9f}.flight-fare{font-size:12px;font-weight:600;color:#3d9d55;white-space:nowrap}.flight-option button,.demo-selection-card button{border:1px solid #b2adc0;border-radius:4px;background:transparent;color:#60566e;white-space:nowrap;font-size:10px;font-weight:500;padding:5px 8px;line-height:1.5}.flight-option:first-of-type button,.flight-option:nth-child(2) button,.demo-selection-card button{background:#5b55b5;border-color:#5b55b5;color:#fff}.flight-option button:hover{border-color:#7771cc;background:#6c65c0;color:#fff}.flight-option.option-selected{box-shadow:inset 3px 0 #7771d0}.demo-selection-card{display:flex;flex-direction:column;gap:5px;padding:11px;margin-top:8px;background:#f7f5fa;border:1px solid #e5e0eb;border-radius:4px}.demo-selection-card>b{font-size:12px;margin-bottom:3px}.demo-selection-card>span{font-size:11px}.demo-selection-card>small{font-size:10px;color:#948c9d}.demo-selection-card button{align-self:flex-start;margin-top:6px;font-size:11px;padding:6px 10px}.demo-selection-card button:disabled{background:#484455;border-color:#5b5468;color:#bdb5cb;cursor:default}.demo-booking-result{display:flex;flex-direction:column;gap:7px;margin-top:9px}.demo-booking-result>b{font-size:12px}.demo-booking-result>span{font-size:11px;color:#bc9e4e}.demo-booking-result>small{font-size:10px;color:#938a9d}.chat-window.teams{background:#1f1f1f;color:#efefef;border-color:#3b3b3b}.teams .chat-topbar{background:#29282d;color:#dedce9}.teams .chat-app-name{color:#dad7e5}.teams .chat-search{background:#3d3b43;color:#aaa6b6}.teams .chat-rail{background:#292929;border-color:#343434;color:#bab7c3}.teams .chat-rail .rail-selected{background:#33313c;color:#b3acf1}.teams .chat-rail .rail-selected:before{background:#9e96ed}.teams .chat-sidebar{background:#242424;border-color:#333;color:#dcd9e6}.teams .sidebar-selected{background:#393544;color:#d4cfee}.teams .sidebar-filters span{border-color:#4a4553}.teams .chat-conversation{background:#1f1f1f}.teams .chat-conversation-header{background:#242424;border-color:#333;color:#eee}.teams .chat-content-tabs{background:#242424;border-color:#3b3b3b;color:#bcb7c5}.teams .chat-content-tabs span:first-child{border-color:#9890f0;color:#fff}.teams .demo-app-tag{background:#39353e;color:#a8a0b2}.teams .chat-header-tools{color:#b2adba}.teams .demo-author{color:#afabb6}.teams .demo-author time{color:#99959f}.teams .demo-bubble{background:#2d2d2d;color:#f1f1f1;border-radius:6px;box-shadow:none}.teams .from-user .demo-bubble{background:#343044;color:#eee}.teams .demo-avatar.bot{background:#fff;color:#4058d1}.teams .chat-date{color:#939098}.teams .chat-date:before,.teams .chat-date:after{background:#3a373e}.teams .demo-composer{background:#292929;border-color:#53505a;border-bottom:1px solid #53505a}.teams .composer-draft{color:#aaa5b1}.teams .composer-draft.is-typing{color:#edeaf2}.teams .composer-tools,.teams .composer-tools svg{color:#b4afbd}.teams .demo-flight-options{background:#202020;border-color:#3f3f3f}.teams .flight-options-heading{background:#333;color:#eee}.teams .flight-options-heading>span,.teams .flight-options-heading>small{color:#aaa}.teams .flight-option{border-color:#454545}.teams .flight-option-title>b>span{color:#c4bfcb}.teams .flight-option-facts small{color:#aba6b0}.teams .recommended-tag{color:#bcb5f4}.teams .flight-option button{border-color:#666;color:#efefef}.teams .flight-option:nth-child(2) button{background:#5953b5;border-color:#5953b5}.teams .demo-selection-card{background:#333;border-color:#434343;color:#f0f0f0}.teams .demo-selection-card>small{color:#b8b3be}.teams .demo-booking-result>span{color:#ddc480}.teams .demo-booking-result>small{color:#b0a9b8}.teams .demo-card{background:#282828;border-color:#48414f;color:#eee}.teams .demo-card-label{color:#bdb4ca}.teams .demo-card-facts{color:#aca4b6}.teams .demo-card-facts strong{color:#ded7e7}.teams .demo-card-status{border-color:#46404e;color:#b5aaef}.teams .demo-attachment{background:#343139;border-color:#51495a}.teams .demo-log{scrollbar-color:#555 #242424}.teams .demo-outcome{background:#29392f;color:#a4c4af}.slack .flight-option:nth-child(2) button,.slack .demo-selection-card button{background:#287a5b;border-color:#287a5b}.slack .recommended-tag{color:#328066}.slack .flight-option.option-selected{box-shadow:inset 3px 0 #39896b}
@media(max-width:540px){.chat-demo[data-scenario=trips] .chat-app-body{grid-template-columns:28px minmax(0,1fr);height:540px}.chat-demo[data-scenario=trips] .demo-log{padding:10px 6px}.chat-demo[data-scenario=trips] .demo-bubble{padding:9px 7px;font-size:11px}.chat-demo[data-scenario=trips] .demo-avatar{width:18px;height:18px;font-size:7px}.chat-demo[data-scenario=trips] .demo-avatar.bot{font-size:17px}.flight-option{padding:9px 7px}.flight-options-heading{padding:9px 7px}.flight-option-title>b{font-size:10px}.flight-option-title>b>span{font-size:9px}.recommended-tag{font-size:7px}.flight-option-facts{gap:5px}.flight-option-facts strong{font-size:10px}.flight-option-facts small{font-size:8px}.flight-fare{font-size:11px}.flight-option button{font-size:9px;padding:5px}.flight-option-title{gap:4px}.demo-selection-card{padding:9px}}

/* Larger product surface in the enterprise layout. */
.chat-demo[data-scenario=trips] .chat-app-body{height:500px}.demo-toolbar{padding:11px 14px}.demo-platforms button{font-size:12px}.demo-label{font-size:9px}.demo-controls{padding:9px 14px}.demo-play-state{font-size:10px}.demo-controls button{font-size:11px}.chat-demo[data-scenario=trips] .demo-log{padding:13px 14px}.chat-demo[data-scenario=trips] .demo-bubble{font-size:13px}.flight-option{padding:10px 12px}.flight-option-title>b{font-size:12px}.flight-option-facts strong{font-size:13px}.flight-option-facts small{font-size:10px}.flight-fare{font-size:13px}.flight-option button{font-size:11px;padding:5px 10px}.flight-options-heading>b{font-size:13px}.demo-controls button:focus-visible,.demo-platforms button:focus-visible{outline:2px solid #4c8eff;outline-offset:2px}
@media(max-width:650px){.chat-demo[data-scenario=trips] .chat-app-body{height:505px}.chat-demo[data-scenario=trips] .demo-log{padding:11px 8px}.chat-demo[data-scenario=trips] .demo-bubble{font-size:12px}.flight-option{padding:10px 8px}.flight-option-title>b{font-size:11px}.flight-option-facts strong{font-size:12px}.flight-option-facts small{font-size:9px}.flight-option button{font-size:10px;padding:5px 8px}.demo-label{font-size:8px}.demo-platforms button{font-size:11px}.demo-play-state{font-size:9px}}
@media(max-width:440px){.demo-toolbar{padding:8px}.demo-platforms button{font-size:10px;padding:5px 7px}.demo-label{font-size:7px}.chat-demo[data-scenario=trips] .chat-app-body{height:520px}.demo-controls{padding:8px}.demo-controls button{font-size:9px}.demo-play-state{font-size:8px}.flight-option-facts{gap:7px}.flight-option-facts strong{font-size:11px}.flight-option button{font-size:9px;padding:5px 7px}.flight-fare{font-size:12px}.flight-option-title>b{font-size:11px}.recommended-tag{font-size:7px}}
