/* SmartTask - estilos (popups + páginas do módulo) */

/* ---------- Container dos popups ---------- */
.st-container { position: fixed; z-index: 100050; display: flex; flex-direction: column; gap: 10px; pointer-events: none; max-width: calc(100vw - 24px); font-family: inherit; }
.st-container > * { pointer-events: auto; }
.st-cards { display: flex; flex-direction: column; gap: 10px; }
.st-pos-tr { top: 70px; right: 16px; align-items: flex-end; }
.st-pos-tl { top: 70px; left: 16px; align-items: flex-start; }
.st-pos-br { bottom: 16px; right: 16px; align-items: flex-end; flex-direction: column-reverse; }
.st-pos-br .st-cards { flex-direction: column-reverse; }
.st-pos-bl { bottom: 16px; left: 16px; align-items: flex-start; flex-direction: column-reverse; }
.st-pos-bl .st-cards { flex-direction: column-reverse; }
.st-pos-tc { top: 70px; left: 50%; transform: translateX(-50%); align-items: center; }
.st-pos-bc { bottom: 16px; left: 50%; transform: translateX(-50%); align-items: center; flex-direction: column-reverse; }
.st-pos-bc .st-cards { flex-direction: column-reverse; }
.st-pos-center { top: 50%; left: 50%; transform: translate(-50%, -50%); align-items: center; }
.st-pos-center.st-has-cards::before { content: ""; position: fixed; left: -100vw; top: -100vh; width: 300vw; height: 300vh; background: rgba(15, 23, 42, .35); z-index: -1; pointer-events: auto; }
.st-pos-topbar { top: 0; left: 0; right: 0; max-width: none; align-items: stretch; gap: 0; }
.st-pos-topbar .st-cards { gap: 0; }
.st-pos-topbar .st-card { width: auto; max-width: none; border-radius: 0; display: flex; align-items: center; flex-wrap: wrap; padding: 6px 12px; gap: 10px; }
.st-pos-topbar .st-head { border: 0; padding: 0; background: transparent !important; color: inherit !important; }
.st-pos-topbar .st-body { padding: 0; flex: 1; }
.st-pos-topbar .st-avs img, .st-pos-topbar .st-avs .st-av { width: 32px !important; height: 32px !important; line-height: 32px !important; }
.st-pos-topbar .st-actions { border: 0; padding: 0; }

