/* =====================================================================
   UNIFY — jeden spójny system stylu. Doczepiany NA KOŃCU (po theme-premium),
   więc bije istniejące reguły kolejnością + !important. Odwracalne: usuń
   <link> z index.html i wszystko wraca jak było. Nie rusza układu ani funkcji.
   KROK 1: PRZYCISKI (kasuje 3 równoległe systemy + wojnę soft/solid).
   ===================================================================== */

/* =====================================================================
   KROK 25 (CAŁY SYSTEM): GRANAT (--navy, legacy akcent) -> JEDEN AKCENT.
   Audyt znalazł 168 wystąpień granatu w stanach aktywnych/zaznaczonych na
   WSZYSTKICH stronach (zakładki Timeline/segmented/billing, kropki, paski,
   linki, ramki zaznaczeń). Jedna podmiana tokena ujednolica je naraz na
   #3b6ef0. TYLKO w trybie jasnym — w ciemnym --navy=#cdd7ea służy do tekstu,
   więc go NIE ruszamy. Odwracalne: usuń tę regułę.
   ===================================================================== */
:root:not([data-theme="dark"]) {
  --navy: var(--accent) !important;
}

/* wspólna baza dla WSZYSTKICH wariantów guzika */
.button,
.primary-button,
.button-primary,
button.primary,
.ghost-button,
.danger-button,
.sold-button,
.icon-button {
  min-height: var(--control-h) !important;
  border-radius: var(--button-radius) !important;
  font-weight: 600 !important;
  font-size: 12.5px !important;
  letter-spacing: 0 !important;
  gap: 7px !important;
  box-shadow: none !important;
  transition: background .15s ease, border-color .15s ease, color .15s ease, transform .1s ease !important;
}
.button:active,
.primary-button:active,
.button-primary:active,
button.primary:active,
.danger-button:active,
.sold-button:active,
.icon-button:active { transform: scale(.97) !important; }

/* SECONDARY / neutralny = domyślny .button (i ghost) */
.button:not(.primary):not(.danger):not(.sold-button):not([data-btn-tone]),
.ghost-button:not([data-btn-tone]) {
  border: 1px solid var(--line-strong) !important;
  background: var(--surface) !important;
  color: var(--text) !important;
}
.button:not(.primary):not(.danger):not(.sold-button):not([data-btn-tone]):hover,
.ghost-button:not([data-btn-tone]):hover {
  background: var(--surface-muted) !important;
  border-color: var(--line-strong) !important;
}

/* PRIMARY = TINT akcentu (przezroczysty + ramka + kolorowy tekst) — spójny z
   systemem znaczeń (zielony=Zapisz/Dodaj, czerwony=Anuluj/Usuń). KONIEC „solid vs tint":
   wszystkie guziki są lekkie/przezroczyste z ramką, ikona dziedziczy kolor tekstu. */
.button.primary,
.primary-button,
.button-primary,
button.primary {
  border: 1px solid color-mix(in srgb, var(--accent) 50%, transparent) !important;
  background: color-mix(in srgb, var(--accent) 13%, transparent) !important;
  color: var(--accent) !important;
}
.button.primary:hover,
.primary-button:hover,
.button-primary:hover,
button.primary:hover {
  background: color-mix(in srgb, var(--accent) 22%, transparent) !important;
  border-color: var(--accent) !important;
  color: var(--accent) !important;
}

/* DANGER = czerwony tint (usuwanie, zamknięcie) */
.button.danger,
.danger-button,
.icon-button.danger,
.icon-button[data-action="close-modal"] {
  border: 1px solid color-mix(in srgb, var(--danger) 42%, transparent) !important;
  background: color-mix(in srgb, var(--danger) 10%, var(--surface)) !important;
  color: var(--danger) !important;
}
.button.danger:hover,
.danger-button:hover,
.icon-button.danger:hover,
.icon-button[data-action="close-modal"]:hover {
  background: color-mix(in srgb, var(--danger) 18%, var(--surface)) !important;
  border-color: var(--danger) !important;
}

/* SUCCESS / sprzedaż = zielony (zachowane znaczenie) */
.sold-button {
  border: 1px solid #168a4b !important;
  background: #168a4b !important;
  color: #ffffff !important;
}
.sold-button:hover { background: #11703c !important; border-color: #11703c !important; }
.sold-button.is-sold {
  border: 1px solid color-mix(in srgb, var(--green) 40%, transparent) !important;
  background: var(--green-soft) !important;
  color: #0a7d3c !important;
}

/* IKONOWE = kwadrat, ten sam rozmiar/rogi */
.icon-button {
  width: var(--icon-button-size) !important;
  padding: 0 !important;
}
.icon-button:not(.danger):not([data-action="close-modal"]) {
  border: 1px solid var(--line-strong) !important;
  background: var(--surface) !important;
  color: var(--text) !important;
}
.icon-button:not(.danger):not([data-action="close-modal"]):hover {
  background: var(--surface-muted) !important;
  color: var(--text) !important;
}

/* MINI = mniejszy, ale ten sam język */
.button.mini {
  min-height: var(--control-h-sm) !important;
  padding: 0 9px !important;
  font-size: 12px !important;
}

/* =====================================================================
   KROK 2: JEDEN DROPDOWN — wszystkie natywne <select> mają TEN SAM wygląd:
   ta sama czcionka (aplikacji, font:inherit), rozmiar 13px / 32px, ramka
   --line-strong, rogi --input-radius, strzałka --select-arrow-icon.
   Koniec „mały/duży, inny font, inna obramówka".
   Wyjątki ŚWIADOME: edytor Tekst/Skala (data-rich-*), pola waluty (doklejone
   do kwoty), ukryty nośnik combobox (.combo-native), <select multiple>.
   ===================================================================== */
select:not([multiple]):not([data-rich-font-size]):not([data-rich-image-size]):not(.combo-native):not([data-currency-select]):not([data-rate-currency]):not([data-crew-travel-manual-currency]):not([name="currency"]):not([name$="Currency"]) {
  appearance: none !important;
  -webkit-appearance: none !important;
  font: inherit !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  min-height: var(--control-h) !important;
  padding: 5px 30px 5px 10px !important;
  border: 1px solid var(--line-strong) !important;
  border-radius: var(--input-radius) !important;
  background-color: var(--surface) !important;
  color: var(--text) !important;
  background-image: var(--select-arrow-icon) !important;
  background-repeat: no-repeat !important;
  background-position: right 10px center !important;
  background-size: 14px 14px !important;
}

/* =====================================================================
   KROK 3: POLA TEKSTOWE (input/textarea) = jak dropdowny: ta sama ramka
   (--line-strong), 13px, czcionka aplikacji, rogi --input-radius.
   Wykluczamy .field-required-missing (czerwień wymaganego MUSI zostać) oraz
   checkbox/radio/range/color/file. Specyficzność (0,3,1) = bije motyw (.modal
   input 0,3,1) kolejnością, a niżej od reguły wymaganego (0,4,1).
   ===================================================================== */
.modal input[type="text"]:not(.field-required-missing),
.modal input[type="search"]:not(.field-required-missing),
.modal input[type="number"]:not(.field-required-missing),
.modal input[type="email"]:not(.field-required-missing),
.modal input[type="tel"]:not(.field-required-missing),
.modal input[type="url"]:not(.field-required-missing),
.modal input[type="date"]:not(.field-required-missing),
.modal input:not([type]):not(.field-required-missing),
.modal textarea:not(.field-required-missing),
.field input:not([type="checkbox"]):not([type="radio"]):not(.field-required-missing),
.field textarea:not(.field-required-missing),
.settings-form-body input:not([type="checkbox"]):not([type="radio"]):not(.field-required-missing),
.settings-form-body textarea:not(.field-required-missing) {
  font: inherit !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  border: 1px solid var(--line-strong) !important;
  border-radius: var(--input-radius) !important;
  background-color: var(--surface) !important;
  color: var(--text) !important;
}
.modal input[type="text"]:not(.field-required-missing),
.modal input[type="search"]:not(.field-required-missing),
.modal input[type="number"]:not(.field-required-missing),
.modal input[type="email"]:not(.field-required-missing),
.modal input[type="tel"]:not(.field-required-missing),
.modal input[type="url"]:not(.field-required-missing),
.modal input[type="date"]:not(.field-required-missing),
.modal input:not([type]):not(.field-required-missing),
.field input:not([type="checkbox"]):not([type="radio"]):not(.field-required-missing),
.settings-form-body input:not([type="checkbox"]):not([type="radio"]):not(.field-required-missing) {
  min-height: var(--control-h) !important;
}
.modal textarea:not(.field-required-missing),
.field textarea:not(.field-required-missing),
.settings-form-body textarea:not(.field-required-missing) {
  min-height: 72px !important;
  padding: 8px 10px !important;
}

/* Spójny focus: cienki ring w kolorze akcentu (zamiast różnych navy/accent).
   Czerwień pola wymaganego ma wyższą specyficzność, więc zostaje na czerwono. */
.modal input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
.modal textarea:focus,
.field input:focus,
.field textarea:focus,
select:not([multiple]):not([data-rich-font-size]):not([data-rich-image-size]):not(.combo-native):focus {
  outline: none !important;
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent) !important;
}

/* =====================================================================
   KROK 4: KOLOR IKON — jeden spójny. Ikony to maski (background-color:currentColor),
   więc dziedziczyły RÓŻNY kolor tekstu rodzica (raz --muted szary, raz --text czarny).
   Domyślnie WSZYSTKIE ikony = szary (--muted). Wyjątek = SEMANTYKA: kolorowe guziki
   (primary/danger/sold/tony), statusy i aktywne menu — ikona dziedziczy kolor kontekstu.
   ===================================================================== */
/* KOLOR ikon = DZIEDZICZONY z kontekstu (currentColor): czarne przy czarnych napisach,
   niebieskie na guziku akcentu, czerwone na danger. NIE narzucamy szarego.
   Ujednolicamy TYLKO ROZMIAR — żeby grubość/wielkość kreski była wszędzie taka sama. */
.icon {
  width: 16px !important;
  height: 16px !important;
}
/* „+" w oryginalnej masce Lucide jest mocno wcięty (kreski 5–19 z 24) → ma INNY margines
   niż reszta ikon. Zrównoważony rozmiar: zawartość 5–19, stroke 2 (kanoniczny
   Lucide „plus" — pasuje do reszty ikon Lucide, nie jest ani za mały ani za duży). */
.icon-plus {
  width: 16px !important;
  height: 16px !important;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='M12 5v14'/%3E%3C/svg%3E") !important;
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='M12 5v14'/%3E%3C/svg%3E") !important;
}

/* =====================================================================
   KROK 5: KARTY / PANELE — jeden język „pudełek". Powód chaosu: te same
   wizualnie karty miały TWARDE kolory (#fbfdff, #d8e1ef, #d6e0ee, #f8fafc,
   #c9d5e8) i RÓŻNE promienie (6 / 8 / 14px) — przez to „każde okno inne"
   i nie działają w trybie ciemnym ani z karty „Styl CSS".
   Okno PROJEKTU już dostało czysty wygląd w theme-premium — TUTAJ dajemy to
   samo POZOSTAŁYM oknom (edytory kartotek, konstrukcje, materiały).

   ZASADA — DWA POZIOMY (koniec „ramka-w-ramce"):
   • POZIOM ZEWNĘTRZNY (kontener z polami) = biała karta: ramka --line,
     promień --radius, tło --surface.
   • POZIOM WEWNĘTRZNY (pod-karta / grupka pól) = miękki blok: tło
     --surface-muted, promień --radius-sm, delikatna krawędź --line. Miękkie
     wypełnienie zamiast drugiej obwódki => nie czyta się jako pudełko w pudełku.

   ŚWIADOMIE NIE RUSZAM: wrapperów layoutu bez własnego pudełka (dodanie ramki
   POGORSZYŁOBY sprawę), paneli kalkulatora kosztów (są już na tokenach + mają
   stany .is-active), oraz wariantów podbarwionych semantycznie (.primary,
   .is-active, .is-due, porady/podsumowania). Tło tych zostaje nietknięte. */

/* generyczne karty/panele -> jeden promień zgodny z oknem projektu */
.panel,
.card,
.surface-card,
.catalog-card {
  border-radius: var(--radius) !important;
}

/* POZIOM ZEWNĘTRZNY — kontenery edytorów (miały twarde tła/6-8px) */
.form-panel,
.block-editor-panel {
  border: 1px solid var(--line) !important;
  border-radius: var(--radius) !important;
  background: var(--surface) !important;
}

/* POZIOM WEWNĘTRZNY — pod-karty i grupki pól (ujednolicone miękkie bloki) */
.construction-dimensions-card,
.construction-meta-strip > div,
.readout-card,
.role-card,
.material-photo-card,
.material-metric-card:not(.primary),
.material-side-metric-card,
.block-transport-card:not(.is-active) {
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--surface-muted) !important;
}

/* ramki obrazka materiału -> tokenowe (zamiast #cad6e6 / #b8c7dc) */
.material-photo-preview {
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-sm) !important;
}
.material-photo-placeholder {
  border: 1px dashed var(--line-strong) !important;
  background: var(--surface-muted) !important;
}

/* =====================================================================
   KROK 6: KALKULATOR KOSZTÓW + TABELE + POZOSTAŁE PANELE + KSZTAŁT PIGUŁEK
   Szeroki przebieg „całej reszty". Ruszamy TYLKO kolor / promień / tło
   (NIE layout, NIE wysokości). Stany semantyczne (zielony transport, alert
   braków, zaznaczenie, hover, podsumowanie) ZOSTAJĄ — nie ma ich na liście.
   ===================================================================== */

/* --- 6A. KALKULATOR KOSZTÓW: chaos promieni 6/7px -> jeden token 9px ---
   (ramki/tła są już tokenowe: --border = var(--line); zostaje tylko promień
   + jedno twarde tło #f8fafc w mode-row). */
.project-cost-design-tree,
.project-cost-pdf-thumb,
.project-cost-summary-grid,
.project-cost-summary-grid > div,
.project-cost-subpanel,
.project-cost-flowbar a,
.project-cost-kpi-strip > div,
.project-cost-mode-row,
.project-cost-mode-check,
.project-cost-route-options-panel,
.project-cost-route-grid,
.project-cost-collapsible,
.project-cost-extra-night,
.project-cost-limit-card,
.project-cost-crew-travel-row,
.project-cost-bom-steel-rule-tile {
  border-radius: var(--radius-sm) !important;
}
.project-cost-mode-row {
  background: var(--surface-muted) !important;
}

/* --- 6B. TABELE: jeden kolor nagłówka i jeden hover (zamiast #344054 /
   #1f2a44 / #f8fbff). Gęste paddingi i karty .catalog-table zostają.
   Stany wierszy (selected / is-error/ok/legacy/warning / stock / priority)
   mają wyższą specyficzność lub są pominięte -> zostają. */
th,
.tree-table thead th {
  color: var(--text) !important;
}
tbody tr:hover {
  background: var(--surface-muted) !important;
}
.component-table th {
  background: var(--surface-muted) !important;
  color: var(--text) !important;
}

/* --- 6C. POZOSTAŁE PANELE: twarde tła/ramki/teksty -> tokeny (dark + Styl
   CSS zaczynają działać). WYKLUCZONE: .missing-blocks-* (alert/danger),
   .offer-resource-index (#eef4ff = celowy błękitny indeks). */
.crew-rates-panel,
.supplier-editor-form,
.project-chat-panel,
.chat-thread-rail {
  background: var(--surface-muted) !important;
}
.supplier-editor-side,
.supplier-editor-panel,
.design-schedule-fields,
.plan-engineer-picker {
  background: var(--surface) !important;
}
.supplier-editor-panel {
  border-color: var(--line) !important;
}
.offer-summary-item strong,
.offer-construction-name {
  color: var(--text) !important;
}
.offer-construction-dimensions,
.offer-filter-group > strong {
  color: var(--muted) !important;
}

