/* karta-dzialki-gmina.css: sekcje „Plan ogólny gminy”, „Ceny transakcyjne gruntów w okolicy” i „Gmina w liczbach”
   na karcie działki (assets/karta-dzialki-gmina.js, paczka D programu danych, 29.10.2026).

   Język kart „Sprawdź” z rejestr.hww.pl: klasy .rj-sek, .rj-sek-h, .rj-tab i .rj-zasl biorą
   wygląd ze wspólnego assets/wyszukiwarka-rejestr.css (selektory pod kontenerem .rj). Karta wyniku zdejmuje
   klasę rj z <main>, więc sekcje stoją we własnym kontenerze .rj.kd-gm; ten arkusz odbiera kontenerowi
   miary strony (szerokość 1280, wypełnienie 32/24/56) i dokłada tylko to, czego wspólny arkusz nie ma:
   tytuł h3 w głowie sekcji (wzór karty firmy), tabelę „etykieta: wartość” i pigułkę „Pokaż wszystkie”.
   Źródła i noty sekcji stoją w dolnym rozwijaku karty (#km-gmina-zrodla w .ko-foot-body), nie w sekcjach.
   Pismo min. 14 px (drobny druk), treść tabel 16 px.

   Lista transakcji (P7, 1.11.2026) przechodzi w wiersze dwuwierszowe według szerokości KARTY, nie okna: kontener
   .kd-gm jest kontenerem zapytań (container), a reguły listy stoją w @container kd-gm. Przy oknie 641–800 px
   kontener kart ma 601–736 px, a tabela sześciu kolumn potrzebowała 733 px (Sokółka) i 896 px (Szemud), więc próg
   okna 640 px dawał poziome przewijanie strony. Dopisek „poza medianą” pod ceną za m² zawija się (inaczej dziedziczy
   nowrap kolumny liczb i sam rozpycha tabelę). Pomiar i reguła: tests/karta-dzialki-gmina-lista-szerokosc.test.js. */

#l360-app .kd-gm.rj{max-width:none;margin:28px 0;padding:0;background:transparent;container:kd-gm/inline-size}
#l360-app .kd-gm.rj .kd-gm-sek:first-child{margin-top:0}
.kd-gm.rj .rj-sek-h{flex-wrap:wrap;gap:4px 12px}
.kd-gm.rj .rj-sek-h h3{margin:0;font-family:inherit;font-size:18px;font-weight:700;letter-spacing:-.01em;line-height:1.3;color:var(--rj-ink)}
.kd-gm.rj .rj-sek-h em{margin-left:auto;font-size:14.4px;font-weight:500;color:var(--rj-slaby);font-variant-numeric:tabular-nums}

/* tabela „etykieta: wartość” (bez nagłówka kolumn) */
.kd-gm.rj .kd-gm-tab td:first-child{width:44%;color:var(--rj-tekst)}
.kd-gm.rj .kd-gm-tab td b{font-weight:700;color:var(--rj-ink);font-variant-numeric:tabular-nums}
.kd-gm.rj .rj-tab td small{display:block;margin-top:2px;font-size:14px;line-height:1.45;color:var(--rj-slaby);font-weight:400}
.kd-gm.rj .kd-gm-brak{color:var(--rj-slaby)}
.kd-gm.rj .rj-zasl{white-space:nowrap}

/* lista transakcji */
.kd-gm.rj .kd-gm-h4{margin:20px 0 6px;font-family:inherit;font-size:16px;font-weight:700;line-height:1.4;color:var(--rj-ink)}
.kd-gm.rj .kd-gm-lista td:first-child{font-weight:400}
.kd-gm.rj .kd-gm-lista td{font-variant-numeric:tabular-nums}
.kd-gm.rj .kd-gm-lista tr[hidden]{display:none}
.kd-gm.rj .kd-gm-lista td small{white-space:normal}
.kd-gm.rj .kd-gm-wiecej{margin:12px 0 0}
/* odsłona listy: biała pigułka z obrysem turkusu (bez ciemnozielonych bloków przycisków) */
.kd-gm.rj .kd-gm-pig{display:inline-flex;align-items:center;min-height:44px;padding:8px 18px;border:1.5px solid var(--rj-akcent);border-radius:999px;
  background:var(--rj-bialy);color:var(--rj-akcent-ciem);font:600 16px/1.3 var(--rj-font);cursor:pointer}
.kd-gm.rj .kd-gm-pig:hover{background:var(--rj-akcent-tlo)}
.kd-gm.rj .kd-gm-pig:focus-visible{outline:2px solid var(--rj-akcent);outline-offset:2px}

/* stan ładowania i jawny brak odpowiedzi */
.kd-gm.rj .kd-gm-stan{margin:0;font-size:16px;line-height:1.55;color:var(--rj-tekst)}

/* źródła i noty trzech sekcji w dolnym rozwijaku karty (podtytuły h4 i akapity jak „Zakres i zastrzeżenia”) */
#l360-app .kd-gm-zrodla{scroll-margin-top:calc(var(--rj-naglowek,89px) + 16px)}
#l360-app .kd-gm-zrodla p{margin:0 0 6px;font-size:14px;line-height:1.6}
/* Pierwszy podtytuł bloku stoi za „Zakres i zastrzeżenia”: reguła karty „h4:first-child{margin-top:0}” (karta-miejsca.css)
   łapie go jako pierwsze dziecko własnego kontenera, więc odstęp przywracamy (ten sam co między podtytułami karty). */
