/* =============================================================================
   deals.css — Overrides do módulo Deals (conv)
   ============================================================================= */

/* Lista de cards */
.deals-list-wrap {
  display: flex;
  flex-direction: column;
  gap: var(--space-small, var(--lv-space-small, 8px));
}

/* Row: botão fase prev + card + botão fase next */
.deals-card-row {
  display: flex;
  align-items: stretch;
  gap: 4px;
}

/* Card de deal */
.deals-card {
  flex: 1;
  min-width: 0;
  background: rgb(var(--card-color, var(--lv-card-color)));
  border-radius: 0.75rem;
  border: 1px solid rgb(var(--border-weak, var(--lv-border-weak)));
  padding: var(--space-slab, var(--lv-space-slab, 12px)) var(--space-normal, var(--lv-space-normal, 16px));
  cursor: pointer;
  transition: box-shadow 150ms ease;
}

.deals-card:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

/* Meta: ícone de tipo + nome pipeline + valor */
.deals-card-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 4px;
}

.deals-card-pipeline-icon {
  display: inline-flex;
  align-items: center;
  color: rgb(var(--slate-9, var(--lv-slate-9)));
  flex-shrink: 0;
}

.deals-card-pipeline {
  font-size: 0.75rem;
  color: rgb(var(--slate-10, var(--lv-slate-10)));
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.deals-card-value {
  font-size: 0.75rem;
  font-weight: 600;
  color: rgb(var(--slate-11, var(--lv-slate-11)));
  flex-shrink: 0;
}

.deals-card-footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 8px;
}

/* Dot amber — rascunho pendente */
.deals-draft-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: rgb(var(--amber-9, var(--lv-amber-9, 255 197 61)));
  vertical-align: middle;
  margin-left: 5px;
  flex-shrink: 0;
}

/* Botões laterais de fase */
.deals-phase-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 44px;
  flex-shrink: 0;
  padding: 8px 0;
  background: none;
  border: 1px solid rgb(var(--border-weak, var(--lv-border-weak)));
  border-radius: 0.5rem;
  color: rgb(var(--slate-9, var(--lv-slate-9)));
  cursor: pointer;
  transition: background 150ms ease, color 150ms ease, border-color 150ms ease;
}

.deals-phase-btn--prev {
  border-left: 3px solid var(--phase-color, rgb(var(--blue-9, var(--lv-blue-9))));
}

.deals-phase-btn--next {
  border-right: 3px solid var(--phase-color, rgb(var(--blue-9, var(--lv-blue-9))));
}

.deals-phase-btn:hover {
  background: color-mix(in srgb, var(--phase-color, rgb(var(--blue-9, var(--lv-blue-9)))) 8%, transparent);
  color: rgb(var(--slate-12, var(--lv-slate-12)));
}

.deals-phase-btn__label {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-size: 0.625rem;
  font-weight: 500;
  color: inherit;
  overflow: hidden;
  text-overflow: ellipsis;
  max-height: 80px;
  white-space: nowrap;
}

/* Placeholder (sem fase anterior/próxima) */
.deals-phase-btn--placeholder {
  width: 44px;
  flex-shrink: 0;
}

/* Indicador SLA sem definição */
.deals-sla-none {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 0.75rem;
  color: rgb(var(--slate-9, var(--lv-slate-9)));
}

.deals-sla-none svg {
  color: rgb(var(--ruby-9, var(--lv-ruby-9)));
  flex-shrink: 0;
}

/* Valor readonly (pipeline em edição) */
.deals-readonly-val {
  font-size: 0.875rem;
  color: rgb(var(--slate-11, var(--lv-slate-11)));
  padding: 0.375rem 0.5rem;
  background: rgba(var(--black-alpha-2, var(--lv-black-alpha-2)));
  border-radius: 0.5rem;
  border: 1px solid rgb(var(--border-weak, var(--lv-border-weak)));
}

/* Campos currency */
.deals-currency-wrap {
  display: flex;
  align-items: center;
}

.deals-currency-prefix {
  font-size: 0.875rem;
  color: rgb(var(--slate-11, var(--lv-slate-11)));
  padding: 0 var(--space-small, var(--lv-space-small, 8px));
  background: rgb(var(--slate-3, var(--lv-slate-3)));
  border: 1px solid rgb(var(--border-weak, var(--lv-border-weak)));
  border-right: none;
  border-radius: 0.5rem 0 0 0.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
}

.deals-currency-input {
  border-radius: 0 0.5rem 0.5rem 0 !important;
  flex: 1;
}

/* Campos dinâmicos vazios */
.deals-fields-empty {
  font-size: 0.8125rem;
  color: rgb(var(--slate-9, var(--lv-slate-9)));
  font-style: italic;
}

/* Banner de erro (campos obrigatórios) */
.deals-error-banner {
  padding: var(--space-small, var(--lv-space-small, 8px)) var(--space-slab, var(--lv-space-slab, 12px));
  background: rgb(var(--ruby-3, var(--lv-ruby-3)));
  color: rgb(var(--ruby-11, var(--lv-ruby-11)));
  border: 1px solid rgb(var(--ruby-6, var(--lv-ruby-6)));
  border-radius: 0.5rem;
  font-size: 0.875rem;
  font-weight: 500;
  margin-bottom: 12px;
}

/* input com erro */
.input--error {
  border-color: rgb(var(--ruby-8, var(--lv-ruby-8))) !important;
  outline-color: rgb(var(--ruby-8, var(--lv-ruby-8)));
}

/* Notas */
.kn-notes {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.kn-notes__input-row {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.kn-notes__textarea {
  height: auto;
  resize: vertical;
  padding: 8px 12px;
}

.kn-notes__submit {
  align-self: flex-end;
}

.kn-notes__feed {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.kn-note {
  padding: 10px 12px;
  background: rgb(var(--slate-2, var(--lv-slate-2)));
  border: 1px solid rgb(var(--slate-4, var(--lv-slate-4)));
  border-radius: 6px;
}

.kn-note__header {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
}

.kn-note__author {
  font-size: 0.8125rem;
  font-weight: 500;
  color: rgb(var(--slate-11, var(--lv-slate-11)));
  flex: 1;
}

.kn-note__date {
  font-size: 0.75rem;
  color: rgb(var(--slate-9, var(--lv-slate-9)));
}

.kn-note__delete {
  flex-shrink: 0;
}

.kn-note__content {
  font-size: 0.875rem;
  color: rgb(var(--slate-12, var(--lv-slate-12)));
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
}