/* Raadswerk UX Consistency Layer
   Doel: rust, scanbaarheid en gemeentelijke betrouwbaarheid zonder bestaande logica te wijzigen. */
:root {
  --rw-primary: #1E3A5F;
  --rw-primary-light: #2F5D8A;
  --rw-accent: #2DA44E;
  --rw-bg: #F7F9FB;
  --rw-card: #FFFFFF;
  --rw-border: #E3E8EF;
  --rw-text: #1F2A37;
  --rw-muted: #6B7280;
  --rw-success: #2DA44E;
  --rw-warning: #F59E0B;
  --rw-danger: #DC2626;
  --rw-neutral: #6B7280;
  --rw-radius: 14px;
  --rw-shadow-sm: 0 6px 18px rgba(30, 58, 95, .07);
  --rw-shadow-md: 0 14px 34px rgba(30, 58, 95, .10);
}

html { scroll-behavior: smooth; }
body {
  background: var(--rw-bg) !important;
  color: var(--rw-text) !important;
}

/* Centrale leesbreedte en rust */
.portal-content,
.results-column,
.main-content,
.page-content,
.raadswerk-page,
.dashboard-container {
  color: var(--rw-text);
}

/* Topgebieden compacter en rustiger */
.portal-header {
  background: #fff !important;
  border-bottom: 1px solid var(--rw-border) !important;
  color: var(--rw-text) !important;
}
.portal-header h1,
.portal-header h2,
.page-title,
.module-title {
  color: var(--rw-primary) !important;
  letter-spacing: -0.02em;
}

/* Algemene kaartlaag */
.card,
.stat-card,
.feature-card,
.analyst-flow-step,
.persona-panel-shell,
.persona-panel-card,
.dossier-card,
.module-card,
.result-card,
.news-card,
.meeting-card,
.archive-card,
.strategy-card,
.monitor-card,
[class*="card"] {
  border-color: var(--rw-border) !important;
}

.card,
.ds-card,
.stat-card,
.feature-card,
.analyst-flow-step,
.persona-panel-shell,
.result-card,
.module-card,
.meeting-card,
.monitor-card,
.archive-card,
.strategy-card,
.news-card {
  background: var(--rw-card) !important;
  border: 1px solid var(--rw-border) !important;
  border-radius: var(--rw-radius) !important;
  box-shadow: var(--rw-shadow-sm) !important;
}

.card:hover,
.ds-card:hover,
.feature-card:hover,
.result-card:hover,
.module-card:hover,
.meeting-card:hover,
.monitor-card:hover,
.archive-card:hover,
.strategy-card:hover,
.news-card:hover {
  border-color: rgba(47,93,138,.45) !important;
  box-shadow: var(--rw-shadow-md) !important;
}

/* Buttons: herkenbaar, maar niet schreeuwerig */
button,
a.button,
.btn,
.ds-btn,
.nav-link,
.persona-btn {
  transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.btn-primary,
.ds-btn-primary,
button.primary,
button[type="submit"] {
  background: var(--rw-primary) !important;
  border-color: var(--rw-primary) !important;
  color: #fff !important;
}

.btn-accent,
.ds-btn-accent,
.btn-start-analyse,
.start-analysis-btn,
.cta-primary {
  background: var(--rw-accent) !important;
  border-color: var(--rw-accent) !important;
  color: #fff !important;
}

.btn-ghost,
.ds-btn-ghost,
.btn-uitleg,
.secondary-action,
.ghost-button {
  background: #fff !important;
  border: 1px solid var(--rw-border) !important;
  color: var(--rw-primary) !important;
}

button:hover,
a.button:hover,
.btn:hover,
.ds-btn:hover,
.btn-start-analyse:hover,
.btn-uitleg:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(30,58,95,.10) !important;
}

/* Toegankelijkheid: altijd focus zichtbaar */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid rgba(47, 93, 138, .35) !important;
  outline-offset: 2px !important;
}

