/* Gemeinsame mobile App-Oberfläche, nach den seitenspezifischen Styles laden. */
:root { --bottom-nav-h: 64px; --safe-bottom: env(safe-area-inset-bottom, 0px); }
.o-nav .app-name, .crumbs b, .avatar, .mini, .dash b, .kpi-strip b, .greeting h1 { font-family: Poppins, system-ui, sans-serif; }
.mobile-nav, .mobile-subnav { display: none; }
.mobile-row-select span { display: none; }
.mobile-table-scroll { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; }
.palette { max-height: 80dvh; overflow-y: auto; overscroll-behavior: contain; }
.palette-heading { display: flex; align-items: center; justify-content: space-between; padding: 8px 16px; border-bottom: 1px solid var(--line); }
.palette a[hidden] { display: none; }
.mobile-app-grid { padding: 8px 16px 16px; }
.mobile-app-grid a { display: flex; align-items: center; gap: 12px; min-height: 60px; border-bottom: 1px solid var(--line-2); }
.mobile-app-grid a > svg { margin-left: auto; }
.mobile-app-grid .mini { width: 40px; height: 40px; border-radius: 12px; }
.mobile-app-grid a[aria-current] { color: var(--yellow-text); font-weight: 600; }
body.dialog-open, body.palette-open { overflow: hidden; }
:where(button, a, input, select, textarea, [tabindex]):focus-visible { outline: 3px solid var(--yellow); outline-offset: 3px; }

@media (max-width: 1100px) {
  .o-nav .tray-company { display: none; }
  .o-nav .menus { min-width: 0; overflow-x: auto; }
  .o-nav .menus a { padding-inline: 9px; }
  .cp > *, .panel, .panel-body, .nb-panel { min-width: 0; }
}

