/* Teamübersicht: Monatswerte zuerst, Bestandswerte und Details klar getrennt. */
#uebersicht { background: #f8fafc; padding: 24px; }
#uebersicht .ue3-kopf { align-items: center; gap: 20px; }
#uebersicht .ue3-kopf h1 { font-size: 25px; line-height: 1.2; font-weight: 700; letter-spacing: -.025em; }
#uebersicht .ue3-subtitel { margin: 6px 0 0; font-size: 13px; color: #64748b; }
#uebersicht .ue3-monat { display: grid; gap: 4px; margin-left: auto; }
#uebersicht .ue3-monat > span { font-size: 11px; font-weight: 600; color: #64748b; }
#uebersicht .ue3-kopf .ue2-live { margin-left: 0; align-self: flex-end; padding-bottom: 9px; }
#uebersicht .ue3-basis { margin: 16px 0 0; padding: 10px 12px; border-left: 3px solid #cbd5e1; background: #fff; border-radius: 0 7px 7px 0; font-size: 12px; }
#uebersicht .ue3-kacheln { margin: 16px 0 22px; gap: 10px; grid-template-columns: minmax(270px, 1.65fr) repeat(3, minmax(155px, 1fr)); }
#uebersicht .ue3-kacheln .ue2-kachel { background: #fff; padding: 17px 16px; gap: 7px; }
#uebersicht .ue3-kacheln .ue2-kachel.gross { background: #f2f7ff; border-color: #c8daef; }
#uebersicht .ue3-kacheln .ue2-kachel.vorlaeufig { background: #fffbf3; border-color: #e0b35c; }
#uebersicht .ue3-kacheln .ue2-k-titel { font-size: 11px; letter-spacing: .035em; }
#uebersicht .ue3-kacheln .ue2-kachel small { font-size: 12px; line-height: 1.45; }
#uebersicht .ue3-kacheln .ue2-kachel strong { font-size: 24px; }
#uebersicht .ue3-kacheln .ue2-kachel.gross strong { font-size: 30px; }
#uebersicht .ue3-rangliste, #uebersicht .ue3-bestand { background: #fff; padding: 18px; margin: 0 0 16px; }
#uebersicht .ue3-rangliste .ue2-matrix-kopf { align-items: center; gap: 12px; }
#uebersicht .ue3-rangliste .ue2-summe { margin: 5px 0 0; }
#uebersicht .ue3-sort { height: 34px; max-width: 200px; padding: 0 28px 0 9px; color: #334155; font: inherit; background: #fff; border: 1px solid #cbd5e1; border-radius: 7px; }
#uebersicht .ue3-rang { min-width: 610px; }
#uebersicht .ue3-rang th { padding-top: 12px; padding-bottom: 10px; }
#uebersicht .ue3-rang td { padding-top: 12px; padding-bottom: 12px; }
#uebersicht .ue3-rang .ue2-name { flex-wrap: wrap; }
#uebersicht .ue3-rang .ue2-mini { height: 3px; max-width: 190px; }
#uebersicht .ue3-person-bestand { display: block; margin-top: 4px; font-size: 11px; color: #64748b; }
#uebersicht .ue3-sort-th { border: 0; background: transparent; color: inherit; font: inherit; font-weight: 600; padding: 0; cursor: pointer; white-space: nowrap; }
#uebersicht .ue3-sort-th:hover { color: #1d4ed8; text-decoration: underline; }
#uebersicht .ue3-vertragsteile { margin-top: 5px; font-size: 11px; color: #64748b; white-space: nowrap; }
#uebersicht .ue3-teil { border: 0; background: transparent; color: inherit; font: inherit; padding: 0; cursor: pointer; }
#uebersicht .ue3-teil:hover, #uebersicht .ue3-teil.aktiv { color: #1d4ed8; text-decoration: underline; text-underline-offset: 2px; }
#uebersicht .ue3-teil.aktiv { font-weight: 700; }
#uebersicht .ue3-zeitraum { color: #64748b; font-size: 11.5px; }
#uebersicht .ue3-bestandszahlen { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 18px; gap: 12px; }
#uebersicht .ue3-bestandszahlen > div { display: grid; align-content: start; gap: 4px; padding-left: 14px; border-left: 2px solid #e2e8f0; }
#uebersicht .ue3-bestandszahlen span, #uebersicht .ue3-bestandszahlen small { font-size: 12px; color: #64748b; }
#uebersicht .ue3-bestandszahlen strong { font-size: 22px; color: #0f172a; }
#uebersicht .ue3-quoten { display: flex; flex-wrap: wrap; gap: 7px 22px; margin-top: 16px; padding-top: 12px; border-top: 1px solid #eef2f6; font-size: 12px; color: #64748b; }
#uebersicht .ue3-quoten b { color: #334155; }
#uebersicht .ue3-details { margin: 10px 0 0; border: 1px solid #e2e8f0; border-radius: 10px; background: #fff; overflow: hidden; }
#uebersicht .ue3-details > summary { padding: 15px 18px; display: flex; align-items: center; gap: 12px; cursor: pointer; list-style: none; }
#uebersicht .ue3-details > summary::-webkit-details-marker { display: none; }
#uebersicht .ue3-details > summary::after { content: '+'; margin-left: auto; color: #64748b; font-size: 22px; font-weight: 400; }
#uebersicht .ue3-details[open] > summary::after { content: '−'; }
#uebersicht .ue3-details > summary:hover { background: #f8fafc; }
#uebersicht .ue3-details > summary span { display: grid; gap: 4px; }
#uebersicht .ue3-details > summary b { font-size: 14px; color: #334155; }
#uebersicht .ue3-details > summary small { font-size: 12px; color: #64748b; font-weight: 400; }
#uebersicht .ue3-details-inhalt { padding: 0 18px 18px; border-top: 1px solid #eef2f6; }
#uebersicht .ue3-details-inhalt > .ue2-matrix-karte { margin-top: 16px; }
#uebersicht .ue3-details-inhalt .ue2-sparten { margin-top: 16px; }
#uebersicht .ue3-regeln { padding-top: 10px; color: #475569; font-size: 12.5px; line-height: 1.55; max-width: 1050px; }
#uebersicht .ue3-regeln table { width: 100%; border-collapse: collapse; }
#uebersicht .ue3-regeln td { padding: 7px 10px 7px 0; border-bottom: 1px solid #eef2f6; }
#uebersicht .ue3-regeln td:last-child { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
#uebersicht .ue3-regeln p { margin: 10px 0 0; }
@media (max-width: 1150px) {
  #uebersicht .ue3-kacheln { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  #uebersicht { margin: 10px 10px 18px; padding: 16px; }
  #uebersicht .ue3-kopf { gap: 14px; }
  #uebersicht .ue3-monat { margin-left: 0; }
  #uebersicht .ue3-kopf .ue2-live { margin-left: auto; }
  #uebersicht .ue3-rangliste, #uebersicht .ue3-bestand { padding: 14px; }
  #uebersicht .ue3-bestandszahlen { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 18px; }
}
@media (max-width: 520px) {
  #uebersicht .ue3-kacheln { grid-template-columns: 1fr; }
  #uebersicht .ue3-kopf .ue2-live { width: 100%; margin: 0; padding: 0; }
  #uebersicht .ue3-rangliste .ue2-sortwahl { width: 100%; justify-content: space-between; }
}

/* Mitarbeiterzeilen einzeilig (Thomas 24.10.2026: „7. ok“) – Lead-Bestand und Vertragsteile neben dem Wert statt darunter, ohne Mini-Balken */
#uebersicht .ue3-rang td { padding-top: 7px; padding-bottom: 7px; vertical-align: middle; }
#uebersicht .ue3-rang td:nth-child(2) { white-space: nowrap; }
#uebersicht .ue3-rang .ue2-name { display: inline-flex; flex-wrap: nowrap; }
#uebersicht .ue3-person-bestand { display: inline; margin: 0 0 0 10px; }
#uebersicht .ue3-rang .ue2-mini { display: none; }
#uebersicht .ue3-vertragsteile { display: inline; margin: 0 0 0 8px; }