.nav-queue-count {
  display: inline-grid;
  place-items: center;
  min-width: 19px;
  height: 19px;
  margin-left: auto;
  padding: 0 5px;
  border-radius: 10px;
  background: #d94b45;
  color: #fff;
  font-size: 9px;
}

.queue-connection,
.queue-panel { max-width: none; }
.queue-connection { margin-bottom: 14px; }
.queue-connected { display: flex; align-items: center; gap: 9px; color: #69756f; font-size: 10px; }
.queue-connected strong { color: #176149; }
.queue-online-dot { width: 9px; height: 9px; border-radius: 50%; background: #29a66f; box-shadow: 0 0 0 4px #dcefe7; }
.queue-head { display: flex; align-items: center; justify-content: space-between; }
.queue-total { padding: 7px 10px; border-radius: 10px; background: #f4e7ca; color: #7a5714; font-size: 9px; font-weight: 800; }

.queue-tabs { display: flex; gap: 6px; margin-bottom: 14px; overflow-x: auto; }
.queue-tabs button { display: flex; align-items: center; gap: 7px; height: 36px; padding: 0 11px; border: 1px solid #dfe6e2; border-radius: 9px; background: #fff; color: #68756f; font: 700 9px Arial; white-space: nowrap; cursor: pointer; }
.queue-tabs button.selected { border-color: #1f6f5c; background: #e8f3ee; color: #176149; }
.queue-tabs b { display: grid; place-items: center; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 9px; background: #eef2f0; font-size: 8px; }
.queue-tabs button.selected b { background: #1f6f5c; color: #fff; }

.queue-list { display: grid; gap: 8px; }
.queue-ticket { display: grid; grid-template-columns: auto minmax(220px,1fr) auto; align-items: center; gap: 12px; padding: 13px; border: 1px solid #e3e9e6; border-radius: 12px; background: #fff; }
.queue-ticket.unread { border-left: 4px solid #d94b45; background: #fffdfc; }
.queue-avatar { display: grid; place-items: center; width: 39px; height: 39px; border-radius: 11px; background: #e5eee9; color: #2c6254; font-size: 10px; font-weight: 800; }
.queue-ticket-main { min-width: 0; }
.queue-ticket-main header { display: flex; align-items: center; gap: 7px; }
.queue-ticket-main header strong { font-size: 11px; }
.queue-ticket-main header time { margin-left: auto; color: #8a958f; font-size: 8px; }
.queue-ticket-main > p { margin: 5px 0 7px; overflow: hidden; color: #596861; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.queue-ticket-main footer { display: flex; align-items: center; gap: 8px; color: #7d8984; font-size: 8px; }
.queue-ticket-main footer small { color: #98a19d; }
.unread-count { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 9px; background: #d94b45; color: #fff; font-size: 8px; font-weight: 800; }
.queue-state { padding: 4px 6px; border-radius: 7px; font-weight: 800; text-transform: uppercase; }
.queue-state.waiting { background: #f5d7d4; color: #8f2f29; }
.queue-state.customer { background: #f4e7ca; color: #7a5714; }
.queue-state.service { background: #dcefe7; color: #176149; }
.queue-state.closed { background: #ecefed; color: #69756f; }
.queue-ticket-actions { display: flex; align-items: center; justify-content: flex-end; gap: 7px; flex-wrap: wrap; max-width: 360px; }
.queue-ticket-actions button { height: 34px; }
.queue-ticket-actions select { height: 34px; padding: 0 8px; border: 1px solid #d7e0dc; border-radius: 8px; background: #fff; color: #52635c; font-size: 9px; }
.queue-close { color: #a23d35; }
.queue-empty { padding: 35px; border: 1px dashed #cbd5d1; border-radius: 12px; color: #8a958f; text-align: center; font-size: 10px; }
.wa-metrics { display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:10px;margin:0 0 14px; }
.wa-metrics article { padding:14px;border:1px solid #e1e7e4;border-radius:12px;background:#fff;box-shadow:0 7px 20px rgba(42,62,54,.04); }
.wa-metrics small { display:block;color:#77837e;font-size:9px;text-transform:uppercase; }
.wa-metrics strong { display:block;margin-top:5px;color:#273b34;font-size:19px; }
.queue-tools { display:grid;grid-template-columns:minmax(190px,1fr) auto auto auto;gap:8px;margin-bottom:13px; }
.queue-tools input,.queue-tools select { height:38px;padding:0 10px;border:1px solid #d7e0dc;border-radius:9px;background:#fff;color:#52635c;font-size:10px; }
.priority-badge,.sla-badge { padding:3px 6px;border-radius:7px;font-size:8px;font-weight:800;text-transform:uppercase; }
.priority-badge { background:#edf0ee;color:#596861; }.priority-high .priority-badge{background:#f4e7ca;color:#7a5714}.priority-urgent .priority-badge{background:#f5d7d4;color:#8f2f29}
.sla-badge { background:#cf0a2c;color:#fff; }.queue-ticket.sla-late{box-shadow:0 0 0 2px rgba(207,10,44,.1)}
.wa-management{margin-bottom:14px}.wa-management>summary{cursor:pointer;font-size:11px;font-weight:800}.wa-connections{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px;margin:14px 0}.wa-connections article{display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:8px;padding:10px;border:1px solid #e3e9e6;border-radius:9px}.wa-connections article small{grid-column:2;color:#7d8984;font-size:8px}.queue-online-dot.offline{background:#9ca6a1;box-shadow:0 0 0 4px #ecefed}.quick-reply-list{display:grid;gap:7px}.quick-reply-list article{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px;border-top:1px solid #e3e9e6}.quick-reply-list p{margin:4px 0 0;color:#68756f;font-size:9px}

@media (max-width: 760px) {
  .wa-metrics { grid-template-columns:repeat(2,1fr); }.queue-tools{grid-template-columns:1fr;}
  .queue-ticket { grid-template-columns: auto 1fr; }
  .queue-ticket-actions { grid-column: 1/-1; justify-content: flex-start; max-width: none; }
  .queue-ticket-main footer { flex-wrap: wrap; }
}