/* Compact connection controls, kept independent of the selected theme. */
:root{--surface:#fff;--surface-alt:#f3f6fa;--text:#172840;--accent-soft:#e2f4ef;--accent-text:#075e5f}
.theme-toggle{flex-shrink:0;white-space:nowrap;font-size:.8rem;min-height:38px}
.authbox{position:relative}.auth-theme{float:right;margin:0 0 12px 10px}.authbox .brand{clear:both}
.inbox-connections{flex:0 0 auto;display:flex;gap:6px;overflow-x:auto;padding:10px;border-bottom:1px solid var(--line);scrollbar-width:thin;margin-bottom:10px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
.inbox-connections button{display:flex;align-items:center;gap:7px;flex-shrink:0;padding:9px 10px;font-size:.78rem;min-height:40px}
.inbox-connections button>span{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.inbox-connections button>small{font-size:.68rem;background:var(--surface-alt);color:var(--muted);border-radius:5px;padding:1px 5px}
.inbox-connections button.active{background:var(--accent-soft);color:var(--accent-text);border-color:var(--teal);box-shadow:inset 0 -2px var(--teal)}
.contact-connection{display:block;color:var(--teal);font-size:.7rem;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:200px}
.compact-connections{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;margin-top:0;align-items:start}
.compact-connection{padding:14px;background:var(--surface)}
.connection-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.connection-heading h3{font-size:1rem;margin:0;overflow-wrap:anywhere;min-width:0}
.connection-heading .badge{font-size:.65rem;max-width:60%;white-space:normal;text-align:center;padding:4px 6px}
.connection-business{margin:5px 0 10px;color:var(--muted);font-size:.78rem;overflow-wrap:anywhere}
.connection-mode{border:1px solid var(--line);border-radius:8px;background:var(--surface-alt);padding:9px 10px;margin-bottom:10px}
.connection-mode small{display:block;font-size:.6rem;letter-spacing:.7px}.connection-mode b{display:block;font-size:.78rem;margin-top:3px;overflow-wrap:anywhere}
.connection-quick{display:grid;grid-template-columns:1fr 1fr;gap:6px}.connection-quick button{font-size:.73rem;padding:8px 6px;min-height:36px}
.compact-connection .connection-manage{margin-top:10px;padding-top:8px;font-size:.75rem;border-top:1px solid var(--line)}
.compact-connection .connection-manage summary{cursor:pointer;color:var(--muted);padding:3px 0}
.compact-connection .connection-manage .row{gap:6px;margin-top:10px}.compact-connection .connection-manage button{padding:7px;font-size:.7rem}
.compact-connection .wa-detail{font-size:.75rem;margin:8px 0;overflow-wrap:anywhere}
.compact-connection .qr{width:220px;background:#fff;padding:8px;border-radius:8px}
@media(max-width:760px){.theme-toggle{font-size:1.1rem;padding:7px 10px}.theme-toggle span{display:none}.topbar{gap:7px}.compact-connections{grid-template-columns:1fr}.connection-quick button{min-height:42px}.contact-connection{max-width:230px}}

/* Dark mode uses actual surfaces and text colors; media colors stay intact. */
:root[data-theme="dark"]{color-scheme:dark;background:#0b1220;color:#e5edf7;--surface:#141f30;--surface-alt:#1a293d;--text:#e5edf7;--navy:#0a1628;--line:#304258;--muted:#acbbce;--teal:#43d3c3;--bright:#6de8d7;--accent-soft:#163b3c;--accent-text:#86f0de}
:root[data-theme="dark"] body{background:#0b1220;color:var(--text)}
[data-theme="dark"] :is(.topbar,.card,.stat,.inbox,.contactitem,.chathead,.composer,.bubble,.deal,.flownode,.saved-flow,.authbox,.sim-bubble,.sim-tools,.simulator-compose,.simulator-tools,.keyboard-help,dialog,.compact-connection){background:var(--surface);color:var(--text);border-color:var(--line)}
[data-theme="dark"] :is(input,select,textarea,.composer textarea,.campaign-world input,.campaign-world textarea,.campaign-world select){background:#101b2b;color:var(--text);border-color:#415671}
[data-theme="dark"] input::placeholder,[data-theme="dark"] textarea::placeholder{color:#91a5bd}
[data-theme="dark"] button{background:#21334a;color:var(--text);border-color:#415671}
[data-theme="dark"] button:hover{background:#2d4560}
[data-theme="dark"] .primary{background:#148378;border-color:#32bdac;color:#fff}
[data-theme="dark"] .primary:hover{background:#106f65}
[data-theme="dark"] .danger{color:#ff9cab}
[data-theme="dark"] :is(.avatar,.contactitem.selected,.tabs .active,.conversation-filters button.active,.inbox-connections button.active){background:var(--accent-soft);color:var(--accent-text);border-color:#35b6a5}
[data-theme="dark"] .contactitem p,[data-theme="dark"] :is(th,.connection-help p,.ai-steps small){color:var(--muted)}
[data-theme="dark"] .conversation-filters button:nth-child(2){color:#a9caff}
[data-theme="dark"] :is(.chat,.simulator-phone,.column,.flowoption,.flow-library,.flow-editor-shell,.queue-editor-head,.network-address,.progress,.message-media.file,.connection-guide>div,.connection-help,.connection-mode,.update-steps>div,.update-protections>div,th){background:var(--surface-alt);border-color:var(--line);color:var(--text)}
[data-theme="dark"] :is(.bubble.out,.sim-bubble.client){background:#164339;border-color:#286855}
[data-theme="dark"] .sim-bubble.staff{background:#1e3b60}
[data-theme="dark"] :is(.bubble.note,.bubble.suggestion,.sim-bubble.system,.closed-conversation,.connection-standby){background:#41351e;color:#ffe2a3;border-color:#786237}
[data-theme="dark"] .badge{background:#2a3b51;color:#c4d2e5}
[data-theme="dark"] .badge.green{background:#193e34;color:#90e5bb}
[data-theme="dark"] .badge.amber{background:#45371c;color:#ffdc94}
[data-theme="dark"] .badge.blue{background:#233f67;color:#b4d3ff}
[data-theme="dark"] .notice{background:#16373d;border-color:#2c5c65;color:#b6e6e6}
[data-theme="dark"] .notice.warn{background:#3b301e;border-color:#705837;color:#ffe0a7}
[data-theme="dark"] .auth{background:linear-gradient(130deg,#0a1628,#17283e)}
[data-theme="dark"] .authbox .brand,[data-theme="dark"] .empty h2{color:var(--text)}
[data-theme="dark"] .authlinks button{background:transparent;color:var(--teal)}
[data-theme="dark"] .register-link{background:#243958;color:#c5dcff}
[data-theme="dark"] .navbtn{background:transparent;border:0;color:#b9c8dc}
[data-theme="dark"] .navbtn:hover{background:#182f50}
[data-theme="dark"] .navbtn.active{background:#183e51;color:#57e4d5}
[data-theme="dark"] .saas-toggle{background:linear-gradient(135deg,#39236f,#633cc5);color:#fff;border-color:#8a6bda}
[data-theme="dark"] .saas-links button{background:transparent;color:#cabfff;border:0}
[data-theme="dark"] .saas-links button:hover{background:#4c347c}
[data-theme="dark"] .platform-page{background:radial-gradient(circle at 90% 5%,#6846a52a,transparent 30%),#0e1527}
[data-theme="dark"] :is(.saas-card,.ai-steps>div,.flowoption.compact summary){background:linear-gradient(145deg,#192b3d,#2a2340);border-color:#514267;color:var(--text)}
[data-theme="dark"] .saas-metrics span{background:#302a4b}
[data-theme="dark"] .saas-metrics b{color:#d2c4ff}
[data-theme="dark"] .flowcanvas{background-color:#132338;background-image:radial-gradient(#354e68 1px,transparent 1px)}
[data-theme="dark"] .flowoption.compact{background:var(--surface);border-color:var(--line)}
[data-theme="dark"] .deal .value{color:#93e5cc}
[data-theme="dark"] .test-button{background:#6143b6;color:#fff}
[data-theme="dark"] .automation-kind{color:#fff}
[data-theme="dark"] .queue-kind{background:linear-gradient(135deg,#075f7b,#089a91)}
[data-theme="dark"] .visual-kind{background:linear-gradient(135deg,#3a246e,#7652d6)}
[data-theme="dark"] .qr{background:#fff}
[data-theme="dark"] dialog::backdrop{background:#020714bb}
[data-theme="dark"] :focus-visible{outline:2px solid #6de8d7;outline-offset:3px}
[data-theme="dark"] .composer #record-audio.recording{background:#a52645;color:#fff}
[data-theme="dark"] :is(.connection-routing,.connection-company,.connection-flow-state,.help-tip>div,.help-tip>summary,.flow-links,.keyboard-help,.campaign-modal-intro,.update-protections span,.update-steps div){background:var(--surface-alt);color:var(--text);border-color:var(--line)}
[data-theme="dark"] :is(.flow-links.free,.update-steps div.active){background:#2b2545;color:#d8caff;border-color:#64528a}
[data-theme="dark"] .help-tip>div p{color:var(--muted)}
[data-theme="dark"] :is(.studio-name input,.simulator-compose textarea){background:#101b2b;color:var(--text);border-color:#415671}

/* Catalog and subscription billing, shared by signup and the tenant area. */
.registration{max-width:1180px;margin:0 auto;padding:32px 24px}.registration>.row{margin-bottom:32px}.registration .brand{color:var(--text)}.registration h1{margin-bottom:10px}
.plans-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:20px;align-items:stretch}.plan-card{display:flex;flex-direction:column;gap:12px;min-width:0}.plan-card h2,.plan-card p{margin:0}.plan-price{font-size:1.65rem;font-weight:700;color:var(--text)}.plan-price small{font-weight:400;white-space:nowrap}.plan-features{padding-left:20px;line-height:1.8;flex:1;margin:8px 0}.plan-card button{margin-top:auto;width:100%;min-height:44px}.billing-order{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 0;border-bottom:1px solid var(--line)}.billing-order:last-child{border:0}.billing-order p{margin:5px 0}.billing-order-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px}.billing-pay-link{display:inline-block;padding:10px 15px;background:var(--teal);color:#fff;border-radius:9px;text-decoration:none;font-weight:600}.billing-url{display:block;overflow-wrap:anywhere;white-space:normal;background:var(--surface-alt);padding:10px;border-radius:8px;font-size:.8rem}
@media(max-width:760px){.registration{padding:20px 14px}.registration>.row{align-items:flex-start;gap:12px}.plans-grid{grid-template-columns:1fr}.billing-order{align-items:flex-start;flex-direction:column}.billing-order-actions{width:100%}.billing-order-actions>*{flex:1;text-align:center}.registration .brand{font-size:1.15rem}}

/* 0.1.32: touch-first inbox, returns and contact directory. */
.home-shortcuts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:22px}
.home-shortcuts button{text-align:left;padding:20px;min-height:84px;border-radius:14px}.home-shortcuts b,.home-shortcuts span{display:block}.home-shortcuts b{font-size:1.1rem}.home-shortcuts span{margin-top:6px;font-size:.85rem}
.inbox-connection-picker{display:none}.chat-return-tools{display:flex;gap:8px;align-items:center;padding:9px 12px;background:var(--surface);border-bottom:1px solid var(--line);flex:0 0 auto;flex-wrap:wrap}.chat-return-tools button{min-height:44px;font-size:.84rem}
#contact-details-mobile{display:none}.appointment-toolbar,.contact-filter-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.contact-filter-options{grid-template-columns:repeat(3,minmax(0,1fr))}
.appointment-list{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}.appointment-card,.organized-contact{padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--surface);min-width:0;color:var(--text)}
.appointment-card>small,.organized-contact small{display:block;color:var(--muted);line-height:1.5}.appointment-time{font-weight:700;color:var(--accent-text)}.appointment-text{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.6;max-height:180px;overflow:auto}.appointment-reason{padding:12px;border:1px solid var(--line);border-left:3px solid #d79525;border-radius:8px;background:var(--surface-alt);font-size:.88rem;overflow-wrap:anywhere}
.appointment-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}.appointment-actions button{min-height:44px;flex:1;font-size:.82rem}
.appointment-presets{display:flex;gap:8px;overflow-x:auto;margin:16px 0;padding-bottom:8px}.appointment-presets button{min-width:120px;min-height:64px;text-align:left;flex-shrink:0}.appointment-presets b,.appointment-presets small{display:block}.appointment-presets .active{background:var(--accent-soft);border-color:var(--teal);color:var(--accent-text)}
.appointment-target{display:flex;flex-direction:column;gap:5px;background:var(--accent-soft);padding:14px;border-radius:10px;color:var(--accent-text)}.appointment-target small{color:inherit}.schedule-preview{font-size:.85rem;color:var(--accent-text);background:var(--surface-alt);padding:12px;border-radius:8px}
.appointment-dialog{width:min(640px,calc(100vw - 24px))}.appointment-dialog textarea{min-height:130px}.appointment-save{position:sticky;bottom:-1px;background:var(--surface);padding:14px 0 5px;border-top:1px solid var(--line);z-index:2}.appointment-save button{min-height:48px}
.preset-manager{display:grid;gap:12px;margin-bottom:18px}.preset-manager article{border:1px solid var(--line);border-radius:10px;padding:14px}.preset-manager small{display:block;color:var(--muted)}.preset-manager p{white-space:pre-wrap;overflow-wrap:anywhere}.form-error{color:#b22a39;line-height:1.5;margin:12px 0}[data-theme="dark"] .form-error{color:#ffafba}
.organized-contacts{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}.organized-contact>.row>div:last-child{min-width:0;overflow-wrap:anywhere}.organized-contact>.row>div:last-child b{font-size:1.05rem}.organized-contact .contact-origin{display:block;margin:14px 0 10px;color:var(--accent-text);font-size:.84rem}.organized-contact>.row .badge{white-space:normal}.contact-filters{padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}#more-contacts{display:block;margin:20px auto;min-height:46px}#more-contacts[hidden]{display:none}
@media(max-width:760px){
 .shell,.main{height:var(--app-height,100dvh)!important;min-height:0}.main>.topbar{flex:0 0 auto;height:58px;min-height:58px}.topbar .user>span,.topbar .user .avatar{display:none}.top-company small{font-size:.65rem}
 .main>.page{min-height:0;overflow:auto}.home-shortcuts{grid-template-columns:1fr}.home-shortcuts button{min-height:76px;padding:18px}.pagehead{align-items:flex-start;flex-wrap:wrap;gap:12px}.pagehead>.row{width:100%;flex-wrap:wrap}.pagehead button{min-height:44px}
 .main>.page.inbox-page{padding:0;display:flex;min-height:0;overflow:hidden}.inbox-page>.pagehead{display:flex;margin:0;padding:8px 10px;border-bottom:1px solid var(--line);background:var(--surface)}.inbox-page>.pagehead>div:first-child{display:none}.inbox-page>.pagehead>.row{gap:6px;flex-wrap:nowrap}.inbox-page>.pagehead button{min-height:40px;padding:8px;font-size:.76rem}#inbox-sync{display:none}#sound-settings{max-width:150px;overflow:hidden;white-space:nowrap}
 .inbox-connection-picker{display:flex;align-items:center;gap:10px;flex:0 0 auto;padding:8px 10px;background:var(--surface);border-bottom:1px solid var(--line)}.inbox-connection-picker label{font-size:.75rem;max-width:82px;margin:0;flex-shrink:0}.inbox-connection-picker select{flex:1;width:0;min-width:0;min-height:46px;padding:9px;font-size:16px}
 .inbox-page>.inbox-connections{display:none}.inbox-page>.inbox{flex:1 1 0;height:auto!important;min-height:0!important;width:100%;border-radius:0;border:0}.inbox>.contacts,.inbox>.chat{height:100%;max-height:none;min-height:0}.contacts>.search{padding:10px}.contacts>.search input{min-height:44px;font-size:16px}.conversation-filters{padding:5px 8px;gap:5px}.conversation-filters button{min-height:44px;padding:8px;font-size:.78rem}
 .contactitem{min-height:91px;padding:13px 12px;gap:12px}.contactitem strong{font-size:1rem}.contactitem p{font-size:.86rem;line-height:1.4}.contactitem .badge{font-size:.7rem}.contact-connection{max-width:260px;font-size:.77rem}
 .chathead{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:9px 10px}.mobile-chat-back{width:44px;height:44px}.chathead>div:nth-child(2){flex:1;min-width:0}.chathead>div:nth-child(2) b{font-size:1rem}.chathead>.row{width:100%;max-width:none;display:flex;gap:8px;overflow:visible}.chathead>.row button{min-height:42px;font-size:.78rem;flex:1;white-space:normal;padding:8px}
 .chat-return-tools{padding:8px 10px;gap:7px;flex-wrap:nowrap;overflow-x:auto}.chat-return-tools button{flex-shrink:0;min-height:46px;font-size:.84rem;padding:10px 12px}#schedule{font-weight:750}#contact-details-mobile{display:block}#contact-returns{max-width:210px}
 .messages{min-height:0;flex:1;padding:12px 10px;overscroll-behavior:contain}.bubble{max-width:92%;font-size:1rem;line-height:1.5}.message-media :is(img,video){max-height:220px}.composer{flex:0 0 auto;padding:8px 10px max(8px,env(safe-area-inset-bottom));max-height:none;overflow:visible}.composer textarea{font-size:16px;min-height:48px;height:52px;max-height:100px}.composer>.row{display:flex;flex-wrap:nowrap;align-items:stretch;gap:8px}.composer>.row>.row{display:flex;flex:1;min-width:0;overflow-x:auto;gap:6px;flex-wrap:nowrap}.composer>.row>.row button{min-height:44px;flex:0 0 auto;max-width:none;padding:9px 11px;font-size:.8rem;text-overflow:clip}.composer>.row>.primary{min-height:44px;flex:0 0 auto;font-size:.9rem;padding:10px 12px}.composer .check{min-height:34px;margin:4px 0;font-size:.8rem}.composer>small{display:none}.composer .mini:empty{display:none}
 body.keyboard-open .inbox-page>.pagehead,body.keyboard-open .inbox-connection-picker,body.keyboard-open .chathead>.row,body.keyboard-open .chat-return-tools{display:none}body.keyboard-open .main>.topbar{height:44px;min-height:44px}body.keyboard-open .top-company small{display:none}body.keyboard-open .chathead{padding:4px 8px}
 dialog{max-height:calc(var(--app-height,100dvh) - 16px);overflow-y:auto}dialog input,dialog textarea,dialog select{font-size:16px}dialog button{min-height:44px}.appointment-dialog{padding:16px;max-width:calc(100vw - 16px)}.appointment-dialog .check{min-height:44px;align-items:center}.appointment-save{padding-bottom:max(8px,env(safe-area-inset-bottom));gap:8px}.appointment-save .primary{flex:1}.appointment-toolbar{gap:10px}.appointment-toolbar select,.contact-filter-options select,.contact-filters input{font-size:16px;min-height:46px}.appointment-list,.organized-contacts{grid-template-columns:minmax(0,1fr)}.appointment-card,.organized-contact{padding:16px}.contact-filter-options{grid-template-columns:1fr 1fr}.contact-filter-options>.field:first-child{grid-column:1/-1}.contact-filters{padding:13px}.appointment-actions button{font-size:.85rem}
}
@media(max-width:760px) and (max-height:650px){
 .inbox-page:has(.chat)>.pagehead{display:none}.chat-return-tools{padding:5px 8px}.chathead{padding:4px 8px}.composer{padding-top:5px}.composer .check{margin:0;min-height:28px}.messages{padding:8px}
}

.appointment-dialog[open]{display:flex;flex-direction:column;overflow:hidden;height:min(760px,calc(var(--app-height,100dvh) - 24px));max-height:calc(var(--app-height,100dvh) - 24px)}.appointment-dialog>.dialoghead{flex:0 0 auto}.appointment-dialog #modalform{display:flex;flex-direction:column;min-height:0;flex:1;overflow:hidden}.appointment-fields{min-height:0;overflow-y:auto;padding-right:5px;flex:1}.appointment-save{flex:0 0 auto;position:static;margin-top:10px}

/* 0.1.33: always recognizable mobile navigation, one scrollable menu. */
.mobile-menu-close{display:none}
.campaign-rules{padding:16px;background:var(--surface-alt);border:1px solid var(--line);border-radius:12px;margin-bottom:18px}
@media(max-width:760px){
 .mobile-menu{display:flex;align-items:center;justify-content:center;gap:6px;flex:0 0 88px;width:88px;min-height:44px;font-size:16px;font-weight:750;background:#087f83;color:white;border:2px solid #55ddd0;border-radius:10px}
 .topbar .top-company{min-width:0}.topbar .top-install{display:none}
 .sidebar{overflow-y:auto;overscroll-behavior:contain;width:min(350px,94vw);height:var(--app-height,100dvh);gap:8px}
 .sidebar nav{overflow:visible;flex:0 0 auto}.sidebar .brand,.sidebar .saas-menu,.sidebar .sidebottom{flex-shrink:0}
 .sidebar .navbtn{min-height:48px;font-size:16px;white-space:normal;color:#e0eaf7}
 .mobile-menu-close{display:block;position:sticky;top:0;z-index:2;min-height:46px;width:100%;background:#fff;color:#102a43;border:2px solid #58dccc;font-size:16px;font-weight:700}
 .shell.flow-focus .topbar{display:flex}.shell.flow-focus>.sidebar{display:flex}
 .campaign-card-actions button,.campaign-rules .check{min-height:44px}.campaign-rules input[type=checkbox]{width:22px;height:22px;flex-shrink:0}
}

/* Delivery results remain readable in narrow agenda cards. */
.appointment-card>.row.spread{flex-wrap:wrap;align-items:flex-start;gap:10px}.appointment-card .badge{white-space:normal;max-width:100%;overflow-wrap:anywhere}.appointment-card>.row.spread>b{overflow-wrap:anywhere;min-width:0}