/* ============================================
   APP.CSS — Project-specifieke stijlen
   Wordt geladen NA core.css en groen.css
   ============================================ */


/* Utility: max-width 100% (gebruikt in onkosten/meldpunt voor afbeeldingen) */
.max-w-full {
  max-width: 100%;
}

/* Landingspagina: "of"-scheider tussen de twee loginknoppen (patroon maps) */
.login-divider {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  margin: var(--space-lg) 0;
  color: var(--color-text-muted);
  font-size: var(--text-sm);
}

.login-divider::before,
.login-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--color-border);
}

/* Framework v4+: .hidden heeft geen !important meer en verliest daardoor van
   ongelaagde module-CSS of inline styles die zelf display zetten (bv.
   .projectie-verbinding, .lijst-panel, .prestatie-wrap). Apps verbergt overal
   met .hidden (130+ JS-toggles), dus we houden hier het gedrag van 3.x aan.
   Gevolg: responsive combinaties zoals "hidden sm:flex" werken niet in apps —
   gebruik daarvoor max-sm:hidden / sm:hidden, of het hidden-attribuut. */
.hidden {
  display: none !important;
}