@media (min-width: 900px) { .akte-grid { grid-template-columns: 2fr 1fr; grid-template-areas: "kopf kopf" "aktionen aktionen" "stamm wartung" "beladung pruefungen" "verantwortlich maengel" "dokumente dokumente" "historie historie"; } .akte-grid.ist-fahrzeug { grid-template-areas: "kopf kopf" "aktionen aktionen" "wartung stamm" "pruefungen beladung" "maengel verantwortlich" "dokumente dokumente" "notizen notizen" "historie historie"; } } @media (max-width: 768px) { .split-layout { flex-direction: column; } .split-layout-sidebar, .split-layout-sidebar-sm { width: 100%; flex: 1 1 auto; } .page-wide { padding: 1.25rem 1rem 2rem; } /* Sidebar -> horizontale Topbar zurückklappen (Mobile-Durchgang) */ .app-shell { flex-direction: column; } .topbar { flex-direction: row; align-items: center; justify-content: space-between; width: auto; flex: 0 0 auto; height: auto; position: sticky; padding: 0.6rem 0.9rem; border-right: none; border-bottom: 1px solid var(--color-border); flex-wrap: wrap; gap: 0.75rem; } .topbar-nav { flex-direction: row; flex-wrap: wrap; gap: 0.15rem; } .topbar-nav a { padding: 0.4rem 0.6rem; font-size: 0.85rem; } h1 { font-size: 1.35rem; } .row { flex-wrap: wrap; } }