/* =====================================================================
   Nanoq Intranet – Alerts (1.21.0)
   The banner (every app page and the login page) and the senders' page.
   Built on the arctic tokens (--nq-*) with fallbacks, so the classic design works too.
   ===================================================================== */

.nq-alerts, .na-app, .na-toast, .nq-alerts-widget {
  --a-surface: var(--nq-surface, var(--bs-paper-bg, #fff));
  --a-ink: var(--nq-ink, var(--nanoq-heading, #384551));
  --a-text: var(--nq-text, var(--bs-body-color, #646e78));
  --a-muted: var(--nq-muted, #8592a3);
  --a-border: var(--nq-frost, var(--bs-border-color, #e4e6e8));
  --a-ice: var(--nq-ice, rgba(133, 146, 163, 0.09));
  --a-accent: var(--nq-accent, var(--nanoq-primary, #6658ea));
  --a-r: var(--nq-r-card, 14px);
  --a-rc: var(--nq-r-ctrl, 10px);
  --a-display: var(--nq-display, inherit);
  --a-shadow: var(--nq-shadow, 0 1px 3px rgba(15, 46, 69, 0.08));
  /* levels: tint (background), line (border/icon), text */
  --a-info: #1f74ad;
  --a-info-bg: #e6f1f9;
  --a-warning: #a7620a;
  --a-warning-line: #e6a23c;
  --a-warning-bg: #fff4dc;
  --a-critical: #b3263f;
  --a-critical-bg: #c2415c;
  --a-critical-ink: #ffffff;
}
[data-bs-theme=dark] .nq-alerts, [data-bs-theme=dark] .na-app, [data-bs-theme=dark] .na-toast, [data-bs-theme=dark] .nq-alerts-widget {
  --a-info: #8cc4ef;
  --a-info-bg: rgba(66, 148, 214, 0.16);
  --a-warning: #f2c46b;
  --a-warning-line: #d79a2b;
  --a-warning-bg: rgba(231, 172, 64, 0.15);
  --a-critical: #ff9aac;
  --a-critical-bg: #a8273f;
  --a-critical-ink: #fff4f6;
}

/* ---------- The banner ---------- */
.nq-alerts {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 18px 1.625rem 0;
}
.nq-alerts[hidden] { display: none; }
.nq-alerts-list { display: flex; flex-direction: column; gap: 10px; }

.nq-alert {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 14px 12px 16px;
  border-radius: var(--a-r);
  border: 1px solid transparent;
  border-left-width: 5px;
  background: var(--a-info-bg);
  border-color: color-mix(in srgb, var(--a-info) 28%, transparent);
  border-left-color: var(--a-info);
  color: var(--a-ink);
  box-shadow: var(--a-shadow);
  transition: opacity 0.18s, transform 0.18s;
  text-align: left;
}
.nq-alert.is-leaving { opacity: 0; transform: translateY(-4px); }
.nq-alert-icon { font-size: 1.55rem; line-height: 1; color: var(--a-info); margin-top: 1px; flex: 0 0 auto; }
.nq-alert { flex-wrap: wrap; }
.nq-alert-main { flex: 1 1 240px; min-width: 0; }
.nq-alert-title { font-family: var(--a-display); font-weight: 700; font-size: 1.02rem; line-height: 1.35; overflow-wrap: anywhere; }
.nq-alert-body { margin-top: 3px; font-size: 0.93rem; font-weight: 400; line-height: 1.5; color: inherit; overflow-wrap: anywhere; }
.nq-alert-body strong { font-weight: 700; }
.nq-alert-body a { color: inherit; text-decoration: underline; font-weight: 600; }
.nq-alert-meta { margin-top: 5px; font-size: 0.78rem; opacity: 0.75; }
.nq-alert-actions { display: flex; align-items: center; gap: 6px; flex: 0 0 auto; margin-left: auto; }
.nq-alert-x {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 9px;
  border: 0;
  background: transparent;
  color: inherit;
  font-size: 1.35rem;
  cursor: pointer;
  opacity: 0.75;
}
.nq-alert-x:hover, .nq-alert-x:focus-visible { opacity: 1; background: rgba(0, 0, 0, 0.07); }
.nq-alert-ack {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 0;
  border-radius: 999px;
  padding: 7px 14px;
  font-weight: 700;
  font-size: 0.86rem;
  white-space: nowrap;
  cursor: pointer;
  background: var(--a-info);
  color: #fff;
}
.nq-alert-ack:hover { filter: brightness(1.08); }
.nq-alert-ack i { font-size: 1.15rem; }

.nq-alert-warning { background: var(--a-warning-bg); border-color: color-mix(in srgb, var(--a-warning-line) 40%, transparent); border-left-color: var(--a-warning-line); }
.nq-alert-warning .nq-alert-icon { color: var(--a-warning); }
.nq-alert-warning .nq-alert-ack { background: #9a5a08; }

.nq-alert-critical { background: var(--a-critical-bg); border-color: var(--a-critical-bg); border-left-color: #7a1428; color: var(--a-critical-ink); }
.nq-alert-critical .nq-alert-icon { color: var(--a-critical-ink); }
.nq-alert-critical .nq-alert-ack { background: #fff; color: #9b1d35; }
.nq-alert-critical .nq-alert-x:hover { background: rgba(255, 255, 255, 0.16); }
[data-bs-theme=dark] .nq-alert-info, [data-bs-theme=dark] .nq-alert-warning { color: var(--a-ink); }
[data-bs-theme=dark] .nq-alert-info .nq-alert-ack { background: #2f86c4; }
[data-bs-theme=dark] .nq-alert-warning .nq-alert-ack { background: #b8780f; }

/* folded to a thin strip (alerts that must be acknowledged) */
.nq-alert.is-folded { padding-top: 6px; padding-bottom: 6px; align-items: center; }
.nq-alert.is-folded .nq-alert-icon { font-size: 1.2rem; margin: 0; }
.nq-alert.is-folded .nq-alert-body, .nq-alert.is-folded .nq-alert-meta { display: none; }
.nq-alert.is-folded .nq-alert-title { font-size: 0.92rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nq-alert.is-folded .nq-alert-ack { padding: 4px 11px; font-size: 0.8rem; }
.nq-alert.is-folded .nq-alert-fold i { transform: rotate(180deg); }

/* three or more: one line that opens the list */
.nq-alerts-sum {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  border: 1px solid transparent;
  border-left-width: 5px;
  border-radius: var(--a-r);
  padding: 10px 14px;
  font-size: 0.95rem;
  cursor: pointer;
  box-shadow: var(--a-shadow);
  background: var(--a-info-bg);
  border-left-color: var(--a-info);
  color: var(--a-ink);
  text-align: left;
}
.nq-alerts-sum > i:first-child { font-size: 1.35rem; }
.nq-alerts-sum strong { white-space: nowrap; font-family: var(--a-display); }
.nq-alerts-sum-first { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; opacity: 0.85; }
.nq-alerts-sum-chev { font-size: 1.3rem; transition: transform 0.2s; }
.nq-alerts-sum.nq-alert-warning { background: var(--a-warning-bg); border-left-color: var(--a-warning-line); }
.nq-alerts-sum.nq-alert-critical { background: var(--a-critical-bg); border-color: var(--a-critical-bg); border-left-color: #7a1428; color: var(--a-critical-ink); }
.nq-alerts.is-stacked .nq-alerts-list { display: none; }
.nq-alerts.is-stacked.is-expanded .nq-alerts-list { display: flex; }
.nq-alerts.is-expanded .nq-alerts-sum-chev { transform: rotate(180deg); }

@media (max-width: 1199.98px) {
  .nq-alerts { padding: 12px 1rem 0; }
}
@media (max-width: 575.98px) {
  .nq-alert { flex-wrap: wrap; gap: 8px 10px; padding: 11px 10px 11px 12px; }
  .nq-alert-icon { font-size: 1.35rem; }
  .nq-alert-main { flex-basis: calc(100% - 80px); }
  .nq-alert-actions { margin-left: auto; }
  .nq-alert[data-ack] .nq-alert-actions { flex-basis: 100%; justify-content: flex-end; }
  .nq-alert.is-folded .nq-alert-actions { flex-basis: auto; }
  .nq-alert.is-folded .nq-alert-main { flex-basis: auto; }
  .nq-alert.is-folded .nq-alert-ack span { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .nq-alert, .nq-alerts-sum-chev { transition: none; }
}

/* the login page: above the login box */
.nq-alerts-login { padding: 0; margin: 0 0 18px; }
.nq-alerts-login .nq-alert { box-shadow: none; }
.nq-alerts-login .nq-alert-title { font-size: 0.98rem; }

/* ---------- Senders' page ---------- */
.na-app { color: var(--a-text); }
.na-card {
  background: var(--a-surface);
  border: 1px solid var(--a-border);
  border-radius: var(--a-r);
  box-shadow: var(--a-shadow);
  padding: 18px 20px;
  margin-bottom: 16px;
}
.na-card-title { font-family: var(--a-display); font-size: 1rem; font-weight: 700; color: var(--a-ink); margin: 0 0 12px; }
.na-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 18px; }
.na-tab {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 14px;
  border-radius: 999px;
  color: var(--a-text) !important;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.9rem;
  border: 1px solid var(--a-border);
  background: var(--a-surface);
}
.na-tab i { font-size: 1.1rem; color: var(--a-muted); }
.na-tab:hover { border-color: var(--a-accent); }
.na-tab.is-active { background: var(--a-accent); border-color: var(--a-accent); color: var(--a-surface) !important; }
.na-tab.is-active i { color: var(--a-surface); }
.na-tab.is-active .nq-count { background: rgba(255, 255, 255, 0.22); color: inherit; }
.na-tab .nq-count.is-live { background: var(--a-critical-bg); color: #fff; }

.na-cols { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 22px; align-items: start; }
.na-col-preview { position: sticky; top: 20px; }
.na-preview { background: var(--a-ice); border: 1px solid var(--a-border); border-radius: var(--a-r); padding: 18px; }
.na-preview .nq-alert { box-shadow: none; }
.na-preview .nq-alert-actions span { cursor: default; }

.na-field { margin-bottom: 14px; border: 0; padding: 0; min-width: 0; }
.na-field:last-child { margin-bottom: 0; }
.na-label { display: block; font-weight: 700; font-size: 0.82rem; color: var(--a-ink); margin-bottom: 6px; float: none; width: auto; padding: 0; }
.na-hint { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 4px 12px; font-size: 0.8rem; color: var(--a-muted); margin: 6px 0 0; }
.na-hint .is-over { color: var(--a-critical); font-weight: 600; }
.na-lang-row { display: flex; align-items: center; gap: 10px; }
.na-lang-row .na-label { margin: 0; }
.na-lang-row select { width: auto; min-width: 150px; }

.na-levels { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.na-level { position: relative; margin: 0; }
.na-level input { position: absolute; opacity: 0; pointer-events: none; }
.na-level span {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 9px 8px;
  border-radius: var(--a-rc);
  border: 1.5px solid var(--a-border);
  font-weight: 700;
  font-size: 0.88rem;
  cursor: pointer;
  color: var(--a-text);
  background: var(--a-surface);
  text-align: center;
  min-width: 0;
  overflow-wrap: anywhere;
  hyphens: auto;
  height: 100%;
}
.na-level span i { font-size: 1.15rem; }
.na-level input:focus-visible + span { outline: 2px solid var(--a-accent); outline-offset: 2px; }
.na-level-info input:checked + span { border-color: var(--a-info); background: var(--a-info-bg); color: var(--a-info); }
.na-level-warning input:checked + span { border-color: var(--a-warning-line); background: var(--a-warning-bg); color: var(--a-warning); }
.na-level-critical input:checked + span { border-color: var(--a-critical-bg); background: var(--a-critical-bg); color: #fff; }

.na-tr { border: 1px solid var(--a-border); border-radius: var(--a-rc); padding: 10px 12px 12px; margin-bottom: 10px; background: var(--a-ice); }
.na-tr legend { float: none; width: auto; font-size: 0.85rem; font-weight: 700; color: var(--a-ink); display: flex; align-items: center; gap: 6px; margin: 0 0 6px; padding: 0; width: 100%; }
.na-tr legend .nq-icon-btn { margin-left: auto; }
.na-tr-add { display: flex; flex-wrap: wrap; gap: 6px; }
.na-tr-add [hidden] { display: none !important; }

.na-seg { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.na-seg label { margin: 0; position: relative; }
.na-seg input { position: absolute; opacity: 0; pointer-events: none; }
.na-seg span { display: inline-flex; align-items: center; gap: 6px; padding: 7px 13px; border: 1.5px solid var(--a-border); border-radius: 999px; font-weight: 600; font-size: 0.88rem; cursor: pointer; background: var(--a-surface); }
.na-seg input:checked + span { border-color: var(--a-accent); color: var(--a-accent); background: color-mix(in srgb, var(--a-accent) 9%, var(--a-surface)); }
.na-seg input:focus-visible + span { outline: 2px solid var(--a-accent); outline-offset: 2px; }
.na-pick { display: flex; flex-direction: column; gap: 2px; }
.na-pick[hidden] { display: none; }
.na-people { max-height: 260px; overflow: auto; border: 1px solid var(--a-border); border-radius: var(--a-rc); padding: 4px; }
.na-check { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 8px; margin: 0; cursor: pointer; font-size: 0.92rem; }
.na-check:hover { background: var(--a-ice); }
.na-check[hidden] { display: none; }
.na-check img { width: 24px; height: 24px; border-radius: 50%; }
.na-check small { margin-left: auto; color: var(--a-muted); }

.na-switch { display: flex; gap: 12px; align-items: flex-start; padding: 8px 0; border-bottom: 1px solid var(--a-border); }
.na-switch:last-of-type { border-bottom: 0; }
.na-switch label { margin: 0; cursor: pointer; }
.na-switch label strong { display: block; color: var(--a-ink); font-size: 0.92rem; }
.na-switch label small { display: block; color: var(--a-muted); font-size: 0.8rem; }
.na-switch.is-locked label { cursor: default; }
.na-login-warning { margin: 8px 0 0; font-size: 0.86rem; display: flex; gap: 8px; align-items: flex-start; }
.na-login-warning[hidden] { display: none; }

.na-radio { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 0 0 6px; font-size: 0.92rem; cursor: pointer; }
.na-inline { width: auto; display: inline-block; min-width: 0; }
.na-inline[type=number] { width: 82px; }

.na-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
.na-error[hidden] { display: none; }

.na-push-mock {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  background: var(--a-surface);
  border-radius: 16px;
  padding: 11px 12px;
  box-shadow: 0 6px 20px -10px rgba(15, 46, 69, 0.4);
  font-size: 0.86rem;
}
.na-push-mock img { width: 34px; height: 34px; border-radius: 8px; }
.na-push-mock div { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.na-push-mock strong { color: var(--a-ink); font-size: 0.82rem; }
.na-push-mock span { color: var(--a-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.na-push-mock small { color: var(--a-muted); font-size: 0.72rem; }
.na-confirm { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--a-border); }
.na-confirm[hidden] { display: none; }
.na-confirm-text { display: flex; gap: 8px; align-items: center; font-weight: 700; color: var(--a-ink); margin: 0 0 10px; }

/* overview rows */
.na-list { display: flex; flex-direction: column; gap: 8px; }
.na-row {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 16px;
  background: var(--a-surface);
  border: 1px solid var(--a-border);
  border-left: 4px solid var(--a-info);
  border-radius: var(--a-rc);
  color: var(--a-text) !important;
  text-decoration: none;
  box-shadow: var(--a-shadow);
}
.na-row:hover { border-color: var(--a-accent); border-left-color: inherit; }
.na-row-warning { border-left-color: var(--a-warning-line); }
.na-row-critical { border-left-color: var(--a-critical-bg); }
.na-row-icon { font-size: 1.4rem; color: var(--a-info); }
.na-row-warning .na-row-icon { color: var(--a-warning); }
.na-row-critical .na-row-icon { color: var(--a-critical); }
.na-row-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.na-row-main strong { color: var(--a-ink); overflow-wrap: anywhere; }
.na-row-main small { color: var(--a-muted); }
.na-row-stat { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; flex: 0 0 auto; }
.na-row-go { font-size: 1.3rem; color: var(--a-muted); }
.na-mini-bar { width: 110px; height: 6px; border-radius: 6px; background: var(--a-ice); overflow: hidden; display: block; }
.na-mini-bar span { display: block; height: 100%; background: var(--nq-aurora, #279c84); border-radius: 6px; }
.na-empty { text-align: center; color: var(--a-muted); padding: 40px 20px; border: 1.5px dashed var(--a-border); border-radius: var(--a-r); }
.na-empty i { font-size: 2.2rem; display: block; margin-bottom: 6px; }
.na-empty p { margin: 0; }

/* one alert */
.na-back { display: inline-flex; align-items: center; gap: 2px; font-size: 0.85rem; font-weight: 600; margin-bottom: 4px; text-decoration: none; }
.na-head-actions { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.na-chip { display: inline-block; font-size: 0.74rem; font-weight: 700; padding: 1px 9px; border-radius: 999px; background: var(--a-ice); color: var(--a-text); margin-right: 6px; }
.na-chip-active { background: color-mix(in srgb, var(--nq-aurora, #279c84) 16%, transparent); color: var(--nq-aurora, #1f7a67); }
.na-chip-scheduled { background: var(--a-info-bg); color: var(--a-info); }
.na-resend-wait { font-size: 0.82rem; color: var(--a-muted); text-align: right; margin: -10px 0 12px; }
.na-detail { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 20px; align-items: start; }
.na-preview-banner { margin-bottom: 16px; }
.na-facts dl { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 8px 14px; font-size: 0.88rem; }
.na-facts dt { color: var(--a-muted); font-weight: 600; }
.na-facts dd { margin: 0; color: var(--a-ink); overflow-wrap: anywhere; }
.na-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 6px; background: var(--a-info); }
.na-dot-warning { background: var(--a-warning-line); }
.na-dot-critical { background: var(--a-critical-bg); }

.nq-alert-progress-head { display: flex; justify-content: space-between; gap: 10px; color: var(--a-ink); margin-bottom: 8px; }
.nq-alert-progress { position: relative; height: 12px; border-radius: 12px; background: var(--a-ice); overflow: hidden; }
.nq-alert-progress span { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 12px; }
.nq-alert-progress .is-seen { background: color-mix(in srgb, var(--nq-aurora, #279c84) 45%, transparent); }
.nq-alert-progress .is-ack { background: var(--nq-aurora, #279c84); }
.nq-alert-sub { font-family: var(--a-display); font-size: 0.95rem; font-weight: 700; color: var(--a-ink); margin: 20px 0 8px; display: flex; gap: 8px; align-items: center; }
.nq-alert-done { color: var(--nq-aurora, #279c84); font-weight: 600; margin: 0; display: flex; gap: 6px; align-items: center; }
.nq-alert-missing { list-style: none; margin: 0; padding: 0; }
.nq-alert-missing li { display: flex; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--a-border); }
.nq-alert-missing li:last-child { border-bottom: 0; }
.nq-alert-missing img { width: 36px; height: 36px; border-radius: 50%; flex: 0 0 36px; }
.nq-alert-who { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.nq-alert-who strong { color: var(--a-ink); }
.nq-alert-who small { color: var(--a-muted); }
.nq-alert-seen-note { color: var(--a-warning) !important; }
.nq-alert-tel { display: inline-flex; align-items: center; gap: 5px; padding: 6px 12px; border-radius: 999px; background: var(--a-ice); font-weight: 600; font-size: 0.86rem; text-decoration: none; white-space: nowrap; }
.nq-alert-tel.is-none { background: none; color: var(--a-muted); font-weight: 400; font-size: 0.8rem; padding: 0; white-space: normal; text-align: right; }

.na-toast {
  position: fixed;
  left: 50%;
  bottom: 24px;
  transform: translate(-50%, 20px);
  opacity: 0;
  z-index: 2000;
  background: var(--a-ink);
  color: var(--a-surface);
  padding: 10px 18px;
  border-radius: 12px;
  font-weight: 600;
  box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.5);
  transition: opacity 0.2s, transform 0.2s;
  max-width: calc(100vw - 32px);
}
.na-toast.is-in { opacity: 1; transform: translate(-50%, 0); }
.na-toast.is-bad { background: var(--a-critical-bg); color: #fff; }

@media (max-width: 991.98px) {
  .na-cols, .na-detail { grid-template-columns: minmax(0, 1fr); }
  .na-col-preview { position: static; }
  .nq-head { flex-wrap: wrap; }
  .na-head-actions { justify-content: flex-start; }
  .na-resend-wait { text-align: left; margin-top: -6px; }
}
@media (max-width: 575.98px) {
  .na-card { padding: 14px; }
  .na-levels { grid-template-columns: minmax(0, 1fr); }
  .na-row { padding: 10px 12px; gap: 10px; flex-wrap: wrap; }
  .na-row-stat { align-items: flex-start; flex-basis: 100%; padding-left: 34px; }
  .na-row-go { display: none; }
  .na-head-actions .btn span { display: none; }
  .na-head-actions .btn i { font-size: 1.15rem; }
  .nq-alert-missing li { flex-wrap: wrap; }
  .nq-alert-who { flex-basis: calc(100% - 60px); }
  .nq-alert-tel { margin-left: 48px; }
}

/* widget */
.nq-alerts-widget .na-w-item { display: flex; gap: 10px; align-items: flex-start; }
#alerts-widget .nq-alerts-widget .na-w-item > i { font-size: 1.25rem; color: var(--a-info); margin-top: 1px; }
#alerts-widget .nq-alerts-widget .na-w-warning > i { color: var(--a-warning); }
#alerts-widget .nq-alerts-widget .na-w-critical > i { color: var(--a-critical); }
.nq-alerts-widget .na-w-item span { display: flex; flex-direction: column; min-width: 0; }
.nq-alerts-widget .na-w-item strong { color: var(--a-ink); overflow-wrap: anywhere; font-size: 0.92rem; }
.nq-alerts-widget .na-w-item small { color: var(--a-muted); }
body.nanoq-arctic #alerts-widget .Nanoq-widget-header h6::before { content: "\ec68"; }

/* the welcome banner on the dashboard */
body.nanoq-arctic .nanoq-hero-alert { margin: 0 14px 6px 0; }
body.nanoq-arctic .nanoq-hero-alert:hover { text-decoration: none; }
body.nanoq-arctic .nanoq-hero-tasks.nanoq-hero-alert-warning i { color: #b9620f; }
body.nanoq-arctic .nanoq-hero-tasks.nanoq-hero-alert-critical i { color: #c2415c; }
[data-bs-theme=dark] body.nanoq-arctic .nanoq-hero-tasks.nanoq-hero-alert-warning i { color: #f2c46b; }
[data-bs-theme=dark] body.nanoq-arctic .nanoq-hero-tasks.nanoq-hero-alert-critical i { color: #ff9aac; }

/* 1.22.0: the project boards are fixed to the window – start them below the alert banner (js/alerts.js sets --nq-alerts-bottom) */
html #kanban-boards-wrap { top: var(--nq-alerts-bottom, 0px); height: auto; }
@media (max-width: 1199.98px) {
  html #kanban-boards-wrap { top: var(--nq-alerts-bottom, 0px); padding-top: max(0px, calc(72px - var(--nq-alerts-bottom, 0px))); }
}