/*
 * KiwiLab Nova — CSS design-token réteg (core-theming §2/§6, ADR-0006).
 *
 * Minden saját Vue/CSS KIZÁRÓLAG ezeket a --kiwi-* tokeneket használja
 * (nincs beégetett szín/méret). Projekt-szinten egy override CSS a Nova
 * asset-csatornáján (a core UTÁN töltve) felülírja a tokeneket — a csomagok
 * forkolása/újraépítése nélkül. Ahol a Nova branding elsődleges színt ad,
 * a --kiwi-color-primary ahhoz igazodjon (projekt-override-ban).
 */
:root {
    /* Színek */
    --kiwi-color-primary: #18a3a3;
    --kiwi-color-primary-contrast: #ffffff;
    --kiwi-color-surface: #ffffff;
    --kiwi-color-surface-muted: #f3f5f7;
    --kiwi-color-surface-input: #ffffff;
    --kiwi-color-border-input: #d9dee3;
    --kiwi-color-text: #1f2933;
    --kiwi-color-text-muted: #6b7280;
    --kiwi-color-border: #d9dee3;
    --kiwi-color-accent: #f2a900;

    /* Állapot-színek */
    --kiwi-color-success: #2f9e44;
    --kiwi-color-warning: #f08c00;
    --kiwi-color-danger: #e03131;
    --kiwi-color-info: #1c7ed6;

    /* Térköz */
    --kiwi-space-1: 0.25rem;
    --kiwi-space-2: 0.5rem;
    --kiwi-space-3: 0.75rem;
    --kiwi-space-4: 1rem;
    --kiwi-space-5: 1.5rem;
    --kiwi-space-6: 2rem;

    /* Sugár */
    --kiwi-radius: 0.5rem;

    /* Tipográfia */
    --kiwi-font-family: inherit;
    --kiwi-font-size-sm: 0.8125rem;
    --kiwi-font-size-md: 0.875rem;
    --kiwi-font-size-lg: 1rem;
    --kiwi-font-weight-normal: 400;
    --kiwi-font-weight-medium: 500;
    --kiwi-font-weight-bold: 700;
    --kiwi-line-height: 1.5;

    /* Chrome (Nova váz) — SEMLEGES (stock Nova) alapok; a kiwistyle preset írja sötétre. */
    --kiwi-topbar-bg: #ffffff;
    --kiwi-topbar-fg: #64748b;
    --kiwi-topbar-border: #e2e8f0;
    --kiwi-topbar-height: 3.5rem;
    --kiwi-sidebar-bg: transparent;
    --kiwi-sidebar-fg: #64748b;
    --kiwi-sidebar-fg-muted: #94a3b8;
    --kiwi-sidebar-active-bg: transparent;
    --kiwi-sidebar-active-fg: #0284c7;

    /* Tábla / sűrűség (listanézet) — Nova alapértelmezett (kényelmes). */
    --kiwi-body-bg: #f1f5f9;
    --kiwi-table-header-bg: #f8fafc;
    --kiwi-table-header-fg: #64748b;
    --kiwi-table-border: #e2e8f0;
    --kiwi-row-hover-bg: #f8fafc;
    --kiwi-cell-pad-y: 0.5rem;
    --kiwi-cell-pad-x: 1.25rem;
    --kiwi-row-font-size: 0.875rem;
    --kiwi-header-font-size: 0.6875rem;
    --kiwi-icon-size: 1rem;
    --kiwi-action-icon-color: #64748b;

    /* Nova natív accent (--colors-primary-*), RGB-hármas. Semleges = Nova sky-blue. */
    --kiwi-accent-rgb-400: 56, 189, 248;
    --kiwi-accent-rgb-500: 14, 165, 233;
    --kiwi-accent-rgb-600: 2, 132, 199;

    /* Mobil kompakt oszlop-plafon (mobile.md §2.5). Szűk nézeten a látható
     * oszlopok legfeljebb ekkorára feszülnek — a payload.width tárolt értéke
     * NEM változik, ez csak megjelenítési plafon. */
    --kiwi-mobile-col-max: 12rem;
}

/* ══════════════════════════════════════════════════════════════════════════════
 * CHROME-MAPPING RÉTEG (core-theme-skins §5, ADR-0011) — a --kiwi-* tokeneket a
 * Nova 5.9 natív vázára képezi. TÖRÉKENY-DE-KÖZPONTOSÍTOTT + GRACEFUL: ha egy jövőbeli
 * Nova-major átnevezi a szelektorokat, a szabályok némán nem illeszkednek → a Nova alap
 * külalak marad (semmi sem törik). A tokenek SEMLEGES alapja miatt e réteg alból láthatatlan;
 * csak egy sötét/kompakt preset (kiwistyle) aktiválásakor „kel életre". A `:root:root`/`#nova`
 * specificitás felülírja a Nova utility-osztályokat, `!important` nélkül (ahol lehet).
 * ══════════════════════════════════════════════════════════════════════════════ */

/* (A) Betűcsalád — a teljes admin a --kiwi-font-family-t kapja (kiwistyle → Barlow). */
#nova { font-family: var(--kiwi-font-family); line-height: var(--kiwi-line-height); }

/* (B) Nova natív accent-szín átszínezése EGY ponton (gombok/linkek/aktív állapotok/lapozó).
 * A Nova a `rgb(var(--colors-primary-500))`-öt használja mindenütt → a mi RGB-hármas
 * tokenünkre kötjük. `:root:root` a Nova :root-ja fölé. */
:root:root {
    --colors-primary-400: var(--kiwi-accent-rgb-400);
    --colors-primary-500: var(--kiwi-accent-rgb-500);
    --colors-primary-600: var(--kiwi-accent-rgb-600);
}

/* (C) Topbar (light módban is sötét, ha a preset úgy adja). */
#nova header {
    background-color: var(--kiwi-topbar-bg);
    color: var(--kiwi-topbar-fg);
    border-bottom: 1px solid var(--kiwi-topbar-border);
    height: var(--kiwi-topbar-height);
    min-height: var(--kiwi-topbar-height);
}
#nova header button,
#nova header a,
#nova header h1 {
    color: var(--kiwi-topbar-fg);
}

/* (D) Sidebar (a body-sor első oszlopa: w-60). Sötét háttér + világos linkek. */
#nova > div:nth-child(2) > div:first-child {
    background-color: var(--kiwi-sidebar-bg);
}
#nova > div:nth-child(2) > div:first-child a {
    color: var(--kiwi-sidebar-fg);
    /* Kompakt elem-térköz (gundel: ~1px köz) — a Nova py-1/mt-1 széttolást szűkítjük. */
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
    margin-top: 1px;
    margin-bottom: 1px;
}
/* OLVASHATÓ hover: a Nova `hover:bg-gray-100` VILÁGOS hátterét felülírjuk egy finom,
 * a sötét sávon is működő tinttel + világos szöveggel (a világos-háttér-világos-szöveg
 * olvashatatlanság megszűnik). */
#nova > div:nth-child(2) > div:first-child a:hover {
    background-color: color-mix(in srgb, var(--kiwi-sidebar-fg) 16%, transparent);
    color: #ffffff;
}
/* Sidebar ikonok: kicsit kisebbek + vastagabbak (bold), gundel-szerű. */
#nova > div:nth-child(2) > div:first-child a svg {
    width: 1.15rem;
    height: 1.15rem;
    stroke-width: 2.2;
}
/* Aktív menüpont: a Nova a `.text-primary-500` (+ font-bold) osztállyal jelöli — erre
 * teszünk PERZISZTENS kiemelő hátteret (a hover „ottmarad" az aktív elemen), a gold/bold
 * jelölést megtartva. (Az aria-current/.active-et a Nova itt nem használja.) */
#nova > div:nth-child(2) > div:first-child a.text-primary-500,
#nova > div:nth-child(2) > div:first-child a[aria-current] {
    background-color: color-mix(in srgb, var(--kiwi-sidebar-fg) 18%, transparent);
    border-radius: var(--kiwi-radius);
}
/* A menü-elemek közti NAGY térköz oka a Nova `.sidebar-menu.space-y-6` (24px a testvérek közt).
 * Felülírjuk kompaktra (a #nova id miatt a specificitás legyőzi a space-y utility-t). */
#nova .sidebar-menu > :not([hidden]) ~ :not([hidden]) {
    margin-top: 0.4rem;
}

/* (E) Tábla / sűrűség (listanézet). */
#nova table thead th {
    background-color: var(--kiwi-table-header-bg);
    color: var(--kiwi-table-header-fg);
    font-size: var(--kiwi-header-font-size);
    padding-top: var(--kiwi-cell-pad-y);
    padding-bottom: var(--kiwi-cell-pad-y);
}
#nova table tbody td {
    padding-top: var(--kiwi-cell-pad-y);
    padding-bottom: var(--kiwi-cell-pad-y);
    font-size: var(--kiwi-row-font-size);
    line-height: 1.5;
}
#nova table > tbody > tr {
    border-top-color: var(--kiwi-table-border);
}
/* Zebra (váltott sorszín) — a páratlan sorok halvány tint (gundel-minta). A td háttere
 * átlátszó (l. (G)), így a tr háttere látszik. A hover a zebra UTÁN áll → felülírja. */
#nova table > tbody > tr:nth-child(odd) {
    background-color: var(--kiwi-row-stripe-bg);
}
#nova table > tbody > tr:hover {
    background-color: var(--kiwi-row-hover-bg);
}

