/* ── Objekte (Stammdaten › Objekte), Redesign 25.09.2026 ──────────────────────────────────
   Design-Übergabe „Objekte – Split-Ansicht (Cloud-Design-Modernisierung)". Liste links, Detail
   rechts ab 900 px Seitenbreite (is-split), darunter Push-Navigation (is-open). Layoutklassen
   setzt ein ResizeObserver in ebanking.js (_obLayout): is-split, is-desk (Liste 380 statt 340),
   is-touch (höhere Controls), is-phone (Hit-Targets 44 px), is-dnarrow (Detail < 620 px: Karten
   statt Tabellen). Flächen, Text und Marke kommen aus den App-Tokens in app.css; hier stehen nur
   die Zusatz-Tokens der Übergabe (Typfarben, Menü, Skeleton). */

#pageObjektuebersicht {
  --ob-elev:#ffffff; --ob-skel:rgba(15,23,42,.06); --ob-input:rgba(255,255,255,.9);
  --ob-seg-on:#ffffff;
  --t-blue:#0a6ea6;   --t-blue-bg:rgba(7,161,226,.11);
  --t-teal:#0f766e;   --t-teal-bg:rgba(20,184,166,.12);
  --t-orange:#a14a06; --t-orange-bg:rgba(245,158,11,.14);
  --t-green:#15803d;  --t-green-bg:rgba(34,197,94,.12);
  --t-violet:#6d28d9; --t-violet-bg:rgba(124,58,237,.10);
  --t-gray:#475569;   --t-gray-bg:rgba(100,116,139,.12);
}
html.dark #pageObjektuebersicht {
  --ob-elev:#171f2f; --ob-skel:rgba(255,255,255,.06); --ob-input:rgba(255,255,255,.05);
  --ob-seg-on:#141b29;
  --t-blue:#6fcff7;   --t-blue-bg:rgba(44,181,240,.14);
  --t-teal:#5fdcc9;   --t-teal-bg:rgba(45,212,191,.13);
  --t-orange:#fbbf24; --t-orange-bg:rgba(245,158,11,.15);
  --t-green:#6ee79a;  --t-green-bg:rgba(74,222,128,.12);
  --t-violet:#b9a2fb; --t-violet-bg:rgba(139,92,246,.18);
  --t-gray:#c3cddb;   --t-gray-bg:rgba(148,163,184,.14);
}

/* ── Seite füllt den Inhaltsbereich randlos (Muster #pageAdressen) ── */
body[data-seite="objektuebersicht"] .main-content:not(#_) {
  padding:0 !important; overflow:hidden !important;
  display:flex !important; flex-direction:column !important;
}
#pageObjektuebersicht.active {
  display:flex !important; flex:1 1 0; min-height:0; overflow:hidden; position:relative;
  background:transparent; color:var(--text);
  -webkit-font-smoothing:antialiased; font-variant-numeric:tabular-nums;
}
#pageObjektuebersicht button { font-family:inherit; }
#pageObjektuebersicht :focus { outline:none; }
#pageObjektuebersicht button:focus-visible, #pageObjektuebersicht [tabindex]:focus-visible,
#pageObjektuebersicht a:focus-visible, #pageObjektuebersicht select:focus-visible { outline:none; box-shadow:var(--ring); }
#pageObjektuebersicht button:disabled { opacity:.45; cursor:not-allowed; }
.ob-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* ── Spalten ── */
.ob-listpane { display:flex; flex-direction:column; width:100%; min-width:0; }
.ob-detailpane { display:none; flex:1; min-width:0; flex-direction:column; }
#pageObjektuebersicht.is-split .ob-listpane {
  width:340px; flex-shrink:0; border-right:1px solid var(--border);
  background:var(--surface); -webkit-backdrop-filter:blur(24px); backdrop-filter:blur(24px);
}
#pageObjektuebersicht.is-split.is-desk .ob-listpane { width:380px; }
#pageObjektuebersicht.is-split .ob-detailpane { display:flex; }
#pageObjektuebersicht:not(.is-split).is-open .ob-listpane { display:none; }
#pageObjektuebersicht:not(.is-split).is-open .ob-detailpane { display:flex; }

