/* ==========================================================================
   update-next.css — Helles Theme + horizontales Chrome (Variante C).
   Wird NUR geladen, wenn ?ui=next gesetzt ist (paralleler Rollout).
   Kernidee: die --u-* CSS-Variablen werden auf helle Werte umdefiniert,
   dadurch re-skinnen sich alle bestehenden Tab-Panels automatisch.
   ========================================================================== */
body.ui-next{
  --u-bg-1:#F4F3F8; --u-bg-2:#FBFAFD; --u-surface:#FFFFFF; --u-surface-2:#F7F6FB;
  --u-border:rgba(18,14,30,.10); --u-hairline:rgba(18,14,30,.06);
  --u-fg-1:#17131F; --u-fg-2:#43405a; --u-fg-3:#8a8499;
  --u-lime:#7fb000; --u-lime-soft:rgba(199,247,62,.30);
  --u-mag:#C2247E; --u-blue:#3a6ea5;
  --u-line:rgba(18,14,30,.10); --u-accent:#7fb000; --u-card:#FFFFFF; --u-muted:#8a8499;
  background:#F4F3F8 !important; color:#17131F;
}

/* dunkle Sidebar entfernen, Content zentriert + voll ----------------------- */
body.ui-next .u-sidebar{display:none !important}
body.ui-next .u-layout{display:block !important}
body.ui-next .u-content{max-width:1180px;margin:0 auto;padding:20px 26px 70px;background:transparent}