/* --- 6D. PIGUŁKI STATUSÓW: jeden kształt (pełna pigułka), KOLORY TONÓW
   nietknięte (--tone-* niosą znaczenie). Koniec „raz 5px, raz 999px". */
.status-pill,
.production-step-status-button {
  border-radius: 999px !important;
}

/* =====================================================================
   KROK 7: CHECKBOXY + KROPKI — jeden rozmiar (jak w Projektach). Kolory
   NIE ruszane (zielony „zrobione", tony statusów). Tylko wymiary/rogi.
   ===================================================================== */
/* checkboxy: były 18px(r5) / 22px(r6) -> jeden box 18px, rogi 6px.
   Krawędź --line-strong i zielony stan zaznaczenia zostają jak są. */
.rt-check-box,
.checklist-check,
.task-check {
  width: 18px !important;
  height: 18px !important;
  border-radius: 6px !important;
}

/* kropki statusów: w Projektach .stage-dot = 8px. Dociągamy POZOSTAŁE do 8px,
   NIE ruszając .stage-dot (to wzorzec Projektów). Kolory zostają. */
.task-status-dot,
.timeline-status i,
.block-health-dot {
  width: 8px !important;
  height: 8px !important;
}

/* =====================================================================
   KROK 8: KALKULATOR KOSZTÓW — koniec starego GRANATU (--navy #1b2a4a) na
   stanach „wybrany/aktywny". Cała apka (Projekty) używa --accent #3b6ef0 →
   tu też. Stany semantyczne (zielony transport, alerty, BOM) zostają.
   ===================================================================== */
/* aktywna zakładka = TO SAMO co zaznaczona karta: CAŁE niebieskie tło + PROSTY
   pasek-podkreślenie przez ::after (NIE inset box-shadow — inset wyginał się na
   rogach „w zwijas", tak jak wcześniej border-left karty). */
.project-costs-modal .project-cost-category-card { position: relative !important; }
.project-cost-category-card.is-active {
  border-color: color-mix(in srgb, var(--accent) 35%, var(--line)) !important;
  background: color-mix(in srgb, var(--accent) 10%, var(--surface)) !important;
  color: var(--accent) !important;
  box-shadow: none !important;
}
.project-costs-modal .project-cost-category-card.is-active::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 4px !important;
  background: var(--accent) !important;
  border-radius: 0 0 9px 9px !important;
}
/* hover NIE gasi zaznaczenia aktywnej zakładki (audyt: brakująca reguła —
   :hover miał wyższą specyficzność niż .is-active i zjadał niebieskie tło) */
.project-costs-modal .project-cost-category-card.is-active:hover {
  background: color-mix(in srgb, var(--accent) 10%, var(--surface)) !important;
}
/* ikony kategorii: stały granat -> szary (jak reszta ikon); aktywna -> akcent */
.project-cost-category-card .icon { color: var(--muted) !important; }
.project-cost-category-card.is-active .icon { color: var(--accent) !important; }
/* (USUNIĘTE 24.06: stary stan zaznaczonej konstrukcji z KROK 8 — border-color +
   tło accent 8% + inset 3px box-shadow — był MARTWY, obity przez KROK 23 o
   wyższej specyficzności. To była kolejna mina „dodatkowego paska".) */
/* box „Razem": ciemny #2f6da6 -> jeden niebieski akcent */
.project-cost-total-result {
  background: var(--accent) !important;
}

/* =====================================================================
   KROK 9: KALKULATOR — STANDARD POLA PROCENTOWEGO + mniejszy przełącznik
   + koniec ramki-w-ramce + bez strzałek w polach liczbowych.
   ===================================================================== */
/* 9a. rząd marży = KONIEC osobnej ramki (frame-in-frame): toggle+% pływają
   pod kaflem kategorii, bez drugiego pudełka */
.project-cost-category-margin {
  border: 0 !important;
  background: transparent !important;
  padding: 3px 0 0 !important;
  min-height: 0 !important;
  gap: 8px !important;
}

/* 9b. PRZEŁĄCZNIK ON za duży: 34x18 -> 28x16, gałka 10, kolor akcentu */
.project-cost-category-margin-switch { grid-template-columns: 28px !important; color: var(--muted) !important; }
.project-cost-category-margin-switch > span { width: 28px !important; height: 16px !important; }
.project-cost-category-margin-switch > span::after { width: 10px !important; height: 10px !important; top: 3px !important; left: 3px !important; }
.project-cost-category-margin-switch input[type="checkbox"]:checked + span { background: var(--accent) !important; }
.project-cost-category-margin-switch input[type="checkbox"]:checked + span::after { transform: translateX(12px) !important; }

/* 9c. STANDARD POLA PROCENTOWEGO: bez osobnego napisu „%", % jako STAŁY
   suffiks w polu, BEZ strzałek, szerokie (zmieści 123.34%), prawy align */
.project-cost-category-margin-input {
  position: relative !important;
  display: block !important;
}
.project-cost-category-margin-input > span { display: none !important; }
/* specyficzność (0,4,1) — musi bić theme-premium `.modal input...` (0,3,1) */
.modal.project-costs-modal .project-cost-category-margin-input > input[type="number"] {
  width: 100% !important;
  text-align: right !important;
  padding-right: 24px !important;
  -moz-appearance: textfield !important;
  appearance: textfield !important;
}
.project-cost-category-margin-input::after {
  content: "%";
  position: absolute;
  right: 9px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  pointer-events: none;
}

/* 9d. KONIEC STRZAŁEK we wszystkich polach liczbowych kalkulatora */
.project-costs-modal input[type="number"] {
  -moz-appearance: textfield !important;
  appearance: textfield !important;
}
.project-costs-modal input[type="number"]::-webkit-outer-spin-button,
.project-costs-modal input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
  margin: 0 !important;
}

/* =====================================================================
   KROK 10: KALKULATOR — koniec gigantyzmu i ramki-w-ramce (czytelność).
   Pracujemy na realnym oknie; tylko wygląd, zero zmian funkcji.
   ===================================================================== */
/* karty/komórki WEWNĄTRZ paneli -> płaskie wypełnienie (bez drugiej obwódki) */
.project-costs-modal .project-cost-subpanel .readout-card,
.project-costs-modal .project-cost-subpanel .project-cost-limit-card,
.project-costs-modal .project-cost-extra-night {
  border: 0 !important;
  background: transparent !important;
}
/* zakwaterowanie: checkbox „Dodatkowy nocleg" bez wielkiej ramki */
.project-cost-extra-night {
  padding: 2px 0 !important;
  min-height: 0 !important;
}
/* wyniki zakwaterowania: 6 osobnych pudełek -> JEDEN blok z liniami siatki */
.project-cost-mini-result-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0 !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-sm) !important;
  overflow: hidden !important;
  background: var(--surface-muted) !important;
}
.project-cost-mini-result-grid > div {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  padding: 6px 8px !important;
  box-shadow: inset -1px -1px 0 var(--line) !important;
}
/* pole „Cena zakwaterowania / doba / osoba" nie na całą szerokość okna */
.project-cost-hotel-panel .project-cost-collapsible-body > .field {
  max-width: 300px !important;
}

/* (KROK 11/12 — przenoszenie KPI/marży — COFNIĘTE na życzenie usera.
   Funkcji nie ruszamy. Zostaje tylko unifikacja wyglądu.) */


/* =====================================================================
   KALKULATOR KOSZTÓW — UKŁAD DOCELOWY (konsolidacja KROK 13–30 w JEDEN
   spójny blok). Oparty na tokenach okna Projekty: DM Sans, akcent #3b6ef0,
   --surface/--line/--radius. Jedna skala czcionek/odstępów, płaskie karty
   bez ramek-w-ramce. Semantyka (zielony transport, czerwień wymaganego,
   --tone-*, pasek ::before konstrukcji) nietknięta. Odwracalne: unify.css.bak.
   ===================================================================== */
:root {
  --pc-font-section: 10px;
  --pc-font-label: 11px;
  --pc-font-value: 12.5px;
  --pc-font-title: 13px;
  --pc-gap-section: 12px;
  --pc-active-bg: color-mix(in srgb, var(--accent) 10%, var(--surface));
  --pc-active-border: color-mix(in srgb, var(--accent) 35%, var(--line));
  --pc-bar-idle: color-mix(in srgb, var(--accent) 28%, var(--line));
}

/* ---- MODAL SHELL + SIATKA 4 KOLUMN (tylko desktop) ---- */
@media (min-width: 900px) {
  .project-costs-modal .project-costs-4col {
    display: grid !important;
    grid-template-columns: clamp(320px, 21vw, 410px) max-content minmax(0, 1fr) clamp(310px, 18vw, 360px) !important;
    grid-template-rows: minmax(0, 1fr) !important;
    grid-template-areas: none !important;
    gap: 12px !important;
    align-items: stretch !important;
    height: 100% !important;
    overflow: hidden !important;
  }
  .project-costs-modal .project-costs-4col > * { grid-column: auto !important; grid-row: auto !important; min-height: 0 !important; }
  .project-costs-modal .project-cost-scope-panel { overflow: hidden !important; }
  .project-costs-modal .project-cost-editor-column { overflow-y: auto !important; }
  .project-costs-modal .project-costs-results { overflow-y: auto !important; }
}

/* ---- KOL.1: ZAKRES + PROFIL ---- */
.project-costs-modal .project-cost-scope-panel { display: flex !important; flex-direction: column !important; align-items: stretch !important; }
.project-costs-modal .project-cost-scope-panel .project-cost-profile-tools { display: flex !important; flex-direction: column !important; gap: 6px !important; margin-bottom: 10px !important; }
.project-costs-modal .project-cost-profile-tools .project-cost-profile-controls { display: grid !important; grid-template-columns: minmax(0, 1fr) auto auto !important; gap: 6px !important; }
/* konstrukcja = wzorzec etapu (.tile-stage-item): szara karta + PROSTY pasek ::before */
.project-costs-modal .project-cost-construction-card { position: relative !important; background: var(--surface-muted) !important; border: 0 !important; border-radius: var(--radius-sm) !important; box-shadow: none !important; overflow: hidden !important; transition: background .15s ease !important; }
.project-costs-modal .project-cost-construction-card::before { content: "" !important; position: absolute !important; left: 0 !important; top: 0 !important; bottom: 0 !important; width: 4px !important; background: var(--pc-bar-idle) !important; border-radius: 9px 0 0 9px !important; z-index: 1 !important; }
.project-costs-modal .project-cost-construction-card:hover { background: color-mix(in srgb, var(--accent) 6%, var(--surface-muted)) !important; }
.project-costs-modal .project-cost-construction-card:has([data-cost-construction]:checked) { background: var(--pc-active-bg) !important; border: 0 !important; box-shadow: none !important; }
.project-costs-modal .project-cost-construction-card:has([data-cost-construction]:checked)::before { background: var(--accent) !important; }
.project-costs-modal .project-cost-construction-mini { background: transparent !important; border-top-color: var(--line) !important; box-shadow: none !important; }
/* strzałka rozwijania konstrukcji = na równi z dropdownem */
.project-costs-modal .project-cost-construction { grid-template-columns: minmax(0, 1fr) var(--control-h) !important; }
.project-costs-modal .project-cost-construction-toggle { align-self: end !important; width: var(--control-h) !important; height: var(--control-h) !important; min-height: var(--control-h) !important; color: var(--accent) !important; }
.project-costs-modal .project-cost-construction-toggle:hover { background: var(--surface-muted) !important; }
.project-costs-modal .project-cost-construction-toggle-icon::before { font-size: 14px !important; }

/* ---- KOL.2: ZAKŁADKI PIONOWO + MARŻA ON/% ---- */
.project-costs-modal .project-cost-category-panel { padding: 0 !important; background: transparent !important; border: 0 !important; }
.project-costs-modal .project-cost-category-grid { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 8px !important; }
.project-costs-modal .project-cost-category-slot { position: relative !important; overflow: hidden !important; display: flex !important; flex-direction: column !important; justify-content: center !important; gap: 4px !important; background: var(--surface) !important; border: 1px solid var(--line) !important; border-radius: var(--radius-sm) !important; padding: 6px 10px !important; }
.project-costs-modal .project-cost-category-slot .project-cost-category-card { width: 100% !important; justify-content: flex-start !important; min-height: var(--control-h) !important; position: relative !important; }
.project-costs-modal .project-cost-category-slot .project-cost-category-margin.is-placeholder { display: none !important; }
.project-costs-modal .project-cost-category-card:hover { background: var(--surface-muted) !important; }
/* aktywna zakładka = LEWY pasek akcentu na slocie (spójne z konstrukcjami/etapami) */
.project-costs-modal .project-cost-category-slot:has(.project-cost-category-card.is-active) { background: var(--pc-active-bg) !important; border-color: var(--pc-active-border) !important; }
.project-costs-modal .project-cost-category-slot:has(.project-cost-category-card.is-active)::before { content: "" !important; position: absolute !important; left: 0 !important; top: 0 !important; bottom: 0 !important; width: 4px !important; background: var(--accent) !important; z-index: 1 !important; }
.project-costs-modal .project-cost-category-card.is-active { background: transparent !important; border: 0 !important; box-shadow: none !important; color: var(--accent) !important; }
.project-costs-modal .project-cost-category-card.is-active::after { content: none !important; }
.project-costs-modal .project-cost-category-card .icon { color: var(--muted) !important; }
.project-costs-modal .project-cost-category-card.is-active .icon { color: var(--accent) !important; }
/* marża bez ramki-w-ramce */
.project-costs-modal .project-cost-category-margin { border: 0 !important; background: transparent !important; padding: 3px 0 0 !important; min-height: 0 !important; }

