
/* 2026-05 final detail polish: fixed Stats+ dropdowns, round-corner clipping, management labels, admin spacing, smoother rocket */
:root {
  --sai-frost: rgba(255,255,255,.78);
  --sai-frost-strong: rgba(255,255,255,.92);
  --sai-quiet-ink: #102033;
  --sai-quiet-muted: #64748b;
  --sai-soft-border: rgba(148,163,184,.24);
  --sai-soft-shadow: 0 22px 65px rgba(15,23,42,.10);
}

/* Saubere Rundungen: keine sichtbaren eckigen Artefakte neben Cards/Buttons */
.portal-card,
.stat-card,
.summary-item,
.team-user-card,
.recommendation-card,
.notification-popover,
.profile-menu,
.modal-content,
.unified-shell,
.unified-sidebar,
.unified-chat-main,
.unified-info-card,
.admin-container .table-wrap,
.admin-table,
.stats-plus-chart-card,
.sai-custom-select__button,
.sai-custom-select__menu,
.auth-card,
.auth-modern-page input,
.auth-modern-page textarea,
.auth-modern-page select,
.auth-modern-page button {
  background-clip: padding-box !important;
  overflow: hidden !important;
}
.portal-card::before,
.portal-card::after,
.stat-card::before,
.stat-card::after,
.summary-item::before,
.summary-item::after,
.nav-pill::before,
.nav-pill::after,
.icon-action-btn::before,
.icon-action-btn::after,
button::before,
button::after {
  pointer-events: none !important;
  border-radius: inherit !important;
}
.portal-card::after,
.stat-card::after,
.summary-item::after,
.nav-pill::after,
.icon-action-btn::after {
  opacity: 0 !important;
  display: none !important;
}
.portal-grid,
.stats-grid,
.cards-grid,
.shared-grid,
.team-user-grid,
.portal-nav,
.icon-toolbar {
  overflow: visible !important;
}

/* Admin: mehr Luft unter Zurück/Aktualisieren und oberem Bereich */
.admin-container .header-row {
  margin-bottom: 22px !important;
  align-items: flex-start !important;
}
.admin-container .header-row .top-actions {
  padding-top: 4px !important;
  gap: 10px !important;
}
.admin-container #statsGrid {
  margin-top: 8px !important;
}

/* Verwaltung: @ ist klar Benutzername, Anzeigename heißt Vor- und Nachname */
.team-user-searchbar {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px 12px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(148,163,184,.24) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.82), rgba(248,250,252,.62)) !important;
  box-shadow: 0 14px 36px rgba(15,23,42,.07) !important;
  overflow: visible !important;
}
.team-user-search-prefix,
.team-user-searchbar > span {
  flex: 0 0 auto !important;
  min-width: max-content !important;
  padding: 8px 10px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, rgba(196,181,253,.25), rgba(125,211,252,.18)) !important;
  color: #334155 !important;
  font-weight: 900 !important;
  font-size: .86rem !important;
  border: 1px solid rgba(148,163,184,.20) !important;
}
.team-user-searchbar input {
  min-width: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #102033 !important;
}
.team-user-card .shared-head strong,
.team-user-card label {
  color: #102033 !important;
}
.team-user-card .subtle {
  color: #64748b !important;
}
.team-user-fields label {
  min-width: 0 !important;
  overflow: visible !important;
}
.team-user-fields input,
.team-user-fields select {
  width: 100% !important;
  min-width: 0 !important;
}

