:root {
  --color-primary: #2c5282;
  --color-primary-light: #4a86e8;
  --color-primary-dark: #1e3a5f;
  --color-accent: #facc15;
  --color-accent-hover: #eab308;
  --color-on-accent: #1e3a5f;
  --color-text: #1f2937;
  --color-muted: #718096;
  --color-border: #e2e8f0;
  --color-bg: #f8fafc;
  --color-surface: #ffffff;
}

body {
  background: var(--color-bg);
  color: var(--color-text);
}

#login-screen {
  background: linear-gradient(135deg, var(--color-primary-dark) 0%, var(--color-primary) 60%, var(--color-primary-light) 100%) !important;
}

#login-screen .max-w-md {
  border: 1px solid var(--color-border);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(30, 58, 95, 0.16);
}

#app > div,
#app main {
  background: var(--color-bg) !important;
}

#header {
  background: var(--color-primary) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
}

#header h2,
#header button,
#header svg {
  color: #ffffff !important;
}

#sidebar {
  background: linear-gradient(180deg, var(--color-primary-dark) 0%, var(--color-primary) 100%) !important;
  border-right: 1px solid rgba(255, 255, 255, 0.12);
}

.sidebar-link {
  color: rgba(255, 255, 255, 0.88) !important;
}

.sidebar-link:hover {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
}

.sidebar-link.bg-blue-100 {
  background: rgba(250, 204, 21, 0.22) !important;
  color: #ffffff !important;
  border-left: 3px solid var(--color-accent) !important;
  box-shadow: inset 0 0 0 1px rgba(250, 204, 21, 0.35);
}

#sidebar hr {
  border-color: rgba(255, 255, 255, 0.2) !important;
}

#sidebar button {
  color: rgba(255, 255, 255, 0.88) !important;
}

.sidebar-logo {
  display: block;
  height: 64px;
  width: auto;
}

.btn-primary {
  background-color: var(--color-primary) !important;
  color: #fff !important;
}

.btn-primary:hover {
  background-color: var(--color-primary-dark) !important;
}

.btn-secondary {
  background-color: #e5e7eb !important;
  color: #374151 !important;
}

.input:focus {
  outline: none;
  border-color: var(--color-primary-light) !important;
  box-shadow: 0 0 0 3px rgba(74, 134, 232, 0.18) !important;
}

.loader {
  border-color: var(--color-primary) !important;
  border-top-color: transparent !important;
}

/* Konten-Filter: Select + Suche einheitlich */
.prop-tx-filter {
  font-size: 0.875rem;
  line-height: 1.25rem;
  border-radius: 0.5rem;
  border: 1px solid #d1d5db;
  background-color: #ffffff;
  color: #111827;
  padding: 0.25rem 0.75rem;
  min-height: 2rem;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.prop-tx-filter:focus {
  outline: none;
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.22);
}
.dark .prop-tx-filter {
  border-color: #4b5563;
  background-color: #374151;
  color: #f3f4f6;
}
.dark .prop-tx-filter:focus {
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.28);
}
.prop-tx-filter-search {
  width: 11rem;
}
#prop-tx-year {
  min-width: 6.5rem;
}
#prop-tx-status {
  min-width: 8.5rem;
}

/* Toast-Benachrichtigungen */
#notification-container .immowo-toast {
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.4;
  box-shadow: 0 10px 28px rgba(30, 58, 95, 0.16);
}

#notification-container .immowo-toast--success {
  background: var(--color-accent);
  color: var(--color-on-accent);
  border: 1px solid var(--color-accent-hover);
}

#notification-container .immowo-toast--error {
  background: #dc2626;
  color: #ffffff;
  border: 1px solid #b91c1c;
}

#notification-container .immowo-toast--warning {
  background: #fffbeb;
  color: #92400e;
  border: 1px solid #fcd34d;
}

#notification-container .immowo-toast--info {
  background: var(--color-primary);
  color: #ffffff;
  border: 1px solid var(--color-primary-dark);
}