/* ---- KOL.3: DANE W SŁUPKU, BEZ RAMEK-W-RAMCE (kol. SCROLLUJE jako całość) ---- */
.project-costs-modal .project-cost-editor-column .project-cost-editor-stack,
.project-costs-modal .project-cost-editor-column .project-cost-editor-section { overflow: visible !important; }
.project-costs-modal .project-cost-editor-column .form-grid,
.project-costs-modal .project-cost-editor-column .project-cost-address-grid,
.project-costs-modal .project-cost-editor-column .project-cost-crew-grid,
.project-costs-modal .project-cost-editor-column .project-cost-two-field-grid,
.project-costs-modal .project-cost-editor-column .project-cost-bom-steel-rule-grid,
.project-costs-modal .project-cost-editor-column .project-cost-mini-result-grid { grid-template-columns: 1fr !important; gap: 10px !important; }
.project-costs-modal .project-cost-editor-column .project-cost-tab-workbench,
.project-costs-modal .project-cost-editor-column .project-cost-tab-main,
.project-costs-modal .project-cost-editor-column .project-cost-fieldsets { display: flex !important; flex-direction: column !important; gap: var(--pc-gap-section) !important; }
/* etykiety pól + nagłówki sekcji = jedna skala */
.project-costs-modal .field > label { font-size: var(--pc-font-label) !important; font-weight: 600 !important; color: var(--muted) !important; text-transform: none !important; letter-spacing: 0 !important; }
.project-costs-modal .project-cost-subhead strong, .project-costs-modal .project-cost-fieldset > strong { font-size: var(--pc-font-title) !important; font-weight: 800 !important; color: var(--text) !important; }
.project-costs-modal .project-cost-subhead span { font-size: var(--pc-font-section) !important; font-weight: 800 !important; color: var(--muted) !important; text-transform: uppercase !important; letter-spacing: .02em !important; }
/* grupy = JEDEN miękki blok; pod-karty BEZ własnej ramki (koniec ramek-w-ramce) */
.project-costs-modal .project-cost-editor-column .project-cost-subpanel,
.project-costs-modal .project-cost-editor-column .project-cost-fieldset,
.project-costs-modal .project-cost-editor-column .project-cost-mode-row { background: var(--surface-muted) !important; border: 1px solid var(--line) !important; border-radius: var(--radius-sm) !important; }
.project-costs-modal .project-cost-editor-column .readout-card,
.project-costs-modal .project-cost-editor-column .construction-dimensions-card,
.project-costs-modal .project-cost-editor-column .role-card,
.project-costs-modal .project-cost-editor-column .material-metric-card { background: transparent !important; border: 0 !important; box-shadow: none !important; }
/* checkbox „Automat z BOM" bez giganta */
.project-costs-modal .project-cost-mode-check { min-height: 0 !important; border: 0 !important; background: transparent !important; padding: 4px 2px !important; }
/* korekta/tryb nie na całą szerokość */
.project-costs-modal .project-cost-manual-inline .currency-field, .project-costs-modal .project-cost-manual .currency-field { max-width: 200px !important; }
.project-costs-modal .project-cost-mode-select select { max-width: 260px !important; }
/* BOM = czytelne wiersze (etykieta → wartość), bez kafli */
.project-costs-modal .project-cost-editor-column .project-cost-bom-detail-list,
.project-costs-modal .project-cost-editor-column .project-cost-bom-steel-summary,
.project-costs-modal .project-cost-editor-column .project-cost-bom-construction-block,
.project-costs-modal .project-cost-editor-column .project-cost-bom-steel-rule { display: block !important; background: transparent !important; border: 0 !important; padding: 0 !important; box-shadow: none !important; }
.project-costs-modal .project-cost-editor-column .project-cost-bom-construction-block { margin-bottom: 16px !important; }
.project-costs-modal .project-cost-editor-column .project-cost-bom-detail-row { display: flex !important; align-items: baseline !important; justify-content: space-between !important; gap: 10px !important; flex-wrap: wrap !important; padding: 6px 4px 5px !important; background: transparent !important; border: 0 !important; border-bottom: 1.5px solid var(--line-strong) !important; border-radius: 0 !important; margin-bottom: 4px !important; }
.project-costs-modal .project-cost-editor-column .project-cost-bom-detail-row > span { font-size: var(--pc-font-value) !important; font-weight: 700 !important; color: var(--text) !important; }
.project-costs-modal .project-cost-editor-column .project-cost-bom-detail-row > small { font-size: var(--pc-font-section) !important; color: var(--muted) !important; }
.project-costs-modal .project-cost-editor-column .project-cost-bom-detail-row > strong { font-variant-numeric: tabular-nums !important; white-space: nowrap !important; margin-left: auto !important; }
.project-costs-modal .project-cost-editor-column .project-cost-bom-steel-rule-head { font-size: var(--pc-font-section) !important; font-weight: 800 !important; letter-spacing: .04em !important; text-transform: uppercase !important; color: var(--muted) !important; margin: 8px 0 0 !important; padding: 0 !important; background: transparent !important; }
.project-costs-modal .project-cost-editor-column .project-cost-bom-steel-rule-grid { display: flex !important; flex-direction: column !important; gap: 0 !important; }
.project-costs-modal .project-cost-editor-column .project-cost-bom-steel-rule-tile { display: flex !important; align-items: baseline !important; justify-content: space-between !important; gap: 12px !important; min-height: 0 !important; padding: 4px 2px !important; background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--line) !important; border-radius: 0 !important; box-shadow: none !important; }
.project-costs-modal .project-cost-editor-column .project-cost-bom-steel-rule-tile > span { font-size: var(--pc-font-label) !important; font-weight: 600 !important; color: var(--muted) !important; text-transform: none !important; letter-spacing: 0 !important; }
.project-costs-modal .project-cost-editor-column .project-cost-bom-steel-rule-tile > strong { font-size: var(--pc-font-value) !important; font-weight: 700 !important; font-variant-numeric: tabular-nums !important; white-space: nowrap !important; color: var(--text) !important; }

/* ---- PRZEŁĄCZNIKI ON = AKCENT ---- */
.project-costs-modal .project-cost-vat-switch input[type="checkbox"]:checked + .project-cost-vat-slider { background: var(--accent) !important; }

/* ---- KOL.4: PODSUMOWANIE (chronologia: rozbicie → wynik → VAT → Razem) ---- */
.project-costs-modal .project-costs-results { line-height: 1.28 !important; }
.project-costs-modal .project-costs-results .project-cost-summary-panel { padding: 8px 10px !important; gap: 8px !important; }
.project-costs-modal .project-costs-results .form-panel-head { margin-bottom: 5px !important; }
.project-costs-modal .project-costs-results .form-panel-head h3 { font-size: var(--pc-font-title) !important; font-weight: 800 !important; color: var(--text) !important; }
/* sekcje = nagłówek z SUMĄ */
.project-costs-modal .project-costs-results .project-cost-result-section-title { display: flex !important; align-items: baseline !important; justify-content: space-between !important; gap: 8px !important; font-size: var(--pc-font-section) !important; font-weight: 800 !important; letter-spacing: .04em !important; text-transform: uppercase !important; color: var(--text) !important; border: 0 !important; margin: 16px 0 4px !important; padding: 0 !important; }
.project-costs-modal .project-costs-results .project-cost-results-compact > .project-cost-result-section-title:first-child { margin-top: 2px !important; }
.project-costs-modal .project-costs-results .project-cost-result-section-title > strong { font-size: 12px !important; font-weight: 800 !important; color: var(--text) !important; font-variant-numeric: tabular-nums !important; text-transform: none !important; white-space: nowrap !important; }
/* wiersze konstrukcji = PŁASKIE, nieklikalne */
.project-costs-modal .project-costs-results .project-cost-result-card { border: 0 !important; background: transparent !important; pointer-events: none !important; }
.project-costs-modal .project-costs-results .project-cost-result-card > summary { display: flex !important; align-items: baseline !important; justify-content: space-between !important; gap: 8px !important; padding: 4px 2px !important; min-height: 0 !important; border: 0 !important; list-style: none !important; cursor: default !important; }
.project-costs-modal .project-costs-results .project-cost-result-card > summary::-webkit-details-marker { display: none !important; }
.project-costs-modal .project-costs-results .project-cost-result-card > summary > span { font-size: var(--pc-font-label) !important; font-weight: 600 !important; color: var(--muted) !important; }
.project-costs-modal .project-costs-results .project-cost-result-card > summary > strong { font-size: var(--pc-font-value) !important; font-weight: 700 !important; color: var(--text) !important; font-variant-numeric: tabular-nums !important; white-space: nowrap !important; text-align: right !important; }
.project-costs-modal .project-costs-results .project-cost-result-card .project-cost-result-detail { display: none !important; }
/* wiersze kosztów + podpis Baza */
.project-costs-modal .project-costs-results .project-cost-project-line { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; gap: 0 8px !important; padding: 4px 2px !important; min-height: 0 !important; border: 0 !important; }
.project-costs-modal .project-costs-results .project-cost-project-line > span { grid-column: 1 !important; grid-row: 1 !important; font-size: var(--pc-font-label) !important; font-weight: 600 !important; color: var(--muted) !important; }
.project-costs-modal .project-costs-results .project-cost-project-line > strong { grid-column: 2 !important; grid-row: 1 !important; text-align: right !important; font-variant-numeric: tabular-nums !important; white-space: nowrap !important; font-size: var(--pc-font-value) !important; font-weight: 700 !important; color: var(--text) !important; }
.project-costs-modal .project-costs-results .project-cost-project-line > small { display: none !important; }
/* KPI = wynik finansowy POD rozbiciem */
.project-costs-modal .project-costs-results .project-cost-kpi-cards { display: flex !important; flex-direction: column !important; gap: 0 !important; border-top: 1.5px solid var(--line-strong) !important; border-bottom: 0 !important; padding-top: 6px !important; margin-top: 8px !important; }
.project-costs-modal .project-costs-results .project-cost-kpi { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: baseline !important; gap: 0 8px !important; min-height: 0 !important; padding: 4px 2px !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
.project-costs-modal .project-costs-results .project-cost-kpi > span { grid-column: 1 !important; grid-row: 1 !important; font-size: 10.5px !important; font-weight: 700 !important; color: var(--muted) !important; text-transform: uppercase !important; letter-spacing: .02em !important; }
.project-costs-modal .project-costs-results .project-cost-kpi > strong { grid-column: 2 !important; grid-row: 1 !important; font-size: var(--pc-font-title) !important; font-weight: 800 !important; color: var(--text) !important; text-align: right !important; font-variant-numeric: tabular-nums !important; white-space: nowrap !important; }
.project-costs-modal .project-costs-results .project-cost-kpi > small { display: block !important; grid-column: 1 / -1 !important; grid-row: 2 !important; font-size: var(--pc-font-section) !important; font-weight: 600 !important; color: var(--muted) !important; }
.project-costs-modal .project-costs-results .project-cost-kpi.positive > strong { color: var(--green) !important; }
/* RACHUNEK: VAT + Razem na dole */
.project-costs-modal .project-costs-results .project-cost-invoice-total { display: flex !important; flex-direction: column !important; gap: 6px !important; border-top: 2px solid var(--line-strong) !important; margin-top: 10px !important; padding-top: 8px !important; position: sticky !important; bottom: 0 !important; background: var(--surface) !important; }
.project-costs-modal .project-costs-results .project-cost-summary-vat { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 8px !important; padding: 2px !important; border: 0 !important; }
.project-costs-modal .project-costs-results .project-cost-vat-switch { display: inline-flex !important; align-items: center !important; gap: 6px !important; margin: 0 !important; }
.project-costs-modal .project-costs-results .project-cost-vat-switch strong { font-size: var(--pc-font-label) !important; }
.project-costs-modal .project-costs-results .project-cost-vat-switch em { font-size: var(--pc-font-section) !important; color: var(--muted) !important; }
.project-costs-modal .project-costs-results .project-cost-vat-rate { display: inline-flex !important; align-items: center !important; gap: 4px !important; margin: 0 !important; }
.project-costs-modal .project-costs-results .project-cost-vat-rate > span { font-size: var(--pc-font-section) !important; color: var(--muted) !important; text-transform: uppercase !important; margin: 0 !important; }
.project-costs-modal .project-costs-results .project-cost-vat-rate > input { width: 52px !important; min-height: 26px !important; height: 26px !important; padding: 2px 6px !important; text-align: right !important; }
.project-costs-modal .project-costs-results .project-cost-vat-rate > small { font-size: var(--pc-font-section) !important; color: var(--muted) !important; }
.project-costs-modal .project-costs-results .vat-line { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; gap: 0 8px !important; padding: 2px !important; }
.project-costs-modal .project-costs-results .vat-line > span { grid-column: 1 !important; font-size: var(--pc-font-label) !important; color: var(--muted) !important; }
.project-costs-modal .project-costs-results .vat-line > strong { grid-column: 2 !important; text-align: right !important; font-size: var(--pc-font-value) !important; font-weight: 700 !important; font-variant-numeric: tabular-nums !important; }
.project-costs-modal .project-costs-results .vat-line > small { display: none !important; }
.project-costs-modal .project-costs-results .project-cost-total-result { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important; min-height: var(--control-h) !important; padding: 4px 12px !important; }
.project-costs-modal .project-costs-results .project-cost-total-result > span { font-size: var(--pc-font-section) !important; text-transform: uppercase !important; letter-spacing: .04em !important; opacity: .9 !important; }
.project-costs-modal .project-costs-results .project-cost-total-result > strong { text-align: right !important; font-size: 14px !important; font-weight: 800 !important; font-variant-numeric: tabular-nums !important; white-space: nowrap !important; }
.project-costs-modal .project-costs-results .project-cost-total-result > small { display: none !important; }

/* ---- POPRAWKI (lista usera): sub-sumy, analiza-tytuł, brutto tylko VAT ON, Montaż compact, tła ---- */
/* suma sekcji POD pozycjami (nie w nagłówku) */
.project-costs-modal .project-costs-results .project-cost-result-subtotal { display: grid !important; grid-template-columns: minmax(0,1fr) auto !important; align-items: baseline !important; gap: 0 8px !important; padding: 5px 2px 0 !important; margin-bottom: 8px !important; border-top: 1.5px solid var(--line-strong) !important; }
.project-costs-modal .project-costs-results .project-cost-result-subtotal > span { font-size: var(--pc-font-label) !important; font-weight: 700 !important; color: var(--danger) !important; }
.project-costs-modal .project-costs-results .project-cost-result-subtotal > strong { text-align: right !important; font-size: var(--pc-font-value) !important; font-weight: 800 !important; font-variant-numeric: tabular-nums !important; white-space: nowrap !important; color: var(--danger) !important; }
/* tytuł „Analiza handlowa" nad wynikiem (KPI) */
.project-costs-modal .project-costs-results .project-cost-analysis-title { margin-top: 10px !important; border-bottom: 0 !important; }
/* Cena brutto USUNIĘTA z KPI — finalna brutto jest na dole jako „Razem" (gdy VAT ON pojawia się też wiersz VAT) */
.project-costs-modal .project-costs-results .project-cost-kpi:has(> strong[data-project-cost-gross-total]) { display: none !important; }
/* KPI bez redundantnych podpisów (Baza bez marży / kwota marży / Sprzedaż netto) */
.project-costs-modal .project-costs-results .project-cost-kpi > small { display: none !important; }
/* Montaż „Tryb montażu" kompaktowo (koniec gigantyzmu) */
.project-costs-modal .project-cost-editor-column .project-cost-mode-row { padding: 8px 10px !important; }
/* Zakwaterowanie/wyniki = WYLICZENIE (label→wartość w wierszach), nie grube kratki */
.project-costs-modal .project-cost-editor-column .project-cost-mini-result-grid { background: transparent !important; border: 0 !important; border-radius: 0 !important; overflow: visible !important; }
.project-costs-modal .project-cost-editor-column .project-cost-mini-result-grid > div { display: flex !important; align-items: baseline !important; justify-content: space-between !important; gap: 12px !important; min-height: 0 !important; padding: 4px 2px !important; background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--line) !important; border-radius: 0 !important; box-shadow: none !important; }
.project-costs-modal .project-cost-editor-column .project-cost-mini-result-grid > div > span { font-size: var(--pc-font-label) !important; font-weight: 600 !important; color: var(--muted) !important; text-transform: none !important; letter-spacing: 0 !important; }
.project-costs-modal .project-cost-editor-column .project-cost-mini-result-grid > div > strong { font-size: var(--pc-font-value) !important; font-weight: 700 !important; font-variant-numeric: tabular-nums !important; white-space: nowrap !important; color: var(--text) !important; }
/* żadnych teł na wierszach wyników */
.project-costs-modal .project-costs-results .project-cost-project-line,
.project-costs-modal .project-costs-results .project-cost-kpi,
.project-costs-modal .project-costs-results .project-cost-result-card,
.project-costs-modal .project-costs-results .project-cost-result-card > summary { background: transparent !important; }

/* ---- POPRAWKI 3 (lista usera): flat marża, Ładunek zwijany bez wewn. scrolla, Koszt ręczny do prawej ---- */
/* marża: ON (lewo) + % (prawo) w jednym wierszu, pole % FLAT (bez pudełka/tła) */
.project-costs-modal .project-cost-category-margin { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 8px !important; }
.project-costs-modal .project-cost-category-margin .project-cost-category-margin-input > input { background: transparent !important; border: 0 !important; box-shadow: none !important; min-height: 0 !important; height: 24px !important; }
/* Ładunek i dobór transportu = ZWIJANY (details), pełna szerokość, BEZ wewn. scrolla (scroll kol.3 go pokaże) */
.project-costs-modal .project-cost-transport-advice-panel { width: 100% !important; }
.project-costs-modal .project-cost-transport-advice-panel > summary.project-cost-transport-advice-head { cursor: pointer !important; list-style: none !important; }
.project-costs-modal .project-cost-transport-advice-panel > summary::-webkit-details-marker { display: none !important; }
.project-costs-modal .project-cost-transport-advice-panel .project-cost-load-compact-list { max-height: none !important; overflow: visible !important; }
/* Koszt ręczny = etykieta + pole wyrównane DO PRAWEJ (z polami wartości) */
.project-costs-modal .project-cost-manual-inline { display: flex !important; flex-direction: column !important; align-items: flex-end !important; text-align: right !important; }
.project-costs-modal .project-cost-manual-inline > label { text-align: right !important; }
.project-costs-modal .project-cost-manual-inline .currency-field { width: 100% !important; max-width: 200px !important; margin-left: auto !important; }

