/**
 * Override django-unfold timepicker/calendarbox z-index.
 * The package has a bug: .clockbox gets z-70 from a shared rule but is overridden to z-50
 * in the Timepicker section, causing it to appear under the modal-overlay (z-60).
 * See: https://github.com/unfoldadmin/django-unfold/pull/1773
 */
.clockbox,
.calendarbox .calendar {
  z-index: 70 !important;
}

/**
 * django-import-export diff colors for Unfold dark mode.
 * Unfold's template doesn't use .import-preview, so the default
 * import.css dark rules never match. Uses Unfold's --color-base-*
 * and --color-primary-* CSS variables where possible.
 */
html.dark tr.skip td {
  background-color: color-mix(in oklch, var(--color-base-500) 6%, transparent);
}

html.dark tr.new td {
  background-color: color-mix(in oklch, var(--color-primary-500) 12%, transparent);
}

html.dark tr.delete td {
  background-color: color-mix(in oklch, oklch(62.8% 0.2577 29.23) 10%, transparent);
}

html.dark tr.update td {
  background-color: color-mix(in oklch, var(--color-primary-300) 8%, transparent);
}

html.dark td ins {
  background: color-mix(in oklch, var(--color-primary-500) 22%, transparent) !important;
  text-decoration: none;
}

html.dark td del {
  background: color-mix(in oklch, oklch(62.8% 0.2577 29.23) 18%, transparent) !important;
}
