.whats-sales-workspace { padding: 0; overflow: hidden; }
.whats-sales-workspace [hidden] { display: none !important; }
.whats-sales-toolbar { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding: 18px 20px; border-bottom: 1px solid #e5e9e6; background: linear-gradient(135deg, #f8fbf9, #fff); }
.whats-sales-toolbar h3 { margin: 2px 0 3px; font-size: 24px; color: #172019; }
.whats-sales-toolbar p { margin: 0; color: #667069; }
.whats-sales-eyebrow { color: #12834b; font-size: 11px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.whats-sales-toolbar-actions { display: flex; align-items: flex-end; gap: 10px; }
.whats-sales-toolbar-actions label { display: grid; gap: 5px; min-width: 205px; color: #667069; font-size: 11px; font-weight: 700; }
.whats-sales-mode-tabs { display: flex; padding: 3px; border: 1px solid #dfe5e1; border-radius: 9px; background: #f3f6f4; }
.whats-sales-mode-tabs button { border: 0; padding: 8px 11px; border-radius: 7px; background: transparent; color: #59635c; box-shadow: none; }
.whats-sales-mode-tabs button.active { background: #fff; color: #106c40; box-shadow: 0 1px 5px rgba(20, 50, 31, .12); }
.whats-sales-notice { margin: 12px 16px 0; padding: 10px 12px; border: 1px solid #f1d49a; border-radius: 9px; background: #fff9eb; color: #76510c; }
.whats-sales-notice.is-error { border-color: #efb9b9; background: #fff4f4; color: #8b2929; }
.whats-sales-coexistence { display: grid; grid-template-columns: minmax(280px, 1fr) minmax(300px, 1.2fr) auto; align-items: center; gap: 18px; margin: 12px 16px; padding: 14px 16px; border: 1px solid #9fd5b7; border-left: 4px solid #00a884; border-radius: 11px; background: linear-gradient(135deg, #effaf4, #fff); }
.whats-sales-coexistence h4 { margin: 3px 0 4px; color: #123d2b; font-size: 16px; }
.whats-sales-coexistence p { max-width: 620px; margin: 0; color: #50675a; font-size: 12px; line-height: 1.4; }
.whats-sales-coexistence > button { white-space: nowrap; background: #00a884; }
.whats-sales-coexistence-accounts { display: grid; gap: 6px; }
.whats-sales-coexistence-account { display: grid; grid-template-columns: 1fr auto; gap: 3px 10px; padding: 8px 10px; border: 1px solid #d9e7df; border-radius: 8px; background: #fff; }
.whats-sales-coexistence-account strong { color: #183a29; font-size: 12px; }
.whats-sales-coexistence-account small { color: #64746b; }
.whats-sales-coexistence-account button { grid-column: 2; grid-row: 1 / span 2; align-self: center; min-height: 30px; padding: 5px 8px; font-size: 11px; }
.whats-sales-coexistence-status { color: #08733f !important; font-weight: 700; }
.whats-sales-coexistence-status.is-pending { color: #9a6400 !important; }
.whats-sales-inbox { display: grid; grid-template-columns: minmax(270px, 320px) minmax(390px, 1fr) minmax(270px, 330px); min-height: calc(100vh - 225px); }
.whats-sales-list-pane, .whats-sales-customer-pane { min-width: 0; background: #fff; }
.whats-sales-list-pane { border-right: 1px solid #e5e9e6; }
.whats-sales-customer-pane { border-left: 1px solid #e5e9e6; padding: 16px; }
.whats-sales-search { padding: 13px 13px 8px; }
.whats-sales-search input { width: 100%; }
.whats-sales-search select { width: 100%; margin-top: 7px; }
.whats-sales-tags-section { display: grid; gap: 8px; margin: 14px 0; padding: 12px; border: 1px solid #e5e9e6; border-radius: 10px; background: #fafcfb; }
.whats-sales-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.whats-sales-tag { border: 1px solid color-mix(in srgb, var(--tag-color) 45%, white); border-radius: 999px; padding: 5px 8px; background: color-mix(in srgb, var(--tag-color) 12%, white); color: var(--tag-color); box-shadow: none; font-size: 11px; font-weight: 700; }
.whats-sales-tag span { margin-left: 3px; }
.whats-sales-tag-add { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px; }
.whats-sales-tag-add select, .whats-sales-tag-add button { min-width: 0; }
.whats-sales-shared-number-note { display: grid; gap: 4px; margin: 12px 0; padding: 12px 14px; border: 1px solid #9fd5b7; border-left: 4px solid #12834b; border-radius: 9px; background: #effaf4; color: #135d37; }
.whats-sales-shared-number-note span { color: #49685a; font-size: 12px; }
.whats-sales-main-phone-editor { display: flex; align-items: end; gap: 10px; margin-top: 6px; }
.whats-sales-main-phone-editor label { display: grid; gap: 4px; min-width: 250px; color: #135d37; font-size: 12px; font-weight: 700; }
.whats-sales-main-phone-editor input { width: 100%; min-height: 38px; padding: 8px 10px; border: 1px solid #9fd5b7; border-radius: 7px; background: #fff; }
.whats-sales-main-phone-editor button { min-height: 38px; }
@media (max-width: 720px) { .whats-sales-main-phone-editor { align-items: stretch; flex-direction: column; } .whats-sales-main-phone-editor label { min-width: 0; } }
.seller-security-row { grid-template-columns: minmax(190px,1.3fr) repeat(3,minmax(155px,1fr)) minmax(130px,.7fr) minmax(125px,.7fr) auto auto; }
@media (max-width: 1450px) { .seller-security-row { grid-template-columns: repeat(3,minmax(180px,1fr)); } }
@media (max-width: 760px) { .seller-security-row { grid-template-columns: 1fr; } }
.whats-sales-inbox-filters { display: flex; gap: 5px; padding: 0 13px 10px; overflow-x: auto; }
.whats-sales-inbox-filters button { flex: 0 0 auto; border: 1px solid #dfe5e1; padding: 6px 9px; border-radius: 999px; background: #fff; color: #5b665e; box-shadow: none; font-size: 11px; }
.whats-sales-inbox-filters button.active { border-color: #12834b; background: #eaf7ef; color: #08733f; }
.whats-sales-list-summary { display: flex; justify-content: space-between; padding: 9px 14px; border-block: 1px solid #edf0ee; color: #657068; font-size: 12px; }
.whats-sales-conversation-list { position: relative; z-index: 2; overflow: auto; max-height: calc(100vh - 390px); pointer-events: auto; }
.whats-sales-conversation { position: relative; z-index: 3; width: 100%; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; gap: 10px; padding: 12px 13px; border: 0; border-bottom: 1px solid #edf0ee; border-radius: 0; background: #fff; color: #1d2921; text-align: left; box-shadow: none; cursor: pointer; pointer-events: auto; }
.whats-sales-conversation:hover, .whats-sales-conversation.active { background: #f1faf5; }
.whats-sales-conversation.active { box-shadow: inset 4px 0 #00a884; }
.whats-sales-conversation.is-unread .whats-sales-conversation-copy strong { color: #111b21; font-weight: 900; }
.whats-sales-conversation.is-unread .whats-sales-conversation-copy span { color: #3b4a54; font-weight: 700; }
.whats-sales-conversation.is-unread .whats-sales-conversation-meta time { color: #00a884; font-weight: 800; }
.whats-sales-avatar, .whats-sales-customer-title > span { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: #dff3e7; color: #08733f; font-weight: 800; }
.whats-sales-conversation-copy { min-width: 0; }
.whats-sales-conversation-copy strong, .whats-sales-conversation-copy span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.whats-sales-conversation-copy span { margin-top: 4px; color: #6a746d; font-size: 12px; }
.whats-sales-shared-badge { display: inline-flex; width: fit-content; margin-top: 5px; padding: 2px 6px; border-radius: 999px; background: #e7f8f1; color: #007f66; font-size: 9px; font-style: normal; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; }
.whats-sales-conversation-meta { display: grid; justify-items: end; gap: 7px; color: #6a746d; font-size: 10px; }
.whats-sales-unread { min-width: 20px; padding: 3px 6px; border-radius: 999px; background: #12834b; color: #fff; text-align: center; }
.whats-sales-chat-pane { min-width: 0; background-color: #efeae2; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cg fill='none' stroke='%23828f87' stroke-width='2' opacity='.18'%3E%3Cpath d='M14 18h42a9 9 0 0 1 9 9v21a9 9 0 0 1-9 9H35l-12 9 3-9H14a9 9 0 0 1-9-9V27a9 9 0 0 1 9-9Z'/%3E%3Ccircle cx='118' cy='34' r='16'/%3E%3Cpath d='m110 34 6 6 11-13M88 91c8 15 20 27 35 35l10-10c2-2 5-3 8-2l20 7c3 1 5 4 5 7v16c0 5-4 9-9 9-65 0-118-53-118-118 0-5 4-9 9-9h16c3 0 6 2 7 5l7 20c1 3 0 6-2 8L66 69'/%3E%3Cpath d='M116 80h42v30h-42zM126 90h22M126 99h13M22 123l12-12 20 20-12 12zM29 130l-9 16 16-9'/%3E%3Ccircle cx='92' cy='151' r='12'/%3E%3Cpath d='M92 143v16M84 151h16'/%3E%3C/g%3E%3C/svg%3E"); background-size: 180px 180px; }
.whats-sales-empty-state, .whats-sales-customer-empty { height: 100%; display: grid; align-content: center; justify-items: center; gap: 8px; padding: 30px; text-align: center; color: #677169; }
.whats-sales-empty-state h4 { margin: 5px 0 0; color: #233027; font-size: 19px; }
.whats-sales-empty-state p, .whats-sales-customer-empty p { max-width: 430px; margin: 0 0 9px; line-height: 1.45; }
.whats-sales-empty-icon { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 18px; background: #12834b; color: #fff; font-size: 25px; font-weight: 900; box-shadow: 0 10px 25px rgba(18, 131, 75, .22); }
.whats-sales-chat-content { height: 100%; grid-template-rows: auto 1fr auto; }
.whats-sales-chat-content:not([hidden]) { display: grid; }
.whats-sales-chat-header { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 64px; padding: 10px 16px; border-bottom: 1px solid #d9dedb; background: #f0f2f5; }
.whats-sales-chat-header div { display: grid; gap: 3px; }
.whats-sales-chat-header .whats-sales-chat-state { display: flex; align-items: center; justify-content: flex-end; gap: 7px; }
.whats-sales-chat-header span { color: #667069; font-size: 12px; }
.whats-sales-owner { align-self: center; padding: 5px 8px; border-radius: 999px; background: #e2e8e5; }
.whats-sales-read-state { display: inline-flex; align-items: center; gap: 5px; padding: 5px 9px; border-radius: 999px; background: #dff5e6; color: #08733f !important; font-weight: 800; }
.whats-sales-read-state::before { content: "✓✓"; letter-spacing: -4px; padding-right: 4px; color: #53bdeb; }
.whats-sales-read-state.is-unread { background: #e7f8f1; color: #007f66 !important; }
.whats-sales-read-state.is-unread::before { content: "●"; letter-spacing: 0; padding-right: 0; color: #00a884; }
.whats-sales-messages { display: flex; flex-direction: column; gap: 9px; padding: 18px; overflow: auto; }
.whats-sales-message { position: relative; max-width: 78%; padding: 8px 9px 6px; border-radius: 8px; background: #fff; color: #111b21; line-height: 1.38; box-shadow: 0 1px 1px rgba(11,20,16,.13); }
.whats-sales-message.inbound::before { content: ""; position: absolute; top: 0; left: -7px; border-top: 8px solid #fff; border-left: 8px solid transparent; }
.whats-sales-message.outbound { align-self: flex-end; background: #d9fdd3; }
.whats-sales-message.outbound::after { content: ""; position: absolute; top: 0; right: -7px; border-top: 8px solid #d9fdd3; border-right: 8px solid transparent; }
.whats-sales-message small { display: flex; justify-content: flex-end; align-items: center; gap: 3px; margin-top: 4px; color: #667781; text-align: right; font-size: 10px; }
.whats-sales-date-separator { display: flex; justify-content: center; width: 100%; margin: 5px 0; }
.whats-sales-date-separator span { padding: 6px 11px; border-radius: 8px; background: rgba(255,255,255,.88); color: #54656f; font-size: 11px; font-weight: 700; box-shadow: 0 1px 1px rgba(11,20,16,.12); }
.whats-sales-reactions { position: absolute; right: 8px; bottom: -13px; z-index: 2; min-width: 25px; padding: 2px 6px; border: 1px solid #d7ded9; border-radius: 999px; background: #fff; font-size: 14px; line-height: 18px; text-align: center; box-shadow: 0 1px 2px rgba(11,20,16,.16); }
.whats-sales-message.inbound .whats-sales-reactions { right: auto; left: 8px; }
.whats-sales-message:has(.whats-sales-reactions) { margin-bottom: 9px; }
.whats-sales-react-trigger { position: absolute; top: 50%; right: -34px; width: 27px; height: 27px; min-height: 0; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.94); color: #667781; opacity: 0; box-shadow: 0 1px 3px rgba(11,20,16,.18); transition: opacity .15s; }
.whats-sales-message.outbound .whats-sales-react-trigger { right: auto; left: -34px; }
.whats-sales-message:hover .whats-sales-react-trigger, .whats-sales-react-trigger:focus { opacity: 1; }
.whats-sales-reaction-picker { position: absolute; right: -2px; bottom: calc(100% + 7px); z-index: 8; display: flex; gap: 2px; padding: 5px; border: 1px solid #d7ded9; border-radius: 999px; background: #fff; box-shadow: 0 4px 15px rgba(11,20,16,.18); }
.whats-sales-message.outbound .whats-sales-reaction-picker { right: 0; }
.whats-sales-reaction-picker[hidden] { display: none; }
.whats-sales-reaction-picker button { min-width: 31px; min-height: 31px; padding: 2px; border: 0; border-radius: 50%; background: transparent; font-size: 20px; box-shadow: none; }
.whats-sales-reaction-picker button:hover { background: #f0f2f5; transform: scale(1.08); }
.whats-sales-checks { letter-spacing: -4px; padding-right: 4px; color: #667781; font-size: 13px; font-weight: 900; }
.whats-sales-checks.is-read { color: #53bdeb; }
.whats-sales-failed { display: inline-grid; place-items: center; width: 15px; height: 15px; border-radius: 50%; background: #d93025; color: #fff; font-weight: 900; }
.whats-sales-failure-detail { color: #b3261e; font-weight: 700; }
.whats-sales-retry { min-height: 24px; padding: 2px 7px; border: 1px solid #b3261e; border-radius: 999px; background: #fff; color: #b3261e; font-size: 10px; font-weight: 800; cursor: pointer; }
.whats-sales-clock { color: #667781; font-size: 11px; }
.whats-sales-message-media { display: grid; gap: 7px; min-width: 220px; }
.whats-sales-message-media img, .whats-sales-message-media video { display: block; width: min(100%, 360px); max-height: 340px; border-radius: 8px; object-fit: contain; background: #e8ece9; }
.whats-sales-message-media audio { width: min(100%, 330px); }
.whats-sales-message-media button { justify-self: start; min-height: 34px; padding: 7px 10px; }
.whats-sales-media-loading { color: #667069; font-size: 12px; }
.whats-sales-attachment-preview { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 12px; border-top: 1px solid #d7e4db; background: #edf9f2; color: #135d37; font-size: 12px; font-weight: 700; }
.whats-sales-attachment-preview[hidden] { display: none; }
.whats-sales-attachment-preview button { min-height: 32px; padding: 6px 9px; }
.whats-sales-composer { display: grid; grid-template-columns: auto auto auto 1fr auto; align-items: center; gap: 8px; padding: 9px 11px; border-top: 1px solid #d6dbd8; background: #f0f2f5; }
.whats-sales-composer > button { min-width: 40px; min-height: 40px; border-radius: 50%; padding: 8px; background: transparent; color: #54656f; box-shadow: none; }
.whats-sales-composer > button[type="submit"] { min-width: 76px; border-radius: 999px; background: #00a884; color: #fff; }
.whats-sales-composer button.is-recording { background: #b42318; color: #fff; animation: whats-sales-pulse 1.1s infinite; }
.whats-sales-composer textarea { min-height: 42px; max-height: 110px; resize: vertical; padding: 11px 15px; border: 0; border-radius: 22px; outline: none; background: #fff; color: #111b21; box-shadow: none; }
.whats-sales-composer textarea:focus { box-shadow: 0 0 0 2px rgba(0,168,132,.18); }
@keyframes whats-sales-pulse { 50% { opacity: .65; } }
.whats-sales-customer-title { display: flex; align-items: center; gap: 11px; padding-bottom: 14px; border-bottom: 1px solid #edf0ee; }
.whats-sales-customer-title div { display: grid; gap: 3px; min-width: 0; }
.whats-sales-customer-title small { color: #68736b; }
.whats-sales-score-row { display: flex; justify-content: space-between; align-items: center; margin: 13px 0; padding: 10px; border-radius: 9px; background: #f5f8f6; }
.whats-sales-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 0 0 14px; }
.whats-sales-facts div { min-width: 0; }
.whats-sales-facts dt { color: #788179; font-size: 10px; text-transform: uppercase; }
.whats-sales-facts dd { margin: 3px 0 0; overflow: hidden; color: #263229; font-size: 12px; text-overflow: ellipsis; }
.whats-sales-field { display: grid; gap: 5px; color: #68736b; font-size: 11px; font-weight: 700; }
.whats-sales-customer-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 13px; }
.whats-sales-temperature-hot { color: #b3261e; }
.whats-sales-temperature-warm { color: #9a6400; }
.whats-sales-temperature-cold { color: #2867a5; }
.whats-sales-inline-empty { padding: 25px 16px; color: #717b74; text-align: center; }
@media (max-width: 1180px) { .whats-sales-inbox { grid-template-columns: 290px 1fr; } .whats-sales-customer-pane { display: none; } }
@media (max-width: 760px) { .whats-sales-toolbar, .whats-sales-toolbar-actions { align-items: stretch; flex-direction: column; } .whats-sales-inbox { grid-template-columns: 1fr; } .whats-sales-chat-pane { min-height: 520px; } }
@media (max-width: 980px) { .whats-sales-coexistence { grid-template-columns: 1fr; } .whats-sales-coexistence > button { justify-self: start; } }