/* Checkbox-oszlop KÖZELEBB a bal szélhez (Nova pl-5/pr-5 → szűk). A sor-checkbox
 * JOBBRA IGAZÍTVA a cella-szélhez (padding-right: 0 + wrapper justify-end), így a
 * checkbox és a következő ⋯ akció-gomb közötti térköz (~1 px) megegyezik a ⋯↔👁 közti
 * 2 px belső gombtávolsággal (user-kérés 2026-07-06, [[kiwilab-nova-framework]]). Ezt a
 * fejléc chevron-elrejtésével (l. `kiwi-nova-grid/tool.css` §2.2) párhuzamosan alkalmazva
 * a fejléc- és sor-checkboxok függőlegesen 1 px-en belül alignálnak. */
#nova table thead th:first-child,
#nova table tbody td:first-child {
    padding-left: 0.5rem;
    padding-right: 0;
    text-align: right;
}
#nova table tbody td:first-child > [role="checkbox"][dusk$="-checkbox"] {
    display: inline-flex;
    justify-content: flex-end;
}
/* Akció-cella (a checkbox utáni, vezérlőket tartalmazó cella) közelebb + a gombok
 * közelebb egymáshoz. A `:has()` a vezérlő-cellát célozza, pozíció-függetlenül. A body
 * bal-padding 0 (a checkbox-cella jobbra igazított tartalmához csatlakozik közvetlenül);
 * a header 2. th üres, `nth-child(2)` szükséges (a `:has(-control-selector)` header-en
 * nem talál). */
#nova table td:has([dusk$="-control-selector"]),
#nova table th:has([dusk$="-control-selector"]) {
    padding-left: 0;
    padding-right: 0.25rem;
}
#nova table thead tr > th:nth-child(2) {
    padding-left: 0;
}
#nova table [dusk$="-view-button"],
#nova table [dusk$="-edit-button"],
#nova table [dusk$="-delete-button"],
#nova table [dusk$="-control-selector"] {
    margin-left: 1px;
    margin-right: 1px;
    padding-left: 2px;
    padding-right: 2px;
    /* Nova alap h-9 w-9 (36px) → kompakt, hogy a sor ~gundel-magas (≈29px) legyen. */
    height: 1.5rem;
    width: auto;
    min-width: 0;
    min-height: 0;
}

/* (N) Topbar/sidebar igazítás + TELJES MAGASSÁGÚ hátterek.
 * A Nova sidebar-oszlopa `lg:absolute` + tartalom-magasságú → hosszú oldalon lefelé görgetve
 * a sáv „elfogyott", és a Nova saját body-háttere (slate) látszott ki alatta; ugyanez a
 * tartalom-oszlop alatt is. Megoldás: a body-sor (`#nova > div:nth-child(2)`) legyen a
 * pozicionálási kontextus (relative) — így a sidebar `top:0; bottom:0`-val a SOR teljes
 * magasságát kitölti (a sor a tartalommal együtt nő) —, a sor és a body pedig a
 * --kiwi-body-bg tokent kapja, hogy a tartalom alatt se üssön át idegen szín. */
:root:root body {
    background-color: var(--kiwi-body-bg);
}
#nova > div:nth-child(2) {
    position: relative;
    /* Dinamikus viewport (mobile.md §2.8): a `100dvh` az iOS URL-sáv aktuális magasságát
     * követi; a `100vh` fallback a `100dvh`-t nem támogató böngészőnek. */
    min-height: calc(100vh - var(--kiwi-topbar-height));
    min-height: calc(100dvh - var(--kiwi-topbar-height));
    background-color: var(--kiwi-body-bg);
}
#nova > div:nth-child(2) > div:first-child {
    top: 0;      /* a kontextus a sor (ami a topbar ALATT kezdődik), nem a viewport */
    bottom: 0;   /* a Nova lg:bottom-auto helyett: a sáv a sor aljáig ér */
}
/* A kiwi eszköztár bal széle a sidebar-sáv széléhez: a Nova tartalmi bal-paddingjét (lg:px-12 = 3rem)
 * kioltjuk, így a gombok a 240px-es sáv szélén kezdődnek. CSAK `lg+`-en (≥1024px), ahol:
 *   (a) a sidebar látható és a kioltandó `lg:px-12` = 48px érvényes, ÉS
 *   (b) a Nova hamburger `lg:hidden` (nincs mibe belógni).
 * <lg breakpoint-on (mobil/tablet): a hamburger a Nova header-flex első gyereke `ml-1`-gyel;
 * a `flex-1 px-4 sm:px-8` konténer utána indul, és a host a saját szülőjének baloldali padding-jével
 * kényelmes gapet kap a hamburgertől — negatív margó tilos, mert az `<lg` Nova-padding csak 16/32px,
 * és az azt túllépő negatív margó a hamburgerre ránő (user-riport 2026-07-06, mobil-átfedés). */
@media (min-width: 1024px) {
    #nova header #kiwi-toolbar-host {
        margin-left: -3rem;
    }
}
/* A tartalom (kártya/cím/gomb) bal+jobb margója a sidebar-tól/ablak-széltől ≈12px (gundel-minta) —
 * a Nova nagy `md:px-12` (48px) belső paddingjét szűkítjük. A felső padding (Nova `md:py-8`
 * = 32px) FELEZVE: a resource-cím a topbarhoz közelebb kezdődik (user-kérés 2026-07-04). */
#nova > div:nth-child(2) > div:nth-child(2) {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    padding-top: 1rem;
}

/* (F) Listanézet akció-ikonok (nézet/szerkesztés) — aranyszínűek (gundel-minta). A törlés
 * marad a Nova saját (piros) színén. Pozíció-független (dusk-alapú), mert az akció-cella a
 * sor elejére is kerülhet (grid augmenter). A `currentColor`-os SVG-k a linkről öröklik a színt. */
#nova table [dusk$="-view-button"],
#nova table [dusk$="-edit-button"],
#nova table [dusk$="-control-selector"] {
    color: var(--kiwi-action-icon-color);
}
/* Akció-ikon MÉRET a kiwistyle-hoz igazítva (Nova alap 24px → --kiwi-icon-size). */
#nova table [dusk$="-view-button"] svg,
#nova table [dusk$="-edit-button"] svg,
#nova table [dusk$="-delete-button"] svg,
#nova table [dusk$="-control-selector"] svg {
    width: var(--kiwi-icon-size);
    height: var(--kiwi-icon-size);
}

/* (G) Lista/kártya felület + tartalom háttér — token-alapú, így dark módban is illeszkedik
 * (a .dark a --kiwi-color-surface/--kiwi-body-bg-t sötétre írja). A cellák háttere átlátszó,
 * hogy a kártya egységes felülete látszódjon (nincs Nova `dark:bg-gray-800` folt a sorokon). */
#nova .rounded-lg.shadow {
    background-color: var(--kiwi-color-surface);
}
/* A lista-kártya tetején lévő eszköz-sor (tömeges-művelet + szűrő, Nova `py-3`) KOMPAKTABB
 * — a mintához képest túl magas volt. A `.border-b` a listafejléc-sáv azonosítója. */
#nova .rounded-lg.shadow > div:first-child.border-b {
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
}
#nova table tbody td {
    background-color: transparent;
}
#nova > div:nth-child(2) > div:nth-child(2) {
    background-color: var(--kiwi-body-bg);
}

/* (H) Csúszkasávok (scrollbar) — a paletta tokenjeihez illesztve (light+dark).
 * GLOBÁLIS (nem `#nova`-szűkített!): a lap-szintű (html/body) csúszka és a body-ra
 * teleportált panelek (tölcsér, lenyílók) csúszkája dark módban VILÁGOS maradt volna —
 * a `#nova`-prefix ezekre nem hat (1.8 fix). A tokenek a :root-on élnek → mindenütt jók. */
:root:root ::-webkit-scrollbar,
:root:root::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}
:root:root ::-webkit-scrollbar-track,
:root:root::-webkit-scrollbar-track {
    background: var(--kiwi-color-surface-muted);
}
:root:root ::-webkit-scrollbar-thumb,
:root:root::-webkit-scrollbar-thumb {
    background: var(--kiwi-color-border);
    border-radius: 6px;
    border: 2px solid var(--kiwi-color-surface-muted);
}
:root:root ::-webkit-scrollbar-thumb:hover,
:root:root::-webkit-scrollbar-thumb:hover {
    background: var(--kiwi-color-text-muted);
}
:root:root,
:root:root * {
    scrollbar-color: var(--kiwi-color-border) var(--kiwi-color-surface-muted);
    scrollbar-width: thin;
}

/* (I) Topbar-beli kiwi eszköztár-gombok — a CHROME színeihez illeszkednek (light+dark),
 * mert a topbaron ülnek. Áttetsző háttér + topbar-fg szöveg/keret → sötét topbaron világos,
 * világos topbaron sötét (nem fehér pilulák a sötét sávon). A lenyíló menük (kiwi-tb-menu)
 * TOVÁBBRA is a felület-tokeneket használják (kártya a tartalom fölött) — azt nem írjuk felül. */
#nova #kiwi-toolbar-host .kiwi-tb-trigger,
#nova #kiwi-toolbar-host .kiwi-tb-iconbtn {
    position: relative;
    background: transparent;
    color: var(--kiwi-topbar-fg);
    border-color: color-mix(in srgb, var(--kiwi-topbar-fg) 35%, transparent);
}
#nova #kiwi-toolbar-host .kiwi-tb-trigger:hover,
#nova #kiwi-toolbar-host .kiwi-tb-iconbtn:hover {
    background: color-mix(in srgb, var(--kiwi-topbar-fg) 14%, transparent);
}

/* (J) Létrehozás gomb BALRA (gundel-minta): a Nova jobbra tolja (`ml-auto`) — feloldjuk. */
#nova .ml-auto:has([dusk="create-button"]) {
    margin-left: 0 !important;
    margin-right: auto;
}

