:root {
  --tblr-font-sans-serif: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  --tblr-font-monospace: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --tblr-primary: #487ca5;

  --color-default-bg: #ffffff;
  --color-default-text: #373530;
  --color-gray-bg: #f1f1ef;
  --color-gray-text: #787774;
  --color-brown-bg: #f3eeee;
  --color-brown-text: #976d57;
  --color-orange-bg: #f8ecdf;
  --color-orange-text: #cc782f;
  --color-yellow-bg: #faf3dd;
  --color-yellow-text: #c29343;
  --color-green-bg: #eef3ed;
  --color-green-text: #548164;
  --color-blue-bg: #e9f3f7;
  --color-blue-text: #487ca5;
  --color-purple-bg: #f6f3f8;
  --color-purple-text: #8a67ab;
  --color-pink-bg: #f9f2f5;
  --color-pink-text: #b35488;
  --color-red-bg: #faecec;
  --color-red-text: #c4554d;
  --color-teal-bg: #e0f5f5;
  --color-teal-text: #0d9488;
  --surface-border-color: rgba(0, 0, 0, 0.04);
}

[data-bs-theme="dark"] {
  --color-default-bg: #191919;
  --color-default-text: #d4d4d4;
  --color-gray-bg: #252525;
  --color-gray-text: #9b9b9b;
  --color-brown-bg: #2e2724;
  --color-brown-text: #a27763;
  --color-orange-bg: #36291f;
  --color-orange-text: #cb7b37;
  --color-yellow-bg: #372e20;
  --color-yellow-text: #c19138;
  --color-green-bg: #242b26;
  --color-green-text: #4f9768;
  --color-blue-bg: #1f282d;
  --color-blue-text: #447acb;
  --color-purple-bg: #2a2430;
  --color-purple-text: #865dbb;
  --color-pink-bg: #2e2328;
  --color-pink-text: #ba4a78;
  --color-red-bg: #332523;
  --color-red-text: #be524b;
  --color-teal-bg: #1f3433;
  --color-teal-text: #14b8a6;
  --surface-border-color: rgba(255, 255, 255, 0.08);
}

.badge-status {
  font-weight: 600;
  border-radius: 999px;
  background-color: var(--color-gray-bg);
  color: var(--color-gray-text);
}

.badge-status-qualified {
  background-color: var(--color-red-bg);
  color: var(--color-red-text);
}

.badge-status-qualifying {
  background-color: var(--color-orange-bg);
  color: var(--color-orange-text);
}

.badge-status-in-progress {
  background-color: var(--color-green-bg);
  color: var(--color-green-text);
}

.badge-status-pending-approval {
  background-color: var(--color-pink-bg);
  color: var(--color-pink-text);
}

.badge-status-negotiating-pid {
  background-color: var(--color-purple-bg);
  color: var(--color-purple-text);
}

.badge-status-awaiting-start {
  background-color: var(--color-blue-bg);
  color: var(--color-blue-text);
}

.badge-status-sent-to-sitecare {
  background-color: var(--color-brown-bg);
  color: var(--color-brown-text);
}

.text-status-qualified {
  color: var(--color-red-text);
}

.text-status-qualifying {
  color: var(--color-orange-text);
}

.text-status-in-progress {
  color: var(--color-green-text);
}

.text-status-pending-approval {
  color: var(--color-pink-text);
}

.text-status-negotiating-pid {
  color: var(--color-purple-text);
}

.text-status-awaiting-start {
  color: var(--color-blue-text);
}

.text-status-sent-to-sitecare {
  color: var(--color-brown-text);
}

.status-theme {
  --status-solid: var(--color-blue-text);
  --status-soft: var(--color-blue-bg);
}

.status-theme-qualified {
  --status-solid: var(--color-red-text);
  --status-soft: var(--color-red-bg);
}

.status-theme-qualifying {
  --status-solid: var(--color-orange-text);
  --status-soft: var(--color-orange-bg);
}

.status-theme-in-progress {
  --status-solid: var(--color-green-text);
  --status-soft: var(--color-green-bg);
}

.status-theme-pending-approval {
  --status-solid: var(--color-pink-text);
  --status-soft: var(--color-pink-bg);
}

.status-theme-negotiating-pid {
  --status-solid: var(--color-purple-text);
  --status-soft: var(--color-purple-bg);
}

.status-theme-awaiting-start {
  --status-solid: var(--color-blue-text);
  --status-soft: var(--color-blue-bg);
}

.status-theme-sent-to-sitecare {
  --status-solid: var(--color-brown-text);
  --status-soft: var(--color-brown-bg);
}

.status-theme-default {
  --status-solid: var(--color-blue-text);
  --status-soft: var(--color-blue-bg);
}

.progress-bar.status-theme {
  width: var(--progress-share, 0%);
  background-color: var(--status-solid);
}

.bid-to-win-won {
  color: var(--color-green-text);
}

.bid-to-win-lost {
  color: var(--color-red-text);
}

.pipeline-entry {
  position: relative;
  padding: 0.75rem;
  border-radius: 0.5rem;
  background-color: var(--color-default-bg);
  color: var(--color-default-text);
  overflow: hidden;
  border: 1px solid var(--surface-border-color);
  --entry-fill: var(--color-gray-bg);
}

.pipeline-entry.status-theme {
  --entry-fill: var(--status-soft);
}

.pipeline-entry::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    var(--entry-fill) 0%,
    var(--entry-fill) var(--entry-progress, 0%),
    transparent var(--entry-progress, 0%),
    transparent 100%
  );
  opacity: 0.85;
}

.pipeline-entry > * {
  position: relative;
  z-index: 1;
}

.category-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
  background-color: var(--color-gray-bg) !important;
  color: var(--color-gray-text) !important;
  white-space: nowrap;
  border: 1px solid rgba(0, 0, 0, 0.08);
}

.category-wordpress {
  background-color: var(--color-blue-bg) !important;
  color: var(--color-blue-text) !important;
}

.category-integrations {
  background-color: var(--color-purple-bg) !important;
  color: var(--color-purple-text) !important;
}

.category-account-management {
  background-color: var(--color-green-bg) !important;
  color: var(--color-green-text) !important;
}

.category-application-maintenance {
  background-color: var(--color-orange-bg) !important;
  color: var(--color-orange-text) !important;
}

.category-design {
  background-color: var(--color-pink-bg) !important;
  color: var(--color-pink-text) !important;
}

.category-streetscape {
  background-color: var(--color-teal-bg) !important;
  color: var(--color-teal-text) !important;
}

.category-cell {
  display: inline-grid;
  gap: 0.25rem;
  justify-items: center;
}

.category-count-number {
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--color-gray-text);
}

.category-total {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--color-default-text);
  white-space: nowrap;
  padding-top: 0.15rem;
  border-top: 1px dashed rgba(0, 0, 0, 0.12);
  width: 100%;
  text-align: center;
}

.category-totals th,
.category-totals td {
  border-top: 2px solid var(--tblr-border-color);
  background-color: var(--tblr-tertiary-bg);
}

.changelog-table .col-changed {
  white-space: nowrap;
  width: 9rem;
}

.changelog-table .col-old,
.changelog-table .col-new {
  width: 7.5rem;
}

.changelog-table .col-outcome {
  width: 6.5rem;
}

.changelog-table .col-lead,
.changelog-table .col-category {
  min-width: 9rem;
}