/* Stats+ Dropdowns: sichtbar, modern, robust, mit sauberem Overlay */
.stats-plus-modern-panel,
.stats-plus-chart-card,
.stats-plus-controls-card {
  overflow: visible !important;
}
.stats-plus-controls-card {
  position: relative !important;
  z-index: 30 !important;
  gap: 14px !important;
  align-items: end !important;
}
.stats-plus-modern-panel .modern-select-label {
  overflow: visible !important;
  min-width: min(100%, 240px) !important;
}
.stats-plus-modern-panel select:not(.sai-native-select-hidden) {
  min-height: 52px !important;
  border-radius: 18px !important;
  padding: 0 44px 0 16px !important;
  color: #0f172a !important;
  background:
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(238,246,255,.84)),
    radial-gradient(circle at 15% 10%, rgba(125,211,252,.16), transparent 40%) !important;
  border: 1px solid rgba(148,163,184,.28) !important;
  box-shadow: 0 16px 42px rgba(15,23,42,.09) !important;
}
.stats-plus-modern-panel .sai-custom-select {
  position: relative !important;
  z-index: 35 !important;
  overflow: visible !important;
}
.stats-plus-modern-panel .sai-custom-select.is-open {
  z-index: 999 !important;
}
.stats-plus-modern-panel .sai-custom-select__button {
  min-height: 54px !important;
  border-radius: 19px !important;
  background:
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(241,247,255,.78)),
    radial-gradient(circle at 12% 0%, rgba(125,211,252,.20), transparent 44%),
    radial-gradient(circle at 90% 0%, rgba(196,181,253,.18), transparent 44%) !important;
  border: 1px solid rgba(148,163,184,.28) !important;
  color: #0f172a !important;
  box-shadow: 0 18px 48px rgba(15,23,42,.10), inset 0 1px 0 rgba(255,255,255,.70) !important;
}
.stats-plus-modern-panel .sai-custom-select__value {
  color: #0f172a !important;
  font-weight: 900 !important;
}
.stats-plus-modern-panel .sai-custom-select__chevron {
  color: #475569 !important;
  background: linear-gradient(135deg, rgba(125,211,252,.18), rgba(196,181,253,.16)) !important;
}
.stats-plus-modern-panel .sai-custom-select__menu {
  top: calc(100% + 10px) !important;
  z-index: 1000 !important;
  min-width: max(100%, 280px) !important;
  border-radius: 20px !important;
  padding: 8px !important;
  background: rgba(255,255,255,.98) !important;
  border: 1px solid rgba(148,163,184,.28) !important;
  box-shadow: 0 30px 80px rgba(15,23,42,.22), inset 0 1px 0 rgba(255,255,255,.85) !important;
}
.stats-plus-modern-panel .sai-custom-select__option {
  border-radius: 15px !important;
  min-height: 42px !important;
  padding: 10px 12px !important;
  color: #13233a !important;
  font-weight: 850 !important;
  background: transparent !important;
}
.stats-plus-modern-panel .sai-custom-select__option:hover,
.stats-plus-modern-panel .sai-custom-select__option.is-focused {
  background: linear-gradient(135deg, rgba(125,211,252,.18), rgba(196,181,253,.16)) !important;
}
.stats-plus-modern-panel .sai-custom-select__option.is-selected {
  background: linear-gradient(135deg, rgba(220,252,231,.55), rgba(237,233,254,.48)) !important;
}

