/* Panel administracyjny (Django admin) — dopasowanie do reszty aplikacji
   (FAKT-44). Django admin od 4.0 wystawia własną paletę jako CSS custom
   properties w :root (admin/css/base.css) — nadpisujemy je tutaj zamiast
   przepisywać selektory admina, więc to nadpisanie przeżyje aktualizacje
   Django. Wartości tokenów 1:1 z static/css/invoices.css (sidebar/lista
   faktur) — CELOWO nie z pulpit.css, bo pulpit ma świadomie odrębną paletę
   (patrz komentarz na górze pulpit.css), a admin jest częścią tego samego
   szkieletu nawigacji co sidebar (linki "Przebiegi synchronizacji" /
   "Ustawienia" w sidebar.nav prowadzą właśnie tutaj).

   Self-hostowane fonty — te same pliki co invoices.css, patrz komentarz
   tam (static/fonts/, SIL Open Font License, static/fonts/LICENSE.txt).
   Ścieżki względne do TEGO pliku (static/css/), czyli identyczne jak w
   invoices.css. */
@font-face{ font-family:'IBM Plex Sans'; font-weight:400; font-style:normal; font-display:swap; src:url("../fonts/IBMPlexSans-Regular.5aaadb685d3c.woff2") format('woff2'); }
@font-face{ font-family:'IBM Plex Sans'; font-weight:500; font-style:normal; font-display:swap; src:url("../fonts/IBMPlexSans-Medium.02ec16345450.woff2") format('woff2'); }
@font-face{ font-family:'IBM Plex Sans'; font-weight:600; font-style:normal; font-display:swap; src:url("../fonts/IBMPlexSans-SemiBold.51d76d33ef85.woff2") format('woff2'); }
@font-face{ font-family:'IBM Plex Sans'; font-weight:700; font-style:normal; font-display:swap; src:url("../fonts/IBMPlexSans-Bold.ea5f696de389.woff2") format('woff2'); }
@font-face{ font-family:'IBM Plex Mono'; font-weight:400; font-style:normal; font-display:swap; src:url("../fonts/IBMPlexMono-Regular.b51685c998a0.woff2") format('woff2'); }
@font-face{ font-family:'IBM Plex Mono'; font-weight:500; font-style:normal; font-display:swap; src:url("../fonts/IBMPlexMono-Medium.91abacd323ba.woff2") format('woff2'); }

/* Django ma wbudowany przełącznik jasny/ciemny/auto (admin/js/theme.js,
   ustawia atrybut data-theme="light"/"dark" na <html>, a przy "auto" nie
   ustawia nic i liczy się prefers-color-scheme). Reszta aplikacji nie ma
   trybu ciemnego, więc branding admina ma wyglądać tak samo niezależnie
   od przełącznika — nadpisujemy WSZYSTKIE trzy warianty (jasny, ciemny
   explicit, ciemny przez media query — dokładnie te same selektory co
   admin/css/base.css i admin/css/dark_mode.css) tymi samymi wartościami.
   Czysty CSS nie ma mixinów, stąd trzy razy ta sama lista zmiennych. */
html[data-theme="light"],
:root{
  --primary: oklch(47% 0.15 255);        /* invoices.css --accent (niebieski) */
  --primary-fg: #fff;
  --secondary: oklch(21% 0.018 262);     /* invoices.css --sidebar-bg (granat) */
  --accent: oklch(80% 0.07 255);         /* jasny błękit — kolor marki w nagłówku */

  --body-fg: oklch(24% 0.012 260);       /* invoices.css --text */
  --body-bg: oklch(97.3% 0.004 95);      /* invoices.css --bg */
  --body-quiet-color: oklch(50% 0.012 260); /* invoices.css --text-muted */
  --body-medium-color: oklch(38% 0.012 260);
  --body-loud-color: oklch(14% 0.012 260);

  --header-color: oklch(93% 0.008 260);      /* invoices.css --sidebar-text */
  --header-branding-color: var(--accent);
  --header-bg: var(--secondary);
  --header-link-color: oklch(93% 0.008 260);

  --breadcrumbs-fg: oklch(64% 0.016 262);    /* invoices.css --sidebar-text-muted */
  --breadcrumbs-link-fg: oklch(93% 0.008 260);
  --breadcrumbs-bg: oklch(27% 0.024 262);    /* invoices.css --sidebar-bg-raised */

  --link-fg: oklch(47% 0.15 255);
  --link-hover-color: oklch(40% 0.14 255);
  --link-selected-fg: var(--secondary);

  --hairline-color: oklch(89% 0.006 95);     /* invoices.css --border */
  --border-color: oklch(80% 0.008 95);       /* invoices.css --border-strong */

  --error-fg: oklch(55% 0.19 25);            /* invoices.css --danger */
  --message-success-bg: oklch(94% 0.05 152); /* invoices.css --success-soft */
  --message-warning-bg: oklch(94% 0.06 75);  /* invoices.css --warning-soft */
  --message-error-bg: oklch(94% 0.05 25);    /* invoices.css --danger-soft */

  --darkened-bg: oklch(95% 0.004 260);       /* invoices.css --neutral-soft */
  --selected-bg: oklch(94% 0.03 255);        /* invoices.css --accent-soft */
  --selected-row: oklch(94% 0.06 75);

  --button-fg: #fff;
  --button-bg: var(--secondary);
  --button-hover-bg: oklch(27% 0.024 262);
  --default-button-bg: oklch(27% 0.024 262);
  --default-button-hover-bg: var(--secondary);
  --close-button-bg: oklch(27% 0.024 262);
  --close-button-hover-bg: var(--secondary);
  --delete-button-bg: oklch(55% 0.19 25);
  --delete-button-hover-bg: oklch(46% 0.17 25);

  --font-family-primary: 'IBM Plex Sans', "Segoe UI", system-ui, Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-family-monospace: 'IBM Plex Mono', ui-monospace, Menlo, Monaco, "Cascadia Mono", monospace;

  color-scheme: light;
}