/* ---- POPRAWKI 4 (lista usera): VAT % w środku + flat, nagłówki konstrukcji zwijane ---- */
/* pole stawki VAT = jak pole marży: % WEWNĄTRZ, ramka niewidzialna */
.project-costs-modal .project-costs-results .project-cost-vat-rate { position: relative !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; }
.project-costs-modal .project-costs-results .project-cost-vat-rate > input { background: transparent !important; border: 0 !important; box-shadow: none !important; min-height: 0 !important; height: 24px !important; width: 50px !important; text-align: right !important; padding: 0 16px 0 4px !important; }
.project-costs-modal .project-costs-results .project-cost-vat-rate > small { position: absolute !important; right: 4px !important; top: 50% !important; transform: translateY(-50%) !important; font-size: 11px !important; color: var(--muted) !important; pointer-events: none !important; }
/* nagłówki konstrukcji (kol.3) ZWIJANE (details/summary) */
.project-costs-modal .project-cost-editor-column .project-cost-bom-construction-block > summary.project-cost-bom-detail-row { cursor: pointer !important; list-style: none !important; gap: 6px !important; }
.project-costs-modal .project-cost-editor-column .project-cost-bom-construction-block > summary::-webkit-details-marker { display: none !important; }

/* ---- POPRAWKI 7: nagłówek konstrukcji ZWIJANY (chevron) + czytelna tabela w środku ---- */
/* chevron = widoczna oznaka, że nagłówek się rozwija */
/* chevron = JEDEN spójny styl jak drzewo col.1 (.project-cost-tree-chevron) */
.project-costs-modal .project-cost-editor-column .project-cost-bom-construction-block > summary.project-cost-bom-detail-row::before {
  content: ">" !important; order: -1 !important; flex: none !important; align-self: center !important;
  display: inline-grid !important; place-items: center !important; width: 16px !important; height: 16px !important;
  color: var(--brand) !important; font-size: 11px !important; font-weight: 900 !important;
  transition: transform .15s ease !important;
}
.project-costs-modal .project-cost-editor-column .project-cost-bom-construction-block[open] > summary.project-cost-bom-detail-row::before {
  transform: rotate(90deg) !important;
}
/* wnętrze konstrukcji = wcięte (widać że należy do nazwy) */
.project-costs-modal .project-cost-editor-column .project-cost-bom-steel-summary { padding: 2px 0 8px 18px !important; }
/* STAL / DECK / NETTING = wyraźne sub-nagłówki (ciemne + odstęp), bez linii by nie zlewać z wierszami */
.project-costs-modal .project-cost-editor-column .project-cost-bom-steel-rule-head { color: var(--text) !important; font-weight: 800 !important; letter-spacing: .08em !important; margin: 13px 0 3px !important; }
.project-costs-modal .project-cost-editor-column .project-cost-bom-steel-rule:first-child .project-cost-bom-steel-rule-head { margin-top: 4px !important; }
/* wiersze metryk = lekkie separatory, żeby sub-nagłówki dominowały */
.project-costs-modal .project-cost-editor-column .project-cost-bom-steel-rule-tile { border-bottom-color: color-mix(in srgb, var(--line) 55%, transparent) !important; padding: 3px 2px !important; }
.project-costs-modal .project-cost-editor-column .project-cost-bom-steel-rule:last-child .project-cost-bom-steel-rule-tile:last-child { border-bottom: 0 !important; }

/* panel „Ładunek i dobór transportu" = zwijany z TYM SAMYM chevronem */
.project-costs-modal .project-cost-editor-column .project-cost-transport-advice-panel > summary.project-cost-transport-advice-head { cursor: pointer !important; list-style: none !important; display: flex !important; align-items: center !important; gap: 8px !important; }
.project-costs-modal .project-cost-editor-column .project-cost-transport-advice-panel > summary::-webkit-details-marker { display: none !important; }
.project-costs-modal .project-cost-editor-column .project-cost-transport-advice-panel > summary.project-cost-transport-advice-head::before {
  content: ">" !important; order: -1 !important; flex: none !important; align-self: center !important;
  display: inline-grid !important; place-items: center !important; width: 16px !important; height: 16px !important;
  color: var(--brand) !important; font-size: 11px !important; font-weight: 900 !important;
  transition: transform .15s ease !important;
}
.project-costs-modal .project-cost-editor-column .project-cost-transport-advice-panel[open] > summary.project-cost-transport-advice-head::before { transform: rotate(90deg) !important; }

/* ---- POPRAWKI 5: kafle zakładek KOMPAKTOWE i RÓWNE (~68px) ---- */
.project-costs-modal .project-cost-category-slot .project-cost-category-card { min-height: 0 !important; padding: 2px 4px !important; gap: 8px !important; }
.project-costs-modal .project-cost-category-slot .project-cost-category-copy strong { font-size: 12px !important; line-height: 1.15 !important; }
.project-costs-modal .project-cost-category-slot .project-cost-category-copy small { font-size: 9.5px !important; line-height: 1.1 !important; }
.project-costs-modal .project-cost-category-slot .project-cost-category-margin { padding: 0 !important; }
.project-costs-modal .project-cost-category-slot .project-cost-category-margin .project-cost-category-margin-input > input { height: 22px !important; }

/* ============================================================
   POPRAWKI 8 — KOLUMNA 4 „Podsumowanie": JEDEN spójny system wierszy (księga)
   Spec z wieloagentowego passu impeccable (zwycięzca: invoice-receipt, 9.4/10).
   A: wiersze danych == wiersze KPI (padding/wysokość). B: normalna wielkość liter wszędzie.
   C: usunięta kreska nad „Koszt całkowity". D: 3 nagłówki sekcji = równe marginesy.
   E: sumy czerwone, Zysk zielony, konkluzja = waga + jedna linia (bez ramki).
   ============================================================ */
/* (D) NAGŁÓWKI SEKCJI: jeden styl, RÓWNE odstępy dla wszystkich trzech */
.project-costs-modal .project-costs-results .project-cost-result-section-title,
.project-costs-modal .project-costs-results .project-cost-analysis-title {
  display: flex !important; align-items: baseline !important; justify-content: space-between !important; gap: 8px !important;
  font-size: var(--pc-font-section) !important; font-weight: 800 !important; letter-spacing: .04em !important; text-transform: uppercase !important;
  color: var(--text) !important; border: 0 !important; border-bottom: 0 !important; border-top: 0 !important;
  margin: 14px 0 4px !important; padding: 0 !important;
}
.project-costs-modal .project-costs-results .project-cost-results-compact > .project-cost-result-section-title:first-child { margin-top: 2px !important; }
.project-costs-modal .project-costs-results .project-cost-result-section-title > strong,
.project-costs-modal .project-costs-results .project-cost-analysis-title > strong {
  font-size: var(--pc-font-value) !important; font-weight: 800 !important; color: var(--text) !important;
  font-variant-numeric: tabular-nums !important; text-transform: none !important; white-space: nowrap !important; text-align: right !important;
}
/* (A+B+E) JEDEN SYSTEM WIERSZY: KONSTRUKCJE + KOSZTY + PODSUMOWANIE identyczne */
.project-costs-modal .project-costs-results .project-cost-result-card { border: 0 !important; background: transparent !important; pointer-events: none !important; }
.project-costs-modal .project-costs-results .project-cost-result-card > summary,
.project-costs-modal .project-costs-results .project-cost-project-line,
.project-costs-modal .project-costs-results .project-cost-kpi {
  display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: baseline !important; gap: 0 8px !important;
  padding: 4px 2px !important; min-height: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; list-style: none !important; cursor: default !important;
}
.project-costs-modal .project-costs-results .project-cost-result-card > summary::-webkit-details-marker { display: none !important; }
.project-costs-modal .project-costs-results .project-cost-result-card .project-cost-result-detail { display: none !important; }
/* ETYKIETY (lewa): normalna wielkość liter, muted, 600 — (B) koniec wersalików w KPI */
.project-costs-modal .project-costs-results .project-cost-result-card > summary > span,
.project-costs-modal .project-costs-results .project-cost-project-line > span,
.project-costs-modal .project-costs-results .project-cost-kpi > span {
  grid-column: 1 !important; grid-row: 1 !important; font-size: var(--pc-font-label) !important; font-weight: 600 !important; color: var(--muted) !important; text-transform: none !important; letter-spacing: 0 !important; line-height: 1.3 !important;
}
/* WARTOŚCI (prawa): ten sam rozmiar/waga wszędzie — (A) koniec większej czcionki KPI */
.project-costs-modal .project-costs-results .project-cost-result-card > summary > strong,
.project-costs-modal .project-costs-results .project-cost-project-line > strong,
.project-costs-modal .project-costs-results .project-cost-kpi > strong {
  grid-column: 2 !important; grid-row: 1 !important; text-align: right !important; font-size: var(--pc-font-value) !important; font-weight: 700 !important; color: var(--text) !important; font-variant-numeric: tabular-nums !important; white-space: nowrap !important; line-height: 1.3 !important;
}
/* podpisy pod wierszami ukryte (równa wysokość wierszy) */
.project-costs-modal .project-costs-results .project-cost-project-line > small,
.project-costs-modal .project-costs-results .project-cost-kpi > small { display: none !important; }
/* (C) KONTENER KPI: kreska USUNIĘTA; tylko odstęp */
.project-costs-modal .project-costs-results .project-cost-kpi-cards {
  display: flex !important; flex-direction: column !important; gap: 8px !important; border-top: 0 !important; border-bottom: 0 !important; padding-top: 0 !important; margin-top: 0 !important;
}
/* TIER (iii) KONKLUZJA: Zysk zielony; Cena netto (ostatni KPI) niesie dół */
.project-costs-modal .project-costs-results .project-cost-kpi.positive > strong { color: var(--green) !important; }
.project-costs-modal .project-costs-results .project-cost-kpi:last-child > span { color: var(--text) !important; font-weight: 700 !important; }
.project-costs-modal .project-costs-results .project-cost-kpi:last-child > strong { font-weight: 800 !important; color: var(--text) !important; }
/* TIER (ii) SUMY SEKCJI: CZERWONE, jedyna linia zamykająca sekcję */
.project-costs-modal .project-costs-results .project-cost-result-subtotal {
  display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: baseline !important; gap: 0 8px !important;
  padding: 5px 2px 0 !important; margin: 0 0 6px !important; border-top: 1px solid var(--line-strong) !important;
}
.project-costs-modal .project-costs-results .project-cost-result-subtotal > span { font-size: var(--pc-font-label) !important; font-weight: 700 !important; color: var(--danger) !important; text-transform: none !important; }
.project-costs-modal .project-costs-results .project-cost-result-subtotal > strong { text-align: right !important; font-size: var(--pc-font-value) !important; font-weight: 800 !important; font-variant-numeric: tabular-nums !important; white-space: nowrap !important; color: var(--danger) !important; }

/* POPRAWKI 9 — typografia PO FUNKCJI: mikro-etykiety kontrolek VAT/STAWKA = jedna rola */
/* (były rozjechane: VAT 13px/900, STAWKA 10px/900) -> 10px/800/wersaliki/muted */
.project-costs-modal .project-costs-results .project-cost-vat-switch > strong,
.project-costs-modal .project-costs-results .project-cost-vat-rate > span {
  font-size: var(--pc-font-section) !important; font-weight: 800 !important; text-transform: uppercase !important; letter-spacing: .04em !important; color: var(--muted) !important;
}
/* stan przełącznika ON/OFF = ta sama skala, lżejszy */
.project-costs-modal .project-costs-results .project-cost-vat-switch > em {
  font-size: var(--pc-font-section) !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: .04em !important; color: var(--muted) !important; font-style: normal !important;
}

/* ============================================================
   POPRAWKI 10 — MONTAŻ: kompaktowość + czytelne nagłówki (Przejazd/odcinek, Zakwaterowanie, Tryb)
   ============================================================ */
/* --- PRZEJAZD: wiersz odcinka = JEDNA linia z nagłówkami kolumn (koniec min-height 104 i ukrytych etykiet) --- */
.project-costs-modal .project-cost-crew-travel-head {
  grid-template-columns: minmax(0,1.3fr) minmax(0,1.4fr) minmax(98px,116px) minmax(0,1.5fr) 30px !important;
  gap: 8px !important; font-size: var(--pc-font-section) !important; font-weight: 800 !important; letter-spacing: .04em !important; padding: 0 6px 3px !important;
}
.project-costs-modal .project-cost-crew-travel-scroll { gap: 6px !important; }
.project-costs-modal .project-cost-crew-travel-row {
  grid-template-columns: minmax(0,1.3fr) minmax(0,1.4fr) minmax(98px,116px) minmax(0,1.5fr) 30px !important;
  grid-template-rows: auto !important; min-height: 0 !important; align-items: center !important; gap: 6px !important; padding: 6px 8px !important;
}
.project-costs-modal .project-cost-crew-travel-row [data-crew-travel-name] { grid-column: 1 !important; grid-row: 1 !important; }
.project-costs-modal .project-cost-crew-travel-row [data-crew-travel-item] { grid-column: 2 !important; grid-row: 1 !important; }
.project-costs-modal .project-cost-crew-travel-numbers { grid-column: 3 !important; grid-row: 1 !important; grid-template-rows: none !important; grid-template-columns: 1fr 1fr !important; gap: 4px !important; }
.project-costs-modal .project-cost-crew-travel-manual-block { grid-column: 4 !important; grid-row: 1 !important; grid-template-columns: minmax(0,1fr) !important; }
.project-costs-modal .project-cost-crew-travel-row [data-action="remove-crew-travel-route"] { grid-column: 5 !important; grid-row: 1 !important; align-self: center !important; }
/* --- ZAKWATEROWANIE: checkbox „Dodatkowy nocleg" obok ceny (nie cały rząd sam), tabela bez zmian --- */
.project-costs-modal .project-cost-hotel-panel .project-cost-collapsible-body {
  display: grid !important; grid-template-columns: minmax(0,1fr) auto !important; gap: 8px 14px !important; align-items: end !important;
}
.project-costs-modal .project-cost-hotel-panel .project-cost-collapsible-body > .field { grid-column: 1 !important; }
.project-costs-modal .project-cost-hotel-panel .project-cost-extra-night { grid-column: 2 !important; align-self: center !important; width: fit-content !important; white-space: nowrap !important; margin: 0 !important; }
.project-costs-modal .project-cost-hotel-panel .project-cost-mini-result-grid { grid-column: 1 / -1 !important; }
/* --- TRYB MONTAŻU + EKIPA I STAWKI: koniec przeskalowania --- */
/* Ekipa / Liczba osób / Maks ekipy = obok siebie (było spiętrzone w 1 kolumnie = 165px) */
.project-costs-modal .project-cost-editor-column .project-cost-assembly-workbench .project-cost-crew-grid {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important; gap: 8px 10px !important;
}
/* checkbox „Automat z BOM i ekipy" = zwykła wysokość wiersza (było 55px) */
.project-costs-modal .project-cost-assembly-workbench .project-cost-mode-check {
  min-height: 0 !important; padding: 6px 8px !important; align-items: center !important;
}
/* „Tryb montażu" = jedna linia: opis | checkbox | koszt ręczny (było 99px stretch) */
.project-costs-modal .project-cost-editor-column .project-cost-assembly-workbench .project-cost-mode-row {
  grid-template-columns: auto auto minmax(0, 1fr) !important; align-items: center !important;
}

/* ============================================================
   POPRAWKI 11 — MONTAŻ: scalony blok „Tryb i ekipa" (tryb montażu + ekipa/stawki w jednym) + Maks ekipy wyrównane + kompaktowość
   ============================================================ */
