/* Nagłówek nad treścią (UserMenu): imię pracownika, pastylka oddziału i pasek komunikatu
   ("Krótki komunikat" z zakładki Powiadomienia).
   Komunikat jak czerwony kafelek Pulpitu (pulpit-tile-bad): pastelowe tło + mocna czerwona lewa krawędź.
   Pełna czerwień była za mocna (decyzja właściciela 2026-10-02), bursztyn / niebieski za słabe - zostaje czerwony ton.
   Prefiks :root, bo styles.css (Valo) wczytuje się po arkuszach z @StyleSheet. */

:root .mytheme .v-csslayout.naglowek {
  display: flex;
  align-items: center;
  gap: 12px;
  box-sizing: border-box;
  min-height: 58px;
  /* prawa krawędź komunikatu = prawa krawędź treści karty poniżej
     (padding-right 12.33px + ramka 1px + padding karty 12.33px), inaczej wystawał w prawo */
  padding: 9px 26px 9px 12px;
}

/* imię + pastylka oddziału: wspólna linia bazowa tekstu. Wyśrodkowane osobno (16px i 12px) rozjeżdżały się
   o 0,6-1px zależnie od powiększenia przeglądarki - imię wyglądało na niższe od pastylki */
:root .mytheme .v-csslayout.naglowek > .v-csslayout.naglowek-kto {
  flex: none;
  display: flex;
  align-items: baseline;
  gap: 12px;
}

:root .mytheme .v-label.naglowek-imie {
  font-size: 16px;
  font-weight: 700;
  color: #303030;
  white-space: nowrap;
}

/* pastylka oddziału: kolory "oddział" z tabeli wartości kanonicznych; zwykły tekst w linii (nie flex),
   żeby linia bazowa pastylki była linią bazową jej tekstu */
:root .mytheme .v-label.naglowek-oddzial {
  padding: 3px 10px;
  border-radius: 999px;
  background: #f1f7fb;
  color: #36566c;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
  white-space: nowrap;
}

:root .mytheme .v-label.naglowek-oddzial .v-icon {
  margin-right: 6px;
  font-size: 12px;
}

:root .mytheme .naglowek-oddzial-adres {
  margin-left: 4px;
  font-weight: 400;
}

/* pasek komunikatu: zajmuje resztę szerokości, długi tekst zawija się zamiast uciekać */
:root .mytheme .v-csslayout.naglowek > .v-label.naglowek-komunikat {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  box-sizing: border-box;
  padding: 7px 14px 7px 10px;
  border: 1px solid #efc9c9;
  border-left: 4px solid #c65353;
  border-radius: 9px;
  background: #fff0f0;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
  color: #303030;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.45;
  white-space: normal;
  overflow-wrap: anywhere;
}

:root .mytheme .naglowek-komunikat-ikona {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #c65353;
  color: #fff;
}

:root .mytheme .naglowek-komunikat-ikona .v-icon {
  font-size: 14px;
  line-height: 1;
}

:root .mytheme .naglowek-komunikat-tekst {
  min-width: 0;
}

:root .mytheme .naglowek-komunikat b {
  font-weight: 800;
  color: #7a2e2e;
}