/* Native dialog shell, shared by theme interactions. */
.puaro-dialog-open { overflow: hidden; scrollbar-gutter: stable; }
.puaro-dialog {
  width: var(--puaro-dialog-width);
  max-width: calc(100% - 32px);
  max-height: calc(100dvh - 40px);
  margin: auto;
  padding: var(--puaro-dialog-padding);
  overflow: auto;
  color: var(--puaro-ui-text);
  background: var(--puaro-ui-surface);
  border: var(--puaro-ui-border-line);
  border-radius: var(--puaro-dialog-radius);
  box-shadow: var(--puaro-dialog-shadow);
  font: var(--puaro-dialog-description);
}
.puaro-dialog::backdrop { background: var(--puaro-dialog-backdrop); }
.puaro-dialog-header { display: flex; align-items: center; justify-content: space-between; gap: var(--puaro-ui-gap); }
.puaro-dialog-header h2 { margin: 0; font: var(--puaro-dialog-heading); }
.puaro-dialog-close {
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
  width: var(--puaro-ui-control-height); height: var(--puaro-ui-control-height);
  padding: 0; color: var(--puaro-ui-muted); background: none; border: 0; border-radius: var(--puaro-ui-radius);
}
@media (hover: hover) and (pointer: fine) {
  .puaro-dialog-close:hover { color: var(--puaro-ui-text); background: var(--puaro-ui-hover); }
}
.puaro-dialog-close:active { color: var(--puaro-ui-text); background: var(--puaro-ui-pressed); }
.puaro-dialog-close svg { width: var(--puaro-ui-icon-size); height: var(--puaro-ui-icon-size); }
.puaro-dialog :focus-visible { outline: 2px solid var(--puaro-ui-text); outline-offset: 3px; }
.puaro-dialog [hidden] { display: none !important; }
@media (max-width: 600px) {
  .puaro-dialog {
    position: fixed; inset: auto 0 0; width: 100%; max-width: 100%; max-height: calc(100dvh - 20px);
    margin: 0 auto; padding-bottom: max(var(--puaro-dialog-padding), env(safe-area-inset-bottom));
    border-bottom: 0; border-radius: var(--puaro-dialog-radius) var(--puaro-dialog-radius) 0 0;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .puaro-dialog[open] { animation: puaro-dialog-enter 160ms ease-out; }
  @keyframes puaro-dialog-enter { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
}