/* nagłówek scalonego bloku (Tryb i ekipa / podpis) */
.project-costs-modal .project-cost-editor-column .project-cost-fieldset-head { display: flex !important; align-items: baseline !important; justify-content: space-between !important; gap: 8px !important; margin: 0 0 8px !important; }
.project-costs-modal .project-cost-editor-column .project-cost-fieldset-head > strong { font-size: var(--pc-font-title) !important; font-weight: 800 !important; color: var(--text) !important; }
.project-costs-modal .project-cost-editor-column .project-cost-fieldset-head > span { font-size: var(--pc-font-section) !important; font-weight: 800 !important; text-transform: uppercase !important; letter-spacing: .04em !important; color: var(--muted) !important; }
/* linia trybu: checkbox + koszt ręczny obok siebie (kompaktowo) */
.project-costs-modal .project-cost-editor-column .project-cost-assembly-mode-line { display: flex !important; align-items: center !important; gap: 14px !important; margin: 0 0 10px !important; flex-wrap: wrap !important; }
.project-costs-modal .project-cost-editor-column .project-cost-assembly-mode-line .project-cost-mode-check { min-height: 0 !important; padding: 0 !important; flex: none !important; }
.project-costs-modal .project-cost-editor-column .project-cost-assembly-mode-line .project-cost-manual-inline { margin-left: auto !important; min-width: 200px !important; }
/* MAKS EKIPY = wygląda jak read-only pole; wartość wyrównana z inputami Ekipa/Liczba osób */
.project-costs-modal .project-cost-editor-column .project-cost-assembly-setup .project-cost-crew-grid { align-items: end !important; }
.project-costs-modal .project-cost-editor-column .project-cost-limit-card { display: flex !important; flex-direction: column !important; gap: 4px !important; background: transparent !important; border: 0 !important; padding: 0 !important; align-items: stretch !important; justify-content: flex-start !important; min-height: 0 !important; }
.project-costs-modal .project-cost-editor-column .project-cost-limit-card > span { font-size: var(--pc-font-label) !important; font-weight: 700 !important; color: var(--muted) !important; text-transform: none !important; letter-spacing: 0 !important; }
.project-costs-modal .project-cost-editor-column .project-cost-limit-card > strong { display: flex !important; align-items: center !important; min-height: var(--control-h) !important; padding: 0 10px !important; background: var(--surface-muted) !important; border: 1px solid var(--line) !important; border-radius: var(--radius-sm) !important; font-size: var(--pc-font-value) !important; font-weight: 700 !important; color: var(--text) !important; font-variant-numeric: tabular-nums !important; }

/* ============================================================
   POPRAWKI 12 — POZYCJE DODATKOWE: zakładka w kol.2 -> lista w edytorze kol.3 (jeden wiersz + nagłówki)
   ============================================================ */
.project-costs-modal .project-cost-editor-column .project-cost-custom-head-row,
.project-costs-modal .project-cost-editor-column .project-cost-custom-row {
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) 150px 90px 30px !important;
  align-items: center !important; gap: 8px !important;
}
.project-costs-modal .project-cost-editor-column .project-cost-custom-head-row { padding: 2px 4px 4px !important; }
.project-costs-modal .project-cost-editor-column .project-cost-custom-head-row > span { font-size: var(--pc-font-section) !important; font-weight: 800 !important; letter-spacing: .04em !important; text-transform: uppercase !important; color: var(--muted) !important; }
.project-costs-modal .project-cost-editor-column .project-cost-custom-list { display: flex !important; flex-direction: column !important; gap: 2px !important; }
.project-costs-modal .project-cost-editor-column .project-cost-custom-row { padding: 4px !important; border-bottom: 1px solid color-mix(in srgb, var(--line) 55%, transparent) !important; }
.project-costs-modal .project-cost-editor-column .project-cost-custom-row:last-child { border-bottom: 0 !important; }
.project-costs-modal .project-cost-custom-switch { position: relative !important; display: inline-flex !important; width: 30px !important; height: 18px !important; align-self: center !important; justify-self: center !important; cursor: pointer !important; }
.project-costs-modal .project-cost-custom-switch > input { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; margin: 0 !important; opacity: 0 !important; cursor: pointer !important; }
.project-costs-modal .project-cost-custom-slider { width: 30px !important; height: 18px !important; border-radius: 999px !important; background: var(--line-strong) !important; transition: background .15s ease !important; }
.project-costs-modal .project-cost-custom-slider::after { content: "" !important; position: absolute !important; top: 2px !important; left: 2px !important; width: 14px !important; height: 14px !important; border-radius: 50% !important; background: #fff !important; transition: transform .15s ease !important; }
.project-costs-modal .project-cost-custom-switch > input:checked + .project-cost-custom-slider { background: var(--accent) !important; }
.project-costs-modal .project-cost-custom-switch > input:checked + .project-cost-custom-slider::after { transform: translateX(12px) !important; }
.project-costs-modal .project-cost-custom-row > [data-custom-name] { min-width: 0 !important; font-size: 12.5px !important; }
.project-costs-modal .project-cost-custom-price { display: flex !important; align-items: center !important; gap: 4px !important; min-width: 0 !important; }
.project-costs-modal .project-cost-custom-price > input { width: 100% !important; min-width: 0 !important; text-align: right !important; font-variant-numeric: tabular-nums !important; }
.project-costs-modal .project-cost-custom-price > small { flex: none !important; color: var(--muted) !important; font-size: 10px !important; }
.project-costs-modal .project-cost-custom-margin { display: flex !important; align-items: center !important; gap: 2px !important; }
.project-costs-modal .project-cost-custom-margin > input { width: 100% !important; min-width: 0 !important; text-align: right !important; }
.project-costs-modal .project-cost-custom-margin > small { flex: none !important; color: var(--muted) !important; font-size: 10px !important; }
.project-costs-modal .project-cost-custom-row [data-action="remove-custom-position"] { justify-self: center !important; }
/* zakładka „Pozycje dodatkowe": licznik pozycji + średnia marża (tylko podgląd) */
.project-costs-modal .project-cost-category-slot .project-cost-custom-summary { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 6px !important; padding: 0 2px !important; min-height: 22px !important; }
.project-costs-modal .project-cost-custom-summary > .project-cost-custom-count { font-size: var(--pc-font-label) !important; font-weight: 800 !important; color: var(--text) !important; }
.project-costs-modal .project-cost-custom-summary > .project-cost-custom-avg { font-size: var(--pc-font-section) !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: .03em !important; color: var(--muted) !important; }

/* ============================================================
   POPRAWKI 13 — „Generuj prezentację" = GLOBALNIE POMARAŃCZOWY (kalkulator, Design, Oferta)
   wszystkie przyciski .button z data-action="generate-offer-html"; menu kafli (.tile-menu-item) pominięte
   ============================================================ */
:root { --presentation-orange: #f97316; }
/* TINT pomarańczowy — dokładnie jak primary (Przelicz projekt), tylko inny kolor */
.button[data-action="generate-offer-html"]:not([disabled]) {
  border: 1px solid color-mix(in srgb, var(--presentation-orange) 50%, transparent) !important;
  background: color-mix(in srgb, var(--presentation-orange) 13%, transparent) !important;
  color: var(--presentation-orange) !important;
}
.button[data-action="generate-offer-html"]:not([disabled]):hover {
  background: color-mix(in srgb, var(--presentation-orange) 22%, transparent) !important;
  border-color: var(--presentation-orange) !important;
  color: var(--presentation-orange) !important;
}
.button[data-action="generate-offer-html"]:not([disabled]) .icon { background-color: var(--presentation-orange) !important; }

/* wskaźnik zaokrąglony „~10%" = kursor pomocy (tooltip z dokładniejszą wartością) */
.project-costs-modal .project-cost-pct-approx { cursor: help !important; }
/* „= Cena netto" = wynik działania Koszt + Zysk: kreska u góry + pogrubienie (jak suma w rachunku) */
.project-costs-modal .project-costs-results .project-cost-kpi-sum { border-top: 1px solid var(--line-strong) !important; padding-top: 5px !important; margin-top: 1px !important; }
.project-costs-modal .project-costs-results .project-cost-kpi-sum > span,
.project-costs-modal .project-costs-results .project-cost-kpi-sum > strong { font-weight: 800 !important; color: var(--text) !important; }

/* ============================================================
   POPRAWKI 15 — OVERLAY POMOCY „Jak liczone są koszty" (przycisk ? w kol.4 -> dynamiczny overlay)
   ============================================================ */
.project-costs-modal .project-cost-summary-panel { position: relative !important; }
.project-cost-help-btn {
  position: absolute !important; top: 6px !important; right: 6px !important; z-index: 5 !important;
  width: 24px !important; height: 24px !important; min-height: 0 !important; padding: 0 !important;
  border-radius: 50% !important; border: 1px solid color-mix(in srgb, var(--accent) 45%, transparent) !important;
  background: color-mix(in srgb, var(--accent) 12%, var(--surface)) !important; color: var(--accent) !important;
  font-weight: 800 !important; font-size: 14px !important; line-height: 1 !important; cursor: pointer !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
}
.project-cost-help-btn:hover { background: color-mix(in srgb, var(--accent) 22%, var(--surface)) !important; }
.project-cost-help-overlay { position: fixed !important; inset: 0 !important; z-index: 13000 !important; display: flex !important; align-items: center !important; justify-content: center !important; padding: 24px !important; }
.project-cost-help-overlay[hidden] { display: none !important; }
.project-cost-help-backdrop { position: absolute !important; inset: 0 !important; background: rgba(15, 23, 42, .5) !important; }
.project-cost-help-panel { position: relative !important; z-index: 1 !important; background: var(--surface) !important; border: 1px solid var(--line-strong) !important; border-radius: var(--radius) !important; width: min(760px, 100%) !important; max-height: min(82vh, 760px) !important; display: flex !important; flex-direction: column !important; box-shadow: 0 24px 60px rgba(0, 0, 0, .28) !important; overflow: hidden !important; }
.project-cost-help-head { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; padding: 13px 18px !important; border-bottom: 1px solid var(--line) !important; flex: none !important; }
.project-cost-help-head > strong { font-size: 15px !important; font-weight: 800 !important; color: var(--text) !important; }
.project-cost-help-body { padding: 14px 18px 18px !important; overflow-y: auto !important; }
.project-cost-help-intro { margin: 0 0 8px !important; font-size: 12.5px !important; color: var(--muted) !important; line-height: 1.45 !important; }
.project-cost-help-group { font-size: var(--pc-font-section) !important; font-weight: 800 !important; text-transform: uppercase !important; letter-spacing: .04em !important; color: var(--text) !important; margin: 14px 0 4px !important; }
.project-cost-help-row { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr) !important; gap: 12px !important; align-items: baseline !important; padding: 5px 0 !important; border-bottom: 1px solid color-mix(in srgb, var(--line) 55%, transparent) !important; }
.project-cost-help-pos { display: flex !important; align-items: baseline !important; justify-content: space-between !important; gap: 8px !important; min-width: 0 !important; }
.project-cost-help-pos > b { font-size: 12.5px !important; font-weight: 700 !important; color: var(--text) !important; }
.project-cost-help-pos > i { font-style: normal !important; font-variant-numeric: tabular-nums !important; font-weight: 700 !important; color: var(--text) !important; white-space: nowrap !important; }
.project-cost-help-note { font-size: 11.5px !important; color: var(--muted) !important; line-height: 1.4 !important; }

/* POPRAWKI 14 — wiersze „w tym" (rozbicie konstrukcji na Materiały/Praca) = podrzędne, wcięte, wyszarzone */
.project-costs-modal .project-costs-results .project-cost-breakdown-line > span { padding-left: 14px !important; color: var(--muted) !important; font-weight: 500 !important; }
.project-costs-modal .project-costs-results .project-cost-breakdown-line > strong { color: var(--muted) !important; font-weight: 600 !important; }

/* ============================================================
   POPRAWKI 16 — ROZWIJANE pozycje (konstrukcje + kategorie + custom) z rozbiciem zysku.
   Nadpisuje wcześniejsze blokady (.project-cost-result-card: pointer-events:none + ukryty detail).
   ============================================================ */
.project-costs-modal .project-costs-results .project-cost-expand-row { pointer-events: auto !important; margin: 1px 0 !important; }
.project-costs-modal .project-costs-results .project-cost-expand-row > summary.project-cost-expand-head {
  display: grid !important;
  grid-template-columns: 16px minmax(0, 1fr) auto !important;
  grid-template-rows: auto auto !important;
  align-items: baseline !important;
  gap: 0 6px !important;
  padding: 5px 2px !important;
  cursor: pointer !important;
  list-style: none !important;
}
.project-costs-modal .project-costs-results .project-cost-expand-row > summary.project-cost-expand-head::-webkit-details-marker { display: none !important; }
/* strzałka = TA SAMA niebieska „>" co na liście konstrukcji (.project-cost-tree-chevron), obrót 90° po rozwinięciu */
.project-costs-modal .project-costs-results .project-cost-expand-row > summary.project-cost-expand-head > .project-cost-tree-chevron {
  grid-column: 1 !important; grid-row: 1 !important; align-self: center !important; line-height: 0 !important;
}
.project-costs-modal .project-costs-results .project-cost-expand-row[open] > summary.project-cost-expand-head > .project-cost-tree-chevron::before { transform: rotate(90deg) !important; }
.project-costs-modal .project-costs-results .project-cost-expand-row > summary.project-cost-expand-head > .project-cost-expand-name {
  grid-column: 2 !important; grid-row: 1 !important;
  font-size: var(--pc-font-label) !important; font-weight: 600 !important; color: var(--text) !important;
  overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important;
}
.project-costs-modal .project-costs-results .project-cost-expand-row > summary.project-cost-expand-head > strong {
  grid-column: 3 !important; grid-row: 1 !important;
  text-align: right !important; font-variant-numeric: tabular-nums !important; white-space: nowrap !important;
  font-size: var(--pc-font-value) !important; font-weight: 700 !important; color: var(--text) !important;
}
.project-costs-modal .project-costs-results .project-cost-expand-row > summary.project-cost-expand-head > .project-cost-expand-pct {
  grid-column: 2 / -1 !important; grid-row: 2 !important;
  display: block !important;
  font-size: 10px !important; font-weight: 500 !important; color: var(--muted) !important;
  letter-spacing: .01em !important;
}
/* rozwinięcie: widoczne tylko gdy [open], wcięte (padding, nie border) */
.project-costs-modal .project-costs-results .project-cost-expand-row:not([open]) .project-cost-result-detail { display: none !important; }
.project-costs-modal .project-costs-results .project-cost-expand-row[open] .project-cost-result-detail {
  display: block !important;
  padding: 1px 2px 5px 22px !important;
  margin: 0 0 2px !important;
}
.project-costs-modal .project-costs-results .project-cost-expand-row[open] .project-cost-result-detail > div {
  display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; gap: 0 8px !important;
  padding: 2px 0 !important;
}
.project-costs-modal .project-costs-results .project-cost-expand-row[open] .project-cost-result-detail > div > span {
  font-size: var(--pc-font-label) !important; color: var(--muted) !important; font-weight: 500 !important;
}
.project-costs-modal .project-costs-results .project-cost-expand-row[open] .project-cost-result-detail > div > strong {
  text-align: right !important; font-variant-numeric: tabular-nums !important; white-space: nowrap !important;
  font-size: var(--pc-font-label) !important; font-weight: 600 !important; color: var(--text) !important;
}

/* ============================================================
   POPRAWKI 17 — „%" W POLU profilu marż (TEN SAM wzorzec co pola kategorii, nie nowy).
   ============================================================ */
.project-costs-modal .project-cost-version-table-value { position: relative !important; }
.modal.project-costs-modal .project-cost-version-table-value > input[type="number"] {
  width: 100% !important;
  text-align: right !important;
  padding-right: 22px !important;
  -moz-appearance: textfield !important;
  appearance: textfield !important;
}
.project-costs-modal .project-cost-version-table-value::after {
  content: "%" !important;
  position: absolute !important;
  right: 8px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: var(--muted) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  pointer-events: none !important;
}

/* ============================================================
   POPRAWKI 18 — rozbicie konstrukcji/kategorii: KOSZTY czerwone, ZYSK zielony
   (spójne: „Suma" już czerwona = --danger, „+Zysk" już zielony = --green). Pełna specyf. żeby bić POPRAWKI 16.
   ============================================================ */
.project-costs-modal .project-costs-results .project-cost-expand-row[open] .project-cost-result-detail > div.project-cost-detail-cost > span,
.project-costs-modal .project-costs-results .project-cost-expand-row[open] .project-cost-result-detail > div.project-cost-detail-cost > strong { color: var(--danger) !important; }
.project-costs-modal .project-costs-results .project-cost-expand-row[open] .project-cost-result-detail > div.project-cost-detail-margin > span,
.project-costs-modal .project-costs-results .project-cost-expand-row[open] .project-cost-result-detail > div.project-cost-detail-margin > strong { color: var(--green) !important; }
.project-costs-modal .project-costs-results .project-cost-expand-row[open] .project-cost-result-detail > div.project-cost-detail-subtotal { border-top: 1px solid color-mix(in srgb, var(--line) 75%, transparent) !important; margin-top: 2px !important; padding-top: 3px !important; }
.project-costs-modal .project-costs-results .project-cost-expand-row[open] .project-cost-result-detail > div.project-cost-detail-subtotal > span,
.project-costs-modal .project-costs-results .project-cost-expand-row[open] .project-cost-result-detail > div.project-cost-detail-subtotal > strong { font-weight: 800 !important; }

/* ============================================================
   POPRAWKI 19 — ZAGĘSZCZENIE kolumny 4 o ~30% (wszystkie pionowe odstępy ×0.7). Ostatni blok = wygrywa.
   ============================================================ */
.project-costs-modal .project-costs-results .project-cost-summary-panel { padding: 5.5px 7px !important; gap: 5.5px !important; }
.project-costs-modal .project-costs-results .project-cost-result-section-title,
.project-costs-modal .project-costs-results .project-cost-analysis-title { margin: 10px 0 3px !important; }
.project-costs-modal .project-costs-results .project-cost-results-compact > .project-cost-result-section-title:first-child { margin-top: 1px !important; }
.project-costs-modal .project-costs-results .project-cost-result-card > summary,
.project-costs-modal .project-costs-results .project-cost-project-line,
.project-costs-modal .project-costs-results .project-cost-kpi { padding: 3px 2px !important; }
.project-costs-modal .project-costs-results .project-cost-kpi-cards { gap: 5.5px !important; }
.project-costs-modal .project-costs-results .project-cost-result-subtotal { padding-top: 3.5px !important; margin-bottom: 4px !important; }
.project-costs-modal .project-costs-results .project-cost-kpi-sum { padding-top: 3.5px !important; }
/* rozwijane wiersze (konstrukcje/kategorie) */
.project-costs-modal .project-costs-results .project-cost-expand-row { margin: 0 !important; }
.project-costs-modal .project-costs-results .project-cost-expand-row > summary.project-cost-expand-head { padding: 3.5px 2px !important; }
.project-costs-modal .project-costs-results .project-cost-expand-row[open] .project-cost-result-detail { padding: 1px 2px 3.5px 22px !important; }
.project-costs-modal .project-costs-results .project-cost-expand-row[open] .project-cost-result-detail > div { padding: 1.4px 0 !important; }

/* ============================================================
   POPRAWKI 20 — „Koszt (bez marży)" CZERWONY (jak koszty) + odstęp między „Razem koszt" a marżami.
   ============================================================ */
.project-costs-modal .project-costs-results .project-cost-kpi.project-cost-kpi-cost > strong { color: var(--danger) !important; }
.project-costs-modal .project-costs-results .project-cost-expand-row[open] .project-cost-result-detail > div.project-cost-detail-cost.project-cost-detail-subtotal { margin-bottom: 6px !important; }

/* ============================================================
   POPRAWKI 21 — Wariant C: każda sekcja kol.4 (Konstrukcje / Koszty / Pozycje dodatkowe) na osobnym bloku tła.
   ============================================================ */
.project-costs-modal .project-costs-results .project-cost-result-block {
  background: color-mix(in srgb, var(--text) 9%, var(--surface)) !important;
  border-radius: var(--radius-sm, 8px) !important;
  padding: 7px 9px 6px !important;
  margin-bottom: 9px !important;
}
.project-costs-modal .project-costs-results .project-cost-result-block > .project-cost-result-section-title { margin-top: 0 !important; }
.project-costs-modal .project-costs-results .project-cost-result-block > .project-cost-result-subtotal { margin-bottom: 0 !important; }

/* ============================================================
   POPRAWKI 22 — Montaż: stawki jako kompaktowa TABELA po prawej (aside). Wcześniej 3 duże, niejasne linie.
   ============================================================ */
.project-costs-modal .project-cost-rate-summary { border: 0.5px solid var(--line) !important; border-radius: var(--radius-sm, 8px) !important; padding: 8px 10px !important; background: var(--surface) !important; }
.project-costs-modal .project-cost-rate-summary-head { display: flex !important; align-items: baseline !important; justify-content: space-between !important; gap: 8px !important; margin-bottom: 6px !important; }
.project-costs-modal .project-cost-rate-summary-head > strong { font-size: 12px !important; font-weight: 800 !important; text-transform: uppercase !important; letter-spacing: .04em !important; color: var(--text) !important; }
.project-costs-modal .project-cost-rate-summary-head > span { font-size: 11px !important; color: var(--muted) !important; font-variant-numeric: tabular-nums !important; white-space: nowrap !important; }
.project-costs-modal .project-cost-rate-table { width: 100% !important; border-collapse: collapse !important; }
.project-costs-modal .project-cost-rate-table th { text-align: left !important; font-size: 10.5px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: .03em !important; color: var(--muted) !important; padding: 0 5px 4px !important; border-bottom: 1px solid var(--line) !important; }
.project-costs-modal .project-cost-rate-table th:nth-child(2), .project-costs-modal .project-cost-rate-table th:nth-child(3) { text-align: right !important; }
.project-costs-modal .project-cost-rate-table td { padding: 6px 5px !important; vertical-align: top !important; border-bottom: 1px solid color-mix(in srgb, var(--line) 45%, transparent) !important; font-size: 12.5px !important; }
.project-costs-modal .project-cost-rate-table tr:last-child td { border-bottom: 0 !important; }
.project-costs-modal .project-cost-rate-table td:nth-child(2), .project-costs-modal .project-cost-rate-table td:nth-child(3) { text-align: right !important; font-variant-numeric: tabular-nums !important; white-space: nowrap !important; color: var(--text) !important; font-weight: 600 !important; }
.project-costs-modal .project-cost-rate-table .rate-name { display: block !important; font-weight: 600 !important; color: var(--text) !important; line-height: 1.25 !important; }
.project-costs-modal .project-cost-rate-table td > small { font-size: 10px !important; color: var(--muted) !important; }
.project-costs-modal .project-cost-rate-table .project-cost-rate-empty { color: var(--muted) !important; font-size: 11px !important; text-align: center !important; padding: 8px !important; }
/* Podział „Tryb i ekipa": WSZYSTKIE kontrolki po lewej w ZWARTEJ RAMCE, tabela stawek po prawej (SZEROKA) */
.project-costs-modal .project-cost-assembly-split { display: grid !important; grid-template-columns: minmax(210px, 250px) minmax(0, 1fr) !important; gap: 14px !important; align-items: start !important; }
.project-costs-modal .project-cost-assembly-controls { display: grid !important; gap: 7px !important; align-content: start !important; min-width: 0 !important; padding: 9px 10px !important; border: 0.5px solid var(--line) !important; border-radius: var(--radius-sm, 8px) !important; background: var(--surface) !important; }
.project-costs-modal .project-cost-assembly-controls .project-cost-assembly-mode-line { display: grid !important; gap: 6px !important; margin: 0 !important; }
.project-costs-modal .project-cost-assembly-controls .project-cost-manual-inline:has(.currency-field.is-readonly) { display: none !important; }
.project-costs-modal .project-cost-assembly-controls .field { display: grid !important; gap: 2px !important; margin: 0 !important; }
.project-costs-modal .project-cost-assembly-controls .field > label { margin: 0 !important; font-size: 11px !important; line-height: 1.1 !important; color: var(--muted) !important; }
.project-costs-modal .project-cost-assembly-controls .project-cost-mode-check { font-size: 12px !important; margin: 0 !important; }
.project-costs-modal .project-cost-assembly-controls input:not([type="checkbox"]), .project-costs-modal .project-cost-assembly-controls select, .project-costs-modal .project-cost-assembly-controls .currency-field input { height: 32px !important; min-height: 32px !important; }
.project-costs-modal .project-cost-assembly-controls .project-cost-crew-grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 7px !important; margin: 0 !important; }
/* bije linię 896 (minmax(150px) = auto-fit -> 1 kol w wąskiej kolumnie); 5 klas */
.project-costs-modal .project-cost-editor-column .project-cost-assembly-workbench .project-cost-assembly-controls .project-cost-crew-grid { grid-template-columns: 1fr 1fr !important; gap: 7px !important; }
.project-costs-modal .project-cost-assembly-controls .project-cost-crew-grid > .field:first-child { grid-column: 1 / -1 !important; }
.project-costs-modal .project-cost-assembly-controls .project-cost-limit-card { padding: 3px 8px !important; min-height: 32px !important; display: flex !important; flex-direction: column !important; justify-content: center !important; gap: 0 !important; }
.project-costs-modal .project-cost-assembly-controls .project-cost-limit-card > span { font-size: 10px !important; }
@media (max-width: 920px) { .project-costs-modal .project-cost-assembly-split { grid-template-columns: minmax(0, 1fr) !important; } }
/* tabela STAWKI: mieści 4 rekordy, po 4 scroll; bez pustej przestrzeni (nie rozciągaj boxu) */
.project-costs-modal .project-cost-rate-summary { align-self: start !important; }
.project-costs-modal .project-cost-rate-table { table-layout: fixed !important; }
.project-costs-modal .project-cost-rate-table thead, .project-costs-modal .project-cost-rate-table tbody tr { display: table !important; width: 100% !important; table-layout: fixed !important; }
.project-costs-modal .project-cost-rate-table tbody { display: block !important; min-height: 150px !important; max-height: 200px !important; overflow-y: auto !important; }
.project-costs-modal .project-cost-rate-table th:nth-child(1), .project-costs-modal .project-cost-rate-table td:nth-child(1) { width: 52% !important; }
.project-costs-modal .project-cost-rate-table th:nth-child(2), .project-costs-modal .project-cost-rate-table td:nth-child(2) { width: 22% !important; }
.project-costs-modal .project-cost-rate-table th:nth-child(3), .project-costs-modal .project-cost-rate-table td:nth-child(3) { width: 26% !important; }
/* Zakwaterowanie: ŚCIŚNIĘTE wyniki — 3 kolumny zamiast 1 (6 pozycji -> 2 rzędy zamiast 6) */
.project-costs-modal .project-cost-editor-column .project-cost-hotel-panel .project-cost-mini-result-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 0 18px !important; }
.project-costs-modal .project-cost-editor-column .project-cost-hotel-panel .project-cost-mini-result-grid > div { padding: 3px 2px !important; }
/* Zakwaterowanie: Cena + Dodatkowe noclegi w jednym rzędzie; pole noclegi WĄSKIE (2 cyfry, bez gigantyzmu) */
.project-costs-modal .project-cost-hotel-panel .project-cost-hotel-top { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; gap: 6px 18px !important; align-items: end !important; margin-bottom: 8px !important; }
.project-costs-modal .project-cost-hotel-panel .project-cost-extra-nights input { width: 70px !important; min-width: 0 !important; text-align: center !important; }
/* POPRAWKI 29 — „Cena zakwaterowania": wąskie pole (~4 cyfry) + dropdown waluty, dosunięte do LEWEJ pod napisem (napis jest po lewej). */
.project-costs-modal .project-cost-hotel-panel .project-cost-hotel-top > .field:first-child .currency-field { width: max-content !important; margin-left: 0 !important; margin-right: auto !important; }
.project-costs-modal .project-cost-hotel-panel .project-cost-hotel-top > .field:first-child .currency-field input[data-currency-input] { width: 70px !important; min-width: 0 !important; text-align: right !important; }
.project-costs-modal .project-cost-hotel-panel .project-cost-hotel-top > .field:first-child .currency-field select[data-currency-select] { min-width: 0 !important; }

