/* Chatwoot-calibrated workspace typography and neutral product palette. */
@font-face{font-family:"Inter";src:url("/assets/fonts/inter-variable.woff2") format("woff2");font-style:normal;font-weight:100 900;font-display:swap}
:root{--blue:#2781f6;--blue-dark:#1073e9;--ink:#1c2024;--text:#60646c;--muted:#80838d;--line:#ececec;--line-strong:#e2e3e7;--canvas:#f7f7f7;--surface:#fff;--shadow:none}
html,body,button,input,textarea,select{font-family:"Inter","PingFang SC","HarmonyOS Sans SC","Microsoft YaHei UI","Microsoft YaHei",-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif!important}
body{color:var(--text);font-size:14px;font-weight:420;line-height:21px;letter-spacing:-.28px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,strong,b{color:var(--ink);letter-spacing:-.27px}

.shell{background:var(--canvas)}
.sidebar,.admin-shell .sidebar{border-color:var(--line);background:var(--surface);color:var(--text)}
.sidebar>.brand{border-color:var(--line);background:var(--surface)}
.sidebar .brand,.sidebar .brand.dark{color:var(--ink);font-size:20px;font-weight:620;letter-spacing:-.3px}
.nav-section-label{margin-top:15px;margin-bottom:6px;color:#777b84;font-size:11.5px;font-weight:460;letter-spacing:-.04px;text-transform:none}
.nav-item{height:42px;color:#4f545c;font-size:15px;font-weight:440;line-height:22px;letter-spacing:-.18px}
.nav-item>.icon,.nav-item:nth-child(n)>.icon{width:20px;height:20px;flex-basis:20px;color:#60646c;stroke-width:1.9}
.nav-item:hover{background:#f9f9fb;color:#1c2024}.nav-item:hover>.icon{color:#60646c}
.nav-item.active,.admin-shell .sidebar .nav-item.active{background:#f0f0f3;color:#202327;font-weight:540}
.nav-item.active:before{display:none}.nav-item.active>.icon{color:#2781f6}
.sidebar-bottom{background:linear-gradient(180deg,rgba(255,255,255,0),#fff 18%)}
.sidebar-plan{border-color:#e2e3e7;background:#fcfcfd;color:#60646c}.sidebar-plan small{color:#8b8d98}

.topbar{border-color:var(--line);background:rgba(255,255,255,.96)}
.global-search{border-color:#e2e3e7;background:#f9f9fb;color:#8b8d98}.global-search input{color:#1c2024;font-size:14px;font-weight:420;line-height:21px;letter-spacing:-.28px}.global-search input::placeholder{color:#8b8d98}
.global-search:focus-within{border-color:#9bc3fc;background:#fff;box-shadow:0 0 0 3px rgba(39,129,246,.12)}
.topbar-right,.workspace-picker,.top-icon,.topbar-right>.btn{color:#60646c}.user-button{color:#1c2024;font-size:14px;font-weight:460}
.page-content{background:transparent}.page-heading{margin-bottom:16px}.page-heading h1{margin-bottom:2px;color:#1c2024;font-size:18px;font-weight:520;line-height:24px;letter-spacing:-.27px}.page-heading p{color:#80838d;font-size:12px;font-weight:440;line-height:16px;letter-spacing:-.24px}

.card,.page-toolbar,.inbox-tabsbar,.conversation-pane,.chat-pane{border-color:#ececec;background:#fff;box-shadow:none}
.card{border-radius:12px}.card:hover{border-color:#e2e3e7}.card-heading h2{color:#1c2024;font-size:16px;font-weight:500;line-height:24px}
.btn{min-height:36px;border-color:#e2e3e7;border-radius:8px;background:#fff;color:#1c2024;font-size:14px;font-weight:460;line-height:21px;letter-spacing:-.28px;box-shadow:none}.btn:hover{border-color:#cdced6;background:#f9f9fb}.btn.primary{border-color:#2781f6;background:#2781f6;color:#fff;box-shadow:none}.btn.primary:hover{border-color:#1073e9;background:#1073e9;box-shadow:none}.btn.small{font-size:12px;font-weight:440;line-height:18px;letter-spacing:-.24px}
.badge{font-size:12px;font-weight:440;line-height:16px}.badge.blue{background:#e9f3ff;color:#086de0}.badge.green{background:#e0f8f3;color:#008573}.badge.orange{background:#fff7c2;color:#ab6400}.badge.gray{background:#f0f0f3;color:#60646c}
.icon-tile,.metric .icon-tile{border-color:#e2e3e7;background:#f9f9fb;color:#60646c}.icon-tile.green{border-color:#ccefe8;background:#e0f8f3;color:#008573}.icon-tile.purple{border-color:#e6e7ff;background:#f0f1fe;color:#5151cd}.icon-tile.orange{border-color:#f3d673;background:#fff7c2;color:#ab6400}
.metric strong{color:#1c2024;font-size:22px;font-weight:520}.metric .metric-top span:not(.icon-tile){color:#60646c;font-size:12px;font-weight:440;line-height:16px}.metric-note{color:#8b8d98!important;font-size:11px!important}
.tabs{border-color:#ececec}.tabs>a,.tab{color:#60646c;font-size:14px;font-weight:420;line-height:21px}.tabs>a.active,.tab.active{border-color:#2781f6;color:#086de0;font-weight:520}.tab.active:after{background:#2781f6}
.notice{border-color:#e2e3e7;background:#f9f9fb;color:#60646c;font-size:12px;font-weight:440;line-height:16px}.notice.success{border-color:#ccefe8;background:#f3fbf9;color:#008573}.notice.warning{border-color:#f3d673;background:#fffbea;color:#ab6400}

table{color:#60646c;font-size:14px;font-weight:420;line-height:21px}th{border-color:#ececec;background:#f9f9fb;color:#60646c;font-size:12px;font-weight:440;line-height:16px;letter-spacing:-.24px}td{border-color:#ececec;color:#60646c}td strong{color:#1c2024;font-weight:520}tbody tr:hover td{background:#fcfcfd}
.field{color:#60646c;font-size:14px;font-weight:420}.field>span{color:#1c2024;font-size:14px;font-weight:500;line-height:21px}.field input,.field textarea,.field select{border-color:#e2e3e7;border-radius:8px;color:#1c2024;font-size:14px;font-weight:420;line-height:21px;letter-spacing:-.21px}.field input:focus,.field textarea:focus,.field select:focus{border-color:#75abf7;outline:3px solid rgba(39,129,246,.12)}.field small{color:#80838d;font-size:12px;font-weight:440;line-height:16px}.toggle-row strong{font-size:14px;font-weight:500}.toggle-row small{color:#80838d;font-size:12px;line-height:16px}.switch:checked{background:#2781f6}

.settings-form-intro>span{background:#e9f3ff;color:#2781f6}.settings-form-intro h2{font-size:18px;font-weight:520;line-height:24px}.settings-form-intro p{color:#80838d;font-size:12px;line-height:16px}.settings-anchor-nav a{color:#60646c;font-size:12px;font-weight:440;line-height:16px}.settings-anchor-nav a:hover{background:#f0f0f3;color:#1c2024}.settings-section-head h3{font-size:14px;font-weight:500;line-height:21px}.settings-section-head p{color:#80838d;font-size:12px;line-height:16px}.settings-section-head>span{background:#f0f0f3;color:#60646c;font-size:10px}
.service-identity,.quick-answer-row,.contact-channel-card,.settings-switch-grid{border-color:#ececec;background:#fcfcfd}.service-identity>div:last-child>strong,.template-picker legend,.quick-answer-editor legend,.contact-editor legend{font-size:14px;font-weight:500;line-height:21px}.service-identity>div:last-child>small,.template-picker>p,.quick-answer-editor>p,.contact-editor>p{color:#80838d;font-size:12px;line-height:16px}.template-choice{border-color:#e2e3e7}.template-choice:has(input:checked){border-color:#75abf7;background:#f5f9ff;box-shadow:0 0 0 2px rgba(39,129,246,.1)}.template-choice>strong{font-size:12px;font-weight:500}.template-choice>small{font-size:10px}
.quick-answer-row label>span,.contact-channel-heading strong{font-size:12px;font-weight:500}.quick-answer-row input,.quick-answer-row textarea{font-size:14px}.settings-savebar{border-color:#ececec}.settings-savebar>span strong{font-size:12px;font-weight:500}.settings-savebar>span small{font-size:11px}.settings-preview-card .card-heading>div h2{font-size:16px;font-weight:500}.settings-preview-card .card-heading>div p{font-size:12px}.preview-sync-note{background:#f3fbf9;color:#008573}.preview-sync-note strong{font-size:12px}.preview-sync-note small{font-size:11px}
.conversation-item.active{background:#f0f0f3}.conversation-item.active:before{background:#2781f6}.send-circle{background:#2781f6}.chat-msg.mine .message-body{background:#2781f6}

@media(max-height:980px) and (min-width:801px){.nav-section-label{margin-top:10px;margin-bottom:4px;font-size:11px;font-weight:460}.nav-item{height:38px;font-size:14.5px;font-weight:440}.nav-item.active,.admin-shell .sidebar .nav-item.active{font-weight:540}.nav-item>.icon,.nav-item:nth-child(n)>.icon{width:19px;height:19px;flex-basis:19px}.sidebar-plan .btn{font-size:12px}}
@media(max-width:800px){
  input,textarea,select{font-size:16px!important}
  #message-feed{overflow-x:hidden!important}
  .chat-image-message,.chat-video-message,.chat-file-wrap{width:min(272px,calc(100vw - 121px))!important;max-width:calc(100vw - 121px)!important}
  .chat-image-message>.chat-image-download,.chat-video-message>.chat-image-download,.chat-file-wrap>.chat-image-download{right:-48px!important}
  .chat-msg.mine .chat-image-message>.chat-image-download,.chat-msg.mine .chat-video-message>.chat-image-download,.chat-msg.mine .chat-file-wrap>.chat-image-download{right:auto!important;left:-48px!important}
}

/* v1.4: keep the create-site preview to one clear product frame. */
.site-create-grid>.card:last-child{
  align-self:start;
  overflow:hidden;
}
.site-create-grid>.card:last-child .chat-preview-shell{
  display:grid;
  place-items:center;
  width:100%;
  height:auto;
  padding:10px 0 0;
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.site-create-grid>.card:last-child .chat-page-preview{
  width:min(100%,520px);
  height:500px;
  border:1px solid #e1e3e7;
  border-radius:14px;
  box-shadow:0 12px 32px rgba(28,32,36,.08);
}
.site-create-grid>.card:last-child .chat-preview-welcome{
  padding:0 0 14px;
  border:0;
  border-bottom:1px solid #eceef1;
  border-radius:0;
  background:transparent;
}
.site-create-grid>.card:last-child .chat-preview-body{
  background:#fff;
}
@media(max-width:800px){
  .site-create-grid>.card:last-child .chat-preview-shell{padding-top:6px}
  .site-create-grid>.card:last-child .chat-page-preview{height:460px}
}

/* v1.5: previews are the standalone chat window, not framed canvases. */
.settings-preview-card,
.site-create-grid>.card:last-child{
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  overflow:visible;
}
.settings-preview-card .card-heading,
.site-create-grid>.card:last-child .card-heading{
  margin:0 0 12px;
  padding:0;
}
.settings-preview-card>#widget-settings-preview{
  display:block;
  min-height:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
}
.settings-preview-card .chat-preview-shell,
.site-create-grid>.card:last-child .chat-preview-shell{
  display:block;
  width:100%;
  height:auto;
  padding:0;
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.settings-preview-card .chat-page-preview,
.site-create-grid>.card:last-child .chat-page-preview{
  width:100%;
  height:620px;
  min-height:0;
  overflow:hidden;
  border:1px solid #dfe2e7;
  border-radius:15px;
  background:#fff;
  box-shadow:0 14px 36px rgba(28,32,36,.09);
}
.settings-preview-card .chat-preview-body,
.site-create-grid>.card:last-child .chat-preview-body{
  min-height:0;
  padding:18px;
  background:#f7f8fa;
}
.settings-preview-card .chat-preview-welcome,
.site-create-grid>.card:last-child .chat-preview-welcome{
  width:fit-content;
  max-width:76%;
  padding:10px 12px;
  border:0;
  border-radius:4px 13px 13px;
  background:#fff;
  box-shadow:none;
}
.settings-preview-card .preview-sync-note{
  width:fit-content;
  margin-top:10px;
  padding:0;
  border:0;
  background:transparent;
}
@media(max-width:800px){
  .settings-preview-card .chat-page-preview,
  .site-create-grid>.card:last-child .chat-page-preview{height:540px}
}