/* ── Kopf der Liste ── */
.ob-head { display:flex; flex-direction:column; gap:10px; flex-shrink:0; padding:16px 16px 12px; border-bottom:1px solid var(--border); }
.ob-titlerow { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.ob-title { margin:0; font-size:19px; font-weight:700; letter-spacing:-.02em; line-height:1.2; }
#pageObjektuebersicht.is-phone .ob-title { font-size:26px; }
.ob-count { font-size:12px; font-weight:500; color:var(--text-3); letter-spacing:0; margin-left:4px; }
.ob-headbtns { display:flex; align-items:center; gap:4px; }
.ob-icon, .ob-ghost {
  display:inline-flex; align-items:center; justify-content:center; gap:5px; height:30px; min-width:30px; padding:0 8px;
  border:0; border-radius:8px; background:transparent; color:var(--text-2); font-size:12.5px; font-weight:600; cursor:pointer;
  transition:background .12s;
}
.ob-icon { padding:0; }
.ob-icon:hover:not(:disabled), .ob-ghost:hover { background:var(--hover); color:var(--text); }
.ob-icon:active, .ob-ghost:active { background:var(--press); }
.ob-bj {
  height:30px; padding:0 6px; border:1px solid var(--border); border-radius:8px; background:var(--ob-input);
  color:var(--text-2); font:inherit; font-size:12.5px; font-weight:600; cursor:pointer;
}
#pageObjektuebersicht.is-touch :is(.ob-icon, .ob-ghost, .ob-bj) { height:34px; min-width:34px; }
#pageObjektuebersicht.is-phone :is(.ob-icon, .ob-ghost, .ob-bj) { height:44px; min-width:44px; }

.ob-search { position:relative; }
.ob-search > svg { position:absolute; left:11px; top:50%; margin-top:-7.5px; color:var(--text-3); pointer-events:none; }
#hpObjSearch {
  width:100%; box-sizing:border-box; height:34px; padding:0 10px 0 32px; border:1px solid var(--border); border-radius:9px;
  background:var(--ob-input); color:var(--text); font:inherit; font-size:13.5px; -webkit-appearance:none; appearance:none;
  transition:box-shadow .12s, border-color .12s;
}
#hpObjSearch::placeholder { color:var(--text-3); opacity:1; }
#hpObjSearch::-webkit-search-cancel-button { cursor:pointer; }
#hpObjSearch:focus { border-color:var(--brand); box-shadow:var(--ring); }
#pageObjektuebersicht.is-touch #hpObjSearch { height:40px; font-size:15px; }
#pageObjektuebersicht.is-phone #hpObjSearch { height:44px; font-size:16px; }

.ob-filterrow { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:28px; }
.ob-typwrap { display:flex; align-items:center; gap:4px; min-width:0; }
.ob-typbtn {
  display:inline-flex; align-items:center; gap:5px; height:28px; padding:0 10px; min-width:0; max-width:240px;
  border:1px solid var(--border); border-radius:8px; background:var(--ob-input); color:var(--text);
  font-size:12.5px; font-weight:600; cursor:pointer; transition:background .12s;
}
.ob-typbtn > span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ob-typbtn-k { color:var(--text-3); font-weight:500; }
.ob-typbtn:hover { background:var(--hover); }
.ob-typbtn.is-on { background:var(--brand-tint); border-color:transparent; color:var(--brand-text); }
.ob-typbtn.is-on .ob-typbtn-k { color:var(--brand-text); opacity:.75; }
.ob-typx {
  width:28px; height:28px; border:0; border-radius:8px; background:transparent; color:var(--text-3);
  display:inline-flex; align-items:center; justify-content:center; cursor:pointer;
}
.ob-typx[hidden] { display:none; }
.ob-typx:hover { background:var(--hover); color:var(--text); }
#pageObjektuebersicht.is-touch :is(.ob-typbtn, .ob-typx) { height:34px; }
#pageObjektuebersicht.is-touch .ob-typx { width:34px; }
#pageObjektuebersicht.is-phone :is(.ob-typbtn, .ob-typx) { height:44px; }
#pageObjektuebersicht.is-phone .ob-typx { width:44px; }
.ob-stats { font-size:12px; color:var(--text-3); white-space:nowrap; }