/* ---------- Card ---------- */
.st-card { width: 380px; max-width: calc(100vw - 24px); background: #fff; color: #1f2937; border-radius: 14px; box-shadow: 0 12px 32px rgba(15, 23, 42, .22), 0 2px 6px rgba(15, 23, 42, .12); overflow: hidden; border-left: 5px solid #2563eb; opacity: 0; transform: translateY(8px) scale(.98); transition: opacity .22s ease, transform .22s ease; position: relative; font-size: 13px; text-align: left; }
.st-card.st-in { opacity: 1; transform: none; }
.st-card.st-out { opacity: 0; transform: translateY(6px) scale(.97); }
.st-head { display: flex; align-items: center; gap: 8px; padding: 9px 12px; font-weight: 600; font-size: 13px; background: #eff6ff; color: #1e3a8a; }
.st-icon { font-size: 16px; line-height: 1; }
.st-htitle { flex: 1; }
.st-x { border: 0; background: transparent; font-size: 20px; line-height: 1; cursor: pointer; color: inherit; opacity: .6; padding: 0 2px; }
.st-x:hover { opacity: 1; }
.st-body { display: flex; gap: 12px; padding: 12px; align-items: flex-start; }
.st-info { flex: 1; min-width: 0; }
.st-title { display: block; font-weight: 700; font-size: 14px; color: #111827 !important; text-decoration: none; line-height: 1.3; word-wrap: break-word; }
.st-title:hover { text-decoration: underline; }
.st-ref { display: inline-block; font-weight: 600; font-size: 11px; color: #6b7280; background: #f3f4f6; border-radius: 4px; padding: 0 5px; margin-right: 3px; }
.st-msg { margin-top: 4px; color: #374151; }
.st-meta { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; color: #4b5563; font-size: 12px; }
.st-dl i { font-style: normal; color: #6b7280; }
.st-dl-over, .st-dl-over i { color: #b91c1c; }
.st-pchip { font-size: 11px; font-weight: 700; border-radius: 10px; padding: 1px 7px; }
.st-pchip-2 { background: #fef3c7; color: #92400e; }
.st-pchip-3 { background: #fee2e2; color: #991b1b; }
.st-ext { margin-top: 6px; display: flex; align-items: center; gap: 5px; color: #4b5563; font-size: 12px; flex-wrap: wrap; }
.st-ext .st-av { border-width: 1px; }

/* Avatares */
.st-av { border-radius: 50%; object-fit: cover; border: 2px solid #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .25); display: inline-block; vertical-align: middle; text-align: center; color: #fff; font-weight: 700; box-sizing: border-box; flex-shrink: 0; }
.st-av-ini { font-family: inherit; }
.st-avs { display: flex; align-items: center; flex-shrink: 0; }
.st-avs-two .st-av:last-child { margin-left: -4px; }
.st-avs-arrow { color: #9ca3af; font-size: 14px; margin: 0 1px; z-index: 1; }

/* Botões */
.st-actions { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 12px 12px; align-items: center; }
.st-btn { border: 1px solid #d1d5db; background: #fff; color: #1f2937 !important; border-radius: 8px; padding: 5px 10px; font-size: 12px; font-weight: 600; cursor: pointer; text-decoration: none !important; line-height: 1.3; display: inline-block; }
.st-btn:hover { background: #f3f4f6; }
.st-btn:disabled { opacity: .5; cursor: wait; }
.st-btn-start { background: #2563eb; border-color: #2563eb; color: #fff !important; }
.st-btn-start:hover { background: #1d4ed8; }
.st-btn-done { background: #16a34a; border-color: #16a34a; color: #fff !important; }
.st-btn-done:hover { background: #15803d; }
.st-btn-pause { background: #f59e0b; border-color: #f59e0b; color: #fff !important; }
.st-btn-open { margin-left: auto; }
.st-snz { position: relative; display: inline-block; }
.st-snz-menu { display: none; position: absolute; bottom: 100%; left: 0; margin-bottom: 4px; background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; box-shadow: 0 8px 20px rgba(0, 0, 0, .15); min-width: 150px; z-index: 5; overflow: hidden; }
.st-pos-tr .st-snz-menu, .st-pos-tl .st-snz-menu, .st-pos-tc .st-snz-menu, .st-pos-topbar .st-snz-menu { bottom: auto; top: 100%; margin: 4px 0 0; }
.st-snz.st-open .st-snz-menu { display: block; }
.st-snz-menu a { display: block; padding: 7px 12px; color: #1f2937 !important; text-decoration: none; font-size: 12px; }
.st-snz-menu a:hover { background: #eff6ff; }
.st-toast { font-weight: 700; color: #15803d; padding: 4px 0; }

/* Barra de tempo do auto-fechar */
.st-progress { height: 3px; background: #e5e7eb; }
.st-progress span { display: block; height: 100%; background: #2563eb; width: 100%; transform-origin: left; animation-name: st-shrink; animation-timing-function: linear; animation-fill-mode: forwards; }
.st-card.st-hover .st-progress span { animation-play-state: paused; }
@keyframes st-shrink { from { transform: scaleX(1); } to { transform: scaleX(0); } }

/* Cores por tipo */
.st-type-before { border-left-color: #f59e0b; }
.st-type-before .st-head { background: #fffbeb; color: #92400e; }
.st-type-due, .st-type-overdue { border-left-color: #dc2626; }
.st-type-due .st-head, .st-type-overdue .st-head { background: #fef2f2; color: #991b1b; }
.st-type-overdue { animation: st-pulse 1.8s ease-in-out 2; }
.st-type-escalate { border-left-color: #7c3aed; }
.st-type-escalate .st-head { background: #f5f3ff; color: #5b21b6; }
.st-type-done { border-left-color: #16a34a; }
.st-type-done .st-head { background: #f0fdf4; color: #166534; }
.st-type-cancel { border-left-color: #6b7280; }
.st-type-cancel .st-head { background: #f3f4f6; color: #374151; }
.st-type-start { border-left-color: #0891b2; }
.st-type-start .st-head { background: #ecfeff; color: #155e75; }
@keyframes st-pulse { 0%, 100% { box-shadow: 0 12px 32px rgba(15, 23, 42, .22); } 50% { box-shadow: 0 0 0 6px rgba(220, 38, 38, .25), 0 12px 32px rgba(15, 23, 42, .22); } }

/* "+N avisos" */
.st-more { background: #1f2937; color: #fff; border-radius: 20px; padding: 5px 12px; font-size: 12px; box-shadow: 0 4px 12px rgba(0, 0, 0, .2); }
.st-more a { color: #93c5fd !important; margin-left: 6px; }

/* Selo flutuante */
.st-badge-float { position: fixed; bottom: 14px; z-index: 100040; display: inline-flex; gap: 8px; align-items: center; background: #1e293b; color: #fff !important; text-decoration: none !important; border-radius: 22px; padding: 6px 12px; font-size: 12px; font-weight: 600; box-shadow: 0 6px 16px rgba(0, 0, 0, .25); opacity: .92; }
.st-badge-float:hover { opacity: 1; }
.st-b-over { color: #fca5a5; }
.st-b-run { color: #86efac; font-variant-numeric: tabular-nums; }
.st-b-run small { color: #cbd5e1; font-weight: 400; }

/* Tema escuro */
.st-dark .st-card { background: #1f2937; color: #e5e7eb; }
.st-dark .st-title { color: #f9fafb !important; }
.st-dark .st-msg, .st-dark .st-meta, .st-dark .st-ext { color: #d1d5db; }
.st-dark .st-ref { background: #374151; color: #d1d5db; }
.st-dark .st-btn { background: #374151; border-color: #4b5563; color: #f3f4f6 !important; }
.st-dark .st-av { border-color: #1f2937; }
.st-dark .st-head { filter: brightness(.92); }

@media (max-width: 600px) {
	.st-card { width: calc(100vw - 24px); }
	.st-pos-tl, .st-pos-tr, .st-pos-tc { top: 56px; }
}
@media print { .st-container { display: none !important; } }

/* ---------- Páginas do módulo ---------- */
.st-badge { display: inline-block; font-size: 11px; font-weight: 700; border-radius: 10px; padding: 2px 8px; white-space: nowrap; }
.st-prio-b0 { background: #f1f5f9; color: #475569; }
.st-prio-b1 { background: #e0f2fe; color: #075985; }
.st-prio-b2 { background: #fef3c7; color: #92400e; }
.st-prio-b3 { background: #fee2e2; color: #991b1b; }
.st-st-b0 { background: #f1f5f9; color: #334155; }
.st-st-b1 { background: #dbeafe; color: #1e40af; }
.st-st-b2 { background: #fef9c3; color: #854d0e; }
.st-st-b3 { background: #dcfce7; color: #166534; }
.st-st-b9 { background: #e5e7eb; color: #4b5563; text-decoration: line-through; }
.st-overdue-b { background: #dc2626; color: #fff; }
.st-link .st-ico { margin-right: 4px; color: #6366f1; }
.st-people { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.st-people .st-av { width: 26px; height: 26px; line-height: 26px; font-size: 10px; }
.st-dl-over-txt { color: #b91c1c; font-weight: 700; }
.st-dl-soon-txt { color: #b45309; font-weight: 700; }
.st-bar { background: #e5e7eb; border-radius: 6px; height: 7px; overflow: hidden; min-width: 60px; }
.st-bar span { display: block; height: 100%; background: #22c55e; }
.st-bar.st-bar-over span { background: #ef4444; }

/* Dashboard */
.st-kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; margin: 10px 0 20px; }
.st-kpi { background: var(--colorbacklineimpair1, #fff); border: 1px solid #e5e7eb; border-radius: 12px; padding: 14px 16px; text-decoration: none !important; color: inherit !important; display: block; }
.st-kpi:hover { border-color: #93c5fd; }
.st-kpi .st-kpi-n { font-size: 28px; font-weight: 800; line-height: 1.1; }
.st-kpi .st-kpi-l { color: #6b7280; font-size: 12px; margin-top: 2px; }
.st-kpi.st-kpi-red .st-kpi-n { color: #dc2626; }
.st-kpi.st-kpi-green .st-kpi-n { color: #16a34a; }
.st-kpi.st-kpi-blue .st-kpi-n { color: #2563eb; }
.st-kpi.st-kpi-amber .st-kpi-n { color: #d97706; }
.st-focus { display: flex; flex-direction: column; gap: 8px; }
.st-focus-item { display: flex; align-items: center; gap: 10px; border: 1px solid #e5e7eb; border-radius: 10px; padding: 8px 12px; background: var(--colorbacklineimpair1, #fff); }
.st-focus-item .st-fi-main { flex: 1; min-width: 0; }
.st-focus-item .st-fi-sub { color: #6b7280; font-size: 12px; }
.st-focus-rank { font-weight: 800; color: #9ca3af; width: 20px; text-align: center; }

/* Kanban */
.st-kanban { display: grid; grid-template-columns: repeat(4, minmax(220px, 1fr)); gap: 12px; overflow-x: auto; padding-bottom: 8px; }
.st-col { background: #f1f5f9; border-radius: 12px; padding: 8px; min-height: 200px; }
.st-col.st-drop { outline: 2px dashed #3b82f6; background: #eff6ff; }
.st-col-h { font-weight: 700; padding: 4px 6px 8px; display: flex; justify-content: space-between; }
.st-kcard { background: #fff; border-radius: 10px; padding: 9px 10px; margin-bottom: 8px; box-shadow: 0 1px 3px rgba(0, 0, 0, .12); cursor: grab; border-left: 4px solid #cbd5e1; }
.st-kcard.st-prio-k2 { border-left-color: #f59e0b; }
.st-kcard.st-prio-k3 { border-left-color: #dc2626; }
.st-kcard.st-dragging { opacity: .5; }
.st-kcard .st-k-title { font-weight: 600; color: #111827; text-decoration: none; display: block; margin-bottom: 6px; }
.st-kcard .st-k-foot { display: flex; justify-content: space-between; align-items: center; font-size: 11px; color: #6b7280; gap: 6px; }

/* Ficha */
.st-timer { font-size: 26px; font-weight: 800; font-variant-numeric: tabular-nums; }
.st-timer.st-running { color: #16a34a; }
.st-checklist { list-style: none; padding: 0; margin: 0; }
.st-checklist li { display: flex; align-items: center; gap: 8px; padding: 5px 0; border-bottom: 1px dashed #e5e7eb; }
.st-checklist li.st-chk-done span { text-decoration: line-through; color: #9ca3af; }
.st-checklist .st-chk-del { margin-left: auto; color: #9ca3af; cursor: pointer; }
.st-log { list-style: none; padding: 0; margin: 0; }
.st-log li { display: flex; gap: 10px; padding: 8px 0; border-bottom: 1px solid #f1f5f9; }
.st-log .st-log-body { flex: 1; }
.st-log .st-log-date { color: #9ca3af; font-size: 11px; }
.st-log .st-log-comment { background: #f8fafc; border-radius: 8px; padding: 6px 10px; margin-top: 4px; white-space: pre-wrap; }
.st-hint { margin-top: 6px; font-size: 12px; color: #2563eb; }
.st-hint.st-warn { color: #b91c1c; font-weight: 600; }
.st-hint a { cursor: pointer; text-decoration: underline; }

/* Preferências: seletor visual de posição */
.st-posgrid { display: grid; grid-template-columns: repeat(3, 70px); grid-template-rows: 22px repeat(3, 44px); gap: 6px; background: #e2e8f0; padding: 10px; border-radius: 10px; width: max-content; }
.st-posgrid label { background: #fff; border: 2px solid transparent; border-radius: 6px; display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 11px; color: #475569; text-align: center; }
.st-posgrid label.st-sel { border-color: #2563eb; background: #dbeafe; color: #1e3a8a; font-weight: 700; }
.st-posgrid label input { display: none; }
.st-posgrid .st-pg-topbar { grid-column: 1 / 4; }
.st-posgrid .st-pg-empty { visibility: hidden; }

/* Filtros rápidos */
.st-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 12px; }
.st-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border-radius: 16px; border: 1px solid #d1d5db; background: #fff; color: #374151 !important; font-size: 12.5px; text-decoration: none !important; }
.st-chip:hover { border-color: #93c5fd; background: #eff6ff; }
.st-chip-on { background: #1e3a8a; border-color: #1e3a8a; color: #fff !important; }
.st-chip-n { background: rgba(0, 0, 0, .08); border-radius: 10px; padding: 0 7px; font-weight: 700; font-size: 11px; }
.st-chip-on .st-chip-n { background: rgba(255, 255, 255, .25); }
.st-chip-n.st-chip-red { background: #dc2626; color: #fff; }

.st-badge-right { right: 16px; }
.st-badge-left { left: 16px; }
body.st-has-badge .st-pos-br, body.st-has-badge .st-pos-bl, body.st-has-badge .st-pos-bc { bottom: 58px; }
@media print { .st-badge-float { display: none !important; } }

/* Formulário: campos nunca passam da largura da tela */
.mod-smarttask .tableforfieldcreate { table-layout: fixed; width: 100%; }
.mod-smarttask .tableforfieldcreate td:first-child { width: 190px; }
.mod-smarttask .tableforfieldcreate td { overflow-wrap: anywhere; }
.st-inline { display: flex; align-items: center; gap: 4px; max-width: 540px; width: 100%; }
.st-inline > span:not(.fa):not(.fas):not(.pictofixedwidth), .st-inline #st_contact_wrap { flex: 1; min-width: 0; }
.st-inline select, .st-inline .select2-container { width: 100% !important; max-width: 100% !important; min-width: 0 !important; }
.mod-smarttask .tableforfieldcreate textarea { max-width: 100%; box-sizing: border-box; }
@media (max-width: 700px) { .mod-smarttask .tableforfieldcreate td:first-child { width: 110px; } }

/* Múltiplos alertas por tarefa */
.st-reminder-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:7px;max-width:760px;margin-bottom:7px}
.st-reminder-grid label{display:flex;align-items:center;gap:6px;padding:8px 10px;border:1px solid #dbe4ee;border-radius:8px;background:#fff;cursor:pointer;transition:.15s}
.st-reminder-grid label:hover{border-color:#2563eb;background:#eff6ff}
.st-reminder-grid label:has(input:checked){border-color:#2563eb;background:#eff6ff;color:#1d4ed8;font-weight:600}
.st-reminder-grid input{margin:0}
@media(max-width:600px){.st-reminder-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.st-participant-list{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center}.st-participant-list>span{display:inline-flex;align-items:center;gap:5px}
.st-participant-picker{width:min(100%,780px);border:1px solid #cdd9e7;border-radius:10px;background:#fff;overflow:hidden}.st-participant-toolbar{display:flex;align-items:center;gap:12px;padding:9px 10px;border-bottom:1px solid #e6edf5;background:#f8fafc}.st-participant-toolbar input{flex:1;min-width:180px}.st-participant-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;padding:10px;max-height:310px;overflow:auto}.st-participant-option{display:flex;align-items:center;gap:9px;min-height:46px;padding:7px 9px;border:1px solid #e1e8f0;border-radius:9px;cursor:pointer;background:#fff;transition:.15s}.st-participant-option:hover{border-color:#2563eb;background:#f5f9ff}.st-participant-option:has(input:checked){border-color:#2563eb;background:#eff6ff}.st-participant-option input{flex:0 0 auto;width:17px;height:17px;margin:0}.st-participant-avatar{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:#dbeafe;color:#1d4ed8;font-weight:700}.st-participant-name{display:flex;flex-direction:column;min-width:0;line-height:1.25}.st-participant-name b,.st-participant-name small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.st-participant-name small{color:#667085;margin-top:2px}.st-participant-primary{display:none!important}@media(max-width:720px){.st-participant-grid{grid-template-columns:1fr;max-height:360px}.st-participant-toolbar{align-items:stretch;flex-direction:column;gap:5px}}
.st-os-permission{position:fixed;right:18px;bottom:18px;z-index:100060;max-width:340px;background:#fff;color:#1f2937;border:1px solid #bfdbfe;border-left:5px solid #2563eb;border-radius:12px;box-shadow:0 12px 32px rgba(15,23,42,.22);padding:13px 14px;font-size:13px}.st-os-permission b{display:block;margin-bottom:4px}.st-os-permission button{margin-top:9px;background:#2563eb;color:#fff;border:0;border-radius:7px;padding:7px 12px;cursor:pointer}.st-os-permission .st-os-close{float:right;background:transparent;color:#6b7280;padding:0;margin:0;font-size:18px}
.st-file-input{max-width:520px}.st-attachments-block{margin:18px 0;padding:16px;border:1px solid #dbe4ee;border-radius:12px;background:#fff}.st-upload-form{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:4px 0 14px;padding:11px;background:#f8fafc;border:1px dashed #b9c8dc;border-radius:9px}.st-attachment-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:9px}.st-attachment-card{position:relative;display:flex;align-items:center;border:1px solid #dfe7f0;border-radius:9px;background:#fff;transition:.15s}.st-attachment-card:hover{border-color:#2563eb;box-shadow:0 3px 12px rgba(37,99,235,.1)}.st-attachment-main{display:flex;align-items:center;gap:11px;min-width:0;flex:1;padding:10px 34px 10px 11px;text-decoration:none!important;color:inherit!important}.st-attachment-main>span:last-child{display:flex;flex-direction:column;min-width:0}.st-attachment-main b,.st-attachment-main small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.st-attachment-main small{margin-top:3px;color:#6b7280}.st-attachment-icon{font-size:25px;color:#2563eb}.st-attachment-delete{position:absolute;right:9px;top:50%;transform:translateY(-50%);font-size:22px;color:#94a3b8!important;text-decoration:none!important}.st-attachment-delete:hover{color:#dc2626!important}.st-no-attachments{padding:10px 2px}@media(max-width:600px){.st-upload-form{align-items:stretch;flex-direction:column}.st-upload-form .button{width:100%}}