/* ============================================================
   POPRAWKI 30 — Podróż Powrotna (×2): przełącznik obok zwężonego adresu siedziby
   (Montaż → Przejazd „Siedziba ekipy" oraz Certyfikaty → „Adres certyfikatora")
   ============================================================ */
.project-costs-modal .project-cost-crew-address-row { display: flex !important; align-items: flex-end !important; gap: 18px !important; flex-wrap: wrap !important; margin-bottom: 10px !important; }
.project-costs-modal .project-cost-crew-address-row .project-cost-base-address-field { flex: 0 1 320px !important; min-width: 200px !important; }
.project-costs-modal .project-cost-roundtrip-switch { flex: 0 0 auto !important; margin-bottom: 3px !important; }
.project-costs-modal .project-cost-roundtrip-switch em { color: var(--danger) !important; font-style: normal !important; font-weight: 800 !important; }
.project-costs-modal .project-cost-roundtrip-tag { margin-left: 8px !important; font-style: normal !important; font-weight: 800 !important; font-size: 11px !important; color: var(--danger) !important; letter-spacing: .02em !important; }

/* ============================================================
   POPRAWKI 31 — Transport powrotny materiału (panel pod odcinkami trasy)
   ============================================================ */
.project-costs-modal .project-cost-return-transport-panel { margin-top: 10px !important; }
.project-costs-modal .project-cost-return-top { display: flex !important; align-items: flex-end !important; gap: 16px !important; flex-wrap: wrap !important; margin-bottom: 10px !important; }
.project-costs-modal .project-cost-return-top > .field { flex: 0 1 170px !important; min-width: 120px !important; }
.project-costs-modal .project-cost-return-bottom { display: flex !important; align-items: flex-end !important; gap: 14px !important; flex-wrap: wrap !important; }
.project-costs-modal .project-cost-return-bottom .project-cost-return-address { flex: 1 1 280px !important; min-width: 200px !important; }
.project-costs-modal .project-cost-return-bottom .project-cost-return-km { flex: 0 0 140px !important; display: grid !important; gap: 4px !important; }
.project-costs-modal .project-cost-return-bottom .project-cost-return-km > span { font-size: 12px !important; font-weight: 600 !important; color: var(--muted) !important; }
.project-costs-modal .project-cost-return-bottom .project-cost-return-km input { width: 100% !important; text-align: right !important; }

/* POPRAWKI 33 — „Odcinki trasy" (było białe) -> to samo tło/ramka co „Tryb i korekta" i „Adresy trasy"
   (identyczne wartości jak reguła z linii 634). Punktowo, tylko ten panel. */
.project-costs-modal .project-cost-editor-column .project-cost-route-grid { background: var(--surface-muted) !important; border: 1px solid var(--line) !important; border-radius: var(--radius-sm) !important; }

/* POPRAWKI 34 — „Transport powrotny materiału" zbudowany TAK SAMO jak „Odcinki trasy"
   (route-grid/toolbar/head/row). Własny układ 5 kolumn: Cel | Środek | Adres | Km | Koszt. */
.project-costs-modal .project-cost-return-head,
.project-costs-modal .project-cost-return-row {
  grid-template-columns: minmax(200px, 1.9fr) minmax(170px, 1.15fr) 86px minmax(84px, 0.7fr) !important;
}
.project-costs-modal .project-cost-return-head span { grid-column: auto !important; display: block !important; }
.project-costs-modal .project-cost-return-row > strong[data-return-transport-preview] { align-self: center !important; text-align: right !important; font-weight: 700 !important; font-variant-numeric: tabular-nums !important; white-space: nowrap !important; }
.project-costs-modal .project-cost-return-switch { flex: 0 0 auto !important; }

/* POPRAWKI 35 — Montaż: „Zakwaterowanie" i „Przejazd" szare jak panele w Transport (na życzenie).
   TYLKO te dwa panele (hotel + crew-travel są wyłącznie w Montażu). Nic innego nie ruszane. */
