/* P1R6CU-R7 — Format step orchestration.
   Card presets/geometry remain owned by consultation-card-visual.css,
   entity-card-strict-presets.css and entity-card-layout.css. Shared sidebar,
   customer-menu and progression presentation are deliberately out of scope. */

#step-consultation-type {
  --consultation-step-text: var(--brand-card-text, var(--brand-text));
  --consultation-step-muted: var(--brand-card-muted-text, var(--brand-muted-text));
  --consultation-step-border: var(--brand-card-panel-border, var(--public-border));
  --consultation-step-surface: var(--brand-card-panel-bg, var(--public-surface));
  --consultation-step-accent: var(--brand-primary, var(--public-accent));
  --consultation-step-accent-end: var(--brand-secondary, var(--consultation-step-accent));
  --consultation-step-subtitle: color-mix(in srgb, var(--consultation-step-text) 84%, var(--consultation-step-muted));
  --consultation-step-neutral-border: color-mix(in srgb, var(--consultation-step-border) 88%, var(--consultation-step-surface));
}

#step-consultation-type :is(
  .content-header [hidden],
  .consultation-type-personalization-hint[hidden],
  .consultation-type-action-feedback[hidden],
  .consultation-type-action-feedback[data-state="idle"]
) {
  display: none !important;
}

#step-consultation-type .content-header {
  margin-bottom: .65rem;
  padding-bottom: 0;
}

#step-consultation-type :is(.content-header h2, #consultation-type-title) {
  margin-bottom: .25rem;
  text-wrap: balance;
}

#step-consultation-type :is(
  .content-header p,
  #consultation-type-subtitle,
  #consultation-type-step-title
) {
  max-width: 45rem;
  margin-top: 0;
  margin-bottom: .45rem;
  color: var(--consultation-step-subtitle);
  -webkit-text-fill-color: var(--consultation-step-subtitle);
  line-height: 1.45;
}

#step-consultation-type .step-number {
  display: none !important;
}

#step-consultation-type .selection-step {
  gap: var(--public-space-md);
}

#step-consultation-type .consultation-type-personalization-hint {
  max-width: 57.5rem;
  margin: 0 0 var(--public-space-sm);
  color: color-mix(in srgb, var(--consultation-step-text) 58%, var(--consultation-step-muted));
  font-size: .78rem;
  font-weight: 620;
  line-height: 1.35;
  text-align: start;
}

#step-consultation-type .consultation-type-action-feedback {
  display: flex;
  flex-direction: column;
  gap: var(--public-space-2xs);
  margin: 0 var(--public-space-lg) var(--public-space-sm);
  padding: var(--public-space-xs) var(--public-space-sm);
  border: 1px solid color-mix(in srgb, var(--consultation-step-accent) 12%, var(--consultation-step-border));
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--consultation-step-accent) 3%, var(--consultation-step-surface));
}

#step-consultation-type .consultation-type-action-feedback__title {
  color: var(--consultation-step-text);
  font-size: .86rem;
  font-weight: 800;
  line-height: 1.2;
}

#step-consultation-type .consultation-type-action-feedback__detail,
#step-consultation-type .consultation-type-action-feedback__helper {
  color: color-mix(in srgb, var(--consultation-step-text) 76%, var(--consultation-step-muted));
  font-size: .8rem;
  font-weight: 600;
  line-height: 1.35;
}

#step-consultation-type :is(.consultation-type-card, .location-option) {
  display: flex !important;
  flex-direction: column !important;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

#step-consultation-type :is(.consultation-type-card, .location-option):is(:hover, :focus-visible) {
  transform: translateY(-2px);
}

#step-consultation-type .consultation-type-card:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--consultation-step-accent) 34%, transparent);
  outline-offset: 3px;
}

#step-consultation-type .card-content {
  display: flex !important;
  flex: 1 1 auto;
  flex-direction: column !important;
  align-items: center;
  min-width: 0;
}

#step-consultation-type .consultation-card-feature:empty {
  display: none !important;
}

#step-consultation-type .consultation-card-feature:has(.consultation-card-help:only-child) {
  justify-content: center;
}

#step-consultation-type .consultation-card-feature:has(.consultation-card-help:only-child) .consultation-card-help {
  margin: 0;
  font-weight: 650;
}

#step-consultation-type .consultation-card-description--single {
  margin-bottom: 0;
}

#step-consultation-type .consultation-card-help {
  min-height: 1.15em;
}

#step-consultation-type :is(
  .consultation-type-card--distance,
  .consultation-type-card--soin-a-distance,
  .consultation-type-card--remote
) .card-title {
  max-width: 15ch !important;
}

#step-consultation-type .consultation-type-card--highlighted:not(.selected) {
  border-color: color-mix(in srgb, var(--consultation-step-accent) 46%, var(--consultation-step-border)) !important;
  box-shadow: 0 14px 30px color-mix(in srgb, var(--consultation-step-accent) 14%, transparent) !important;
}