/* Header hell -------------------------------------------------------------- */
body.ui-next .u-hdr{background:#fff !important;border-bottom:1px solid rgba(18,14,30,.07) !important;box-shadow:none}
body.ui-next .u-hdr-inner{max-width:1180px;margin:0 auto}
body.ui-next .u-hdr, body.ui-next .u-hdr a, body.ui-next .u-hdr span, body.ui-next .u-hdr button{color:#17131F}
body.ui-next .u-brand-pill{background:linear-gradient(135deg,#C7F73E,#9fd400) !important}
body.ui-next .u-brand-pill .u-brand-name,body.ui-next .u-brand-pill .u-brand-tld{color:#16180A !important}
body.ui-next .u-brand-tag{color:#8a8499 !important}
body.ui-next .u-site, body.ui-next .u-site-switcher-btn{background:#F4F3F8 !important;border:1px solid rgba(18,14,30,.08) !important;color:#17131F !important;border-radius:9px}
body.ui-next .u-site-switcher-menu{background:#fff !important;border:1px solid rgba(18,14,30,.1) !important;color:#17131F}
body.ui-next .u-site-switcher-menu a{color:#43405a !important}
body.ui-next .u-live-link{background:rgba(199,247,62,.22) !important;border:1px solid rgba(159,212,0,.45) !important;border-radius:9px}
body.ui-next .u-live-link, body.ui-next .u-live-link *{color:#4a7000 !important}

/* Feature-Shell-Widgets (Toggle/Buttons/Plakette): FeatureShell.php ist für das dunkle Theme
   fest verdrahtet (weißer Schalter-Punkt, halbtransparentes Weiß als Spur/Button-Füllung) —
   auf hellem Grund praktisch unsichtbar bzw. kontrastarm. Aktiver (grüner) Zustand nutzt
   bereits die theme-fähige --u-lime-Variable und bleibt unberührt. */
body.ui-next .u-feat{--u-cta-bg:rgba(18,14,30,.045)}
body.ui-next .u-feat-toggle:not(.is-on){color:#5b5775}
body.ui-next .u-feat-switch{background:rgba(18,14,30,.18)}
body.ui-next .u-feat-knob{box-shadow:0 1px 2px rgba(18,14,30,.35),0 0 0 1px rgba(18,14,30,.10)}
body.ui-next .u-feat-badge{background:rgba(18,14,30,.05);color:#5b5775}
body.ui-next .u-feat-badge.is-on{background:rgba(24,122,66,.12);color:#187A42;border-color:rgba(24,122,66,.35)}
body.ui-next .u-feat-badge.is-on .u-feat-badge-dot{background:#187A42;box-shadow:0 0 0 3px rgba(24,122,66,.18)}

/* alten Seiten-Titel/Breadcrumb ausblenden --------------------------------- */
body.ui-next .u-legacy-head{display:none !important}

/* horizontales Hauptmenü --------------------------------------------------- */
body.ui-next .un-nav{display:block;background:#FBFAFD;border-bottom:1px solid rgba(18,14,30,.07);position:sticky;top:0;z-index:30}
/* Sub-Nav-LEISTE ist IMMER sichtbar und reserviert Platz für zwei Zeilen,
   damit das Layout beim Bucket-Wechsel nicht springt (auch ohne Auswahl).
   Nur die einzelnen Rubrik-Zeilen werden per hidden-Attribut umgeschaltet. */
body.ui-next .un-sub, body.ui-next .un-sub[hidden]{display:flex !important}
body.ui-next .un-sub-row{display:contents !important}
body.ui-next .un-sub-row[hidden]{display:none !important}
body.ui-next .un-nav-inner{max-width:1180px;margin:0 auto;display:flex;align-items:center;flex-wrap:wrap;gap:5px;padding:9px 26px}
body.ui-next .un-angebote{margin-left:auto}
body.ui-next .un-bucket{font:600 14px 'Manrope','Inter',-apple-system,sans-serif;color:#43405a;background:none;border:0;padding:8px 16px;border-radius:9px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:7px;transition:.15s;white-space:nowrap}
body.ui-next .un-bucket:hover{background:rgba(18,14,30,.04)}
body.ui-next .un-bucket.un-active{background:#C7F73E;color:#16180A}
body.ui-next .un-bucket.u-tab-active{background:#C7F73E;color:#16180A}
body.ui-next .un-angebote{color:#C2247E;background:rgba(214,48,138,.07);border:1px solid rgba(214,48,138,.26)}
body.ui-next .un-angebote:hover{background:rgba(214,48,138,.13)}
body.ui-next .un-angebote.u-tab-active{background:#C2247E;color:#fff;border-color:transparent}
body.ui-next .un-badge{font:700 10px 'Space Mono',ui-monospace,monospace;color:#fff;background:#C2247E;padding:1px 7px;border-radius:5px;margin-left:2px}

/* Sub-Navigation (Features einer Rubrik) ----------------------------------- */
/* padding-left/right exakt wie .un-nav-inner (zentriert auf 1180px + 26px Innenabstand),
   damit die Subitems senkrecht bündig unter den Buckets starten.
   align-content:flex-start + min-height = immer 2 Zeilen hoch reserviert. */
body.ui-next .un-sub{flex-wrap:wrap;align-content:flex-start;gap:6px;min-height:96px;border-top:1px solid rgba(18,14,30,.05);background:#fff;padding:11px max(26px, calc((100% - 1180px) / 2 + 26px))}
body.ui-next .un-sub-row{} /* aufgelöst via display:contents → Items fließen direkt in .un-sub */
body.ui-next .un-subitem{font:500 13px 'Manrope','Inter',sans-serif;color:#43405a;background:#F7F6FB;border:1px solid rgba(18,14,30,.05);padding:6px 12px;border-radius:8px;text-decoration:none;cursor:pointer;transition:.15s;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
body.ui-next .un-subitem:hover{background:#EFEDF6}
body.ui-next .un-subitem.u-tab-active{background:#C7F73E;color:#16180A;border-color:transparent}
body.ui-next .un-bucket.un-locked{opacity:.5;color:#8a8499}
body.ui-next .un-bucket.un-locked:hover{opacity:.85;background:rgba(18,14,30,.05)}
body.ui-next .un-bucket .un-lock{font-size:11px}
body.ui-next .un-subitem.un-locked{color:#8a8499;background:#F4F3F8;border-style:dashed;border-color:rgba(18,14,30,.13);cursor:pointer;opacity:.62}
body.ui-next .un-subitem.un-locked:hover{opacity:1;background:#EFEDF6}
body.ui-next .un-subitem.un-locked .un-lock{opacity:1;font-size:11px}
/* Widget-Status-Punkt: grün leuchtend = aktiv, grau = noch nicht eingebaut */
body.ui-next .un-dot{display:inline-block;width:8px;height:8px;border-radius:50%;flex-shrink:0}
body.ui-next .un-dot--on{background:#22c55e;box-shadow:0 0 0 2px rgba(34,197,94,.18),0 0 6px rgba(34,197,94,.7);animation:unDotPulse 2s ease-in-out infinite}
body.ui-next .un-dot--off{background:#c5c2d2;box-shadow:none}
@keyframes unDotPulse{0%,100%{box-shadow:0 0 0 2px rgba(34,197,94,.18),0 0 5px rgba(34,197,94,.55)}50%{box-shadow:0 0 0 2px rgba(34,197,94,.26),0 0 9px rgba(34,197,94,.85)}}

/* Panels: weicher Schatten statt harter dunkler Kanten --------------------- */
body.ui-next .u-tab-panel{color:#17131F}
@media(max-width:760px){
  body.ui-next .un-nav-inner{padding-left:14px;padding-right:14px}
  body.ui-next .un-sub{padding-left:14px;padding-right:14px}
  body.ui-next .u-content{padding:16px 14px 60px}
}

/* Übersicht/neues Design: geringerer Abstand nach oben */
body.ui-next .u-main { padding-top: 5px !important; }

/* Menü dauerhaft offen → Gruppen-Header nicht als aufklappbar zeigen */
body.ui-next .u-side-group-chevron { display: none; }
body.ui-next .u-side-group-head { cursor: default; }
body.ui-next .u-side-group-head:hover { background: none; }

/* Menue IMMER offen (OPcache-sicher, unabhaengig von der is-collapsed-Klasse) */
body.ui-next .u-side-items,
body.ui-next .u-side-group.is-collapsed .u-side-items { max-height: 1500px !important; opacity: 1 !important; margin-top: 0 !important; }
body.ui-next .u-side-group.is-collapsed { padding-bottom: 8px !important; }