/* Auth: Dropdowns und Anzeigen-Knopf gerade und hochwertig */
.auth-modern-page .input-with-action {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  overflow: visible !important;
}
.auth-modern-page .input-with-action input {
  width: 100% !important;
  padding-right: 112px !important;
}
.auth-modern-page .input-with-action button {
  position: absolute !important;
  top: 50% !important;
  right: 9px !important;
  transform: translateY(-50%) !important;
  width: auto !important;
  min-width: 86px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 12px !important;
  border-radius: 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
}
.auth-modern-page .input-with-action button:hover { transform: translateY(-50%) translateY(-1px) !important; }
.auth-modern-page .input-with-action button:active { transform: translateY(-50%) scale(.985) !important; }
.auth-modern-page .sai-custom-select { overflow: visible !important; z-index: 45 !important; }
.auth-modern-page .sai-custom-select.is-open { z-index: 999 !important; }
.auth-modern-page .sai-custom-select__button {
  min-height: 52px !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.075) !important;
  color: #edf6ff !important;
  border: 1px solid rgba(222,236,255,.15) !important;
}
.auth-modern-page .sai-custom-select__menu {
  z-index: 1000 !important;
  background: rgba(8,18,38,.98) !important;
  border-color: rgba(222,236,255,.18) !important;
}
.auth-modern-page .sai-custom-select__option { color: #edf6ff !important; }

/* Lebendigere Rakete: flüssiger Start, mehr Rauch, Feuer und Funken */
.auth-rocket-launch-overlay {
  background:
    radial-gradient(circle at 50% 92%, rgba(251,146,60,.24), transparent 25%),
    radial-gradient(circle at 48% 78%, rgba(125,211,252,.26), transparent 34%),
    radial-gradient(circle at 50% 12%, rgba(196,181,253,.28), transparent 40%),
    linear-gradient(180deg, rgba(2,6,23,.93), rgba(15,23,42,.82)) !important;
  animation: rocketOverlayLong 7s ease forwards !important;
}
.rocket-launch-stage {
  width: 220px !important;
  height: 310px !important;
  bottom: 13vh !important;
  animation: rocketStageLaunchSmooth 6.65s cubic-bezier(.19,.78,.12,1) forwards !important;
  will-change: transform, opacity;
}
.rocket-launch-stage .auth-rocket-icon {
  font-size: clamp(4.8rem, 9vw, 7.4rem) !important;
  animation: rocketLivingShake .72s ease-in-out infinite alternate !important;
  filter: drop-shadow(0 22px 30px rgba(125,211,252,.42)) drop-shadow(0 0 16px rgba(251,146,60,.26)) !important;
}
.rocket-fire-core {
  position: absolute;
  left: 50%;
  bottom: 24px;
  width: 92px;
  height: 118px;
  transform: translateX(-50%);
  border-radius: 48% 48% 56% 56%;
  background:
    radial-gradient(circle at 50% 20%, rgba(255,255,255,.96), rgba(254,240,138,.86) 22%, transparent 38%),
    linear-gradient(180deg, rgba(254,240,138,.90), rgba(251,146,60,.86) 45%, rgba(239,68,68,.72) 72%, transparent);
  filter: blur(.8px) drop-shadow(0 0 44px rgba(251,146,60,.78));
  transform-origin: top center;
  animation: fireCoreDance .32s ease-in-out infinite alternate;
  z-index: 0;
}
.rocket-flame {
  bottom: 34px !important;
  width: 42px !important;
  height: 104px !important;
  animation: flameWildPulse .26s ease-in-out infinite alternate !important;
  z-index: 1;
}
.rocket-smoke {
  width: 130px !important;
  height: 62px !important;
  background:
    radial-gradient(circle at 35% 45%, rgba(255,255,255,.78), transparent 32%),
    radial-gradient(circle at 68% 48%, rgba(226,232,240,.48), transparent 42%),
    radial-gradient(circle, rgba(203,213,225,.38), transparent 70%) !important;
  filter: blur(2px) !important;
  opacity: .78;
  z-index: -1;
}
.smoke-a { animation: smokePuffWideA 1.08s ease-out infinite !important; }
.smoke-b { animation: smokePuffWideB 1.22s ease-out infinite .13s !important; }
.smoke-c { animation: smokePuffWideC 1.36s ease-out infinite .24s !important; }
.smoke-d { animation: smokePuffWideD 1.52s ease-out infinite .34s !important; }
.smoke-e { animation: smokePuffWideE 1.7s ease-out infinite .45s !important; }
.smoke-f { animation: smokePuffWideF 1.86s ease-out infinite .55s !important; }
.rocket-sparks span {
  position: absolute;
  left: 50%;
  bottom: 74px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #fed7aa;
  box-shadow: 0 0 18px rgba(251,146,60,.92);
  opacity: 0;
  animation: sparkFly 1.05s ease-out infinite;
}
.rocket-sparks span:nth-child(1) { --dx: -72px; --dy: 72px; animation-delay: .02s; }
.rocket-sparks span:nth-child(2) { --dx: 66px; --dy: 62px; animation-delay: .15s; }
.rocket-sparks span:nth-child(3) { --dx: -42px; --dy: 106px; animation-delay: .28s; }
.rocket-sparks span:nth-child(4) { --dx: 38px; --dy: 96px; animation-delay: .39s; }
.rocket-sparks span:nth-child(5) { --dx: -92px; --dy: 38px; animation-delay: .52s; }
.rocket-sparks span:nth-child(6) { --dx: 88px; --dy: 44px; animation-delay: .64s; }
.rocket-sparks span:nth-child(7) { --dx: -24px; --dy: 132px; animation-delay: .77s; }
.rocket-sparks span:nth-child(8) { --dx: 22px; --dy: 126px; animation-delay: .88s; }
.auth-modern-page.auth-rocket .auth-form-wrap {
  animation: authFormRocketSmooth 6.1s cubic-bezier(.2,.72,.14,1) forwards !important;
}
@keyframes rocketStageLaunchSmooth {
  0% { transform: translateX(-50%) translateY(42px) scale(.78) rotate(-1deg); opacity: 0; }
  12% { transform: translateX(-50%) translateY(16px) scale(.92) rotate(-1deg); opacity: 1; }
  28% { transform: translateX(-50%) translateY(2px) scale(1.02) rotate(.6deg); opacity: 1; }
  42% { transform: translateX(-50%) translateY(-18vh) scale(1.02) rotate(1.5deg); opacity: 1; }
  68% { transform: translateX(-50%) translateY(-74vh) scale(.88) rotate(5deg); opacity: .98; }
  90% { transform: translateX(-50%) translateY(-122vh) scale(.68) rotate(10deg); opacity: .56; }
  100% { transform: translateX(-50%) translateY(-142vh) scale(.54) rotate(13deg); opacity: 0; }
}
@keyframes rocketLivingShake {
  0% { transform: translateX(-50%) rotate(-10deg) translateY(0); }
  35% { transform: translateX(-50%) rotate(-8deg) translateY(-3px) translateX(-1px); }
  70% { transform: translateX(-50%) rotate(-6deg) translateY(-5px) translateX(1px); }
  100% { transform: translateX(-50%) rotate(-9deg) translateY(-2px); }
}
@keyframes fireCoreDance {
  0% { transform: translateX(-50%) scaleX(.82) scaleY(.88); opacity: .72; }
  100% { transform: translateX(-50%) scaleX(1.12) scaleY(1.16); opacity: 1; }
}
@keyframes flameWildPulse {
  0% { height: 76px; width: 32px; opacity: .78; transform: translateX(-50%) skewX(-4deg); }
  100% { height: 126px; width: 48px; opacity: 1; transform: translateX(-50%) skewX(5deg); }
}
@keyframes smokePuffWideA { 0% { transform: translateX(-50%) scale(.34); opacity: .75; } 100% { transform: translateX(-132%) translateY(44px) scale(2.35); opacity: 0; } }
@keyframes smokePuffWideB { 0% { transform: translateX(-50%) scale(.34); opacity: .70; } 100% { transform: translateX(20%) translateY(48px) scale(2.55); opacity: 0; } }
@keyframes smokePuffWideC { 0% { transform: translateX(-50%) scale(.30); opacity: .65; } 100% { transform: translateX(-76%) translateY(68px) scale(2.85); opacity: 0; } }
@keyframes smokePuffWideD { 0% { transform: translateX(-50%) scale(.28); opacity: .58; } 100% { transform: translateX(70%) translateY(70px) scale(3.1); opacity: 0; } }
@keyframes smokePuffWideE { 0% { transform: translateX(-50%) scale(.28); opacity: .52; } 100% { transform: translateX(-18%) translateY(92px) scale(3.35); opacity: 0; } }
@keyframes smokePuffWideF { 0% { transform: translateX(-50%) scale(.26); opacity: .48; } 100% { transform: translateX(-156%) translateY(88px) scale(3.45); opacity: 0; } }
@keyframes sparkFly { 0% { opacity: 0; transform: translate(0,0) scale(.65); } 16% { opacity: 1; } 100% { opacity: 0; transform: translate(var(--dx), var(--dy)) scale(.15); } }
@keyframes authFormRocketSmooth {
  0% { transform: translateY(0) scale(1) rotate(0); opacity: 1; }
  22% { transform: translateY(-8px) scale(.995) rotate(-.4deg); opacity: .96; }
  42% { transform: translateY(-25vh) scale(.94) rotate(-3deg); opacity: .76; }
  72% { transform: translateY(-84vh) scale(.80) rotate(-9deg); opacity: .36; }
  100% { transform: translateY(-132vh) scale(.68) rotate(-14deg); opacity: 0; }
}

@media (max-width: 720px) {
  .team-user-searchbar { align-items: stretch !important; flex-direction: column !important; }
  .team-user-search-prefix,
  .team-user-searchbar > span { width: fit-content !important; }
  .stats-plus-modern-panel .sai-custom-select__menu { min-width: 100% !important; }
}
