/* Arkusz układu okna centrum dowodzenia. Nadpisania klas biblioteki są ograniczone
   selektorem .cd-strona i nie wychodzą poza to okno. Powód każdego z nich to kompozycja
   pulpitu centrum, nie zmiana biblioteki dla innych okien: centrum obrysowuje swój obszar
   barwą znaku (--dn-obrys-marki na .dn-narzedzia i .dn-obszar-panel), wyróżnia kartę
   bieżącą tłem (--dn-tlo-wybrane) i dostraja pasmo kart oraz pasek obszaru do pulpitu. */

/* Bez domieszki tło karty bieżącej zrównuje się z belką, więc wybór musi nieść
   wstęga. Same barwy zapasowe stoją przy żetonach w zetony.css. */
.dn-obszar-panel--boczny[data-strona='prawo'] { order: 9; }

.cd-panel-stopka {
  display: flex;
  flex-direction: column;
  gap: var(--dn-od-05);
  margin-top: auto;
  padding: var(--dn-od-2);
}

.cd-panel-stopka-nazwa { flex: 1 1 auto; min-width: 0; }

.cd-strona .dn-panel-drzewo .dn-obszar-pozycja { padding-left: 0; }

.cd-strona .dn-karty-pasmo { --kart-ikona-sterowania: var(--dn-wym-ikona); }

.cd-strona .dn-karty-pasmo svg,
.cd-strona .dn-obszar-pasek svg {
  width: var(--dn-wym-ikona);
  height: var(--dn-wym-ikona);
}

.cd-strona .dn-obszar-pasek {
  margin: var(--dn-od-2);
  padding: 0 var(--dn-od-2);
  gap: var(--dn-od-1);
  height: var(--dn-od-10);
  overflow-x: auto;
  scrollbar-width: none;
}

.cd-strona .dn-obszar-pasek::-webkit-scrollbar { display: none; }

.cd-strona .dn-obszar-pasek .dn-obszar-sterowanie { margin-left: auto; display: flex; align-items: center; gap: var(--dn-od-1); }

.cd-strona .dn-obszar-pasek .dn-btn-ikona {
  width: 32px;
  height: 32px;
  min-width: 32px;
  flex: none;
}

.cd-strona .dn-obszar-panel--boczny .dn-obszar-tresc { padding-top: var(--dn-od-10); }

.cd-strona .dn-obszar-panel--boczny { width: var(--cd-szer-boczny, 280px); }

.cd-strona .dn-obszar-panel--samouczek { width: var(--cd-szer-samouczek, 320px); }

.cd-strona .dn-obszar-panel--boczny[data-zwiniety='tak'] {
  width: 0;
  min-width: 0;
  overflow: hidden;
}

.cd-strona .dn-obszar-panel--boczny[data-zwiniety='tak'][data-podglad='tak'] {
  width: var(--cd-szer-boczny, 280px);
  min-width: 220px;
  overflow: visible;
}

.cd-krawedz-podgladu {
  position: fixed;
  top: 0;
  bottom: 0;
  width: 10px;
  z-index: 40;
  display: none;
}

.cd-strona:has(.dn-obszar-panel--boczny[data-zwiniety='tak']) .cd-krawedz-podgladu { display: block; }

.cd-strona .dn-karty-lista ~ .dn-karty-dodaj::after {
  left: calc(-2 * var(--kart-odstep-sterowania));
}

.cd-strona .dn-karta-widoku[aria-selected='true']::before,
.cd-strona .dn-karta-widoku[aria-selected='true']::after {
  top: 50%;
  bottom: auto;
  height: var(--kart-przegroda-wys);
  transform: translateY(-50%);
}

.cd-strona .dn-obszar-panel--boczny { margin-left: 0; }

.cd-strona .dn-obszar-panel--samouczek { margin-right: 0; }

.cd-strona .dn-obszar-panel--samouczek[hidden] + .dn-uchwyt,
.cd-strona .dn-uchwyt:has(+ .dn-obszar-panel--samouczek[hidden]) { display: none; }

.cd-strona .sta-menu-wiersz > .dn-btn-ikona > svg {
  width: var(--dn-wym-ikona);
  height: var(--dn-wym-ikona);
}

.cd-strona .dn-obszar-pasek .dn-pasek-okna {
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
  min-height: 0;
  padding: 0;
  gap: var(--dn-od-1);
}

.cd-strona .dn-obszar-pasek .dn-pasek-okna-odstep { display: none; }

.cd-strona .dn-obszar-pasek .dn-pasek-okna-nadmiar { margin-left: 0; }

.cd-strona .dn-obszar-pasek .dn-pasek-okna-rozdzielacz { height: var(--dn-wym-ikona); }
