/*
Time Left dashboard colors

Bootstrap 5 tables paint cell backgrounds using a more specific selector
(`.table > :not(caption) > * > *`) and an inset box-shadow overlay.

If we only set `background-color` on `.tl-*`, Bootstrap wins on specificity
and the colored backgrounds never appear.

Fix: target the actual <td> (`.time-left-cell`) with higher specificity,
disable the Bootstrap overlay, and force the muted "Due …" text to inherit
the cell color.
*/

.time-left-cell {
  border-radius: 0.25rem;
  /* Bootstrap tables use a 9999px inset shadow to paint backgrounds.
     Disable it for this cell so our background-color always shows. */
  box-shadow: none !important;
}

/* Keep the "Due …" line readable on colored backgrounds */
.time-left-cell .text-muted {
  color: inherit !important;
}

/* Past due: yellow text on red background */
.time-left-cell.tl-past {
  background-color: #ff0000 !important;
  color: #ffff00 !important;
}

/* 0–8 hours: black text on orange background */
.time-left-cell.tl-0-8 {
  background-color: #ffa500 !important;
  color: #000000 !important;
}

/* 8–24 hours: black text on yellow background */
.time-left-cell.tl-8-24 {
  background-color: #ffff00 !important;
  color: #000000 !important;
}

/* >24 hours: black text on green background */
.time-left-cell.tl-24p {
  background-color: #00ff00 !important;
  color: #000000 !important;
}

/* Make link-style buttons look consistent */
.btn-link.btn-sm {
  text-decoration: none;
}

.btn-link.btn-sm:hover {
  text-decoration: underline;
}


/* Click-to-copy tags (Profile → Notifications) */
.copy-to-clipboard {
  cursor: pointer;
}

/* Sticky past-due tag shortcut bar */
.tb-past-due-tag-bar {
  position: sticky;
  top: 0;
  z-index: 1020;
}

.tb-past-due-tag-bar[hidden] {
  display: none !important;
}

.tb-past-due-tag-buttons {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  overflow-x: auto;
  padding-bottom: 0.125rem;
}

.tb-past-due-tag-buttons .btn {
  white-space: nowrap;
}