#l360-app .ko-foot-body .kd-gm-zrodla h4:first-child{margin-top:26px}
#l360-app .kd-gm-zrodla a{color:var(--ko-green,#007672);text-decoration:underline}

@media (max-width:640px){
  #l360-app .kd-gm.rj{margin:20px 0}
  .kd-gm.rj .rj-sek-h em{margin-left:0;width:100%}
  /* tabela „etykieta: wartość”: etykieta (14 px, jak dopisek data-lab wzoru) nad wartością; wspólny arkusz
     układa wiersze tabel w bloki */
  .kd-gm.rj .kd-gm-tab td:first-child{width:100%;font-size:14px;font-weight:600;color:var(--rj-slaby)}
  .kd-gm.rj .kd-gm-tab td+td{padding-top:2px}
}

/* Lista transakcji w karcie węższej niż sześć kolumn: wiersz w dwóch liniach zamiast tabeli. U góry data i cena za m²,
   pod spodem powierzchnia, cena, rynek i odległość (jednostki mówią same za siebie). Próg to szerokość kontenera kart
   (.kd-gm), w której tabela sześciu kolumn mieści się w sekcji razem z jej wypełnieniem. Min-content zestawu
   skrajnego na runnerze CI (Linux) to 768 px (2.11.2026, bieg vdr PR #631), a sekcja zabiera 42 px (padding
   i obramowanie), czyli 810 px. Próg 840 px zostawia 30 px zapasu na metryki kroju zapasowego, którego
   font-display:optional może użyć także po załadowaniu DM Sans; próg 800 px przepuszczał przewijanie w 800–808 px. Ten sam układ dostaje telefon,
   bo tam kontener jest jeszcze węższy. Reguły blokowe tabeli (thead, tbody, obrys wiersza) stoją tu same, bo wspólny
   arkusz rejestru włącza je dopiero przy oknie do 640 px. */
@container kd-gm (max-width:839.98px){
  .kd-gm.rj .kd-gm-lista,.kd-gm.rj .kd-gm-lista tbody{display:block;width:100%}
  .kd-gm.rj .kd-gm-lista thead{display:none}
  .kd-gm.rj .kd-gm-lista tr{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 0;padding:10px 0;border-bottom:1px solid var(--rj-linia)}
  .kd-gm.rj .kd-gm-lista tr:last-child{border-bottom:0}
  .kd-gm.rj .kd-gm-lista td{display:block;width:auto;padding:0;border:0}
  .kd-gm.rj .kd-gm-lista td[data-lab]::before{content:none}
  /* Data i cała kwota z jednostką dzielą miejsce według treści. Gdy obie nie mieszczą się obok siebie,
     przechodzą do osobnych linii; opis transakcji pozostaje pod nimi. Dotyczy także szerszego kroju zapasowego. */
  .kd-gm.rj .kd-gm-lista td[data-col="date"]{order:1;flex:1 1 40%;min-width:min-content;font-weight:600;color:var(--rj-ink)}
  .kd-gm.rj .kd-gm-lista td[data-col="unit-price"]{order:2;flex:1 1 60%;min-width:min-content;white-space:normal;text-align:right;font-weight:700;color:var(--rj-ink)}
  .kd-gm.rj .kd-gm-lista tr::after{content:"";order:2;flex:0 0 100%;height:0;margin-top:-2px}
  .kd-gm.rj .kd-gm-lista td.kd-gm-pusty{display:none}
  .kd-gm.rj .kd-gm-lista td[data-col="area"]{order:3}
  .kd-gm.rj .kd-gm-lista td[data-col="price"]{order:4}
  .kd-gm.rj .kd-gm-lista td[data-col="market"]{order:5}
  .kd-gm.rj .kd-gm-lista td[data-col="distance"]{order:6}
  .kd-gm.rj .kd-gm-lista td:is([data-col="area"],[data-col="price"],[data-col="market"],[data-col="distance"]){
    text-align:left;font-size:14px;line-height:1.5;color:var(--rj-slaby)}
  .kd-gm.rj .kd-gm-lista td:is([data-col="price"],[data-col="market"],[data-col="distance"])::before{content:"\00a0·\00a0";display:inline}
  .kd-gm.rj .kd-gm-lista td[data-col="market"]>span::before{content:attr(data-lab) "\00a0";text-transform:lowercase}
  .kd-gm.rj .kd-gm-lista td[data-col="unit-price"] small{font-weight:400;text-wrap:balance}
}

/* W najwęższej karcie cena z dopiskiem ma cały wiersz, a data własny wiersz pod nią. */
@container kd-gm (max-width:399.98px){
  .kd-gm.rj .kd-gm-lista td[data-col="unit-price"]{order:1;flex-basis:100%}
  .kd-gm.rj .kd-gm-lista td[data-col="date"]{order:2;flex-basis:100%}
}