/* Opção 1 — central clara, acolhedora e com identidade da equipe. */
body.human-option-one {
  --team-accent: #7057c7;
  --team-accent-deep: #493b83;
  --team-accent-soft: #eeeafd;
  --team-accent-border: #d7cdf8;
  --team-on-accent: #fff;
}
body.human-option-one.team-theme-amarela {
  --team-accent: #f4c542;
  --team-accent-deep: #6d5000;
  --team-accent-soft: #fff7d2;
  --team-accent-border: #ebd470;
  --team-on-accent: #332600;
}
body.human-option-one.team-theme-vermelha {
  --team-accent: #d9535f;
  --team-accent-deep: #8f3141;
  --team-accent-soft: #fdecef;
  --team-accent-border: #efbcc3;
}
body.human-option-one.team-theme-lilas {
  --team-accent: #8a63d2;
  --team-accent-deep: #5a3f91;
  --team-accent-soft: #f1eafb;
  --team-accent-border: #d9c8f1;
}

body.human-option-one .app-sidebar {
  background: linear-gradient(165deg,#173b5b,#293d6c 54%,#503584);
}
body.human-option-one .sidebar-link.is-active {
  background: rgba(255,255,255,.13);
  box-shadow: inset 3px 0 0 var(--team-accent);
}
body.human-option-one .app-content { max-width: 1580px; padding-top: 25px; }
.option-one-heading { margin-bottom: 15px; }
.option-one-heading h1 { font-size: clamp(28px,3vw,40px); }

.service-overview {
  display: grid;
  grid-template-columns: minmax(260px,1.35fr) repeat(3,minmax(125px,.55fr)) minmax(240px,1fr);
  gap: 11px;
  margin-bottom: 14px;
}
.service-welcome,.service-stat,.service-team-chart {
  min-height: 102px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 4px 16px rgba(31,42,74,.045);
}
.service-welcome {
  display: flex;
  flex-direction: column;
  justify-content: center;
  color: #fff;
  border: 0;
  background: linear-gradient(130deg,var(--team-accent-deep),var(--team-accent));
}
.team-theme-amarela .service-welcome {
  color: #302600;
  background: linear-gradient(130deg,#ffe782,#f4c542);
}
.team-theme-amarela .service-welcome small { color: rgba(48,38,0,.68); }
.team-theme-amarela .service-welcome span { color: rgba(48,38,0,.82); }
.service-welcome small,.service-welcome strong,.service-welcome span,.service-stat small,.service-stat strong,.service-stat span { display: block; }
.service-welcome small { color: rgba(255,255,255,.7); font-size: 9px; font-weight: 850; letter-spacing: .1em; }
.service-welcome strong { margin: 4px 0 2px; font-size: 19px; }
.service-welcome span { color: rgba(255,255,255,.84); font-size: 10px; }
.service-stat small { color: var(--muted); font-size: 9px; }
.service-stat strong { margin: 7px 0 1px; color: var(--ink); font-size: 29px; line-height: 1; }
.service-stat span { color: var(--team-accent-deep); font-size: 8px; font-weight: 750; }
.service-team-chart { padding: 13px 15px; }
.service-team-chart header { display: flex; justify-content: space-between; gap: 8px; }
.service-team-chart header strong { font-size: 10px; }
.service-team-chart header small { color: var(--muted); font-size: 8px; }
.service-chart-bars { height: 63px; display: flex; align-items: end; justify-content: space-around; gap: 12px; padding-top: 8px; }
.service-chart-item { height: 100%; display: flex; flex: 1; flex-direction: column; align-items: center; justify-content: end; gap: 3px; color: var(--muted); }
.service-chart-item i { width: 22px; height: clamp(9px,calc(9px + var(--bar-value) * 3px),43px); border-radius: 5px 5px 2px 2px; background: #9ca6b8; }
.service-chart-item small { max-width: 65px; overflow: hidden; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.service-chart-item.team-amarela i { background: #f4c542; }
.service-chart-item.team-vermelha i { background: #d9535f; }
.service-chart-item.team-lilas i { background: #8a63d2; }
.service-chart-empty { align-self: center; color: var(--muted); font-size: 9px; }

.option-one-layout {
  grid-template-columns: minmax(300px,345px) minmax(480px,1fr);
  height: calc(100vh - 374px);
  min-height: 590px;
  border-radius: 18px;
  border-color: #dde1eb;
  box-shadow: 0 14px 35px rgba(35,47,81,.075);
}
.option-one-layout .conversation-column { display: grid; grid-template-rows: auto auto auto auto minmax(0,1fr); border-right: 1px solid var(--line); background: #fcfcfe; }
.conversation-column-title { min-height: 64px; }
.queue-tabs { display: flex; gap: 6px; overflow-x: auto; padding: 10px 11px 7px; border-bottom: 0; scrollbar-width: thin; }
.queue-tab {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  min-height: 29px;
  padding: 6px 8px;
  border: 1px solid #e2e4eb;
  border-radius: 999px;
  color: #636b7c;
  background: #f4f5f8;
  font-size: 8px;
  font-weight: 750;
  cursor: pointer;
}
.queue-tab strong { min-width: 17px; height: 17px; display: grid; place-items: center; border-radius: 999px; color: #fff; background: #8d94a3; font-size: 7px; }
.queue-tab:hover,.queue-tab.is-active { border-color: var(--queue-color,var(--team-accent)); color: var(--queue-text,var(--team-accent-deep)); background: var(--queue-soft,var(--team-accent-soft)); }
.queue-tab.is-active { box-shadow: inset 0 0 0 1px var(--queue-color,var(--team-accent)); }
.queue-tab.is-active strong { color: var(--queue-count-text,#fff); background: var(--queue-color,var(--team-accent)); }
.queue-tab.team-amarela { --queue-color:#e3b526; --queue-text:#624800; --queue-soft:#fff8d8; --queue-count-text:#392a00; }
.queue-tab.team-vermelha { --queue-color:#d9535f; --queue-text:#8f3141; --queue-soft:#fdecef; }
.queue-tab.team-lilas { --queue-color:#8a63d2; --queue-text:#5a3f91; --queue-soft:#f1eafb; }
.queue-tab.team-cancelamentos { --queue-color:#54759b; --queue-text:#35516f; --queue-soft:#edf4fa; }
.queue-tab.team-administrativo { --queue-color:#528477; --queue-text:#356459; --queue-soft:#ecf7f3; }
.conversation-search { display: flex; align-items: center; gap: 7px; margin: 3px 11px 8px; padding: 0 11px; border-radius: 11px; color: #7e8695; background: #f0f2f6; }
.conversation-search input { min-width: 0; height: 36px; margin: 0; padding: 7px 0; border: 0; background: transparent; box-shadow: none; font-size: 10px; }
.conversation-search input:focus { box-shadow: none; }
.conversation-filters { display: flex; gap: 5px; padding: 0 11px 9px; border-bottom: 1px solid var(--line); }
.conversation-filters button { padding: 6px 8px; border: 0; border-radius: 999px; color: #6e7584; background: #f0f2f5; font-size: 8px; font-weight: 750; cursor: pointer; }
.conversation-filters button.is-active { color: var(--team-on-accent); background: var(--team-accent); }
.conversation-filters button span { font-weight: 900; }
.option-one-layout .ticket-list { min-height: 0; overflow-y: auto; padding: 7px; }
.option-one-layout .ticket-card { display: grid; grid-template-columns: 38px minmax(0,1fr) auto; align-items: center; gap: 10px; min-height: 66px; margin: 2px 0; padding: 10px; }
.option-one-layout .ticket-card.is-active { border-color: var(--team-accent-border); background: var(--team-accent-soft); box-shadow: inset 3px 0 0 var(--team-accent); }
.ticket-avatar { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 12px; color: var(--team-on-accent); background: var(--team-accent); font-size: 10px; font-style: normal; font-weight: 850; }
.ticket-copy { min-width: 0; }
.ticket-copy b,.ticket-copy span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ticket-copy b { font-size: 10px; }
.ticket-copy span { margin-top: 3px; color: var(--muted); font-size: 8px; }
.ticket-side { display: flex; align-items: end; flex-direction: column; gap: 5px; }
.ticket-side small { font-size: 7px; white-space: nowrap; }
.ticket-side em { padding: 3px 6px; border-radius: 999px; font-size: 7px; font-style: normal; font-weight: 850; }
.ticket-side em.waiting { color: #805c00; background: #fff3c8; }
.ticket-side em.attending { color: #12664f; background: #e1f4ed; }
.center-empty.compact { min-height: 190px; }

.option-one-layout .chat-column { background: #fff; }
.option-one-layout .chat-column > #chat-active { grid-template-rows: auto minmax(0,1fr) auto; }
.option-one-chat-header { min-height: 64px; justify-content: flex-start; padding: 10px 16px; }
.patient-avatar { width: 38px; height: 38px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 13px; color: var(--team-on-accent); background: var(--team-accent); font-size: 10px; font-weight: 850; }
.chat-patient-copy { min-width: 0; }
.chat-patient-copy h2,.chat-patient-copy p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-status-text { display: block; margin-top: 2px; color: var(--team-accent-deep); font-size: 8px; font-weight: 750; }
.option-one-chat-header .chat-actions { margin-left: auto; padding: 0; border: 0; background: transparent; }
.option-one-chat-header .chat-actions button { min-height: 33px; padding: 7px 10px; border-radius: 9px; font-size: 8px; }
.option-one-chat-header .chat-actions .ui-icon { width: 13px; height: 13px; }
.option-one-chat-header .button { color: var(--team-on-accent); border-color: var(--team-accent); background: var(--team-accent); }
.option-one-layout .message-list { padding: 20px; background: radial-gradient(circle at 10% 20%,rgba(112,87,199,.04),transparent 18rem),#f6f7fa; }
.option-one-layout .service-message { max-width: min(74%,620px); border-radius: 14px 14px 14px 4px; background: #fff; }
.option-one-layout .service-message.origin-usuario { margin-left: 0; border-color: #e1e4eb; border-radius: 14px 14px 14px 4px; background: #fff; }
.option-one-layout .service-message.origin-ia { margin-left: 0; border-left: 3px solid #8a63d2; }
.option-one-layout .service-message.origin-funcionario { margin-left: auto; border: 1px solid var(--team-accent-border); border-left: 1px solid var(--team-accent-border); border-radius: 14px 14px 4px 14px; background: var(--team-accent-soft); }
.option-one-layout .reply-box { padding: 11px 13px 13px; }
.option-one-layout .reply-compose { align-items: center; }
.option-one-layout .attach-button { width: 39px; height: 39px; flex-basis: 39px; color: var(--team-accent-deep); border-color: var(--team-accent-border); background: var(--team-accent-soft); }
.option-one-layout .reply-box textarea { min-height: 43px; padding: 11px 13px; border-radius: 12px; background: #fafbfc; }
.send-message-button { width: 41px; height: 41px; display: grid; flex: 0 0 auto; place-items: center; border: 0; border-radius: 12px; color: var(--team-on-accent); background: var(--team-accent); font-size: 14px; cursor: pointer; }
.send-message-button:hover { filter: brightness(.96); }
.send-message-button:disabled { cursor: wait; opacity: .6; }
.option-one-layout .reply-hint { margin-left: 49px; }

@media (max-width: 1280px) {
  .service-overview { grid-template-columns: 1.2fr repeat(3,.55fr); }
  .service-team-chart { display: none; }
  .option-one-layout { grid-template-columns: 315px minmax(430px,1fr); }
}
@media (max-width: 980px) {
  .service-overview { grid-template-columns: 1fr repeat(3,.5fr); }
  .service-welcome span { display: none; }
  .option-one-layout { grid-template-columns: 290px minmax(390px,1fr); }
  .option-one-chat-header .chat-actions button { padding: 7px; }
  .option-one-chat-header .chat-actions button .ui-icon { margin: 0; }
}
@media (max-width: 850px) {
  .service-overview { grid-template-columns: 1fr 1fr 1fr; }
  .service-welcome { grid-column: 1/-1; }
  .option-one-layout { height: auto; grid-template-columns: 1fr; }
  .option-one-layout .conversation-column { max-height: 430px; border-right: 0; border-bottom: 1px solid var(--line); }
  .option-one-layout .chat-column { min-height: 620px; }
}
@media (max-width: 560px) {
  .service-overview { grid-template-columns: 1fr 1fr; }
  .service-stat:last-of-type { display: none; }
  .option-one-chat-header { align-items: flex-start; flex-wrap: wrap; }
  .option-one-chat-header .chat-actions { width: 100%; margin-left: 48px; }
  .option-one-layout .service-message { max-width: 88%; }
}