/* (K) Dark mód: a Nova egyedi checkbox-a (`div[role=checkbox]`) FEHÉR (a sötét háttéren
 * a Nova alap sötét kerete alig látszana). A doboz `currentColor`-ból rajzol. */
:root:root.dark #nova [role="checkbox"] {
    color: #ffffff;
}
:root:root.dark #nova [role="checkbox"] svg {
    color: #ffffff;
}
/* Jelölők (Nova `role=checkbox` inner span + natív input[type=checkbox/radio]) dark
 * módban a LIGHT-mód surface-input színével jelennek meg (user-döntés 2026-07-10:
 * „inkább legyenek mindenhol azonosak a light mód background színével"). Így a
 * fehér doboz élesen kirajzolódik a sötét sorokon és cellákon; a Primary-színes
 * „checked" állapot érintetlen (Nova a `group-data-[state=checked]:bg-primary-500`
 * variánsban maga adja).
 * KIVÉTEL a fejléc-cellás `[dusk="select-all-indicator"]`: annak a data-state-je csak
 * teljes-oldal/-találat kijelöléskor `checked`/`indeterminate` — RÉSZLEGES oldalválasztásnál
 * `unchecked` marad, ilyenkor a grid tool.css `has(deselect-all-button)` szabálya primary-500
 * kitöltést ad neki (részleges-kijelölés-fix, §2.2 1.5). Ha ide is fehér doboz kerülne,
 * a felhasználó nem látná, hogy VAN kijelölése — l. user-panasz 2026-07-10 (S1/6). */
:root:root.dark #nova [role="checkbox"]:not([data-state="checked"]):not([data-state="indeterminate"]):not([dusk="select-all-indicator"]) > span {
    background-color: #ffffff !important;
    border-color: #d9dee3 !important;
}
@media (prefers-color-scheme: dark) {
    :root:root:not(.light) #nova [role="checkbox"]:not([data-state="checked"]):not([data-state="indeterminate"]):not([dusk="select-all-indicator"]) > span {
        background-color: #ffffff !important;
        border-color: #d9dee3 !important;
    }
}
/* A NATÍV `input[type=checkbox]`-ok (pl. a tölcsér RelationFilter checkbox-módja) az oldal
 * `color-scheme: normal`-ja miatt dark módban FEHÉREN renderelődtek (OS-vezérlő) — míg a
 * nova-ui `role=checkbox` dobozok sötétek → kevert kép. Elem-szintű color-scheme + accent
 * a tokenből: minden pipa egységesen sötét alapú, kiwi-primary kijelöléssel. */
:root:root.dark input[type="checkbox"],
:root:root.dark input[type="radio"] {
    color-scheme: dark;
    accent-color: var(--kiwi-color-primary);
}

/* (K2) Teleportált Nova-lenyílók (tölcsér/select-all/sor-műveletek — a panel a `<body>`-n
 * ül, NEM a `#nova` alatt!) — a Nova `bg-white dark:bg-gray-900` (slate) felülete dark
 * módban elütött a kiwi zinc-felülettől. A panel + belső űrlap-vezérlők a felület-tokenekre. */
:root:root [dusk="dropdown-menu"] [class*="bg-white"] {
    background-color: var(--kiwi-color-surface);
}
:root:root [dusk="dropdown-menu"] {
    color: var(--kiwi-color-text);
}
:root:root [dusk="dropdown-menu"] :is(input, select, textarea) {
    background-color: var(--kiwi-color-surface);
    color: var(--kiwi-color-text);
    border-color: var(--kiwi-color-border);
}

/* (K3) Tölcsér-menü: a „megjelenő sorok száma" (Per Page) blokk LEGFELÜLRE (user-kérés
 * 2026-07-04). A FilterMenu a `.divide-y` konténerben DOM-sorrendben rendereli (reset →
 * szűrők → trashed → per-page) — flex-oszloppá téve a per-page `order: -1`-gyel vizuálisan
 * első lesz, DOM-mozgatás (Vue-harc) nélkül. Az elválasztó-vonalak token-színre. */
:root:root [dusk="filter-menu"] .divide-y {
    display: flex;
    flex-direction: column;
}
:root:root [dusk="filter-menu"] [dusk="filter-per-page"] {
    order: -1;
    border-top: 0;
    border-bottom: 1px solid var(--kiwi-color-border);
}
:root:root [dusk="filter-menu"] .divide-y > :not([hidden]) ~ :not([hidden]) {
    border-color: var(--kiwi-color-border);
}

/* (K4) kiwi tooltip-buborék (core tooltip.js primitív) — a natív `title` nem stilizálható;
 * a buborék a felület-tokenekből épül (kerek sarok, dark-ban sötét), a többi kiwi-dobozhoz
 * (kiwi-tb-menu / panelek) illeszkedő megjelenéssel. */
.kiwi-tooltip {
    position: fixed;
    z-index: 90;
    max-width: 24rem;
    padding: 0.375rem 0.625rem;
    font-family: var(--kiwi-font-family);
    font-size: 0.75rem;
    line-height: 1.4;
    background: var(--kiwi-color-surface);
    color: var(--kiwi-color-text);
    border: 1px solid var(--kiwi-color-border);
    border-radius: var(--kiwi-radius, 0.375rem);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.25);
    pointer-events: none;
    overflow-wrap: break-word;
}

/* (K5) Szerkesztő űrlap (create/edit, modálban is): a mező-sorok Nova `py-5` (20+20px)
 * sortávja ~30%-ra (user-kérés 2026-07-04) — a mező-sor wrapper osztály-kombinációja
 * (`space-y-2` + `md:flex-row`) a Nova 5.9 form-sor azonosítója. */
#nova form div[class*="md:flex-row"][class*="space-y-2"] {
    padding-top: 0.375rem;
    padding-bottom: 0.375rem;
}

/* (P) Kiwi panelek/modálok ŰRLAP-VEZÉRLŐI (input/select/textarea) a felület-tokenekre —
 * dark módban NE maradjanak fehéren (Export/Formátum/Oszlopok/Nézet). Token-alapú → light+dark. */
[class*="kiwi-colmgr"] :is(input, select, textarea),
[class*="kiwi-export"] :is(input, select, textarea),
[class*="kiwi-fmt"] :is(input, select, textarea),
[class*="kiwi-format"] :is(input, select, textarea),
[class*="kiwi-sort"] :is(input, select, textarea),
[class*="kiwi-views"] :is(input, select, textarea),
.kiwi-tb-menu :is(input, select, textarea) {
    background-color: var(--kiwi-color-surface);
    color: var(--kiwi-color-text);
    border-color: var(--kiwi-color-border);
}
/* Az Oszlopok-panel `right:0`-val a trigger BAL oldalára nyílt → a bal-igazított topbaron
 * lelógott a képernyő bal szélén. Jobbra nyitjuk (viewporton belül marad). */
#kiwi-colmgr-host .kiwi-colmgr-panel {
    left: 0;
    right: auto;
}

/* (L) Adatlap (detail/edit) mező-sorok — EGYSÉGES magasság + kiwistyle sűrűség. A Nova
 * mező-soronként eltérő magasságot ad (tartalomtól függő py); a min-height + egységes
 * függőleges padding kiegyenlíti. A detail/edit kártyákra (`.rounded-lg.shadow`) szűkítve. */
#nova .rounded-lg.shadow .py-2.md\:flex-row {
    min-height: 1.75rem;
    padding-top: var(--kiwi-cell-pad-y);
    padding-bottom: var(--kiwi-cell-pad-y);
}
/* A mező-sor belső cellái (címke `md:w-1/4` + érték `md:w-3/4`) `py-3`-mal 46px magasak →
 * a sort 50px-re feszítik. Szűkítjük, hogy a sor ≈28px (gundel-minta) legyen. */
#nova .rounded-lg.shadow .py-2.md\:flex-row > * {
    padding-top: 0;
    padding-bottom: 0;
}

/* (M) Becsukható sidebar (icon-rail) — **DESKTOP-FOGALOM** (core-theme-skins 1.9,
 * mobile.md §2.9, ADR-0012). A `kiwi-sidebar-collapsed` osztály a <html>-en (a tool.js
 * toggle-je + localStorage). Szűk nézeten (< lg / 1024px) a Nova saját `hidden`-nel
 * elrejti a sidebar-oszlopot, a `lg:ml-60` margó sem él → a mi collapse-margónk (3.75rem)
 * ott ÜRES SÁVOT hagyott a tartalom mellett. Minden collapse-szabály `min-width: 1024px`
 * guardot kap; szűk nézeten a `kiwi-sidebar-collapsed` állapot a layoutot NEM módosíthatja. */
@media (min-width: 1024px) {
    .kiwi-sidebar-collapsed #nova > div:nth-child(2) > div:first-child {
        width: 3.75rem;
        overflow: hidden;
    }
    .kiwi-sidebar-collapsed #nova > div:nth-child(2) > div:first-child a {
        justify-content: center;
    }
    .kiwi-sidebar-collapsed #nova > div:nth-child(2) > div:first-child a .flex-1 {
        display: none;
    }
    .kiwi-sidebar-collapsed #nova > div:nth-child(2) > div:nth-child(2) {
        margin-left: 3.75rem;
    }
    /* Header logo-konténer is zsugorodik a sidebar-collapse-szel (user-panasz 2026-07-10:
     * „a logónak össze kellene menni, hogy a topbarban is növekedjen meg a hely"). A Nova
     * `<header>` első div-je a fix `lg:w-60` = 240px logo-slot. Collapse-módban ezt is
     * 3.75rem-re szűkítjük (megegyezik a sidebar-oszlop kompakt szélességével), a Nova
     * logo `<a>`-t elrejtjük — a kiwi hamburger (a `#kiwi-sidebar-toggle`) marad látható,
     * mert azt a JS EBBE a konténerbe szúrja. A topbar `flex-1` konténere automatikusan
     * felszippantja a felszabadult sávot. */
    .kiwi-sidebar-collapsed #nova header > div.shrink-0 {
        width: 3.75rem !important;
        min-width: 3.75rem;
        overflow: hidden;
    }
    .kiwi-sidebar-collapsed #nova header > div.shrink-0 > a {
        display: none;
    }
}

