/* ==== Tabele (Grid) - wspólny wygląd w całym systemie ====
   Pilotaż w Dniówce 2026-10-02, tego samego dnia zatwierdzony przez właściciela dla wszystkich tabel.
   Wartości: kontener listy i nagłówek tabeli z tabeli „Wartości kanoniczne” (docs/UI_STYLE_VAADIN8.md),
   jasne linie #e8e8e8 między wierszami i kolumnami (właściciel: linie pomagają w czytelności), zebra Valo
   zostaje, zaznaczony wiersz jak zaznaczony kafelek radio (#fff3dc / #d59b35).

   Kaskada (ważne przy zmianach):
   - styles.css (Valo) wczytuje się PO arkuszach z @StyleSheet, więc każda reguła tu ma specyficzność
     o jeden stopień wyższą niż jej odpowiednik w Valo (prefiks :root).
   - Ten arkusz jest PIERWSZY na liście w LoginUI, więc przy remisie wygrywają arkusze modułów
     (wanted-, pulpit-, pw-, an-, etykiety- itd.): ich kontenery, nagłówki i tinty wierszy zostają.
   - Tła i koloru tekstu zwykłych wierszy arkusz nie ustawia (tylko najechanie i zaznaczenie), żeby
     kolory wierszy z modułów (czerwony po terminie, inw-*, wanted-row-* itd.) działały dalej. */

/* ---- kontener: zaokrąglona biała karta zamiast kratki ---- */
:root .mytheme .v-grid {
  overflow: hidden;
  border: 1px solid #dedede;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
}

:root .mytheme .v-grid-tablewrapper,
:root .mytheme .v-grid-scroller-vertical,
:root .mytheme .v-grid-scroller-horizontal {
  border: 0;
}

/* narożniki obok pasków przewijania: płasko, bez gradientu */
:root .mytheme .v-grid-header-deco {
  border: 0;
  border-bottom: 1px solid #e8e8e8;
  background: #fafafa;
}

:root .mytheme .v-grid-footer-deco,
:root .mytheme .v-grid-horizontal-scrollbar-deco {
  border: 0;
  background: #fff;
}

/* ---- nagłówek: płaski #fafafa, jasne linie jak w treści ---- */
:root .mytheme .v-grid-header .v-grid-cell {
  border-left: 1px solid #e8e8e8;
  border-bottom: 1px solid #e8e8e8;
  background: #fafafa;
  color: #555;
  font-size: 13px;
  font-weight: 400;
}

:root .mytheme .v-grid-header .v-grid-cell:first-child {
  border-left: 0;
}

