/*
 * Simulator theme — applies the InterPago portal design laws to the Vaadin/Lumo
 * app so all 20+ screens read as one system instead of default-Lumo rounded chrome:
 *   Law 1  ZERO border-radius on box elements (square).
 *   Law 2  Compact density on a tight grid.
 *   Law 3  Elevation = border, not shadow.
 * Dark palette inherited from Lumo.DARK (@Theme variant). Because Lumo components
 * read these custom properties, overriding the properties restyles every component
 * (buttons, inputs, selects, grids, dialogs, cards, tabs, nav) at once — no per-view
 * edits. See docs/portal/design-conventions.md §0 (the two laws).
 */

html {
  /* --- Law 1: square everything. Lumo box elements read these vars. --- */
  --lumo-border-radius-s: 0;
  --lumo-border-radius-m: 0;
  --lumo-border-radius-l: 0;

  /* --- Law 2: compact density. Tighten control sizes one notch. --- */
  --lumo-size-xl: 3rem;
  --lumo-size-l: 2.5rem;
  --lumo-size-m: 2.25rem;   /* ~36px default control height (was 2.5rem) */
  --lumo-size-s: 1.875rem;
  --lumo-size-xs: 1.625rem;

  /* Tighter spacing scale. */
  --lumo-space-xl: 1.75rem;
  --lumo-space-l: 1.125rem;
  --lumo-space-m: 0.625rem;
  --lumo-space-s: 0.375rem;
  --lumo-space-xs: 0.1875rem;

  /* Slightly denser type for monitoring screens (KPI values stay prominent). */
  --lumo-font-size-xxl: 1.75rem;
  --lumo-font-size-xl: 1.375rem;
  --lumo-font-size-l: 1.125rem;
  --lumo-font-size-m: 0.9375rem;
  --lumo-font-size-s: 0.8125rem;
  --lumo-font-size-xs: 0.75rem;

  /* --- Law 3: elevation = a 1px border, not a shadow. --- */
  --lumo-box-shadow-xs: 0 0 0 1px var(--lumo-contrast-10pct);
  --lumo-box-shadow-s: 0 0 0 1px var(--lumo-contrast-10pct);
}

/* Page titles: the portal header role is text-sm font-semibold — H1 in Lumo is large.
   Pull the per-screen H1 down to a tighter, consistent page-title weight. */
h1 {
  font-size: 1.5rem;
  font-weight: 600;
  margin: 0.25rem 0 0.5rem;
}

h3 {
  font-size: 0.95rem;
  font-weight: 600;
  margin: 0.5rem 0 0.25rem;
  color: var(--lumo-secondary-text-color);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* Monitoring tables read denser; header row is a quiet uppercase label. */
vaadin-grid {
  --lumo-size-m: 2rem;
  font-size: var(--lumo-font-size-s);
}

/* Nav rail items sit tighter (the app has ~20 entries). */
vaadin-side-nav-item::part(item) {
  padding-top: 0.3rem;
  padding-bottom: 0.3rem;
}