:root {
  --themeBg: 24, 24, 24;
  --themeBgColour: #d3d3d3;
}
.navbar {
  background: rgb(var(--themeBg)) !important;
  color: var(--themeBgColour) !important;
}
.modal-header {
  background: rgb(var(--themeBg)) !important;
  color: var(--themeBgColour) !important;
}
.modal-header a {
  color: var(--themeBgColour) !important;
}
.table-dark {
  --mdb-table-color: #fff;
  --mdb-table-bg: rgb(24, 24, 24);
  --mdb-table-border-color: rgb(24, 24, 24);
  --mdb-table-striped-bg: rgb(24, 24, 24);
  --mdb-table-striped-color: #fff;
  --mdb-table-active-bg: rgb(24, 24, 24);
  --mdb-table-active-color: #fff;
  --mdb-table-hover-bg: rgb(24, 24, 24);
  --mdb-table-hover-color: #fff;
  color: var(--mdb-table-color);
  border-color: var(--mdb-table-border-color);
}
table#pagesTable tr.custom-hover td {
  transition: background-color 0.2s ease-in-out;
}

table#pagesTable tr.custom-hover:hover td {
  background-color: rgba(var(--themeBg), 0.3) !important;
  color: #fff !important;
}

.response-container {
  display: none; /* Hidden by default */
  position: fixed;
  top: 0;
  z-index: 99999999;
  width: 100%; /* Adjust width automatically based on content */
  transition: transform 0.4s cubic-bezier(0.68, -0.55, 0.27, 1.55), opacity 0.4s ease-in-out; /* Smooth expansion and fading effect with bounce */
}

.response-alert {
  margin: 0;
  padding: 0;
  border: 2px solid white; /* White border */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1), 0 6px 20px rgba(0, 0, 0, 0.1); /* Drop shadow */
  background-color: #f8f9fa; /* Light background color for better contrast */
  left: 50%;
  max-width: 400px;
  width: auto;
  transform: translateX(-50%);
}

.response-text {
  margin: 0;
  padding: 10px 20px;
  text-align: left;
  font-weight: bold; /* Make text bold for prominence */
}

.warning-color-dark {
  background-color: #f80 !important;
}
.danger-color-dark {
  background-color: #c00 !important;
}
.success-color-dark {
  background-color: #007e33 !important;
}
.special-color {
  background-color: #37474f !important;
}
.secondary-color {
  background-color: #a6c !important;
}