/* ScheduleAI final stability layer: bewusst zuletzt laden. Ziel: ruhig, modern, lesbar, klickbar. */
:root {
  --sai-bg: #07111f;
  --sai-card: rgba(255, 255, 255, .088);
  --sai-card-strong: rgba(255, 255, 255, .13);
  --sai-card-solid: #101b2d;
  --sai-border: rgba(255, 255, 255, .16);
  --sai-border-soft: rgba(255, 255, 255, .10);
  --sai-text: #f5f8ff;
  --sai-muted: rgba(235, 243, 255, .72);
  --sai-muted-strong: rgba(245, 248, 255, .86);
  --sai-accent: #8b5cf6;
  --sai-accent-2: #22c55e;
  --sai-accent-3: #38bdf8;
  --sai-danger: #fb7185;
  --sai-warning: #fbbf24;
  --sai-shadow: 0 20px 70px rgba(0, 0, 0, .34);
  --sai-radius-xl: 28px;
  --sai-radius-lg: 22px;
  --sai-radius-md: 16px;
}

html, body { min-height: 100%; }
body {
  color: var(--sai-text) !important;
  background:
    radial-gradient(circle at 16% 8%, rgba(139, 92, 246, .20), transparent 34%),
    radial-gradient(circle at 86% 18%, rgba(34, 197, 94, .14), transparent 34%),
    linear-gradient(135deg, #06101d 0%, #0b1729 48%, #0a1220 100%) !important;
}

/* Keine unsichtbaren Deko-Layer dürfen Klicks blockieren. */
body::before, body::after,
.portal-card::before, .portal-card::after,
.module-card::before, .module-card::after,
.dashboard-card::before, .dashboard-card::after,
.stat-card::before, .stat-card::after,
.auth-card::before, .auth-card::after,
.nav-pill::before, .nav-pill::after,
button::before, button::after {
  pointer-events: none !important;
}
.portal-card::before, .portal-card::after,
.module-card::before, .module-card::after,
.dashboard-card::before, .dashboard-card::after,
.stat-card::before, .stat-card::after {
  opacity: 0 !important;
  display: none !important;
}

.container, .admin-container, .auth-shell { position: relative; z-index: 1; }
.portal-header, .header-row, .portal-nav, .admin-tabs,
.portal-card, .module-card, .dashboard-card, .stat-card,
.modal-content, .auth-card, .table-wrap, .shared-card, .team-user-card,
.unified-comm, .unified-main, .unified-sidebar, .unified-info-section,
.recommendation-card, .recommendation-category-card,
.files-browser-shell, .files-action-sheet-card {
  border-radius: var(--sai-radius-xl) !important;
  border: 1px solid var(--sai-border) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,255,255,.055)) !important;
  box-shadow: var(--sai-shadow) !important;
  backdrop-filter: blur(18px) saturate(1.24) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.24) !important;
  background-clip: padding-box !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

.portal-header, .header-row, .portal-nav, .admin-tabs {
  overflow: visible !important;
  box-shadow: 0 16px 60px rgba(0,0,0,.24) !important;
}
.portal-title, h1, h2, h3, h4, strong { color: var(--sai-text) !important; }
.subtle, .muted, small, .stat-label { color: var(--sai-muted) !important; }

button, .button-link, .nav-pill, .tab-btn,
.secondary-btn, .dark-btn, .success-btn, .danger-btn, .warning-btn,
input, select, textarea {
  border-radius: var(--sai-radius-md) !important;
  max-width: 100%;
}
button, .button-link, .nav-pill, .tab-btn,
.secondary-btn, .dark-btn, .success-btn, .danger-btn, .warning-btn {
  min-height: 42px;
  background: rgba(255,255,255,.10) !important;
  color: var(--sai-text) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.16) !important;
  transform: translateZ(0);
  transition: transform .16s ease, background .16s ease, border-color .16s ease, box-shadow .16s ease !important;
}
button:hover, .button-link:hover, .nav-pill:hover, .tab-btn:hover,
.secondary-btn:hover, .dark-btn:hover, .success-btn:hover, .danger-btn:hover, .warning-btn:hover {
  background: rgba(255,255,255,.15) !important;
  border-color: rgba(255,255,255,.25) !important;
  transform: translateY(-1px) !important;
}
button:active, .button-link:active, .nav-pill:active, .tab-btn:active,
.secondary-btn:active, .dark-btn:active, .success-btn:active, .danger-btn:active, .warning-btn:active {
  transform: translateY(0) scale(.992) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.18) !important;
}
.success-btn, button#loginBtn, button#regBtn, .upload-primary-btn {
  background: linear-gradient(135deg, rgba(139,92,246,.86), rgba(34,197,94,.72)) !important;
  color: #fff !important;
  border-color: rgba(255,255,255,.26) !important;
}
.danger-btn, .danger-menu-item { background: rgba(251,113,133,.16) !important; border-color: rgba(251,113,133,.32) !important; }
.warning-btn { background: rgba(251,191,36,.14) !important; border-color: rgba(251,191,36,.32) !important; }