/* ── Menüs (Typ, Sortierung) ── */
.ob-menu {
  position:absolute; z-index:40; width:310px; max-width:calc(100vw - 32px); max-height:min(70vh, 520px); overflow:auto;
  padding:6px; border-radius:12px; background:var(--ob-elev); box-shadow:var(--pop-shadow); border:1px solid var(--border);
}
.ob-menu[hidden] { display:none; }
.ob-menu-sort { width:200px; }
.ob-mi {
  display:flex; align-items:center; gap:8px; width:100%; min-height:32px; padding:0 10px; border:0; border-radius:8px;
  background:transparent; color:var(--text); font-size:13px; text-align:left; cursor:pointer; transition:background .12s;
}
#pageObjektuebersicht.is-touch .ob-mi { min-height:40px; }
#pageObjektuebersicht.is-phone .ob-mi { min-height:44px; }
.ob-mi:hover { background:var(--hover); }
.ob-mi.is-on { background:var(--surface-2); font-weight:600; }
.ob-mi-dot { width:8px; height:8px; border-radius:3px; flex-shrink:0; background:var(--t-gray); }
.ob-mi-k { width:36px; flex-shrink:0; font-size:11.5px; font-weight:700; color:var(--text-2); }
.ob-mi-n { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ob-mi-c { font-size:12px; color:var(--text-3); }

/* ── Liste (Variante 8e) ── */
.ob-scroll { flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:6px 8px 16px; }
.ob-list:focus-visible { box-shadow:none !important; }
.ob-list:focus-visible .ob-row.is-sel { box-shadow:var(--ring); }
.ob-row {
  display:grid; grid-template-columns:30px minmax(0,1fr) 48px; gap:0 12px; align-items:center;
  padding:8px 10px 8px 8px; margin-bottom:1px; border-radius:9px; cursor:pointer; transition:background .12s;
}
#pageObjektuebersicht.is-touch .ob-row { padding:9px 12px 9px 10px; grid-template-columns:34px minmax(0,1fr) 48px; }
.ob-row:hover { background:var(--hover); }
.ob-av {
  width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:10.5px; font-weight:700; letter-spacing:.01em; background:var(--surface-2); color:var(--text-3);
}
#pageObjektuebersicht.is-touch .ob-row .ob-av { width:34px; height:34px; }
.ob-av.c-blue { background:var(--t-blue-bg); color:var(--t-blue); }
.ob-av.c-violet { background:var(--t-violet-bg); color:var(--t-violet); }
.ob-av.c-teal { background:var(--t-teal-bg); color:var(--t-teal); }
.ob-av.c-green { background:var(--t-green-bg); color:var(--t-green); }
.ob-av.c-orange { background:var(--t-orange-bg); color:var(--t-orange); }
.ob-rnr { font-size:11.5px; font-weight:600; letter-spacing:.03em; color:var(--text-3); line-height:1.25; }
.ob-rstr { margin-top:1px; font-size:14px; font-weight:600; color:var(--text); line-height:1.3; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#pageObjektuebersicht.is-touch .ob-rstr { font-size:15.5px; }
.ob-rwe { text-align:right; white-space:nowrap; }
.ob-rwe b { font-size:15px; font-weight:600; color:var(--text); }
.ob-rwe span { margin-left:3px; font-size:10px; font-weight:600; color:var(--text-3); }
.ob-row.is-sel, .ob-row.is-sel:hover { background:var(--primary); }
.ob-row.is-sel .ob-rstr, .ob-row.is-sel .ob-rwe b { color:#fff; }
.ob-row.is-sel .ob-rnr, .ob-row.is-sel .ob-rwe span { color:rgba(255,255,255,.75); }
.ob-row.is-sel .ob-av { background:rgba(255,255,255,.22); color:#fff; }

.ob-skel { background:var(--ob-skel); border-radius:6px; }
.ob-row.is-skel { cursor:default; }
.ob-row.is-skel:hover { background:transparent; }

/* ── Zustände (leer, Fehler) ── */
.ob-state { display:flex; flex-direction:column; align-items:center; text-align:center; gap:6px; padding:48px 24px; color:var(--text-2); }
.ob-state-icon {
  width:44px; height:44px; border-radius:12px; background:var(--surface-2); color:var(--text-3);
  display:flex; align-items:center; justify-content:center; margin-bottom:6px;
}
.ob-state-titel { font-size:14px; font-weight:600; color:var(--text); }
.ob-state-text { font-size:12.5px; color:var(--text-3); }
.ob-state .ob-primary { margin-top:10px; }
.ob-primary {
  height:32px; padding:0 14px; border:0; border-radius:8px; background:var(--primary); color:#fff;
  font-size:13px; font-weight:600; cursor:pointer; transition:background .12s;
}
.ob-primary:hover { background:var(--primary-hover); }
.ob-fehler { color:var(--red-text); }

/* ── Detail ── */
.ob-navbar { display:flex; align-items:center; gap:4px; flex-shrink:0; min-height:48px; padding:6px 16px; border-bottom:1px solid var(--border); }
.ob-back {
  display:none; align-items:center; gap:2px; height:36px; padding:0 8px 0 2px; margin-right:auto; border:0; border-radius:8px;
  background:transparent; color:var(--brand-text); font-size:15px; font-weight:500; cursor:pointer;
}
#pageObjektuebersicht:not(.is-split) .ob-back { display:inline-flex; }
#pageObjektuebersicht.is-phone .ob-back { height:44px; }
.ob-navpos { font-size:12.5px; color:var(--text-3); margin:0 8px 0 auto; }
#pageObjektuebersicht:not(.is-split) .ob-navpos { margin-left:0; }
.ob-detailscroll { flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain; }

.ob-badge { height:20px; padding:0 7px; border-radius:6px; display:inline-flex; align-items:center; font-size:11px; font-weight:600; white-space:nowrap; }
.ob-badge.c-blue { background:var(--t-blue-bg); color:var(--t-blue); }
.ob-badge.c-teal { background:var(--t-teal-bg); color:var(--t-teal); }
.ob-badge.c-orange { background:var(--t-orange-bg); color:var(--t-orange); }
.ob-badge.c-green { background:var(--t-green-bg); color:var(--t-green); }
.ob-badge.c-violet { background:var(--t-violet-bg); color:var(--t-violet); }
.ob-badge.c-gray { background:var(--t-gray-bg); color:var(--t-gray); }

.ob-tabs { display:flex; gap:4px; padding:0 12px; border-bottom:1px solid var(--border); overflow-x:auto; scrollbar-width:none; }
.ob-tabs::-webkit-scrollbar { display:none; }
.ob-tab {
  position:relative; flex-shrink:0; height:40px; padding:0 12px; border:0; background:transparent; cursor:pointer;
  color:var(--text-2); font-size:13.5px; font-weight:500; white-space:nowrap; border-radius:8px 8px 0 0; transition:background .12s;
}
#pageObjektuebersicht.is-phone .ob-tab { height:44px; }
.ob-tab:hover { background:var(--hover); color:var(--text); }
.ob-tab[aria-selected="true"] { color:var(--text); font-weight:600; }
.ob-tab[aria-selected="true"]::after { content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px; background:var(--brand); border-radius:2px; }
.ob-tab-c { margin-left:5px; font-size:11.5px; font-weight:500; color:var(--text-3); }

.ob-tabbody { padding:20px 24px 40px; display:flex; flex-direction:column; gap:12px; }
#pageObjektuebersicht.is-dnarrow .ob-tabbody { padding:14px 16px 32px; }

/* Karten: Glas wie überall in der App (Mike, Zähler-Redesign 25.09.2026) */
.ob-card {
  background:var(--bg-card); border:1px solid var(--border-glass); border-radius:12px; box-shadow:var(--card-shadow);
  -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
}
.ob-panel { padding:16px 18px; }

.ob-kpis { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:12px; }
.ob-kpis.is-3 { grid-template-columns:repeat(3, minmax(0,1fr)); }
#pageObjektuebersicht.is-dnarrow .ob-kpis { grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px; }
.ob-kpi { padding:12px 14px; min-width:0; }
.ob-kpi-l { font-size:12px; color:var(--text-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ob-kpi-v { margin-top:2px; font-size:19px; font-weight:700; letter-spacing:-.02em; color:var(--text); white-space:nowrap; }
.ob-kpi-v small { font-size:11.5px; font-weight:600; color:var(--text-3); letter-spacing:0; margin-left:2px; }
.ob-kpi-v.c-blue { color:var(--t-blue); } .ob-kpi-v.c-green { color:var(--t-green); } .ob-kpi-v.c-orange { color:var(--t-orange); }

.ob-btn {
  flex-shrink:0; height:30px; padding:0 12px; border:1px solid var(--border); border-radius:8px; background:var(--surface-solid);
  color:var(--text); font-size:13px; font-weight:600; cursor:pointer; transition:background .12s;
}
.ob-btn:hover { background:var(--hover); }
#pageObjektuebersicht.is-phone .ob-btn { height:44px; }
.ob-leer { color:var(--text-3); }

/* ── Segmented Control ── */
.ob-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.ob-seg { display:inline-flex; padding:2px; border-radius:9px; background:var(--surface-2); max-width:100%; }
.ob-seg button {
  min-height:28px; padding:0 10px; border:0; border-radius:7px; background:transparent; color:var(--text);
  font-size:12.5px; font-weight:500; cursor:pointer; white-space:nowrap; transition:background .12s;
}
.ob-seg button span { margin-left:4px; color:var(--text-3); font-size:11.5px; }
.ob-seg button[aria-checked="true"] { background:var(--ob-seg-on); box-shadow:0 1px 2px rgba(0,0,0,.12), 0 0 0 .5px var(--border); font-weight:600; }
#pageObjektuebersicht.is-touch .ob-seg button { min-height:34px; }
#pageObjektuebersicht.is-phone .ob-seg { display:flex; width:100%; }
#pageObjektuebersicht.is-phone .ob-seg button { flex:1 1 0; min-width:0; padding:0 4px; min-height:40px; }
.ob-textbtn { height:30px; padding:0 8px; border:0; border-radius:8px; background:transparent; color:var(--brand-text); font-size:13px; font-weight:600; cursor:pointer; }
.ob-textbtn:hover { background:var(--brand-tint); }

/* ── Tabellen ── */
.ob-table { overflow:hidden; }
.ob-thead, .ob-tr { display:grid; align-items:center; gap:0 12px; padding:0 16px; }
.ob-thead { min-height:34px; background:var(--surface-2); font-size:11.5px; font-weight:600; color:var(--text-3); border-bottom:1px solid var(--border); }
.ob-tr { min-height:52px; padding-top:6px; padding-bottom:6px; border-bottom:1px solid var(--border); font-size:13.5px; transition:background .12s; }
.ob-tr:last-child { border-bottom:0; }
.ob-tr:hover { background:var(--hover); }
.ob-r { text-align:right; }
.ob-cell { min-width:0; }
.ob-cell > div { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ob-sub { font-size:12px; color:var(--text-3); }
.ob-einh { color:var(--text-3); font-size:11.5px; margin-left:2px; }
.ob-whg { font-weight:600; }
.ob-grid-eh { grid-template-columns:44px minmax(0,.8fr) 84px 72px minmax(0,1.2fr) minmax(0,1.4fr); }
.ob-nutz { display:flex; align-items:center; gap:8px; min-width:0; }
.ob-nutz > span:last-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ob-leertext { padding:28px 16px; text-align:center; color:var(--text-3); font-size:13px; }

/* Karten statt Tabelle (Detail < 620 px) */
.ob-ecard { display:grid; grid-template-columns:32px minmax(0,1fr); gap:4px 12px; padding:12px 14px; border-bottom:1px solid var(--border); }
.ob-ecard:last-child { border-bottom:0; }
.ob-wkachel { grid-row:span 3; width:32px; height:32px; border-radius:9px; background:var(--surface-2); display:flex; align-items:center; justify-content:center; font-size:12.5px; font-weight:700; }
.ob-ecard-top { display:flex; justify-content:space-between; gap:8px; align-items:baseline; }
.ob-ecard-top b { font-size:15px; font-weight:600; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ob-ecard-top span { flex-shrink:0; font-size:12.5px; color:var(--text-2); }
.ob-ecard-l { font-size:12.5px; color:var(--text-2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* ── Verteilerschlüssel ── */
.ob-grid-vs { grid-template-columns:64px minmax(0,1fr) 110px 150px 90px 14px; }
.ob-vs-gruppe { display:flex; align-items:center; gap:6px; min-height:32px; padding:0 16px; background:var(--bg-main); font-size:12px; font-weight:600; color:var(--text-2); border-bottom:1px solid var(--border); }
.ob-vs-gruppe span { color:var(--text-3); font-weight:500; }
.ob-tr.is-klick { cursor:pointer; }
.ob-code { font-size:12.5px; font-weight:700; color:var(--text-2); }
.ob-ohne { font-style:italic; color:var(--text-3); }
.ob-chev { color:var(--text-3); transition:transform .15s; display:flex; }
.ob-tr[aria-expanded="true"] .ob-chev { transform:rotate(90deg); }
.ob-orange { color:var(--t-orange); }
.ob-vs-auf { background:var(--surface-2); padding:6px 16px 10px 92px; border-bottom:1px solid var(--border); }
.ob-vs-hinweis { font-size:12px; padding:6px 0 4px; }
.ob-vs-z { display:grid; grid-template-columns:56px minmax(0,1fr) 90px 130px; gap:0 12px; align-items:center; min-height:32px; font-size:13px; }
.ob-vs-z > div { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ob-bar { height:4px; border-radius:2px; background:var(--border-strong); overflow:hidden; }
.ob-bar i { display:block; height:100%; background:var(--brand); border-radius:2px; }
.ob-pz { margin-left:6px; font-size:11.5px; color:var(--text-3); }
#pageObjektuebersicht.is-dnarrow .ob-vs-auf { padding:6px 14px 10px; }
#pageObjektuebersicht.is-dnarrow .ob-vs-z { grid-template-columns:48px minmax(0,1fr) auto; }
#pageObjektuebersicht.is-dnarrow .ob-vs-z .ob-bar { display:none; }
.ob-vcard { padding:10px 14px; border-bottom:1px solid var(--border); cursor:pointer; }
.ob-vcard-z { display:flex; justify-content:space-between; gap:10px; align-items:baseline; }
.ob-vcard-z > div:first-child { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; }
.ob-vcard-z + .ob-vcard-z { margin-top:3px; font-size:12px; color:var(--text-3); }

/* Kurze Beschriftungen auf dem Telefon */
.ob-l-kurz { display:none; }
#pageObjektuebersicht.is-phone .ob-l-lang { display:none; }
#pageObjektuebersicht.is-phone .ob-l-kurz { display:inline; }
.ob-ecard .ob-nutz { font-size:13px; }

/* ── Reiter Archiv (Karten aus css/archiv.css) ── */
#pageObjektuebersicht #obArSuche {
  width:100%; box-sizing:border-box; height:34px; padding:0 10px 0 32px; border:1px solid var(--border); border-radius:9px;
  background:var(--ob-input); color:var(--text); font:inherit; font-size:13.5px; -webkit-appearance:none; appearance:none;
}
#pageObjektuebersicht #obArSuche:focus { border-color:var(--brand); box-shadow:var(--ring); }
#pageObjektuebersicht.is-touch #obArSuche { height:40px; font-size:16px; }
.ob-ar-such { flex:1 1 260px; max-width:420px; }
.ob-ar-link { display:inline-flex; align-items:center; text-decoration:none; }
.ob-chips { display:flex; flex-wrap:wrap; gap:6px; }
.ob-chip {
  display:inline-flex; align-items:center; gap:6px; height:28px; padding:0 10px; border:1px solid var(--border); border-radius:14px;
  background:var(--ob-input); color:var(--text-2); font-size:12.5px; font-weight:500; cursor:pointer; transition:background .12s;
}
.ob-chip span { color:var(--text-3); font-size:11.5px; }
.ob-chip:hover { background:var(--hover); }
.ob-chip.is-on { background:var(--brand-tint); border-color:transparent; color:var(--brand-text); font-weight:600; }
#pageObjektuebersicht.is-touch .ob-chip { height:34px; }
.ob-chip-dot { width:8px; height:8px; border-radius:3px; background:var(--ar-gray-k); }
.ob-chip-dot.g-blue { background:var(--ar-blue-t); } .ob-chip-dot.g-teal { background:var(--ar-teal-t); }
.ob-chip-dot.g-orange { background:var(--ar-orange-t); } .ob-chip-dot.g-violet { background:var(--ar-violet-t); }
.ob-chip-dot.g-gray { background:var(--ar-gray-t); }
.ob-ar { padding:4px 4px 8px; }
.ob-ar-mehr { display:flex; justify-content:center; padding:12px 0 4px; }
.ob-proto { border:0; padding:0; background:none; color:var(--brand-text); font:inherit; font-size:12px; font-weight:600; cursor:pointer; }
.ob-proto:hover { text-decoration:underline; }
#pageObjektuebersicht.is-phone .ob-chips { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; margin:0 -16px; padding:0 16px; }
#pageObjektuebersicht.is-phone .ob-chip { flex-shrink:0; }

/* ── Hero über den Reitern + Reiter Übersicht (Design-Übergabe „Objekt-Detail · Übersicht", Variante C,
   25.09.2026). Spalten richten sich nach der Breite des DETAILS (Container-Abfragen auf #obDetail bzw.
   .ob-ue-main), nicht des Fensters: ≥ 900 Inhalt | 320 px rechts, 600–899 rechte Spalte darunter mit
   Foto 260 px neben Zuständigkeit, < 600 einspaltig. Eckdaten zweispaltig ab 560 px Inhaltsbreite. ── */
#obDetail { container-type:inline-size; container-name:obd; }
.ob-herowrap { padding:18px 24px 14px; }
#pageObjektuebersicht.is-phone .ob-herowrap { padding:14px 14px 12px; }
.ob-hero {
  position:relative; overflow:hidden; border-radius:16px; padding:22px 24px 20px; color:#fff;
  background:radial-gradient(ellipse 60% 120% at 100% 0%, rgba(255,255,255,.18), transparent 60%),
             linear-gradient(120deg, #0b6fa8 0%, #2a4fb8 55%, #5b3fbf 100%);
  display:flex; flex-wrap:wrap; gap:18px 32px; align-items:flex-end;
}
.ob-hero-l { flex:1 1 300px; min-width:0; }
.ob-hero-chips { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.ob-hero-typ { height:22px; padding:0 8px; border-radius:6px; background:rgba(255,255,255,.18); font-size:11.5px; font-weight:600; display:inline-flex; align-items:center; }
.ob-hero-nr { font-size:12px; opacity:.85; }
.ob-hero-t { margin:10px 0 0; font-size:24px; font-weight:700; letter-spacing:-.02em; line-height:1.15; overflow-wrap:anywhere; color:#fff; }
.ob-hero-adr { display:flex; align-items:center; flex-wrap:wrap; gap:4px 12px; margin-top:4px; }
.ob-hero-adr > span { font-size:14px; opacity:.9; }
.ob-hero-link { display:inline-flex; align-items:center; gap:3px; color:#fff !important; opacity:.8; font-size:12px; font-weight:600; text-decoration:none; }
.ob-hero-link:hover { opacity:1; text-decoration:underline; }
.ob-hero-kpis { display:grid; grid-template-columns:repeat(4, auto); gap:8px 24px; }
@container obd (max-width:559px) { .ob-hero-kpis { grid-template-columns:repeat(2, auto); } }
.ob-hero-v { font-size:26px; font-weight:700; letter-spacing:-.025em; line-height:1; white-space:nowrap; }
.ob-hero-kl { margin-top:5px; font-size:11.5px; opacity:.85; white-space:nowrap; }

.ob-sec { padding:0 2px; font-size:12px; font-weight:600; color:var(--text-3); letter-spacing:.02em; }
.ob-sec-split { display:none; }
.ob-ue { display:grid; grid-template-columns:minmax(0,1fr); gap:12px; align-items:start; }
.ob-ue-main, .ob-ue-side, .ob-side-block { display:flex; flex-direction:column; gap:10px; min-width:0; }
.ob-ue-main { container-type:inline-size; container-name:obm; }
.ob-ue-main > .ob-sec:not(:first-child), .ob-tabbody > .ob-sec { padding-top:6px; }
.ob-ue-side { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; align-items:start; }
@container obd (min-width:900px) {
  .ob-ue { grid-template-columns:minmax(0,1fr) 320px; }
}
@container obd (min-width:600px) and (max-width:899px) {
  .ob-ue-side { grid-template-columns:260px minmax(0,1fr); }
  .ob-sec-split { display:block; }
}
.ob-eck { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; align-items:stretch; }
.ob-fin { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; align-items:stretch; }
@container obm (min-width:560px) {
  .ob-eck { grid-template-columns:repeat(2, minmax(0,1fr)); }
  .ob-fin { grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); }
}

/* Karte nach Card-Standard der Übergabe, Fläche im Glas-Stil der App */
.ob-c {
  min-width:0; overflow:hidden; border-radius:14px; background:var(--bg-card); border:1px solid var(--border-glass);
  box-shadow:var(--card-shadow); -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
}
.ob-c-h { display:flex; align-items:center; gap:8px; height:40px; padding:0 10px 0 16px; border-bottom:1px solid var(--border); }
.ob-c-t { flex:1; min-width:0; font-size:12.5px; font-weight:600; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ob-c-tl { flex:1; min-width:0; display:flex; align-items:center; gap:8px; }
.ob-c-tl .ob-c-t { flex:0 1 auto; }
.ob-c-nr { font-size:11px; color:var(--text-3); }
.ob-c-tl .ob-badge { height:18px; padding:0 6px; border-radius:5px; font-size:10.5px; }
.ob-cbtn {
  flex-shrink:0; display:inline-flex; align-items:center; gap:5px; height:26px; padding:0 9px; border:0; border-radius:7px;
  background:transparent; color:var(--brand-text); font-size:12px; font-weight:500; cursor:pointer; transition:background .12s;
}
.ob-cbtn:hover { background:var(--hover); }
.ob-cbtn.is-ok { color:var(--t-green); }
#pageObjektuebersicht.is-phone .ob-cbtn { height:36px; }
.ob-fgrid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:14px 16px; padding:14px 16px 16px; }
.ob-f { min-width:0; }
.ob-f.is-breit { grid-column:1 / -1; }
.ob-f-l { font-size:11.5px; color:var(--text-3); }
.ob-f-v { display:flex; align-items:center; gap:6px; margin-top:3px; min-width:0; font-size:14px; font-weight:600; color:var(--text); line-height:1.35; }
.ob-f-v > span:last-child { overflow-wrap:break-word; hyphens:auto; min-width:0; }
.ob-f-v.is-leer { color:var(--text-3); font-weight:500; }
.ob-dot { flex:none; width:7px; height:7px; border-radius:50%; }
.ob-dot.is-orange { background:var(--t-orange); } .ob-dot.is-green { background:var(--t-green); }
.ob-bank { padding:14px 16px 16px; }
.ob-iban { font:14px ui-monospace,'SF Mono',Menlo,monospace; letter-spacing:.02em; line-height:1.4; overflow-wrap:anywhere; color:var(--text); }
.ob-bank-i { margin-top:3px; font-size:12px; color:var(--text-3); overflow-wrap:anywhere; }

.ob-mseg { display:flex; gap:2px; padding:2px; border-radius:7px; background:var(--surface-2); }
.ob-mseg button { height:22px; padding:0 10px; border:0; border-radius:5px; background:transparent; color:var(--text-3); font-size:11.5px; font-weight:600; cursor:pointer; font-family:inherit; }
.ob-mseg button[aria-checked="true"] { background:var(--surface-solid); color:var(--text); box-shadow:0 1px 2px rgba(0,0,0,.12); }
.ob-mseg.is-gross { border-radius:8px; }
.ob-mseg.is-gross button { height:26px; padding:0 12px; border-radius:6px; font-size:12px; }
.ob-c-h .ob-icon { width:26px; min-width:26px; height:26px; border-radius:6px; }
.ob-media { position:relative; aspect-ratio:4 / 3; background:var(--surface-2); }
.ob-media.is-drop { box-shadow:inset 0 0 0 2px var(--brand); }
.ob-media iframe, .ob-media-img { position:absolute; inset:0; width:100%; height:100%; border:0; }
.ob-media-img { object-fit:cover; cursor:zoom-in; }
.ob-media-leer {
  position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; width:100%;
  border:0; background:transparent; color:var(--text-3); font:inherit; font-size:13px; text-align:center; line-height:1.4;
}
.ob-media-leer.is-klick { cursor:pointer; }
.ob-media-leer.is-klick:hover { color:var(--text-2); background:var(--hover); }
.ob-media-leer small { font-size:11.5px; }
.ob-media-neu {
  position:absolute; right:8px; bottom:8px; height:26px; padding:0 9px; border:0; border-radius:7px;
  background:rgba(8,12,22,.55); color:#fff; font-size:11.5px; font-weight:600; cursor:pointer; opacity:0; transition:opacity .15s;
}
.ob-media:hover .ob-media-neu, .ob-media-neu:focus-visible, #pageObjektuebersicht.is-touch .ob-media-neu { opacity:1; }

.ob-pers { display:flex; align-items:center; gap:12px; padding:14px 14px 14px 16px; }
.ob-pers .ob-av { width:40px; height:40px; border-radius:12px; font-size:13px; font-weight:700; flex-shrink:0; }
.ob-pers-t { flex:1; min-width:0; }
.ob-pers-t > div { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ob-pers-r { font-size:11.5px; font-weight:500; color:var(--text-3); }
.ob-pers-n { margin-top:1px; font-size:14px; font-weight:600; line-height:1.3; }
.ob-pers-m { margin-top:1px; font-size:12px; color:var(--text-3); }
.ob-pers-a { display:flex; flex-direction:column; gap:4px; flex:none; }
.ob-pers-a a {
  width:30px; height:30px; border-radius:8px; background:var(--surface-2); color:var(--text-2);
  display:flex; align-items:center; justify-content:center; text-decoration:none; transition:background .12s;
}
.ob-pers-a a:hover { background:var(--hover); color:var(--text); }
#pageObjektuebersicht.is-phone .ob-pers-a { flex-direction:row; }
#pageObjektuebersicht.is-phone .ob-pers-a a { width:44px; height:44px; }

.ob-notiz {
  padding:20px 22px 24px; min-height:320px; max-width:1100px; box-sizing:border-box;
  font-size:14px; line-height:1.7; color:var(--text); white-space:pre-line; overflow-wrap:anywhere; text-wrap:pretty;
}
.ob-notiz.is-leer { color:var(--text-3); }

/* Lightbox „Groß anzeigen" liegt im body, also außerhalb von #pageObjektuebersicht */
.ob-lb { position:fixed; inset:0; z-index:10050; display:flex; align-items:center; justify-content:center; padding:24px; background:rgba(8,12,22,.62); }
.ob-lb-dlg { width:100%; max-width:960px; border-radius:16px; overflow:hidden; background:var(--surface-solid); color:var(--text); box-shadow:0 24px 64px rgba(0,0,0,.4); }
.ob-lb-h { display:flex; align-items:center; gap:10px; height:48px; padding:0 10px 0 18px; border-bottom:1px solid var(--border); }
.ob-lb-t { flex:1; min-width:0; font-size:14px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ob-lb-t span { font-weight:400; color:var(--text-3); }
.ob-lb-x { width:32px; height:32px; border:0; border-radius:8px; background:transparent; color:var(--text-2); cursor:pointer; display:flex; align-items:center; justify-content:center; }
.ob-lb-x:hover { background:var(--hover); }
.ob-lb-f { position:relative; height:min(62vh, 560px); background:#11151d; }
.ob-lb-f iframe, .ob-lb-img { position:absolute; inset:0; width:100%; height:100%; border:0; }
.ob-lb-img { object-fit:contain; }
.ob-lb-leer { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; padding:0 24px; text-align:center; color:rgba(255,255,255,.7); font-size:13px; }
.ob-lb-links { display:flex; flex-wrap:wrap; gap:6px 16px; padding:12px 18px; }
.ob-lb-link { display:inline-flex; align-items:center; gap:4px; color:var(--brand-text); font-size:12.5px; font-weight:500; text-decoration:none; }
.ob-lb-link:hover { text-decoration:underline; }
@media (max-width:599px) { .ob-lb { padding:0; } .ob-lb-dlg { border-radius:0; height:100%; display:flex; flex-direction:column; } .ob-lb-f { flex:1; height:auto; } }

/* ── Verträge (07.10.2026) ── */
.ob-vt-tr { grid-template-columns:minmax(0,1.2fr) minmax(0,1.2fr) 120px auto; }
#pageObjektuebersicht.is-phone .ob-vt-tr { grid-template-columns:minmax(0,1fr) auto; gap:4px 12px; }
#pageObjektuebersicht.is-phone .ob-vt-tr > :nth-child(2) { grid-column:1; grid-row:2; }
#pageObjektuebersicht.is-phone .ob-vt-tr > :nth-child(3) { grid-column:2; grid-row:1 / span 2; }
#pageObjektuebersicht.is-phone .ob-vt-tr > :nth-child(4) { grid-column:1 / -1; text-align:left; }
.ob-vu-tr { grid-template-columns:minmax(0,1.4fr) repeat(6, 72px) minmax(0,1.6fr); }
#pageObjektuebersicht.is-phone .ob-vu-tr { grid-template-columns:minmax(0,1fr) repeat(3, 56px); }
#pageObjektuebersicht.is-phone .ob-vu-tr > :nth-child(n+5):not(:last-child) { display:none; }
#pageObjektuebersicht.is-phone .ob-vu-tr > :last-child { grid-column:1 / -1; }
