/* EPD² PROBNIK — responsive corrections to the EPD_Front(5) baseline.
   Several inline grids have fixed minimum widths, so on a phone the page
   scrolls sideways. These rules only let them wrap; colours, type and
   spacing above phone width are the baseline's own. Inline styles win over
   stylesheets, hence !important. The header on a phone is `menu.css`. */

/* The phone header (menu.css, scripts/probnik_site/mobile_menu.py) adds a
   "Menü" button, "Bürger-Login" in the bar and a panel. Where menu.css does
   not apply — the desktop — none of it shows, and the panel that holds the
   header's navigation and actions is no box of its own: the header lays
   them out exactly as before. */
.pbnk-menu-wrap {
  display: contents;
}
.pbnk-menu-toggle,
.pbnk-menu-close,
.pbnk-bar-action,
.pbnk-menu-identity,
.pbnk-nav-label {
  display: none;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

@media (max-width: 1023.98px) {
  /* Should menu.css not arrive, the desktop header at least wraps instead
     of running off the side of a phone. Where menu.css applies, its panel
     lays the navigation out and this rule has no effect. */
  .header nav {
    flex-wrap: wrap;
    column-gap: 16px !important;
    row-gap: 6px;
  }
  /* Tab rows (regional pages of the party website) wrap instead of
     running off the screen (also on a phone held sideways). */
  .tabs {
    flex-wrap: wrap;
  }
}

@media (max-width: 600px) {
  main[style*="padding"] {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  [style*="grid-template-columns"][style*="minmax("],
  [style*="grid-template-columns:1.05fr"],
  [style*="grid-template-columns:.95fr"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .login-panel,
  .card {
    min-width: 0;
  }
  /* A card column never asks for more than the screen (the 300px topic
     cards of programm.html ran 2px off a 320px phone). */
  .topic-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  footer a {
    display: inline-block;
  }
  /* Long German compounds in large headings ("Entscheidungsdokumentation"). */
  h1,
  h2,
  h3 {
    hyphens: auto;
    overflow-wrap: break-word;
  }
}

/* Owner decision 2026-09-30: the membership application of the test
   operation is legally void. Its notice stands on every surface of the
   application; it is marked by an icon, a label and a frame, never by
   colour alone (the warning colour is the one the member area already
   uses). */
.pbnk-test-notice {
  border: 1px solid #c79a2b;
  border-left: 6px solid #c79a2b;
  background: #fdf8ec;
  color: var(--text);
  overflow-wrap: break-word;
}
.pbnk-test-notice p {
  color: var(--text);
}
.pbnk-test-status {
  margin: 8px 0 0;
  font-weight: 600;
  color: var(--text);
}
/* The same, in one line directly at the submit button: a row of its own
   above the button, so that both are on screen together. */
.pbnk-test-inline {
  flex: 1 0 100%;
  margin: 0;
  font-size: 14px;
  color: var(--text);
  overflow-wrap: break-word;
}

/* Match installed-PWA typography; browser zoom remains available. */
html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}

/* EPD2 shared button spacing */
/* Real row gaps survive wrapping. Button-only containers exclude menus,
   fields and input groups; runtime error pages also load this via core.css. */
main :is(p,div):has(> :is(.btn,button,input[type=submit]) ~ :is(.btn,button,input[type=submit])):not(:has(> :not(.btn,button,input[type=submit],[hidden],br))),
main :is(.form-actions,.pbnk-actions,.actions,.program-actions,.participation-actions,.region-actions,.land-actions) {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
}
main :is(p,div):has(> :is(.btn,button,input[type=submit]) ~ :is(.btn,button,input[type=submit])):not(:has(> :not(.btn,button,input[type=submit],[hidden],br))) > br {display:none}
main :is(.form-actions,.pbnk-actions,.actions,.program-actions,.participation-actions,.region-actions,.land-actions) > .btn {
  max-width:100%;
  box-sizing:border-box;
  text-align:center;
}
/* Legacy call-to-action cards also contain headings and explanatory text. */
main :is(.card,section):has(> .btn ~ .btn) > .btn {margin:6px}
main .btn {box-sizing:border-box;max-width:100%}
/* End EPD2 shared button spacing */