/* Scoped styles shared by the public website and employee app. */
dialog.app-dialog {
  box-sizing: border-box; width: min(32rem, calc(100vw - 2rem)); max-height: calc(100dvh - 2rem);
  margin: auto; padding: 1.5rem; border: 1px solid #e5e7eb; border-radius: 1rem;
  background: #fff; color: #111827; box-shadow: 0 24px 64px rgb(15 23 42 / .24);
  font-family: inherit; text-align: left; overflow-y: auto;
}
dialog.app-dialog::backdrop { background: rgb(15 23 42 / .55); }
.app-dialog h2 { margin: 0 0 1rem; font-size: 1.25rem; font-weight: 650; line-height: 1.4; color: #111827; }
.app-dialog ul { margin: 0; padding: 0; list-style: none; }
.app-dialog li { margin: 0 0 .75rem; font-size: 1rem; line-height: 1.5; overflow-wrap: anywhere; color: #374151; }
.app-dialog-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }
.app-dialog-actions button { min-height: 44px; padding: .75rem 1rem; border: 1px solid #d1d5db; border-radius: .5rem; font: inherit; font-weight: 600; cursor: pointer; }
.app-dialog-actions .app-dialog-primary { background: #2563eb; border-color: #2563eb; color: #fff; }
.app-dialog-actions .app-dialog-primary:hover { background: #1d4ed8; }
.app-dialog-actions .app-dialog-secondary { background: #fff; color: #374151; }
.app-dialog-actions .app-dialog-secondary:hover { background: #f3f4f6; }
.app-dialog-actions button:focus-visible { outline: 3px solid #2563eb; outline-offset: 3px; }
p.app-field-error { margin: .5rem 0; color: #b91c1c; font-size: .875rem; line-height: 1.5; }
@media (max-width: 480px) { .app-dialog-actions { flex-direction: column-reverse; } .app-dialog-actions button { width: 100%; } }