/* Ciemny motyw wybrany ręcznie w przełączniku admina — te same wartości. */
html[data-theme="dark"]{
  --primary: oklch(47% 0.15 255);
  --primary-fg: #fff;
  --secondary: oklch(21% 0.018 262);
  --accent: oklch(80% 0.07 255);

  --body-fg: oklch(24% 0.012 260);
  --body-bg: oklch(97.3% 0.004 95);
  --body-quiet-color: oklch(50% 0.012 260);
  --body-medium-color: oklch(38% 0.012 260);
  --body-loud-color: oklch(14% 0.012 260);

  --header-color: oklch(93% 0.008 260);
  --header-branding-color: var(--accent);
  --header-bg: var(--secondary);
  --header-link-color: oklch(93% 0.008 260);

  --breadcrumbs-fg: oklch(64% 0.016 262);
  --breadcrumbs-link-fg: oklch(93% 0.008 260);
  --breadcrumbs-bg: oklch(27% 0.024 262);

  --link-fg: oklch(47% 0.15 255);
  --link-hover-color: oklch(40% 0.14 255);
  --link-selected-fg: var(--secondary);

  --hairline-color: oklch(89% 0.006 95);
  --border-color: oklch(80% 0.008 95);

  --error-fg: oklch(55% 0.19 25);
  --message-success-bg: oklch(94% 0.05 152);
  --message-warning-bg: oklch(94% 0.06 75);
  --message-error-bg: oklch(94% 0.05 25);

  --darkened-bg: oklch(95% 0.004 260);
  --selected-bg: oklch(94% 0.03 255);
  --selected-row: oklch(94% 0.06 75);

  --close-button-bg: oklch(27% 0.024 262);
  --close-button-hover-bg: var(--secondary);

  color-scheme: light;
}

/* Ciemny motyw z ustawień systemu operacyjnego, gdy w adminie wybrano
   "auto" (brak atrybutu data-theme) — patrz admin/css/dark_mode.css. */
@media (prefers-color-scheme: dark){
  :root{
    --primary: oklch(47% 0.15 255);
    --primary-fg: #fff;
    --secondary: oklch(21% 0.018 262);
    --accent: oklch(80% 0.07 255);

    --body-fg: oklch(24% 0.012 260);
    --body-bg: oklch(97.3% 0.004 95);
    --body-quiet-color: oklch(50% 0.012 260);
    --body-medium-color: oklch(38% 0.012 260);
    --body-loud-color: oklch(14% 0.012 260);

    --header-color: oklch(93% 0.008 260);
    --header-branding-color: var(--accent);
    --header-bg: var(--secondary);
    --header-link-color: oklch(93% 0.008 260);

    --breadcrumbs-fg: oklch(64% 0.016 262);
    --breadcrumbs-link-fg: oklch(93% 0.008 260);
    --breadcrumbs-bg: oklch(27% 0.024 262);

    --link-fg: oklch(47% 0.15 255);
    --link-hover-color: oklch(40% 0.14 255);
    --link-selected-fg: var(--secondary);

    --hairline-color: oklch(89% 0.006 95);
    --border-color: oklch(80% 0.008 95);

    --error-fg: oklch(55% 0.19 25);
    --message-success-bg: oklch(94% 0.05 152);
    --message-warning-bg: oklch(94% 0.06 75);
    --message-error-bg: oklch(94% 0.05 25);

    --darkened-bg: oklch(95% 0.004 260);
    --selected-bg: oklch(94% 0.03 255);
    --selected-row: oklch(94% 0.06 75);

    --close-button-bg: oklch(27% 0.024 262);
    --close-button-hover-bg: var(--secondary);

    color-scheme: light;
  }
}