/* Sidebar-becsukó gomb a topbaron (hamburger). A chrome színeihez illeszkedik. Szűk
 * nézeten rejtve — a Nova natív mobil-hamburgere (off-canvas) az egyetlen vezérlő. */
#kiwi-sidebar-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    margin-left: 0.5rem;
    border: 0;
    background: transparent;
    color: var(--kiwi-topbar-fg);
    cursor: pointer;
    border-radius: var(--kiwi-radius);
    flex-shrink: 0;
}
#kiwi-sidebar-toggle:hover {
    background: color-mix(in srgb, var(--kiwi-topbar-fg) 14%, transparent);
}
#kiwi-sidebar-toggle svg {
    width: 1.25rem;
    height: 1.25rem;
}
/* Szűk nézeten a kiwi hamburger elrejtve (mobile.md §2.9). */
@media (max-width: 1023px) {
    #kiwi-sidebar-toggle {
        display: none !important;
    }
}

/* Sötét mód: a tokenek alternatív értékkészlete (MAY, core-theming §2).
 * KÉT jel-forrásra váltunk: (a) OS-szintű `prefers-color-scheme: dark`, (b) Nova
 * saját téma-toggle-je (a `<html>`-re rakott `.dark` class). Régebben csak az (a)
 * élt, ezért ha az OS light-on állt DE a user Nova-ban dark-ra kapcsolt, a kiwi
 * tokenek FÉNYES értéken maradtak → a Nova natív sötét inputokra kiwi light-keret
 * került (csúnya kevert kép, user-panasz 2026-07-10). A `.light` explicit override
 * a médiát is legyőzi (ha az OS sötét, de user Nova-ban light-ot választott). */
@media (prefers-color-scheme: dark) {
    :root:not(.light) {
        --kiwi-color-surface: #1a202c;
        --kiwi-color-surface-muted: #252d3a;
        --kiwi-color-surface-input: #2e2e31;
        --kiwi-color-border-input: #2e2e31;
        --kiwi-color-text: #e2e8f0;
        --kiwi-color-text-muted: #94a3b8;
        --kiwi-color-border: #2d3748;
    }
}
:root.dark {
    --kiwi-color-surface: #1a202c;
    --kiwi-color-surface-muted: #252d3a;
    --kiwi-color-surface-input: #2e2e31;
    --kiwi-color-border-input: #2e2e31;
    --kiwi-color-text: #e2e8f0;
    --kiwi-color-text-muted: #94a3b8;
    --kiwi-color-border: #2d3748;
}

/* Inline szűrő-sáv (a `[data-kiwi-th-filter]` div a `<th>` cellán belül tartja a
 * `.kiwi-inline-input`/`.kiwi-inline-select`/`.kiwi-inline-trigger` szűrő-mezőket).
 * A skin dark-módban a `<th>` bg-t `#2e2e33`-ra állítja, ez azonos volt a szűrő-mezők
 * `#2e2e31`-évél → a fejléc és a szűrő-sáv egybeolvadt (user-panasz 2026-07-10). A
 * szűrő-sáv MOSTANTÓL sötétebb szintre kerül (a fejléc alá „süllyed"), így a
 * fejléc marad a hangsúlyos, a szűrő-mezők egy „inset" belső sávban ülnek. Light
 * módban a th natívan is világos → nem érintjük. */
.dark #nova [data-kiwi-th-filter] {
    background-color: #1e1e20 !important;
}
@media (prefers-color-scheme: dark) {
    :root:not(.light) #nova [data-kiwi-th-filter] {
        background-color: #1e1e20 !important;
    }
}

/* Sötét-módú Nova űrlap-vezérlők a kiwi tokenekre (user-panasz 2026-07-10:
 * „az összes szerkeszthető mezőnek hibás a háttere és a betűszíne"; cél a régi
 * Gundel-app „Elem módosítása" modális kék-nyilas mintája: mélyfekete inputok
 * mediumdark modálon, alig látható kerettel). A rule szélessége szándékos:
 *  • `.dark` bárhol az ősök között — a Nova detail/edit iframe belsejében is
 *    hat (ott a `#nova` root nincs mindig jelen a shell-elrejtés miatt), a
 *    teleportált dropdown-menükre is;
 *  • `!important` — Nova Tailwind-alapú `.form-input.form-control-bordered`
 *    utility-jei magas specificitással jönnek, e nélkül a keret nem borulna
 *    a kiwi-color-border-re dark módban (világos slate-200 maradna).
 * Light módban Nova saját stílusa érintetlen (a rule csak `.dark` alatt fut).
 * Checkbox/radio/range/color/file kizárva (külön logika a §D-ben). */
.dark :is(input, select, textarea):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="reset"]),
.dark .multiselect__tags,
.dark .multiselect__input,
.dark .multiselect__single,
.dark .multiselect__content-wrapper,
.dark .kiwi-inline-trigger,
.dark div.form-input,
.dark div.form-control,
.dark div.form-control-bordered {
    background-color: var(--kiwi-color-surface-input) !important;
    color: var(--kiwi-color-text) !important;
    border-color: var(--kiwi-color-border-input, var(--kiwi-color-border)) !important;
}
.dark :is(input, textarea)::placeholder,
.dark .multiselect__placeholder {
    color: var(--kiwi-color-text-muted) !important;
    opacity: 1 !important;
}
/* A natív checkbox/radio background-ja a LIGHT-mód surface-input színével (user-döntés
 * 2026-07-10: „a jelölők mindenhol azonosak a light mód background színével"). A
 * color-scheme:dark + accent-color a §D-ben a pipa-színt kezeli. */
.dark input[type="checkbox"],
.dark input[type="radio"] {
    background-color: #ffffff !important;
}
@media (prefers-color-scheme: dark) {
    :root:not(.light) :is(input, select, textarea):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="reset"]),
    :root:not(.light) .multiselect__tags,
    :root:not(.light) .multiselect__input,
    :root:not(.light) .multiselect__single,
    :root:not(.light) .multiselect__content-wrapper,
    :root:not(.light) .kiwi-inline-trigger,
    :root:not(.light) div.form-input,
    :root:not(.light) div.form-control,
    :root:not(.light) div.form-control-bordered {
        background-color: var(--kiwi-color-surface-input) !important;
        color: var(--kiwi-color-text) !important;
        border-color: var(--kiwi-color-border-input, var(--kiwi-color-border)) !important;
    }
    :root:not(.light) :is(input, textarea)::placeholder,
    :root:not(.light) .multiselect__placeholder {
        color: var(--kiwi-color-text-muted) !important;
        opacity: 1 !important;
    }
    :root:not(.light) input[type="checkbox"],
    :root:not(.light) input[type="radio"] {
        background-color: #ffffff !important;
    }
}

/* Select-all fejléc-cella: a Nova a triggerbe teszi a „N kijelölve" pill + deselect-all
 * gombot (`[dusk="deselect-all-button"]`), amit a grid tool.css §2.2 alapból `display: none`-tal
 * ELREJT (kompakt oszlopszélesség). A rejtés miatt a felhasználónak nem volt módja
 * KIJELÖLÉST TÖRÖLNI a dropdown-menüből (user-panasz 2026-07-10, S1/6).
 * A pill-t visszahozzuk, DE nem inline-flex-szel (az szétfeszítette a keskeny checkbox-
 * oszlopot, user-panasz 2026-07-10) — hanem `position: absolute`-tal KIEMELJÜK a flow-ból,
 * és a JOBBRA SZOMSZÉDOS, a fejlécben ÜRES „MŰVELET/Controls" oszlop-fej fölé LEBEGTETJÜK
 * (az az oszlop a fejlécben nem tartalmaz semmit; a body-beli sor-akció-ikonok a tbody-ban
 * vannak, más sorban → nincs átfedés). Így a checkbox-oszlop 25px marad. Horgony: a
 * `[dusk="select-all-dropdown"]` konténer `position: relative`. */
:root:root #nova th[data-kiwi-selectall-host] > [dusk="select-all-dropdown"] {
    position: relative;
}
/* A host `<th>` a szomszéd sticky fejléc-cellák (z-index: 10) FÖLÉ emelve, különben a
 * későbbi testvér-`<th>` átlátszatlan háttere RÁFEST a túlnyúló pillre (a sticky th-k
 * egyenrangú stacking-kontextusok → a DOM-ban későbbi nyer). */
:root:root #nova th[data-kiwi-selectall-host] {
    z-index: 15 !important;
}
:root:root #nova th[data-kiwi-selectall-host] div:has(> [dusk="deselect-all-button"]) {
    display: inline-flex !important;
    align-items: center;
    gap: 0.25rem;
    position: absolute;
    left: 100%;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 0.25rem;
    white-space: nowrap;
    z-index: 20;
}