input, select, textarea {
  color: var(--sai-text) !important;
  background: rgba(5, 12, 25, .52) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  outline: none !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 10px 30px rgba(0,0,0,.10) !important;
}
input::placeholder, textarea::placeholder { color: rgba(235,243,255,.55) !important; }
input:focus, select:focus, textarea:focus {
  border-color: rgba(139,92,246,.78) !important;
  box-shadow: 0 0 0 4px rgba(139,92,246,.16), inset 0 1px 0 rgba(255,255,255,.06) !important;
}
select option { color: #111827 !important; background: #fff !important; }

/* Header-Icons wieder kompakt, nicht gestreckt und nicht überlappend. */
.portal-actions.icon-toolbar, .icon-toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  overflow: visible !important;
}
.header-widget, .notification-widget, .profile-widget, .settings-widget {
  position: relative !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  flex: 0 0 auto !important;
  overflow: visible !important;
  z-index: 90 !important;
}
.icon-action-btn, .notification-bell-btn, .profile-btn, .settings-btn, .admin-icon-btn {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  max-width: 44px !important;
  padding: 0 !important;
  display: inline-grid !important;
  place-items: center !important;
  border-radius: 16px !important;
  font-size: 1.08rem !important;
  line-height: 1 !important;
  background: linear-gradient(145deg, rgba(255,255,255,.16), rgba(255,255,255,.07)) !important;
  color: var(--sai-text) !important;
  box-shadow: 0 12px 36px rgba(0,0,0,.24) !important;
}
.notification-bell-btn { background: linear-gradient(145deg, rgba(251,191,36,.32), rgba(139,92,246,.12)) !important; }
.profile-btn { background: linear-gradient(145deg, rgba(56,189,248,.22), rgba(139,92,246,.10)) !important; }
.settings-btn { background: linear-gradient(145deg, rgba(255,255,255,.15), rgba(255,255,255,.055)) !important; }
.header-popover, .notification-popover, .profile-popover, .settings-popover {
  position: absolute !important;
  top: calc(100% + 12px) !important;
  right: 0 !important;
  z-index: 100000 !important;
  min-width: min(420px, calc(100vw - 28px)) !important;
  max-width: min(460px, calc(100vw - 28px)) !important;
  width: max-content !important;
  background: rgba(9, 17, 32, .96) !important;
  color: var(--sai-text) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 24px !important;
  overflow: hidden !important;
}
.header-popover[hidden], .notification-popover[hidden], .profile-popover[hidden], .settings-popover[hidden] { display: none !important; }
.notification-popover-head, .profile-popover-head { background: rgba(255,255,255,.06) !important; }
.notification-popover .notification-item, .notification-popover .summary-item, .notification-popover .empty-state,
.profile-popover .profile-data-row, .profile-card-mini {
  background: rgba(255,255,255,.07) !important;
  border-color: rgba(255,255,255,.13) !important;
  color: var(--sai-text) !important;
}

/* Auth-Seiten */
.auth-modern-page .auth-card {
  background: linear-gradient(145deg, rgba(255,255,255,.14), rgba(255,255,255,.06)) !important;
}
.auth-modern-page .auth-copy, .auth-modern-page .auth-subtle { max-width: 38ch; }
.input-with-action {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  background: rgba(5,12,25,.50) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 18px !important;
  padding: 6px !important;
}
.input-with-action input { border: 0 !important; background: transparent !important; box-shadow: none !important; min-height: 42px !important; }
.input-with-action button { min-height: 38px !important; height: 38px !important; padding: 0 12px !important; white-space: nowrap !important; }

