:root {
  --primary: #1d4ed8;
  --primary-dark: #1741b8;
  --bg: #f4f5f7;
  --card: #ffffff;
  --border: #e3e6eb;
  --text: #1f2430;
  --text-muted: #6b7280;
  --danger-bg: #fdecec;
  --danger-text: #8a1f1f;
}

/* Staff-only notes share the chronological conversation timeline, but remain visually distinct. */
.msg-internal-note{align-self:stretch!important;max-width:min(680px,94%)!important;margin:8px auto!important;border:1px solid #e7b84c!important;border-left:5px solid #d58b00!important;background:#fff8df!important;color:#4c3700!important;box-shadow:0 4px 14px #7a520014!important}
.internal-note-timeline-header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.internal-note-timeline-header strong{font-size:13px;color:#563b00}
.internal-note-timeline-content{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.45}
.msg-internal-note .staff-only-badge{background:#ffe6a3;color:#704700}
.msg-internal-note .msg-time{color:#7c6228!important;margin-top:8px}

* { box-sizing: border-box; }

/* The HTML `hidden` attribute must always win over any class's own
   display value (e.g. a modal or view that sets display:flex to lay
   itself out) — otherwise toggling `el.hidden = true` in JS silently
   stops working the moment a class also sets `display`. Older UA
   stylesheets don't reliably give `[hidden]` enough priority on their
   own, so this is asserted explicitly, once, for every element. */
[hidden] { display: none !important; }

html, body {
  margin: 0;
  height: 100%;
  background: var(--bg);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 14px;
}

button { font-family: inherit; cursor: pointer; }
input, textarea { font-family: inherit; font-size: 13.5px; }

.channel-card { min-height: 190px; display: flex; flex-direction: column; gap: 9px; }
.channel-webhook { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 7px 8px; border-radius: 7px; background: #f1f5f9; color: #334155; font-size: 11px; }
.channel-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: auto; }

/* ---------------- Login screen ---------------- */
.login-screen {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.login-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 32px;
  width: 100%;
  max-width: 380px;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
}

.login-card h1 { font-size: 18px; margin: 0 0 4px; }
.login-sub { color: var(--text-muted); font-size: 12.5px; margin: 0 0 24px; }

.login-card label {
  display: block;
  font-size: 12.5px;
  color: var(--text-muted);
  margin-bottom: 14px;
}

.login-card input {
  display: block;
  width: 100%;
  margin-top: 6px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  font-size: 14px;
}

.login-card input:focus { outline: none; border-color: var(--primary); }

.login-card button[type="submit"] {
  width: 100%;
  background: var(--primary);
  color: #fff;
  border: none;
  border-radius: 10px;
  padding: 11px;
  font-size: 14px;
  font-weight: 600;
  margin-top: 4px;
}
.login-card button[type="submit"]:hover { background: var(--primary-dark); }

.login-error {
  background: var(--danger-bg);
  color: var(--danger-text);
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 12.5px;
  margin-bottom: 14px;
}

.login-note { font-size: 11.5px; color: var(--text-muted); margin: 16px 0 0; text-align: center; }
.login-note code { background: #f1f2f4; padding: 1px 5px; border-radius: 4px; }

/* ---------------- App shell ---------------- */
.app { display: flex; flex-direction: column; min-height: 100vh; }

.topbar {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 12px 20px;
  background: var(--card);
  border-bottom: 1px solid var(--border);
  flex-wrap: wrap;
}

.topbar-brand { font-weight: 700; font-size: 15px; }

.topbar-nav { display: flex; gap: 6px; flex: 1; }

.nav-btn {
  background: transparent;
  border: none;
  padding: 8px 14px;
  border-radius: 8px;
  font-size: 13px;
  color: var(--text-muted);
}
.nav-btn:hover { background: var(--bg); }
.nav-btn.active { background: var(--primary); color: #fff; }

.topbar-right { display: flex; align-items: center; gap: 10px; }
.operator-email { font-size: 12.5px; color: var(--text-muted); }

.btn-ghost {
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 7px 12px;
  font-size: 12.5px;
  color: var(--text);
}
.btn-ghost:hover { background: var(--bg); }
.btn-ghost.small { padding: 4px 10px; font-size: 11.5px; }

.btn-primary {
  background: var(--primary);
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 10px 18px;
  font-size: 13.5px;
  font-weight: 600;
}
.btn-primary:hover { background: var(--primary-dark); }

/* ---------------- Stats row ---------------- */
.stats-row {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
  padding: 16px 20px 0;
}

.stat-tile {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 14px 16px;
}
.stat-value { font-size: 22px; font-weight: 700; }
.stat-label { font-size: 11.5px; color: var(--text-muted); margin-top: 2px; }

/* ---------------- Views ---------------- */
.view { flex: 1; padding: 16px 20px 24px; display: flex; }
.view[hidden] { display: none; }

/* ---------------- Inbox ---------------- */
.inbox-layout {
  display: flex;
  gap: 16px;
  flex: 1;
  min-height: 0;
}

.conv-list-panel, .conv-detail-panel {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.conv-list-panel { width: 340px; flex-shrink: 0; }
.conv-detail-panel { flex: 1; min-width: 0; }

.panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
  font-size: 12.5px;
  font-weight: 600;
  color: var(--text-muted);
}

.conv-list { overflow-y: auto; flex: 1; }

.conv-row {
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
}
.conv-row:hover { background: var(--bg); }
.conv-row.active { background: #eef2ff; }

.conv-row-top { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.conv-row-site { font-weight: 600; font-size: 12.5px; }
.conv-row-time { font-size: 10.5px; color: var(--text-muted); white-space: nowrap; }
.conv-row-preview {
  font-size: 12px;
  color: var(--text-muted);
  margin-top: 3px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.conv-row-badges { margin-top: 5px; display: flex; gap: 5px; }

.badge {
  display: inline-block;
  background: #fff3d6;
  color: #8a5b00;
  font-size: 10px;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 999px;
}

.conv-detail-empty {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-muted);
  font-size: 13px;
  padding: 24px;
  text-align: center;
}

.conv-detail { display: flex; flex-direction: column; flex: 1; min-height: 0; }

.conv-detail-header {
  padding: 12px 16px;
  border-bottom: 1px solid var(--border);
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}
.conv-detail-site { font-weight: 700; font-size: 13.5px; }
.conv-detail-url { font-size: 11px; color: var(--text-muted); margin-top: 2px; word-break: break-all; }
.conv-detail-contact { font-size: 11.5px; color: var(--primary); margin-top: 4px; }
.conv-detail-header-right { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }

.badge-mode { background: #e6ebfa; color: var(--primary-dark); }
.badge-mode.badge-human { background: #fdecec; color: var(--danger-text); }

.conv-detail-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-bottom: 1px solid var(--border);
  flex-wrap: wrap;
}

.conv-reply-form {
  display: flex;
  gap: 8px;
  align-items: flex-end;
  padding: 10px 16px;
  border-top: 1px solid var(--border);
  background: var(--card);
  flex-shrink: 0;
}
.conv-reply-form textarea {
  flex: 1;
  resize: vertical;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 9px 12px;
  font-size: 13px;
  line-height: 1.4;
  min-height: 40px;
}
.conv-reply-form textarea:focus { outline: none; border-color: var(--primary); }
.agent-assist-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.agent-assist-toolbar span{margin-left:auto;color:var(--text-muted);font-size:12px}.agent-assist-toolbar kbd{padding:2px 6px;border:1px solid var(--border);border-radius:5px;background:#f6f8fb}.agent-assist-panel{border:1px solid var(--border);border-radius:11px;background:#fff;padding:10px;box-shadow:0 10px 30px #18345c1f}.agent-assist-panel[hidden]{display:none}.agent-assist-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.agent-assist-panel>input{width:100%;margin:8px 0;padding:10px 11px;border:1px solid var(--border);border-radius:8px;font:inherit}.agent-assist-results{display:grid;gap:7px;max-height:310px;overflow:auto}.agent-assist-results article{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px 12px;padding:10px;border:1px solid var(--border);border-radius:9px}.agent-assist-results article>div{display:grid}.agent-assist-results small{color:var(--primary);font-weight:700}.agent-assist-results p{grid-column:1/-1;margin:0;color:var(--text-muted);white-space:pre-wrap;line-height:1.45}.agent-assist-results article>button{grid-column:2;grid-row:1;align-self:start}.agent-assist-results>.settings-hint{padding:16px;text-align:center}

.msg-operator { align-self: flex-end; background: #147a3a; color: #fff; border-bottom-right-radius: 4px; }
.msg-author-label { font-size: 10px; color: var(--text-muted); margin-bottom: 2px; }

/* ---------------- Tickets / Contacts ---------------- */
.ticket-filters { display: flex; gap: 4px; padding: 8px 10px; border-bottom: 1px solid var(--border); flex-wrap: wrap; }
.ticket-filter {
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 11px;
  color: var(--text-muted);
}
.ticket-filter.active { background: var(--primary); color: #fff; border-color: var(--primary); }
.ticket-filter::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;display:inline-block;margin-right:6px;vertical-align:1px}.ticket-filter[data-status=""]{background:#f8fafc;color:#344054;border-color:#cbd5e1}.ticket-filter[data-status="new"],.ticket-filter[data-status="open"]{background:#e8f1ff;color:#175cd3;border-color:#9ec5ff}.ticket-filter[data-status="assigned_me"]{background:#e6f7f5;color:#087e72;border-color:#86d8cf}.ticket-filter[data-status="unassigned"]{background:#fff1f0;color:#b42318;border-color:#f5b7b1}.ticket-filter[data-status="in_progress"]{background:#fff4ce;color:#8a5700;border-color:#f4cf66}.ticket-filter[data-status="pending"],.ticket-filter[data-status="waiting_customer"]{background:#fff0df;color:#a34100;border-color:#ffbd75}.ticket-filter[data-status="under_review"]{background:#f1eafe;color:#6941c6;border-color:#c8b5f5}.ticket-filter[data-status="resolved"]{background:#e8f8ef;color:#067647;border-color:#8ed4ad}.ticket-filter[data-status="closed"]{background:#eef1f4;color:#475467;border-color:#c9d0d8}.ticket-filter.active{color:#fff!important;background:#172033!important;border-color:#172033!important;box-shadow:0 0 0 2px #fff,0 0 0 4px #172033}.ticket-filter:focus-visible{outline:3px solid #84adff;outline-offset:2px}
.ticket-status-badge{border:1px solid currentColor;font-weight:750}.status-new,.status-open{background:#e8f1ff!important;color:#175cd3!important}.status-in_progress{background:#fff4ce!important;color:#8a5700!important}.status-pending,.status-waiting_customer{background:#fff0df!important;color:#a34100!important}.status-under_review{background:#f1eafe!important;color:#6941c6!important}.status-resolved{background:#e8f8ef!important;color:#067647!important}.status-closed{background:#eef1f4!important;color:#475467!important}.priority-urgent{background:#feecec!important;color:#b42318!important;border:1px solid #b42318!important}

.contact-search {
  width: 100%;
  padding: 7px 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 12.5px;
}

.ticket-detail { flex: 1; overflow-y: auto; padding: 20px; display: flex; flex-direction: column; }
.ticket-detail-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.ticket-detail select {
  display: block;
  width: 100%;
  margin-top: 6px;
  padding: 9px 10px;
  border: 1px solid var(--border);
  border-radius: 10px;
  font-weight: 400;
  color: var(--text);
  background: #fff;
}
.ticket-meta { font-size: 11.5px; color: var(--text-muted); margin-bottom: 14px; }

.contact-related { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 10px; }
.contact-related h3 { font-size: 12px; color: var(--text-muted); margin: 0 0 8px; }
.contact-related-list { display: flex; flex-direction: column; gap: 6px; }
.contact-related-item {
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 12px;
}
.contact-related-empty { font-size: 12px; color: var(--text-muted); }

/* ---------------- Modal ---------------- */
.modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(20, 22, 30, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  padding: 20px;
}
.modal-card {
  background: var(--card);
  border-radius: 14px;
  padding: 24px;
  width: 100%;
  max-width: 420px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25);
}
.modal-card h2 { margin: 0 0 16px; font-size: 15px; }
.temporary-password-card{max-width:520px}.temporary-password-value{display:block;margin:16px 0;padding:14px;border:1px solid var(--border);border-radius:9px;background:#f8fafc;font:700 18px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.04em;overflow-wrap:anywhere;user-select:all}
.modal-card label {
  display: block;
  font-size: 12.5px;
  color: var(--text-muted);
  margin-bottom: 14px;
  font-weight: 600;
}
.modal-card input, .modal-card textarea, .modal-card select {
  display: block;
  width: 100%;
  margin-top: 6px;
  padding: 9px 10px;
  border: 1px solid var(--border);
  border-radius: 10px;
  font-weight: 400;
  color: var(--text);
}

.conv-messages {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: var(--bg);
}

.msg-bubble {
  max-width: 70%;
  padding: 9px 12px;
  border-radius: 14px;
  font-size: 13px;
  line-height: 1.45;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.msg-user { align-self: flex-end; background: var(--primary); color: #fff; border-bottom-right-radius: 4px; }
.msg-assistant { align-self: flex-start; background: #fff; border: 1px solid var(--border); border-bottom-left-radius: 4px; }
.msg-time { font-size: 10px; color: var(--text-muted); margin-top: 2px; }
.translate-status{align-self:center;padding:5px 9px;border-radius:999px;background:#e7f0ff;color:#2257b9;font-size:12px;font-weight:700}.translation-meta{font-size:11px;margin-top:7px;opacity:.8}.translation-toggle{margin-top:6px;border:0;background:transparent;color:inherit;text-decoration:underline;cursor:pointer;font:inherit;font-size:12px;padding:0}.msg-original{display:none;margin-top:7px;padding-top:7px;border-top:1px dashed currentColor;opacity:.82}.msg-original.visible{display:block}.translate-preview{margin-top:8px;padding:9px 11px;border:1px solid #cfe0ff;border-radius:8px;background:#f4f8ff;color:#31528a;font-size:13px;line-height:1.4}
.live-translate-panel,.translation-review{padding:14px;border:1px solid #bed4fb;border-radius:12px;background:#f7faff;box-shadow:0 8px 24px #1c4f9a12}.live-translate-panel[hidden],.translation-review[hidden]{display:none}.live-translate-grid,.translation-review-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}.live-translate-grid label,.translation-review-grid label{display:grid;gap:6px;color:var(--text-muted);font-size:12px;font-weight:750}.live-translate-grid select,.translation-review-grid textarea{width:100%;padding:10px;border:1px solid var(--border);border-radius:8px;background:#fff;font:inherit;color:var(--text)}.translation-review>strong{display:block;color:#183d77}.translation-review .settings-actions{margin-top:10px}.internal-note-card{display:block!important;border-left:4px solid #7357d8!important;background:#fbfaff}.internal-note-card>div{display:flex!important;align-items:center;justify-content:space-between;gap:10px}.internal-note-card>small{display:block;margin-top:4px;color:var(--text-muted)!important}.internal-note-card>p{margin-top:9px!important;color:var(--text)!important}.staff-only-badge{padding:4px 7px;border-radius:999px;background:#efeaff;color:#5e3fc2;font-size:10px;font-weight:850;letter-spacing:.07em}.internal-note-form{display:grid;gap:9px;padding:12px;border:1px solid var(--border);border-radius:10px;background:#f9fafc}.internal-note-form textarea{width:100%;resize:vertical;padding:10px;border:1px solid var(--border);border-radius:8px;font:inherit}.internal-note-form button{justify-self:start}.internal-note-form .settings-hint{margin:0;white-space:pre-line}#setting-live-translate-status{white-space:pre-line}
.translate-controls{display:flex;align-items:end;gap:8px;padding:8px 10px;border:1px solid #cfe0ff;border-radius:9px;background:#f7faff}.translate-controls label{display:grid;gap:3px;font-size:11px;color:var(--text-muted);font-weight:700}.translate-controls select{max-width:140px;padding:5px;border:1px solid var(--border);border-radius:6px;background:#fff;font:inherit;font-size:12px}.translate-controls .btn-primary{padding:7px 10px}@media(max-width:720px){.translate-controls{width:100%;flex-wrap:wrap}.translate-controls select{max-width:130px}}
.conv-send-actions{display:flex;justify-content:space-between;align-items:center;gap:10px}.conv-attach-button{display:inline-flex;align-items:center;cursor:pointer}.conv-attachment-preview{display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:12px;align-items:center;margin-top:9px;padding:9px;border:1px solid var(--border);border-radius:10px;background:#f8fafc}.conv-attachment-preview img,.conv-attachment-preview video{width:72px;height:58px;object-fit:cover;border-radius:7px;background:#101828}.conv-attachment-preview strong,.conv-attachment-preview small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.conv-attachment-preview small{color:var(--text-muted);margin-top:3px}.message-attachment{display:grid;gap:7px;margin-top:8px}.message-attachment img,.message-attachment video{display:block;width:min(360px,100%);max-height:260px;object-fit:contain;border-radius:9px;background:#0f172a}.message-attachment img{cursor:zoom-in}.attachment-name{width:max-content;max-width:100%;border:0;background:transparent;padding:0;color:inherit;text-decoration:underline;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.attachment-lightbox{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:20px;background:rgba(3,10,24,.82)}.attachment-lightbox-dialog{position:relative;display:grid;gap:12px;width:min(900px,100%);max-height:calc(100vh - 40px);padding:18px;border-radius:14px;background:#fff;overflow:auto}.attachment-lightbox-dialog>img,.attachment-lightbox-dialog>video{display:block;max-width:100%;max-height:70vh;margin:auto}.attachment-lightbox-close{position:absolute;right:10px;top:10px;width:38px;height:38px;border:0;border-radius:50%;background:#fff;box-shadow:0 2px 10px #0003;font-size:24px;cursor:pointer}.attachment-lightbox-actions{display:flex;gap:9px;flex-wrap:wrap}

/* ---------------- Settings ---------------- */
.settings-panel {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 24px;
  max-width: 720px;
  width: 100%;
}
.settings-panel h2 { margin: 0 0 6px; font-size: 16px; }
.settings-hint { color: var(--text-muted); font-size: 12.5px; margin: 0 0 20px; line-height: 1.5; }
.settings-hint code { background: #f1f2f4; padding: 1px 5px; border-radius: 4px; }

.settings-field {
  display: block;
  font-size: 12.5px;
  color: var(--text-muted);
  margin-bottom: 18px;
  font-weight: 600;
}
.settings-field input, .settings-field textarea {
  display: block;
  width: 100%;
  margin-top: 6px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  font-weight: 400;
  color: var(--text);
}
.settings-field textarea { resize: vertical; font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 12px; line-height: 1.5; }
.settings-field input:focus, .settings-field textarea:focus { outline: none; border-color: var(--primary); }
.settings-field input:disabled { background: #f4f5f7; color: var(--text-muted); }
.department-access-field{flex:2;min-width:300px;margin:0;padding:0;border:0}.department-access-field legend{margin-bottom:6px;color:var(--text-muted);font-size:14px;font-weight:600}.department-access-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:9px;min-height:44px;padding:10px;border:1px solid var(--border);border-radius:10px;background:#fff}.department-access-option{display:flex;align-items:center;gap:9px;min-height:40px;padding:9px 11px;border:1px solid #dfe5ee;border-radius:8px;background:#f8faff;color:var(--text);font-size:14px;font-weight:650;cursor:pointer}.department-access-option:hover{border-color:#8fb7f7;background:#f0f6ff}.department-access-option:has(input:checked){border-color:var(--primary);background:#eaf3ff;color:#174f9e}.department-access-option input{width:18px;height:18px;margin:0;accent-color:var(--primary);flex:0 0 auto}.department-access-option:focus-within{outline:3px solid #5488ef;outline-offset:2px}.department-access-empty{grid-column:1/-1;margin:0;color:var(--text-muted);font-size:14px}
.settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.settings-toggle { display: flex; align-items: center; gap: 10px; margin: 12px 0; font-size: 14px; color: var(--text); }
.settings-toggle input { width: 18px; height: 18px; accent-color: var(--primary); }

.settings-actions { display: flex; align-items: center; gap: 12px; }
.settings-saved { color: #147a3a; font-size: 12.5px; font-weight: 600; }

/* ---------------- Saved replies ---------------- */
.saved-replies-page{width:min(1100px,100%);margin:0 auto}.saved-replies-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:20px}.saved-replies-heading span{font-size:11px;font-weight:800;letter-spacing:.12em;color:var(--primary)}.saved-replies-heading h1{margin:5px 0 7px;font-size:30px}.saved-replies-heading p{margin:0;color:var(--text-muted)}.saved-replies-toolbar{display:grid;grid-template-columns:minmax(260px,1fr) 220px auto;gap:12px;align-items:end;padding:16px;background:var(--card);border:1px solid var(--border);border-radius:12px;margin-bottom:16px}.saved-replies-toolbar label{display:grid;gap:6px;font-size:12px;font-weight:700;color:var(--text-muted)}.saved-replies-toolbar input,.saved-replies-toolbar select{width:100%;min-height:42px;padding:9px 11px;border:1px solid var(--border);border-radius:8px;background:#fff;font:inherit}.saved-reply-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.saved-reply-card{display:flex;flex-direction:column;gap:14px;padding:18px;border:1px solid var(--border);border-radius:12px;background:var(--card)}.saved-reply-card-head{display:flex;justify-content:space-between;gap:14px}.saved-reply-card h2{font-size:16px;margin:0 0 5px}.saved-reply-card-head p{margin:0;color:var(--text-muted);font-size:12px}.saved-reply-card code{color:var(--primary);font-weight:800}.saved-reply-content{white-space:pre-wrap;line-height:1.5;margin:0;flex:1;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}.saved-reply-status{height:max-content;padding:4px 8px;border-radius:999px;background:#f0f1f3;color:var(--text-muted);font-size:11px;font-weight:800}.saved-reply-status.is-enabled{background:#e5f7ed;color:#147a3a}.saved-reply-actions{display:flex;gap:8px}.saved-reply-state{text-align:center;padding:44px 20px;color:var(--text-muted);border:1px dashed var(--border);border-radius:12px}.saved-reply-state h2{color:var(--text);margin:0 0 6px}.saved-reply-editor{position:fixed;inset:0;z-index:80;background:rgba(15,23,42,.42);display:grid;place-items:center;padding:20px}.saved-reply-editor[hidden]{display:none}.saved-reply-editor .settings-panel{max-height:calc(100vh - 40px);overflow:auto}.saved-reply-editor-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.saved-reply-editor-head h2{margin:0}.saved-reply-feedback{position:fixed;right:20px;bottom:20px;z-index:100;padding:12px 16px;border-radius:9px;background:#147a3a;color:#fff;box-shadow:0 8px 24px rgba(0,0,0,.2)}.saved-reply-feedback.is-error{background:#b42318}.saved-reply-import{margin:20px auto 0;max-width:1100px}.saved-reply-import input[type=file]{margin-bottom:15px}.saved-reply-import-summary{margin:10px 0;font-weight:700}.saved-reply-import-preview{max-height:320px;margin-bottom:16px}.saved-reply-import-preview .is-invalid{background:#fff1f0;color:#9b1c1c}.conv-reply-form{position:relative}.saved-reply-picker{position:absolute;left:0;right:0;bottom:100%;z-index:40;max-height:330px;overflow:auto;border:1px solid var(--border);border-radius:11px;background:#fff;box-shadow:0 12px 30px rgba(15,23,42,.18);padding:6px}.saved-reply-option{width:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:12px;text-align:left;border:0;border-radius:7px;background:transparent;padding:10px;cursor:pointer;color:var(--text)}.saved-reply-option:hover,.saved-reply-option.active{background:#eef4ff}.saved-reply-option span{display:grid;gap:3px}.saved-reply-option small{color:var(--primary);font-weight:700}.saved-reply-option em{font-style:normal;color:var(--text-muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------------- Analytics ---------------- */
.analytics-shell{width:min(1280px,100%);margin:0 auto 24px}.analytics-header{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:18px}.analytics-eyebrow,.analytics-card-head span{color:#2468d7;font-size:12px;font-weight:800;letter-spacing:.1em}.analytics-header h1{margin:5px 0 7px;font-size:32px;letter-spacing:-.035em}.analytics-header p{margin:0;color:var(--text-muted);font-size:15px}.analytics-controls{display:flex;align-items:flex-end;justify-content:flex-end;gap:9px;flex-wrap:wrap}.analytics-controls label{display:grid;gap:5px;color:var(--text-muted);font-size:12px;font-weight:700}.analytics-controls select,.analytics-controls input{min-height:40px;border:1px solid var(--border);border-radius:9px;background:#fff;padding:8px 10px;color:var(--text);font:inherit}.analytics-controls button{min-height:40px}.analytics-status{min-height:20px;margin:0 0 12px;color:var(--text-muted);font-size:13px}.analytics-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin-bottom:18px}.analytics-kpi{min-height:125px;padding:18px;border:1px solid #e0e6ef;border-radius:14px;background:#fff;box-shadow:0 5px 18px rgba(31,55,86,.045)}.analytics-kpi>div{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#66768b;font-size:13px;font-weight:700}.analytics-kpi i{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;background:#edf4ff;color:#2468d7;font-style:normal}.analytics-kpi strong{display:block;margin-top:13px;color:#20344f;font-size:29px;line-height:1}.analytics-kpi small{display:block;margin-top:10px;color:#748398;font-size:11px}.analytics-kpi small.is-up{color:#14824a}.analytics-kpi small.is-down{color:#b5473b}#analytics-loading i{height:125px;border-radius:14px;background:linear-gradient(100deg,#edf0f5 20%,#f8fafc 40%,#edf0f5 60%);background-size:220% 100%;animation:analytics-shimmer 1.4s infinite}@keyframes analytics-shimmer{to{background-position-x:-220%}}.analytics-state{padding:55px 24px;border:1px dashed #cfd8e6;border-radius:15px;background:#fff;text-align:center}.analytics-state h2{margin:0 0 7px}.analytics-state p{color:var(--text-muted)}.analytics-chart-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:16px}.analytics-card{min-width:0;padding:20px;border:1px solid #e0e6ef;border-radius:15px;background:#fff;box-shadow:0 5px 18px rgba(31,55,86,.04);margin-bottom:16px}.analytics-card.analytics-wide{min-height:330px}.analytics-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px}.analytics-card-head h2{margin:5px 0 0;font-size:18px}.analytics-legend{display:flex;align-items:center;gap:6px;flex-wrap:wrap;color:var(--text-muted);font-size:11px}.analytics-legend i{width:8px;height:8px;border-radius:50%}.analytics-legend .customer{background:#2868e8}.analytics-legend .ai{background:#7c4dff}.analytics-legend .agent{background:#16a36a}.analytics-line-chart{min-height:230px;display:grid;align-items:center}.analytics-line-chart svg{display:block;width:100%;height:220px;overflow:visible}.analytics-axis{display:flex;justify-content:space-between;gap:8px;color:#7a899d;font-size:11px}.analytics-bars{display:grid;gap:14px}.analytics-bar-row>div{display:flex;justify-content:space-between;gap:14px;margin-bottom:6px;text-transform:capitalize;font-size:13px}.analytics-bar-row i{display:block;height:8px;overflow:hidden;border-radius:999px;background:#edf1f6}.analytics-bar-row b{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#2b70ea,#76a7fb)}.analytics-detail-grid{display:grid;grid-template-columns:1fr auto;gap:0}.analytics-detail-grid div,.analytics-detail-grid strong{padding:11px 0;border-bottom:1px solid #edf0f4;font-size:13px}.analytics-detail-grid strong{text-align:right;font-size:15px}.analytics-card .team-table{min-width:720px}

/* ---------------- Live analytics ---------------- */
.analytics-panel{max-width:1200px}.live-filter{display:grid;gap:5px;font-size:12px;font-weight:700;color:var(--text-muted)}.live-filter select{min-width:150px;padding:9px 11px;border:1px solid var(--border);border-radius:8px;background:#fff}.live-metric-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin-top:18px}.live-metric{border:1px solid var(--border);border-radius:12px;background:#fff;padding:16px;min-width:0}.live-metric span{display:block;color:var(--text-muted);font-size:11px;font-weight:700;text-transform:uppercase}.live-metric strong{display:block;margin-top:7px;color:var(--text);font-size:24px}.live-metric.is-live{cursor:pointer;border-color:#b9e9cc}.live-heading{display:flex;align-items:center;gap:8px;color:#168447;font-size:12px;font-weight:800;letter-spacing:.08em}.live-heading i{width:9px;height:9px;border-radius:50%;background:#20b15a;box-shadow:0 0 0 5px #20b15a22;animation:live-pulse 1.7s infinite}.live-total{font-size:44px;color:var(--text)}@keyframes live-pulse{50%{box-shadow:0 0 0 9px #20b15a00}}.live-layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);gap:22px}.analytics-tabs{display:flex;gap:4px;margin-bottom:12px}.analytics-tabs button{border:1px solid var(--border);background:#fff;padding:7px 12px;border-radius:8px;color:var(--text-muted)}.analytics-tabs button.active{background:#eaf2ff;color:#175fc0;border-color:#b8d3fa}.live-map{min-height:240px;border:1px solid var(--border);border-radius:12px;padding:18px;background:radial-gradient(circle at 20% 45%,#d9eafe 0 5%,transparent 6%),radial-gradient(circle at 48% 37%,#d9eafe 0 8%,transparent 9%),radial-gradient(circle at 75% 42%,#d9eafe 0 11%,transparent 12%),radial-gradient(circle at 81% 75%,#d9eafe 0 5%,transparent 6%),linear-gradient(150deg,#f8fbff,#edf5ff);display:flex;align-items:flex-end;gap:7px;overflow:auto}.map-country{display:flex;flex-direction:column;justify-content:end;align-items:center;min-width:58px;height:190px}.map-country i{display:block;width:34px;min-height:8px;border-radius:8px 8px 3px 3px;background:#2d7ef2}.map-country span{font-size:11px;margin-top:6px;text-align:center}.live-visitors-list{max-height:430px;overflow:auto;display:grid;gap:9px}.live-visitor{border:1px solid var(--border);border-radius:11px;padding:12px;background:#fff}.live-visitor strong{display:flex;align-items:center;gap:7px}.live-visitor strong:before{content:'';width:8px;height:8px;border-radius:50%;background:#20b15a}.live-visitor p{margin:7px 0 0;color:var(--text-muted);font-size:12px;line-height:1.55}.analytics-columns{width:min(1200px,100%);margin:0 auto 24px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.analytics-columns .settings-panel{max-width:none}.live-ranking,.live-activity{display:grid;gap:7px}.live-rank-row,.live-event{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid #edf0f4;font-size:13px}.live-event{display:block}.live-event time{display:block;color:var(--text-muted);font-size:11px;margin-top:4px}

/* ---------------- Responsive ---------------- */
.signin-link{display:block;text-align:center;text-decoration:none;padding:13px;border-radius:8px}
.team-panel{max-width:1000px}.team-console{width:min(1240px,100%);margin:0 auto}.team-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:22px}.team-heading span{color:var(--primary);font-size:12px;font-weight:800;letter-spacing:.12em}.team-heading h1{margin:5px 0 8px;font-size:30px;letter-spacing:-.03em}.team-heading p{max-width:760px;margin:0;color:var(--text-muted);line-height:1.6}.team-toolbar{display:grid;grid-template-columns:minmax(260px,1fr) 190px 190px;gap:12px;padding:16px;border:1px solid var(--border);border-radius:13px;background:#fff}.team-toolbar label{display:grid;gap:6px;color:var(--text-muted);font-size:12px;font-weight:700}.team-toolbar input,.team-toolbar select{min-height:42px;padding:9px 11px;border:1px solid var(--border);border-radius:8px;background:#fff;font:inherit}.team-add-form{display:flex;gap:16px;align-items:flex-end;flex-wrap:wrap}.team-add-form .settings-field{flex:1;min-width:180px;margin:0}.team-add-form button{min-height:44px}.settings-field select,.team-table select{font:inherit;padding:10px;border:1px solid var(--border);border-radius:7px;background:white}.settings-field select{display:block;width:100%;margin-top:6px}.team-table{width:100%;border-collapse:collapse;text-align:left;font-size:14px}.team-table td,.team-table th{padding:13px 12px;border-bottom:1px solid var(--border);vertical-align:middle}.team-management-table{min-width:1020px;margin-top:10px;background:#fff;border:1px solid var(--border)}.team-member-name{font-weight:750}.team-role-badge,.team-status-badge,.team-access-badge{display:inline-flex;align-items:center;padding:5px 9px;border-radius:999px;font-size:12px;font-weight:750;text-transform:capitalize}.team-role-badge{color:#2059aa;background:#edf4ff}.team-status-badge.active{color:#147a3a;background:#e7f7ed}.team-status-badge.disabled{color:#8b3340;background:#fff0f1}.team-access-badge.granted{color:#147a3a;background:#e7f7ed}.team-access-badge.required{color:#9a5b12;background:#fff3dd}.team-actions{position:relative}.team-actions>button{white-space:nowrap}.team-actions-menu{position:absolute;right:0;top:calc(100% + 5px);z-index:35;display:grid;min-width:205px;padding:6px;border:1px solid var(--border);border-radius:10px;background:#fff;box-shadow:0 14px 34px #18345c26}.team-actions-menu[hidden]{display:none}.team-actions-menu button{border:0;border-radius:7px;background:transparent;padding:9px 10px;text-align:left;color:var(--text);cursor:pointer}.team-actions-menu button:hover{background:#eef4ff}.team-actions-menu button.danger{color:#b42318}.team-state{margin-top:14px;padding:34px;border:1px dashed var(--border);border-radius:12px;text-align:center;color:var(--text-muted);background:#fff}.team-state h2{margin:0 0 6px;color:var(--text)}.team-feedback{min-height:21px;font-size:14px}.table-scroll{overflow-x:auto}.team-table td:first-child{overflow-wrap:anywhere}.team-member-card,.password-reset-card{max-width:590px}.team-member-card label,.password-reset-card label{display:block;margin:13px 0;color:var(--text-muted);font-size:13px;font-weight:700}.team-member-card input,.team-member-card select,.password-reset-card input{display:block;width:100%;margin-top:6px;padding:10px 11px;border:1px solid var(--border);border-radius:8px;font:inherit}.team-check,.team-radio{display:flex!important;align-items:flex-start;gap:9px}.team-check input,.team-radio input{width:18px!important;height:18px;margin:0!important;flex:0 0 auto}.password-reset-card fieldset{border:1px solid var(--border);border-radius:10px;padding:12px}.password-reset-card legend{padding:0 5px;font-weight:750}.reset-warning{margin:16px 0;padding:13px;border-radius:9px;background:#fff7e8;border:1px solid #f6dba8}.reset-warning p{margin:6px 0 0;color:#745322;font-size:13px}.settings-divider{margin:28px 0}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #5488ef;outline-offset:3px}.msg-bubble{font-size:16px}.settings-hint,.settings-field,.login-note,.btn-ghost.small,.nav-btn{font-size:14px}.msg-time{font-size:12px}.topbar{flex-wrap:wrap}.topbar-right{flex-wrap:wrap}.conv-reply-form textarea{font-size:16px}.settings-field textarea{font-size:14px}.team-table select{max-width:150px}
.availability-control{display:grid;gap:3px;color:var(--text-muted);font-size:11px;font-weight:700}.availability-control select{padding:6px 9px;border:1px solid var(--border);border-radius:8px;background:#fff;font:inherit}.performance-admin{margin-top:30px;padding:20px;border:1px solid var(--border);border-radius:14px;background:#fff}.performance-admin .team-heading h2{margin:5px 0 7px}.performance-config-grid{display:grid;grid-template-columns:repeat(4,minmax(140px,1fr));gap:12px}.performance-config-grid label{display:grid;gap:5px;color:var(--text-muted);font-size:12px;font-weight:700}.performance-config-grid input{min-width:0;padding:9px;border:1px solid var(--border);border-radius:8px;font:inherit}.performance-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.performance-card{padding:16px;border:1px solid var(--border);border-radius:12px}.performance-card h3{margin:0 0 6px}.performance-score{font-size:28px;font-weight:800;color:#245fc5}.performance-meta{display:flex;gap:7px;flex-wrap:wrap;color:var(--text-muted);font-size:12px}.availability-warning-card{max-width:500px}
.performance-card button{margin-top:12px}.availability-pill{display:inline-flex;align-items:center;gap:5px;padding:3px 8px;border-radius:999px;background:#eef2f7;text-transform:capitalize}.availability-pill.online{background:#e9f9ee;color:#14783a}.availability-pill.busy{background:#fff3d7;color:#8a5600}.availability-pill.break{background:#f4eefe;color:#6633a2}.performance-dialog-card{width:min(760px,calc(100vw - 24px));max-height:90vh;overflow:auto}.modal-title-row{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.performance-dialog-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:16px 0}.performance-dialog-summary article{padding:12px;border:1px solid var(--border);border-radius:10px}.performance-dialog-summary strong{display:block;font-size:22px}.performance-schedule-times{display:grid;grid-template-columns:1fr 1fr;gap:12px}.performance-schedule-times label{display:grid;gap:5px}.schedule-day-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:7px}.schedule-day-grid label{display:flex;gap:4px;align-items:center;font-size:12px}.performance-incidents{display:grid;gap:9px}.performance-incident{padding:12px;border:1px solid var(--border);border-radius:10px}.performance-incident header{display:flex;justify-content:space-between;gap:12px}.performance-incident.excluded{opacity:.65;background:#f6f7f9}.response-warning{margin-top:8px;padding:8px;border-radius:8px;background:#fff3d7;color:#744a00;font-size:12px;font-weight:700}
.attendance-audit{margin-top:22px;padding-top:18px;border-top:1px solid var(--border)}.attendance-audit-actions{display:flex;gap:8px;flex-wrap:wrap}.attendance-audit-results,.performance-attendance{display:grid;gap:8px;margin:12px 0}.attendance-audit-row,.attendance-day{display:grid;gap:4px;padding:11px 12px;border:1px solid var(--border);border-radius:10px;background:#fff}.attendance-audit-row span,.attendance-day span{color:var(--text-muted);font-size:12px}.attendance-audit-row p{margin:0;color:var(--text-muted);font-size:12px}.attendance-audit-row.on_time,.attendance-day.on_time{border-color:#9ad9ad;background:#f1fbf4}.attendance-audit-row.needs_review,.attendance-day.needs_review{border-color:#efcf86;background:#fff9e9}.attendance-audit-row.off_day,.attendance-day.off_day{background:#f6f7f9}.attendance-day.late{border-color:#efaaa3;background:#fff4f2}
.my-performance-page{width:min(1180px,100%);margin:0 auto;padding:26px}.my-performance-summary{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.my-performance-summary article,.my-performance-card{border:1px solid var(--border);border-radius:14px;background:#fff;padding:18px}.my-performance-summary strong{display:block;font-size:26px;color:var(--text);overflow-wrap:anywhere}.my-performance-summary span{display:block;margin-top:6px;color:var(--text-muted);font-size:12px;font-weight:750;text-transform:uppercase}.my-performance-summary small{display:block;margin-top:6px;color:var(--text-muted)}.my-performance-warning{margin-top:16px;padding:16px;border:1px solid #f4c56b;border-radius:12px;background:#fff8e8;color:#744a00}.my-performance-warning p{margin:6px 0 12px}.my-performance-layout{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr);gap:16px;margin-top:16px}.my-performance-card-head span{color:var(--primary);font-size:11px;font-weight:800;letter-spacing:.1em}.my-performance-card-head h2{margin:5px 0 8px}.my-performance-schedule{display:grid}.my-performance-schedule>div{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid var(--border)}.my-performance-schedule>div:last-child{border-bottom:0}.my-performance-schedule .is-off{color:var(--text-muted)}
@media (max-width: 800px) {
  .stats-row { grid-template-columns: repeat(3, 1fr); }
  .inbox-layout { flex-direction: column; }
  .conv-list-panel { width: 100%; max-height: 260px; }
  .ticket-detail-row { grid-template-columns: 1fr; }
  .contact-related { grid-template-columns: 1fr; }
  .settings-grid { grid-template-columns: 1fr; }
  .saved-reply-list{grid-template-columns:1fr}.saved-replies-toolbar{grid-template-columns:1fr}.saved-replies-heading{align-items:stretch;flex-direction:column}.saved-reply-option{grid-template-columns:1fr}.saved-reply-option em{display:none}
  .analytics-header{flex-direction:column}.analytics-controls{justify-content:flex-start;width:100%}.analytics-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.analytics-chart-grid{grid-template-columns:1fr}.live-metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.live-layout,.analytics-columns{grid-template-columns:1fr}.live-visitors-list{max-height:360px}
  .team-heading{flex-direction:column}.team-toolbar{grid-template-columns:1fr}.team-heading .btn-primary{width:100%}.performance-config-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.performance-cards{grid-template-columns:1fr}
  .live-translate-grid,.translation-review-grid{grid-template-columns:1fr}
}

@media (max-width: 480px) {
  .stats-row { grid-template-columns: 1fr 1fr; padding: 12px 12px 0; }
  .view { padding: 12px; }
  .topbar { padding: 10px 12px; }
  .conv-attachment-preview{grid-template-columns:56px minmax(0,1fr)}.conv-attachment-preview img,.conv-attachment-preview video{width:56px;height:50px}.conv-attachment-preview .btn-ghost{grid-column:1/-1}.attachment-lightbox{padding:8px}.attachment-lightbox-dialog{max-height:calc(100vh - 16px)}
  .analytics-kpi-grid{grid-template-columns:1fr}.analytics-controls{display:grid;grid-template-columns:1fr 1fr}.analytics-controls label:first-child{grid-column:1/-1}.analytics-controls select,.analytics-controls input,.analytics-controls button{width:100%}.analytics-header h1{font-size:27px}.analytics-card{padding:15px}.analytics-card-head{flex-direction:column}.live-metric-grid{grid-template-columns:1fr 1fr}.live-total{font-size:34px}.live-map{min-height:190px}.analytics-panel{padding:16px}
  .performance-config-grid{grid-template-columns:1fr}.my-performance-page{padding:16px}.my-performance-summary{grid-template-columns:1fr 1fr}.my-performance-layout{grid-template-columns:1fr}
}

.profile-field{display:grid;grid-template-columns:1fr auto;gap:5px;padding:10px 0;border-bottom:1px solid #e3e6eb;overflow-wrap:anywhere}.profile-field>span,.profile-field>small{grid-column:1/-1;color:#667085}.profile-field>small{color:#9a5b12}.media-import-state{padding:14px;background:#fff8df;border:1px solid #e7b84c;border-radius:10px;display:flex;gap:10px;flex-wrap:wrap}.profile-mobile-toggle{display:none}@media(max-width:900px){.profile-mobile-toggle{display:inline-block}.customer-panel.profile-mobile-open{display:block!important;position:fixed;inset:70px 10px 10px;z-index:80;overflow:auto;background:white;padding:18px;border:1px solid #ddd;border-radius:12px}}
/* ---- Analytics v2 ---- */
#nav-ai-reports{display:none!important}
.av2{display:flex;flex-direction:column;gap:16px;padding:20px 24px 32px;max-width:1440px;margin:0 auto;color:#0f172a}
.av2-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
.av2-head h1{margin:2px 0 4px;font-size:26px}.av2-sub{margin:0;color:#64748b;font-size:14px}
.av2-actions{display:flex;gap:8px}
.av2-filters{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:12px 14px}
.av2-filters label{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:600;color:#475569;min-width:150px}
.av2-filters select,.av2-filters input{padding:7px 9px;border:1px solid #cbd5e1;border-radius:8px;font:inherit;font-weight:400;background:#fff;color:#0f172a}
.av2-tabs{display:flex;gap:4px;border-bottom:1px solid #e2e8f0;overflow-x:auto}
.av2-tab{background:none;border:0;border-bottom:2px solid transparent;padding:10px 14px;font:inherit;font-weight:600;color:#64748b;cursor:pointer;white-space:nowrap}
.av2-tab:hover{color:#0f172a}.av2-tab.active{color:#1d4ed8;border-bottom-color:#1d4ed8}
.av2-status{font-size:13px;color:#64748b;min-height:18px}.av2-status.av2-error{color:#b91c1c}
.av2-busy .av2-body{opacity:.55;transition:opacity .2s}
.av2-panel{display:flex;flex-direction:column;gap:16px}
.av2-kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.av2-kpi{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:4px;box-shadow:0 1px 2px rgba(15,23,42,.04)}
.av2-kpi-label{font-size:12px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.03em}
.av2-kpi-value{font-size:26px;font-weight:700;line-height:1.2}
.av2-kpi-sub{font-size:12px;color:#64748b}
.av2-delta{font-size:12px;font-weight:600;color:#64748b}.av2-delta.up{color:#15803d}.av2-delta.down{color:#b91c1c}
.av2-stars{color:#f59e0b;font-size:18px;letter-spacing:1px}.av2-stars .off{color:#e2e8f0}
.av2-grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:16px}
.av2-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:14px 16px;min-width:0}
.av2-card-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px;flex-wrap:wrap}
.av2-card-head h3{margin:0;font-size:15px}
.av2-muted{color:#94a3b8;font-size:12px}
.av2-chart{width:100%}.av2-svg{width:100%;height:auto;display:block}
.av2-svg .grid{stroke:#eef2f7}.av2-svg .axis{fill:#94a3b8;font-size:11px}
.av2-legend{display:flex;flex-wrap:wrap;gap:12px;font-size:12px;color:#475569;margin-top:6px}.av2-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.av2-hbars{display:flex;flex-direction:column;gap:8px}
.av2-hbar{display:grid;grid-template-columns:minmax(110px,180px) 1fr 56px;gap:10px;align-items:center;font-size:13px}
.av2-hbar .lab{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.av2-hbar .track{background:#f1f5f9;border-radius:6px;height:10px;overflow:hidden}.av2-hbar .fill{display:block;height:100%;border-radius:6px}.av2-hbar .val{text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
.av2-table{width:100%;border-collapse:collapse;font-size:13px}
.av2-table th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.03em;color:#64748b;border-bottom:1px solid #e2e8f0;padding:8px 10px;white-space:nowrap;background:#f8fafc}
.av2-table td{border-bottom:1px solid #f1f5f9;padding:8px 10px;white-space:nowrap}.av2-table tr:hover td{background:#f8fafc}
.av2-table .num{text-align:right;font-variant-numeric:tabular-nums}
.av2-tag{font-size:10px;background:#eef2ff;color:#4338ca;border-radius:999px;padding:1px 7px;font-weight:600}
.av2-pill{display:inline-block;border-radius:999px;padding:1px 8px;font-weight:700;font-size:12px}.av2-pill.warn{background:#fef3c7;color:#92400e}.av2-pill.bad{background:#fee2e2;color:#991b1b}
.av2-heat{display:grid;grid-template-columns:40px repeat(24,1fr);gap:3px;font-size:11px;color:#64748b}
.av2-heat .hc{aspect-ratio:1;border-radius:3px;min-width:8px}.av2-heat .hh{text-align:center}.av2-heat .hd{align-self:center}
.av2-empty{color:#94a3b8;font-size:13px;margin:8px 0;padding:18px;text-align:center;background:#f8fafc;border-radius:8px}
.av2-note{font-size:12px;color:#64748b;margin:0}
@media (max-width:720px){.av2{padding:14px}.av2-grid2{grid-template-columns:1fr}.av2-filters label{min-width:calc(50% - 10px)}.av2-hbar{grid-template-columns:100px 1fr 44px}}

/* ---- Shortcut click-to-insert + compact composer ---- */
#agent-assist-results.sc-click article.sc-item{cursor:pointer;transition:background .12s,border-color .12s;-webkit-tap-highlight-color:rgba(37,99,235,.15)}
#agent-assist-results.sc-click article.sc-item:hover,#agent-assist-results.sc-click article.sc-item:focus-visible{background:#eff6ff;border-color:#93c5fd;outline:none}
#agent-assist-results .sc-hidden-insert{display:none!important}
#conv-reply-input{min-height:44px!important;height:44px;max-height:calc(6 * 1.4em + 22px);resize:none;line-height:1.4;padding-top:10px;padding-bottom:10px;box-sizing:border-box;overflow-y:hidden}
@media (max-width:760px){#conv-reply-input{min-height:44px!important;font-size:16px}}