/* NEXT2 public UI primitives.
   Color authority remains the server-projected publicDesignTheme / --brand-* tokens.
   This module owns shared visual grammar only: surfaces, headings, choices and dialogs. */

:root {
  --public-surface: var(--brand-card-panel-bg, var(--white));
  --public-surface-muted: var(--brand-surface-muted, var(--ivory-mid));
  --public-border: var(--brand-card-panel-border, var(--line));
  --public-divider: var(--brand-card-divider, var(--line-soft));
  --public-title: var(--brand-card-title, var(--text-dark));
  --public-text: var(--brand-card-text, var(--text-mid));
  --public-text-secondary: var(--brand-text-mid, var(--text-mid));
  --public-text-muted: var(--brand-card-muted-text, var(--text-muted));
  --public-accent: var(--brand-primary, var(--amethyst));
  --public-accent-secondary: var(--brand-secondary, var(--amethyst-mid));
  --public-accent-soft: var(--brand-primary-ghost, var(--amethyst-ghost));
  --public-space-2xs: .25rem;
  --public-space-xs: .5rem;
  --public-space-sm: .75rem;
  --public-space-md: 1rem;
  --public-space-lg: 1.5rem;
  --public-control-min-block: 2.75rem;
  --public-card-grid-min: 15.5rem;
  --public-card-grid-min-wide: 17rem;
  --public-card-padding-compact: clamp(.8rem, 2.4cqi, 1rem);
  --public-card-padding-standard: clamp(1rem, 2.8cqi, 1.25rem);
  --public-card-padding-hero: clamp(1.2rem, 3.2cqi, 1.5rem);
  --public-card-title-size: clamp(1.2rem, 3.8cqi, 1.7rem);
  --public-card-copy-size: clamp(.8rem, 2.1cqi, .92rem);
  --public-card-action-max-inline: 19rem;
  --public-density-section-padding-comfortable: 1.25rem; --public-density-section-padding-compact: .875rem;
  --public-density-gap-comfortable: 1.125rem; --public-density-gap-compact: .75rem;
  --public-density-control-padding-comfortable: 1rem;
  --public-density-control-padding-compact: .75rem;
  --public-density-shell-inline-comfortable: 1.75rem;
  --public-density-shell-inline-compact: .875rem;
  --public-density-shell-block-comfortable: 1.5rem;
  --public-density-shell-block-compact: .875rem;

  /* P1R6CU — métriques structurelles partagées du shell public. Les seuils de
     composition restent centralisés dans booking-responsive-layout.css ; les
     composants ne possèdent pas leurs propres dimensions parallèles. */
  --public-shell-max-inline: 68.75rem;
  --public-shell-sidebar-inline: 17rem;
  --public-shell-gap: 1.125rem;
  --public-shell-sidebar-offset: 3.625rem;
  --public-shell-inline-padding: var(--public-density-shell-inline-comfortable);
  --public-shell-block-padding: var(--public-density-shell-block-comfortable);
  --public-shell-user-menu-max-inline: 19rem;
  --public-shell-user-menu-max-inline-compact: 9.5rem;
  --public-shell-topbar-block: 3.125rem;
  --public-shell-topbar-padding-inline: var(--public-space-lg);
  --public-shell-brand-size: 1.1rem;
  --public-shell-brand-size-compact: .95rem;
  --public-shell-document-end-gap: 2rem;
  --public-datetime-calendar-min-inline: 20rem;
  --public-datetime-slots-min-inline: 16rem;
  --public-datetime-layout-gap: var(--public-space-md);
  --public-footer-margin-block-start: var(--public-space-lg);
  --public-footer-padding-inline: clamp(1rem, 3cqi, 1.5rem);
  --public-footer-padding-block: 1.25rem;
  --public-footer-safe-padding: var(--public-space-lg);
  --public-footer-logo-size: 2.75rem;
  --public-footer-gap: var(--public-space-md);
  --public-footer-identity-min-inline: 10.5rem;
  --public-footer-contact-min-inline: 10rem;
  --public-progress-padding-block: var(--public-space-xs);
  --public-progress-padding-inline: var(--public-space-sm);
  --public-progress-dot-size: .5rem;
  --public-progress-current-dot-inline: 1.25rem;
  --public-progress-dot-gap: .25rem;
  --public-progress-timeline-dot: 1.25rem;
  --public-progress-label-size: .78rem;
  --public-progress-count-size: .68rem;
  --public-progress-panel-title-size: .84rem;
  --public-progress-timeline-name-size: .73rem;
  --public-progress-timeline-meta-size: .62rem;
  --public-progress-timeline-badge-size: .56rem;
  --public-progress-connector-inline: 2px;
}

.public-surface {
  background: var(--public-surface);
  border: 1px solid var(--public-border);
  border-radius: var(--radius-lg);
  color: var(--public-text);
}

.public-surface--elevated { box-shadow: var(--shadow-md); }
.public-surface--dialog { border-radius: var(--radius-xl); box-shadow: var(--shadow-xl); overflow: hidden; }

.public-surface-header {
  background: var(--brand-gradient-header);
  color: var(--brand-header-text);
}