/* Moderne Custom-Selects */
.sai-native-select-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.sai-custom-select {
  position: relative !important;
  z-index: 5 !important;
  width: 100% !important;
  overflow: visible !important;
}
.sai-custom-select__button {
  width: 100% !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  min-height: 48px !important;
  padding: 0 14px !important;
  text-align: left !important;
  background: rgba(5,12,25,.54) !important;
}
.sai-custom-select__value { color: var(--sai-text) !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sai-custom-select__chevron { color: var(--sai-muted-strong) !important; transition: transform .16s ease; }
.sai-custom-select.is-open .sai-custom-select__chevron { transform: rotate(180deg); }
.sai-custom-select__menu {
  display: none;
  position: absolute !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  right: 0 !important;
  max-height: 260px !important;
  overflow: auto !important;
  padding: 8px !important;
  background: rgba(9, 17, 32, .98) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 18px !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.45) !important;
  z-index: 100500 !important;
}
.sai-custom-select.is-open { z-index: 100400 !important; }
.sai-custom-select.is-open .sai-custom-select__menu { display: grid !important; gap: 4px; animation: saiMenuIn .15s ease both; }
.sai-custom-select__option {
  justify-content: flex-start !important;
  min-height: 38px !important;
  padding: 9px 10px !important;
  background: transparent !important;
  box-shadow: none !important;
  border-color: transparent !important;
}
.sai-custom-select__option:hover, .sai-custom-select__option.is-selected { background: rgba(139,92,246,.18) !important; }
@keyframes saiMenuIn { from { opacity: 0; transform: translateY(-4px) scale(.99); } to { opacity: 1; transform: translateY(0) scale(1); } }

/* Statistiken+ */
.stats-plus-modern-panel select.sai-stable-native-select { display: none !important; }
.stats-plus-modern-panel .sai-custom-select { min-width: 200px; }
.stats-plus-modern-panel .stats-plus-controls, .stats-plus-modern-panel .admin-grid { overflow: visible !important; }
.stats-plus-chart, .stats-line-chart, #statsPlusChart { color: var(--sai-text) !important; }
.stats-axis-label, .stats-y-axis, .stats-y-label, .stats-plus-axis, .chart-axis { color: var(--sai-muted-strong) !important; opacity: 1 !important; }

/* Kommunikation: ruhig, lesbar, kein hartes Blau. */
#communicationPanel, #saiCommunicationPanel, .unified-comm {
  color: var(--sai-text) !important;
}
.unified-sidebar, .unified-main, .unified-main-head, .unified-head,
.sai-chat-shell, .sai-chat-sidebar, .sai-chat-main, .sai-chat-head {
  background: linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.045)) !important;
  border-color: rgba(255,255,255,.13) !important;
}
.unified-entry, .sai-chat-thread, .chat-thread {
  background: rgba(255,255,255,.065) !important;
  color: var(--sai-text) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
}
.unified-entry.active, .sai-chat-thread.active, .chat-thread.active {
  background: linear-gradient(135deg, rgba(139,92,246,.18), rgba(34,197,94,.10)) !important;
  border-color: rgba(139,92,246,.28) !important;
}
.unified-entry strong, .sai-chat-thread strong, .chat-thread strong,
#unifiedTitle, #saiChatTitle, #unifiedInfoTitle, #sai2GroupInfoModal h3,
.unified-profile-link, .unified-member-card strong, .unified-info-hero h2, .unified-info-hero h3 {
  color: var(--sai-text) !important;
  background: transparent !important;
  -webkit-text-fill-color: currentColor !important;
}
.unified-profile-link { border: 0 !important; box-shadow: none !important; min-height: auto !important; padding: 0 !important; text-decoration: none !important; }
.unified-message, .sai-chat-message {
  color: var(--sai-text) !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  box-shadow: 0 12px 32px rgba(0,0,0,.18) !important;
}
.unified-message.mine, .sai-chat-message.mine {
  background: linear-gradient(135deg, rgba(34,197,94,.22), rgba(139,92,246,.13)) !important;
}
.unified-message.theirs, .sai-chat-message.theirs {
  background: linear-gradient(135deg, rgba(255,255,255,.12), rgba(139,92,246,.10)) !important;
}
.unified-message small, .sai-chat-message small { color: rgba(245,248,255,.74) !important; }
.unified-message-avatar, .unified-avatar, .sai2-avatar {
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.18) !important;
}
.unified-info-topbar {
  background: rgba(255,255,255,.07) !important;
  border-color: rgba(255,255,255,.12) !important;
}
.unified-info-section, .unified-member-card, .unified-info-list-item {
  background: rgba(255,255,255,.07) !important;
  color: var(--sai-text) !important;
  border-color: rgba(255,255,255,.13) !important;
}
.unified-info-section * { color: inherit; }
.unified-info-section small, .unified-member-card small { color: var(--sai-muted) !important; }