/* podpisy kolumn (domyślny wiersz nagłówka): drobne wersaliki, prawie czarne jak tytuł strony */
:root .mytheme .v-grid-column-default-header-content {
  color: #282828;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* wiersz filtrów (FiltryGrida): pola i listy jak niskie pola formularza */
:root .mytheme .v-grid-header .v-textfield {
  height: 28px;
  padding: 0 9px;
  border: 1px solid #dedede;
  border-radius: 6px;
  background: #fff;
  box-shadow: none;
  color: #303030;
  font-size: 12px;
  font-weight: 400;
}

/* wszystkie tabele (od 2026-11-04, decyzja usera): grid liczy szerokość kolumny z treści, także nagłówka, a pole "zawiera..."
   ma naturalne ~140px (domyślny rozmiar inputa) - kolumna z datą czy "KW" była przez to szeroka. width 0 = pole nie
   wlicza się do szerokości kolumny, min-width 100% = i tak wypełnia kolumnę (szerokość daje treść i podpis kolumny).
   Bez pola w DateField (filtr daty) - ono dzieli miejsce z przyciskiem kalendarza */
:root .mytheme .v-grid-header .v-textfield:not(.v-datefield-textfield) {
  width: 0 !important;
  min-width: 100%;
}

:root .mytheme .v-grid-header .v-textfield:focus {
  border-color: #d59b35;
  box-shadow: 0 0 0 3px rgba(213, 155, 53, 0.18);
}

:root .mytheme .v-grid-header .v-popupview {
  display: inline-block;
  box-sizing: border-box;
  height: 28px;
  padding: 0 10px;
  border: 1px solid #dedede;
  border-radius: 6px;
  background: #fff;
  color: #555;
  font-size: 12px;
  font-weight: 600;
  line-height: 26px;
  letter-spacing: 0;
  text-decoration: none;
  text-transform: none;
  vertical-align: middle;
  white-space: nowrap;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
}

:root .mytheme .v-grid-header .v-popupview:hover {
  border-color: #d59b35;
  background: #fffaf0;
  color: #303030;
}

/* kolumny liczbowe (FiltryGrida.zakres): lejek z okienkiem od-do wewnątrz pola liczby, przy prawej krawędzi */
/* min-width: grid liczy szerokość kolumny z treści, także nagłówka - wąska kolumna (Ilość) dostaje miejsce na wpis */
:root .mytheme .v-grid-header .filtr-liczba {
  position: relative;
  display: block;
  min-width: 88px;
}

:root .mytheme .v-grid-header .filtr-liczba .filtr-liczba-pole {
  width: 100%;
  padding-right: 28px;
}

:root .mytheme .v-grid-header .filtr-liczba .filtr-liczba-zakres {
  position: absolute;
  top: 1px;
  right: 1px;
  width: 26px;
  height: 26px;
  padding: 0;
  border: 0;
  border-radius: 0 5px 5px 0;
  background: transparent;
  color: #a6a6a6;
  font-size: 12px;
  line-height: 26px;
  text-align: center;
}

:root .mytheme .v-grid-header .filtr-liczba .filtr-liczba-zakres:hover {
  background: transparent;
  color: #d59b35;
}

/* ustawiony zakres od-do: ramka pola i lejek w kolorze akcentu, zakres w dymku lejka */
:root .mytheme .v-grid-header .filtr-liczba.filtr-liczba-aktywny .filtr-liczba-pole {
  border-color: #d59b35;
}

:root .mytheme .v-grid-header .filtr-liczba.filtr-liczba-aktywny .filtr-liczba-zakres {
  color: #d59b35;
}

/* lejek kolumny "Parametry" (sklep/FiltrParametrowWyrobu): typ wyrobu, zakresy cech, sploty. Okienko popupu leży poza
   gridem (nakładka w body), dlatego bez .v-grid-header; CssLayout + flex zamiast HorizontalLayout (pułapka PopupView) */
:root .mytheme .filtr-wyrob-okno {
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 440px;
  max-height: 460px;
  overflow-y: auto;
  padding: 4px 2px;
}

:root .mytheme .filtr-wyrob-okno .filtr-wyrob-naglowek,
:root .mytheme .filtr-wyrob-okno .filtr-wyrob-zakres > .v-label {
  color: #555;
  font-size: 12px;
  font-weight: 600;
}

:root .mytheme .filtr-wyrob-okno .filtr-wyrob-naglowek {
  margin-top: 4px;
}

:root .mytheme .filtr-wyrob-okno .filtr-wyrob-zakres {
  display: flex;
  align-items: center;
  gap: 8px;
}

:root .mytheme .filtr-wyrob-okno .filtr-wyrob-zakres > .v-label {
  width: 130px;
}

:root .mytheme .filtr-wyrob-okno .filtr-wyrob-zakres .v-textfield {
  width: 80px;
}

:root .mytheme .filtr-wyrob-okno .v-select-optiongroup-horizontal .v-select-option {
  margin: 0 14px 4px 0;
}

:root .mytheme .filtr-wyrob-okno .filtr-wyrob-info {
  color: #777;
  font-size: 12px;
  white-space: normal;
}

:root .mytheme .filtr-wyrob-okno > .v-button {
  align-self: flex-start;
  margin-top: 6px;
}

/* wiersz sum (Label w nagłówku) i stopka: liczby, nie podpis - ciemniej i pogrubione, rozmiar jak w komórkach */
:root .mytheme .v-grid-header .v-label {
  color: #303030;
  font-size: 14px;
  font-weight: 700;
}

:root .mytheme .v-grid-footer .v-grid-cell {
  border-left: 1px solid #e8e8e8;
  border-top: 1px solid #e8e8e8;
  border-bottom: 0;
  background: #fafafa;
  color: #303030;
  font-size: 14px;
  font-weight: 700;
}

:root .mytheme .v-grid-footer .v-grid-cell:first-child {
  border-left: 0;
}

/* ---- treść: jasne linie między wierszami i kolumnami (#e8e8e8 zamiast #d4d4d4 z Valo) ----
   grubość 600 jak w całej aplikacji ($v-font-weight) - właściciel: zwykła 400 była słabo czytelna */
:root .mytheme .v-grid-cell {
  font-size: 14px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

:root .mytheme .v-grid-row > td {
  border-left: 1px solid #e8e8e8;
  border-bottom: 1px solid #e8e8e8;
}

:root .mytheme .v-grid-row > td:first-child {
  border-left: 0;
}

/* najechanie: celowo bez :root - przy remisie wygrywają tinty wierszy z modułów */
.mytheme .v-grid-row-has-data:hover > td {
  background-color: #f7f7f8;
}

/* szary wiersz zebry (#f5f5f5 z Valo): #f7f7f8 zlewał się z tłem, więc ciemniej o tyle samo co na białym */
.mytheme .v-grid-row-stripe:hover > td {
  background-color: #ebebed;
}

/* zaznaczony wiersz: złoty tint jak zaznaczony kafelek radio (zamiast szarego gradientu Valo) */
:root .mytheme .v-grid-body .v-grid-row-selected > td,
:root .mytheme .v-grid-body .v-grid-row-selected:hover > td {
  border-left-color: #ead8b8;
  border-bottom-color: #ead8b8;
  background-color: #fff3dc;
  background-image: none;
  color: #282828;
}

:root .mytheme .v-grid-body .v-grid-row-selected > td:first-child {
  box-shadow: inset 3px 0 0 #d59b35;
}

/* ramka fokusu komórki: przy nawigacji klawiaturą; na zaznaczonym wierszu jej nie ma */
:root .mytheme .v-grid-cell-focused:before {
  border: 2px solid rgba(213, 155, 53, 0.55);
}

:root .mytheme .v-grid-row-selected > .v-grid-cell-focused:before {
  border-color: transparent;
}