#step-consultation-type .consultation-type-card.customer-history-preferred:not(.selected) {
  background: var(--consultation-step-surface) !important;
  border-color: var(--consultation-step-neutral-border) !important;
}

#step-consultation-type .customer-history-badge,
#step-consultation-type .consultation-card-badge {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  justify-content: center;
  margin: var(--public-space-2xs) auto 0;
  padding: var(--public-space-2xs) var(--public-space-xs);
  border-radius: var(--radius-pill);
  font-size: .72rem;
  font-weight: 760;
  line-height: 1.1;
}

#step-consultation-type .consultation-card-badge--history,
#step-consultation-type .customer-history-badge {
  border: 1px solid color-mix(in srgb, var(--consultation-step-accent) 14%, var(--consultation-step-border));
  background: var(--consultation-step-surface);
  color: color-mix(in srgb, var(--consultation-step-accent) 88%, var(--consultation-step-text));
}

#step-consultation-type .consultation-card-badge--feature {
  border: 1px solid color-mix(in srgb, var(--consultation-step-text) 10%, var(--consultation-step-border));
  background: color-mix(in srgb, var(--consultation-step-text) 3%, var(--consultation-step-surface));
  color: color-mix(in srgb, var(--consultation-step-text) 72%, var(--consultation-step-muted));
}

html body #step-consultation-type .consultation-type-card.location-option,
html body #step-consultation-type .consultation-type-card[data-card-visual-mode="background"] {
  border-color: var(--consultation-step-neutral-border) !important;
  box-shadow: 0 6px 16px color-mix(in srgb, var(--consultation-step-text) 7%, transparent) !important;
}

html body #step-consultation-type .consultation-type-card:is(:hover, :focus-visible) {
  border-color: color-mix(in srgb, var(--consultation-step-accent) 48%, var(--consultation-step-border)) !important;
  box-shadow: 0 14px 30px color-mix(in srgb, var(--consultation-step-text) 12%, transparent) !important;
}

html body #step-consultation-type .consultation-type-card:is(.selected, [aria-selected="true"]) {
  border-color: var(--consultation-step-accent) !important;
  background: color-mix(in srgb, var(--consultation-step-accent) 5%, var(--consultation-step-surface)) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--consultation-step-accent) 18%, transparent),
              0 14px 30px color-mix(in srgb, var(--consultation-step-text) 12%, transparent) !important;
}

#step-consultation-type .consultation-type-card.selected .customer-history-badge {
  opacity: .72;
}

#step-consultation-type .consultation-type-card.selected .consultation-selected-badge {
  display: inline-flex !important;
}

#step-consultation-type .consultation-type-card[data-admin-active="false"] {
  opacity: .58;
  pointer-events: none;
}

html body #step-consultation-type .consultation-type-card :is(
  .card-description,
  .consultation-card-help,
  .consultation-card-description--single
) {
  color: var(--consultation-step-text) !important;
  -webkit-text-fill-color: var(--consultation-step-text) !important;
  font-weight: 560 !important;
}

html body #step-consultation-type .consultation-type-card .card-title {
  color: var(--brand-card-title, var(--consultation-step-accent)) !important;
}

html body #step-consultation-type .consultation-card-action {
  min-width: 7.625rem !important;
  min-height: 2.625rem !important;
  margin-top: auto !important;
  background: var(--brand-card-action-bg, linear-gradient(135deg, var(--consultation-step-accent), var(--consultation-step-accent-end))) !important;
  color: var(--brand-card-button-text) !important;
  -webkit-text-fill-color: var(--brand-card-button-text) !important;
  border: 0 !important;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--consultation-step-accent) 18%, transparent) !important;
  opacity: 1 !important;
}

html body #step-consultation-type .consultation-type-card:is(:hover, :focus-visible, .selected, [aria-selected="true"]) .consultation-card-action {
  box-shadow: 0 10px 22px color-mix(in srgb, var(--consultation-step-accent) 26%, transparent) !important;
}

#step-consultation-type .card-icon.consultation-icon.consultation-icon--admin[data-admin-icon="true"] {
  filter: saturate(.88);
}

html.consultation-icons-hidden #step-consultation-type .card-icon,
body.consultation-icons-hidden #step-consultation-type .card-icon {
  display: none !important;
}

/* First entry is card-driven. Once a choice exists, the shared ActionBar owns navigation. */
#step-consultation-type .action-buttons[data-consultation-type-state="idle"],
#step-consultation-type #consultation-type-continue-btn[hidden] {
  display: none !important;
}

@container booking-step (max-width: 32rem) {
  #step-consultation-type .content-header {
    margin-bottom: .55rem;
  }

  #step-consultation-type .consultation-type-personalization-hint,
  #step-consultation-type .consultation-type-action-feedback {
    margin-inline: var(--public-space-md);
  }
}