/* Az inline szűrő-mezők subtle keretet kapnak, hogy elváljanak a `#1e1e20` szűrő-sávtól
 * (user-panasz 2026-07-10: „legalább egy bordert adj"). A `--kiwi-color-border-input`
 * tokent NEM piszkáljuk (a többi input a lapos, kerettelen kinézetet tartja) —
 * a keret csak az inline szűrőket célozza. `#nova` prefix a specificitáshoz: a fenti
 * általános input-rule 8× :not(...)-tel (0,9,1) specificitást kap; az én egyszerű
 * (0,2,0) szabályom nem verné — a `#nova` ID-vel (1,3,0)-ra ugrik, ID-osztály fölé. */
.dark #nova .kiwi-inline-input,
.dark #nova .kiwi-inline-select,
.dark #nova .kiwi-inline-trigger {
    border-color: #4a4a4d !important;
}
@media (prefers-color-scheme: dark) {
    :root:not(.light) #nova .kiwi-inline-input,
    :root:not(.light) #nova .kiwi-inline-select,
    :root:not(.light) #nova .kiwi-inline-trigger {
        border-color: #4a4a4d !important;
    }
}

/* ── Top bar rendezés ─────────────────────────────────────────────────────────
 * A kiwi eszköztár (locale/export/sort/columns/views) VALÓDI flex-gyerekként ül a
 * Nova natív fejléc `flex flex-1` konténerében (B) opció, l. toolbar-host.js). A
 * flexbox magától foglal helyet, ezért itt nincs pozicionálás — három dolgot
 * rendezünk CSS-ből:
 *  1) a Nova natív fejléc görgetéskor eltűnt — sticky-vé tesszük;
 *  2) reszponzív csonkolás: a gombok EGY sorban maradnak, és ahogy fogy a hely,
 *     arányosan szűkülnek + a feliratuk ellipszissel csonkol (az ikon marad);
 *  3) szűk nézeten (< lg) az egész sáv rejtve (a Nova fejléc-átrendezési pontja).
 */

/* (1) A Nova fejléc STICKY. Fontos: NEM a `<header>`-re tesszük (a saját 56px-es
 * wrapperében ülve azonnal kigördülne), hanem a wrapperre — ami a `#nova` magas,
 * görgethető első gyermeke, így a fejléc a viewport tetején ragad görgetéskor. */
#nova > div:first-child {
    position: sticky;
    top: 0;
    z-index: 35;
}

/* (2) Reszponzív toolbar-csonkolás (core-theming §1.3). A triggerek belső szövege
 * korábban `white-space: normal`-lal KÉT SORBA tördelt (ikon fölött a felirat),
 * mert a flex-gyerekek a tartalmuk alá zsugorodtak. Helyette: egy sor + ellipszis.
 * Az ikon a felirat VEZETŐ glyph-je, a `text-overflow: ellipsis` a szöveg VÉGÉRŐL
 * vág → „⭳ Export" → „⭳ Exp…" → „⭳…", tehát az ikon (és a beazonosíthatóság) marad.
 * A `min-width` padló garantálja, hogy az ikon sosem csonkuljon el teljesen. */
#kiwi-toolbar-host,
#kiwi-toolbar-host * {
    min-width: 0; /* a flex-gyerekek a tartalmuk alá is zsugorodhatnak */
}
#kiwi-toolbar-host > * {
    flex-shrink: 1;
}
#kiwi-toolbar-host button {
    white-space: nowrap; /* nincs kéthasábos „ikon fölött felirat" tördelés */
}
/* A lenyíló-panelekben maradó natív select-ek (sort/oszlop hozzáadása, export-formátum,
 * nézet-láthatóság) ne lógjanak túl a panelen. A fejléc-triggerek már NEM select-ek (1.4). */
#kiwi-toolbar-host select {
    max-width: 100%;
}
/* ── Egységes trigger-anatómia (core-theming §2 + 1.4) ────────────────────────
 * MINDEN kiwi eszköztár-elem ugyanaz: `[ikon] [felirat] [chevron]`, kerettel. A gomb
 * BLOCK-szintű flex → a (zsugorodó) helyére szűkül; az ikon és a chevron `flex-shrink: 0`
 * (fix), a felirat `flex: 1; min-width: 0; text-overflow: ellipsis` → a szöveg VÉGÉRŐL
 * csonkol. CSONKOLÁS-INVARIÁNS: mivel a chevron a felirat valódi flex-TESTVÉRE, a helye
 * mindig le van foglalva → az ellipszis SOSEM tud a chevron alá csúszni (szemben a natív
 * `<select>` háttérkép-chevronjával). FONTOS: `overflow: hidden` KIZÁRÓLAG a triggeren —
 * a lenyíló panel/menü a wrap `position: absolute` gyereke, a trigger TESTVÉRE, így nem
 * vágódik el (a host-divre/wrapre tett overflow elvágná; ezért nem generikus a szabály). */
#kiwi-toolbar-host .kiwi-tb-trigger {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.375rem;
    max-width: 100%;
    min-width: 2.25rem; /* ikon(+chevron) padló — sosem tűnik el teljesen */
    overflow: hidden;
    border: 1px solid var(--kiwi-color-border, #d1d5db);
    border-radius: var(--kiwi-radius, 0.375rem);
    background: var(--kiwi-color-surface, transparent);
    color: var(--kiwi-color-text, inherit);
    font-size: var(--kiwi-font-size-sm, 0.8125rem);
    line-height: 1.4;
    padding: 0.25rem 0.625rem;
    cursor: pointer;
}
/* Csak a felirat csonkol; az ikon/chevron/badge fix szélességű. */
#kiwi-toolbar-host .kiwi-tb-trigger > .kiwi-tb-label {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
#kiwi-toolbar-host .kiwi-tb-trigger > :not(.kiwi-tb-label) {
    flex-shrink: 0;
}
/* Az ikon (16px) és a chevron (13px, halványabb, nyitáskor 180°). */
#kiwi-toolbar-host .kiwi-tb-icon,
#kiwi-toolbar-host .kiwi-tb-caret {
    display: inline-flex;
    align-items: center;
}
#kiwi-toolbar-host .kiwi-tb-icon svg {
    width: 1rem;
    height: 1rem;
    display: block;
}
#kiwi-toolbar-host .kiwi-tb-caret svg {
    width: 0.8125rem;
    height: 0.8125rem;
    display: block;
    opacity: 0.6;
    transition: transform 0.15s ease;
}
#kiwi-toolbar-host .kiwi-tb-trigger[aria-expanded="true"] .kiwi-tb-caret svg {
    transform: rotate(180deg);
}
/* Négyzetes, keretes ikon-gomb (nézet törlés/alapértelmezett — csak ikon, felirat nélkül). */
#kiwi-toolbar-host .kiwi-tb-iconbtn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    padding: 0.25rem;
    border: 1px solid var(--kiwi-color-border, #d1d5db);
    border-radius: var(--kiwi-radius, 0.375rem);
    background: var(--kiwi-color-surface, transparent);
    color: var(--kiwi-color-text, inherit);
    cursor: pointer;
}
#kiwi-toolbar-host .kiwi-tb-iconbtn svg {
    width: 1rem;
    height: 1rem;
    display: block;
}
#kiwi-toolbar-host .kiwi-tb-iconbtn--danger {
    color: var(--kiwi-color-danger, #e03131);
    border-color: var(--kiwi-color-danger, #e03131);
}
#kiwi-toolbar-host .kiwi-tb-iconbtn--active {
    color: var(--kiwi-color-primary, #18a3a3);
    border-color: var(--kiwi-color-primary, #18a3a3);
}

/* ── Egységes lenyíló-menü (nézetválasztó, nyelvválasztó) ─────────────────────── */
#kiwi-toolbar-host .kiwi-tb-wrap {
    position: relative;
    display: flex;
    align-items: center;
    max-width: 100%;
    gap: 0.25rem;
}
/* NOTE (popover-primitív 2026-07-06): a popover-positioning + surface/border/shadow már
 * a közös `.kiwi-tb-panel` wrapperben él (FloatingPanel desktop-mód). A `.kiwi-tb-menu` most
 * CSAK a menü-item lista rétegzését hordozza — a wrapper adja a positioning/bg/border-t. */
#kiwi-toolbar-host .kiwi-tb-menu {
    min-width: 12rem;
    max-width: 22rem;
}
#kiwi-toolbar-host .kiwi-tb-menu-item {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    width: 100%;
    text-align: left;
    padding: 0.375rem 0.5rem;
    border: 0;
    border-radius: calc(var(--kiwi-radius, 0.5rem) - 0.25rem);
    background: transparent;
    color: inherit;
    font-size: var(--kiwi-font-size-sm, 0.8125rem);
    cursor: pointer;
}
#kiwi-toolbar-host .kiwi-tb-menu-item:hover {
    background: var(--kiwi-color-surface-muted, #f3f5f7);
}
#kiwi-toolbar-host .kiwi-tb-menu-item--active {
    color: var(--kiwi-color-primary, #18a3a3);
    font-weight: var(--kiwi-font-weight-medium, 500);
}
#kiwi-toolbar-host .kiwi-tb-menu-item__text {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
#kiwi-toolbar-host .kiwi-tb-menu-item svg {
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
}
#kiwi-toolbar-host .kiwi-tb-menu-sep {
    height: 1px;
    margin: 0.25rem 0;
    background: var(--kiwi-color-border, #e5e7eb);
}

