:root{--ui-header-height:64px;--ui-nav-width:210px}.ui-nav-visible #topNav{position:fixed!important;top:var(--ui-header-height);left:0;bottom:0;width:var(--ui-nav-width);padding:16px 12px;box-sizing:border-box;overflow-y:auto;display:block!important;background:#f8fafc;border-right:1px solid #dbe2ea;border-radius:0;z-index:80;box-shadow:none}.ui-nav-visible .app-content{margin-left:var(--ui-nav-width);width:calc(100% - var(--ui-nav-width));box-sizing:border-box}.ui-nav-group{margin:0 0 16px}.ui-nav-group[hidden]{display:none}.ui-nav-group h2{font:600 11px/1.4 system-ui;color:#64748b;text-transform:uppercase;letter-spacing:.06em;margin:0 8px 5px}.ui-nav-visible #topNav .toggle-btn{display:flex;align-items:center;width:100%;justify-content:flex-start;text-align:left;gap:7px;border:0!important;background:transparent;color:#334155;font-size:13px;font-weight:500;padding:9px 10px;border-radius:6px;white-space:normal;margin:2px 0;box-shadow:none}.ui-nav-visible #topNav .toggle-btn.active{background:#e8eff9!important;color:#183b68!important;font-weight:650}.ui-nav-visible #topNav .toggle-btn:hover{background:#edf1f6;color:#183b68}.ui-nav-visible #topNav .toggle-btn svg{opacity:.7;flex-shrink:0}.ui-menu-button{display:none}.ui-nav-visible .dashboard-header .view-toggle-compact{display:none!important}#viewFakturierung #faktHauptPanel{border:1px solid #e2e8f0;border-radius:10px!important;padding:18px!important}#viewFakturierung #faktStatusTiles>button,#viewFakturierung #faktBereichSummary>button{box-shadow:none!important;border-radius:6px!important;font-weight:500!important;padding:8px 11px!important}#viewFakturierung #faktStatusTiles>button:not([aria-pressed=true]),#viewFakturierung #faktBereichSummary>button:not([aria-pressed=true]){background:#f8fafc!important;color:#475569!important;border-color:#e2e8f0!important}#viewFakturierung #faktSummary{line-height:1.7;font-size:13px!important}#viewFakturierung #faktKalenderBox>div{background:#fffcf5!important;border-color:#e6dcc6!important;padding:12px 14px!important}#viewFakturierung #faktKalenderBox summary{font-size:13px;font-weight:500!important}#viewFakturierung .fakt-detail{border-top:1px solid #cbd5e1!important;border-left:3px solid #94a3b8;padding:16px!important}#viewFakturierung .fakt-detail .btn{font-size:12px}#viewFakturierung .fakt-main-table{min-width:1280px!important}#viewFakturierung .fakt-main-table>tbody>tr>td{font-size:13px}.ui-actions{display:inline-block;position:relative;font-size:12px;vertical-align:middle}.ui-actions>summary{list-style:none;cursor:pointer;border:1px solid #cbd5e1;border-radius:6px;padding:6px 10px;background:#fff;color:#475569}.ui-actions>summary::-webkit-details-marker{display:none}.ui-actions[open]{z-index:25}.ui-actions>div{position:absolute;right:0;top:100%;margin-top:4px;min-width:180px;border:1px solid #cbd5e1;border-radius:8px;background:white;padding:6px;box-shadow:0 8px 22px #0f172a20}.ui-actions>div>.btn{display:block;width:100%;text-align:left;border:0!important;border-radius:4px!important;background:white!important;color:#334155!important;padding:8px!important}.ui-actions>div>.btn:hover{background:#f1f5f9!important}.fakt-refine{margin-top:10px;border-top:1px solid #e2e8f0;padding-top:10px}.fakt-refine>summary{cursor:pointer;color:#475569;font-size:13px}.fakt-refine[open]>summary{margin-bottom:10px}@media(max-width:1100px){.ui-nav-visible .app-content{margin-left:0;width:100%}.ui-nav-visible #topNav{display:none!important;width:min(290px,85vw);box-shadow:8px 0 30px #0f172a20}.ui-nav-visible.ui-menu-open #topNav{display:block!important}.ui-nav-visible .ui-menu-button{display:inline-flex;align-items:center;background:#fff;color:#1e3c6e;border:1px solid #cbd5e1;border-radius:6px;padding:7px 10px;font-size:13px}.ui-nav-visible #appHeader{flex-wrap:wrap}#viewFakturierung #faktHauptPanel{padding:12px!important}}@media print{#topNav,.ui-menu-button{display:none!important}.ui-nav-visible .app-content{margin-left:0;width:100%}.ui-actions>summary{display:none}}

.ui-actions{flex-shrink:0;align-self:flex-start}.ui-actions>summary{white-space:nowrap}.ui-actions>div{min-width:180px;z-index:100}#viewFakturierung #faktStatusTiles>button:not([aria-pressed=true])>div:nth-child(2){color:#334155!important}

