/* DataTables skeleton loader (shared) — matches the original equipment-on-rent style. */
@keyframes dts-shimmer { 0% { left: -100%; } 100% { left: 100%; } }

/* Hide the default floating processing spinner globally so it can't overlap toolbar. */
.dataTables_wrapper .dataTables_processing {
  display: none !important;
}

table tbody tr.dts-skel-row {
  background: #fff;
}
table tbody tr.dts-skel-row:nth-child(even) {
  background: #fafafa;
}
table tbody tr.dts-skel-row td {
  border-bottom: 1px solid #eee;
  padding: 14px 8px;
}
/* Empty skeleton cells (checkbox col, responsive control col): keep tight. */
table tbody tr.dts-skel-row td:empty {
  padding: 14px 0;
  width: 1px;
}
.dts-skel-bar {
  position: relative;
  display: block;
  height: 16px;
  background-color: #ececec;
  border-radius: 3px;
  overflow: hidden;
}
.dts-skel-bar::after {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.8), transparent);
  animation: dts-shimmer 1.6s infinite;
}

/* Don't show responsive child detail rows while skeleton is up. */
table tbody tr.dts-skel-row + tr.child,
table tbody tr.dts-skel-row.child { display: none !important; }

/* Clear-X button on the DataTables search input (matches filter clears). */
.dataTables_filter label { display: inline-flex; align-items: center; gap: 6px; margin: 0; }
.dataTables_filter .dts-search-wrap {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  line-height: 0;
}
.dataTables_filter .dts-search-wrap input {
  padding-right: 26px !important;
  line-height: normal;
}
.dts-search-clear {
  position: absolute;
  top: 35%;
  right: 4px;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  line-height: 18px;
  text-align: center;
  border: 0;
  background: transparent;
  color: #888;
  font-size: 18px;
  cursor: pointer;
  padding: 0;
  display: none;
  border-radius: 50%;
  z-index: 2;
}
.dts-search-clear:hover { background: #eee; color: #333; }
.dataTables_filter .dts-search-wrap.has-value .dts-search-clear { display: block; }

/* ----- Toolbar polish ----- */
/* Compact, consistent toolbar across all account DataTables. */

/* When using dom: '<"acct-dt-toolbar"lBf>rtip', force length+buttons+search onto one row. */
.dataTables_wrapper .acct-dt-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-bottom: 10px;
}
.dataTables_wrapper .acct-dt-toolbar .dataTables_length { margin: 0; flex: 0 0 auto; }
.dataTables_wrapper .acct-dt-toolbar .dt-buttons { margin: 0; flex: 1 1 auto; }
.dataTables_wrapper .acct-dt-toolbar .dataTables_filter {
  margin: 0; flex: 0 0 auto; float: none;
}

.dataTables_wrapper .dt-buttons {
  display: inline-flex !important;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 8px 8px 0;
  max-width: 100%;
  text-align: left !important;
}
.dataTables_wrapper .dt-buttons .dt-button {
  margin: 0 !important;
  padding: 6px 12px !important;
  font-size: 0.9em !important;
  line-height: 1.3 !important;
  border-radius: 3px !important;
  white-space: nowrap;
}
.dataTables_wrapper .dt-buttons .dt-button i.fa { margin-right: 4px; }

/* Color-coded action buttons for friendlier UI on invoices and similar pages. */
.dataTables_wrapper .dt-button.acct-btn-primary {
  background: #28a745 !important; border-color: #28a745 !important; color: #fff !important;
}
.dataTables_wrapper .dt-button.acct-btn-primary:hover {
  background: #218838 !important; border-color: #1e7e34 !important;
}
.dataTables_wrapper .dt-button.acct-btn-checkout {
  background: #007bff !important; border-color: #007bff !important; color: #fff !important;
}
.dataTables_wrapper .dt-button.acct-btn-checkout:hover {
  background: #0069d9 !important; border-color: #0062cc !important;
}
.dataTables_wrapper .dt-button.acct-btn-flexpay,
.dataTables_wrapper .dt-button.acct-btn-open,
.dataTables_wrapper .dt-button.acct-btn-export {
  background: #fff !important; border: 1px solid #ccc !important; color: #333 !important;
}
.dataTables_wrapper .dt-button.acct-btn-flexpay:hover,
.dataTables_wrapper .dt-button.acct-btn-open:hover,
.dataTables_wrapper .dt-button.acct-btn-export:hover {
  background: #f5f5f5 !important; border-color: #999 !important;
}
.dataTables_wrapper .dt-button.acct-btn-open.active {
  background: #fff3cd !important; border-color: #ffc107 !important; color: #856404 !important;
}

.dataTables_wrapper .dataTables_length { display: inline-block; margin-right: 12px; vertical-align: middle; }
.dataTables_wrapper .dataTables_length select { height: 32px; padding: 2px 6px; }
.dataTables_wrapper .dataTables_filter {
  float: right;
  margin-bottom: 8px;
}
.dataTables_wrapper .dataTables_filter input { height: 32px; padding: 4px 8px; }
@media (max-width: 768px) {
  .dataTables_wrapper .acct-dt-toolbar { flex-direction: column; align-items: stretch; }
  .dataTables_wrapper .acct-dt-toolbar .dataTables_length,
  .dataTables_wrapper .acct-dt-toolbar .dataTables_filter { text-align: center; }
  .dataTables_wrapper .dt-buttons { width: 100%; justify-content: center; }
  .dataTables_wrapper .dataTables_filter { float: none; text-align: center; }
  .dataTables_wrapper .dataTables_length { display: block; text-align: center; margin: 0 0 8px; }
}