/* Znak marki "NN" przy nazwie systemu w nagłówku — ten sam motyw co
   .sidebar-brand .mark w invoices.css, czysto przez CSS (bez zmian w
   admin/base_site.html). */
#site-name a{ display:inline-flex; align-items:center; gap:10px; }
#site-name a::before{
  content:"NN";
  display:inline-flex; align-items:center; justify-content:center;
  width:26px; height:26px; border-radius:7px; flex:none;
  background:var(--primary); color:#fff;
  font-size:12px; font-weight:700; font-family:'IBM Plex Sans', sans-serif;
}

/* FAKT-46 — boczny panel jak na stronie głównej (markup w
   templates/admin/base.html, blok extrabody — patrz komentarz tam po
   szczegóły dlaczego akurat tak, zamiast ruszać #container Admina).
   Klasy .sidebar* są 1:1 z static/css/invoices.css, ale ten plik nie
   ładuje się w adminie, więc nie ma podwójnych definicji/konfliktu
   specyficzności — kolory przez zmienne z bloku wyżej zamiast literałów,
   żeby zostały spójne z resztą tego pliku. */
body{ display:flex; min-height:100vh; }
#container{ flex:1; min-width:0; order:2; }

.sidebar{
  width:232px; flex:none; order:1; background:var(--secondary);
  display:flex; flex-direction:column; padding:20px 14px; gap:22px;
  font-family:'IBM Plex Sans', sans-serif;
}
.sidebar-brand{ display:flex; align-items:center; gap:10px; padding:0 6px; }
.sidebar-brand .mark{
  width:30px; height:30px; border-radius:8px; background:var(--primary); color:#fff;
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:13px; flex:none;
}
.sidebar-brand .names{ display:flex; flex-direction:column; line-height:1.25; }
.sidebar-brand .app-name{ font-size:13.5px; font-weight:600; color:var(--header-color); }
.sidebar-brand .org-name{ font-size:11px; color:var(--breadcrumbs-fg); }

.sidebar-nav{ display:flex; flex-direction:column; gap:2px; }
.sidebar-nav a{
  display:flex; align-items:center; gap:10px; padding:9px 10px; border-radius:7px;
  color:var(--breadcrumbs-fg); font-size:13.5px; font-weight:500; text-decoration:none;
}
.sidebar-nav a:hover{ color:#fff; text-decoration:none; }
.sidebar-nav a.active{ background:var(--breadcrumbs-bg); color:#fff; font-weight:600; }

.sidebar-footer{ margin-top:auto; display:flex; flex-direction:column; gap:10px; }
.sidebar-footer hr{ border:none; height:1px; background:var(--breadcrumbs-bg); margin:0; }
a.sidebar-user-link{ display:block; border-radius:8px; text-decoration:none; }
a.sidebar-user-link:hover{ background:var(--breadcrumbs-bg); }
.sidebar-user{ display:flex; align-items:center; gap:10px; padding:6px; }
.sidebar-user .avatar{
  width:28px; height:28px; border-radius:50%; background:var(--breadcrumbs-bg); color:var(--header-color);
  display:flex; align-items:center; justify-content:center; font-size:11.5px; font-weight:600; flex:none;
  object-fit:cover;
}
.sidebar-user .names{ display:flex; flex-direction:column; line-height:1.25; overflow:hidden; }
.sidebar-user .display-name{ font-size:12.5px; font-weight:600; color:var(--header-color); white-space:nowrap; }
.sidebar-user .email{ font-size:10.5px; color:var(--breadcrumbs-fg); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sidebar-version{ font-size:10px; color:var(--breadcrumbs-fg); padding:0 6px; }

/* Poniżej szerokości, na której Django i tak chowa własny #nav-sidebar
   (patrz admin/css/responsive.css) — panel przechodzi nad treść zamiast
   obok, żeby nie ściskać contentu na telefonie. */
@media (max-width: 767px){
  body{ flex-direction:column; }
  .sidebar{ width:auto; order:0; }
  #container{ order:1; }
}