/* Badges en statuskleur: kleur = betekenis */
.badge,
.ds-badge,
.status-badge,
[class*="badge"] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 999px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}
.badge-success,
.status-success,
.status-aangenomen,
.status-afgedaan {
  background: #E6F4EA !important;
  color: #1F7A3A !important;
  border-color: #BFE7CA !important;
}
.badge-warning,
.status-warning,
.status-lopend,
.status-in-behandeling,
.status-aangehouden,
.status-uitstel {
  background: #FFF4E5 !important;
  color: #9A5B00 !important;
  border-color: #FAD7A0 !important;
}
.badge-danger,
.status-danger,
.status-verworpen,
.status-probleem {
  background: #FEE2E2 !important;
  color: #B91C1C !important;
  border-color: #FECACA !important;
}
.badge-neutral,
.status-neutral,
.status-overig,
.status-onbekend {
  background: #F3F4F6 !important;
  color: #4B5563 !important;
  border-color: #E5E7EB !important;
}

/* Rood alleen voor echte fouten: informatieve rode vlakken neutraliseren */
.info-card,
.help-card,
.persona-guide-banner,
.persona-panel-shell {
  background: #fff !important;
  color: var(--rw-text) !important;
}

/* Analist compact startgebied */
body.analist-mode .portal-header {
  padding: 42px 7% 14px 7% !important;
  border-radius: 0 0 24px 24px !important;
  box-shadow: 0 18px 44px rgba(30,58,95,.10) !important;
}
body.analist-mode .results-column {
  padding-top: 18px !important;
}
.compact-hero-card {
  padding: 18px 20px !important;
  gap: 18px !important;
  margin-bottom: 10px !important;
}
.compact-hero-title {
  font-size: clamp(1.35rem, 2vw, 1.75rem) !important;
  margin-bottom: 5px !important;
}
.compact-hero-subtitle {
  font-size: 1rem !important;
  margin-bottom: 6px !important;
}
.compact-hero-text {
  font-size: .9rem !important;
  max-width: 720px;
}
.compact-hero-stats {
  gap: 6px !important;
}
.compact-stat-row {
  padding: 7px 10px !important;
  background: var(--rw-bg) !important;
}
.feature-cards-row {
  gap: 10px !important;
  margin-bottom: 12px !important;
}
.feature-card {
  padding: 9px 12px !important;
  min-height: 0 !important;
}
.feature-card-content h3 { color: var(--rw-primary) !important; }
.feature-card-content p { color: var(--rw-muted) !important; }
.analyst-flow-step {
  padding: 13px 15px !important;
  margin-bottom: 12px !important;
}
.persona-panel-shell {
  padding: 12px 14px !important;
  border-radius: 16px !important;
}
.persona-panel-card {
  padding: 11px 12px !important;
  border-radius: 13px !important;
}
.persona-btn {
  box-shadow: none !important;
  border-radius: 999px !important;
}
.persona-btn.active {
  background: var(--rw-primary) !important;
  border-color: var(--rw-primary) !important;
  color: #fff !important;
}
.analyst-workspace-divider {
  margin: 10px 0 !important;
}
.search-input-container-premium {
  border-color: var(--rw-border) !important;
  box-shadow: var(--rw-shadow-sm) !important;
}
#ai-search-input {
  min-height: 82px !important;
  color: var(--rw-primary) !important;
}

/* Tabellen/lijsten: scanbaar */
table {
  border-color: var(--rw-border) !important;
}
th {
  color: var(--rw-primary) !important;
  background: #F1F5F9 !important;
}
tr:hover,
.list-row:hover,
.ds-list-row:hover {
  background: #F1F5F9 !important;
}

/* Mobiel */
@media (max-width: 760px) {
  body.analist-mode .portal-header {
    padding: 24px 16px 12px !important;
  }
  .compact-hero-card {
    padding: 15px !important;
  }
  .compact-hero-right {
    min-width: 100% !important;
    width: 100% !important;
  }
  .compact-hero-actions {
    flex-direction: column;
  }
  .persona-button-strip {
    width: 100%;
    overflow-x: auto;
    padding-bottom: 4px;
  }
}