.ui-nav-visible #navToggleBtn{display:none!important}
/* Legacy full-viewport toolbars must stay within the sidebar's content column. */
@media screen{
 .ui-nav-visible .app-content .dashboard-header{width:100%;max-width:100%;margin-left:0;margin-right:0;box-sizing:border-box}
 .ui-nav-visible .app-content{min-width:0;max-width:calc(100% - var(--ui-nav-width))}
 .ui-nav-visible #topNav .tab-badge{position:static!important;inset:auto!important;transform:none!important;margin:0 0 0 3px!important;display:inline-flex;flex:0 0 auto;min-width:20px;height:20px;padding:0 5px;font-size:11px;border:0;box-shadow:none;animation:none;vertical-align:middle}
 @media(max-width:1100px){.ui-nav-visible .app-content{max-width:100%}}
}

/* The navigation preference affects desktop layout; mobile remains an overlay. */
.ui-nav-visible .ui-menu-button{display:inline-flex;align-items:center;flex-shrink:0;white-space:nowrap;background:#fff;color:#1e3c6e;border:1px solid #cbd5e1;border-radius:6px;padding:7px 10px;font-size:13px;cursor:pointer}
.ui-menu-button[hidden]{display:none!important}
@media screen and (min-width:1101px){
 .ui-nav-visible.ui-nav-collapsed #topNav{display:none!important}
 .ui-nav-visible.ui-nav-collapsed .app-content{margin-left:0;width:100%;max-width:100%}
}
@media print{.ui-nav-visible .ui-menu-button{display:none!important}}

.service-contract-editor > div:first-child { gap:16px; flex-wrap:wrap; }
.service-contract-editor > div:first-child > div:first-child { flex-shrink:0; white-space:nowrap; }
.service-contract-editor > div:first-child > div:last-child { margin-left:auto; }
.service-contract-editor .btn { white-space:nowrap; min-height:36px; }
.service-contract-editor .form-control:not(textarea) { height:36px; box-sizing:border-box; }
.service-contract-conditions { display:grid; grid-template-columns:repeat(auto-fit,minmax(145px,1fr)); gap:16px; align-items:end; }
.service-contract-conditions > div { min-width:0; }
.service-contract-conditions label:not([for]) { min-height:30px; display:flex!important; align-items:end; gap:4px; flex-wrap:wrap; }
.service-contract-conditions input:not([type=checkbox]) { width:100%; }
.service-contract-conditions > div:nth-child(4) { min-width:170px; }
.service-contract-conditions input[type=month] { min-width:165px; }
@media(max-width:700px) { .service-contract-conditions { grid-template-columns:1fr; } }

/* Handy-Menü (18.10.2026): #topNav hängt als Seitenmenü direkt im <body> (pipeline-ui.js) – hier zuoberst über allen
   Inhalten (Mein Tag, Kanban, Pendenzen-Leiste), deckend weiss, darunter ein abdunkelnder Hintergrund (Antippen schliesst).
   Echte Dialoge (.modal-overlay 2000 ff.) bleiben darüber. */
.ui-nav-backdrop{display:none}
@media(max-width:1100px){
 .ui-nav-visible.ui-menu-open #topNav{z-index:1900!important;background:#fff!important;opacity:1!important;isolation:isolate;transform:translateZ(0);box-shadow:8px 0 30px #0f172a40;overscroll-behavior:contain}
 .ui-nav-visible.ui-menu-open .ui-nav-backdrop{display:block;position:fixed;left:0;right:0;bottom:0;top:var(--ui-header-height);z-index:1890;background:rgba(15,23,42,.45);-webkit-tap-highlight-color:transparent}
}
@media print{.ui-nav-backdrop{display:none!important}}

/* Reiter als Untereinträge im Menü (18.10.2026) */
.ui-nav-item{position:relative}
.ui-nav-visible #topNav .ui-nav-item>.toggle-btn{padding-right:32px}
.ui-nav-caret{position:absolute;right:3px;top:50%;transform:translateY(-50%);width:26px;height:26px;display:flex;align-items:center;justify-content:center;border:0;background:transparent;color:#64748b;border-radius:5px;cursor:pointer;font-size:14px;padding:0}
.ui-nav-caret:hover{background:#e2e8f0;color:#183b68}
.ui-nav-caret[hidden],.ui-nav-sub[hidden],.ui-nav-subitem[hidden]{display:none!important}
.ui-nav-sub{margin:0 0 4px 17px;padding-left:5px;border-left:1px solid #e2e8f0}
.ui-nav-subitem{display:flex;align-items:center;gap:6px;width:100%;box-sizing:border-box;text-align:left;border:0;background:transparent;color:#64748b;font-size:12px;font-weight:500;line-height:1.3;padding:6px 8px;margin:1px 0;border-radius:5px;cursor:pointer}
.ui-nav-subitem:hover{background:#edf1f6;color:#334155}
.ui-nav-subitem.aktiv{background:#e8eff9;color:#183b68;font-weight:650}
.ui-nav-subicon{width:16px;flex-shrink:0;text-align:center;font-size:12px}
@media(max-width:1100px){.ui-nav-subitem{padding:9px 8px;font-size:13px}.ui-nav-caret{width:34px;height:34px}}