.loading-screen{padding:80px;text-align:center}.login-screen{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;background:#fff}.login-intro{background:#123d35;color:#fff;padding:9vw;display:flex;flex-direction:column;justify-content:center}.login-intro .brand{padding:0 0 50px;font-size:28px}.login-intro h1{font-size:44px;line-height:1.25;letter-spacing:-1.6px}.login-intro p{font-size:17px;line-height:1.8;color:#b3ccbe;margin-top:25px}.login-card{padding:8vw;align-self:center}.login-card h2{font-size:28px}.login-card label{display:block;margin:18px 0 7px;font-size:14px}.login-card input{width:100%;padding:13px}.login-card .btn{margin-top:24px;width:100%;padding:14px}.login-card .subtitle{font-size:14px}.form-error{color:#b43b2e;background:#fff1eb;padding:12px;border-radius:7px;white-space:pre-wrap;margin-top:15px}.form-error:empty{display:none}.presence{display:inline-flex;gap:7px;align-items:center;font-size:12px;border:1px solid #d9e4d7;padding:7px 10px;border-radius:20px;background:#f4f8ee}.presence:before{content:'';width:7px;height:7px;border-radius:50%;background:#aaa}.presence.online:before{background:#499856}.online-badge{color:#37734b}.offline-badge{color:#929a90}.connection-state{font-size:11px;color:#859480}.connection-state.error{color:#b74033}.sla-chip{color:#af4938;background:#fff0eb;border:1px solid #efd6cd;border-radius:5px;padding:3px 7px;font-size:11px;white-space:nowrap}.waiting-chip{color:#8c7c4f;font-size:11px}.topbar .top-actions{gap:10px}.nav-label{font-size:12px}.page-head .subtitle{font-size:14px}.message-meta{font-size:12px}.chat .messages{scroll-behavior:smooth}.composer textarea{min-height:65px;font-size:16px}.composer .compose-hint{line-height:1.6}.chat-head .flex{min-width:0}.chat-head h3{overflow-wrap:anywhere}.message p{font-size:15px}.detail-row select{font-size:12px;max-width:130px}.notice{font-size:14px}.check-label{display:flex!important;gap:9px;align-items:flex-start}.check-label input{width:auto!important;margin-top:6px!important}.helper{font-size:12px;color:#81927e;line-height:1.6}.table-tools{display:flex;justify-content:space-between;gap:15px;margin-bottom:18px}.table-tools input{width:280px}.modal-body pre{white-space:pre-wrap;max-height:180px;overflow:auto}.btn.danger{color:#a84031}.sender-note{background:#f0f5ea;padding:8px 12px;border-bottom:1px solid #e0e7da;font-size:12px;color:#6b7d61}.inbox{height:calc(100dvh - 340px);min-height:400px}.notification-row{padding:16px 0;border-bottom:1px solid #e4e9df}.notification-row button{text-align:left}.notification-row p{font-size:14px;line-height:1.6}.unread-count{background:#bdef8d;color:#17482f;border-radius:8px;padding:2px 6px;font-size:11px}.field-wide{width:100%}.empty-chat{margin:auto;padding:25px;max-width:400px;text-align:center;color:#859378;line-height:1.9}.csv-preview{max-height:240px;overflow:auto;margin-top:15px}.csv-preview th,.csv-preview td{padding:10px;font-size:12px}.form-grid{gap:15px}.modal-body input:invalid:not(:placeholder-shown){border-color:#dcd9ca}.audit small{font-size:12px}.profile-text{min-width:0;overflow-wrap:anywhere}.profile-text>span{font-size:13px}.sidebar .plan{margin-top:14px}.quiet-button{font-size:12px;color:#aec6b5;padding:8px}.toolbar-buttons{display:flex;gap:8px;flex-wrap:wrap}.full-span{grid-column:1/-1}@media(max-width:900px){.inbox{grid-template-columns:250px minmax(260px,1fr)}.header-number{display:none}.topbar{padding:0 16px}}@media(max-width:650px){.login-screen{grid-template-columns:1fr}.login-intro{padding:35px}.login-intro .brand{padding-bottom:25px}.login-intro h1{font-size:28px}.login-intro p{display:none}.login-card{padding:30px}.topbar .top-actions{gap:5px}.presence{padding:6px 8px;font-size:11px}.topbar .demo{display:none}.topbar .top-actions>.icon-btn{display:flex}.breadcrumb{display:none}.inbox{display:block;min-height:440px;height:calc(100dvh - 300px)}.main{padding-top:15px}.page-head .subtitle{font-size:12px}.page-head .toolbar-buttons{max-width:130px;justify-content:flex-end}.chat-head-actions .btn{padding:7px}.chat-head h3{font-size:14px}.table-tools{flex-direction:column}.stats{margin-bottom:15px}.stat-foot{display:none}.sender-note{font-size:11px}.compose-tools .btn{font-size:12px}.sidebar.mobile-open{overflow:auto}.sidebar.mobile-open .nav-bottom{padding-top:12px}}
.language-picker{font-size:12px;min-width:95px;padding:7px 9px;background:#f7faf5}.login-card>.language-picker{margin-bottom:22px}[dir=rtl] .sidebar{left:auto;right:0}[dir=rtl] .shell{margin-left:0;margin-right:216px}[dir=rtl] .nav-item,[dir=rtl] .conversation,[dir=rtl] .template-option,[dir=rtl] th,[dir=rtl] td{text-align:right}[dir=rtl] .nav-item .count{margin-left:0;margin-right:auto}[dir=rtl] .chat-list{border-right:0;border-left:1px solid var(--line)}[dir=rtl] .details{border-left:0;border-right:1px solid var(--line)}[dir=rtl] .message.out{margin-left:0;margin-right:auto}[dir=rtl] .search svg{left:auto;right:10px}[dir=rtl] .search input{padding-left:10px;padding-right:33px}[dir=rtl] input[type=email],[dir=rtl] input[type=tel]{direction:ltr;text-align:right}[dir=rtl] .conversation{border-left:0;border-right:3px solid transparent}[dir=rtl] .conversation.selected{border-right-color:#4c7d3c}
@media(max-width:1250px){[dir=rtl] .shell{margin-right:190px}}@media(max-width:900px){[dir=rtl] .shell{margin-right:76px}}@media(max-width:650px){[dir=rtl] .shell{margin-right:0}.language-picker{min-width:75px;width:84px;font-size:11px}.topbar .top-actions{gap:3px}.topbar .connection-state{display:none}}

/* Inbox workspace: use the available screen for conversation history. */
.shell:has(> .main > .inbox){height:100vh;height:100dvh;min-width:0;display:flex;flex-direction:column}
.shell:has(> .main > .inbox) > .topbar{height:60px;min-height:60px;padding-inline:20px;flex-shrink:0}
.main:has(> .inbox){display:flex;flex:1;flex-direction:column;min-height:0;min-width:0;gap:10px;padding:14px 20px 16px;overflow:hidden}
.main:has(> .inbox) > .page-head{margin:0;min-height:36px;flex-shrink:0}
.main:has(> .inbox) > .page-head h1{font-size:23px;line-height:1.3}
.main:has(> .inbox) > .page-head .subtitle{display:none}
.main:has(> .inbox) > .page-head .btn{padding:8px 12px}
.main:has(> .inbox) > .stats{display:flex;gap:8px;margin:0;flex-shrink:0;overflow-x:auto;overscroll-behavior-inline:contain}
.main:has(> .inbox) > .stats > .stat{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:1;min-width:0;padding:8px 12px;border-radius:8px}
.main:has(> .inbox) .stat-label{font-size:12px;line-height:1.4}
.main:has(> .inbox) .stat-value{margin:0;font-size:19px;line-height:1.2;letter-spacing:0}
.main:has(> .inbox) .stat-foot{display:none}
.main > .inbox{flex:1;height:auto;min-height:0;grid-template-columns:270px minmax(0,1fr) 240px}
.main > .inbox .chat-list,.main > .inbox .details{min-height:0;overscroll-behavior:contain}
.main > .inbox .list-head{padding:13px 14px 10px}
.main > .inbox .list-title{margin-bottom:10px}
.main > .inbox .filters{margin-top:9px}
.main > .inbox .conversation{padding:14px 12px}
.main > .inbox .chat-head{padding:10px 14px;flex-shrink:0}
.main > .inbox .chat-head .avatar{width:36px;height:36px}
.main > .inbox .sender-note{padding:5px 12px;flex-shrink:0}
.main > .inbox .messages{min-height:0;padding:18px 20px;overscroll-behavior:contain}
.main > .inbox .composer{flex-shrink:0;padding:0 14px 10px;border-top:1px solid var(--line)}
.main > .inbox .compose-tabs{margin-bottom:4px}
.main > .inbox .compose-tab{padding:8px 2px 7px}
.main > .inbox .composer textarea{display:block;height:52px;min-height:52px;max-height:120px;padding:8px 1px;resize:vertical;line-height:1.5}
.main > .inbox .compose-tools{gap:8px;flex-wrap:wrap}
.main > .inbox .compose-tools > .flex{flex-wrap:wrap;gap:6px}
.main > .inbox .compose-hint{margin-top:5px;font-size:11px;line-height:1.4}
.main > .inbox .details{padding:14px}
.main > .inbox .detail-title{margin-bottom:14px}
.main > .inbox .partner-profile{padding-bottom:14px}
.main > .inbox .detail-section{padding:14px 0}
@media(min-width:1700px){.main > .inbox{grid-template-columns:300px minmax(0,1fr) 255px}}
@media(max-width:1250px){.main > .inbox{grid-template-columns:250px minmax(0,1fr)}}
@media(max-width:900px){
 .main:has(> .inbox){padding:10px 12px 12px;gap:8px}
 .main > .inbox{grid-template-columns:220px minmax(0,1fr)}
 .main:has(> .inbox) > .stats > .stat{padding:7px 9px;gap:8px;min-width:130px}
 .main > .inbox .messages{padding:14px}
}
@media(max-width:650px){
 .shell:has(> .main > .inbox) > .topbar{height:56px;min-height:56px;padding-inline:12px}
 .main:has(> .inbox){padding:8px;gap:7px}
 .main:has(> .inbox) > .page-head{min-height:32px}
 .main:has(> .inbox) > .page-head h1{font-size:20px}
 .main:has(> .inbox) > .page-head .toolbar-buttons{max-width:none}
 .main:has(> .inbox) > .stats > .stat{flex:0 0 auto;min-width:135px;padding:6px 9px}
 .main > .inbox{display:block;height:auto;min-height:0;border-radius:8px}
 .main > .inbox .chat-head{padding:9px 10px}
 .main > .inbox .composer{padding:0 10px 8px}
 .main > .inbox .composer textarea{height:48px;min-height:48px;max-height:100px}
 .main > .inbox .compose-tools .btn{padding:7px 8px;font-size:11px}
 .main > .inbox .compose-tools > .flex{gap:4px}
 .main > .inbox .compose-hint{font-size:10px}
}
/* Keep content reachable at high zoom or while a small on-screen keyboard is open. */
@media(max-height:560px){
 .shell:has(> .main > .inbox){height:auto;min-height:100vh;min-height:100dvh}
 .main > .inbox{flex:none;height:450px;min-height:450px}
}
