/* TS WhatsApp 11.6.0 — Modern Product UI / Human Inbox
   Final visual layer. Loaded after all legacy styles. */

:root{
  --ts-bg:#f4f7f8;
  --ts-shell:#ffffff;
  --ts-panel:#ffffff;
  --ts-panel-2:#f7f9fa;
  --ts-panel-3:#eef3f4;
  --ts-line:#dde5e8;
  --ts-line-soft:#e9eef0;
  --ts-text:#17242b;
  --ts-text-2:#43525a;
  --ts-muted:#7a8990;
  --ts-green:#17b889;
  --ts-green-strong:#0f9d75;
  --ts-green-soft:#e7f8f2;
  --ts-green-line:#bcebdc;
  --ts-danger:#dc5c65;
  --ts-warning:#bd852f;
  --ts-blue:#4a8fd8;
  --ts-shadow:0 10px 30px rgba(29,48,56,.07);
  --ts-shadow-sm:0 2px 8px rgba(29,48,56,.055);
  --ts-radius:14px;
  --ts-radius-sm:10px;
  --ts-font:Inter,"Segoe UI Variable","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
html[data-theme="dark"]{
  --ts-bg:#0b1115;
  --ts-shell:#0e171c;
  --ts-panel:#111b20;
  --ts-panel-2:#0d151a;
  --ts-panel-3:#162229;
  --ts-line:#24333b;
  --ts-line-soft:#1d2a31;
  --ts-text:#eaf1f3;
  --ts-text-2:#b0bec4;
  --ts-muted:#75868e;
  --ts-green:#20c997;
  --ts-green-strong:#19b387;
  --ts-green-soft:rgba(32,201,151,.11);
  --ts-green-line:rgba(32,201,151,.24);
  --ts-shadow:0 18px 46px rgba(0,0,0,.20);
  --ts-shadow-sm:0 3px 12px rgba(0,0,0,.16);
}

/* ---------- Global typography ---------- */
html,body{font-family:var(--ts-font)!important;font-size:14px!important;text-rendering:optimizeLegibility!important;-webkit-font-smoothing:antialiased!important}
body.app-body{background:var(--ts-bg)!important;color:var(--ts-text)!important;font-weight:400!important;letter-spacing:0!important}
body.app-body *{font-family:var(--ts-font)!important}
body.app-body :is(b,strong){font-weight:600!important}
body.app-body :is(h1,h2,h3,h4,h5,h6){font-weight:600!important;letter-spacing:-.018em!important;color:var(--ts-text)!important}
body.app-body p,body.app-body small,body.app-body label,body.app-body td,body.app-body th,body.app-body input,body.app-body textarea,body.app-body select,body.app-body button{font-weight:400!important}
body.app-body :is(.eyebrow,.sidebar-label,.account-label){font-weight:600!important;letter-spacing:.055em!important;text-transform:uppercase!important}

/* ---------- App shell ---------- */
body.app-body .app-shell{background:var(--ts-bg)!important}
body.app-body .sidebar{background:var(--ts-shell)!important;border-right:1px solid var(--ts-line-soft)!important;box-shadow:none!important}
body.app-body .brand-row{min-height:64px!important;border-bottom:1px solid var(--ts-line-soft)!important}
body.app-body .brand{gap:10px!important}
body.app-body .brand-mark{border-radius:12px!important;box-shadow:none!important}
body.app-body .brand-copy b{font-size:13px!important;font-weight:600!important}
body.app-body .brand-copy span{font-size:10px!important;font-weight:400!important;color:var(--ts-muted)!important}
body.app-body .sidebar-label{font-size:9px!important;color:var(--ts-muted)!important;margin-top:14px!important}
body.app-body .side-nav{gap:3px!important}
body.app-body .nav-item{min-height:40px!important;border-radius:10px!important;color:var(--ts-text-2)!important;font-size:12.5px!important;font-weight:500!important;border:0!important;background:transparent!important;box-shadow:none!important}
body.app-body .nav-item:hover{background:var(--ts-panel-2)!important;color:var(--ts-text)!important;transform:none!important}
body.app-body .nav-item.active{background:var(--ts-green-soft)!important;color:var(--ts-green-strong)!important;box-shadow:none!important}
body.app-body .nav-icon{opacity:.88!important}
body.app-body .nav-badge{font-size:9px!important;font-weight:600!important;min-width:18px!important;height:18px!important;border-radius:999px!important}
body.app-body .cloud-status{border:1px solid var(--ts-line-soft)!important;background:var(--ts-panel-2)!important;border-radius:11px!important;box-shadow:none!important}

body.app-body .workspace{background:var(--ts-bg)!important}
body.app-body .topbar{min-height:64px!important;height:64px!important;padding:0 16px!important;background:color-mix(in srgb,var(--ts-shell) 96%,transparent)!important;border-bottom:1px solid var(--ts-line-soft)!important;box-shadow:none!important;backdrop-filter:blur(14px)!important;gap:10px!important}
body.app-body .breadcrumb{font-size:12px!important;font-weight:400!important;color:var(--ts-muted)!important}
body.app-body .breadcrumb strong{font-weight:600!important;color:var(--ts-text)!important}
body.app-body .workspace-switcher,body.app-body .workspace-static{height:42px!important;min-height:42px!important;padding:5px 10px!important;border:1px solid var(--ts-line)!important;border-radius:11px!important;background:var(--ts-panel)!important;box-shadow:none!important}
body.app-body .workspace-switcher span,body.app-body .workspace-static span{font-size:8.5px!important;font-weight:600!important;color:var(--ts-muted)!important;letter-spacing:.04em!important}
body.app-body .workspace-switcher select{font-size:12px!important;font-weight:600!important;background:transparent!important;border:0!important;box-shadow:none!important;padding:0 20px 0 0!important}
body.app-body .topbar-search input{height:42px!important;border-radius:11px!important;border:1px solid var(--ts-line)!important;background:var(--ts-panel)!important;color:var(--ts-text)!important;font-size:12.5px!important;box-shadow:none!important;padding:0 13px!important}
body.app-body .topbar-right{gap:7px!important}
body.app-body :is(.notif-chip,.help-chip,.menu-toggle){height:38px!important;min-height:38px!important;border-radius:10px!important;border:1px solid var(--ts-line)!important;background:var(--ts-panel)!important;color:var(--ts-text-2)!important;box-shadow:none!important}
body.app-body .account-trigger{height:44px!important;min-height:44px!important;padding:4px 8px!important;border:1px solid var(--ts-line)!important;border-radius:12px!important;background:var(--ts-panel)!important;color:var(--ts-text)!important;box-shadow:none!important}
body.app-body .account-trigger:hover{border-color:var(--ts-green-line)!important;background:var(--ts-panel-2)!important;transform:none!important}
body.app-body .account-trigger .avatar{width:31px!important;height:31px!important;border-radius:9px!important;background:var(--ts-panel-3)!important;color:var(--ts-green-strong)!important;font-size:11px!important;font-weight:600!important}
body.app-body .user-copy b{font-size:11px!important;font-weight:600!important}
body.app-body .user-copy span{font-size:9px!important;font-weight:400!important;color:var(--ts-muted)!important}
body.app-body .account-dropdown{border-radius:14px!important;border:1px solid var(--ts-line)!important;background:var(--ts-panel)!important;box-shadow:var(--ts-shadow)!important}

body.app-body .content{padding:14px!important;gap:12px!important}
body.app-body .page-heading{margin:0!important;padding:2px 2px 4px!important}
body.app-body .page-heading h1{font-size:20px!important;font-weight:600!important}
body.app-body .page-heading p{font-size:12.5px!important;color:var(--ts-muted)!important}

/* ---------- Global surfaces/components ---------- */
body.app-body :is(.card,.panel,.settings-card,.section-card,.detail-card,.table-wrap,.modal-card,.sheet,.stat-card,.dashboard-card){border:1px solid var(--ts-line)!important;border-radius:var(--ts-radius)!important;background:var(--ts-panel)!important;box-shadow:var(--ts-shadow-sm)!important;transform:none!important}
body.app-body :is(.card,.panel,.settings-card,.section-card,.detail-card):hover{transform:none!important}
body.app-body :is(input:not([type="checkbox"]):not([type="radio"]),textarea,select){border:1px solid var(--ts-line)!important;border-radius:10px!important;background:var(--ts-panel)!important;color:var(--ts-text)!important;box-shadow:none!important;font-size:13px!important;font-weight:400!important}
body.app-body :is(input:not([type="checkbox"]):not([type="radio"]),select){min-height:40px!important}
body.app-body textarea{line-height:1.45!important}
body.app-body :is(input,textarea,select):focus{border-color:var(--ts-green)!important;box-shadow:0 0 0 3px var(--ts-green-soft)!important;outline:0!important}
body.app-body button,body.app-body .btn,body.app-body a.button{min-height:36px!important;border-radius:10px!important;font-size:12px!important;font-weight:500!important;box-shadow:none!important;transform:none!important}
body.app-body button:hover,body.app-body .btn:hover,body.app-body a.button:hover{transform:none!important}
body.app-body table{font-size:12.5px!important}
body.app-body th{font-size:10px!important;font-weight:600!important;letter-spacing:.035em!important;color:var(--ts-muted)!important;text-transform:uppercase!important;background:var(--ts-panel-2)!important}
body.app-body td{font-weight:400!important;color:var(--ts-text-2)!important}
body.app-body tr:hover td{background:color-mix(in srgb,var(--ts-green-soft) 36%,transparent)!important}
body.app-body .badge,body.app-body .chip,body.app-body .status-chip{font-size:9.5px!important;font-weight:500!important;border-radius:999px!important;box-shadow:none!important}

/* ---------- Inbox: overall ---------- */
body.app-body.page-inbox .content{height:calc(100dvh - 64px)!important;max-height:calc(100dvh - 64px)!important;padding:10px!important;gap:8px!important;overflow:hidden!important}
body.app-body.page-inbox .inbox-account-selector{min-height:56px!important;height:56px!important;padding:7px 10px!important;border:1px solid var(--ts-line)!important;border-radius:14px!important;background:var(--ts-panel)!important;box-shadow:none!important}
body.app-body.page-inbox .inbox-account-current{gap:9px!important;min-width:0!important}
body.app-body.page-inbox .wa-account-photo{width:36px!important;height:36px!important;min-width:36px!important;border-radius:10px!important;border:1px solid var(--ts-line)!important;background:var(--ts-panel-2)!important}
body.app-body.page-inbox .inbox-account-copy .eyebrow{font-size:8px!important;color:var(--ts-muted)!important}
body.app-body.page-inbox .inbox-account-copy b{font-size:12px!important;font-weight:600!important;line-height:1.2!important}
body.app-body.page-inbox .inbox-account-copy small{font-size:9.5px!important;font-weight:400!important;color:var(--ts-muted)!important;line-height:1.2!important}
body.app-body.page-inbox .inbox-account-picker{gap:8px!important}
body.app-body.page-inbox .inbox-account-picker label{font-size:9px!important;font-weight:500!important;color:var(--ts-muted)!important}
body.app-body.page-inbox .inbox-account-picker select{height:34px!important;min-height:34px!important;max-width:280px!important;font-size:11px!important;font-weight:500!important;border-radius:9px!important}

body.app-body.page-inbox .inbox-v2{display:grid!important;grid-template-columns:172px 330px minmax(0,1fr)!important;min-height:0!important;flex:1 1 auto!important;border:1px solid var(--ts-line)!important;border-radius:15px!important;background:var(--ts-panel)!important;overflow:hidden!important;box-shadow:none!important}
body.app-body.page-inbox .inbox-v2-rail{width:auto!important;min-width:0!important;padding:10px 8px!important;background:var(--ts-panel-2)!important;border-right:1px solid var(--ts-line-soft)!important;overflow:auto!important}
body.app-body.page-inbox .inbox-rail-head{padding:2px 4px 9px!important;border-bottom:1px solid var(--ts-line-soft)!important}
body.app-body.page-inbox .inbox-rail-head h2{font-size:14px!important;font-weight:600!important;margin:2px 0!important}
body.app-body.page-inbox .inbox-rail-head small{font-size:9.5px!important;font-weight:400!important;color:var(--ts-muted)!important}
body.app-body.page-inbox .inbox-new-chat{width:31px!important;height:31px!important;border-radius:9px!important;background:var(--ts-green)!important;color:#072119!important;font-size:18px!important;box-shadow:none!important}
body.app-body.page-inbox .inbox-views{padding:8px 0!important;gap:2px!important}
body.app-body.page-inbox .inbox-view-link{min-height:34px!important;padding:0 8px!important;border-radius:9px!important;gap:8px!important;color:var(--ts-text-2)!important;font-size:11px!important;font-weight:500!important;background:transparent!important;border:0!important}
body.app-body.page-inbox .inbox-view-link:hover{background:var(--ts-panel)!important;color:var(--ts-text)!important;transform:none!important}
body.app-body.page-inbox .inbox-view-link.active{background:var(--ts-green-soft)!important;color:var(--ts-green-strong)!important}
body.app-body.page-inbox .inbox-view-icon{width:17px!important;text-align:center!important;opacity:.78!important}
body.app-body.page-inbox .inbox-view-link em{margin-left:auto!important;min-width:19px!important;height:19px!important;padding:0 5px!important;border-radius:999px!important;background:var(--ts-panel-3)!important;color:var(--ts-muted)!important;font-size:9px!important;font-style:normal!important;font-weight:600!important;display:grid!important;place-items:center!important}
body.app-body.page-inbox .inbox-view-link.active em{background:var(--ts-green)!important;color:#06241a!important}
body.app-body.page-inbox .inbox-rail-section{margin-top:8px!important;padding:9px 4px!important;border-top:1px solid var(--ts-line-soft)!important}
body.app-body.page-inbox .inbox-rail-section>span{font-size:8.5px!important;font-weight:600!important;color:var(--ts-muted)!important;letter-spacing:.05em!important}
body.app-body.page-inbox .inbox-rail-section a{min-height:29px!important;padding:0 5px!important;border-radius:8px!important;font-size:10px!important;font-weight:400!important;color:var(--ts-text-2)!important}
body.app-body.page-inbox .inbox-rail-footer{margin-top:8px!important;padding:8px!important;border:1px solid var(--ts-line-soft)!important;border-radius:10px!important;background:var(--ts-panel)!important}
body.app-body.page-inbox .inbox-rail-footer b{font-size:10px!important;font-weight:600!important}
body.app-body.page-inbox .inbox-rail-footer small{font-size:8.5px!important;color:var(--ts-muted)!important}

/* Conversation list */
body.app-body.page-inbox .inbox-v2-list-panel{min-width:0!important;background:var(--ts-panel)!important;border-right:1px solid var(--ts-line-soft)!important;display:grid!important;grid-template-rows:auto auto auto minmax(0,1fr)!important}
body.app-body.page-inbox .inbox-list-head{height:52px!important;min-height:52px!important;padding:8px 10px!important;border-bottom:1px solid var(--ts-line-soft)!important;background:var(--ts-panel)!important}
body.app-body.page-inbox .inbox-list-head h2{font-size:13.5px!important;font-weight:600!important;margin:0!important}
body.app-body.page-inbox .inbox-list-head span{font-size:9.5px!important;font-weight:400!important;color:var(--ts-muted)!important}
body.app-body.page-inbox .inbox-list-head .icon-btn{width:30px!important;height:30px!important;min-height:30px!important;border-radius:9px!important;background:var(--ts-panel-2)!important;border:1px solid var(--ts-line)!important;color:var(--ts-muted)!important}
body.app-body.page-inbox .inbox-search{margin:8px 9px!important;height:38px!important;min-height:38px!important;display:grid!important;grid-template-columns:18px minmax(0,1fr) auto!important;align-items:center!important;gap:5px!important;padding:0 5px 0 10px!important;border:1px solid var(--ts-line)!important;border-radius:11px!important;background:var(--ts-panel-2)!important;box-shadow:none!important}
body.app-body.page-inbox .inbox-search input{height:34px!important;min-height:34px!important;border:0!important;background:transparent!important;padding:0!important;box-shadow:none!important;font-size:11.5px!important}
body.app-body.page-inbox .inbox-search button{height:28px!important;min-height:28px!important;padding:0 9px!important;border-radius:8px!important;border:0!important;background:var(--ts-green)!important;color:#062119!important;font-size:10px!important;font-weight:600!important}
body.app-body.page-inbox .inbox-conversation-list{min-height:0!important;overflow:auto!important;padding:0!important;background:var(--ts-panel)!important;scrollbar-width:thin!important;scrollbar-color:color-mix(in srgb,var(--ts-muted) 35%,transparent) transparent!important}
body.app-body.page-inbox .inbox-conversation{margin:0!important;border:0!important;border-bottom:1px solid var(--ts-line-soft)!important;background:transparent!important}
body.app-body.page-inbox .inbox-row-link{min-height:70px!important;padding:9px 11px!important;display:grid!important;grid-template-columns:38px minmax(0,1fr) auto!important;gap:9px!important;align-items:center!important;background:transparent!important;border-radius:0!important;box-shadow:none!important;transform:none!important}
body.app-body.page-inbox .inbox-conversation:hover .inbox-row-link{background:var(--ts-panel-2)!important;transform:none!important}
body.app-body.page-inbox .inbox-conversation.active .inbox-row-link{background:var(--ts-green-soft)!important;box-shadow:inset 3px 0 0 var(--ts-green)!important}
body.app-body.page-inbox .inbox-avatar{width:36px!important;height:36px!important;min-width:36px!important;border-radius:11px!important;border:1px solid var(--ts-green-line)!important;background:var(--ts-green-soft)!important;color:var(--ts-green-strong)!important;font-size:11px!important;font-weight:600!important;box-shadow:none!important}
body.app-body.page-inbox .inbox-row-main{min-width:0!important;gap:3px!important}
body.app-body.page-inbox .inbox-row-title{gap:6px!important}
body.app-body.page-inbox .inbox-row-title b{min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;font-size:12px!important;font-weight:600!important;color:var(--ts-text)!important}
body.app-body.page-inbox .inbox-row-title time{font-size:9px!important;font-weight:400!important;color:var(--ts-muted)!important}
body.app-body.page-inbox .inbox-row-preview{min-width:0!important;display:flex!important;gap:4px!important;align-items:center!important;color:var(--ts-text-2)!important;font-size:10.5px!important;font-weight:400!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
body.app-body.page-inbox .inbox-row-preview>span:last-child{overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
body.app-body.page-inbox .inbox-row-preview .direction{font-size:9px!important;color:var(--ts-muted)!important}
body.app-body.page-inbox .inbox-row-meta{gap:4px!important;min-width:0!important;white-space:nowrap!important;overflow:hidden!important}
body.app-body.page-inbox .inbox-row-meta>span{font-size:8px!important;font-weight:400!important;color:var(--ts-muted)!important}
body.app-body.page-inbox .inbox-row-meta .status-chip{padding:2px 5px!important;border-radius:999px!important;font-size:7.8px!important;font-weight:500!important;background:var(--ts-panel-3)!important;color:var(--ts-muted)!important;border:0!important}
body.app-body.page-inbox .inbox-row-flags em{min-width:20px!important;height:20px!important;border-radius:999px!important;background:var(--ts-green)!important;color:#062119!important;font-size:9px!important;font-weight:600!important;display:grid!important;place-items:center!important}

/* Chat panel */
body.app-body.page-inbox .inbox-v2-main{min-width:0!important;min-height:0!important;background:var(--ts-panel-2)!important}
body.app-body.page-inbox .inbox-chat-layout{height:100%!important;min-height:0!important;background:var(--ts-panel-2)!important;--detail-width:300px!important}
body.app-body.page-inbox .inbox-chat-workspace{height:100%!important;min-height:0!important;display:grid!important;grid-template-rows:58px minmax(0,1fr) auto!important;background:var(--ts-panel-2)!important}
body.app-body.page-inbox .inbox-chat-head{height:58px!important;min-height:58px!important;margin:0!important;padding:8px 12px!important;border:0!important;border-bottom:1px solid var(--ts-line-soft)!important;border-radius:0!important;background:var(--ts-panel)!important;box-shadow:none!important}
body.app-body.page-inbox .inbox-chat-person{gap:9px!important;min-width:0!important;flex:1 1 auto!important}
body.app-body.page-inbox .inbox-chat-person .inbox-avatar.large{width:36px!important;height:36px!important;min-width:36px!important;border-radius:11px!important;font-size:11px!important}
body.app-body.page-inbox .inbox-chat-person h2{font-size:13px!important;font-weight:600!important;margin:0 0 2px!important;line-height:1.2!important}
body.app-body.page-inbox .inbox-chat-person p{font-size:9.5px!important;font-weight:400!important;color:var(--ts-muted)!important;line-height:1.25!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
body.app-body.page-inbox .inbox-chat-actions{gap:5px!important;flex-wrap:nowrap!important}
body.app-body.page-inbox .inbox-chat-actions .icon-btn{width:31px!important;height:31px!important;min-height:31px!important;padding:0!important;border-radius:9px!important;border:1px solid var(--ts-line)!important;background:var(--ts-panel-2)!important;color:var(--ts-muted)!important;font-size:10px!important;box-shadow:none!important}
body.app-body.page-inbox .window-chip{height:26px!important;display:inline-flex!important;align-items:center!important;padding:0 8px!important;border-radius:999px!important;font-size:8.5px!important;font-weight:600!important;background:var(--ts-green-soft)!important;border:1px solid var(--ts-green-line)!important;color:var(--ts-green-strong)!important}

/* Human message canvas */
body.app-body.page-inbox .inbox-message-wall{margin:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:18px clamp(18px,4.2vw,76px) 22px!important;background:var(--ts-panel-2)!important;background-image:none!important;overflow:auto!important;scrollbar-width:thin!important;scrollbar-color:color-mix(in srgb,var(--ts-muted) 32%,transparent) transparent!important}
body.app-body.page-inbox .message-day{margin:3px 0 14px!important;text-align:center!important}
body.app-body.page-inbox .message-day span{display:inline-flex!important;align-items:center!important;min-height:24px!important;padding:3px 9px!important;border-radius:999px!important;border:1px solid var(--ts-line)!important;background:var(--ts-panel)!important;color:var(--ts-muted)!important;font-size:9.5px!important;font-weight:500!important;box-shadow:none!important}
body.app-body.page-inbox .message-row{display:flex!important;width:100%!important;clear:both!important;margin:6px 0!important;padding:0!important;align-items:flex-end!important}
body.app-body.page-inbox .message-row.group-cont{margin-top:2px!important}
body.app-body.page-inbox .message-row.in{justify-content:flex-start!important}
body.app-body.page-inbox .message-row.out{justify-content:flex-end!important}
body.app-body.page-inbox .message-bubble{display:block!important;flex:0 1 auto!important;width:fit-content!important;min-width:0!important;max-width:min(62%,680px)!important;margin:0!important;padding:10px 12px 7px!important;border-radius:14px!important;font-size:14px!important;line-height:1.38!important;font-weight:400!important;letter-spacing:0!important;box-shadow:0 1px 2px rgba(0,0,0,.10)!important;word-break:normal!important;overflow-wrap:anywhere!important;position:relative!important}
body.app-body.page-inbox .message-row.in .message-bubble{margin-right:auto!important;background:var(--ts-panel)!important;border:1px solid var(--ts-line)!important;color:var(--ts-text)!important;border-radius:14px 14px 14px 6px!important}
body.app-body.page-inbox .message-row.out .message-bubble{margin-left:auto!important;background:#087b67!important;border:1px solid #118a74!important;color:#f4fffb!important;border-radius:14px 14px 6px 14px!important}
html[data-theme="dark"] body.app-body.page-inbox .message-row.in .message-bubble{background:#182229!important;border-color:#26353d!important;color:#edf3f5!important}
html[data-theme="dark"] body.app-body.page-inbox .message-row.out .message-bubble{background:#0d6f5f!important;border-color:#16806d!important;color:#f4fffb!important}
body.app-body.page-inbox .message-row.group-cont.in .message-bubble{border-top-left-radius:8px!important}
body.app-body.page-inbox .message-row.group-cont.out .message-bubble{border-top-right-radius:8px!important}
body.app-body.page-inbox .message-origin{display:block!important;margin:0 0 4px!important;font-size:10.5px!important;line-height:1.2!important;font-weight:600!important;color:#baf2df!important}
body.app-body.page-inbox .message-row.in .message-origin{color:var(--ts-muted)!important}
body.app-body.page-inbox .message-body{margin:0!important;padding:0!important;font-size:14px!important;font-weight:400!important;line-height:1.38!important;letter-spacing:0!important;color:inherit!important}
body.app-body.page-inbox .message-meta{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:5px!important;margin-top:4px!important;font-size:11px!important;font-weight:400!important;line-height:1!important;color:color-mix(in srgb,currentColor 58%,transparent)!important;white-space:nowrap!important}
body.app-body.page-inbox .message-status{font-size:10.5px!important;font-weight:500!important;text-transform:none!important;letter-spacing:0!important}
body.app-body.page-inbox .message-status.status-read{color:#95dcff!important}
body.app-body.page-inbox .message-status.status-delivered{color:#a6ead3!important}
body.app-body.page-inbox .message-status.status-failed{color:#ffafb4!important}
body.app-body.page-inbox .message-delete-form{opacity:0!important;margin-left:2px!important;transition:opacity .12s ease!important}
body.app-body.page-inbox .message-bubble:hover .message-delete-form{opacity:1!important}
body.app-body.page-inbox .message-delete-form button{width:auto!important;height:auto!important;min-height:0!important;padding:0 2px!important;border:0!important;background:transparent!important;color:inherit!important;opacity:.55!important;font-size:10px!important}
body.app-body.page-inbox .chat-media-image img{max-width:min(360px,100%)!important;max-height:320px!important;border-radius:11px!important}
body.app-body.page-inbox :is(audio,video){max-width:100%!important}

/* Composer */
body.app-body.page-inbox .inbox-composer{margin:0!important;border:0!important;border-top:1px solid var(--ts-line-soft)!important;border-radius:0!important;background:var(--ts-panel)!important;box-shadow:none!important;max-height:260px!important;overflow:auto!important}
body.app-body.page-inbox .composer-tabs.modern{height:38px!important;min-height:38px!important;padding:0 11px!important;gap:2px!important;border:0!important;border-bottom:1px solid var(--ts-line-soft)!important;background:var(--ts-panel)!important;box-shadow:none!important}
body.app-body.page-inbox .composer-tabs.modern button{height:37px!important;min-height:37px!important;padding:0 10px!important;border:0!important;border-radius:0!important;background:transparent!important;color:var(--ts-muted)!important;font-size:11px!important;font-weight:500!important;box-shadow:none!important;position:relative!important}
body.app-body.page-inbox .composer-tabs.modern button:hover{background:transparent!important;color:var(--ts-text)!important}
body.app-body.page-inbox .composer-tabs.modern button.active,body.app-body.page-inbox .composer-tabs.modern button[aria-selected="true"]{background:transparent!important;color:var(--ts-green-strong)!important}
body.app-body.page-inbox .composer-tabs.modern button.active:after,body.app-body.page-inbox .composer-tabs.modern button[aria-selected="true"]:after{content:""!important;position:absolute!important;left:10px!important;right:10px!important;bottom:-1px!important;height:2px!important;border-radius:999px!important;background:var(--ts-green)!important}
body.app-body.page-inbox .composer-pane.modern{padding:8px 10px 10px!important;background:var(--ts-panel)!important}
body.app-body.page-inbox .composer-tools{min-height:28px!important;padding:0 0 7px!important;border:0!important;background:transparent!important}
body.app-body.page-inbox .composer-tools select{height:29px!important;min-height:29px!important;max-width:220px!important;padding:0 8px!important;border-radius:8px!important;font-size:10px!important;background:var(--ts-panel-2)!important}
body.app-body.page-inbox .composer-tools span{font-size:9px!important;color:var(--ts-muted)!important}
body.app-body.page-inbox .composer-input{display:grid!important;grid-template-columns:minmax(0,1fr) 42px!important;gap:8px!important;align-items:end!important}
body.app-body.page-inbox .composer-input textarea{min-height:42px!important;max-height:120px!important;padding:11px 12px!important;border-radius:13px!important;border:1px solid var(--ts-line)!important;background:var(--ts-panel-2)!important;color:var(--ts-text)!important;font-size:13px!important;line-height:1.35!important;resize:none!important;box-shadow:none!important}
body.app-body.page-inbox .send-button{width:42px!important;height:42px!important;min-height:42px!important;padding:0!important;border:0!important;border-radius:12px!important;background:var(--ts-green)!important;color:#062119!important;font-size:15px!important;font-weight:600!important;box-shadow:none!important}
body.app-body.page-inbox .send-button:hover{background:var(--ts-green-strong)!important;color:#fff!important;transform:none!important}

/* Details drawer */
body.app-body.page-inbox .inbox-details{margin:0!important;padding:0 10px 14px!important;border:0!important;border-left:1px solid var(--ts-line-soft)!important;border-radius:0!important;background:var(--ts-panel)!important;box-shadow:none!important}
body.app-body.page-inbox .inbox-details>header{height:58px!important;min-height:58px!important;margin:0 -10px 8px!important;padding:0 10px!important;border-bottom:1px solid var(--ts-line-soft)!important}
body.app-body.page-inbox .inbox-details>header h3{font-size:12.5px!important;font-weight:600!important}
body.app-body.page-inbox .detail-person{padding:12px 6px!important}
body.app-body.page-inbox .detail-person h3{font-size:13px!important;font-weight:600!important}
body.app-body.page-inbox .detail-person span,body.app-body.page-inbox .detail-person a{font-size:10px!important;font-weight:400!important}
body.app-body.page-inbox .detail-card{padding:10px!important;border-radius:11px!important;background:var(--ts-panel-2)!important;border:1px solid var(--ts-line-soft)!important;box-shadow:none!important}
body.app-body.page-inbox .detail-card h4{font-size:11px!important;font-weight:600!important}
body.app-body.page-inbox .detail-field label{font-size:9px!important;font-weight:500!important;color:var(--ts-muted)!important}
body.app-body.page-inbox .detail-field :is(select,input,button){min-height:34px!important;height:34px!important;font-size:10px!important;border-radius:9px!important}

/* Empty inbox */
body.app-body.page-inbox .inbox-v2-empty{background:var(--ts-panel-2)!important;color:var(--ts-text-2)!important}
body.app-body.page-inbox .inbox-v2-empty h2{font-size:17px!important;font-weight:600!important}
body.app-body.page-inbox .inbox-v2-empty p{font-size:12px!important;font-weight:400!important;color:var(--ts-muted)!important;max-width:420px!important}

/* Never tilt primary UI */
body.app-body :is(.card,.panel,.sidebar,.topbar,.workspace,.content,.inbox-v2,.inbox-v2-rail,.inbox-v2-list-panel,.inbox-v2-main,.inbox-chat-workspace,.inbox-message-wall,.message-bubble,.inbox-composer,.inbox-details,button,.btn,a.button){rotate:none!important;transform:none!important;perspective:none!important}
body.app-body .account-dropdown{transform:none!important}

/* Responsive */
@media(max-width:1180px){
  body.app-body.page-inbox .inbox-v2{grid-template-columns:0 310px minmax(0,1fr)!important}
  body.app-body.page-inbox .inbox-v2-rail{display:none!important}
  body.app-body.page-inbox .message-bubble{max-width:min(68%,640px)!important}
}
@media(max-width:900px){
  body.app-body.page-inbox .content{padding:5px!important;gap:5px!important}
  body.app-body.page-inbox .inbox-account-selector{height:50px!important;min-height:50px!important;border-radius:11px!important}
  body.app-body.page-inbox .inbox-account-copy small,body.app-body.page-inbox .inbox-account-picker label{display:none!important}
  body.app-body.page-inbox .inbox-v2{grid-template-columns:1fr!important;border-radius:11px!important}
  body.app-body.page-inbox .inbox-v2-list-panel{width:100%!important;border-right:0!important}
  body.app-body.page-inbox .inbox-v2-main{position:absolute!important;inset:0!important;z-index:8!important;display:none!important}
  body.app-body.page-inbox .inbox-v2-main:has(.inbox-chat-layout){display:block!important}
  body.app-body.page-inbox .message-bubble{max-width:min(78%,560px)!important;font-size:13.5px!important;padding:9px 11px 7px!important}
  body.app-body.page-inbox .message-body{font-size:13.5px!important}
  body.app-body.page-inbox .message-meta{font-size:10.5px!important}
  body.app-body.page-inbox .inbox-message-wall{padding:14px 12px 18px!important}
}
@media(max-width:560px){
  body.app-body .topbar{height:58px!important;min-height:58px!important;padding:0 8px!important}
  body.app-body.page-inbox .content{height:calc(100dvh - 58px)!important;max-height:calc(100dvh - 58px)!important}
  body.app-body.page-inbox .inbox-row-link{min-height:66px!important}
  body.app-body.page-inbox .message-bubble{max-width:86%!important}
  body.app-body.page-inbox .inbox-chat-head{padding:7px 8px!important}
  body.app-body.page-inbox .inbox-chat-person p{max-width:55vw!important}
  body.app-body.page-inbox .window-chip{display:none!important}
}

/* ============================================================
   TS WhatsApp V11.6.1 — Inbox Bulk Mode / professional selection
   ============================================================ */
body.app-body.page-inbox .inbox-v2{grid-template-columns:172px 356px minmax(0,1fr)!important}
body.app-body.page-inbox .inbox-bulk-bar{
  margin:0!important;padding:10px!important;border:0!important;border-bottom:1px solid var(--ts-line-soft)!important;
  border-radius:0!important;background:var(--ts-panel)!important;box-shadow:none!important;
  display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:8px!important;min-width:0!important
}
body.app-body.page-inbox .inbox-bulk-bar[hidden]{display:none!important}
body.app-body.page-inbox .inbox-bulk-summary{display:grid!important;grid-template-columns:30px minmax(0,1fr) auto 30px!important;align-items:center!important;gap:8px!important;min-width:0!important}
body.app-body.page-inbox .inbox-bulk-check{width:30px!important;height:30px!important;display:grid!important;place-items:center!important;border-radius:9px!important;background:var(--ts-green-soft)!important;border:1px solid var(--ts-green-line)!important;color:var(--ts-green-strong)!important;font-size:13px!important;font-weight:600!important}
body.app-body.page-inbox .inbox-bulk-copy{min-width:0!important;display:flex!important;flex-direction:column!important;gap:1px!important}
body.app-body.page-inbox .inbox-bulk-copy b{font-size:11.5px!important;line-height:1.15!important;font-weight:600!important;color:var(--ts-text)!important}
body.app-body.page-inbox .inbox-bulk-copy small{font-size:9px!important;line-height:1.15!important;font-weight:400!important;color:var(--ts-muted)!important}
body.app-body.page-inbox .inbox-bulk-summary .inbox-select-all{height:30px!important;min-height:30px!important;width:auto!important;padding:0 9px!important;border-radius:9px!important;border:1px solid var(--ts-line)!important;background:var(--ts-panel-2)!important;color:var(--ts-text-2)!important;font-size:9.5px!important;font-weight:500!important;white-space:nowrap!important}
body.app-body.page-inbox .inbox-bulk-summary .inbox-select-all:hover{border-color:var(--ts-green-line)!important;color:var(--ts-green-strong)!important;background:var(--ts-green-soft)!important}
body.app-body.page-inbox .inbox-bulk-close{width:30px!important;height:30px!important;min-height:30px!important;padding:0!important;border-radius:9px!important;border:1px solid var(--ts-line)!important;background:transparent!important;color:var(--ts-muted)!important;font-size:17px!important;font-weight:400!important;line-height:1!important}
body.app-body.page-inbox .inbox-bulk-close:hover{background:var(--ts-panel-2)!important;color:var(--ts-text)!important}
body.app-body.page-inbox .inbox-bulk-actions{display:grid!important;grid-template-columns:minmax(0,1fr) 82px!important;gap:7px!important;align-items:center!important;min-width:0!important}
body.app-body.page-inbox .inbox-bulk-action-select{width:100%!important;min-width:0!important;max-width:none!important;height:34px!important;min-height:34px!important;padding:0 30px 0 10px!important;border-radius:9px!important;border:1px solid var(--ts-line)!important;background:var(--ts-panel-2)!important;color:var(--ts-text)!important;font-size:10.5px!important;font-weight:400!important;box-shadow:none!important}
body.app-body.page-inbox .inbox-bulk-apply{width:82px!important;height:34px!important;min-height:34px!important;padding:0 10px!important;border:0!important;border-radius:9px!important;background:var(--ts-green)!important;color:#062119!important;font-size:10.5px!important;font-weight:600!important;box-shadow:none!important}
body.app-body.page-inbox .inbox-bulk-apply:disabled{opacity:.38!important;cursor:not-allowed!important;filter:saturate(.35)!important}
body.app-body.page-inbox .inbox-v2.bulk-mode .inbox-search,body.app-body.page-inbox .inbox-v2.bulk-mode .inbox-filter-drawer{display:none!important}
body.app-body.page-inbox .inbox-v2.bulk-mode .inbox-list-head{height:44px!important;min-height:44px!important;padding:7px 10px!important}
body.app-body.page-inbox .inbox-v2.bulk-mode .inbox-list-head .icon-btn{display:none!important}
body.app-body.page-inbox .inbox-v2.bulk-mode .inbox-list-head h2:after{content:' · mode pilih';font-size:9px!important;font-weight:400!important;color:var(--ts-muted)!important}
body.app-body.page-inbox .inbox-row-check{opacity:0!important;left:9px!important;top:50%!important;transform:translateY(-50%)!important;display:grid!important;place-items:center!important;width:18px!important;height:18px!important;z-index:5!important;transition:opacity .12s ease!important}
body.app-body.page-inbox .inbox-conversation:hover .inbox-row-check,body.app-body.page-inbox .inbox-row-check:has(input:checked),body.app-body.page-inbox .inbox-v2.bulk-mode .inbox-row-check{opacity:1!important}
body.app-body.page-inbox .inbox-row-check input{appearance:none!important;-webkit-appearance:none!important;width:16px!important;height:16px!important;min-height:16px!important;margin:0!important;border-radius:5px!important;border:1px solid var(--ts-line)!important;background:var(--ts-panel-2)!important;display:grid!important;place-items:center!important;cursor:pointer!important;box-shadow:none!important}
body.app-body.page-inbox .inbox-row-check input:checked{background:var(--ts-green)!important;border-color:var(--ts-green)!important}
body.app-body.page-inbox .inbox-row-check input:checked:after{content:'✓'!important;color:#062119!important;font-size:10px!important;line-height:1!important;font-weight:700!important}
body.app-body.page-inbox .inbox-v2.bulk-mode .inbox-row-link{padding-left:37px!important;grid-template-columns:36px minmax(0,1fr) auto!important;gap:8px!important}
body.app-body.page-inbox .inbox-conversation:has([data-inbox-select]:checked) .inbox-row-link{background:color-mix(in srgb,var(--ts-green) 9%,var(--ts-panel))!important;box-shadow:inset 2px 0 0 var(--ts-green)!important}
body.app-body.page-inbox .inbox-conversation:has([data-inbox-select]:checked) .inbox-avatar{border-color:var(--ts-green-line)!important;background:var(--ts-green-soft)!important}
body.app-body.page-inbox .inbox-v2.bulk-mode .inbox-conversation.active .inbox-row-link{box-shadow:inset 2px 0 0 var(--ts-green)!important}
@media(max-width:1360px){body.app-body.page-inbox .inbox-v2{grid-template-columns:160px 338px minmax(0,1fr)!important}}
@media(max-width:900px){
  body.app-body.page-inbox .inbox-v2{grid-template-columns:1fr!important}
  body.app-body.page-inbox .inbox-bulk-bar{position:sticky!important;top:0!important;z-index:15!important}
  body.app-body.page-inbox .inbox-bulk-summary{grid-template-columns:30px minmax(0,1fr) auto 30px!important}
  body.app-body.page-inbox .inbox-v2.bulk-mode .inbox-row-link{padding-left:40px!important}
}


/* v11.6.4 template media composer */
body.page-inbox .template-media-field{grid-column:1/-1!important;display:grid!important;grid-template-columns:minmax(260px,1.25fr) minmax(240px,.75fr)!important;gap:10px!important;padding:11px!important;border:1px solid var(--ts-border)!important;border-radius:12px!important;background:color-mix(in srgb,var(--ts-panel-2) 82%,transparent)!important}
body.page-inbox .template-media-field[hidden]{display:none!important}
body.page-inbox .template-media-library-field{display:grid!important;gap:5px!important}
body.page-inbox .template-media-library-field>span{font-size:12px!important;font-weight:600!important}
body.page-inbox .template-media-library-field small,body.page-inbox .template-media-advanced small{font-size:10.5px!important;color:var(--ts-muted)!important}
body.page-inbox .template-media-advanced{margin:0!important;padding:0!important;border:0!important}
body.page-inbox .template-media-advanced summary{cursor:pointer!important;font-size:11px!important;color:var(--ts-muted)!important;padding:8px 0!important}
body.page-inbox .template-media-advanced[open] summary{margin-bottom:6px!important}
@media(max-width:900px){body.page-inbox .template-media-field{grid-template-columns:1fr!important}}

/* v11.6.8 — Meta billing / delivery blockers */
.meta-billing-blocker{display:flex;align-items:center;gap:12px;margin:10px 0 12px;padding:12px 14px;border:1px solid rgba(245,158,11,.28);border-radius:14px;background:rgba(120,53,15,.18);box-shadow:0 8px 24px rgba(0,0,0,.08)}
.meta-billing-blocker-icon{display:grid;place-items:center;width:30px;height:30px;flex:0 0 30px;border-radius:9px;background:rgba(245,158,11,.16);color:#fbbf24;font-weight:700}
.meta-billing-blocker>div:nth-child(2){display:grid;gap:2px;min-width:0;flex:1}.meta-billing-blocker b{font-size:13px;font-weight:600;color:#fde68a}.meta-billing-blocker span{font-size:12px;line-height:1.45;color:var(--muted,#94a3b8)}
.meta-billing-blocker .btn{flex:0 0 auto;min-height:34px;padding:8px 12px;border-radius:10px;font-size:12px;text-decoration:none}
.message-delivery-error{display:grid;gap:4px;margin-top:7px;padding:8px 9px;border-radius:10px;font-size:11px;line-height:1.35;background:rgba(127,29,29,.18);border:1px solid rgba(248,113,113,.22);color:#fecaca}
.message-delivery-error b{font-size:11px;font-weight:600}.message-delivery-error span{font-size:10.8px;color:inherit;opacity:.9}.message-delivery-error a{justify-self:start;margin-top:2px;color:#fef3c7;text-decoration:none;font-weight:600}.message-delivery-error a:hover{text-decoration:underline}
.message-delivery-error.meta-error-billing{background:rgba(120,53,15,.2);border-color:rgba(245,158,11,.28);color:#fde68a}.message-delivery-error.meta-error-media{background:rgba(30,64,175,.16);border-color:rgba(96,165,250,.22);color:#bfdbfe}
@media(max-width:760px){.meta-billing-blocker{align-items:flex-start;flex-wrap:wrap}.meta-billing-blocker .btn{margin-left:42px}}