/* Scoped tours, using the current application's navigation and ticket fields. */
[data-demo] [hidden]{display:none!important}
[data-demo] button{font:inherit;cursor:pointer}
[data-demo] button:focus-visible{outline:3px solid #8eaaff;outline-offset:3px}
.live-product .product-app{min-height:620px}
.demo-sidebar{width:210px;flex-shrink:0;background:#fff;border-right:1px solid #e1e7f1;padding:20px 12px;display:flex;flex-direction:column;gap:2px;font-size:11px;color:#59697f}
.demo-brand{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:700;color:#172b4d;margin-bottom:18px}
.demo-sidebar>small{font-size:8px;letter-spacing:1px;margin:13px 10px 7px;color:#77849b}
.demo-sidebar>span,.demo-sidebar>button{display:flex;align-items:center;gap:9px;padding:7px 9px;border:0;background:transparent;color:inherit;text-align:left;border-radius:6px;line-height:1.4}
.demo-sidebar .icon{width:15px;height:15px;flex-shrink:0}
.demo-sidebar>button.is-active{background:#edf2ff;color:#2453ec;font-weight:650}
.demo-profile{display:flex;align-items:center;gap:8px;margin-top:auto;padding:18px 7px 0;font-size:11px}
.demo-profile i{display:grid;place-items:center;border-radius:50%;width:29px;height:29px;background:#eaf0ff;font-style:normal;color:#2453ec}
.demo-profile small{display:block;font-size:9px;color:#77849b;margin-top:3px}
.live-product .preview-main{padding:0 20px 20px;display:flex;flex-direction:column}
.demo-breadcrumb{height:49px;display:flex;align-items:center;gap:8px;border-bottom:1px solid #e1e7f1;margin-bottom:24px;color:#718099;font-size:10px}
.demo-breadcrumb .icon{width:12px;height:12px}.demo-breadcrumb>.icon:last-child{margin-left:auto;width:16px;height:16px}
.live-product .preview-heading h2{font-size:23px}
.live-product .preview-toolbar button{border:0;background:none;display:flex;align-items:center;gap:6px;font-size:11px;color:#69788e;padding:0 0 8px}
.live-product .preview-toolbar button.is-active{color:#2453ec;border-bottom:2px solid #2453ec}
.live-product .preview-toolbar{gap:22px;margin-bottom:15px}
.demo-filters{display:flex;gap:7px;margin-bottom:20px;font-size:9px;color:#69788e;flex-wrap:wrap}
.demo-filters>span{display:flex;align-items:center;gap:7px;background:#fff;border:1px solid #e1e7f1;border-radius:6px;padding:9px}
.demo-filters>span:first-child{flex:1}.demo-filters .icon{width:12px;height:12px}
.demo-workspace{flex:1;min-height:355px}
.live-product .preview-board{gap:12px}
.live-product .preview-column{display:block;min-width:0}
.live-product .preview-column>h3{font-size:11px}
.live-product .preview-ticket{padding:12px;display:block}
.live-product .preview-ticket h4{font-size:12px}
.live-product .preview-ticket>p{font-size:10px;line-height:1.6}
.live-product .ticket-reference{font-size:9px;gap:5px;flex-wrap:wrap}
.live-product .ticket-message{font-size:11px;padding:10px;margin-top:12px}
.demo-moving-ticket{position:relative;z-index:2;border-color:#8cabff;background:linear-gradient(150deg,#fff,#f5f8ff)!important;box-shadow:0 4px 18px #2453ec0b}
.demo-unread{color:#2453ec;background:#edf2ff;border-radius:4px;padding:2px 4px}
.demo-card-time{display:flex;align-items:center;gap:5px;font-size:9px;color:#8190a5;margin-top:12px}.demo-card-time .icon{width:12px;height:12px}
.demo-event{display:flex;align-items:center;gap:9px;background:#eef3ff;border:1px solid #dce6ff;border-radius:9px;padding:12px 14px;font-size:12px;color:#315793;line-height:1.6;margin-top:16px;min-height:62px}
.demo-event>.icon{width:18px;height:18px;flex-shrink:0}
.demo-controls{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:14px;flex-wrap:wrap}
.demo-steps{display:flex;gap:5px;flex-wrap:wrap}
.demo-controls button{border:1px solid #d9e2f2;background:#fff;color:#526582;border-radius:7px;padding:8px 11px;font-size:11px;line-height:1.4}
.demo-controls .is-active{background:#2453ec;color:#fff;border-color:#2453ec}
.demo-controls>[data-demo-toggle]{background:transparent;min-width:85px}
.demo-list{overflow-x:auto;background:white;border:1px solid #e1e7f1;border-radius:9px}
.demo-list table{width:100%;border-collapse:collapse;text-align:left;font-size:11px}
.demo-list th{background:#f4f6fb;color:#718099;font-size:9px;font-weight:600}
.demo-list td,.demo-list th{padding:14px 10px;border-bottom:1px solid #edf0f6}
.demo-list td:first-child{font-weight:600;min-width:175px}.demo-list small{display:block;color:#718099;font-size:9px;margin-bottom:5px}
.demo-list-highlight{background:#f0f5ff}
.live-ai .ai-card{padding:24px;min-height:675px}
.live-ai .ai-card h3{font-size:21px;line-height:1.4;margin:15px 0}
.demo-ticket-details{display:flex;gap:22px;padding:12px 0;border-block:1px solid #edf0f6;font-size:10px;color:#75829a}
.demo-ticket-details strong{display:block;font-size:12px;color:#435574;margin-top:3px}
.demo-customer{margin:16px 0;padding:13px;background:#f5f7fb;border-radius:9px}
.demo-customer>span{display:flex;align-items:center;gap:6px;color:#66758c;font-size:10px}.demo-customer .icon{width:13px;height:13px}
.live-ai .demo-customer p{font-size:12px;margin-top:6px}
.live-ai .ai-actions{justify-content:flex-start}.live-ai .ai-button{border:1px solid #2453ec;background:#2453ec;color:#fff;font-size:11px;padding:9px 13px;border-radius:7px}
.live-ai .ai-button.ghost{background:white;color:#2453ec;border-color:#c5d3ff}
.demo-compose .ai-draft{margin-top:18px;background:#fff;border:1px solid #dce3ee;border-radius:8px;min-height:160px}
.demo-compose>small{font-size:11px;color:#718099}.demo-review{display:flex;gap:7px;align-items:center;color:#36785e!important;font-size:11px!important;margin:16px 0!important}.demo-review .icon{width:16px;flex-shrink:0}
.demo-send{display:inline-block;padding:9px 15px;background:#2453ec;color:white;font-size:11px;border-radius:7px}
.demo-voice-panel{padding-top:23px}.demo-voice-panel>p{margin:17px 0!important}
.demo-change{display:flex;justify-content:space-between;gap:12px;border:1px solid #e3def3;background:#f8f6ff;border-radius:8px;padding:15px;font-size:12px;margin:18px 0;color:#6e638a}
.demo-wave{display:flex;align-items:center;justify-content:center;gap:5px;height:72px;margin-top:14px}
.demo-wave i{width:5px;height:18px;border-radius:5px;background:#8c74d8;animation:demo-wave .65s ease-in-out infinite alternate}
.demo-wave i:nth-child(2n){height:36px;animation-delay:-.3s}.demo-wave i:nth-child(3n){height:50px;animation-delay:-.6s}
@keyframes demo-wave{to{transform:scaleY(.35)}}
.demo-paused .demo-wave i{animation-play-state:paused}
.demo-confirmed{text-align:center;padding-top:32px}.demo-confirmed>span{display:grid;place-items:center;width:60px;height:60px;border-radius:50%;margin:auto;background:#e7f4ed;color:#398263}.demo-confirmed .icon{width:29px;height:29px}.demo-confirmed h4{font-size:22px;margin:18px 0 8px}.demo-confirmed>small{font-size:11px;color:#718099}
.live-ai>.demo-event{background:#f1edfc;border-color:#e4dcf8;color:#66518b}
@media(max-width:1000px){.demo-sidebar{width:180px;font-size:10px}.live-product .preview-main{padding-inline:14px}.live-product .preview-board{gap:8px}.live-product .preview-ticket{padding:10px}.live-product .preview-search{display:none}.live-ai .ai-card{padding:18px;min-height:740px}}
@media(max-width:700px){.live-product .product-app{display:block;min-height:0}.demo-sidebar{width:100%;padding:10px;display:grid;grid-template-columns:1fr 1fr;gap:2px;border-right:0;border-bottom:1px solid #e1e7f1}.demo-brand{grid-column:1/-1;margin:0 0 7px}.demo-sidebar>small,.demo-sidebar>span,.demo-profile{display:none}.demo-sidebar>button{font-size:11px}.demo-breadcrumb{margin-bottom:17px}.live-product .preview-board{grid-template-columns:repeat(3,minmax(0,1fr));}.live-product .preview-main{padding:0 12px 14px}.live-product .preview-heading h2{font-size:21px}.demo-workspace{min-height:360px}.live-product .preview-ticket h4{font-size:11px}.live-product .ticket-message{font-size:10px}.demo-filters>span:not(:first-child){display:none}.demo-controls button{font-size:10px;padding:8px}.demo-event{font-size:11px}.live-ai .ai-card{min-height:685px}.live-ai .ai-card-head{flex-wrap:wrap}.live-ai .ai-card h3{font-size:20px}}
@media(max-width:600px){.live-product .preview-board{grid-template-columns:1fr}.live-product .preview-column{display:block}.demo-card-slot{display:grid;grid-template-columns:1fr 1fr;gap:8px}.live-product .preview-ticket{margin-bottom:10px}.demo-workspace{min-height:620px}.live-product .ticket-meta{font-size:8px}.live-product .preview-column>h3{margin-bottom:9px}.demo-list table{min-width:510px}.live-ai .ai-card{min-height:735px}.demo-ticket-details{gap:18px}.live-ai .demo-controls{gap:7px}}
@media(prefers-reduced-motion:reduce){.demo-wave i{animation:none}}
