/* Base Styles */
/* -------------- */
/* General styles for the Tabulator component */
.tabulator {
  font-family: 'Roboto', sans-serif;
  font-weight: 500;
  min-height: 600px;
}


/* #table-wrapper {
  width: 100dvw;
}

#data-table {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
} */





.scale-options-popup {
  padding: 15px;
  background-color: #fff;
  border-radius: 5px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  width: 200px;
}

.scale-options-popup h6 {
  margin-bottom: 15px;
}

.scale-options-popup .btn {
  width: 100%;
}

.tabulator-header,
.tabulator-tableholder {
  transform-origin: top left;
  transition: transform 0.3s ease, width 0.3s ease;
}



:root {
  --zoom-factor: 1;
}

#table-wrapper .cell {
  padding: calc(0.5rem * var(--zoom-factor));
}

/* Adjust other elements as needed */
#table-wrapper .header {
  height: calc(2rem * var(--zoom-factor));
}



/* #table-wrapper {
  transition: padding-top 0.3s ease-in-out;
} */

.table {
  -webkit-user-select: none; /* Chrome, Safari, Opera */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera, and Firefox */
}

.tabulator-table,
.tabulator-headers,
.tabulator-row {
  padding: 0 !important;
}

.tabulator-col-content {
  cursor: default;
}

.tabulator-row-handle {
  cursor: grab;
}

.tabulator-row-handle:active {
  cursor: grabbing;
}

.tabulator-clickable {
  cursor: pointer;
}

.tabulator-editable {
  cursor: text;
}

.tabulator-popup.tabulator-popup-expanded::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: transparent;
  z-index: -1;
}

.tabulator-popup {
  -webkit-user-select: none; /* Chrome, Safari, Opera */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera, and Firefox */
}



@media screen and (max-width: 600px) {
  .tabulator .tabulator-cell {
    font-size: 12px; /* Smaller font size? */
    padding: 3px 5px; /* Reduced padding */
  }
  .tabulator .tabulator-header .tabulator-col {
    font-size: 12px;
  }
}




.job-count-badge {
  -webkit-user-select: none; /* Chrome, Safari, Opera */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera, and Firefox */
}


/* Arrow Styles */
/* -------------- */
/* Styling the sorting arrows within the columns */
.tabulator-arrow {
  border-width: 10px !important;
}

/* Menu Styles */
/* -------------- */
/* Styles for any dropdown menus within the Tabulator */
.tabulator-menu {
  max-height: 400px;
  overflow-y: auto;
}

/* Header Styles */
/* -------------- */

/* Overall Header */
/* Sets a maximum height for the entire header row */
/* Default for larger screens */
#data-table.tabulator .tabulator-header .tabulator-col-group {
  max-height: 125px;
  min-height: 125px;
}

/* For small screens */
@media (max-width: 767px) {
  #data-table.tabulator .tabulator-header .tabulator-col-group {
    max-height: 120px;
    min-height: 120px;
  }
}


/* Parent Header */
/* Styles for the parent header cells */
#data-table.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title {
  white-space: normal !important;
  text-overflow: clip !important;
  overflow: visible !important;
}

/* Common styles for all devices */
#data-table.tabulator .tabulator-header .tabulator-col.tabulator-sortable.tabulator-col-sorter-element .tabulator-col-content .tabulator-col-title-holder,
#data-table.tabulator .tabulator-header .tabulator-col[tabulator-field="hideRow"] .tabulator-col-content .tabulator-col-title-holder {
  position: relative;
}

#data-table.tabulator .tabulator-header .tabulator-col.tabulator-sortable.tabulator-col-sorter-element .tabulator-col-content .tabulator-col-title-holder .tabulator-header-popup-button,
#data-table.tabulator .tabulator-header .tabulator-col[tabulator-field="hideRow"] .tabulator-col-content .tabulator-col-title-holder .tabulator-header-popup-button {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 90%); /* This works well on mobile */
}

/* Larger screen adjustments */
@media (min-width: 768px) { /* Adjust the width as needed */
  #data-table.tabulator .tabulator-header .tabulator-col.tabulator-sortable.tabulator-col-sorter-element .tabulator-col-content .tabulator-col-title-holder .tabulator-header-popup-button,
  #data-table.tabulator .tabulator-header .tabulator-col[tabulator-field="hideRow"] .tabulator-col-content .tabulator-col-title-holder .tabulator-header-popup-button {
    transform: translate(-50%, 90%); /* This works well on larger screens */
  }
}



/* Child Header */
/* Styles for the child header cells */
#data-table.tabulator .tabulator-header .tabulator-col-group .tabulator-col-group-cols {
  flex-grow: 1;
}

#data-table.tabulator .tabulator-header .tabulator-col-group .tabulator-col-group-cols .tabulator-col {
  height: 100%;
}



/* Row Styles */
.tabulator.table-sm .tabulator-tableholder .tabulator-table .tabulator-row .tabulator-cell {
  max-height: 26px !important;
  max-height: 50px !important;
}


/* Info Bar Dropdown */
/* Default font size */
#scratchSheetSelect, .form-label, #prior-release-time > span.ms-2, 
.day-type-btn, #table-scale-toggle {
  font-size: 14px; /* or your preferred default size */
}

/* Smaller font size on small screens */
@media (max-width: 576px) {
  #scratchSheetSelect, .form-label, #prior-release-time > span.ms-2, 
  .day-type-btn, #table-scale-toggle {
      font-size: 12px; /* or your preferred size for small screens */
  }
  .job-count-badge {
    font-size: 12px;
  }
}