/* ===========================================================================
   Camada 28 — modais do Kanban da Regulação.
   Motivo: 14-kanban-ubs-agenda.css fixa `#reg-modal .modal-box` em 780px com
   !important no desktop. Comentários e Histórico precisam de mais espaço (grade
   de agenda tem 5 colunas), então a variante larga sobrescreve só esses dois.
   No celular vale a folha de tela cheia do 00-mobile-foundation/kanban-v2.
   =========================================================================== */
@media (min-width: 769px) {
  #reg-modal .modal-box.reg-modal-wide,
  #reg-modal .reg-modal-box.reg-modal-wide {
    max-width: min(var(--modal-w, 1180px), 96vw) !important;
    width: 96% !important;
  }
}


/* ───────── Sino flutuante de tarefas: cor por tipo de aviso ─────────
   Agenda, comentário, tratativa e anexo chegam no mesmo lugar; sem cor viram
   uma lista cinza onde tudo parece igual. A cor fica na barra lateral e na
   etiqueta — nunca sozinha: a etiqueta escrita carrega o mesmo significado. */
.task-notification-row{ position:relative; display:flex; align-items:stretch; gap:0 }
.task-notification-row .task-notification-item{ flex:1; min-width:0; border-left:3px solid var(--tn-cor, #667085) }
.task-notification-row .tn-tag{
  display:inline-block; font-size:10px; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; color:var(--tn-cor, #667085);
  background:var(--tn-fundo, rgba(102,112,133,.12));
  padding:1px 7px; border-radius:999px; margin-bottom:3px;
}
.task-notification-row .task-notification-dot{ background:var(--tn-cor, #667085) }
.task-notification-row .tn-del{
  flex:0 0 auto; width:30px; border:0; background:transparent; cursor:pointer;
  color:#98a2b3; font-size:17px; line-height:1; border-radius:8px;
}
.task-notification-row .tn-del:hover{ background:rgba(208,59,59,.12); color:#d03b3b }

.task-notification-row.tn-agenda    { --tn-cor:#2a78d6; --tn-fundo:rgba(42,120,214,.14) }
.task-notification-row.tn-comentario{ --tn-cor:#6f1d7a; --tn-fundo:rgba(111,29,122,.14) }
.task-notification-row.tn-tratativa { --tn-cor:#0a7a0a; --tn-fundo:rgba(12,163,12,.14) }
.task-notification-row.tn-anexo     { --tn-cor:#a86a12; --tn-fundo:rgba(199,122,18,.16) }
.task-notification-row.tn-tarefa    { --tn-cor:#667085; --tn-fundo:rgba(102,112,133,.12) }