/* Aplica estilo ao navegador Chrome, Edge, Safari */
 .modal-body::-webkit-scrollbar {
  width: 8px;
}

.modal-body::-webkit-scrollbar-track {
  background: #f1f1f1;
}

.modal-body::-webkit-scrollbar-thumb {
  background-color: var(--ct-blue);
  border-radius: 10px;
  border: 2px solid #f1f1f1;
}

/* Aplica estilo ao navegador Firefox */
.modal-body {
  scrollbar-width: thin;
  scrollbar-color: var(--ct-blue) #f1f1f1;
}

.drag-handle {
  cursor: move; /* Mostra o cursor de movimento apenas no handle */
}

.dropdown-menu-logistics {
  background-color: var(--ct-dropdown-bg);
  border-color: var(--ct-dropdown-border-color);
  color: var(--ct-dropdown-color);
  box-shadow: var(--ct-dropdown-box-shadow);
}

.dropdown-menu-logistics li a{
  color: var(--ct-dropdown-link-color) !important;
  transition: all 0.2s ease;
}

.dropdown-menu-logistics li a:hover{
  background-color: var(--ct-dropdown-link-hover-bg) !important;
  color: var(--ct-dropdown-link-hover-color) !important;
}

.dropdown-menu-logistics li a.active,
.dropdown-menu-logistics li a:active {
  background-color: var(--ct-dropdown-link-active-bg) !important;
  color: var(--ct-dropdown-link-active-color) !important;
}

/* Inicialmente escondendo o submenu */
.nav-item.dropdown .dropdown-menu-logistics {
  display: none;
  opacity: 0;
  transform: translateY(-10%);
  transition: all 0.7s ease-in-out;
}

/* Quando o mouse passa por cima do item de menu */
.nav-item.dropdown:hover .dropdown-menu-logistics {
  display: block;
  opacity: 1;
  transform: translateY(0%);
}

/* Estilos específicos para o tema claro */
body[data-theme=light] .dropdown-menu-logistics {
  background-color: #ffffff;
  border-color: #e9ecef;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

body[data-theme=light] .dropdown-menu-logistics li a {
  color: #495057 !important;
}

body[data-theme=light] .dropdown-menu-logistics li a:hover {
  background-color: #f8f9fa !important;
  color: #212529 !important;
}

body[data-theme=light] .dropdown-menu-logistics li a.active,
body[data-theme=light] .dropdown-menu-logistics li a:active {
  background-color: #007bff !important;
  color: #ffffff !important;
}

/* Estilos específicos para o tema escuro */
body[data-theme=dark] .dropdown-menu-logistics {
  background-color: #3b4651;
  border-color: #414d59;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.5);
}

body[data-theme=dark] .dropdown-menu-logistics li a {
  color: #cedeef !important;
}

body[data-theme=dark] .dropdown-menu-logistics li a:hover {
  background-color: #424e5a !important;
  color: #f3f7f9 !important;
}

body[data-theme=dark] .dropdown-menu-logistics li a.active,
body[data-theme=dark] .dropdown-menu-logistics li a:active {
  background-color: #007bff !important;
  color: #ffffff !important;
}

.modal-dialog.modal-custom {
  max-width: 90vw;   /* 90% da largura da tela */
  width: 90vw;     /* Ou qualquer valor fixo desejado */
  min-width: 600px;  /* Opcional: largura mínima */
}
/* Garante que o modal ocupe até 90% da altura da tela */
.modal-dialog {
  max-width: 90vw;
  margin: 1.75rem auto;
}

.modal-content {
  max-height: 90vh;
  display: flex;
  flex-direction: column;
}

.modal-body {
  flex: 1 1 auto;
  overflow-y: auto;
  max-height: 90vh; /* Ajuste conforme necessário */
}

.star-rating {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.stars {
  display: inline-flex;
  gap: 4px;
  font-size: 24px;
  width: fit-content;
  max-width: fit-content;
}

.star {
  color: #e0e0e0;
  cursor: pointer;
  transition: all 0.2s ease;
  user-select: none;
  display: inline-block;
  width: auto;
}

.star:hover,
.star.active {
  color: #ffc107;
  transform: scale(1.1);
}

.star.rated {
  color: #ffc107;
}

.rating-text {
  font-size: 14px;
  font-style: italic;
}

/* Efeito hover em cascata */
.star-rating:hover .star {
  color: #ffc107;
}

.star-rating .star:hover ~ .star {
  color: #e0e0e0;
}

.star-display {
  display: flex;
  gap: 2px;
  font-size: 14px;
  align-items: center;
}

.star-display i {
  transition: all 0.2s ease;
}

.star-display:hover i.text-warning {
  transform: scale(1.1);
}

/* Estrelas na tabela */
.table .star-display {
  justify-content: center;
}

/* Responsividade para mobile */
@media (max-width: 768px) {
  .star-display {
      font-size: 12px;
      gap: 1px;
  }
}