/* ===================================
   App Pessoal - Estilos Customizados
   =================================== */

/* Tabela - borda esquerda colorida por grupo */
.table tr[style*="border-left"] {
  transition: background-color 0.15s ease;
}

/* Cards resumo - ícone */
.small-box-icon {
  font-size: 4rem;
  position: absolute;
  right: 15px;
  top: 10px;
  opacity: 0.2;
}

/* Badge de grupo com sombra sutil */
.badge[style*="background-color"] {
  text-shadow: 0 1px 1px rgba(0,0,0,0.2);
}

/* Formulário - campo de moeda */
.currency-input {
  font-weight: bold;
  font-size: 1.1em;
}

/* Footer fixo na parte inferior */
.app-footer {
  font-size: 0.85rem;
}

/* Accordion do acerto mensal */
.accordion-button:not(.collapsed) {
  font-weight: bold;
}

/* Preview box no form de centro de custo */
#preview-box {
  background-color: var(--bs-tertiary-bg);
  min-height: 60px;
  display: flex;
  align-items: center;
}

/* Alert do acerto - destaque */
.alert .fs-3 {
  display: inline-block;
  margin: 0 0.25rem;
}

/* Totais no rodapé da tabela */
.table tfoot td {
  border-top: 2px solid var(--bs-border-color);
}

/* ===================================
   Drop Zone - Extração Inteligente
   =================================== */

#drop-zone {
  min-height: 120px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-color: var(--bs-border-color) !important;
  transition: all 0.2s ease;
}

#drop-zone:hover:not(.processing) {
  border-color: var(--bs-info) !important;
  background-color: rgba(var(--bs-info-rgb), 0.05);
}

#drop-zone.processing {
  cursor: wait;
  opacity: 0.8;
}

/* Badge de IA nos labels */
.ai-badge {
  vertical-align: middle;
  animation: fadeIn 0.3s ease;
}

/* Campo preenchido pela IA */
.border-info.border-2 {
  box-shadow: 0 0 0 0.15rem rgba(var(--bs-info-rgb), 0.25);
}

@keyframes fadeIn {
  from { opacity: 0; transform: scale(0.8); }
  to { opacity: 1; transform: scale(1); }
}

/* Responsivo - esconde colunas em mobile */
@media (max-width: 768px) {
  .table .d-md-none-custom {
    display: none;
  }
}