/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */
/* Adicione no final do arquivo */

/* Estilos para scroll de tabelas responsivas */
.table-responsive-scroll {
  -webkit-overflow-scrolling: touch;
}

.table-responsive-scroll::-webkit-scrollbar {
  height: 8px;
}

.table-responsive-scroll::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 4px;
}

.table-responsive-scroll::-webkit-scrollbar-thumb {
  background: #c1c1c1;
  border-radius: 4px;
}

.table-responsive-scroll::-webkit-scrollbar-thumb:hover {
  background: #a8a8a8;
}

/* Para garantir que a tabela tenha largura mínima em mobile */
@media (max-width: 768px) {
  .table-responsive-scroll table {
    min-width: 1024px;
  }
}

/* Indicador visual de que há mais conteúdo para rolar */
.table-container {
  position: relative;
}

.table-container::after {
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 40px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.8));
  pointer-events: none;
  z-index: 10;
}

/* Container */
.select2-container {
  width: 100% !important;
  font-size: 0.875rem; /* text-sm */
}

/* Caixa principal */
.select2-container--default .select2-selection--single {
  height: 48px;
  border-radius: 0.75rem; /* rounded-xl */
  border: 1px solid #d1d5db; /* gray-300 */
  padding: 0 12px;
  display: flex;
  align-items: center;
  background-color: #fff;
  transition: border-color .15s, box-shadow .15s;
}

/* Texto selecionado */
.select2-selection__rendered {
  padding: 0 !important;
  color: #111827; /* gray-900 */
  line-height: normal !important;
}

/* Placeholder */
.select2-container--default .select2-selection__placeholder {
  color: #9ca3af; /* gray-400 */
}

/* Ícone da seta */
.select2-selection__arrow {
  height: 100% !important;
}

/* Hover */
.select2-container--default .select2-selection--single:hover {
  border-color: #9ca3af; /* gray-400 */
}

/* Focus (igual Tailwind) */
.select2-container--open .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--single {
  border-color: #3b82f6; /* blue-500 */
  box-shadow: 0 0 0 2px rgba(59,130,246,.25);
}

/* Dropdown */
.select2-dropdown {
  border-radius: 0.75rem;
  border: 1px solid #e5e7eb;
  box-shadow: 0 10px 25px rgba(0,0,0,.08);
  margin-top: 6px;
}

/* Opções */
.select2-results__option {
  padding: 10px 14px;
  font-size: 0.875rem;
}

/* Hover opção */
.select2-results__option--highlighted {
  background-color: #fe6e00 !important; /* blue-50 */
  color: #1e40af; /* blue-800 */
}

/* Opção selecionada */
.select2-results__option--selected {
  background-color: #dbeafe !important; /* blue-100 */
  color: #1e40af;
}

/* Botão limpar */
.select2-selection__clear {
  color: #9ca3af;
  margin-right: 6px;
}