@media (max-width: 767px) {
  :root { --nav-h: calc(56px + env(safe-area-inset-top, 0px)); }
  html { scroll-padding-top: calc(var(--nav-h) + 12px); scroll-padding-bottom: calc(var(--bottom-nav-h) + var(--safe-bottom) + 12px); }
  body { font-size: 14px; overflow-wrap: anywhere; }
  body.app-shell { padding-bottom: calc(var(--bottom-nav-h) + var(--safe-bottom)); }
  .o-nav { height: var(--nav-h); padding: env(safe-area-inset-top, 0px) max(8px, env(safe-area-inset-right)) 0 max(8px, env(safe-area-inset-left)); }
  .o-nav .apps-btn, .o-nav .nav-burger, .o-nav .menus, .o-nav .tray-company { display: none; }
  .o-nav .app-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; padding: 0 6px; font-size: 15px; }
  .o-nav .systray { flex-shrink: 0; gap: 0; }
  .o-nav .tray-btn { width: 44px; height: 44px; justify-content: center; padding: 0; }
  .o-nav .tray-btn[title="Nachrichten"] { display: none; }
  .o-nav .avatar { width: 40px; height: 40px; margin: 0 2px 0 6px; }
  .mobile-nav { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); position: fixed; z-index: 35; bottom: 0; left: 0; right: 0; height: calc(var(--bottom-nav-h) + var(--safe-bottom)); padding: 4px env(safe-area-inset-right, 0px) var(--safe-bottom) env(safe-area-inset-left, 0px); background: var(--card); border-top: 1px solid var(--line); box-shadow: 0 -3px 16px #00000006; }
  .mobile-nav a, .mobile-nav button { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 3px; min-width: 0; color: var(--muted); background: none; border: 0; font-size: 11px; font-weight: 600; -webkit-tap-highlight-color: transparent; }
  .mobile-nav [aria-current], .mobile-nav .active { color: var(--ink); }
  .mobile-nav [aria-current] svg, .mobile-nav .active svg { background: var(--yellow-soft); box-shadow: 0 0 0 7px var(--yellow-soft); border-radius: 6px; }
  .mobile-nav span { position: relative; }
  .mobile-subnav { display: flex; gap: 8px; padding: 8px 12px; background: var(--card); border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: thin; overscroll-behavior-x: contain; }
  .mobile-subnav a { flex: 0 0 auto; display: flex; align-items: center; min-height: 44px; padding: 8px 14px; border-radius: 10px; font-weight: 600; color: var(--muted); white-space: nowrap; }
  .mobile-subnav [aria-current] { color: var(--ink); background: var(--yellow-soft); }
  .mobile-subnav:has(a:only-child) { display: none; }

  /* Touch-Ziele und iOS-feste Eingabegrößen. */
  .btn, .icon-x, .cp-gear, .pager button, .views button, .k-head .add, .o-search .toggle-dd, .facet .x { min-width: 44px; min-height: 44px; }
  .btn { white-space: normal; text-align: center; padding: 10px 12px; }
  .btn-sm { font-size: 12px; }
  body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]), body select, body textarea { font-size: 16px !important; min-height: 44px; min-width: 0; max-width: 100%; }
  body input[type="checkbox"], body input[type="radio"] { flex-shrink: 0; width: 20px; height: 20px; }
  .nb-tabs button, .search-dd a, .seg button, .day-tabs button { min-height: 44px; }
  .nb-tabs, .stages, .seg { max-width: 100%; overscroll-behavior-x: contain; }
  .nb-tabs button { flex-shrink: 0; }
  .cp { grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 12px; }
  .cp-left { flex-wrap: wrap; gap: 8px; }
  .cp-left .crumbs { flex: 1; min-width: 0; }
  .crumbs { white-space: normal; flex-wrap: wrap; font-size: 15px; }
  .cp-mid { grid-column: 1; grid-row: auto; }
  .cp-right { grid-column: 1; grid-row: auto; justify-content: space-between; flex-wrap: wrap; gap: 8px; }
  .cp-right:empty, .cp-mid:empty { display: none; }
  .cp-right .pager, .cp-right .pager span { display: flex; }
  .cp-mid .search-wrap, .o-search { max-width: none; }
  /* Suchleiste einzeilig: Filter-Chip kürzen statt umbrechen, Eingabe und Filterpfeil bleiben in einer Zeile */
  .o-search { flex-wrap: nowrap; gap: 6px; }
  .o-search > svg { flex: none; }
  .o-search .facet { flex: 0 1 auto; min-width: 0; max-width: 45%; }
  .o-search .facet .k { flex: none; }
  .o-search .facet .v { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; align-items: center; }
  .o-search .facet .x { min-width: 34px; min-height: 34px; flex: none; }
  .o-search input { flex: 1 1 60px; min-width: 0; }
  .o-search .toggle-dd { flex: none; min-width: 40px; min-height: 40px; }
  .select-bar { flex-wrap: wrap; width: 100%; }
  .search-dd { max-height: 55dvh; overflow-y: auto; }
  .panel-head, .dialog-foot { flex-wrap: wrap; }
  .panel-head h3 { min-width: 0; }
  .panel-head .right { display: flex; flex-wrap: wrap; gap: 6px; }
  .o-content { padding: 12px; }
  .o-content.flush { padding: 0; }
  .home { padding: 24px 12px; min-height: calc(100dvh - var(--nav-h) - var(--bottom-nav-h) - var(--safe-bottom)); }
  .home-inner, .panel, .panel-body, .sheet, .form-main { min-width: 0; }
  .app-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 8px; }
  .app-tile { width: 100%; max-width: 112px; font-size: 12px; }
  .app-tile .ico { width: 64px; height: 64px; border-radius: 18px; }
  .home-today { grid-template-columns: minmax(0, 1fr); }
  .todo { grid-template-columns: 20px minmax(0, 1fr) auto; }
  .todo > :last-child { grid-column: 2 / -1; justify-self: start; }
  .rem-row { grid-template-columns: 30px minmax(0, 1fr); padding: 12px; }
  .rem-row .when { grid-column: 2; }
  .kanban { padding: 12px 12px 24px; scroll-snap-type: x proximity; scroll-padding-inline: 12px; min-height: 60dvh; }
  .kanban .k-col:not(.folded) { flex-basis: min(340px, calc(100vw - 36px)); scroll-snap-align: start; }
  .k-card { padding: 14px; gap: 8px; border-radius: 12px; }
  .k-quick { min-height: 44px; }

  /* Karten statt Desktop-Tabellen, mit Auswahl und vollständigen Werten. */
  .o-list-wrap { background: var(--bg); border: 0; overflow: visible; }
  table.o-list.cards { display: block; width: 100%; }
  table.o-list.cards thead { display: none; }
  table.o-list.cards tbody, table.o-list.cards tfoot { display: block; width: 100%; }
  table.o-list.cards tbody tr:not(.group), table.o-list.cards tfoot tr { display: block; position: relative; margin: 10px 12px; padding: 12px; width: auto; border: 1px solid var(--line); border-radius: 12px; background: var(--card); }
  table.o-list.cards td { display: block; width: auto; min-width: 0; padding: 4px 0; border: 0; text-align: left; white-space: normal; }
  table.o-list.cards td[data-label]::before { content: attr(data-label) ": "; color: var(--muted); font-size: 12px; font-weight: 500; }
  table.o-list.cards tbody tr:not(.group) td.amt, table.o-list.cards tbody tr:not(.group) td.st { text-align: left; }
  table.o-list.cards tbody td.cb { display: flex; align-items: center; min-height: 44px; }
  .mobile-row-select { display: flex; align-items: center; gap: 8px; min-height: 44px; cursor: pointer; }
  .mobile-row-select span { display: inline; font-size: 12px; color: var(--muted); }
  table.o-list.cards tfoot td:empty { display: none; }
  table.o-list.cards td.opt { display: block; width: auto; text-align: left; }
  table.o-list.cards td.opt:empty { display: none; }
  table.o-list.cards td[data-label="Verkäufer"] { display: block; }
  table.o-list.cards tr.group { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; width: 100%; padding: 12px; background: var(--bg); }
  table.o-list.cards tr.group td { display: inline; padding: 0; background: none; }
  table.o-list.cards tr.group td:empty { display: none; }
  table.o-list.cards tr.sel { background: var(--yellow-soft); }
  table.o-list.cards tr.sel td { background: transparent !important; }
  .mobile-table-scroll { border-radius: 8px; scrollbar-width: thin; }
  .mobile-table-scroll table { min-width: 480px; }
  .mobile-table-scroll table.assume { min-width: 0; }

  /* Formulare und Überlagerungen folgen der verfügbaren Bildschirmhöhe. */
  .form-layout, .o-groups { grid-template-columns: minmax(0, 1fr); }
  .sheet-bg { padding: 0; }
  .sheet { padding: 18px 16px; border-radius: 0; border-inline: 0; }
  .sheet h1 { font-size: 23px; }
  .smart { margin: -18px -16px 14px; }
  .smart a { flex: 1 1 50%; min-width: 0; }
  .o-field { grid-template-columns: minmax(0, 1fr); gap: 4px; padding-block: 8px; }
  .statusbar { padding: 10px 12px; }
  .statusbar .btn:not(.btn-primary) { display: inline-flex; }
  .stages { width: 100%; margin: 0; overflow-x: auto; padding-block: 4px; }
  .stages span:not(.cur), .stages span.cur { display: block; flex-shrink: 0; }
  .composer textarea { min-width: 0; }
  .dialog:not(.dock) { top: auto; bottom: 0; left: 0; transform: none; width: 100% !important; max-width: none; max-height: calc(100dvh - env(safe-area-inset-top, 0px) - 12px); border-radius: 20px 20px 0 0; overscroll-behavior: contain; padding-bottom: var(--safe-bottom); }
  .dialog-head { position: sticky; top: 0; z-index: 2; background: var(--card); gap: 8px; padding: 12px 16px; }
  .dialog-head h3 { min-width: 0; }
  .dialog-body { padding: 16px; }
  .dialog-foot { position: sticky; bottom: 0; z-index: 2; background: var(--card); padding: 12px 16px; }
  .dialog-foot .btn { flex: 1 1 auto; }
  .dialog.dock { right: 8px; bottom: calc(var(--bottom-nav-h) + var(--safe-bottom) + 8px); width: calc(100% - 16px); max-height: calc(100dvh - var(--nav-h) - var(--bottom-nav-h) - var(--safe-bottom) - 16px); }
  .palette-wrap { padding: calc(env(safe-area-inset-top, 0px) + 8px) 8px calc(var(--safe-bottom) + 8px); }
  .palette { max-height: 100%; width: 100%; }
  .palette a { min-height: 48px; }
  .palette input { position: sticky; top: 0; background: var(--card); }
  .o-pop { top: calc(var(--nav-h) + 4px); max-height: calc(100dvh - var(--nav-h) - var(--bottom-nav-h) - var(--safe-bottom) - 16px); }
  .o-pop .pop-head { flex-wrap: wrap; gap: 8px; }
  .act-row { grid-template-columns: 30px minmax(0, 1fr) auto auto auto; gap: 6px; padding: 12px; }
  .sk-toast { bottom: calc(var(--bottom-nav-h) + var(--safe-bottom) + 12px); }
  .sk-toast.r { bottom: auto; top: calc(var(--nav-h) + 8px); }

  /* Seitenspezifische Raster und zuvor versteckte mobile Aktionen. */
  .dash { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dash a, .dash a:nth-child(n+4) { display: flex; padding: 12px; border-bottom: 1px solid var(--line-2); }
  .dash a:nth-child(odd) { border-left: 0; }
  .kpis, .kpis.k8, .kpi-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .course-grid, .prog-grid { grid-template-columns: minmax(0, 1fr); }
  .below, .two, .tech-grid, .comm-grid, .plan-grid, .eco-grid, .act-grid, .eco-top, .fp-layout, .vk-grid, .dlg-grid { grid-template-columns: minmax(0, 1fr); }
  .cstatus { margin: -18px -16px 14px; }
  .ba-grid, .ba-form, .ba-wide, .ba-form .wide, .grid2, .checks, .fp-checks { grid-template-columns: minmax(0, 1fr); }
  .head { flex-wrap: wrap; }
  .prog-head { flex-wrap: wrap; }
  .prog-head .meter { min-width: 0; flex-basis: 100%; }
  .fp-pick, .ref-kpis, .w-tiles { grid-template-columns: minmax(0, 1fr); }
  .fp-ask { grid-template-columns: minmax(0, 1fr); }
  .order-two { grid-template-columns: minmax(0, 1fr); }
  .w-act .grow, .wait-box .grow { min-width: 0; }
  .qr-body { grid-template-columns: minmax(0, 1fr); }
  .qr { max-width: 220px; margin-inline: auto; }
  .gantt-wrap, .legend { display: none; }
  .m-days { display: block; }
  .below { padding: 12px; }
  .alert { flex-wrap: wrap; }
  .alert .btn { display: inline-flex; }
  .ff { grid-template-columns: minmax(0, 1fr); }
  .cp.sticky { position: static; }
  .st-side { top: var(--nav-h); }
  .st-side a { min-height: 44px; }
  .st-sec { scroll-margin-top: 64px; }
  .pub-top { flex-wrap: wrap; padding: calc(12px + env(safe-area-inset-top, 0px)) 16px 12px; }
  .pub-top a { min-height: 44px; display: flex; align-items: center; }
  .pub { padding-bottom: calc(32px + var(--safe-bottom)); }
  .chips span { min-height: 44px; align-items: center; }
  .row2 { grid-template-columns: 90px minmax(0, 1fr); }
}

@media (max-width: 380px) {
  .o-nav .app-name { font-size: 13px; }
  .sheet > .o-groups .o-field { grid-template-columns: minmax(0, 1fr); }
  .ba-kv { grid-template-columns: minmax(0, 1fr); }
  .tech, .types, .fp-sum { grid-template-columns: minmax(0, 1fr); }
  .act-form .two, .ba-form .two { grid-template-columns: minmax(0, 1fr); }
  .dialog-body .o-field > div[style*="grid-template-columns"] { grid-template-columns: minmax(0, 1fr) !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
@media print {
  .mobile-nav, .mobile-subnav, .palette-heading { display: none !important; }
  body.app-shell { padding-bottom: 0; }
  .mobile-table-scroll { overflow: visible; }
}