.gridjs-head button,
.gridjs-footer button {
	cursor: pointer;
	background-color: transparent;
	background-image: none;
	padding: 0;
	margin: 0;
	border: none;
	outline: none;
}

.gridjs-pagination .gridjs-pages button {
	padding: 6px 12px !important;
	border: 1px solid;
	background-color: transparent;
	border-right: none;
	outline: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

.gridjs-pagination .gridjs-pages button:focus {
	box-shadow: 0 0 0 2px;
	position: relative;
	margin-right: -1px;
	border-right: 1px solid;
}

.gridjs-pagination .gridjs-pages button:hover {
	background-color: inherit;
	color: inherit;
	outline: none;
}

.gridjs-pagination .gridjs-pages button:disabled,
.gridjs-pagination .gridjs-pages button[disabled],
.gridjs-pagination .gridjs-pages button:hover:disabled {
	cursor: default;
	background-color: inherit;
	color: inherit;
}

.gridjs-pagination .gridjs-pages button.gridjs-spread {
	cursor: default;
	box-shadow: none;
	background-color: inherit;
}

.gridjs-pagination .gridjs-pages button.gridjs-currentPage {
	background-color: inherit;
	font-weight: bold;
}

.gridjs-pagination .gridjs-pages button:last-child {
	border-bottom-right-radius: 6px;
	border-top-right-radius: 6px;
	border-right: 1px solid;
}

.gridjs-pagination .gridjs-pages button:first-child {
	border-bottom-left-radius: 6px;
	border-top-left-radius: 6px;
}

.gridjs-pagination .gridjs-pages button:last-child:focus {
	margin-right: 0;
}

button.gridjs-sort {
	float: right;
	height: 24px;
	width: 13px;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position-x: center;
	cursor: pointer;
	padding: 0;
	margin: 0;
	border: none;
	outline: none;
	background-size: contain;
	color: inherit;
}

button.gridjs-sort-neutral::before {
	content: "\f0dc"; /* Font Awesome icon for neutral sort (fa-sort) */
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
}

button.gridjs-sort-asc::before {
	content: "\f0de"; /* Font Awesome icon for ascending sort (fa-sort-up) */
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
}

button.gridjs-sort-desc::before {
	content: "\f0dd"; /* Font Awesome icon for descending sort (fa-sort-down) */
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
}

button.gridjs-sort:focus {
	outline: none;
}

th.gridjs-th {
	position: relative;
	white-space: nowrap;
	vertical-align: middle;
}

th.gridjs-th .gridjs-th-content {
	text-overflow: ellipsis;
	overflow: hidden;
	width: 100%;
	float: left;
}

th.gridjs-th-sort {
	cursor: pointer;
}

th.gridjs-th-sort .gridjs-th-content {
	width: calc(100% - 15px);
}

th.gridjs-th-sort:hover,
th.gridjs-th-sort:focus {
	background-color: inherit;
}

.gridjs-loading-bar {
	z-index: 10;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	opacity: 0.5;
}

.gridjs-loading-bar::after {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	transform: translateX(-100%);
	background-image: linear-gradient(
		90deg,
		rgba(204, 204, 204, 0) 0,
		rgba(204, 204, 204, 0.2) 20%,
		rgba(204, 204, 204, 0.5) 60%,
		rgba(204, 204, 204, 0)
	);
	animation: shimmer 2s infinite;
	content: "";
}

@keyframes shimmer {
	100% {
		transform: translateX(100%);
	}
}

.gridjs-th .gridjs-resizable,
.gridjs-resizable {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	width: 5px !important;
	min-width: 5px !important;
	max-width: 5px !important;
}

.gridjs-resizable:hover {
	cursor: ew-resize;
}

.actions-column {
	width: 100px;
}

.gridjs .gridjs-table th,
.gridjs .gridjs-table td {
	min-width: auto !important; /* Remove min-width or set to a different value */
}

.gridjs .gridjs-table.table-bordered {
	border-collapse: collapse;
	border: 1px solid var(--bs-border-color);
}
.gridjs .gridjs-table.table-bordered th,
.gridjs .gridjs-table.table-bordered td {
	border: 1px solid var(--bs-border-color);
}

.table td:first-child,
.table th:first-child {
	padding-left: 0.75rem;
}

.table td:last-child,
.table th:last-child {
	padding-right: 0.75rem;
	text-align: center;
	white-space: nowrap;
}