/* Workspace styling: EasyKey brand. Tokens live in theme.css. No frontend framework. */
.workspace { min-height:100vh; background:var(--ek-bg); color:var(--ek-navy); font-family:var(--ek-font); font-size:15px; }

/* Shell: navy sidebar + content */
.workspace .ws-shell { display:flex; flex-wrap:wrap; min-height:100vh; align-items:stretch; }
.workspace .ws-side { flex:1 1 252px; max-width:100%; background:var(--ek-navy); color:var(--ek-on-navy); padding:22px 14px; display:flex; flex-direction:column; gap:20px; }
.workspace .ws-main { flex:999 1 560px; min-width:0; padding:26px 30px 40px; display:flex; flex-direction:column; }
.workspace .ws-title { margin:0 0 6px; font-size:28px; line-height:1.25; font-weight:700; }
.workspace .ws-brand { display:flex; align-items:center; gap:10px; padding:0 8px; }
.workspace .ws-brand b { display:block; font-size:22px; letter-spacing:-.3px; line-height:1.1; }
.workspace .ws-easy { color:#fff; } .workspace .ws-key { color:var(--ek-blue-soft); }
.workspace .ws-brand small { display:block; font-size:12px; color:var(--ek-on-navy-muted); }
.workspace .ws-side nav { display:flex; flex-direction:column; gap:16px; margin:0; }
.workspace .ws-group { display:flex; flex-direction:column; gap:2px; }
.workspace .ws-group-title { font-size:12px; font-weight:600; color:var(--ek-on-navy-muted); padding:0 12px 4px; }
.workspace .ws-tab { display:flex; align-items:center; gap:12px; min-height:44px; padding:0 12px; border:0; border-radius:var(--ek-radius-sm); background:transparent; color:var(--ek-on-navy); font:inherit; font-size:15px; text-align:start; width:100%; }
.workspace .ws-tab:hover { background:var(--ek-navy-2); color:#fff; }
.workspace .ws-tab[aria-current=page] { background:var(--ek-blue); color:#fff; font-weight:600; }
.workspace .ws-ico { flex:none; }
.workspace .ws-side-foot { margin-top:auto; display:flex; flex-direction:column; gap:10px; border-top:1px solid var(--ek-navy-line); padding-top:14px; }
.workspace .ws-side-actions { display:flex; gap:8px; }
.workspace .ws-side-actions button { flex:1; min-height:40px; border:1px solid #2b3a66; border-radius:var(--ek-radius-sm); background:transparent; color:#fff; font-size:13px; padding:0 8px; }
.workspace .ws-side-actions button:hover { background:var(--ek-navy-2); }
.workspace .ws-user { display:flex; align-items:center; gap:10px; padding:4px; }
.workspace .ws-avatar { width:36px; height:36px; border-radius:50%; background:var(--ek-yellow); color:var(--ek-navy); display:flex; align-items:center; justify-content:center; font-weight:700; flex:none; }
.workspace .ws-user-text { flex:1; min-width:0; display:flex; flex-direction:column; }
.workspace .ws-user-text b { color:#fff; font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.workspace .ws-user-text small { color:#aeb7d0; font-size:12px; }
.workspace .ws-icon-btn { width:44px; height:44px; border:0; border-radius:var(--ek-radius-sm); background:transparent; color:var(--ek-on-navy); display:flex; align-items:center; justify-content:center; padding:0; }
.workspace .ws-icon-btn:hover { background:var(--ek-navy-2); color:#fff; }

/* Compact rail on a conversation detail */
@media (min-width:1100px) {
  .workspace .ws-compact .ws-side { flex:0 0 72px; padding:16px 12px; align-items:center; }
  .workspace .ws-compact .ws-brand { padding:0; }
  .workspace .ws-compact .ws-brand > span, .workspace .ws-compact .ws-group-title, .workspace .ws-compact .ws-tab span,
  .workspace .ws-compact .ws-side-actions, .workspace .ws-compact .ws-user-text, .workspace .ws-compact .ws-avatar { display:none; }
  .workspace .ws-compact .ws-tab { width:48px; height:48px; padding:0; justify-content:center; }
  .workspace .ws-compact .ws-side-foot { border:0; }
}
/* Phone: sidebar becomes a top bar with a scrollable tab strip */
@media (max-width:760px) {
  .workspace .ws-side { flex-basis:100%; padding:12px; gap:10px; }
  .workspace .ws-side nav { flex-direction:row; overflow-x:auto; gap:4px; }
  .workspace .ws-group { flex-direction:row; gap:4px; }
  .workspace .ws-group-title, .workspace .ws-brand small { display:none; }
  .workspace .ws-tab { width:auto; white-space:nowrap; flex:none; }
  .workspace .ws-side-foot { margin-top:0; flex-direction:row; align-items:center; padding-top:10px; }
  .workspace .ws-user-text { display:none; }
  .workspace .ws-main { padding:16px 14px 32px; }
  .workspace .ws-title { font-size:22px; }
}

/* Generic controls */
.workspace header,.workspace .toolbar { display:flex; flex-wrap:wrap; align-items:flex-end; gap:8px; margin-bottom:16px; }
.workspace form#filters { background:var(--ek-surface); border:1px solid var(--ek-line); border-radius:var(--ek-radius-lg); padding:12px 14px; }
.workspace form#filters label { margin:0; font-size:12px; color:var(--ek-muted); }
.workspace input,.workspace select,.workspace textarea { min-height:40px; padding:8px 10px; border:1px solid var(--ek-line-strong); border-radius:var(--ek-radius-sm); max-width:100%; background:#fff; color:var(--ek-navy); font:inherit; font-size:14px; }
.workspace input[type=checkbox],.workspace input[type=radio] { min-height:0; min-width:0; width:18px; height:18px; accent-color:var(--ek-blue); }
.workspace input:focus,.workspace select:focus,.workspace textarea:focus { outline:0; border-color:var(--ek-blue); box-shadow:var(--ek-focus); }
.workspace input,.workspace select { min-width:120px; }
.workspace textarea { width:100%; min-height:80px; }
.workspace label { display:flex; flex-direction:column; gap:5px; margin:8px 0; font-size:13px; color:var(--ek-text-2); }
/* Fields inside a toolbar row line up with its button: the 8px label margin would lift them above it. */
.workspace .toolbar > label { margin:0; }
.workspace label:has(> input[type=checkbox]) { flex-direction:row; align-items:center; gap:8px; }
.workspace .ws-main button { cursor:pointer; min-height:40px; padding:0 14px; border:1px solid var(--ek-line-strong); border-radius:var(--ek-radius-sm); background:#fff; color:var(--ek-navy); font:inherit; font-size:14px; font-weight:600; }
.workspace .ws-main button:hover:not(:disabled) { border-color:var(--ek-blue); color:var(--ek-blue-dark); }
.workspace .ws-main button:disabled { opacity:.5; cursor:not-allowed; }
.workspace .ws-main form > button:last-child, .workspace .ws-main form .toolbar > button:last-child, .workspace .ws-main button[data-action=takeover] { background:var(--ek-blue); border-color:var(--ek-blue); color:#fff; }
.workspace .ws-main form > button:last-child:hover:not(:disabled), .workspace .ws-main form .toolbar > button:last-child:hover:not(:disabled) { background:var(--ek-blue-dark); color:#fff; }
.workspace .ws-main button[data-action=takeover] { background:var(--ek-yellow); border-color:var(--ek-yellow); color:var(--ek-navy); }
.workspace .ws-main button[data-action$=delete], .workspace .ws-main button[data-action=user-cancel] { color:var(--ek-danger); }
.workspace a { color:var(--ek-blue-dark); }
.workspace h2 { font-size:22px; margin:6px 0 14px; }
.workspace h3 { font-size:17px; margin:18px 0 10px; }
.workspace .card h3 { margin-top:0; }
.workspace details > summary { cursor:pointer; font-weight:600; min-height:28px; }

/* Cards and tables */
.workspace .grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:14px; margin-bottom:16px; }
.workspace .card { padding:18px; background:var(--ek-surface); border:1px solid var(--ek-line); border-radius:var(--ek-radius-lg); margin-bottom:14px; overflow-wrap:anywhere; }
.workspace .table-wrap { overflow:auto; margin-bottom:14px; background:var(--ek-surface); border:1px solid var(--ek-line); border-radius:var(--ek-radius-lg); }
.workspace table { border-collapse:collapse; width:100%; background:#fff; font-size:14px; }
.workspace th { position:sticky; top:0; background:var(--ek-bg); color:var(--ek-text-2); font-size:13px; font-weight:600; }
.workspace th,.workspace td { padding:11px 12px; border-bottom:1px solid var(--ek-line); text-align:start; vertical-align:top; }
.workspace tbody tr:last-child td { border-bottom:0; }
.workspace tbody tr:hover { background:#f8f9fd; }
.workspace td small { display:block; color:var(--ek-muted); font-size:12px; }
.workspace .review-table table { min-width:46rem; }
.workspace .review-table td:last-child { white-space:nowrap; }
.workspace .badge { display:inline-block; background:var(--ek-violet-tint); color:var(--ek-violet); border-radius:6px; padding:2px 8px; font-size:12px; font-weight:600; }
.workspace .attention { background:var(--ek-yellow-tint); }
.workspace p.attention { border:1px solid var(--ek-yellow-line); color:var(--ek-yellow-text); border-radius:var(--ek-radius-sm); padding:8px 12px; }
.workspace tr.attention td:first-child { box-shadow:inset -4px 0 0 var(--ek-yellow); }
.workspace[dir=ltr] tr.attention td:first-child { box-shadow:inset 4px 0 0 var(--ek-yellow); }
.workspace .unread { font-weight:700; }
.workspace .error { color:var(--ek-danger); white-space:pre-wrap; margin:0; min-height:0; }
.workspace .error:not(:empty) { margin:0 0 12px; background:var(--ek-danger-tint); border-radius:var(--ek-radius-sm); padding:8px 12px; }
.workspace .muted { color:var(--ek-muted); }
.workspace pre { white-space:pre-wrap; overflow-wrap:anywhere; }

/* KPI cards */
.workspace .kpi { display:flex; flex-direction:column; gap:10px; margin:0; }
.workspace .kpi-head { display:flex; justify-content:space-between; align-items:center; gap:8px; font-size:14px; font-weight:600; color:var(--ek-text-2); }
.workspace .metric { font-size:32px; line-height:1.05; font-weight:700; color:var(--ek-navy); }
.workspace .kpi.is-null { border-style:dashed; border-color:#b8c0d4; background:#fafbfd; }
.workspace .kpi.is-null .metric { font-size:22px; color:var(--ek-muted); }
.workspace .kpi.is-urgent { background:#fffbeb; border-color:var(--ek-yellow-line); }
.workspace .kpi small { color:var(--ek-muted); font-size:13px; line-height:1.5; }
.workspace .cost-band { background:var(--ek-navy); color:#fff; border-radius:18px; padding:20px; margin:4px 0 16px; }
.workspace .cost-band h3 { margin:0; color:#fff; }
.workspace .cost-band .band-head { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px; margin-bottom:14px; }
.workspace .cost-band .band-head a { color:#ffd54a; font-weight:600; }
.workspace .cost-band .grid { margin:0; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); }
.workspace .cost-band .card { background:var(--ek-navy-2); border:0; margin:0; padding:14px; }
.workspace .cost-band .kpi-head { color:#aeb7d0; font-weight:500; font-size:13px; }
.workspace .cost-band .metric { color:#fff; font-size:22px; }
.workspace .cost-band .kpi.is-null .metric { color:#aeb7d0; font-size:17px; }
.workspace .admin-pill { font-size:11px; font-weight:700; border-radius:999px; padding:2px 8px; background:var(--ek-navy-line); color:var(--ek-on-navy); }
.workspace .chart-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr)); gap:14px; margin-bottom:16px; }
.workspace .chart-card { margin:0; display:flex; flex-direction:column; gap:10px; }
.workspace .chart-card.wide { grid-column:1/-1; }
.workspace .chart-card h3 { margin:0; }
.workspace .chart-card details { font-size:13px; }
.workspace .chart-card .table-wrap { margin:8px 0 0; }
.workspace .heatmap { display:grid; grid-template-columns:72px repeat(24,minmax(14px,1fr)); gap:3px; font-size:11px; color:var(--ek-muted); overflow-x:auto; min-width:560px; }
.workspace .heatmap span { height:22px; border-radius:4px; }
.workspace .heatmap .hm-label { height:auto; align-self:center; font-size:12px; color:var(--ek-text-2); }
.workspace .heatmap-wrap { overflow-x:auto; }

/* Conversation detail */
.workspace .chat-layout { display:grid; grid-template-columns:minmax(0,2fr) minmax(280px,1fr); gap:16px; }
.workspace .chat-layout aside .card { padding:16px; }
.workspace .timeline { max-height:65vh; overflow:auto; background:var(--ek-bg-2); border-color:var(--ek-line); display:flex; flex-direction:column; }
.workspace .bubble { display:block; width:fit-content; max-width:78%; padding:11px 14px; margin:6px 0; background:var(--ek-blue-tint); border:1px solid var(--ek-blue-line); border-radius:16px; white-space:pre-wrap; line-height:1.65; margin-inline-start:auto; }
.workspace .bubble > a:first-child { display:block; font-size:12px; font-weight:700; color:var(--ek-blue-dark); text-decoration:none; margin-bottom:2px; white-space:normal; }
.workspace .bubble.customer { margin-inline-start:0; margin-inline-end:auto; background:#fff; border-color:var(--ek-line); }
.workspace .bubble.customer > a:first-child { color:var(--ek-text-2); }
.workspace .bubble.agent, .workspace .bubble.human { background:var(--ek-yellow-tint); border-color:var(--ek-yellow-line); }
.workspace .bubble.agent > a:first-child, .workspace .bubble.human > a:first-child { color:var(--ek-yellow-text); }
.workspace .bubble.system { margin-inline:auto; background:var(--ek-bg); border-style:dashed; font-size:13px; }
.workspace .bubble > small { display:block; margin-top:4px; color:var(--ek-muted); font-size:12px; }
.workspace .bubble .badge { margin-top:6px; }
.workspace .bubble:target, .workspace .bubble.linked-message { outline:3px solid var(--ek-blue); }
.workspace .bubble img,.workspace .bubble video { max-width:100%; max-height:300px; border-radius:10px; }
.workspace .bubble iframe { width:min(600px,75vw); height:420px; border:1px solid var(--ek-line); border-radius:10px; }
.workspace .selected-choice { border:1px solid var(--ek-blue); }
.workspace .message-location { padding:8px; border:1px solid var(--ek-line-strong); border-radius:10px; }
.workspace #reply-window { font-weight:700; color:var(--ek-success); }
.workspace blockquote { margin:6px 0; background:var(--ek-bg); border-radius:10px; padding:8px 12px; color:var(--ek-text-2); }
@media(max-width:900px) { .workspace .chat-layout { grid-template-columns:1fr; } .workspace .bubble { max-width:92%; } }

.workspace .request-event { padding:12px 0; border-block-start:1px solid var(--ek-line); }
.workspace .request-event small { display:block; margin-top:5px; }

.customer-evidence{display:block;margin:0 0 .7rem;color:var(--ek-muted);font-size:12px;overflow-wrap:anywhere}

/* Status chips */
.workspace .status-chip { display:inline-block; font-size:12px; font-weight:600; border-radius:6px; padding:2px 8px; background:var(--ek-bg-2); color:var(--ek-text-2); white-space:nowrap; }
.workspace .st-bot_handling { background:var(--ek-blue-tint); color:var(--ek-blue-dark); }
.workspace .st-needs_agent, .workspace .st-invited { background:#fff3d1; color:var(--ek-yellow-text); }
.workspace .st-with_agent, .workspace .st-active, .workspace .st-ready, .workspace .st-published { background:var(--ek-success-tint); color:var(--ek-success); }
.workspace .st-closed, .workspace .st-disabled, .workspace .st-inactive { background:var(--ek-bg-2); color:var(--ek-text-2); }
.workspace .st-failed { background:var(--ek-danger-tint); color:var(--ek-danger); }
.workspace .heatmap .hm-hour { text-align:center; }
.workspace .cost-band .kpi small { color:#aeb7d0; }
.workspace .cost-band .kpi.is-null { border:1px dashed #3a4a7a; background:var(--ek-navy-2); }

/* ---------- WhatsApp-style conversations and test chat ---------- */
.workspace .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.workspace .soft-chip { display:inline-block; font-size:12px; border-radius:6px; padding:2px 8px; background:var(--ek-bg-2); color:var(--ek-text-2); white-space:nowrap; }
.workspace .mono-chip { display:inline-flex; align-items:center; gap:4px; font:500 11px/1.6 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; border-radius:6px; padding:1px 7px; background:var(--wa-chip); color:var(--wa-meta); white-space:nowrap; }
.workspace .mono-chip.is-warn { background:#fff3d1; color:var(--ek-yellow-text); }
.workspace .wa-avatar { width:42px; height:42px; border-radius:50%; flex:none; display:inline-flex; align-items:center; justify-content:center; font-weight:700; background:var(--ek-blue-tint); color:var(--ek-blue-dark); }
.workspace .wa-avatar.is-large { width:64px; height:64px; font-size:24px; }
.workspace .wa-avatar.is-bot { background:var(--ek-blue); color:#fff; }

/* Inbox list */
.workspace .inbox-panel { background:var(--ek-surface); border:1px solid var(--ek-line); border-radius:var(--ek-radius-lg); padding:14px; }
.workspace .inbox-tabs { display:flex; gap:4px; overflow-x:auto; background:var(--ek-bg-2); border-radius:12px; padding:4px; margin-bottom:12px; }
.workspace .ws-main .inbox-tabs button { flex:none; min-height:36px; border:0; background:transparent; color:var(--ek-text-2); font-weight:600; }
.workspace .ws-main .inbox-tabs button[aria-selected=true] { background:#fff; color:var(--ek-navy); box-shadow:0 1px 2px rgba(11,23,54,.12); }
.workspace form.inbox-search { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:10px; }
.workspace .inbox-q { flex:1 1 220px; margin:0; }
.workspace .inbox-q input { width:100%; }
.workspace .inbox-more { flex-basis:100%; }
.workspace .inbox-more > summary { font-size:13px; color:var(--ek-blue-dark); }
.workspace .inbox-list { display:flex; flex-direction:column; }
.workspace a.inbox-card { display:flex; gap:12px; padding:12px; border-radius:12px; color:var(--ek-navy); text-decoration:none; border-inline-start:3px solid transparent; }
.workspace a.inbox-card + a.inbox-card { margin-top:2px; }
.workspace a.inbox-card:hover { background:var(--ek-bg); }
.workspace a.inbox-card.is-current { background:var(--ek-blue-tint); }
.workspace a.inbox-card.is-urgent { border-inline-start-color:var(--ek-yellow); }
.workspace .inbox-card-body { flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
.workspace .inbox-card-top { display:flex; justify-content:space-between; gap:8px; }
.workspace .inbox-card-top b { font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.workspace .is-unread .inbox-card-top b, .workspace .is-unread .inbox-card-preview { font-weight:700; color:var(--ek-navy); }
.workspace .inbox-card-top time { font-size:12px; color:var(--ek-muted); flex:none; }
.workspace .inbox-card-preview { font-size:13px; color:var(--ek-muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.workspace .inbox-card-chips { display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.workspace .unread-dot { width:9px; height:9px; border-radius:50%; background:var(--ek-blue); margin-inline-start:auto; }

/* Conversation split view */
.workspace .ws-compact .ws-title { display:none; }
.workspace .conv-split { display:grid; grid-template-columns:minmax(0,1fr); gap:14px; align-items:start; }
.workspace .conv-list { display:none; }
@media (min-width:1100px) {
  .workspace .conv-split { grid-template-columns:300px minmax(0,1fr); }
  .workspace .conv-list { display:block; background:var(--ek-surface); border:1px solid var(--ek-line); border-radius:var(--ek-radius-lg); padding:8px; max-height:calc(100vh - 60px); overflow:auto; position:sticky; top:12px; }
  .workspace .conv-aside { grid-column:2; }
  .workspace .wa-back { display:none !important; }
}
@media (min-width:1400px) {
  .workspace .conv-split { grid-template-columns:300px minmax(0,1fr) 330px; }
  .workspace .conv-aside { grid-column:auto; }
}
.workspace .conv-thread { display:flex; flex-direction:column; min-width:0; border:1px solid var(--ek-line); border-radius:var(--ek-radius-lg); overflow:hidden; background:var(--wa-wall); }
.workspace .wa-head { display:flex; align-items:center; gap:12px; padding:10px 14px; background:var(--wa-header); border-bottom:1px solid var(--wa-hair); }
.workspace .wa-who { flex:1; min-width:0; display:flex; flex-direction:column; }
.workspace .wa-who b { font-weight:600; color:var(--wa-text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.workspace .wa-who small { font-size:12px; color:var(--wa-meta); display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
.workspace .wa-head-actions { display:flex; align-items:center; gap:8px; }
.workspace .ws-main .wa-icon-btn { width:40px; height:40px; min-height:40px; padding:0; border:0; border-radius:50%; background:transparent; color:var(--wa-meta); display:inline-flex; align-items:center; justify-content:center; cursor:pointer; margin:0; }
.workspace .ws-main .wa-icon-btn:hover { background:var(--wa-chip); }
.workspace[dir=rtl] .wa-back svg, .workspace[dir=rtl] .wa-send svg { transform:scaleX(-1); }
.workspace .ws-main .is-urgent-btn { background:var(--ek-yellow); border-color:var(--ek-yellow); color:var(--ek-navy); }
.workspace .wa-menu { position:relative; }
.workspace .wa-menu > summary { list-style:none; width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--wa-meta); cursor:pointer; }
.workspace .wa-menu > summary::-webkit-details-marker { display:none; }
.workspace .wa-menu[open] > summary { background:var(--wa-chip); }
.workspace .wa-menu-body { position:absolute; inset-inline-end:0; top:46px; z-index:20; width:min(320px,80vw); background:#fff; border:1px solid var(--ek-line); border-radius:14px; box-shadow:var(--ek-shadow); padding:12px; display:flex; flex-direction:column; gap:10px; }
.workspace .wa-menu-row { display:flex; flex-wrap:wrap; align-items:flex-end; gap:8px; }
.workspace .wa-menu-row label { flex:1; margin:0; }
.workspace .wa-menu-row select { min-width:0; width:100%; }
.workspace .wa-banner { margin:0; padding:7px 14px; font-size:13px; background:#fff3d1; color:var(--ek-yellow-text); border-bottom:1px solid var(--ek-yellow-line); }
.workspace .wa-history { background:var(--wa-header); padding:8px 14px; border-bottom:1px solid var(--wa-hair); font-size:13px; }
.workspace .wa-history[open] { max-height:40vh; overflow:auto; }
.workspace .wa-wall { flex:1; min-height:360px; max-height:calc(100vh - 290px); overflow-y:auto; padding:14px 16px 18px; background-color:var(--wa-wall); background-image:radial-gradient(var(--wa-wall-dot) 1px, transparent 1px); background-size:18px 18px; display:flex; flex-direction:column; }
.workspace .wa-wall.is-mini { min-height:0; max-height:260px; border-radius:12px; margin-top:10px; }
.workspace .wa-day, .workspace .wa-event { align-self:center; margin:10px auto; background:var(--wa-system); color:var(--wa-meta); font-size:12px; border-radius:8px; padding:4px 10px; text-align:center; max-width:90%; box-shadow:0 1px .5px rgba(0,0,0,.08); display:inline-flex; align-items:center; gap:6px; }
.workspace .wa-event a { color:inherit; }
.workspace .wa-pager { display:flex; justify-content:center; margin:6px 0; }
.workspace .wa-row { display:flex; flex-direction:column; margin:3px 0; }
.workspace .wa-row.in { align-items:flex-start; }
.workspace .wa-row.out { align-items:flex-end; }
.workspace .wa-bubble { max-width:min(78%,560px); padding:6px 9px 4px; color:var(--wa-text); box-shadow:0 1px .5px rgba(0,0,0,.13); white-space:normal; }
.workspace .wa-bubble.in { background:var(--wa-in); border-start-start-radius:2px; border-start-end-radius:10px; border-end-start-radius:10px; border-end-end-radius:10px; }
.workspace .wa-bubble.out { background:var(--wa-out); border-start-start-radius:10px; border-start-end-radius:2px; border-end-start-radius:10px; border-end-end-radius:10px; }
.workspace .wa-bubble.actor-agent, .workspace .wa-bubble.actor-human { background:var(--wa-agent); box-shadow:inset 0 0 0 1px var(--ek-yellow-line); }
.workspace .wa-bubble.is-failed { background:var(--wa-err); }
.workspace .wa-author { font-size:12px; font-weight:600; color:var(--ek-yellow-text); margin-bottom:2px; }
.workspace .wa-bubble.in .wa-author { color:var(--ek-blue-dark); }
.workspace .wa-text { white-space:pre-wrap; overflow-wrap:anywhere; font-size:14.5px; line-height:1.6; unicode-bidi:plaintext; }
.workspace .wa-bubble img, .workspace .wa-bubble video { max-width:100%; max-height:300px; border-radius:8px; margin-top:4px; display:block; }
.workspace .wa-bubble iframe { width:min(520px,70vw); height:380px; border:0; border-radius:8px; background:#fff; }
.workspace .wa-foot { display:flex; justify-content:flex-end; align-items:center; gap:4px; margin-top:2px; font-size:11px; color:var(--wa-meta); }
.workspace a.wa-time { color:var(--wa-meta); text-decoration:none; }
.workspace a.wa-time:hover { text-decoration:underline; }
.workspace .wa-tick { color:var(--wa-meta); font-size:11px; letter-spacing:-2px; }
.workspace .wa-tick.is-read { color:#027eb5; }
.workspace .wa-tick.is-failed { color:var(--ek-danger); letter-spacing:0; font-weight:700; }
.workspace .wa-fail { font-size:12px; color:var(--ek-danger); margin-top:2px; }
.workspace .wa-under { display:flex; flex-wrap:wrap; align-items:flex-start; gap:4px; margin:4px 2px 6px; max-width:min(78%,560px); }
.workspace .wa-row.out .wa-under { justify-content:flex-end; }
.workspace .wa-review { flex-basis:100%; font-size:12px; }
.workspace .wa-review > summary { font-weight:500; color:var(--wa-link); min-height:0; display:inline-block; }
.workspace .wa-review[open] { background:#fff; border-radius:10px; padding:8px 10px; box-shadow:0 1px 2px rgba(0,0,0,.08); }
.workspace .wa-review .card { border:0; padding:0; margin:6px 0 0; }
.workspace .wa-row.linked-message .wa-bubble { outline:3px solid var(--ek-blue); outline-offset:2px; }
.workspace .wa-reply-buttons { display:grid; margin:6px -9px -4px; border-top:1px solid var(--wa-hair); }
.workspace .ws-main .wa-reply-buttons button { border:0; border-radius:0; border-bottom:1px solid var(--wa-hair); background:transparent; color:var(--wa-link); font-weight:500; min-height:40px; margin:0; }
.workspace .ws-main .wa-reply-buttons button:last-child { border-bottom:0; }
.workspace .ws-main .wa-reply-buttons button:hover:not(:disabled) { background:var(--wa-chip); color:var(--wa-link); }
.workspace .wa-dots { display:inline-flex; gap:4px; padding:6px 4px; }
.workspace .wa-dots i { width:7px; height:7px; border-radius:50%; background:var(--wa-meta); opacity:.4; animation:wa-dot 1.2s infinite ease-in-out; }
.workspace .wa-dots i:nth-child(2) { animation-delay:.15s; }
.workspace .wa-dots i:nth-child(3) { animation-delay:.3s; }
@keyframes wa-dot { 0%,80%,100% { opacity:.3; transform:translateY(0); } 40% { opacity:1; transform:translateY(-3px); } }
@media (prefers-reduced-motion:reduce) { .workspace .wa-dots i { animation:none; opacity:.7; } }

/* Composer */
.workspace .wa-window { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px; padding:6px 14px; font-size:12px; color:var(--wa-meta); background:var(--wa-header); border-top:1px solid var(--wa-hair); }
.workspace #reply-window.is-expired { color:var(--ek-danger); }
.workspace .ws-main .wa-window button { min-height:32px; font-size:12px; padding:0 10px; }
.workspace form.wa-composer { display:flex; align-items:flex-end; gap:8px; padding:8px 10px; background:var(--wa-header); margin:0; border:0; border-radius:0; }
.workspace .wa-input { flex:1; min-width:0; display:flex; flex-direction:column; gap:4px; }
.workspace .wa-composer textarea { width:100%; min-height:44px; max-height:140px; resize:vertical; border:0; border-radius:22px; padding:11px 16px; background:#fff; font-size:14.5px; box-shadow:none; }
.workspace .wa-composer textarea:disabled { background:#f6f6f6; color:var(--wa-meta); }
.workspace .wa-file { font-size:12px; color:var(--wa-meta); padding:0 12px; }
.workspace label.wa-attach { margin:2px 0; flex-direction:row; }
.workspace label.wa-quick { margin:0; }
.workspace .wa-quick select { min-width:0; max-width:150px; min-height:44px; border-radius:22px; border:0; }
.workspace .ws-main .wa-send { width:44px; height:44px; min-height:44px; padding:0; border-radius:50%; border:0; background:var(--wa-send); color:#fff; display:inline-flex; align-items:center; justify-content:center; flex:none; }
.workspace .ws-main .wa-send:hover:not(:disabled) { background:var(--ek-blue-dark); color:#fff; }
.workspace .wa-add-quick { background:var(--wa-header); padding:0 14px 10px; font-size:13px; }
.workspace .wa-add-quick form { display:flex; flex-wrap:wrap; gap:8px; align-items:flex-end; }

/* Customer panel */
.workspace .conv-aside { display:flex; flex-direction:column; gap:12px; min-width:0; }
.workspace .conv-aside .card { margin:0; }
.workspace .conv-id { display:flex; flex-direction:column; align-items:center; gap:6px; text-align:center; }
.workspace .fact-list { margin:0; display:flex; flex-direction:column; gap:10px; }
.workspace .fact-list > div { display:flex; justify-content:space-between; gap:12px; align-items:baseline; font-size:14px; border-bottom:1px solid var(--ek-line); padding-bottom:8px; }
.workspace .fact-list > div:last-child { border-bottom:0; padding-bottom:0; }
.workspace .fact-list dt { color:var(--ek-muted); }
.workspace .fact-list dd { margin:0; text-align:end; font-weight:600; display:flex; flex-direction:column; align-items:flex-end; }
.workspace .fact-list .customer-evidence { font-weight:400; margin:2px 0 0; }
.workspace .conv-edit { margin-top:12px; }
.workspace .conv-note { background:#fffbeb; border-radius:10px; padding:8px 10px; margin:0 0 8px; font-size:14px; }

/* Test chat */
.workspace .tc-top { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:14px; }
.workspace .tc-top-actions { margin-inline-start:auto; display:flex; gap:8px; }
.workspace .ws-main .is-primary-btn { background:var(--ek-blue); border-color:var(--ek-blue); color:#fff; }
.workspace .ws-main .is-primary-btn:hover:not(:disabled) { background:var(--ek-blue-dark); color:#fff; }
.workspace .tc-layout { display:grid; grid-template-columns:minmax(0,1fr); gap:16px; align-items:start; }
@media (min-width:1100px) { .workspace .tc-layout { grid-template-columns:minmax(0,560px) minmax(280px,1fr); } }
.workspace .tc-phone { display:flex; flex-direction:column; border:1px solid var(--ek-line); border-radius:18px; overflow:hidden; height:min(78vh,760px); min-height:480px; background:var(--wa-wall); box-shadow:var(--ek-shadow); }
.workspace .tc-phone .wa-wall { max-height:none; min-height:0; }
.workspace .tc-name { align-self:center; background:#fff; border-radius:12px; padding:8px 12px; margin:8px auto 10px; width:min(100%,320px); box-shadow:0 1px 2px rgba(0,0,0,.1); }
.workspace .tc-name label { display:flex; align-items:center; gap:10px; margin:0; font-weight:600; font-size:13px; white-space:nowrap; }
.workspace .tc-name input { min-width:0; flex:1; }
.workspace .tc-name input[readonly] { background:transparent; border-color:transparent; font-weight:600; padding-inline:0; }
.workspace .tc-phone .wa-bubble.is-picked { outline:2px solid var(--ek-blue-soft); outline-offset:1px; }
.workspace .tc-phone [data-test-turn] .wa-bubble { cursor:pointer; }
.workspace .tc-starters { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:6px; margin:16px 0; }
.workspace .tc-starters .muted { flex-basis:100%; text-align:center; font-size:12px; }
.workspace .ws-main .tc-starters button { border-radius:16px; min-height:36px; background:var(--wa-in); color:var(--wa-link); border:1px solid var(--wa-hair); font-weight:500; font-size:13px; }
.workspace .tc-side { display:flex; flex-direction:column; gap:12px; min-width:0; }
.workspace .tc-side .card { margin:0; }
.workspace .tc-list { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.workspace .ws-main .tc-list button { font-size:12px; min-height:34px; font-weight:500; }
.workspace .tc-live { border-color:var(--ek-blue-line); }
@media (max-width:760px) {
  .workspace .wa-bubble, .workspace .wa-under { max-width:88%; }
  .workspace .tc-phone { height:72vh; }
  .workspace .wa-quick select { max-width:110px; }
  .workspace .wa-head-actions .is-urgent-btn, .workspace .wa-head-actions [data-action=handback] { padding:0 10px; font-size:13px; }
}
.workspace form#filters.inbox-search { border:0; padding:0; background:transparent; }
.workspace [hidden] { display:none !important; }

/* Quick date-range presets (filterForm) */
.workspace .period-tabs { display:flex; gap:4px; background:var(--ek-bg-2); border-radius:12px; padding:4px; flex-basis:100%; order:-1; margin-bottom:4px; }
.workspace .ws-main .period-tabs button { flex:1; min-height:34px; border:0; background:transparent; color:var(--ek-text-2); font-weight:600; font-size:13px; padding:0 8px; }
.workspace .ws-main .period-tabs button[aria-pressed=true] { background:#fff; color:var(--ek-navy); box-shadow:0 1px 2px rgba(11,23,54,.12); }

/* Monitoring live indicator */
.workspace .live-bar { display:flex; align-items:center; gap:8px; font-size:13px; color:var(--ek-text-2); margin-bottom:10px; }
.workspace .live-dot { width:9px; height:9px; border-radius:50%; background:#34d399; box-shadow:0 0 0 4px rgba(52,211,153,.18); flex:none; }
.workspace .ws-main .live-refresh { margin-inline-start:auto; min-height:32px; padding:0 12px; font-size:13px; }