/* Verwaltung und Empfehlungen: lesbar */
.team-management-panel, .team-users-card, .team-user-card, .shared-head,
#teamUsersBox, #teamPendingBox, .recommendation-card, .recommendation-edit-modal .modal-content {
  color: var(--sai-text) !important;
}
.team-user-card input, .team-user-card select,
.recommendation-card input, .recommendation-card select, .recommendation-card textarea {
  color: var(--sai-text) !important;
}
.team-user-searchbar { background: rgba(5,12,25,.48) !important; border-color: rgba(255,255,255,.16) !important; border-radius: 18px !important; }
.team-user-search-prefix { color: var(--sai-muted-strong) !important; }
.recommendation-card, .recommendation-category-card { background: rgba(12, 22, 39, .92) !important; }

/* Tabellen */
.admin-table, table { color: var(--sai-text) !important; }
.admin-table th, .admin-table td { color: var(--sai-text) !important; border-color: rgba(255,255,255,.10) !important; }
.admin-table th { background: rgba(255,255,255,.08) !important; }
.admin-table tr:hover td { background: rgba(255,255,255,.045) !important; }

/* Auth-Rakete: flüssiger, aber nicht blockierend nach Ende. */
.auth-rocket-overlay { pointer-events: none !important; }
.auth-rocket-icon { animation-timing-function: cubic-bezier(.24,.8,.22,1) !important; }
.rocket-smoke { filter: blur(10px); }

@media (max-width: 720px) {
  .portal-header, .header-row { align-items: stretch !important; }
  .portal-actions.icon-toolbar, .icon-toolbar { justify-content: flex-start !important; }
  .header-popover, .notification-popover, .profile-popover, .settings-popover {
    left: 0 !important; right: auto !important; width: calc(100vw - 28px) !important;
  }
}
/* Korrigiert die vorherige Notfall-CSS-Schicht, die Custom-Dropdowns ausgeblendet hat. */
.auth-modern-page .sai-custom-select,
.stats-plus-modern-panel .sai-custom-select {
  display: block !important;
}
.auth-modern-page select.sai-native-select-hidden,
.stats-plus-modern-panel select.sai-native-select-hidden,
select.sai-native-select-hidden {
  display: block !important;
  position: absolute !important;
  width: 1px !important;
  min-width: 1px !important;
  max-width: 1px !important;
  height: 1px !important;
  min-height: 1px !important;
  max-height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  overflow: hidden !important;
}

/* === ScheduleAI Stability Hotfix 2026-05-08: Interaktion & native Dropdowns === */
button,
.nav-pill,
.tab-btn,
.button-link,
.icon-action-btn,
.overhaul-shortcut,
[role="button"] {
  pointer-events: auto !important;
  cursor: pointer !important;
}

.portal-nav,
.portal-nav * {
  pointer-events: auto !important;
}

.auth-modern-page select,
.auth-modern-page select.sai-native-select-hidden,
.auth-modern-page select.sai-stable-native-select,
.stats-plus-modern-panel select,
.stats-plus-modern-panel select.sai-native-select-hidden,
.stats-plus-modern-panel select.sai-stable-native-select {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 48px !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 12px 14px !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  clip: auto !important;
  clip-path: none !important;
  overflow: visible !important;
  -webkit-appearance: menulist !important;
  appearance: auto !important;
}

.auth-modern-page .sai-custom-select,
.stats-plus-modern-panel .sai-custom-select {
  display: none !important;
  pointer-events: none !important;
}

.header-popover[hidden],
.notification-popover[hidden],
.profile-popover[hidden],
.settings-popover[hidden],
.files-action-menu[hidden],
.files-action-sheet[hidden],
.files-action-pane[hidden],
.modal.hidden {
  display: none !important;
  pointer-events: none !important;
}

.auth-rocket-overlay:not(.auth-rocket-launch-overlay),
.auth-rocket-overlay[hidden] {
  display: none !important;
  pointer-events: none !important;
}

body,
.container,
#dashboard,
.panel.active {
  pointer-events: auto !important;
}