/* ═══════════════════════════════════════════════════════════════════════════
   Szata panelu Zawody OSP — barwy emblematu KSRG (docs/marka/KOLORY.md):
   czarny pasek ze złotą krawędzią, złoty akcent (motyw Fluent #8F7536 w appsettings.json),
   czerwień na „Nowy”, ciepłe jasne tło. Wzorzec: przepisy.css z Naszych Przepisów.

   UWAGA NA KOLEJNOŚĆ: XAF dokłada swój styles.css PO tym pliku — selektory zaczynają się
   od body.dxbl-theme-fluent (wyższa szczegółowość). Klasy z drzewa strony XAF 26.1.5:
   .header, .header-logo, .btn-header, .xaf-sidebar, .xaf-navmenu, .main-toolbar, .logon-template-body.
   ═══════════════════════════════════════════════════════════════════════════ */

:root {
  --zo-czern: #0d0d0d;
  --zo-zloto: #c2a55a;
  --zo-zloto-jasne: #e8cf86;
  --zo-zloto-ciemne: #8f7536;
  --zo-czerwien: #a81313;
  --zo-czerwien-ciemna: #860f0f;
  --zo-tlo: #f7f6f2;
  --zo-linia: #e2ded3;
  --zo-zloto-tlo: #f3ecd8;
}

body.dxbl-theme-fluent,
body.dxbl-theme-fluent .app {
  background-color: var(--zo-tlo);
}

/* ── Pasek górny: czerń ze złotą krawędzią ───────────────────────────────── */
body.dxbl-theme-fluent .app > .header {
  background-color: var(--zo-czern);
  color: #f1f0ec;
  border-bottom: 3px solid var(--zo-zloto);
}
body.dxbl-theme-fluent .app > .header .btn-header,
body.dxbl-theme-fluent .app > .header .xaf-view-caption-lg {
  color: #f1f0ec;
}
body.dxbl-theme-fluent .app > .header .header-logo {
  color: var(--zo-zloto);
}
body.dxbl-theme-fluent .app > .header .btn-header:hover,
body.dxbl-theme-fluent .app > .header .btn-header:focus-visible {
  background-color: rgba(194, 165, 90, 0.22);
  color: #fff;
}
body.dxbl-theme-fluent .app > .header .xaf-caption-icon-container {
  background-color: #fff;
  border-radius: 5px;
}

/* ── Menu boczne ─────────────────────────────────────────────────────────── */
body.dxbl-theme-fluent .app .xaf-sidebar {
  background-color: var(--zo-tlo);
  border-right: 1px solid var(--zo-linia);
}
body.dxbl-theme-fluent .xaf-navmenu .dxbl-treeview-item-container:hover {
  background-color: rgba(143, 117, 54, 0.10);
}
body.dxbl-theme-fluent .xaf-navmenu .dxbl-treeview-item-container.dxbl-active {
  background-color: var(--zo-zloto-tlo);
  color: var(--zo-czern);
  font-weight: 600;
}

/* ── „Nowy” w czerwieni ──────────────────────────────────────────────────── */
body.dxbl-theme-fluent .main-toolbar [data-action-name="Nowy"],
body.dxbl-theme-fluent .dxbl-popup [data-action-name="Nowy"] {
  background-color: var(--zo-czerwien);
  border-color: var(--zo-czerwien);
  color: #fff;
}
body.dxbl-theme-fluent .main-toolbar [data-action-name="Nowy"]:hover,
body.dxbl-theme-fluent .dxbl-popup [data-action-name="Nowy"]:hover {
  background-color: var(--zo-czerwien-ciemna);
  border-color: var(--zo-czerwien-ciemna);
  color: #fff;
}
body.dxbl-theme-fluent .main-toolbar [data-action-name="Nowy"] img,
body.dxbl-theme-fluent .main-toolbar [data-action-name="Nowy"] svg,
body.dxbl-theme-fluent .dxbl-popup [data-action-name="Nowy"] img,
body.dxbl-theme-fluent .dxbl-popup [data-action-name="Nowy"] svg {
  filter: brightness(0) invert(1);
}

/* ── Ekran logowania ─────────────────────────────────────────────────────── */
body.dxbl-theme-fluent:has(.logon-template-body) {
  background: linear-gradient(180deg, #2a2a2a 0, var(--zo-czern) 140px, var(--zo-tlo) 140px) fixed;
}
body.dxbl-theme-fluent:has(.logon-template-body) .app {
  background: transparent;
}
body.dxbl-theme-fluent .app > .logon-template-header {
  background: var(--zo-czern) !important;
  color: #f1f0ec;
  border: 0;
  border-bottom: 3px solid var(--zo-zloto);
  border-radius: 0;
  min-height: 50px;
  justify-content: center;
}
body.dxbl-theme-fluent .app > .logon-template-header .header-logo {
  color: var(--zo-zloto);
}
body.dxbl-theme-fluent .logon-template-body .card {
  border: 1px solid var(--zo-linia);
  border-radius: 14px;
  box-shadow: 0 14px 34px rgba(13, 13, 13, 0.14);
}
@media (max-width: 576px) {
  body.dxbl-theme-fluent .logon-template-body .card {
    width: calc(100% - 32px);
    margin-inline: auto;
  }
}