/*
 * ITX-Sitemap - strukturelles Minimum
 * -------------------------------------------------------------------
 * Das Modul liefert nur Layout-Grundlagen: Listen-Reset, die drei
 * Layout-Modi (vertical/horizontal/columns) und Submenu-Einrueckung.
 * Alles Visuelle (Farben, Schrift, Underlines, Transitions, Hover,
 * Active-States) liegt beim Theme/Projekt.
 *
 * Alle Layout-Werte laufen ueber CSS-Variablen mit sinnvollem
 * Fallback. Wer eine Variable irgendwo im Elternscope setzt (body,
 * eine Wrapper-Klasse oder direkt auf .itx_sitemap), kaskadiert
 * ueber alle Ebenen der Sitemap.
 *
 * Beispiel-Kette: --itx-sitemap-submenu-gap faellt auf
 * --itx-sitemap-gap zurueck, wenn nicht separat gesetzt.
 */

/* -- Container: Listen-Reset + Layout -- */

.itx_sitemap {
    list-style: none;
    margin:     0;
    padding:    0;
}

.itx_sitemap--vertical {
    display:        flex;
    flex-direction: column;
    gap:            var(--itx-sitemap-gap, 0.5rem);
}

.itx_sitemap--horizontal {
    display:   flex;
    flex-wrap: wrap;
    gap:       var(--itx-sitemap-gap, 1rem);
}

.itx_sitemap--columns {
    display:               grid;
    grid-template-columns: repeat(var(--itx-sitemap-columns, 3), 1fr);
    gap:                   var(--itx-sitemap-gap, 1rem);
}

/* -- Items -- */

.itx_sitemap_item {
    list-style: none;
}

/* -- Submenus (Level 2+) -- */

.itx_sitemap_submenu {
    list-style:     none;
    margin:         0;
    padding:        0;
    padding-left:   var(--itx-sitemap-indent, 1rem);
    display:        flex;
    flex-direction: column;
    gap:            var(--itx-sitemap-submenu-gap, var(--itx-sitemap-gap, 0.25rem));
}
