/* Shared responsive layout for public pages and operational panels. */
*, *::before, *::after { box-sizing: border-box; }
main, main > *, nav, fieldset, form, label { min-inline-size: 0; }
img, video, canvas, svg, iframe { max-inline-size: 100%; }
img, video { block-size: auto; }
input, select, textarea, button { max-inline-size: 100%; }
button, main a { overflow-wrap: anywhere; }
main :is(h1,h2,h3,p,li,output,td,th) { overflow-wrap: anywhere; }
dialog { max-inline-size: calc(100% - 24px); max-block-size: calc(100dvh - 24px); overflow: auto; }
.section-table { max-inline-size: 100%; overflow-x: auto; }
.section-table table { min-inline-size: 34rem; }
:focus-visible { outline: 2px solid #ff934c; outline-offset: 2px; }

body:has(.event-sales) { container-type: inline-size; }
.event-sales:has(#public-event-banner:not([hidden])) #public-event-banner {
  width: 100cqw;
  max-inline-size: none;
  margin-inline: calc(50% - 50cqw);
}
.event-sales-layout, .event-sheet, .event-intro > *, .navbar-container > * { min-width: 0; }

@media (max-width: 1024px) {
  .navbar-container { grid-template-columns: minmax(0, 1fr) auto; gap: 8px 12px; }
  .navbar-search { grid-row: 2; grid-column: 1 / -1; }
  .navbar-container nav { justify-content: flex-end; }
  .layout, .shell { display: block; }
  #menu-toggle, #nav-toggle { display: block; margin-inline-start: auto; }
  :is(.layout,.shell) aside { display: none; border-right: 0; }
  :is(.layout,.shell) aside.open { display: flex; }
  :is(.layout,.shell) main { padding-inline: clamp(12px, 3vw, 28px); }
  :is(.layout,.shell) .cards { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .event-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}

@media (max-width: 640px) {
  main :is(button,input:not([type=checkbox]):not([type=radio]),select),
  dialog :is(button,input:not([type=checkbox]):not([type=radio]),select) { min-block-size: 44px; }
  main :is(input,select,textarea), dialog :is(input,select,textarea) { font-size: 16px; }
  :is(.layout,.shell) .cards, .editor-step { grid-template-columns: minmax(0,1fr); }
  .demo-form, .organizer-form { display: grid; grid-template-columns: minmax(0,1fr); }
  .demo-form :is(input,select), .organizer-form :is(input,select) { width: 100%; }
  .event-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .event-intro { flex-direction: column; align-items: center; }
  .event-section-nav { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,100px),1fr)); }
  .event-section-nav a { min-block-size: 44px; justify-content: center; align-items: center; padding-inline: 8px; }
}
@media (max-width: 360px) {
  .event-grid { grid-template-columns: minmax(0,1fr); }
}