/* Vendas > Opções auxiliares > Situações. Medidas e cores lidas da captura situacoes-vendas
   (2880x1800, escala 2 de 1440x900). Tudo preso a .situations-page para não vazar para outras telas. */

#page-title .situation-icon { width: 24px; height: 24px; fill: currentColor; vertical-align: -4px; }

.situation-icon { width: 16px; height: 16px; fill: currentColor; flex: none; }

.situations-page { font-family: 'Source Sans Pro', system-ui, sans-serif; color: #222529; gap: 16px; }

.situations-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }

.situations-add {
  display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 12px;
  border: 1px solid #4aa361; border-radius: 4px; background: #4aa361; color: #fff;
  font-size: 15px; text-decoration: none;
}
.situations-add:hover { background: #3f9256; border-color: #3f9256; }
.situations-add .situation-icon { width: 15px; height: 15px; }

.situations-search { display: flex; width: min(100%, 460px); }
.situations-search input {
  flex: 1; min-width: 0; height: 36px; padding: 0 12px; border: 1px solid #cfd4d9; border-right: 0;
  border-radius: 4px 0 0 4px; background: #fff; color: #222529; font-size: 15px;
}
.situations-search-button {
  display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 36px;
  border: 1px solid #0f1b24; border-radius: 0 4px 4px 0; background: #0f1b24; color: #fff; cursor: pointer;
}

.situations-info {
  display: flex; align-items: flex-start; gap: 16px; padding: 12px 26px 12px 30px;
  border: 1px solid #d9dee2; border-radius: 6px; background: #f8f8f8; color: #222529;
}
.situations-info-icon {
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  width: 32px; height: 32px; margin-top: 3px; border-radius: 50%; background: #0f1b24; color: #fff;
}
.situations-info > div { flex: 1; min-width: 0; }
.situations-info strong { display: block; font-size: 13px; line-height: 21px; font-weight: 700; }
.situations-info p { margin: 0; font-size: 13px; line-height: 21px; }
.situations-info-more {
  padding: 0; border: 0; background: none; color: #222529; font: inherit; font-weight: 700;
  text-decoration: underline; cursor: pointer;
}
.situations-info-more:disabled { cursor: default; }
.situations-info-close {
  display: inline-flex; padding: 2px; border: 0; background: none; color: #222529; cursor: pointer;
}
.situations-info-close .situation-icon { width: 14px; height: 14px; }

.situations-table-wrap { border: 1px solid #d9dee2; border-radius: 6px; background: #fff; overflow-x: auto; }
.situations-table { width: 100%; min-width: 760px; border-collapse: collapse; table-layout: fixed; }
.situations-table th {
  height: 46px; padding: 0 12px; border-bottom: 1px solid #d9dee2; background: #f6f6f6;
  color: #222529; font-size: 15px; font-weight: 600; text-align: left;
}
.situations-table th:nth-child(1) { width: 29%; }
.situations-table th:nth-child(2) { width: 13%; }
.situations-table th:nth-child(3) { width: 26%; }
.situations-table th:nth-child(4) { width: 11%; }
.situations-table th:nth-child(5) { width: 11%; }
.situations-table th:nth-child(6) { width: 10%; text-align: center; }
.situations-table td {
  height: 53px; padding: 0 12px; border-bottom: 1px solid #d9dee2; color: #222529; font-size: 15px; vertical-align: middle;
}
.situations-table th + th, .situations-table td + td { border-left: 1px solid #d9dee2; }
.situations-table tbody tr:last-child td { border-bottom: 0; }
.situations-table tbody tr:nth-child(even) { background: #f3f3f3; }
.situations-table tbody tr.is-dragging { opacity: .5; }
.situations-table tbody tr.situation-inactive .situation-name-text { color: #6e757c; }

.situation-name { display: flex; align-items: center; gap: 6px; height: 53px; font-weight: 600; }
.situation-handle {
  display: inline-flex; padding: 0; border: 0; background: none; color: #222529; cursor: grab;
}
.situation-handle .situation-icon { width: 14px; height: 14px; }
.situation-handle:disabled { cursor: default; opacity: .5; }
.situation-handle:focus-visible { outline: 2px solid #0f1b24; outline-offset: 1px; }
.situation-name-text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.situation-default {
  padding: 1px 8px; border: 1px solid #dfe2e6; border-radius: 3px; background: #f4f5f6;
  color: #6e757c; font-size: 12px; font-weight: 400;
}

/* Selo de cor: ponto e nome da cor; também usado como Situação na lista e nos detalhes da venda. */
.situation-pill {
  --situation-bg: #f1f1f1; --situation-ink: #5d5d5d; --situation-line: #868686;
  display: inline-flex; align-items: center; gap: 5px; padding: 2px 7px;
  border: 1px solid var(--situation-line); border-radius: 3px; background: var(--situation-bg);
  color: var(--situation-ink); font-size: 12px; font-weight: 700; line-height: 1.35; white-space: nowrap;
}
.situation-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--situation-line); flex: none; }
.situation-color-orange { --situation-bg: #f19e39; --situation-ink: #590500; --situation-line: #d98720; }
.situation-color-orange .situation-dot { background: #590500; }
.situation-color-blue { --situation-bg: #e6eff5; --situation-ink: #2a638e; --situation-line: #528bb8; }
.situation-color-green { --situation-bg: #ebf5e9; --situation-ink: #317024; --situation-line: #5a9b4d; }
.situation-color-red { --situation-bg: #f7e8e7; --situation-ink: #9b302d; --situation-line: #c95c54; }
.situation-color-gray { --situation-bg: #f1f1f1; --situation-ink: #5d5d5d; --situation-line: #868686; }

.situation-flag {
  display: inline-block; padding: 2px 7px; border: 1px solid #73a975; border-radius: 3px;
  background: #e4f2e6; color: #1f7321; font-size: 12px; font-weight: 700; line-height: 1.35;
}

.situation-actions { display: flex; align-items: center; justify-content: center; gap: 4px; height: 53px; }
.situation-action {
  display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px;
  border: 1px solid #d9dee2; border-radius: 4px; background: #f7f8f9; color: #222529; cursor: pointer;
}
.situation-action:hover { background: #eef0f2; }
.situation-action-delete { color: #dc3545; }
.situation-action-delete:disabled { color: #737981; cursor: not-allowed; opacity: .6; }

.situations-count {
  display: inline-flex; align-items: stretch; width: fit-content; margin: 0;
  border: 1px solid #d9dee2; border-radius: 4px; background: #fff; color: #6e757c; font-size: 13px; line-height: 17px;
}
.situations-count span { padding: 7px 10px; background: #f6f6f6; border-right: 1px solid #d9dee2; }
.situations-count strong { padding: 7px 4px 7px 10px; color: #222529; font-weight: 600; }

.situations-form { max-width: 1100px; }
.situations-form .field.situation-pending select { background: #eaecef; cursor: not-allowed; }
.situations-form .form-actions { display: flex; gap: 8px; }

/* Situação nos detalhes da venda. */
.situation-detail { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.situation-detail-change { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.situation-detail-select { min-width: 220px; }
.sales-list .situation-pill, .data-table .situation-pill { vertical-align: middle; }

/* Orçamentos > Situações e Ordens de serviços > Situações (capturas situacoes-orcamentos e
   situacoes-ordens). Mesma tela das situações de vendas, com outras colunas. As cores novas
   (Amarelo, Marrom, Roxo e Púrpura) foram estimadas a olho das capturas, não amostradas. */
.situations-extra-table th:nth-child(n) { width: auto; }
.situations-extra-table .situation-extra-actions-head { text-align: center; }
/* As células da lista são <td>: com display:flex elas saíam da tabela e cada linha virava dois blocos empilhados.
   Voltam a ser células de tabela; o alinhamento interno fica por conta de inline-flex nos filhos. */
.situations-extra-table td.situation-name,
.situations-extra-table td.situation-actions { display: table-cell; vertical-align: middle; height: 53px; }
.situations-extra-table td.situation-actions { text-align: center; white-space: nowrap; }
.situations-extra-table td.situation-actions .situation-action { margin: 0 2px; vertical-align: middle; }
.situations-extra-table td.situation-name > * { vertical-align: middle; }
.situations-extra-table td.situation-name .situation-handle { margin-right: 8px; }
.situations-extra-table td.situation-name .situation-name-text { display: inline-block; max-width: calc(100% - 90px); margin-right: 6px; }
.situations-extra-table td.situation-name .situation-default { margin-left: 2px; }
.situations-extra-quote, .situations-extra-channel { min-width: 560px; }
.situation-flag-muted { border-color: #dfe2e6; background: #f4f5f6; color: #6e757c; }
.situation-color-yellow { --situation-bg: #f6b73c; --situation-ink: #3d2a00; --situation-line: #c98a12; }
.situation-color-yellow .situation-dot { background: #3d2a00; }
.situation-color-brown { --situation-bg: #f3d9a4; --situation-ink: #5a3200; --situation-line: #b87a2b; }
.situation-color-indigo { --situation-bg: #e8e4f5; --situation-ink: #2a1a6e; --situation-line: #3b2a86; }
.situation-color-purple { --situation-bg: #f7e3ee; --situation-ink: #7a1442; --situation-line: #b5476f; }
.situation-detail-bar { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 12px; padding: 4px 0; }

/* Linhas de 53 px como no original: o bloco interno de 53 px mais a borda fazia 54 px. */
.situations-table td > .situation-name, .situations-table td > .situation-actions { height: 52px; }
.situations-count { line-height: 15px; }
.situations-count span { padding: 7px 11px; }
.situations-count strong { padding: 7px 4px 7px 12px; }
