/* Custom styles goes here */

/* ========================================
   Search Modal Styles
   ======================================== */

/* Search trigger styling */
.search-toggler {
  cursor: pointer;
  transition: all 0.2s ease;
}

.search-toggler:hover {
  color: #696cff !important;
}

/* Modal content adjustments */
#searchModal .modal-content {
  border: none;
  box-shadow: 0 0.5rem 2rem rgba(0, 0, 0, 0.15);
  max-height: 80vh;
}

#searchModal .modal-header {
  background: transparent;
}

#searchModal .modal-body {
  max-height: 60vh;
  overflow-y: auto;
}

/* Search input styling */
#searchInput {
  font-size: 1.1rem;
}

#searchInput:focus {
  box-shadow: none;
}

/* Search sections */
.search-section {
  transition: opacity 0.2s ease;
}

.search-section.d-none {
  display: none !important;
}

/* Search items - Quick Access */
#quickAccessItems .search-item a {
  transition: all 0.2s ease;
  text-decoration: none;
  color: inherit;
}

#quickAccessItems .search-item a:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* Search items - Modules & Submodules */
#moduleItems .search-item,
#submoduleItems .search-item {
  transition: all 0.2s ease;
  border: none;
  border-radius: 0.375rem;
  margin-bottom: 0.25rem;
}

#moduleItems .search-item:hover,
#submoduleItems .search-item:hover,
.search-item-hover {
  background-color: rgba(105, 108, 255, 0.08);
}

/* Selected item (keyboard navigation) */
.search-item-selected {
  background-color: rgba(105, 108, 255, 0.12) !important;
  border-left: 3px solid #696cff !important;
}

/* Hidden items */
.search-item.d-none {
  display: none !important;
}

/* No results message */
.search-no-results {
  color: #6c757d;
}

.search-no-results i {
  opacity: 0.5;
}

/* Keyboard shortcuts */
#searchModal kbd {
  background-color: #f3f3f5;
  border: 1px solid #d4d4d8;
  border-radius: 0.25rem;
  padding: 0.15rem 0.4rem;
  font-size: 0.75rem;
  font-weight: 500;
  color: #6c757d;
}

/* Modal footer */
#searchModal .modal-footer {
  background-color: #f8f9fa;
}

/* Avatar styling in search items */
#moduleItems .avatar,
#submoduleItems .avatar {
  width: 2.5rem;
  height: 2.5rem;
}

#moduleItems .avatar-initial,
#submoduleItems .avatar-initial {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  #searchModal .modal-body {
    max-height: 70vh;
  }

  #quickAccessItems .col-6 {
    padding: 0.25rem;
  }

  #quickAccessItems .search-item a {
    padding: 0.75rem !important;
    font-size: 0.875rem;
  }
}

/* Dark mode support */
[data-bs-theme="dark"] #searchModal .modal-content {
  background-color: #2b2c40;
}

[data-bs-theme="dark"] #searchModal .modal-footer {
  background-color: #232333;
}

[data-bs-theme="dark"] #searchModal kbd {
  background-color: #3b3c52;
  border-color: #4b4c5f;
  color: #a3a4cc;
}

[data-bs-theme="dark"] #moduleItems .search-item:hover,
[data-bs-theme="dark"] #submoduleItems .search-item:hover,
[data-bs-theme="dark"] .search-item-hover {
  background-color: rgba(105, 108, 255, 0.15);
}

[data-bs-theme="dark"] .search-item-selected {
  background-color: rgba(105, 108, 255, 0.2) !important;
}

/* ========================================
   DataTables Responsive Fixes
   ======================================== */

