/* modules/setpoint/styles/setpoint.css · estilos da lente SetPoint. Usa o design
   system do v28 (.page-wrap, .adherence-card, .stats-grid, .section-title) + os tokens
   GLOBAIS de papel (--kind-* · style/kind-tokens.css). Classes próprias prefixadas sp-. */

/* Lista da caixa (inbox/outbox/historico) · itens com realce de PAPEL na borda. */
.sp-list { display: flex; flex-direction: column; gap: 8px; }
.sp-item {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  width: 100%; text-align: left; cursor: pointer;
  background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; padding: 12px 14px;
  transition: box-shadow .15s, border-color .15s;
}
.sp-item:hover { border-color: #cbd5e0; box-shadow: 0 2px 10px rgba(15,23,42,.06); }
.sp-item__main { min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.sp-item__title { font-size: 14px; font-weight: 600; color: #1e293b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sp-item__meta { display: flex; align-items: center; gap: 8px; font-size: 12px; color: #64748b; flex-wrap: wrap; }
.sp-item__mod { font-weight: 600; color: #475569; }
.sp-item__when { flex: 0 0 auto; font-size: 12px; color: #94a3b8; white-space: nowrap; }

/* Ações INLINE da caixa acionável (aprovar/assinar/recusar) · decisão sem entrar no módulo. */
.sp-item__acts { flex: 0 0 auto; display: flex; gap: 6px; }
.sp-act { border: 1px solid #cbd5e0; background: #fff; color: #334155; border-radius: 7px; padding: 5px 12px; font-size: 12px; font-weight: 600; cursor: pointer; transition: .12s; }
.sp-act:hover { background: #f8fafc; }
.sp-act--approve, .sp-act--sign { background: var(--product-accent, #6264a7); border-color: var(--product-accent, #6264a7); color: #fff; }
.sp-act--approve:hover, .sp-act--sign:hover { filter: brightness(1.07); }
.sp-act--reject { background: #fef2f2; border-color: #fecaca; color: #b91c1c; }
.sp-act--reject:hover { background: #fee2e2; }

/* ── Início · HOME CONVERGENTE (feed temporal + peek) · porte de V5 ─────────── */
.sp-home { display: grid; grid-template-columns: 1fr 300px; gap: 16px; align-items: start; }
.sp-main { min-width: 0; }
.sp-toolbar { display: flex; gap: 10px; margin-bottom: 12px; }
.sp-search { flex: 1; border: 1px solid #cbd5e0; border-radius: 8px; padding: 9px 13px; font: inherit; font-size: 13.5px; outline: 0; background: #fff; }
.sp-search:focus { border-color: var(--product-accent, #6264a7); box-shadow: 0 0 0 3px color-mix(in srgb, var(--product-accent, #6264a7) 14%, white); }
.sp-novo-btn { flex: 0 0 auto; border: 1px solid var(--product-accent, #6264a7); background: var(--product-accent, #6264a7); color: #fff; border-radius: 8px; padding: 9px 16px; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.sp-novo-btn:hover { filter: brightness(1.07); }
.sp-filters { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 12px; }
.sp-chip { border: 1px solid #e2e8f0; background: #fff; border-radius: 999px; padding: 5px 13px; font-size: 12.5px; font-weight: 600; color: #475569; cursor: pointer; }
.sp-chip:hover { border-color: #cbd5e0; }
.sp-chip.active { background: var(--product-accent, #6264a7); border-color: var(--product-accent, #6264a7); color: #fff; }
.sp-feed { display: flex; flex-direction: column; gap: 8px; }
.sp-row { display: flex; align-items: flex-start; gap: 11px; width: 100%; text-align: left; background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; padding: 11px 14px; cursor: pointer; transition: box-shadow .15s, border-color .15s; }
.sp-row:hover { border-color: #cbd5e0; box-shadow: 0 2px 10px rgba(15,23,42,.06); }
.sp-row.needs { background: color-mix(in srgb, var(--kind-color, var(--product-accent, #6264a7)) 5%, white); }
.sp-row__av { flex: 0 0 auto; width: 32px; height: 32px; display: inline-grid; place-items: center; border-radius: 50%; background: #64748b; color: #fff; font-size: 12px; font-weight: 700; }
.sp-row__body { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 4px; }
.sp-row__top { display: flex; justify-content: space-between; gap: 10px; }
.sp-row__subj { font-size: 14px; font-weight: 600; color: #1e293b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: flex; align-items: center; gap: 7px; }
.sp-row__time { flex: 0 0 auto; font-size: 11.5px; color: #94a3b8; }
.sp-row__meta { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.sp-row__prev { font-size: 12.5px; color: #64748b; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sp-row__acts { display: inline-flex; gap: 6px; margin-left: auto; }
/* Peek (Pessoas + Hoje) */
.sp-peek { display: flex; flex-direction: column; gap: 16px; }
.sp-peek-sec { padding: 14px 16px; }
.sp-today { display: flex; gap: 8px; }
.sp-kpi { flex: 1; text-align: center; background: #f8fafc; border-radius: 9px; padding: 10px 6px; }
.sp-kpi b { display: block; font-size: 22px; font-weight: 700; color: #1e293b; line-height: 1; }
.sp-kpi span { font-size: 11px; color: #64748b; }
@media (max-width: 980px) { .sp-home { grid-template-columns: 1fr; } }

/* Presença · linha (compartilhada entre Início/peek e Pessoas). */
.sp-pres-row { display: flex; align-items: center; gap: 10px; padding: 8px 2px; border-bottom: 1px solid #eef2f7; }
.sp-pres-row:last-child { border-bottom: 0; }
.sp-pres-dot { width: 9px; height: 9px; border-radius: 50%; background: #c8c6c4; flex: 0 0 auto; }
.sp-pres-dot.on { background: var(--kind-presence, #2b88d8); box-shadow: 0 0 0 3px color-mix(in srgb, var(--kind-presence, #2b88d8) 18%, white); }
.sp-pres-name { font-size: 13.5px; font-weight: 600; color: #1e293b; }
.sp-pres-where { margin-left: auto; font-size: 12px; color: #64748b; }

/* ── Filtro de fluxo in-place (Agenda) ───────────────────────────────────── */
.sp-flowbar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.sp-flow { display: inline-flex; align-items: center; gap: 7px; border: 1px solid #e2e8f0; background: #fff; border-radius: 999px; padding: 5px 13px; font-size: 12.5px; font-weight: 600; color: #475569; cursor: pointer; }
.sp-flow:hover { border-color: #cbd5e0; }
.sp-flow.sel { background: var(--product-accent, #6264a7); border-color: var(--product-accent, #6264a7); color: #fff; }
.sp-flow.sel .kind-dot { box-shadow: 0 0 0 2px #fff; }

/* ── Caixa única no padrão OUTLOOK (rail + lista + leitura) ──────────────── */
.mbx { display: grid; grid-template-columns: 190px 340px 1fr; min-height: 480px; }
/* Barra de categorias da caixa (Fase 2 · estilo Courier) — Tudo · Coordenação · Reuniões + sub-filtro de modo */
.mbx-cats { display: flex; flex-direction: column; gap: 8px; margin: 0 2px 12px; }
.mbx-cats__row, .mbx-modes { display: flex; gap: 8px; flex-wrap: wrap; }
.mbx-cat { display: inline-flex; align-items: center; gap: 7px; border: 1px solid #e2e8f0; background: #fff; border-radius: 999px; padding: 6px 14px; font-size: 13px; font-weight: 600; color: #475569; cursor: pointer; }
.mbx-cat:hover { background: #f8fafc; }
.mbx-cat.sel { background: var(--product-accent, #6264a7); border-color: var(--product-accent, #6264a7); color: #fff; }
.mbx-cat__n { font-size: 11px; font-weight: 700; background: color-mix(in srgb, var(--product-accent, #6264a7) 12%, #eef2f7); color: #64748b; border-radius: 9px; padding: 0 7px; }
.mbx-cat.sel .mbx-cat__n { background: rgba(255,255,255,.25); color: #fff; }
.mbx-mode { border: 1px solid #e2e8f0; background: #fff; border-radius: 8px; padding: 4px 12px; font-size: 12px; font-weight: 600; color: #64748b; cursor: pointer; }
.mbx-mode:hover { background: #f8fafc; }
.mbx-mode.sel { background: color-mix(in srgb, var(--product-accent, #6264a7) 12%, #fff); border-color: var(--product-accent, #6264a7); color: var(--product-accent, #6264a7); }
/* Selo de ESTADO da reunião + badge de RSVP do participante */
.mbx-mtag { font-size: 10.5px; font-weight: 700; letter-spacing: .2px; border-radius: 999px; padding: 1px 9px; white-space: nowrap; background: #eef2f7; color: #64748b; border: 1px solid #e2e8f0; }
.mbx-mtag--confirmed { background: #e8f5ec; color: #1e7e34; border-color: #bfe3c9; }
.mbx-mtag--ended { background: #f1f5f9; color: #94a3b8; }
.mbx-mtag--active { background: #fff7e8; color: #a96d09; border-color: #f0dca8; }
.mbx-rsvp { font-size: 11px; font-weight: 700; border-radius: 999px; padding: 1px 9px; white-space: nowrap; background: #fff7e8; color: #a96d09; border: 1px solid #f0dca8; }
.mbx-rsvp--accepted { background: #e8f5ec; color: #1e7e34; border-color: #bfe3c9; }
.mbx-rsvp--declined { background: #fdecec; color: #c0392b; border-color: #f3c9cd; }
.mbx-mthread { margin-top: 14px; border-top: 1px solid #eef2f7; padding-top: 12px; }
.sp-act--accept { background: #1e7e34; color: #fff; }
.sp-act--decline { background: #fff; color: #c0392b; border: 1px solid #f3c9cd; }
.mbx-rail { border-right: 1px solid #eef2f7; padding: 10px 8px; display: flex; flex-direction: column; gap: 2px; background: #fafbfc; }
.mbx-folder { display: flex; align-items: center; gap: 9px; width: 100%; text-align: left; border: 0; background: none; border-radius: 8px; padding: 8px 10px; font-size: 13px; color: #334155; cursor: pointer; }
.mbx-folder:hover { background: #f1f5f9; }
.mbx-folder.sel { background: color-mix(in srgb, var(--product-accent, #6264a7) 12%, white); color: var(--product-accent, #6264a7); font-weight: 700; }
.mbx-folder__name { flex: 1; }
.mbx-folder__n { font-size: 11px; font-weight: 700; color: #94a3b8; background: #eef2f7; border-radius: 9px; padding: 1px 7px; }
.mbx-folder.sel .mbx-folder__n { background: #fff; color: var(--product-accent, #6264a7); }
.mbx-list { border-right: 1px solid #eef2f7; overflow-y: auto; max-height: 640px; }
.mbx-item { width: 100%; text-align: left; display: flex; flex-direction: column; gap: 3px; padding: 11px 14px; background: #fff; border: 0; border-bottom: 1px solid #f3f4f6; cursor: pointer; }
.mbx-item:hover { background: #f8fafc; }
.mbx-item.sel { background: color-mix(in srgb, var(--product-accent, #6264a7) 8%, white); box-shadow: inset 3px 0 0 var(--kind-color, var(--product-accent, #6264a7)); }
.mbx-item.unread .mbx-item__from, .mbx-item.unread .mbx-item__subj { font-weight: 700; }
.mbx-item.unread::after { content: ''; }
.mbx-item__r1 { display: flex; justify-content: space-between; gap: 8px; }
.mbx-item__from { font-size: 13px; color: #1e293b; }
.mbx-item__t { font-size: 11px; color: #94a3b8; flex: 0 0 auto; }
.mbx-item__subj { font-size: 13px; color: #1e293b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mbx-item__prev { font-size: 12px; color: #94a3b8; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: flex; align-items: center; gap: 6px; }
.mbx-read { padding: 18px 20px; overflow-y: auto; min-width: 0; }
.mbx-empty { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #94a3b8; gap: 8px; }
.mbx-empty__ic { font-size: 34px; }
.mbx-read__subj { font-size: 18px; font-weight: 700; color: #1e293b; }
.mbx-read__meta { display: flex; align-items: center; gap: 9px; font-size: 12.5px; color: #64748b; margin: 10px 0 14px; padding-bottom: 12px; border-bottom: 1px solid #eef2f7; }
.mbx-read__body { font-size: 14px; color: #334155; line-height: 1.6; }
.mbx-read__note { margin-top: 14px; font-size: 12.5px; color: #94a3b8; background: #f8fafc; border-radius: 8px; padding: 10px 12px; }
.mbx-thread { display: flex; flex-direction: column; gap: 12px; }
.mbx-tmsg { display: flex; gap: 10px; }
.mbx-tmsg__h { font-size: 12px; color: #64748b; }
.mbx-tmsg__b { font-size: 13.5px; color: #1e293b; margin-top: 2px; }
.mbx-actions { display: flex; gap: 8px; margin-top: 16px; padding-top: 14px; border-top: 1px solid #eef2f7; }
/* Compose colaborativo (comentar na thread sem decidir) · padrão cliente de e-mail. */
.mbx-compose { display: flex; gap: 8px; margin-top: 14px; padding-top: 14px; border-top: 1px solid #eef2f7; }
.mbx-compose__in { flex: 1; border: 1px solid #cbd5e0; border-radius: 8px; padding: 8px 11px; font: inherit; font-size: 13px; outline: 0; }
.mbx-compose__in:focus { border-color: var(--product-accent, #6264a7); box-shadow: 0 0 0 3px color-mix(in srgb, var(--product-accent, #6264a7) 14%, white); }
.mbx--single { grid-template-columns: 340px 1fr; }   /* caixa de módulo · sem rail */
.mbx-facet { margin-top: 14px; padding: 12px 14px; background: #f8fafc; border: 1px solid #eef2f7; border-radius: 8px; }
.mbx-facet__t { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #94a3b8; margin-bottom: 8px; }
.mbx-facet__row { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; padding: 3px 0; }
.mbx-facet__row span { color: #64748b; }
.mbx-facet__row b { color: #1e293b; }
/* Fluxo (caixas) · stepper Solicitações → Pendências → Histórico, destacando a etapa atual. */
.mbx-flow { margin-top: 14px; padding: 12px 14px; background: #f8fafc; border: 1px solid #eef2f7; border-radius: 8px; }
.mbx-flow__t { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #94a3b8; margin-bottom: 10px; }
.mbx-flow__steps { display: flex; align-items: stretch; gap: 6px; flex-wrap: wrap; }
.mbx-flow__step { flex: 1; min-width: 110px; border: 1px solid #e2e8f0; border-radius: 8px; padding: 7px 10px; background: #fff; display: flex; flex-direction: column; gap: 2px; }
.mbx-flow__box { font-size: 12.5px; font-weight: 700; color: #64748b; }
.mbx-flow__who { font-size: 11.5px; color: #94a3b8; }
.mbx-flow__step.is-done { border-color: #bfe6c9; background: #f3faf5; }
.mbx-flow__step.is-done .mbx-flow__box { color: #1e7e34; }
.mbx-flow__step.is-current { border-color: var(--product-accent, #6264a7); box-shadow: inset 0 0 0 1px var(--product-accent, #6264a7); }
.mbx-flow__step.is-current .mbx-flow__box { color: var(--product-accent, #6264a7); }
.mbx-flow__step.is-todo { opacity: .6; }
.mbx-flow__arrow { align-self: center; color: #cbd5e1; font-weight: 700; }
@media (max-width: 600px) { .mbx-flow__steps { flex-direction: column; } .mbx-flow__arrow { transform: rotate(90deg); } }

/* ===================== AGENDA · porte fiel do calendário de V5 =====================
   Escopado ao produto SetPoint p/ não colidir com estilos globais do v28. Tokens locais
   --ol-* + --line/--muted; cor de PAPEL via --kind-* (global). */
.app-container[data-product="setpoint"] { --ol-blue:#0f6cbd; --ol-blue-dark:#1a4d80; --ol-purple:#8764b8; --ol-green:#107c41; --ol-amber:#c98a00; --line:#e2e8f0; --muted:#64748b; --radius:10px; --brand:var(--product-accent,#6264a7); }
.app-container[data-product="setpoint"] .muted { color: var(--muted); }
.app-container[data-product="setpoint"] .cal-root { display:flex; flex-direction:column; }
.app-container[data-product="setpoint"] .cal-toolbar { display:flex; align-items:center; gap:8px; margin-bottom:10px; flex-wrap:wrap; }
.app-container[data-product="setpoint"] .cal-toolbar .btn { border:1px solid var(--line); background:#fff; border-radius:8px; padding:7px 12px; font-size:13px; cursor:pointer; color:#334155; }
.app-container[data-product="setpoint"] .cal-toolbar .btn:hover { background:#f8fafc; }
.app-container[data-product="setpoint"] .cal-toolbar .btn.icon { width:32px; padding:4px 0; font-size:18px; line-height:1; }
.app-container[data-product="setpoint"] .cal-title { margin:0 6px; font-size:20px; font-weight:600; }
.app-container[data-product="setpoint"] .cal-title::first-letter { text-transform:uppercase; }
.app-container[data-product="setpoint"] .cal-toolbar .spacer { flex:1; }
.app-container[data-product="setpoint"] .view-switch { display:inline-flex; border:1px solid var(--line); border-radius:6px; overflow:hidden; }
.app-container[data-product="setpoint"] .view-btn { border:none; background:#fff; padding:7px 14px; cursor:pointer; font-size:13px; border-left:1px solid var(--line); }
.app-container[data-product="setpoint"] .view-btn:first-child { border-left:none; }
.app-container[data-product="setpoint"] .view-btn.active { background:var(--brand); color:#fff; }
.app-container[data-product="setpoint"] .cal-tzhint { font-size:12px; margin-top:10px; }
/* Mês */
.app-container[data-product="setpoint"] .cal-weekhead, .app-container[data-product="setpoint"] .cal-grid { display:grid; grid-template-columns:repeat(7,1fr); }
.app-container[data-product="setpoint"] .cal-weekhead .wh { padding:6px 8px; font-size:12px; color:var(--muted); text-transform:uppercase; border-bottom:1px solid var(--line); }
.app-container[data-product="setpoint"] .cal-grid { border-left:1px solid var(--line); border-top:1px solid var(--line); }
.app-container[data-product="setpoint"] .cell { min-height:104px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); padding:4px; overflow:hidden; cursor:pointer; background:#fff; }
.app-container[data-product="setpoint"] .cell.outside { background:#faf9f8; color:#b3b0ad; }
.app-container[data-product="setpoint"] .cell.today { background:#eff6fc; }
.app-container[data-product="setpoint"] .cell-date { font-size:12px; font-weight:600; text-align:right; padding:2px 4px; display:flex; align-items:center; justify-content:flex-end; gap:4px; }
/* "+" do dia (mês) → Novo evento naquele dia. Aparece no hover (desktop); sempre visível no toque. */
.app-container[data-product="setpoint"] .cell-new { order:-1; margin-right:auto; width:18px; height:18px; line-height:1; border:none; border-radius:4px; background:#eef1f5; color:#475569; font-size:13px; cursor:pointer; opacity:0; transition:opacity .12s; padding:0; }
.app-container[data-product="setpoint"] .cell:hover .cell-new { opacity:1; }
.app-container[data-product="setpoint"] .cell-new:hover { background:var(--ol-blue); color:#fff; }
.app-container[data-product="setpoint"] .cell.today .cell-date { background:var(--ol-blue); color:#fff; border-radius:50%; width:22px; height:22px; line-height:18px; margin-left:auto; }
.app-container[data-product="setpoint"] .cell-events { display:flex; flex-direction:column; gap:2px; }
.app-container[data-product="setpoint"] .mchip { font-size:11px; padding:2px 6px; border-radius:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; cursor:pointer; background:#f4f5f7; border-left:3px solid var(--ol-blue); }
.app-container[data-product="setpoint"] .mchip.span { background:#eef0f3; }
.app-container[data-product="setpoint"] .more { font-size:11px; color:var(--ol-blue); cursor:pointer; padding:0 4px; }
/* Semana / Dia */
.app-container[data-product="setpoint"] .timegrid { display:flex; flex-direction:column; height:calc(100vh - 280px); border:1px solid var(--line); border-radius:8px; overflow:hidden; }
.app-container[data-product="setpoint"] .tg-head { display:grid; grid-template-columns:56px repeat(var(--cols),1fr); border-bottom:1px solid var(--line); }
.app-container[data-product="setpoint"] .tg-corner { border-right:1px solid var(--line); }
.app-container[data-product="setpoint"] .tg-dayhead { padding:8px; text-align:center; font-size:13px; border-right:1px solid var(--line); }
.app-container[data-product="setpoint"] .tg-dayhead .dn { color:var(--muted); text-transform:uppercase; font-size:11px; }
.app-container[data-product="setpoint"] .tg-dayhead .dnum { font-weight:700; }
.app-container[data-product="setpoint"] .tg-dayhead.today { color:var(--ol-blue); }
.app-container[data-product="setpoint"] .tg-allday { display:grid; grid-template-columns:56px repeat(var(--cols),1fr); border-bottom:2px solid var(--line); min-height:28px; background:#fafafa; }
.app-container[data-product="setpoint"] .tg-allday-label { font-size:10px; color:var(--muted); padding:4px; border-right:1px solid var(--line); text-align:right; }
.app-container[data-product="setpoint"] .tg-allday-cell { padding:3px; border-right:1px solid var(--line); display:flex; flex-direction:column; gap:2px; }
.app-container[data-product="setpoint"] .achip { font-size:11px; padding:1px 6px; border-radius:4px; background:#f4f5f7; border-left:3px solid var(--ol-purple); cursor:pointer; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.app-container[data-product="setpoint"] .tg-scroll { overflow-y:auto; flex:1; }
.app-container[data-product="setpoint"] .tg-body { display:flex; position:relative; }
.app-container[data-product="setpoint"] .tg-gutter { width:56px; flex:0 0 56px; }
.app-container[data-product="setpoint"] .tg-gutter .hr { font-size:11px; color:var(--muted); text-align:right; padding-right:6px; border-bottom:1px solid #f0f0f0; box-sizing:border-box; }
.app-container[data-product="setpoint"] .tg-cols { flex:1; display:grid; grid-template-columns:repeat(var(--cols),1fr); }
.app-container[data-product="setpoint"] .tg-col { position:relative; border-right:1px solid var(--line); }
.app-container[data-product="setpoint"] .tg-col.today { background:#f5fafd; }
.app-container[data-product="setpoint"] .hrline { border-bottom:1px solid #f0f0f0; box-sizing:border-box; }
/* Faixa horária criável (clique → Novo evento naquele horário) — cue suave no hover. */
.app-container[data-product="setpoint"] .hrline.slot { cursor:pointer; }
.app-container[data-product="setpoint"] .hrline.slot:hover { background:rgba(0,120,212,.07); box-shadow:inset 2px 0 0 var(--ol-blue); }
.app-container[data-product="setpoint"] .tblock { position:absolute; left:3px; right:3px; border-radius:5px; padding:2px 6px; font-size:11px; overflow:hidden; cursor:pointer; background:#eef1f5; border-left:3px solid var(--ol-blue); }
.app-container[data-product="setpoint"] .tblock .tb-time { font-size:10px; color:var(--muted); }
.app-container[data-product="setpoint"] .tblock .tb-subj { font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
/* Realce do evento aberto a partir do Início (handoff sp_focus_event) — outline na cor do produto. */
.app-container[data-product="setpoint"] .mchip.is-selected,
.app-container[data-product="setpoint"] .achip.is-selected,
.app-container[data-product="setpoint"] .tblock.is-selected,
.app-container[data-product="setpoint"] .event.is-selected {
  outline: 2px solid var(--product-accent, #6264a7);
  outline-offset: 1px;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--product-accent, #6264a7) 18%, transparent);
  position: relative; z-index: 2;
}
/* Agenda (lista) */
.app-container[data-product="setpoint"] .ag-group { margin-bottom:16px; max-width:860px; }
.app-container[data-product="setpoint"] .ag-head { font-size:13px; font-weight:600; color:var(--ol-blue-dark); border-bottom:1px solid var(--line); padding-bottom:4px; margin-bottom:8px; }
.app-container[data-product="setpoint"] .ag-head::first-letter { text-transform:uppercase; }
.app-container[data-product="setpoint"] .event { display:flex; align-items:stretch; gap:12px; background:#fff; border:1px solid var(--line); border-left:4px solid var(--ol-blue); border-radius:var(--radius); padding:10px 14px; margin-bottom:8px; cursor:pointer; }
.app-container[data-product="setpoint"] .event.is-span { background:#fbfaff; border-style:dashed; }
.app-container[data-product="setpoint"] .event .time { width:120px; flex:0 0 auto; color:var(--muted); font-size:13px; }
.app-container[data-product="setpoint"] .event .subject { font-weight:600; font-size:15px; }
.app-container[data-product="setpoint"] .event .meta { margin-top:4px; display:flex; gap:6px; flex-wrap:wrap; align-items:center; }
.app-container[data-product="setpoint"] .badge { font-size:11px; font-weight:600; padding:2px 8px; border-radius:4px; background:#eef3f8; color:var(--ol-blue-dark); }
.app-container[data-product="setpoint"] .chip { font-size:11px; padding:2px 8px; border-radius:10px; background:#eef1f4; color:var(--muted); border:1px solid var(--line); }
.app-container[data-product="setpoint"] .cont { font-size:11px; color:var(--ol-purple); font-weight:600; margin-right:6px; }
.app-container[data-product="setpoint"] .empty { padding:40px; text-align:center; color:var(--muted); border:1px dashed var(--line); border-radius:var(--radius); }
/* Cor da barra esquerda = PAPEL (kind) · tokens globais */
.app-container[data-product="setpoint"] .kind-event { border-left-color:var(--kind-event); }
.app-container[data-product="setpoint"] .kind-task { border-left-color:var(--kind-task); }
.app-container[data-product="setpoint"] .kind-booking { border-left-color:var(--kind-booking); }
.app-container[data-product="setpoint"] .kind-absence { border-left-color:var(--kind-absence); }
.app-container[data-product="setpoint"] .kind-holiday { border-left-color:var(--kind-holiday); }
/* Legenda */
.app-container[data-product="setpoint"] .cal-legend { display:flex; flex-wrap:wrap; gap:4px 14px; margin-top:8px; font-size:11px; color:var(--muted); }
.app-container[data-product="setpoint"] .cal-legend .lg { border-left:4px solid var(--line); padding-left:6px; line-height:1.5; }
/* Modal de detalhe/edição */
.app-container[data-product="setpoint"] .modal-backdrop { position:fixed; inset:0; background:rgba(0,0,0,.35); display:grid; place-items:center; z-index:1100; }
.app-container[data-product="setpoint"] .modal-card { background:#fff; border-radius:10px; width:480px; max-width:92vw; box-shadow:0 12px 40px rgba(0,0,0,.25); }
.app-container[data-product="setpoint"] .modal-h { display:flex; align-items:center; gap:10px; padding:14px 16px; border-bottom:1px solid var(--line); }
.app-container[data-product="setpoint"] .modal-h h3 { margin:0; font-size:16px; flex:1; }
.app-container[data-product="setpoint"] .modal-h .dot { width:12px; height:12px; border-radius:50%; background:var(--kind-color,var(--ol-blue)); }
.app-container[data-product="setpoint"] .modal-close { border:none; background:none; font-size:16px; cursor:pointer; color:var(--muted); }
.app-container[data-product="setpoint"] .modal-b { padding:16px; display:flex; flex-direction:column; gap:6px; font-size:14px; }
.app-container[data-product="setpoint"] .modal-b .row { display:flex; gap:12px; flex-wrap:wrap; }
.app-container[data-product="setpoint"] .modal-b .field { display:flex; flex-direction:column; gap:5px; }
.app-container[data-product="setpoint"] .modal-b .field label { font-size:12px; color:var(--muted); font-weight:600; }
.app-container[data-product="setpoint"] .modal-b input { border:1px solid var(--line); border-radius:8px; padding:8px 10px; font:inherit; font-size:13px; }
.app-container[data-product="setpoint"] .modal-f { padding:12px 16px; border-top:1px solid var(--line); display:flex; gap:8px; align-items:center; }
.app-container[data-product="setpoint"] .modal-f .btn { border:1px solid var(--line); background:#fff; border-radius:8px; padding:7px 14px; cursor:pointer; font-size:13px; }
.app-container[data-product="setpoint"] .modal-f .btn-primary { background:var(--brand); border-color:var(--brand); color:#fff; }
.app-container[data-product="setpoint"] .modal-f .btn.danger { color:#a4262c; border-color:#e6b3b6; }
/* ===== "Novo" (abas por tipo + RRULE) · porte fiel V5, escopado ===== */
.app-container[data-product="setpoint"] .kind-tabs { display:flex; flex-wrap:wrap; gap:6px; border:none; overflow:visible; }
.app-container[data-product="setpoint"] .kind-tabs .view-btn { border:1px solid var(--line); border-radius:6px; }
.app-container[data-product="setpoint"] .kind-tabs .view-btn.active { border-color:var(--brand); }
.app-container[data-product="setpoint"] .compose { max-width:680px; display:flex; flex-direction:column; gap:12px; }
.app-container[data-product="setpoint"] .compose .field { display:flex; flex-direction:column; gap:5px; }
.app-container[data-product="setpoint"] .compose .field label { font-size:12px; font-weight:600; color:var(--muted); }
.app-container[data-product="setpoint"] .compose input, .app-container[data-product="setpoint"] .compose select { border:1px solid var(--line); border-radius:8px; padding:8px 10px; font:inherit; font-size:13px; background:#fff; }
.app-container[data-product="setpoint"] .compose .row { display:flex; gap:12px; flex-wrap:wrap; }
.app-container[data-product="setpoint"] .compose .row .field { flex:1; min-width:160px; }
.app-container[data-product="setpoint"] .check-row { display:flex; align-items:center; gap:8px; font-size:13px; }
.app-container[data-product="setpoint"] .actions { margin-top:8px; }
.app-container[data-product="setpoint"] .actions .btn { border:1px solid var(--line); background:#fff; border-radius:8px; padding:9px 16px; font-size:13px; font-weight:600; cursor:pointer; }
.app-container[data-product="setpoint"] .actions .btn-primary { background:var(--brand); border-color:var(--brand); color:#fff; }
.app-container[data-product="setpoint"] .rrule-builder { border:1px solid var(--line); border-radius:8px; padding:12px 14px; display:flex; flex-direction:column; gap:12px; background:#fafafa; }
.app-container[data-product="setpoint"] .rrule-row { display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-size:13px; }
.app-container[data-product="setpoint"] .rrule-row > span:first-child { color:var(--muted); min-width:64px; font-weight:600; }
.app-container[data-product="setpoint"] .rrule-days { display:flex; gap:6px; flex-wrap:wrap; }
.app-container[data-product="setpoint"] .day-btn { border:1px solid var(--line); background:#fff; padding:6px 10px; border-radius:16px; cursor:pointer; font-size:12px; min-width:42px; }
.app-container[data-product="setpoint"] .day-btn.on { background:var(--ol-blue); border-color:var(--ol-blue); color:#fff; font-weight:600; }
.app-container[data-product="setpoint"] .rrule-opt { display:flex; align-items:center; gap:6px; }
.app-container[data-product="setpoint"] .rrule-preview { font-size:13px; padding-top:4px; border-top:1px dashed var(--line); }
.app-container[data-product="setpoint"] .rrule-preview code { color:var(--ol-green); word-break:break-all; }
.app-container[data-product="setpoint"] .hidden { display:none !important; }

@media (max-width:600px){
  .app-container[data-product="setpoint"] .cal-toolbar .spacer { display:none; }
  .app-container[data-product="setpoint"] .cal-title { font-size:17px; flex-basis:100%; margin:2px 0; }
  .app-container[data-product="setpoint"] .view-switch { width:100%; } .app-container[data-product="setpoint"] .view-btn { flex:1; padding:8px 4px; }
  /* MÊS: grade compacta tocável (números menores, células mais baixas, "+" sempre visível). */
  .app-container[data-product="setpoint"] .cell { min-height:58px; } .app-container[data-product="setpoint"] .mchip { font-size:10px; }
  .app-container[data-product="setpoint"] .cell-new { opacity:1; }
  /* SEMANA: 7 colunas não cabem → vira SCROLL HORIZONTAL com largura mínima por dia.
     head/allday/body rolam juntos (o scroll horizontal é do .timegrid); o vertical fica no .tg-scroll.
     DIA (--cols:1) ocupa a largura toda e não rola na horizontal. */
  .app-container[data-product="setpoint"] .timegrid { height:calc(100dvh - 300px); overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .app-container[data-product="setpoint"] .tg-head,
  .app-container[data-product="setpoint"] .tg-allday,
  .app-container[data-product="setpoint"] .tg-body { min-width:calc(48px + var(--cols) * 84px); }
  .app-container[data-product="setpoint"] .tg-head, .app-container[data-product="setpoint"] .tg-allday { grid-template-columns:48px repeat(var(--cols),minmax(84px,1fr)); }
  .app-container[data-product="setpoint"] .tg-gutter, .app-container[data-product="setpoint"] .tg-gutter .hr { width:48px; flex-basis:48px; }
  .app-container[data-product="setpoint"] .tg-cols { grid-template-columns:repeat(var(--cols),minmax(84px,1fr)); }
}
@media (max-width: 1024px) {
  .mbx { grid-template-columns: 160px 1fr; }
  .mbx-read { grid-column: 1 / -1; border-top: 1px solid #eef2f7; }
}
@media (max-width: 680px) {
  .mbx { grid-template-columns: 1fr; }
  .mbx-rail { flex-direction: row; flex-wrap: wrap; border-right: 0; border-bottom: 1px solid #eef2f7; }
  .mbx-list { max-height: 300px; border-right: 0; border-bottom: 1px solid #eef2f7; }
  /* SOTA touch: decisão e compose fáceis de tocar (≥44px); ações empilham se faltar largura. */
  .mbx-actions { flex-wrap: wrap; }
  .sp-act { padding: 11px 16px; min-height: 44px; }
  .mbx-compose { flex-wrap: wrap; }
  .mbx-compose__in { min-height: 44px; flex: 1 1 100%; }
  .mbx-folder { padding: 10px 12px; min-height: 40px; }
}

/* ── Workgroup (Conversas) · síncrono (Teams) × assíncrono (e-mail) ───────── */
.sp-seg { border: 1px solid #cbd5e0; border-radius: 8px; overflow: hidden; }
.sp-seg__b { border: 0; background: #fff; padding: 7px 14px; font-size: 13px; color: #64748b; cursor: pointer; }
.sp-seg__b + .sp-seg__b { border-left: 1px solid #cbd5e0; }
.sp-seg__b.is-active { background: var(--product-accent, #6264a7); color: #fff; font-weight: 600; }
.sp-av { display: inline-grid; place-items: center; border-radius: 50%; background: var(--a, #605e5c); color: #fff; font-weight: 700; box-shadow: 0 0 0 2px #fff; flex: 0 0 auto; }
.sp-comms { display: grid; grid-template-columns: 320px 1fr; min-height: 440px; }
.sp-comms-list { border-right: 1px solid #eef2f7; overflow-y: auto; max-height: 600px; }
.sp-cv { width: 100%; text-align: left; display: flex; align-items: center; gap: 10px; padding: 11px 14px; background: #fff; border: 0; border-bottom: 1px solid #f3f4f6; cursor: pointer; position: relative; }
.sp-cv:hover { background: #f8fafc; }
.sp-cv.sel { background: color-mix(in srgb, var(--product-accent, #6264a7) 8%, white); box-shadow: inset 3px 0 0 var(--product-accent, #6264a7); }
.sp-cv.unread .sp-cv__name, .sp-cv.unread .sp-cv__subj { font-weight: 700; }
.sp-cv__main { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 2px; }
.sp-cv__top { display: flex; justify-content: space-between; gap: 8px; }
.sp-cv__name { font-size: 13.5px; font-weight: 600; color: #1e293b; }
.sp-cv__t { font-size: 11px; color: #94a3b8; flex: 0 0 auto; }
.sp-cv__subj { font-size: 12.5px; color: #334155; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sp-cv__last { font-size: 12px; color: #94a3b8; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sp-cv__unread { position: absolute; right: 12px; bottom: 11px; background: var(--product-accent, #6264a7); color: #fff; font-size: 10px; font-weight: 700; min-width: 18px; height: 18px; border-radius: 9px; display: grid; place-items: center; padding: 0 5px; }
.sp-comms-pane { padding: 16px 18px; display: flex; flex-direction: column; min-width: 0; }
.sp-thread-head { display: flex; align-items: center; gap: 10px; padding-bottom: 12px; border-bottom: 1px solid #eef2f7; margin-bottom: 12px; }
.sp-thread-pres { font-size: 11.5px; color: #64748b; display: flex; align-items: center; gap: 6px; }
.sp-thread { flex: 1; display: flex; flex-direction: column; gap: 8px; overflow-y: auto; max-height: 380px; }
.sp-msg { max-width: 78%; align-self: flex-start; }
.sp-msg.me { align-self: flex-end; text-align: right; }
.sp-msg__b { background: #f1f5f9; padding: 8px 12px; border-radius: 12px; font-size: 13px; color: #1e293b; display: inline-block; text-align: left; }
.sp-msg.me .sp-msg__b { background: color-mix(in srgb, var(--product-accent, #6264a7) 14%, white); }
.sp-msg__t { font-size: 10.5px; color: #94a3b8; margin-top: 3px; }
.sp-compose { display: flex; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid #eef2f7; }
.sp-compose input { flex: 1; border: 1px solid #cbd5e0; border-radius: 8px; padding: 9px 12px; font: inherit; font-size: 13px; outline: 0; }
.sp-compose input:focus { border-color: var(--product-accent, #6264a7); }
.sp-mail__subj { font-size: 17px; font-weight: 700; color: #1e293b; }
.sp-mail__meta { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: #64748b; margin: 8px 0 14px; }
.sp-mail__body { font-size: 13.5px; color: #334155; line-height: 1.6; }
@media (max-width: 820px) {
  .sp-comms { grid-template-columns: 1fr; }
  .sp-comms-list { max-height: 240px; border-right: 0; border-bottom: 1px solid #eef2f7; }
}

/* ── Convidados + RSVP (detalhe do evento na agenda) ─────────────────────── */
.sp-att { margin: 10px 0; padding: 10px; border: 1px solid #eef2f7; border-radius: 10px; background: #f8fafc; }
.sp-att-list { display: flex; flex-direction: column; gap: 6px; margin: 6px 0; }
.sp-att-row { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.sp-att-mail { flex: 1; color: #334155; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sp-att-dot { width: 9px; height: 9px; border-radius: 50%; background: #cbd5e0; flex: 0 0 auto; }
.sp-att-st { font-size: 11px; font-weight: 700; padding: 1px 8px; border-radius: 999px; }
.rsvp-accepted { background: #16a34a; } .sp-att-st.rsvp-accepted { background: #dcfce7; color: #166534; }
.rsvp-declined { background: #dc2626; } .sp-att-st.rsvp-declined { background: #fee2e2; color: #991b1b; }
.rsvp-tentative { background: #d97706; } .sp-att-st.rsvp-tentative { background: #fef3c7; color: #92400e; }
.rsvp-needsAction { background: #94a3b8; } .sp-att-st.rsvp-needsAction { background: #f1f5f9; color: #475569; }
.sp-rsvp-ctrl { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 8px; padding-top: 8px; border-top: 1px solid #eef2f7; }

/* ── Scheduling Assistant ("Encontrar horário") ──────────────────────────── */
.sched-grid { display: grid; grid-template-columns: 280px 1fr; gap: 16px; align-items: start; }
.sched-people, .sched-main { border: 1px solid #eef2f7; border-radius: 12px; padding: 14px; background: #fff; }
.sched-people-list { display: flex; flex-direction: column; gap: 4px; max-height: 460px; overflow: auto; }
.sched-person { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 8px; align-items: center; padding: 7px 8px; border-radius: 8px; cursor: pointer; }
.sched-person:hover { background: #f8fafc; }
.sched-person.on { background: color-mix(in srgb, var(--product-accent, #6264a7) 8%, white); }
.sched-person input { grid-row: 1 / span 2; }
.sched-person-name { font-size: 13px; font-weight: 600; color: #1e293b; }
.sched-person-mail { grid-column: 2; font-size: 11px; color: #94a3b8; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Chips de participantes (picker compartilhado) — avatar de iniciais + nome + e-mail, na cor do produto.
   Convidado externo (por e-mail) = avatar "@" neutro + contorno tracejado. */
.pp-picked, .sched-picked { display: flex; flex-wrap: wrap; gap: 6px; }
.pp-picked:empty, .sched-picked:empty { display: none; }
.pp-chip { display: inline-flex; align-items: center; gap: 8px; max-width: 260px; padding: 3px 6px 3px 3px;
  border-radius: 999px; background: color-mix(in srgb, var(--product-accent, #6264a7) 7%, white);
  border: 1px solid color-mix(in srgb, var(--product-accent, #6264a7) 22%, #e2e8f0);
  font-size: 12.5px; color: #1e293b; transition: border-color .12s, background .12s; }
.pp-chip:hover { border-color: color-mix(in srgb, var(--product-accent, #6264a7) 45%, #e2e8f0); }
.pp-chip__av { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px;
  border-radius: 50%; flex: 0 0 auto; background: var(--product-accent, #6264a7); color: #fff;
  font-size: 10px; font-weight: 700; letter-spacing: .3px; }
.pp-chip__txt { display: flex; flex-direction: column; line-height: 1.15; overflow: hidden; }
.pp-chip__name { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pp-chip__mail { font-size: 10.5px; color: #94a3b8; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pp-chip__x { border: none; background: transparent; color: #94a3b8; cursor: pointer; font-size: 12px; line-height: 1;
  width: 20px; height: 20px; border-radius: 50%; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; }
.pp-chip__x:hover { background: color-mix(in srgb, var(--product-accent, #6264a7) 14%, white); color: #475569; }
.pp-chip--guest { border-style: dashed; background: #f8fafc; }
.pp-chip--guest .pp-chip__av { background: #64748b; }

/* Realce da busca de Pessoas: nome em cinza escuro, letras casadas em negrito. */
.pp-name { color: #374151; }
.pp-hl { color: #0f172a; font-weight: 700; }

.sched-controls { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.sched-controls .field { display: flex; flex-direction: column; gap: 4px; }
.sched-controls label { font-size: 11px; font-weight: 600; color: #64748b; }
.sched-controls input, .sched-controls select { border: 1px solid #cbd5e0; border-radius: 8px; padding: 8px 10px; font: inherit; font-size: 13px; }
/* "Buscar horários": alinhado à BASE dos campos (não estica 100% da altura do flex). */
.sched-controls #sa-go { align-self: flex-end; white-space: nowrap; flex: 0 0 auto; }
@media (max-width: 560px) { .sched-controls #sa-go { width: 100%; } }
.sched-slots { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; margin-top: 8px; }
.sched-slot { display: flex; flex-direction: column; gap: 2px; align-items: flex-start; border: 1px solid color-mix(in srgb, var(--product-accent, #6264a7) 30%, white); background: color-mix(in srgb, var(--product-accent, #6264a7) 6%, white); border-radius: 10px; padding: 9px 12px; cursor: pointer; text-align: left; }
.sched-slot:hover { background: color-mix(in srgb, var(--product-accent, #6264a7) 14%, white); }
.sched-slot-when { font-size: 13px; font-weight: 600; color: #1e293b; }
.sched-slot-dur { font-size: 11px; color: #16a34a; font-weight: 600; }
.sched-busy-list { display: flex; flex-direction: column; gap: 6px; margin-top: 6px; }
.sched-busy { border: 1px solid #eef2f7; border-radius: 8px; padding: 8px 10px; }
.sched-busy summary { cursor: pointer; font-size: 13px; font-weight: 600; color: #334155; }
.sched-busy-row { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: #475569; padding: 3px 0 3px 18px; }
@media (max-width: 820px) { .sched-grid { grid-template-columns: 1fr; } }

/* Barra de filtros do mailbox (busca + escopo Minhas/Recebidas/Todas) — vale p/ todas as caixas/apps */
.mbx-filters { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 2px 12px; }
.mbx-search { flex: 1 1 220px; min-width: 160px; max-width: 360px; padding: 8px 12px; font-size: 13px;
  border: 1px solid #e2e8f0; border-radius: 8px; background: #fff; color: #1f2937; }
.mbx-search:focus { outline: none; border-color: var(--product-accent, #2563eb); }
.mbx-scope { display: inline-flex; border: 1px solid #e2e8f0; border-radius: 8px; overflow: hidden; }
.mbx-scope-btn { padding: 7px 14px; font-size: 12.5px; font-weight: 600; border: 0; background: #fff; color: #64748b;
  cursor: pointer; border-left: 1px solid #e2e8f0; transition: background .12s, color .12s; }
.mbx-scope-btn:first-child { border-left: 0; }
.mbx-scope-btn:hover { background: #f1f5f9; }
.mbx-scope-btn.sel { background: var(--product-accent, #2563eb); color: #fff; }