/* ── Közös popover-primitívek (user-kérés 2026-07-06, kanári a Rendezés-panelen) ──
 * A Sort/ColMgr/Fmt/Export/Nézet/Nyelv lenyílók egységes tagolása és színezése,
 * a `--kiwi-*` token-készlethez illesztve. A `FloatingPanel.vue` desktop-módban
 * ezeket a wrapper-osztályokat rendereli automatikusan; a panel-specifikus tartalom
 * (a slot-body) a `panelClass` prop-on át kap saját osztályt.
 *
 * Szerkezet:
 *   .kiwi-tb-panel              — külső burok (border/shadow/radius/bg)
 *     #kiwi-toolbar-host .kiwi-tb-panel__header    — cím-sáv (border-bottom-mal)
 *       #kiwi-toolbar-host .kiwi-tb-panel__title   — h4-alt (font-medium sm)
 *       #kiwi-toolbar-host .kiwi-tb-panel__close   — opcionális X-ikongomb
 *     #kiwi-toolbar-host .kiwi-tb-panel__body      — padding-tal ellátott tartalom-terület
 *       #kiwi-toolbar-host .kiwi-tb-panel__section — belső szekció (border-top a második szekciótól)
 *         #kiwi-toolbar-host .kiwi-tb-panel__section-title  — uppercase-xxs section-cím
 *     #kiwi-toolbar-host .kiwi-tb-panel__actions   — footer akció-sáv (border-top, right-aligned) */
#kiwi-toolbar-host .kiwi-tb-panel {
    position: absolute;
    top: calc(100% + 0.375rem);
    left: 0;
    min-width: 16rem;
    max-width: 26rem;
    background: var(--kiwi-color-surface, #fff);
    color: var(--kiwi-color-text, inherit);
    border: 1px solid var(--kiwi-color-border, #e5e7eb);
    border-radius: var(--kiwi-radius, 0.5rem);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.2);
    overflow: hidden;
    font-family: var(--kiwi-font-family, inherit);
    font-size: var(--kiwi-font-size-sm, 0.8125rem);
    line-height: 1.4;
    z-index: 42;
}
#kiwi-toolbar-host .kiwi-tb-panel__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--kiwi-color-border, #e5e7eb);
    background: var(--kiwi-color-surface-muted, #f8fafc);
}
#kiwi-toolbar-host .kiwi-tb-panel__title {
    font-size: var(--kiwi-font-size-sm, 0.8125rem);
    font-weight: var(--kiwi-font-weight-medium, 600);
    color: var(--kiwi-color-text, inherit);
    letter-spacing: 0.01em;
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#kiwi-toolbar-host .kiwi-tb-panel__close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.375rem;
    height: 1.375rem;
    padding: 0;
    border: 0;
    border-radius: var(--kiwi-radius, 0.375rem);
    background: transparent;
    color: var(--kiwi-color-text-muted, #6b7280);
    cursor: pointer;
    flex-shrink: 0;
}
#kiwi-toolbar-host .kiwi-tb-panel__close:hover {
    background: var(--kiwi-color-surface, #fff);
    color: var(--kiwi-color-text, inherit);
}
#kiwi-toolbar-host .kiwi-tb-panel__close svg {
    width: 0.875rem;
    height: 0.875rem;
}
#kiwi-toolbar-host .kiwi-tb-panel__body {
    padding: 0.625rem 0.75rem;
    max-height: 22rem;
    overflow-y: auto;
}
#kiwi-toolbar-host .kiwi-tb-panel__section + #kiwi-toolbar-host .kiwi-tb-panel__section {
    margin-top: 0.625rem;
    padding-top: 0.625rem;
    border-top: 1px solid var(--kiwi-color-border, #e5e7eb);
}
#kiwi-toolbar-host .kiwi-tb-panel__section-title {
    display: block;
    font-size: 0.6875rem;
    font-weight: var(--kiwi-font-weight-medium, 600);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--kiwi-color-text-muted, #6b7280);
    margin-bottom: 0.375rem;
}
#kiwi-toolbar-host .kiwi-tb-panel__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    border-top: 1px solid var(--kiwi-color-border, #e5e7eb);
    background: var(--kiwi-color-surface-muted, #f8fafc);
}
/* Default footer „Bezár" gomb (akkor jelenik meg, ha a consumer nem ad #footer slotot).
   Az akció-sávot MÁS panelek footer-slotja már kitölti (Sort/Column/Format/Export/Views);
   a Locale-menü marad, ahol jól jön ez a záró akció. */