.project-costs-modal .project-cost-hotel-panel,
.project-costs-modal .project-cost-crew-travel-panel {
  background: var(--surface-muted) !important;
  border: 1px solid var(--line) !important;
}
.project-costs-modal .project-cost-hotel-panel > summary,
.project-costs-modal .project-cost-crew-travel-panel > summary {
  background: transparent !important;
}

/* POPRAWKI 36 — Montaż STAWKI: (1) zdjąć szare tło z wiersza nagłówka POZYCJA/ILOŚĆ/KOSZT,
   (2) lewy box „Tryb i ekipa" rozciągnięty do wysokości tabeli STAWKI (koniec pustej przestrzeni). */
.project-costs-modal .project-cost-rate-table th,
.project-costs-modal .project-cost-rate-table thead,
.project-costs-modal .project-cost-rate-table thead tr { background: transparent !important; }
.project-costs-modal .project-cost-assembly-controls { align-self: stretch !important; }

/* POPRAWKI 37 — lista projektów: wartości MATERIAŁ/TRANSPORT/MONTAŻ/RAZEM o ~20% większe
   (13px → 15.6px). Nagłówki (.prow-totals span, 9px) BEZ ZMIAN. */
.prow-totals b,
.prow-totals b .money,
.prow-totals .prow-total b,
.prow-totals .prow-total b .money { font-size: 15.6px !important; }

/* POPRAWKI 38 — lista projektów: kolor kwot egzekwowany TU (jeden CSS, wygrywa nad zielonym
   bazowym .money i theme-premium). Domyślnie CZARNE. Cena materiału = CZERWONA, gdy konstrukcja
   ma NIEROZPOZNANE bloki — JS dokleja .money-bom-error na podstawie bomErrorCount > 0. */
