/* Shared appearance controls. Each browser remembers its selection for both UIs. */
.theme-switcher{position:relative;display:inline-flex;align-items:center;flex-shrink:0;height:34px;color:#7a879e;border-radius:7px;background:var(--surface);border:1px solid var(--line)}
.theme-switcher>[data-theme-icon]{position:absolute;left:9px;display:flex;pointer-events:none}
.theme-switcher .icon{width:16px;height:16px}
.theme-switcher select{margin:0;width:124px;height:100%;border:0;border-radius:inherit;background:transparent;color:inherit;padding:0 20px 0 33px;font-size:11px;cursor:pointer;box-shadow:none}
.theme-switcher:focus-within{outline:2px solid #92a8fc;outline-offset:2px}
.theme-switcher.compact{width:34px;border-color:transparent;background:transparent}
.theme-switcher.compact select{width:34px;padding:0;color:transparent;appearance:none}
.theme-switcher.compact option{color:var(--text);font-size:13px;background:var(--surface)}
.theme-switcher.compact:hover{background:#edf1f8}
.login-theme{position:absolute;right:32px;top:29px;z-index:2}
.appearance-setting{padding:18px;border:1px solid var(--line);border-radius:8px;margin-bottom:22px;background:#fafbfe}
.appearance-setting>div{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;color:var(--text)}
.appearance-setting p{font-size:11px;line-height:1.8;color:#6f7d94;margin:10px 0 0}
.account-security-note{display:flex;gap:10px;align-items:flex-start;margin-bottom:23px;padding:14px;border:1px solid var(--line);border-radius:8px;background:#f8faff;color:#6d7e9a;font-size:12px;line-height:1.8}
.account-security-note .icon{width:17px;height:17px;margin-top:2px}
.account-divider{border:0;border-top:1px solid var(--line);margin:24px 0}
.account-dialog-action{margin:6px 0 4px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 0;border-top:1px solid var(--line);font-size:12px;color:#7f8da4}

/* The chat window itself is centered, with branding and footer in equal outer rows. */
@media(min-width:641px){
  .visitor-body:not(.embedded) #app.visitor-layout{height:100dvh;min-height:0;display:grid;grid-template-rows:minmax(40px,1fr) auto minmax(40px,1fr)}
  .visitor-body:not(.embedded) .visitor-topline{height:40px;align-self:end}
  .visitor-body:not(.embedded) .chat-window{position:relative;height:clamp(min(480px,calc(100dvh - 80px)),var(--chat-window-height,calc(100dvh - 112px)),calc(100dvh - 80px));min-height:0}
  .visitor-body:not(.embedded) .visitor-footer{align-self:start;min-height:40px;padding:13px 0}
  .visitor-body:not(.embedded) .chat-header{min-height:78px;padding-top:14px;padding-bottom:14px}
  .visitor-body:not(.embedded) .composer{padding-top:8px;padding-bottom:12px}
  .visitor-body:not(.embedded) .composer textarea{height:var(--chat-composer-height,44px);min-height:36px;max-height:260px}
}
.chat-resize-handle{display:none}
@media(min-width:641px){
  .visitor-body:not(.embedded) .chat-resize-handle{display:flex;align-items:center;justify-content:center;height:9px;cursor:ns-resize;touch-action:none;user-select:none;z-index:4}
  .chat-resize-handle>span{width:36px;height:3px;border-radius:4px;background:var(--line);transition:background .15s}
  .chat-resize-handle:hover>span,.chat-resize-handle:focus-visible>span{background:var(--accent)}
  .chat-resize-handle:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
  .chat-resize-top,.chat-resize-bottom{position:absolute;left:0;right:0}
  .chat-resize-top{top:0}.chat-resize-bottom{bottom:0}
  .chat-resize-composer{flex-shrink:0;background:var(--surface);border-top:1px solid var(--line)}
  .chat-resize-composer+.composer{border-top:0}
  .chat-resizing,.chat-resizing *{cursor:ns-resize!important;user-select:none!important}
}
@media(max-width:640px){
  .login-theme{top:22px;right:24px}
  .login-theme .theme-switcher select{width:108px;padding-right:10px}
  .topbar-right{gap:5px}
  .topbar-right>.theme-switcher{border:0;background:transparent;width:28px}
  .topbar-right>.theme-switcher>[data-theme-icon]{left:5px}
  .topbar-right>.theme-switcher select{color:transparent;appearance:none;width:28px;padding:0}
  .topbar-right>.theme-switcher option{color:var(--text);font-size:13px;background:var(--surface)}
  .topbar-right>.button{max-width:66px;padding-left:7px;padding-right:7px}
  .admin-breadcrumb{gap:4px;font-size:10px}
  .chat-header .header-identity{flex:1;overflow:hidden}
  .chat-header .header-identity>div{min-width:0}
  .chat-header .header-identity h1{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .chat-header .header-identity p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .chat-header-actions{flex-shrink:0;gap:2px}
  .appearance-setting{padding:14px}
}

html[data-theme=dark]{color-scheme:dark;--text:#dde6f5;--muted:#98a8c0;--surface:#1a2433;--page:#111824;--line:#2b394f;--green:#4bce9f;--shadow:0 18px 60px #00000026;--selected-surface:color-mix(in srgb,var(--accent) 17%,#1a2433);--selected-text:color-mix(in srgb,var(--accent) 45%,#edf0ff)}
html[data-theme=dark] body,html[data-theme=dark] .login-page{background:var(--page);color:var(--text)}
html[data-theme=dark] .chat-window{border-color:var(--line)}
html[data-theme=dark] :is(.admin-sidebar,.admin-topbar,.chat-header,.composer,.inbox-list,.inbox-details,.settings-card,.panel,.stat-card,.provider-card,.link-card,.shortcut-button,.modal,.emoji-picker,.quick-panel,.rating-card,.composer-locked,.login-main){background:var(--surface);border-color:var(--line)}
html[data-theme=dark] :is(.chat-sidebar,.login-aside){background:#151e2c;border-color:var(--line)}
html[data-theme=dark] :is(.chat-main,.inbox-chat){background:#141d2b}
html[data-theme=dark] :is(.visitor-wordmark,.admin-brand,.admin-brand b,.header-identity h1,.sidebar-heading,.page-heading h1,.settings-card header h2,.modal-header h2,.login-form h2,.login-aside h1,.admin-account b,.stat-number){color:#e0e8f7}
html[data-theme=dark] :is(.visitor-topline,.visitor-footer,.sidebar-heading>span,.sidebar-eyebrow,.sidebar-bottom,.service-info span,.service-info small,.page-heading p,.form-description,.field small,.subtle-note,.stat-card-title,.stat-foot,.panel-head span,.provider-detail dt,.provider-detail dd,.link-note,.data-table th,.data-table td,.title-cell small,.table-footer,.settings-card header p,.topbar-date,.admin-breadcrumb,.admin-account small,.nav-item,.sidebar-help,.login-form>p,.login-aside p,.appearance-setting p,.composer-tip,.composer-footer>span,.message-byline,.message-byline time,.message-receipt,.system-message,.date-divider,.chat-announcement,.header-identity p,.detail-row dt,.detail-row dd,.details-profile>small,.conversation-item p,.conversation-item time,.conversation-item-top time,.empty-state,.empty-state p,.loading-panel,.chart-label,.chart-value,.panel-head a){color:#9babc3}
html[data-theme=dark] :is(.field,.check-label,.panel-head h2,.title-cell b,.provider-title h3,.service-info b,.service-row b,.shortcut-button b,.detail-section h3,.details-header,.details-profile h3,.conversation-item b,.schedule-title,.empty-state h3,.quick-option,.quick-option b,.quick-panel-header,.admin-breadcrumb b,.appearance-setting>div,.account-dialog-action){color:#c3d0e5}
html[data-theme=dark] :is(.chat-announcement,.panel-head,.settings-card header,.settings-card footer,.modal-header,.table-footer,.detail-section,.details-profile,.details-header,.admin-account,.service-row+.service-row,.conversation-item,.inbox-tabs,.account-dialog-action){border-color:var(--line)}
html[data-theme=dark] .chat-announcement{background:#182332}
html[data-theme=dark] .bubble{background:#202e42;border-color:#2c3b52;box-shadow:none}
html[data-theme=dark] .message-text{color:#dbe4f4}
html[data-theme=dark] .mine .bubble{background:var(--accent);border-color:var(--accent)}
html[data-theme=dark] .mine .message-text,html[data-theme=dark] .mine .message-text a{color:#fff}
html[data-theme=dark] :is(.message-text a,.login-back){color:#a6baff}
html[data-theme=dark] .avatar-fallback{background:#2b3958;color:#b4c6fb}
html[data-theme=dark] .visitor-avatar{background:#303c50;color:#b6c3d9}
html[data-theme=dark] .date-divider span{background:#223047}
html[data-theme=dark] .ai-label{color:#a1b8ee;border-color:#3b5076}
html[data-theme=dark] .conversation-nav.active,html[data-theme=dark] .nav-item.active,html[data-theme=dark] .settings-nav button.active{background:var(--selected-surface);color:var(--selected-text)}
html[data-theme=dark] :is(.nav-item.active .icon,.conversation-nav .icon){color:var(--selected-text)}
html[data-theme=dark] .conversation-nav small{color:#a6b6d4}
html[data-theme=dark] .conversation-item.active{background:var(--selected-surface)}
html[data-theme=dark] :is(.conversation-item:hover,.nav-item:hover:not(.active),.icon-button:hover,.theme-switcher.compact:hover,.emoji-picker button:hover,.quick-option:hover){background:#2a384e;color:#d7e3f6}
html[data-theme=dark] .icon-button{color:#a9b8d1}
html[data-theme=dark] :is(.button,.date-label){background:#1d2a3d;border-color:#354761;color:#c5d3e9}
html[data-theme=dark] .theme-switcher.compact{background:transparent;border-color:transparent}
html[data-theme=dark] .button:hover:not(:disabled){background:#2b3c55;border-color:#52688a}
html[data-theme=dark] .button.primary{background:var(--accent);border-color:var(--accent);color:#fff}
html[data-theme=dark] .button.primary:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}
html[data-theme=dark] .button.quiet{background:transparent;border-color:transparent}
html[data-theme=dark] .button.danger{background:#3c2430;border-color:#6e3e50;color:#ffb3c0}
html[data-theme=dark] :is(.field input:not([type=checkbox]):not([type=color]),.field textarea,.field select,.input,.search-input input,.detail-section textarea){background:#131e2e;border-color:#34445c;color:#d9e4f6}
html[data-theme=dark] .field input[type=color]{background:#182435;border-color:#34445c}
html[data-theme=dark] :is(.field input::placeholder,.field textarea::placeholder,.input::placeholder,.composer textarea::placeholder,.search-input input::placeholder){color:#8596b0}
html[data-theme=dark] .composer textarea{color:#e0e9f8}
html[data-theme=dark] :is(.form-error){background:#3d2330;border-color:#6b3549;color:#ffb8c5}
html[data-theme=dark] :is(.preview-note,.setup-note,.sidebar-help,.appearance-setting,.account-security-note,.code-box,.login-art){background:#1d2b40;border-color:#31425f;color:#a8bbda}
html[data-theme=dark] .question-button{background:#20314b;border-color:#354c70;color:#c1d2f5}
html[data-theme=dark] .question-button:hover{background:#2a4062;border-color:#5c79b0}
html[data-theme=dark] .suggested-questions>div{color:#9caed0}
html[data-theme=dark] .data-table{background:var(--surface)}
html[data-theme=dark] .data-table th{background:#162130;border-color:var(--line)}
html[data-theme=dark] .data-table td{border-color:var(--line)}
html[data-theme=dark] :is(.tag,.badge){background:#29374c;border-color:#3a4a63;color:#b3c1d9}
html[data-theme=dark] .badge.green,html[data-theme=dark] .online-select{background:#183e36;color:#85dfbd}
html[data-theme=dark] .badge.blue{background:#293b63;color:#b5c8ff}
html[data-theme=dark] .badge.orange{background:#483a26;color:#efca8a}
html[data-theme=dark] .badge.red{background:#452937;color:#efadbc}
html[data-theme=dark] :is(.service-icon,.provider-title .icon-box){background:#263653;border-color:#394e72;color:#b0c5f3}
html[data-theme=dark] .nav-count{background:#354972;color:#d7e2ff}
html[data-theme=dark] .chart{background:repeating-linear-gradient(to top,transparent 0,transparent 39px,#2a364a 40px,#2a364a 41px)}
html[data-theme=dark] .chart-bar{background:#3b517d}
html[data-theme=dark] .chart-column:last-child .chart-bar{background:#879fed}
html[data-theme=dark] .segmented{background:#142032}
html[data-theme=dark] .segmented button.active{background:#30425e;color:#dce7fa}
html[data-theme=dark] .day-picker span{background:#172335;border-color:#34465f;color:#acbdd6}
html[data-theme=dark] .day-picker input:checked+span{background:#334a76;border-color:#748ece;color:#dde8ff}
html[data-theme=dark] .switch span{background:#42506a}
html[data-theme=dark] .switch input:checked+span{background:var(--accent)}
html[data-theme=dark] .new-message{background:#203450;border-color:#405984;color:#c6d7ff}
html[data-theme=dark] .quick-option{background:var(--surface);border-color:var(--line)}
html[data-theme=dark] .drop-indicator{background:#233956f2;border-color:#8ba9ed;color:#d1e0ff}
html[data-theme=dark] .modal-backdrop{background:#050b16b8}
html[data-theme=dark] .art-avatar,html[data-theme=dark] .login-art-head i{background:#394d72}
html[data-theme=dark] .art-bubble{background:#2a3b59;color:#bfcfe9}
html[data-theme=dark] .art-message.reverse .art-bubble{background:#536dba;color:#fff}
html[data-theme=dark] .expired-image{color:#a8b8d0}
html[data-theme=dark] .rating-star:hover{color:#efc67d}
@media(max-width:360px){.admin-breadcrumb{display:none}}