/* Container principal da tabela com scroll horizontal */
.card-datatable,
.dataTables_wrapper {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* Garante que a tabela não ultrapasse o container */
.card-datatable .table,
.dataTables_wrapper .table {
  width: 100% !important;
  min-width: 800px; /* Largura mínima para evitar compressão excessiva */
}

/* Container do card */
.card-body {
  overflow-x: auto;
}

/* Para sticky funcionar, o card-datatable precisa ser o scroll container */
.card-datatable {
  position: relative;
}

/* Ajustes específicos para mobile */
@media (max-width: 992px) {
  .card-datatable,
  .dataTables_wrapper {
    margin: 0 -1rem;
    padding: 0 1rem;
  }

  .dataTables_wrapper .row {
    margin: 0;
  }

  .dataTables_wrapper .row > div {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }
}

@media (max-width: 768px) {
  /* Tabela com scroll horizontal suave */
  .card-datatable .table,
  .dataTables_wrapper .table {
    min-width: 600px;
  }

  /* Ajusta o header da tabela */
  .dataTables_wrapper .dataTables_length,
  .dataTables_wrapper .dataTables_filter {
    text-align: left !important;
    margin-bottom: 0.5rem;
  }

  /* Paginação responsiva */
  .dataTables_wrapper .dataTables_paginate {
    margin-top: 0.5rem;
  }

  .dataTables_wrapper .dataTables_paginate .pagination {
    flex-wrap: wrap;
    justify-content: center;
  }

  /* Info da tabela */
  .dataTables_wrapper .dataTables_info {
    text-align: center;
    padding-top: 0.5rem;
  }
}

@media (max-width: 576px) {
  .card-datatable .table,
  .dataTables_wrapper .table {
    min-width: 500px;
  }

  /* Reduz padding das células em telas muito pequenas */
  .dataTables_wrapper .table td,
  .dataTables_wrapper .table th {
    padding: 0.5rem 0.4rem;
    font-size: 0.8125rem;
  }

  /* Botões de ação mais compactos */
  .dataTables_wrapper .table .btn-icon {
    width: 1.75rem;
    height: 1.75rem;
  }
}

/* ========================================
   Sticky Actions Column (Mobile)
   ======================================== */

@media (max-width: 992px) {
  /* IMPORTANTE: border-collapse: separate é necessário para sticky funcionar */
  .card-datatable .table,
  .dataTables_wrapper .table {
    border-collapse: separate !important;
    border-spacing: 0 !important;
  }

  /* Coluna de ações fixa à direita */
  .card-datatable .table th:last-child,
  .card-datatable .table td:last-child,
  .dataTables_wrapper .table th:last-child,
  .dataTables_wrapper .table td:last-child {
    position: sticky !important;
    right: 0 !important;
    background-color: #fff !important;
    box-shadow: -3px 0 6px rgba(0, 0, 0, 0.15);
    z-index: 2;
  }

  /* Header sticky precisa de z-index maior */
  .card-datatable .table thead th:last-child,
  .dataTables_wrapper .table thead th:last-child {
    z-index: 3;
    background-color: #fff !important;
  }

  /* Ajuste para dark mode */
  [data-bs-theme="dark"] .card-datatable .table th:last-child,
  [data-bs-theme="dark"] .card-datatable .table td:last-child,
  [data-bs-theme="dark"] .dataTables_wrapper .table th:last-child,
  [data-bs-theme="dark"] .dataTables_wrapper .table td:last-child {
    background-color: #2b2c40 !important;
    box-shadow: -3px 0 6px rgba(0, 0, 0, 0.4);
  }

  /* Linhas alternadas (odd) */
  .card-datatable .table tbody tr:nth-of-type(odd) td:last-child,
  .dataTables_wrapper .table tbody tr:nth-of-type(odd) td:last-child {
    background-color: #f9f9f9 !important;
  }

  [data-bs-theme="dark"] .card-datatable .table tbody tr:nth-of-type(odd) td:last-child,
  [data-bs-theme="dark"] .dataTables_wrapper .table tbody tr:nth-of-type(odd) td:last-child {
    background-color: #232333 !important;
  }

  /* Hover state */
  .card-datatable .table tbody tr:hover td:last-child,
  .dataTables_wrapper .table tbody tr:hover td:last-child {
    background-color: #f1f1f1 !important;
  }

  [data-bs-theme="dark"] .card-datatable .table tbody tr:hover td:last-child,
  [data-bs-theme="dark"] .dataTables_wrapper .table tbody tr:hover td:last-child {
    background-color: #3b3c52 !important;
  }
}