.public-section-card {
  margin: 0;
  padding: var(--public-section-padding, var(--public-density-section-padding-comfortable));
  background: var(--public-surface);
  border: 1px solid var(--public-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-xs);
}

.public-section-card--accent {
  border-color: color-mix(in srgb, var(--public-accent) 24%, var(--public-border));
  background: color-mix(in srgb, var(--public-accent-soft) 34%, var(--public-surface));
}

.public-section-heading { display: grid; gap: 7px; }
.public-section-heading__title {
  margin: 0;
  color: var(--public-title);
  font-family: var(--font-display);
  font-size: clamp(1.18rem, 2vw, 1.45rem);
  line-height: 1.2;
  padding-left: 0;
}
.public-section-heading__title::before { display: none; }
.public-section-heading__copy {
  margin: 0;
  color: var(--public-text-muted);
  line-height: 1.45;
}

.public-choice-card {
  border: 1px solid var(--public-border);
  background: var(--public-surface);
  color: var(--public-text);
  border-radius: var(--radius-md);
  box-shadow: none;
  cursor: pointer;
  transition: var(--transition);
}

.public-choice-card:hover:not(:disabled):not([aria-disabled="true"]) {
  border-color: color-mix(in srgb, var(--public-accent) 55%, var(--public-border));
  background: var(--public-accent-soft);
}

.public-choice-card.is-selected,
.public-choice-card.active,
.public-choice-card[aria-checked="true"] {
  border: 2px solid var(--public-accent);
  background: var(--public-accent-soft);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--public-accent) 22%, transparent);
}

.public-choice-card:disabled,
.public-choice-card[aria-disabled="true"],
.public-choice-card.is-disabled {
  opacity: .52;
  cursor: not-allowed;
  box-shadow: none;
  background: var(--public-surface-muted);
}

.public-choice-marker {
  width: 18px;
  height: 18px;
  border: 2px solid var(--public-border);
  border-radius: 50%;
  background: var(--public-surface);
  box-shadow: inset 0 0 0 4px var(--public-surface);
  flex-shrink: 0;
}

.public-choice-card.is-selected .public-choice-marker,
.public-choice-card.active .public-choice-marker,
.public-choice-card[aria-checked="true"] .public-choice-marker {
  border-color: var(--public-accent);
  background: var(--public-accent);
}

.public-choice-card:disabled .public-choice-marker,
.public-choice-card[aria-disabled="true"] .public-choice-marker,
.public-choice-card.is-disabled .public-choice-marker {
  border-color: var(--public-border);
  background: var(--public-surface-muted);
  box-shadow: none;
}

.public-choice-title { color: var(--public-title); }
.public-choice-description { color: var(--public-text-secondary); }
.public-choice-card.is-selected .public-choice-title,
.public-choice-card.active .public-choice-title,
.public-choice-card[aria-checked="true"] .public-choice-title { color: var(--public-accent); }

.public-notice {
  padding: var(--public-notice-padding-block, var(--public-space-sm)) var(--public-notice-padding-inline, var(--public-space-md));
  border: 1px solid var(--public-border);
  border-radius: var(--radius-md);
  background: var(--public-surface);
  color: var(--public-text);
  line-height: 1.45;
}
.public-notice--accent { box-shadow: inset 3px 0 0 var(--brand-accent); }
.public-notice--warning {
  border-color: var(--brand-warning);
  background: var(--brand-warning-ghost);
  color: var(--brand-warning);
}

.modal-content.public-dialog,
.public-dialog {
  width: 100%;
  padding: 0;
  position: relative;
  overflow: hidden;
}
.public-dialog__header {
  position: relative;
  padding: 24px 56px 20px 28px;
  background: var(--brand-gradient-header);
  color: var(--brand-header-text);
}
.public-dialog .public-dialog__title {
  margin: 0 0 6px;
  color: var(--brand-header-text);
  -webkit-text-fill-color: var(--brand-header-text);
  font-family: var(--font-display);
  font-size: 1.4rem;
  font-weight: 600;
}
.public-dialog .public-dialog__copy {
  margin: 0;
  color: var(--brand-header-text);
  -webkit-text-fill-color: var(--brand-header-text);
  opacity: .82;
  font-size: .86rem;
  line-height: 1.5;
}
.public-dialog__body { padding: 24px 28px 28px; }
.public-dialog__close {
  position: absolute;
  top: 14px;
  right: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 1px solid color-mix(in srgb, var(--brand-header-text) 28%, transparent);
  border-radius: 50%;
  background: var(--brand-header-control-bg);
  color: var(--brand-header-text);
  cursor: pointer;
  transition: var(--transition);
}
.public-dialog__close:hover {
  background: color-mix(in srgb, var(--brand-header-control-bg) 82%, var(--brand-header-text));
}

@media (max-width: 640px) {
  .public-dialog__header { padding: 22px 54px 18px 22px; }
  .public-dialog__body { padding: 22px; }
}

.public-dialog .form-label { color: var(--public-title); }
.public-dialog .form-input {
  background: var(--public-surface);
  color: var(--public-text);
  border-color: var(--public-border);
}
.public-dialog .form-input:focus {
  border-color: var(--public-accent);
  box-shadow: 0 0 0 3px var(--public-accent-soft);
}
.public-dialog .public-notice strong { color: var(--public-title); }