#kiwi-toolbar-host .kiwi-tb-panel__close-btn,
.kiwi-sheet__footer .kiwi-tb-panel__close-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2rem;
    padding: 0.35rem 0.9rem;
    border: 1px solid var(--kiwi-color-border, #e5e7eb);
    border-radius: var(--kiwi-radius, 0.375rem);
    background: var(--kiwi-color-surface, #fff);
    color: var(--kiwi-color-text, inherit);
    font-size: 0.8125rem;
    cursor: pointer;
    transition: background 120ms ease, border-color 120ms ease;
}
#kiwi-toolbar-host .kiwi-tb-panel__close-btn:hover,
.kiwi-sheet__footer .kiwi-tb-panel__close-btn:hover {
    background: var(--kiwi-color-surface-muted, #f8fafc);
    border-color: var(--kiwi-color-border-strong, #d1d5db);
}
#kiwi-toolbar-host .kiwi-tb-panel__empty {
    padding: 0.75rem 0.5rem;
    text-align: center;
    color: var(--kiwi-color-text-muted, #6b7280);
    font-size: 0.75rem;
    border: 1px dashed var(--kiwi-color-border, #e5e7eb);
    border-radius: var(--kiwi-radius, 0.375rem);
    background: var(--kiwi-color-surface-muted, #f8fafc);
}

/* Panel-belüli gomb-akcensek (user-kérés 2026-07-06 „élénkebb felület"):
 *  (a) Elsődleges gomb-variansok (`--primary` / a footer első nem-ghost gomb-a) filled primary
 *      bg + fehér szöveg → CTA-hangsúly.
 *  (b) Danger variansok (`--danger`) alapból outline (piros keret+szöveg), hover-en filled piros.
 *  (c) Neutral utility gombok (drag/direction/reorder/remove ikonok) hover-en primary-tint
 *      background (12% color-mix) + primary szín/border — interaktív kiemelés visszajelzés.
 *  (d) Sor-hover a body-ban: subtle primary-tint (6% color-mix) — a listás panelek élet-jele.
 *  (e) Menü-item aktív állapot: 10% primary bg + 2px primary bal-oldali sáv.
 * Mindegyik tokens-alapú (`--kiwi-color-primary/--kiwi-color-danger`), így a szkin-váltás
 * automatikus, `!important` nélkül (az `#kiwi-toolbar-host` prefix elég a specificitáshoz). */
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-views-btn--primary,
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-views-menu-save,
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-colmgr-action:not(.kiwi-colmgr-action--ghost),
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-fmt-action:not(.kiwi-fmt-action--ghost),
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-export-action:not(.kiwi-export-action--ghost) {
    background: var(--kiwi-color-primary, #18a3a3);
    color: #fff;
    border-color: var(--kiwi-color-primary, #18a3a3);
}
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-views-btn--primary:hover,
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-views-menu-save:hover,
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-colmgr-action:not(.kiwi-colmgr-action--ghost):hover,
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-fmt-action:not(.kiwi-fmt-action--ghost):hover,
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-export-action:not(.kiwi-export-action--ghost):hover {
    filter: brightness(1.08);
    color: #fff;
}
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-colmgr-btn--danger:hover,
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-views-btn--danger:hover,
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-fmt-clear:hover {
    background: var(--kiwi-color-danger, #dc2626);
    color: #fff;
    border-color: var(--kiwi-color-danger, #dc2626);
}
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-sort-panel__dir:hover,
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-sort-panel__remove:not(:disabled):hover,
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-colmgr-btn:not(.kiwi-colmgr-btn--danger):hover,
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-fmt-btn:hover,
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-colmgr-drag:hover {
    background: color-mix(in srgb, var(--kiwi-color-primary, #18a3a3) 12%, transparent);
    color: var(--kiwi-color-primary, #18a3a3);
    border-color: var(--kiwi-color-primary, #18a3a3);
}
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-sort-panel__row:hover,
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-colmgr-row:hover,
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-fmt-rec:hover {
    background: color-mix(in srgb, var(--kiwi-color-primary, #18a3a3) 6%, transparent);
    border-radius: var(--kiwi-radius, 0.25rem);
}
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-tb-menu-item:hover {
    background: color-mix(in srgb, var(--kiwi-color-primary, #18a3a3) 8%, transparent);
}
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-tb-menu-item--active {
    background: color-mix(in srgb, var(--kiwi-color-primary, #18a3a3) 12%, transparent);
    border-left: 2px solid var(--kiwi-color-primary, #18a3a3);
    padding-left: calc(0.5rem - 2px);
}

/* Egységesített panel-belüli gomb-standard (user-riport 2026-07-06 „hanyag padding+radius,
 * ahány gomb annyi féle"): MINDEN topbar-panel akciógomb ugyanabból a base-ből indul; a
 * specifikus osztályok (`kiwi-*-btn/action/dir/remove/clear/menu-save`) CSAK varianst
 * hordoznak (primary/danger/ghost). Ez felülírja a régi grid/export tool.css-ben az
 * osztályonként eltérő `padding: 0.125…0.25 × 0.375…0.625rem; font-size: 0.75…0.8rem;
 * border-radius: 0.25…0.375rem` mixet. Két méret-változat:
 *   (1) TEXT-CTA (Save, Cancel, Apply): pill-alap 6px×12px paddinggal, min-height 30px,
 *       0.8125rem font-medium, 0.375rem radius.
 *   (2) ICON-only (nyíl/drag/remove/clear/direction): négyzet 30×30px, 4px padding,
 *       min-width == min-height.
 * A `:is()` a szelektor-listát kompakton írja; specificitás elég a régi rules felülbírálásához
 * (mert #kiwi-toolbar-host + .kiwi-tb-panel + osztály háromsoros specificitás, míg a régi
 * szabályok általában csak `.kiwi-*-btn` egysoros). */
#kiwi-toolbar-host .kiwi-tb-panel :is(
    .kiwi-sort-panel__dir,
    .kiwi-sort-panel__remove,
    .kiwi-colmgr-btn,
    .kiwi-colmgr-action,
    .kiwi-fmt-btn,
    .kiwi-fmt-action,
    .kiwi-fmt-clear,
    .kiwi-views-btn,
    .kiwi-views-menu-save,
    .kiwi-export-btn,
    .kiwi-export-action
) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    padding: 0.375rem 0.75rem;
    min-height: 1.875rem;
    font-size: var(--kiwi-font-size-sm, 0.8125rem);
    font-weight: var(--kiwi-font-weight-medium, 500);
    line-height: 1.25;
    border: 1px solid var(--kiwi-color-border, #e5e7eb);
    border-radius: var(--kiwi-radius, 0.375rem);
    background: var(--kiwi-color-surface, #fff);
    color: var(--kiwi-color-text, inherit);
    cursor: pointer;
    width: auto;
}
/* Ikon-only gombok (svg-only tartalom): négyzet, tömör padding. */
#kiwi-toolbar-host .kiwi-tb-panel :is(
    .kiwi-sort-panel__dir,
    .kiwi-sort-panel__remove,
    .kiwi-colmgr-btn,
    .kiwi-fmt-btn,
    .kiwi-fmt-clear
) {
    min-width: 1.875rem;
    padding: 0.25rem;
    gap: 0;
    flex-shrink: 0;
}
/* SVG-ikon egységesített méret a gombokban. */
#kiwi-toolbar-host .kiwi-tb-panel :is(
    .kiwi-sort-panel__dir,
    .kiwi-sort-panel__remove,
    .kiwi-colmgr-btn,
    .kiwi-colmgr-action,
    .kiwi-fmt-btn,
    .kiwi-fmt-action,
    .kiwi-fmt-clear,
    .kiwi-views-btn,
    .kiwi-views-menu-save,
    .kiwi-export-btn,
    .kiwi-export-action
) > svg {
    width: 0.9375rem;
    height: 0.9375rem;
    flex-shrink: 0;
}
/* A `.kiwi-views-menu-save` a `.kiwi-tb-menu-item` osztályt is hordozza → full-width row-t
 * kapna a menu-item alaptól. A gomb-standard `width: auto`-t érvényesíti, de a Views panel
 * layout-nak segít, ha a Save-gomb a menü-lista alatt inline balra igazítottan ül (nem stretch).
 * A `#kiwi-toolbar-host .kiwi-tb-menu-item` hover-tint és bal-sáv-akcensek NEM alkalmazandók
 * a save-gombra (nem menu-item-szerű, hanem CTA). */
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-views-menu-save {
    align-self: flex-start;
    margin-top: 0.375rem;
}
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-views-menu-save:hover {
    background: var(--kiwi-color-primary, #18a3a3);
    filter: brightness(1.08);
}
#kiwi-toolbar-host .kiwi-tb-panel .kiwi-views-menu-save.kiwi-tb-menu-item--active {
    border-left-width: 1px;
    padding-left: 0.75rem;
}

/* A Nova natív fejléc-konténer (`div.flex-1`) alapból `min-width: auto` → a min-content
 * (kiwi sáv + natív jobb-klaszter) SZÉLESEBB lehet a viewportnál, ekkor a natív klaszter
 * (téma-váltó/csengő/avatar) KILÓG a képernyő jobb szélén. `min-width: 0` → a konténer a
 * fejléc szabad szélességére szűkül, a zsugorodás-nyomás a kiwi sávra hárul (az csonkol),
 * a natív klaszter a viewporton belül marad. Más Nova-oldalakon ártalmatlan (ott csak a
 * natív klaszter van a konténerben). */
#nova header > div.flex-1 {
    min-width: 0;
}

/* Kisebb térköz a kiwi gombok között (a toolbar-host.js a hostra inline `gap: 0.5rem`-et
 * tesz — itt felülírjuk; a `!important` az inline stílus miatt szükséges). */
#kiwi-toolbar-host {
    gap: 0.25rem !important;
}

/* Logikai gombsorrend (CSS `order`, a mount-sorrendtől függetlenül, core-theming 1.4):
 * Rendezés · Oszlopok · Export · Formázás · Nézetválasztó · Magyar. */
#kiwi-sort-panel-host      { order: 1; }
#kiwi-colmgr-host          { order: 2; }
#kiwi-export-host          { order: 3; }
#kiwi-format-host          { order: 4; }
#kiwi-views-host           { order: 5; }
#kiwi-locale-switcher-host { order: 6; }

/* Nézetek-csoport: a trigger + a kontextuális ikon-gombok (törlés/alapértelmezett) egy
 * `.kiwi-tb-wrap`-ben; a lenyíló-menü a trigger testvére (nem vágódik el). A trigger a
 * zsugorodást nyeli (felirat ellipszis), az ikon-gombok fixek (flex-shrink: 0). */
#kiwi-views-host .kiwi-views-wrap {
    display: flex;
    align-items: center;
    max-width: 100%;
    gap: 0.25rem;
}
#kiwi-views-host .kiwi-views-trigger {
    flex: 1 1 auto;
    min-width: 0;
}

/* ── Mobil / szűk nézet + touch-ergonómia (mobile.md 1.1, ADR-0012) ─────────────
 * A 9. fázisban (2026-07-04) átalakítva: a `< lg` teljes-elrejtés FELÜLBÍRÁLVA
 * (core-theming 1.6 changelog). Szűk nézeten az eszköztár LÁTHATÓ marad, ikon-only
 * módban; a férőhely-mérést a `toolbar-overflow` modul végzi (kiwi-nova-core).
 * A szabályok normatív forrása: mobile.md §2.2/§2.3/§2.7/§2.8. */

/* Szűk nézet (< lg / 1024px): ikon-only trigger (mobile.md §2.2). A `data-kiwi-narrow`
 * markert a toolbar-overflow boot-ja ADJA a hostra (JS-mért) — a body-szintű mediát
 * a JS a `matchMedia`-val ellenőrzi. CSS-fallback (media-query) is él, ha a JS-mérés
 * nem futott le (graceful): a `.kiwi-tb-label` és `.kiwi-tb-caret` rejtve, a min-width
 * változatlan → keret + ikon marad. */
@media (max-width: 1023px) {
    #kiwi-toolbar-host .kiwi-tb-trigger > .kiwi-tb-label,
    #kiwi-toolbar-host .kiwi-tb-trigger > .kiwi-tb-caret {
        display: none;
    }
    /* Az ikon-only trigger effektív találati területe ≥ 44px (mobile.md §2.7). */
    #kiwi-toolbar-host .kiwi-tb-trigger,
    #kiwi-toolbar-host .kiwi-tb-iconbtn {
        position: relative;
        min-height: 2.75rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    #kiwi-toolbar-host .kiwi-tb-trigger::after,
    #kiwi-toolbar-host .kiwi-tb-iconbtn::after {
        content: '';
        position: absolute;
        content: none;
        pointer-events: none;
    }
}

/* Toolbar-overflow (mobile.md §2.2, core-theming 1.8): a toolbar-overflow modul által
 * kimért, be nem férő gyerek-hostok rejtése. A `data-kiwi-narrow` host-guard garantálja,
 * hogy desktopon (a marker levételekor) egy esetleg bent ragadt attribútum SE rejtsen. */
#kiwi-toolbar-host[data-kiwi-narrow] > [data-kiwi-overflowed] {
    display: none;
}
/* A „⋯" trigger a logikai sorrend végén (a gyerek-hostok order: 1–6 után). */
#kiwi-toolbar-more {
    order: 90;
    flex-shrink: 0;
}
/* A „⋯" sheet-lista: teljes szélességű, ≥44px koppintható sorok (mobile.md §2.3). */
#kiwi-sheet-root .kiwi-toolbar-more-list {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
#kiwi-sheet-root .kiwi-toolbar-more-item {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    width: 100%;
    min-height: 2.75rem;
    padding: 0.625rem 0.75rem;
    border: 0;
    border-radius: var(--kiwi-radius, 0.375rem);
    background: transparent;
    color: var(--kiwi-color-text);
    font-size: var(--kiwi-font-size-md, 0.9375rem);
    text-align: left;
    cursor: pointer;
}
#kiwi-sheet-root .kiwi-toolbar-more-item:hover {
    background: color-mix(in srgb, var(--kiwi-color-primary) 8%, transparent);
}
#kiwi-sheet-root .kiwi-toolbar-more-item .kiwi-tb-icon svg {
    width: 1.125rem;
    height: 1.125rem;
}

/* Touch-ergonómia (mobile.md §2.7). A `pointer: coarse` a touch-eszközök kapcsolója;
 * asztali gépen (egér) NEM aktiválódik → semmi látható változás. */
@media (pointer: coarse) {
    /* (a) iOS fókusz-zoom kikapcsolása: minden kiwi input/select/textarea ≥ 16px. */
    [class*="kiwi-"] input,
    [class*="kiwi-"] select,
    [class*="kiwi-"] textarea,
    .kiwi-tb-menu input,
    .kiwi-tb-menu select,
    .kiwi-tb-menu textarea,
    .kiwi-sheet input,
    .kiwi-sheet select,
    .kiwi-sheet textarea {
        font-size: 16px;
        min-height: 2.5rem;
    }
    /* (b) A kiwi interaktív elemek effektív találati területe ≥ 44px. A kis vizuális
     * gombokat (clear ×, ikon-triggerek) pszeudo-elemes hit-area bővítéssel érjük el
     * — a vizuális dizájn NEM változik. */
    #kiwi-toolbar-host .kiwi-tb-trigger,
    #kiwi-toolbar-host .kiwi-tb-iconbtn,
    #kiwi-sidebar-toggle,
    .kiwi-tb-menu-item,
    .kiwi-sheet-close,
    .kiwi-quickview-action {
        min-height: 2.75rem;
    }
    /* Kicsi ikon-vezérlők: hit-area a `::after` pszeudo-elemmel. Az elemnek pozíciónak
     * kell lennie (relative), hogy a `::after` inset működjön. */
    .kiwi-inline-clear,
    .kiwi-inline-help,
    .kiwi-col-mobile-toggle,
    .kiwi-relation-edit-btn {
        position: relative;
    }
    .kiwi-inline-clear::after,
    .kiwi-inline-help::after,
    .kiwi-col-mobile-toggle::after,
    .kiwi-relation-edit-btn::after {
        content: '';
        position: absolute;
        inset: -10px;
        pointer-events: auto;
    }
    /* (c) Hover-only affordance → touch-on látható alapállapot. A relációs edit-gomb
     * csak hoveren volt színes; touch-on legyen kezdetben is látható a keret. */
    .kiwi-relation-edit-btn {
        border: 1px solid color-mix(in srgb, var(--kiwi-color-primary) 40%, transparent);
    }
}

/* Dinamikus viewport görgetés-momentum (mobile.md §2.8, SHOULD). A modern böngészők
 * ezt már natívan viszik; a legacy iOS-hez marad a `-webkit-overflow-scrolling`. */
[data-kiwi-viewport] {
    -webkit-overflow-scrolling: touch;
}

/* ── Nova natív breadcrumb (mobile.md §2.9 / grid-table-layout §2.6 / ADR-0012) ──
 * A host `Nova::withBreadcrumbs()`-ot kapcsol be — a natív morzsa a tartalom-oszlop
 * ELSŐ gyermeke, a cím fölött. Két korrekció:
 *   (a) elhelyezés (lista-oldalon): a toolbar-relocate a `data-kiwi-breadcrumb-slot`
 *       wrapperbe teszi át, a lista-kártya elé — a cím fölé nem kerül semmi köz;
 *   (b) stílus (mindenütt): kompakt (kis betű, minimális köz a szomszédok felé,
 *       kicsi szeparátor-ikonok) — user-döntés 2026-07-04 „amilyen kicsi közökkel
 *       még értelmezhető". Detail/edit oldalon a morzsa a natív helyén marad, de a
 *       `space-y-8` közet kioltjuk (a cím szorosan alatta). Token-alapú színek. */
:root:root nav[dusk="breadcrumbs"],
:root:root nav[aria-label="breadcrumb"] {
    /* Láthatóbb morzsa (user-panasz 2026-07-10: „nincs morzsa" — valójában megvolt, csak
     * túl halvány volt a kompakt stílus + text-muted miatt). Normál szövegszín + kicsit
     * nagyobb font — a link-anchor a `--kiwi-color-primary`-n marad (a `nav ... a` szabályban
     * lejjebb), tehát a linkek és az aktuális oldal-név most jól elválik. */
    color: var(--kiwi-color-text);
    font-size: var(--kiwi-font-size-md);
    font-weight: var(--kiwi-font-weight-medium);
    margin-top: 0;
    margin-bottom: 0.5rem;
    line-height: 1.4;
}
:root:root nav[dusk="breadcrumbs"] a,
:root:root nav[aria-label="breadcrumb"] a {
    color: var(--kiwi-color-primary);
    position: relative; /* touch-mód pszeudo-hit-area horgonya */
}
:root:root nav[dusk="breadcrumbs"] a:hover,
:root:root nav[aria-label="breadcrumb"] a:hover {
    text-decoration: underline;
}
/* Kicsi szeparátor-ikonok (a Nova `w-4 h-4 mx-2` alapból ~16px + 8px köz — soknak
 * bizonyult): 12px ikon + 4px vízszintes köz. */
:root:root nav[dusk="breadcrumbs"] svg,
:root:root nav[aria-label="breadcrumb"] svg {
    width: 0.75rem;
    height: 0.75rem;
    margin-left: 0.25rem;
    margin-right: 0.25rem;
}
/* Detail/edit oldalon a morzsa a natív helyén marad (a `<div dusk=content>` első
 * gyermeke), de a `space-y-8` (32px) a KÖVETKEZŐ testvér tetején kiüt egy nagy közt.
 * A tailwind `space-y-8` szabály `.space-y-8 > :not([hidden]) ~ :not([hidden])`
 * mintázatot ad → a nav utáni testvér margin-top-ját visszavesszük ≤0.5rem-re.
 * `.space-y-8` alá szűkítve, hogy más oldalt ne érintsen. */
:root:root .space-y-8 > nav[dusk="breadcrumbs"] + :not([hidden]) {
    margin-top: 0.5rem;
}

/* Lista-oldali áthelyezett hely: a slot közvetlenül a lista-kártya előtt ül, a
 * fejléc-sor `mb-6` és a kártya közé — külön margó nem kell. */
:root:root [data-kiwi-breadcrumb-slot] {
    margin-bottom: 0.375rem;
}

/* Szűk nézeten a Nova a morzsát esetleg `hidden`-nel elrejtené — visszakapcsoljuk.
 * A hosszú útvonalak közbülső elemeit csonkoljuk (mobile.md §2.9 SHOULD): az
 * utolsó-előtti (listanézet-link) marad teljes; a többi ellipszisre vágódik. A
 * kompakt stílus (font-size, margók) alapból, minden szélességen érvényes; a
 * 44px hit-area a touch-mód pszeudo-elemmel oldódik meg (alább). */
@media (max-width: 1023px) {
    :root:root nav[dusk="breadcrumbs"],
    :root:root nav[aria-label="breadcrumb"] {
        display: block !important;
    }
    :root:root nav[dusk="breadcrumbs"] a,
    :root:root nav[aria-label="breadcrumb"] a {
        display: inline-block;
        max-width: 40vw;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        vertical-align: middle;
    }
    /* Az utolsó-előtti elem (a listanézet-link) mindig teljesen látszik. */
    :root:root nav[dusk="breadcrumbs"] a:nth-last-child(2),
    :root:root nav[aria-label="breadcrumb"] a:nth-last-child(2) {
        max-width: none;
    }
}

/* Touch-mód: a linkek effektív találati területe ≥ 44px pszeudo-hit-area-val — a
 * vizuális dizájn NEM változik (kompakt marad); a `::after` inset kiegészíti a
 * kattintható zónát. */
@media (pointer: coarse) {
    :root:root nav[dusk="breadcrumbs"] a::after,
    :root:root nav[aria-label="breadcrumb"] a::after {
        content: '';
        position: absolute;
        inset: -14px -6px;
        pointer-events: auto;
    }
}

/* Bottom sheet panel primitive (mobile.md �2.3). */
html.kiwi-sheet-open,
body.kiwi-sheet-open {
    overflow: hidden;
}

#kiwi-sheet-root {
    position: fixed;
    inset: 0;
    z-index: 80;
    pointer-events: none;
}

#kiwi-sheet-root:empty {
    display: none;
}

.kiwi-sheet-backdrop {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding-top: 3rem;
    background: rgba(15, 23, 42, 0.38);
    pointer-events: auto;
}

.kiwi-sheet {
    width: min(100vw, 42rem);
    max-height: 85dvh;
    background: var(--kiwi-color-surface);
    color: var(--kiwi-color-text);
    border: 1px solid var(--kiwi-color-border);
    border-bottom: 0;
    border-radius: 1rem 1rem 0 0;
    box-shadow: 0 -10px 30px rgba(15, 23, 42, 0.22);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.kiwi-sheet__header {
    position: sticky;
    top: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem 1rem;
    background: var(--kiwi-color-surface);
    border-bottom: 1px solid var(--kiwi-color-border);
}

.kiwi-sheet__title {
    min-width: 0;
    font-size: var(--kiwi-font-size-md);
    font-weight: var(--kiwi-font-weight-medium, 500);
}

.kiwi-sheet__body {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    overflow-x: hidden;
    padding: 0.75rem 1rem 1rem;
}

.kiwi-sheet__footer {
    position: sticky;
    bottom: 0;
    z-index: 2;
    padding: 0.75rem 1rem max(0.75rem, env(safe-area-inset-bottom));
    background: var(--kiwi-color-surface);
    border-top: 1px solid var(--kiwi-color-border);
}

.kiwi-sheet-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    flex-shrink: 0;
    border: 1px solid var(--kiwi-color-border);
    border-radius: 9999px;
    background: var(--kiwi-color-surface-muted);
    color: var(--kiwi-color-text);
}

.kiwi-sheet-close svg {
    width: 1rem;
    height: 1rem;
}

@media (max-width: 1023px) {
    #kiwi-sheet-root .kiwi-tb-menu,
    #kiwi-sheet-root .kiwi-sort-panel,
    #kiwi-sheet-root .kiwi-colmgr-panel,
    #kiwi-sheet-root .kiwi-fmt-panel,
    #kiwi-sheet-root .kiwi-export-panel {
        position: static;
        top: auto;
        right: auto;
        left: auto;
        width: 100%;
        min-width: 0;
        max-width: none;
        max-height: none;
        padding: 0;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        background: transparent;
        overflow: visible;
    }

    #kiwi-sheet-root .kiwi-tb-menu-item {
        min-height: 2.75rem;
        padding: 0.625rem 0.75rem;
    }

    #kiwi-sheet-root .kiwi-tb-menu-item__text {
        white-space: normal;
    }
}