.prow-totals .money { color: #000 !important; }           /* czarne (nie szary slate var(--text)) */
.prow-totals .money-bom-error { color: var(--danger) !important; } /* materiał z nierozpoznanymi blokami = czerwony */
/* Symbol waluty (EUR): 30% mniejszy. KOLOR = dziedziczony z kwoty (czarny / czerwony).
   Musi nadpisać .prow-totals span { color: var(--muted-2) } z theme-premium (styl nagłówków
   Materiał/Transport łapie też span EUR i szarzy go) — stąd mocniejszy selektor + inherit. */
.prow-totals .prow-cur { font-size: 0.7em !important; color: inherit !important; }

/* POPRAWKI 39 — kolumny kwot ZAWSZE równo pod sobą, niezależnie od długości liczby (max 8 cyfr).
   Stała szerokość kolumny zamiast max-content (które skaluje per-wiersz i rozjeżdża wyrównanie).
   Wartości do prawej + tabular-nums = idealnie w pionie. 124px mieści „88 888 888 EUR". */
.prow-totals { grid-template-columns: repeat(4, 124px) !important; }

/* ============================================================================
   POPRAWKI 40 — OKNO ZAMÓWIEŃ: redesign na jasny, zorganizowany, czytelny.
   (a) JEDEN spójny system 4 kolorów statusu zamiast ~8 rozjechanych hexów,
   (b) spokojne, neutralne nagłówki drzewa, (c) czytelne tabele i stopki-legendy,
   (d) uporządkowany nagłówek z procesem. Logika i markup nietknięte (poza klasą
   nagłówka). Warstwa unify = w pełni odwracalne.
   ============================================================================ */
.orders-head, .orders-tree-panel, .orders-restock-panel {
  --ord-ok:   #1f9d57;                  /* zabezpieczone / przyjęte / w całości   */
  --ord-warn: #c07d0a;                  /* w drodze / szacunek (≈)                */
  --ord-bad:  var(--danger, #c3352b);   /* do zamówienia / brak                   */
  --ord-info: var(--accent, #3b6ef0);   /* BOM techniczny / info / produkcja      */
}

/* --- Nagłówek: tytuł + proces (zwięźle) po lewej, eksporty po prawej --- */
.orders-head .orders-head-main { display: grid; gap: 6px; align-content: start; }
.orders-head-main > p.muted { margin: 0; max-width: 72ch; line-height: 1.55; font-size: 12px; }
.orders-head-main > p.muted strong { color: var(--text); font-weight: 700; }
.orders-loading-note { color: var(--ord-info) !important; }

/* --- Panele: jedna jasna ramka / rogi --- */
.orders-tree-panel, .orders-restock-panel {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

/* --- Drzewo: spokojne, neutralne nagłówki (mniej tinted szumu) --- */
.orders-project-node > summary,
.orders-construction-node > summary,
.orders-supplier-node > summary { background: var(--surface-muted) !important; }
.orders-project-node > summary { border-bottom: 1px solid var(--line); }
.orders-project-node > summary:hover,
.orders-construction-node > summary:hover,
.orders-supplier-node > summary:hover {
  background: color-mix(in srgb, var(--ord-info) 7%, var(--surface-muted)) !important;
}
.orders-project-node { box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04); }

/* --- Tabele: jasny, czytelny układ (jeden styl dla wszystkich tabel okna) --- */
.orders-material-table thead th {
  background: transparent !important;
  color: var(--muted);
  font-weight: 700;
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  border-bottom: 1px solid var(--line);
  padding: 8px 10px;
}
.orders-material-table tbody td { padding: 7px 10px; }
.orders-material-table tbody tr:hover td { background: color-mix(in srgb, var(--ord-info) 4%, transparent); }

/* --- Stopki-legendy: zwarte, w pudełku zamiast luźnej ściany tekstu --- */
.orders-stock-footnote {
  font-size: 11px;
  line-height: 1.55;
  color: var(--muted) !important;
  background: var(--surface-muted);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px !important;
  margin-top: 8px;
}
.orders-stock-footnote strong { color: var(--text); }

/* ====== JEDEN SPÓJNY SYSTEM KOLORÓW STATUSU (zielony/bursztyn/czerwony/niebieski) ====== */
.odash-seg.secured, .odot.secured, .orders-progress-fill.done { background: var(--ord-ok) !important; }
.odash-seg.transit, .odot.transit, .orders-progress-fill       { background: var(--ord-warn) !important; }
.odash-seg.toorder, .odot.toorder                              { background: var(--ord-bad) !important; }
.odash-summary-pct { color: var(--ord-ok) !important; background: color-mix(in srgb, var(--ord-ok) 13%, transparent) !important; }
.odash-summary-pct.risk { color: var(--ord-bad) !important; background: color-mix(in srgb, var(--ord-bad) 12%, transparent) !important; }
.odash-chip.prod { color: var(--ord-info) !important; background: color-mix(in srgb, var(--ord-info) 10%, transparent) !important; }
.odash-chip.risk { color: #fff !important; background: var(--ord-bad) !important; }
.odash-priority-label { color: var(--ord-warn) !important; }
.odash-prio-chip.prio-ok      { border-color: color-mix(in srgb, var(--ord-ok) 45%, transparent) !important; }
.odash-prio-chip.prio-transit { border-color: color-mix(in srgb, var(--ord-warn) 50%, transparent) !important; }
.odash-prio-chip.prio-missing { border-color: color-mix(in srgb, var(--ord-bad) 50%, transparent) !important; background: color-mix(in srgb, var(--ord-bad) 7%, transparent) !important; }
.orders-chip-status.is-technical { color: var(--ord-info) !important; }
.orders-chip-status.is-estimate  { color: var(--ord-warn) !important; }
.orders-chip-status.is-none      { color: var(--ord-bad) !important; }
.orders-materials-table td.mat-design { color: var(--ord-warn) !important; }
.orders-materials-table td.mat-plany  { color: var(--ord-info) !important; }
.orders-materials-table .eta-pill { color: var(--ord-info) !important; background: color-mix(in srgb, var(--ord-info) 12%, transparent) !important; }
.orders-materials-table td.stock-negative strong,
.orders-material-table td.stock-negative strong { color: var(--ord-bad) !important; }

/* --- Przełącznik widoku + chipy konstrukcji: spójne z akcentem, spokojne --- */
.orders-view-pill.active { background: var(--ord-info) !important; }
.orders-chip { background: var(--surface); }
.orders-chip.is-issued { background: var(--surface-muted); }

/* --- Przycisk „?" pomocy + legenda kolorów (czytelność statusów od ręki) --- */
.orders-help-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; padding: 0; margin-left: 4px;
  border: none; background: transparent; color: var(--muted);
  cursor: pointer; vertical-align: middle; border-radius: 50%;
}
.orders-help-btn:hover { color: var(--ord-info); background: color-mix(in srgb, var(--ord-info) 12%, transparent); }
.orders-help-btn .icon { width: 16px; height: 16px; }
.orders-legend {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px;
  font-size: 11.5px; color: var(--muted);
}
.orders-legend-item { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.ord-key { width: 10px; height: 10px; border-radius: 3px; flex: none; display: inline-block; }
.ord-key.ok { background: var(--ord-ok); }
.ord-key.transit { background: var(--ord-warn); }
.ord-key.bad { background: var(--ord-bad); }
.ord-key.info { background: var(--ord-info); }
.orders-legend-sep { width: 1px; height: 13px; background: var(--line); display: inline-block; }

/* --- Kropka BOM (JEDYNY dom = konstrukcja): granat=techniczny, błękit=szacunek, czerwony=brak --- */
.orders-bom-dot { width: 11px; height: 11px; border-radius: 50%; flex: none; display: inline-block; vertical-align: middle; }
.orders-bom-dot.is-technical { background: #10357f; }   /* ciemny granat = BOM techniczny (dokładny) */
.orders-bom-dot.is-estimate  { background: #7cc0f7; }   /* jasny błękit = szacunek (≈) */
.orders-bom-dot.is-none      { background: var(--ord-bad, #c3352b); } /* brak BOM */
.orders-chip { gap: 7px; }

/* --- Etykiety sekcji w węźle projektu (Konstrukcje / Do zamówienia) --- */
.orders-section-label {
  font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em;
  color: var(--muted); margin: 6px 2px 0;
}
.orders-section-label span { font-weight: 600; text-transform: none; letter-spacing: 0; }

/* --- Przycisk „oko" = podgląd materiałów konstrukcji (tylko do oglądania) --- */
.orders-chip-preview { width: 22px; height: 22px; color: var(--muted); flex: none; }
.orders-chip-preview:hover { color: var(--ord-info); background: color-mix(in srgb, var(--ord-info) 12%, transparent); }
.orders-chip-preview .icon { width: 14px; height: 14px; }

/* --- Modal podglądu materiałów: szerszy, scrollowalny, grupy dostawców --- */
.app-confirm.app-info:has(.orders-preview-modal) { max-width: min(680px, 94vw) !important; width: 100% !important; }
.orders-preview-scroll { max-height: 56vh; overflow-y: auto; padding-right: 4px; margin-top: 2px; }
.orders-preview-supplier { margin: 0 0 14px; }
.orders-preview-supplier-head {
  position: sticky; top: 0; z-index: 1;
  font-weight: 800; font-size: 12px; margin: 0 0 4px;
  padding: 4px 0 4px; border-bottom: 1px solid var(--line);
  background: var(--surface);
}
.orders-preview-supplier-head span { font-weight: 600; color: var(--muted); }

/* POPRAWKI 23 — dłuższe (poprawne) etykiety profilu marż mogą się zawijać zamiast ucinać */
.project-costs-modal .project-cost-version-table-label { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; line-height: 1.2 !important; }

/* ============================================================
   POPRAWKI 24 — popup wyboru trasy odcinka (kategoria -> środek -> adresy -> km)
   ============================================================ */
.modal.route-segment-popup { max-width: 470px !important; width: 470px !important; }
.route-segment-popup-head { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 8px !important; padding: 14px 18px !important; border-bottom: 0.5px solid var(--line) !important; }
.route-segment-popup-head h2 { font-size: 16px !important; font-weight: 800 !important; margin: 0 !important; color: var(--text) !important; }
.route-segment-popup-body { display: grid !important; gap: 12px !important; padding: 16px 18px !important; }
.route-segment-popup-body .field { display: grid !important; gap: 4px !important; }
.route-segment-popup-body .field > label { font-size: 12px !important; font-weight: 600 !important; color: var(--muted) !important; }
.route-segment-popup-addresses { display: grid !important; gap: 10px !important; }
.route-segment-popup-km { display: flex !important; align-items: center !important; gap: 12px !important; padding-top: 2px !important; }
.route-segment-popup-km[hidden] { display: none !important; }
.route-segment-popup-km-val { font-weight: 800 !important; font-variant-numeric: tabular-nums !important; font-size: 15px !important; color: var(--text) !important; }
.modal.route-segment-popup > footer { display: flex !important; justify-content: flex-end !important; gap: 8px !important; padding: 12px 18px !important; border-top: 0.5px solid var(--line) !important; }
.project-costs-modal input[data-route-name-popup] { cursor: pointer !important; background: color-mix(in srgb, var(--accent) 5%, var(--surface)) !important; }
.project-costs-modal input[data-route-name-popup]:hover { background: color-mix(in srgb, var(--accent) 11%, var(--surface)) !important; }

/* ============================================================
   POPRAWKI 25 — stary system: rozbicie ładowności ciężarówki na typy transportu
   ============================================================ */
.project-costs-modal .project-cost-legacy-basis {
  margin: 0 0 6px 0 !important;
  padding: 7px 10px !important;
  font-size: 11.5px !important;
  line-height: 1.35 !important;
  color: var(--muted) !important;
  background: color-mix(in srgb, var(--accent) 7%, var(--surface)) !important;
  border: 0.5px solid color-mix(in srgb, var(--accent) 24%, var(--line)) !important;
  border-radius: 8px !important;
}

/* ============================================================
   POPRAWKI 26 — okno Transport ekipy: dopracowanie (impeccable)
   - nieaktywne pole rozliczenia wygaszone (disable-look, ale readonly = wartość zostaje)
   - dyskretne podpowiedzi pod polami
   ============================================================ */
.crew-travel-editor-form .field-hint {
  display: block !important;
  margin-top: 3px !important;
  font-size: 11px !important;
  line-height: 1.3 !important;
  color: var(--muted) !important;
}
.crew-travel-editor-form .field.is-inactive { opacity: 0.5 !important; }
.crew-travel-editor-form .field.is-inactive label { color: var(--muted) !important; }
.crew-travel-editor-form .field.is-inactive input {
  background: color-mix(in srgb, var(--text) 4%, var(--surface)) !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}
.crew-travel-editor-form .field.is-inactive .field-hint { opacity: 0.8 !important; }

/* ============================================================
   POPRAWKI 27 — dojazd certyfikatora (trasa) w sekcji Certyfikaty
   ============================================================ */
.project-costs-modal .project-cost-cert-travel-panel { margin-top: 10px !important; }
.project-costs-modal .project-cost-cert-travel-info {
  font-size: 11.5px !important;
  line-height: 1.4 !important;
  color: var(--muted) !important;
  margin-bottom: 8px !important;
}
.project-costs-modal .project-cost-cert-travel-active-note {
  display: inline !important;
  color: var(--danger) !important;
  font-weight: 600 !important;
}
.project-costs-modal .project-cost-cert-travel-active-note[hidden] { display: none !important; }

/* ============================================================
   POPRAWKI 28 — DECK/NETTING w JEDNEJ LINII (nie nagłówek). Tylko STAL jest nagłówkiem z rozbiciem.
   Nazwa kategorii po lewej (czytelna, wersaliki), wartość po prawej — jak wiersz stali.
   ============================================================ */
.project-costs-modal .project-cost-editor-column .project-cost-bom-steel-rule.is-single { margin-top: 2px !important; }
.project-costs-modal .project-cost-editor-column .project-cost-bom-steel-rule.is-single .project-cost-bom-steel-rule-tile.is-rule-line > span {
  color: var(--text) !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
}

/* ============================================================
   POPRAWKI 41 — sekcja „Zamawianie i zapas": WĄSKIE pola (max ~4 cyfry), „%" W POLU
   (wzorzec ::after z POPRAWKI 17), select „sposób zamawiania" + karta „co to nadwyżka".
   ============================================================ */
.material-ordering-panel .colors-reserve {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  gap: 20px;
  align-items: start;
  margin-top: 4px;
}
.material-ordering-panel .colors-reserve-fields { display: flex; flex-direction: column; gap: 10px; }
.material-ordering-panel .reserve-field { display: grid; gap: 4px; }
.material-ordering-panel .reserve-field > label { font-size: 12px; font-weight: 600; color: var(--muted-2, #555); white-space: nowrap; }
.material-ordering-panel .reserve-field input[type="number"] {
  width: 96px; max-width: 96px; text-align: right; font-weight: 700;
  -moz-appearance: textfield; appearance: textfield;
}
.material-ordering-panel .reserve-field select { width: 96px; max-width: 96px; font-weight: 600; }
.material-ordering-panel .reserve-field.is-dimmed { opacity: 0.45; }
.material-ordering-panel .reserve-field.is-dimmed input { background: var(--surface-2, #f3f4f6); cursor: not-allowed; }
.material-ordering-panel .reserve-pct { position: relative; display: inline-block; width: 96px; }
.material-ordering-panel .reserve-pct > input[type="number"] { width: 96px; max-width: 96px; padding-right: 22px; }
.material-ordering-panel .reserve-pct::after {
  content: "%"; position: absolute; right: 9px; top: 50%; transform: translateY(-50%);
  color: var(--muted, #777); font-size: 11px; font-weight: 700; pointer-events: none;
}
.material-ordering-panel .colors-reserve-help {
  background: color-mix(in srgb, var(--accent, #3b6ef0) 7%, var(--surface, #fff));
  border: 1px solid color-mix(in srgb, var(--accent, #3b6ef0) 20%, transparent);
  border-radius: var(--radius, 12px); padding: 12px 14px; font-size: 12.5px; line-height: 1.5; color: var(--text, #1a1a1a);
}
.material-ordering-panel .colors-reserve-help strong { display: block; margin-bottom: 6px; font-size: 13px; }
.material-ordering-panel .colors-reserve-help p { margin: 0 0 8px; }
.material-ordering-panel .colors-reserve-list { line-height: 1.7; }
.material-ordering-panel .colors-reserve-example {
  margin-top: 4px; padding: 8px 11px; background: var(--surface, #fff);
  border: 1px solid var(--line, #e5e7eb); border-radius: 8px; font-weight: 600;
}
@media (max-width: 760px) {
  .material-ordering-panel .colors-reserve { grid-template-columns: 1fr; }
}

/* ============================================================
   POPRAWKI 42 — Stan PER KOLOR: edytowalna tabelka kolorów w formularzu +
   rozwijany wiersz materiału w kartotece (caret jak .orders-group-caret).
   ============================================================ */
.material-expand-caret-btn { display: inline-flex; align-items: center; cursor: pointer; padding: 2px 4px; margin-right: 2px; }
.material-expand-caret {
  display: inline-block; width: 0; height: 0;
  border-left: 5px solid var(--accent, #3b6ef0);
  border-top: 4px solid transparent; border-bottom: 4px solid transparent;
  transition: transform 0.15s ease;
}
.material-expand-caret.open { transform: rotate(90deg); }

.material-colors-panel .color-stock-table { width: 100%; border-collapse: collapse; margin-bottom: 8px; }
.material-colors-panel .color-stock-table th { text-align: left; font-size: 11px; font-weight: 600; color: var(--muted-2, #555); padding: 2px 6px 4px; }
.material-colors-panel .color-stock-table th:nth-child(2), .material-colors-panel .color-stock-table th:nth-child(3) { width: 112px; }
.material-colors-panel .color-stock-table th:last-child { width: 42px; }
.material-colors-panel .color-stock-table td { padding: 2px 6px; }
.material-colors-panel .color-stock-table input[type="text"] { width: 100%; }
.material-colors-panel .color-stock-table input[type="number"] { width: 100%; text-align: right; -moz-appearance: textfield; appearance: textfield; }
/* Jednostka w nagłówku tabeli kolorów: globalne `th { text-transform: uppercase }` robiło z „m²" → „M2".
   Wyłączamy uppercase TYLKO dla jednostki, żeby było prawdziwe lowercase „m²" (m³). */
.material-colors-panel .color-stock-table th .th-unit { text-transform: none; font-weight: 400; letter-spacing: 0; color: var(--muted-2, #888); }

/* ============================================================
   POPRAWKI 43 — tabela kolorów w formularzu = GĘSTA TABELA DANYCH.
   Rzędy ~½ niższe (pole 22px zamiast ~38px), pola jak komórki (ramka
   tylko na hover/focus), liczby tabular-nums do prawej, spójna czcionka.
   !important na rozmiarach pól bo globalne style inputów (theme-premium)
   mają wysoką specyfikę.
   ============================================================ */
.material-colors-panel .color-stock-table { font-size: 12px; margin-bottom: 6px; }
.material-colors-panel .color-stock-table th {
  font-size: 10px; font-weight: 700; letter-spacing: .02em; color: var(--muted, #6b7280);
  padding: 1px 8px 3px !important; border-bottom: 1px solid var(--line, #e3e6ea);
}
.material-colors-panel .color-stock-table th:nth-child(2),
.material-colors-panel .color-stock-table th:nth-child(3) { width: 92px; text-align: right; }
.material-colors-panel .color-stock-table td {
  padding: 0 !important; vertical-align: middle;
  border-bottom: 1px solid color-mix(in srgb, var(--line, #e3e6ea) 70%, transparent);
}
.material-colors-panel .color-stock-table tr:last-child td { border-bottom: 0; }
/* Pola = komórki danych: niskie, przezroczyste, ramka dopiero przy interakcji */
.material-colors-panel .color-stock-table input[type="text"],
.material-colors-panel .color-stock-table input[type="number"] {
  width: 100%; height: 22px !important; min-height: 0 !important;
  padding: 0 8px !important; font-size: 12px !important; line-height: 1.1 !important;
  font-family: inherit !important; border: 1px solid transparent !important;
  border-radius: 6px; background: transparent !important; box-shadow: none !important;
}
.material-colors-panel .color-stock-table input:hover {
  background: color-mix(in srgb, var(--accent, #3b6ef0) 6%, transparent) !important;
}
.material-colors-panel .color-stock-table input:focus {
  background: var(--surface, #fff) !important; border-color: var(--accent, #3b6ef0) !important; outline: none !important;
}
.material-colors-panel .color-stock-table input[type="number"] { text-align: right; font-variant-numeric: tabular-nums; }
/* Usuń koloru: mały, nie rozpycha rzędu */
.material-colors-panel .color-stock-table .button.mini { height: 20px !important; min-height: 0 !important; padding: 0 6px !important; }

/* Pod-wiersze kolorów WYRÓWNANE do kolumn tabeli materiału (kolor pod Materiał, stan pod Na stanie). */
.material-color-subrow > td { background: color-mix(in srgb, var(--accent, #3b6ef0) 5%, var(--surface, #fff)); padding-top: 3px; padding-bottom: 3px; font-size: 12.5px; }
.material-color-subname { padding-left: 24px !important; color: var(--text, #222); font-weight: 600; }
.material-color-subrow .stock-unit { color: var(--muted-2, #888); font-size: 11px; }
.material-color-subrow .stock-negative { color: var(--danger, #d33); font-weight: 700; }
.material-color-subrow .stock-below-min { color: var(--warn, #c80); font-weight: 700; }
/* Wiersz główny materiału z kolorami: stan/min = SUMA per kolor (do odczytu, nie pole). */
.materials-stock-table .stock-color-sum { font-weight: 700; color: var(--text, #222); white-space: nowrap; }
.materials-stock-table .stock-color-sum .stock-unit { color: var(--muted-2, #888); font-size: 11px; font-weight: 400; }
/* Etap 2 — kolor w linii zamówienia (info dla dostawcy) */
.order-line-color { color: var(--accent, #3b6ef0); font-weight: 600; }

/* ============================================================
   POPRAWKI 44 — ROZWINIĘTE wiersze kolorów w KARTOTECE Materiały
   (Vinyl pod materiałem, ze strzałek usera) = ~½ niższe. Ścinamy pionowy
   padding td (było 3px+3px) i WYMUSZAMY niskie pola inline (bazowo bez
   height → ~30-40px). Wiersze GŁÓWNE materiałów nietknięte (inny selektor).
   ============================================================ */
.material-color-subrow > td { padding-top: 0 !important; padding-bottom: 0 !important; font-size: 11.5px; line-height: 1.1; }
.material-color-subrow .stock-cell { height: 22px; }
.material-color-subrow .stock-inline-input {
  height: 22px !important; min-height: 0 !important; padding: 0 6px !important;
  font-size: 11.5px !important; line-height: 1.1 !important;
}
.material-color-subrow .stock-edit { gap: 3px; }
.material-color-subname { line-height: 1.1; }

/* =====================================================================
   OKNO „Produkcja / Usługi" — kompaktowe i uporządkowane (życzenie użytkownika).
   unify wymusza rozmiary inputów przez `min-height: var(--control-h) !important`,
   więc redefinicja ZMIENNEJ w zakresie okna pokonuje !important bez wojny
   specyficzności. Font/padding/ukrycie firmy dociągamy wyższą specyficznością.
   ===================================================================== */
.modal.catalog-modal.work-service-modal {
  --control-h: 28px;
  --control-h-sm: 24px;
  width: min(880px, calc(100vw - 32px)) !important;
  height: auto !important;
  max-height: min(640px, calc(100dvh - 32px)) !important;
}
.modal.catalog-modal.work-service-modal input:not(.field-required-missing),
.modal.catalog-modal.work-service-modal select,
.modal.catalog-modal.work-service-modal textarea {
  font-size: 12px !important;
  padding: 3px 8px !important;
}
.modal.catalog-modal.work-service-modal .field label,
.modal.catalog-modal.work-service-modal .block-side-title {
  font-size: 10px !important;
}
/* Produkcja → pole/karta wyboru firmy znika (display:grid bije UA [hidden] — wymuszamy) */
.modal.catalog-modal.work-service-modal [data-ws-supplier-field][hidden],
.modal.catalog-modal.work-service-modal [data-ws-supplier-card][hidden] {
  display: none !important;
}
/* ============================================================
   POPRAWKI 45 (REDESIGN) — okno „Produkcja / Usługi" na poziom profesjonalny.
   Problemy: Waluta wyższa niż reszta (select 32 vs input 28), okno za wąskie
   (pasek Notatek w 2 rzędach) i za niskie, „ramka w ramce w ramce" (3 karty
   boczne + 3 panele + podgląd dostawcy = boxy w boxach).
   Fix: szersze+wyższe okno, PŁASKIE sekcje (hairline zamiast ramek), lewy rail
   = jedna powierzchnia, JEDNOLITA wysokość pól. Scope: tylko .work-service-modal.
   ============================================================ */
/* Okno: szersze (pasek Notatek w 1 rzędzie) + wyższe */
.modal.catalog-modal.work-service-modal {
  width: min(1080px, calc(100vw - 32px)) !important;
  height: min(720px, calc(100dvh - 32px)) !important;
  max-height: min(720px, calc(100dvh - 32px)) !important;
}
.modal.catalog-modal.work-service-modal .work-service-editor-form {
  grid-template-columns: 264px minmax(0, 1fr) !important;
  background: var(--surface, #fff) !important;
  height: 100% !important;
  min-height: 0 !important;
}
/* Lewy rail = JEDNA powierzchnia (nie 3 osobne karty) */
.modal.catalog-modal.work-service-modal .work-service-editor-side {
  background: #f6f8fb !important;
  border-right: 1px solid var(--line, #e3e8ef) !important;
  gap: 0 !important;
  padding: 14px 16px !important;
}
.modal.catalog-modal.work-service-modal .work-service-editor-main {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  padding: 6px 18px 10px !important;
}
/* Karty boczne i panele główne: BEZ ramki/tła — sekcje rozdzielone hairline + odstępem */
.modal.catalog-modal.work-service-modal .work-service-side-card,
.modal.catalog-modal.work-service-modal .work-service-editor-panel {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  gap: 6px !important;
  padding: 15px 0 !important;
  border-top: 1px solid var(--line, #e7ebf2) !important;
}
.modal.catalog-modal.work-service-modal .work-service-editor-side > .work-service-side-card:first-child,
.modal.catalog-modal.work-service-modal .work-service-editor-main > .work-service-editor-panel:first-child {
  border-top: 0 !important;
  padding-top: 2px !important;
}
/* Podgląd dostawcy: bez własnej ramki (był box w boxie) */
.modal.catalog-modal.work-service-modal .work-service-supplier-preview {
  border: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  font-size: 12px !important;
}
/* Wizytówka dostawcy (pełne dane kontaktowe) pod nazwą firmy — tylko Usługa Zlecana */
.modal.catalog-modal.work-service-modal .ws-supplier-card strong {
  display: block;
  font-size: 13px;
  font-weight: 800;
  color: var(--text, #0f172a);
  line-height: 1.25;
}
.modal.catalog-modal.work-service-modal .ws-supplier-card-lines {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-top: 5px;
}
.modal.catalog-modal.work-service-modal .ws-supplier-card-lines span {
  font-size: 11px;
  color: var(--muted, #5f6673);
  line-height: 1.35;
}
.modal.catalog-modal.work-service-modal .ws-supplier-empty {
  font-size: 11px;
  color: var(--muted, #5f6673);
  font-style: italic;
}
.modal.catalog-modal.work-service-modal .material-panel-head h3 { font-size: 12.5px !important; font-weight: 800 !important; }
/* Pola FORMULARZA: JEDNOLITA wysokość (Waluta select już nie odstaje) + spokojny styl.
   Scope do .field — żeby NIE dotykać selectów paska Notatek (Tekst/Skala). */
.modal.catalog-modal.work-service-modal .field input:not([type="file"]),
.modal.catalog-modal.work-service-modal .field select {
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 9px !important;
  font-size: 12px !important;
  border: 1px solid var(--line, #d7dee8) !important;
  border-radius: var(--radius, 7px) !important;
  background: var(--surface, #fff) !important;
}
/* Rozliczenie: 4 pola w JEDNEJ linii, szerokości do treści, równa wysokość */
.modal.catalog-modal.work-service-modal .ws-rate-grid {
  display: grid !important;
  grid-template-columns: 128px 92px 176px 116px !important;
  justify-content: start !important;
  gap: 10px !important;
  align-items: end !important;
}
.modal.catalog-modal.work-service-modal .ws-rate-hint {
  display: block; margin: 8px 0 0; color: #475467; font-size: 10.5px; line-height: 1.4;
}
/* Notatki: edytor wyższy; pasek w 1 rzędzie (szerokie okno daje miejsce),
   ale gdyby kiedyś zabrakło miejsca — zawija zamiast ucinać (było overflow:hidden). */
/* Notatki rosną i sięgają DOŁU kolumny (równo z lewą szarą) — flex-fill całego łańcucha. */
.modal.catalog-modal.work-service-modal .work-service-notes-panel {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  padding-bottom: 0 !important;
}
.modal.catalog-modal.work-service-modal .work-service-notes-panel .field.full {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
}
.modal.catalog-modal.work-service-modal .work-service-rich-notes {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 150px !important;
}
.modal.catalog-modal.work-service-modal .work-service-rich-notes .rich-editable {
  flex: 1 1 auto !important;
  min-height: 0 !important;
}
.modal.catalog-modal.work-service-modal .rich-toolbar {
  flex-wrap: wrap !important; align-items: center !important; height: auto !important; overflow: visible !important; row-gap: 4px; flex: 0 0 auto !important;
}
@media (max-width: 760px) {
  .modal.catalog-modal.work-service-modal { width: calc(100vw - 16px) !important; }
  .modal.catalog-modal.work-service-modal .work-service-editor-form { grid-template-columns: 1fr !important; }
  .modal.catalog-modal.work-service-modal .work-service-editor-side { border-right: 0 !important; border-bottom: 1px solid var(--line, #e3e8ef) !important; }
  .modal.catalog-modal.work-service-modal .ws-rate-grid { grid-template-columns: 1fr 1fr !important; }
}