/* Sticky Table Column Styles */

/* Make table container have horizontal scroll */
.table-responsive {
  position: relative;
  overflow-x: auto;
  overflow-y: visible;
}

/* Sticky Actions Column */
.sticky-action {
  position: sticky !important;
  right: 0 !important;
  background-color: #ffffff !important;
  z-index: 100 !important;
  border-left: 2px solid #dee2e6 !important;
  min-width: 120px !important;
  width: 120px !important;
  max-width: 120px !important;
  box-shadow: -2px 0 4px rgba(0, 0, 0, 0.05) !important;
}

/* Sticky header for actions column */
thead .sticky-action {
  background-color: #f8f9fa !important;
  font-weight: 600 !important;
  border-bottom: 2px solid #dee2e6 !important;
  color: #495057 !important;
}

/* Ensure dropdown menu appears correctly */
.sticky-action .dropdown-menu {
  position: absolute !important;
  right: 0 !important;
  left: auto !important;
  z-index: 1000 !important;
  transform: translateX(-125px) !important;
}

/* Table rows - consistent solid background */
.sticky-action {
  background-color: #ffffff !important;
}

/* Hover effects - solid background on hover */
.table tbody tr:hover .sticky-action {
  background-color: #f8f9fa !important;
}

/* Service title styling */
.service-title {
  font-size: 14px;
  line-height: 1.4;
  color: #495057;
  word-wrap: break-word;
  cursor: help;
}

.service-title:hover {
  color: #007bff;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .sticky-action {
    min-width: 100px !important;
    width: 100px !important;
    max-width: 100px !important;
  }
  
  .sticky-action .btn {
    font-size: 12px !important;
    padding: 4px 8px !important;
  }
}

/* Dark mode support - solid dark backgrounds */
@media (prefers-color-scheme: dark) {
  .sticky-action {
    background-color: #ffffff !important;
  }
}
@media (prefers-color-scheme: dark) {
  .sticky-action {
    background-color: #ffffff !important;
    /* border-left-color: #0967c5 !important; */
    color: #ffffff !important;
  }
  
  thead .sticky-action {
    background-color: #f2f2f2 !important;
    color: #121212 !important;
  }
  
  /* .table tbody tr:hover .sticky-action {
    background-color: #495057 !important;
  } */
}

/* Ensure table has proper min-width for horizontal scrolling */
#user-datatable {
  min-width: 1200px !important;
}

/* Fix for DataTables if used */
.dataTables_wrapper .dataTables_scroll {
  overflow-x: auto;
}

.dataTables_wrapper .dataTables_scrollBody {
  overflow-x: visible;
}
