/*
 * Dialog — partial layouts/_catalogue_modal, piloté par catalogue_modal_controller
 *   <div class="dialog-overlay is-open"><div class="dialog">
 *     <div class="dialog-header"><h3 class="dialog-title">…</h3><p class="dialog-description">…</p></div>
 *     <div class="dialog-body">…</div>
 *     <div class="dialog-footer"><button class="btn btn-default">…</button></div>
 *   </div></div>
 */

.dialog-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 200;
  align-items: center;
  justify-content: center;
  background: var(--overlay);
}
.dialog-overlay.is-open { display: flex; }

.dialog {
  width: 90%;
  max-width: 440px;
  padding: 3rem;
  background: var(--background);
  color: var(--foreground);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
}

.dialog-header { display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1.5rem; }
.dialog-title { margin: 0; font-family: var(--font-serif); font-size: var(--text-lg); font-weight: 400; }
.dialog-description { margin: 0; font-family: var(--font-serif); font-size: var(--text-sm); line-height: 1.6; color: var(--muted-foreground); }

.dialog-body { display: flex; flex-direction: column; gap: 1rem; }
.dialog-footer { display: flex; align-items: center; gap: 1rem; margin-top: 1.5rem; }

.dialog-message { margin-top: 1rem; font-family: var(--font-sans); font-size: var(--text-sm); }
.dialog-message.is-success { color: var(--success); }
.dialog-message.is-error   { color: var(--destructive); }

@media (max-width: 768px) {
  .dialog { padding: 2rem 1.5rem; }
  .dialog-footer { flex-direction: column; align-items: stretch; }
}
@media (max-width: 480px) {
  .dialog { width: 95%; }
}

/* The same panel on a native <dialog> (inquiries/_dialog, drawer_controller): showModal() keeps
   the focus inside, Escape closes it. Clicking beside the panel lands on the dialog itself. */
dialog.dialog-modal {
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  padding: 0;
  border: 0;
  background: transparent;
}
dialog.dialog-modal[open] { display: flex; align-items: center; justify-content: center; }
dialog.dialog-modal::backdrop { background: var(--overlay); }
.dialog-modal .dialog {
  position: relative;
  max-height: calc(100dvh - 2 * var(--space-4));
  overflow-y: auto;
  opacity: 0;
  transition: opacity var(--transition-base);
}
.dialog-modal.is-open .dialog { opacity: 1; }
.dialog-close { position: absolute; top: var(--space-4); right: var(--space-4); }

/* Contacter la galerie (inquiries/new) */
.inquiry-abroad summary {
  cursor: pointer;
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  color: var(--muted-foreground);
}
.inquiry-abroad[open] summary { margin-bottom: var(--space-4); }
.inquiry-trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }