/* Auto-generated by css:bundle — do not edit manually */

/* fulgore: auth/mfa_challenge_form.css */
.auth-mfa-challenge-form {
  max-width: 28rem;
  margin: var(--space-16) auto;
  display: grid;
  gap: var(--space-6);
}

.auth-mfa-challenge-form h2 {
  margin: 0;
}

.auth-mfa-challenge-form form {
  display: grid;
  gap: var(--space-5);
}


/* fulgore: auth/mfa_disable_modal.css */
.mfa-disable-modal__icon {
  text-align: center;
  font-size: 2rem;
  margin-bottom: var(--space-2);
}

.mfa-disable-modal__warning {
  color: var(--color-text-subtle);
  text-align: center;
  line-height: var(--line-height-loose);
}


/* fulgore: auth/mfa_setup_form.css */
.auth-mfa-setup-form {
  .mfa-qr-code {
    display: flex;
    justify-content: center;
    margin-block: var(--space-4);
  }
}


/* fulgore: shared/errors/base.css */
.shared-errors-not-found,
.shared-errors-internal-server {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 60vh;
  text-align: center;
  gap: var(--space-6);
  padding: var(--space-10);
}

.shared-errors-not-found__code,
.shared-errors-internal-server__code {
  display: block;
  font-size: 8rem;
  font-weight: var(--font-weight-bold);
  color: var(--color-text-subtle);
  line-height: 1;
}

.shared-errors-not-found__title,
.shared-errors-internal-server__title {
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}

.shared-errors-not-found__description,
.shared-errors-internal-server__description {
  color: var(--color-text-subtle);
  margin: 0;
}


/* fulgore: shared/flash.css */
@keyframes flash-enter {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes flash-exit {
  from {
    opacity: 1;
    transform: translateY(0);
  }

  to {
    opacity: 0;
    transform: translateY(-4px);
  }
}

.flash-container {
  
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  position: fixed;
  top: calc(var(--navbar-height) + var(--space-4));
  right: var(--space-6);
  z-index: 1000;

  
  min-width: 280px;
  max-width: 400px;
}

.flash-item {
  
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: var(--space-3);

  .svg {
    width: var(--icon-size-sm);
    height: var(--icon-size-sm);
  }

  
  min-width: 280px;
  max-width: 400px;
  padding: var(--space-4);
  margin-bottom: var(--space-2);
  border-left: 3px solid;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md, 0 4px 12px rgba(0, 0, 0, 0.12));

  
  animation: flash-enter var(--duration-normal) var(--easing-default) both;

  &:last-child {
    margin-bottom: 0;
  }

  &.flash-item--exiting {
    animation: flash-exit var(--duration-fast) var(--easing-default) forwards;
  }
}

.flash-notice {
  background: var(--color-success-surface);
  color: var(--color-success);
  border-color: var(--color-success);
}

.flash-alert {
  background: var(--color-danger-surface);
  color: var(--color-danger);
  border-color: var(--color-danger);
}

.flash-warning {
  background: var(--color-warning-surface);
  color: var(--color-warning);
  border-color: var(--color-warning);
}

.flash-info {
  background: var(--color-info-surface);
  color: var(--color-info);
  border-color: var(--color-info);
}

.flash-icon {
  
  flex-shrink: 0;

  
  width: var(--icon-size-sm);
  height: var(--icon-size-sm);
  margin-top: 1px;
}

.flash-body {
  
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: var(--space-1);
}

.flash-message {
  
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  line-height: 1.4;

  flex: 1;
}

.flash-dismiss {
  
  flex-shrink: 0;

  
  padding: 0;
  border: none;

  
  line-height: 1;

  
  color: inherit;
  background: none;

  
  cursor: pointer;
  opacity: 0.6;
  transition: opacity var(--duration-fast) var(--easing-default);

  &:hover {
    opacity: 1;
  }

  .svg {
    width: var(--icon-size-sm);
    height: var(--icon-size-sm);
  }

  svg {
    display: block;
    width: var(--icon-size-sm);
    height: var(--icon-size-sm);
  }
}


/* fulgore: surveys/base_completion_screen.css */
.surveys-base-completion-screen {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-4);
  margin-block-start: var(--space-8);
}

.surveys-base-completion-screen__heading {
  font-size: var(--font-size-4xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
  margin: 0;
}

.surveys-base-completion-screen__description {
  font-size: var(--font-size-xl);
  color: var(--color-text-subtle);
  margin: 0;
  white-space: pre-line;
}

.surveys-base-completion-screen__actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-3);
  margin-block-start: var(--space-4);
  margin-block-end: var(--space-8);
}

.surveys-base-completion-screen__footer {
  align-self: flex-start;
}


/* fulgore: surveys/context_block.css */
.surveys-context-block {
  display: flex;
  flex-direction: column;
}

.surveys-context-block > * {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}

/* ── Heading ── */

.surveys-context-block h2 {
  margin: 0;
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-brand);
}

/* ── Description ── */

.surveys-context-block p {
  margin: 0;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-normal);
  line-height: var(--line-height-relaxed);
  color: var(--color-text-subtle);
}

/* ── Label / Value pairs ── */

.surveys-context-block div > span:first-child {
  display: block;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-brand-light);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: var(--space-1);
}

.surveys-context-block div > span:last-child {
  display: block;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-normal);
  color: var(--color-text-subtle);
}

/* ── Lists (steps, units) ── */

.surveys-context-block ol,
.surveys-context-block ul {
  margin: 0;
  padding-left: var(--space-5);
}

.surveys-context-block li {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-normal);
  line-height: var(--line-height-relaxed);
  color: var(--color-text-subtle);
  margin-bottom: var(--space-1);
}

.surveys-context-block ol li::marker {
  color: var(--color-brand-light);
  font-weight: var(--font-weight-semibold);
}


/* fulgore: surveys/inputs/base.css */
.surveys-inputs-base {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}


/* fulgore: surveys/inputs/boolean_card.css */
.ui-form:has(.surveys-inputs-boolean-card) {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-3);
}

.ui-form:has(.surveys-inputs-boolean-card) .form-actions,
.ui-form:has(.surveys-inputs-boolean-card) .ui-input {
  grid-column: 1 / -1;
}

.surveys-inputs-boolean-card__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-5) var(--space-3);
  border: 1.5px solid var(--color-brand-a10);
  border-radius: var(--radius-lg);
  background: var(--color-brand-surface);
  cursor: pointer;
  transition: border-color 200ms ease-out, box-shadow 200ms ease-out, transform 150ms ease-out;
  text-align: center;
}

.surveys-inputs-boolean-card__card:hover {
  border-color: var(--color-brand-light);
  box-shadow: 0 0 0 3px var(--color-brand-a10);
  transform: translateY(-2px);
}

.surveys-inputs-boolean-card__card:active {
  transform: translateY(0);
  box-shadow: none;
}

.surveys-inputs-boolean-card__checkbox:checked + .surveys-inputs-boolean-card__card {
  border-color: var(--color-brand);
  box-shadow: 0 0 0 3px var(--color-brand-a20);
}

.surveys-inputs-boolean-card__checkbox {
  position: absolute;
  width: 0;
  height: 0;
  opacity: 0;
  overflow: hidden;
}

.surveys-inputs-boolean-card__icon {
  font-size: var(--font-size-2xl);
  line-height: 1;
}

.surveys-inputs-boolean-card__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.surveys-inputs-boolean-card--none .surveys-inputs-boolean-card__card {
  border-color: var(--color-neutral-a10);
  background: var(--color-surface);
}

.surveys-inputs-boolean-card--none .surveys-inputs-boolean-card__card:hover {
  border-color: var(--color-neutral-a30);
  box-shadow: 0 0 0 3px var(--color-neutral-a10);
}

@media (max-width: 767px) {
  .ui-form:has(.surveys-inputs-boolean-card) {
    grid-template-columns: repeat(2, 1fr);
  }
}


/* fulgore: surveys/inputs/boolean_choice.css */
.surveys-inputs-boolean-choice {
  grid-template-columns: repeat(2, 1fr) !important;
}

.surveys-inputs-boolean-choice > .surveys-inputs-descriptive-choice__form:last-child {
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
}


/* fulgore: surveys/inputs/choice_card.css */
.surveys-inputs-choice-card__form {
  display: contents;
}

.surveys-inputs-choice-card__button {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-3);

  padding: var(--space-5) var(--space-4);
  border: 1.5px solid var(--color-brand-a10);
  border-radius: var(--radius-lg);
  background: var(--color-brand-surface);

  cursor: pointer;
  transition: border-color 200ms ease-out, box-shadow 200ms ease-out, transform 150ms ease-out;
}

.surveys-inputs-choice-card__button:hover {
  border-color: var(--color-brand-light);
  box-shadow: 0 0 0 3px var(--color-brand-a10);
  transform: translateY(-2px);
}

.surveys-inputs-choice-card__button:active {
  transform: translateY(0);
  box-shadow: none;
}

.surveys-inputs-choice-card__icon {
  font-size: var(--font-size-2xl);
  line-height: 1;
}

.surveys-inputs-choice-card__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  text-align: center;
}


/* fulgore: surveys/inputs/descriptive_choice.css */
.surveys-inputs-descriptive-choice {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-3);
  justify-items: center;
}

/* Binary choices (2 cards) — center in equal-width columns */
.surveys-inputs-descriptive-choice:has(.surveys-inputs-descriptive-choice__form:nth-child(2):last-child) {
  grid-template-columns: repeat(2, 1fr);
  max-width: 520px;
  margin-inline: auto;
}

.surveys-inputs-descriptive-choice__form {
  display: contents;
}

.surveys-inputs-descriptive-choice__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-5) var(--space-3);
  border: 1.5px solid var(--color-brand-a10);
  border-radius: var(--radius-lg);
  background: var(--color-brand-surface);
  cursor: pointer;
  transition: border-color 200ms ease-out, box-shadow 200ms ease-out, transform 150ms ease-out;
  text-align: center;
}

.surveys-inputs-descriptive-choice__card:hover {
  border-color: var(--color-brand-light);
  box-shadow: 0 0 0 3px var(--color-brand-a10);
  transform: translateY(-2px);
}

.surveys-inputs-descriptive-choice__card:active {
  transform: translateY(0);
  box-shadow: none;
}

.surveys-inputs-descriptive-choice__card--selected {
  border-color: var(--color-brand);
  box-shadow: 0 0 0 3px var(--color-brand-a20);
}

.surveys-inputs-descriptive-choice__icon {
  font-size: var(--font-size-2xl);
  line-height: 1;
}

.surveys-inputs-descriptive-choice__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.surveys-inputs-descriptive-choice__description {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  line-height: var(--line-height-relaxed);
}

@media (max-width: 767px) {
  .surveys-inputs-descriptive-choice {
    grid-template-columns: repeat(2, 1fr);
  }
}


/* fulgore: surveys/map.css */
.surveys-map {
  --stop-height: 40px;
  --badge-size: 24px;

  position: relative;
  padding: var(--space-6);
  border-radius: var(--radius-lg);
  background: var(--color-surface-subtle);
}

.surveys-map__list {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* ── SVG paths overlay ── */

.surveys-map__stops-wrapper {
  position: relative;
}

.surveys-map__paths {
  position: absolute;
  top: 0;
  left: 0;
  width: var(--badge-size);
  height: 100%;
  overflow: visible;
  pointer-events: none;
  z-index: 1;
}

.surveys-map__list {
  position: relative;
  z-index: 2;
}

/* ── Collapsible body ── */

.surveys-map__details {
  position: relative;
  z-index: 20;
  margin-top: var(--space-3);
}

.surveys-map__toggle {
  display: none;
}

.surveys-map__body {
  display: grid;
  grid-template-rows: 1fr;
  transition: grid-template-rows 400ms ease-out, opacity 400ms ease-out;
  opacity: 1;
}

.surveys-map__details:not([open]) .surveys-map__body {
  grid-template-rows: 0fr;
  opacity: 0;
}

.surveys-map__body > * {
  overflow: visible;
}

/* ── SVG path draw animation ── */

.surveys-map__segment {
  stroke-dasharray: var(--segment-length);
  stroke-dashoffset: var(--segment-length);
  animation: map-draw 500ms ease-out forwards;
}

.surveys-map__arc-segment {
  stroke-dasharray: var(--segment-length);
  stroke-dashoffset: var(--segment-length);
  animation: map-draw 800ms ease-in-out forwards;
  animation-delay: 200ms;
}

@keyframes map-draw {
  to { stroke-dashoffset: 0; }
}

/* Mobile — collapsed by default, toggle visible */
@media (max-width: 767px) {
  .surveys-map__toggle {
    display: block;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--color-brand);
    cursor: pointer;
    list-style: none;
    margin-bottom: var(--space-3);
  }

  .surveys-map__toggle::-webkit-details-marker {
    display: none;
  }

  .surveys-map__toggle::before {
    content: "▸ ";
  }

  .surveys-map__details[open] > .surveys-map__toggle::before {
    content: "▾ ";
  }
}


/* fulgore: surveys/map/arc.css */
/* Arc — loop-back indicator connecting a later stop back to an earlier one.
   Rendered as a left bracket with an arrow pointing up at the target. */

.surveys-map-arc {
  position: absolute;

  /* Vertical span: from target badge center to source badge center */
  top: calc(var(--space-6) + var(--space-3) + (var(--arc-to) + 0.5) * var(--stop-height));
  height: calc((var(--arc-from) - var(--arc-to)) * var(--stop-height));

  /* Horizontal: dedicated rail left of forks.
     Arc sits in the --arc-rail zone, forks sit in the --arc-indent zone. */
  left: 6px;
  right: calc(100% - var(--arc-rail) - var(--arc-indent) - var(--space-6) - var(--badge-size) / 2);

  /* Thinner than forks (2px vs 3px) to reduce visual noise */
  border: 2px solid var(--color-border);
  border-right: none;
  border-radius: var(--radius-md) 0 0 var(--radius-md);

  z-index: var(--arc-z);
  pointer-events: none;
}

/* Arrow pointing UP at the target stop */
.surveys-map-arc::before {
  content: "";
  position: absolute;
  top: -5px;
  right: -6px;

  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 6px solid var(--color-border);
}

/* Brand fill overlay — animates top-to-bottom (visual: "going back up") when loop is active */
.surveys-map-arc--active {
  border-color: var(--color-brand);
}

.surveys-map-arc--active::before {
  border-bottom-color: var(--color-brand);
}

.surveys-map-arc--active::after {
  content: "";
  position: absolute;
  top: -2px;
  left: -2px;
  bottom: -2px;
  right: 0;

  border: 2px solid var(--color-brand);
  border-right: none;
  border-radius: var(--radius-md) 0 0 var(--radius-md);

  clip-path: inset(100% 0 0 0);
  animation: arc-fill 800ms ease-out forwards;
  animation-delay: 400ms;
}

@keyframes arc-fill {
  0% { clip-path: inset(100% 0 0 0); }
  100% { clip-path: inset(0 0 0 0); }
}

/* Hide when map is collapsed on mobile */
@media (max-width: 767px) {
  .surveys-map__details:not([open]) ~ .surveys-map-arc {
    display: none;
  }
}


/* fulgore: surveys/map/fork.css */
/* Fork — left bracket connecting two badges (skip path) */

.surveys-map-fork {
  position: absolute;

  /* Top edge at fork-from badge center, bottom edge at fork-to badge center */
  top: calc(var(--space-6) + var(--space-3) + (var(--fork-from) + 0.5) * var(--stop-height));
  height: calc((var(--fork-to) - var(--fork-from)) * var(--stop-height));

  /* Left bracket in the arc-indent gutter (after the arc rail), right edge at badge center */
  left: calc(var(--arc-rail) + var(--space-6));
  right: calc(100% - var(--arc-rail) - var(--arc-indent) - var(--space-6) - var(--badge-size) / 2);

  border: 3px solid var(--color-border);
  border-right: none;
  border-radius: var(--radius-lg) 0 0 var(--radius-lg);
  z-index: 10;
}

/* Brand fill overlay — progressive top-to-bottom reveal when taken */
.surveys-map-fork--taken::after {
  content: "";
  position: absolute;
  top: -3px;
  left: -3px;
  bottom: -3px;
  right: 0;

  border: 3px solid var(--color-brand);
  border-right: none;
  border-radius: var(--radius-lg) 0 0 var(--radius-lg);

  clip-path: inset(0 0 100% 0);
  animation: fork-fill 1200ms ease-in-out forwards;
  animation-delay: 300ms;
}

@keyframes fork-fill {
  0% { clip-path: inset(0 0 100% 0); }
  100% { clip-path: inset(0 0 0 0); }
}

/* Hide when map is collapsed on mobile */
@media (max-width: 767px) {
  .surveys-map__details:not([open]) ~ .surveys-map-fork {
    display: none;
  }
}


/* fulgore: surveys/map/progress.css */
.surveys-map-progress {
  position: absolute;
  top: var(--space-4);
  right: var(--space-4);

  padding: var(--space-2) var(--space-3);
  border: 1.5px solid var(--color-brand-a10);
  border-radius: var(--radius-lg);
  background: var(--color-brand-surface);

  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  font-variant-numeric: tabular-nums;
  color: var(--color-brand);
}


/* fulgore: surveys/map/stop.css */
.surveys-map-stop {
  --badge-size: 24px;

  display: flex;
  align-items: center;
  gap: var(--space-3);
  height: var(--stop-height);
  position: relative;
}

/* ── Badge ── */

.surveys-map-stop__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;

  width: var(--badge-size);
  height: var(--badge-size);
  border-radius: var(--radius-full);

  position: relative;
  z-index: 20;

  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  line-height: 1;
}

/* ── Label ── */

.surveys-map-stop__label {
  font-size: var(--font-size-sm);
  line-height: var(--line-height-tight);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ── States ── */

/* Completed */
.surveys-map-stop--completed .surveys-map-stop__badge {
  background: var(--color-brand);
  color: var(--color-text-inverted);
}

.surveys-map-stop--completed .surveys-map-stop__label {
  color: var(--color-text-subtle);
}

.surveys-map-stop--completed .surveys-map-stop__badge .ui-icon {
  width: 14px;
  height: 14px;
}

/* Animated — pulse + check reveal (only on just-completed stop) */
.surveys-map-stop--animate .surveys-map-stop__badge {
  animation: badge-complete-pulse 250ms ease-out;
  animation-delay: calc(var(--stop-index, 0) * 150ms);
}

.surveys-map-stop--animate .surveys-map-stop__badge .ui-icon {
  opacity: 0;
  clip-path: inset(0 100% 0 0);
  animation: check-reveal 800ms ease-out forwards;
  animation-delay: calc(var(--stop-index, 0) * 150ms + 400ms);
}

@keyframes badge-complete-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.3); }
}

@keyframes check-reveal {
  0% {
    opacity: 0;
    clip-path: inset(0 100% 0 0);
  }
  20% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    clip-path: inset(0 0 0 0);
  }
}

/* Current */
.surveys-map-stop--current .surveys-map-stop__badge {
  background: var(--color-brand);
  color: var(--color-text-inverted);

  animation-name: badge-activate, survey-map-pulse;
  animation-duration: 300ms, 2s;
  animation-timing-function: ease-out, ease-in-out;
  animation-delay:
    calc(var(--stop-index, 0) * 150ms + 600ms),
    calc(var(--stop-index, 0) * 150ms + 900ms);
  animation-iteration-count: 1, infinite;
  animation-fill-mode: backwards, none;
}

@keyframes badge-activate {
  from {
    background: var(--color-surface-subtle);
    outline: 2px solid var(--color-border);
    outline-offset: -2px;
    color: transparent;
    box-shadow: none;
  }
  to {
    background: var(--color-brand);
    outline: 2px solid transparent;
    outline-offset: -2px;
    color: var(--color-text-inverted);
    box-shadow: none;
  }
}

.surveys-map-stop--current .surveys-map-stop__label {
  color: var(--color-text);
  font-weight: var(--font-weight-semibold);
}

@keyframes survey-map-pulse {
  0%, 100% {
    box-shadow: 0 0 0 0 var(--color-brand-a20);
  }
  50% {
    box-shadow: 0 0 0 6px var(--color-brand-a20);
  }
}

/* Upcoming */
.surveys-map-stop--upcoming .surveys-map-stop__badge {
  background: var(--color-surface-subtle);
  outline: 2px solid var(--color-border);
  outline-offset: -2px;
}

.surveys-map-stop--upcoming .surveys-map-stop__label {
  color: var(--color-text-disabled);
}

/* Skipped */
.surveys-map-stop--skipped .surveys-map-stop__badge {
  background: var(--color-surface-subtle);
  outline: 2px dashed var(--color-border);
  outline-offset: -2px;
}

.surveys-map-stop--skipped .surveys-map-stop__label {
  color: var(--color-text-disabled);
  text-decoration: line-through;
}

/* ── End stop ── */

.surveys-map-stop--end .surveys-map-stop__badge {
  width: calc(var(--badge-size) * 0.6);
  height: calc(var(--badge-size) * 0.6);
  margin-left: calc(var(--badge-size) * 0.2);
}

.surveys-map-stop--end.surveys-map-stop--completed .surveys-map-stop__badge {
  width: var(--badge-size);
  height: var(--badge-size);
  margin-left: 0;
  background: var(--color-success-surface);
  outline: none;
  font-size: var(--font-size-base);
  animation: tada-pop 600ms ease-out;
}

@keyframes tada-pop {
  0% { transform: scale(0); opacity: 0; }
  50% { transform: scale(1.4); opacity: 1; }
  70% { transform: scale(0.9); }
  100% { transform: scale(1); opacity: 1; }
}

.surveys-map-stop--end .surveys-map-stop__label {
  font-style: italic;
}


/* fulgore: surveys/question_forms/footer.css */
.surveys-question-forms-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: var(--space-6);
}

.surveys-question-forms-footer__submit {
  margin-left: auto;
}


/* fulgore: surveys/question_label.css */
.surveys-question-label {
  font-family: var(--font-family-display);
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-semibold);
  line-height: var(--line-height-tight);

  color: var(--color-text);

  margin-bottom: var(--space-6);
}


/* fulgore: surveys/question_layout.css */
.surveys-question-layout {
  display: grid;
  gap: var(--space-6);
}

.surveys-question-layout__context-block {
  padding: var(--space-5) var(--space-6);
  border: 1.5px solid var(--color-brand-a10);
  border-radius: var(--radius-lg);
  background: var(--color-brand-surface);
}

.surveys-question-layout__main {
  position: relative;
  z-index: 1;
}

/* ── Transitions ── */

.surveys-question-layout__main {
  opacity: 1;
}

@media (min-width: 768px) {
  .surveys-question-layout {
    grid-template-columns: 3fr 2fr;
    gap: var(--space-8);
  }

  .surveys-question-layout__main {
    grid-column: 1;
    grid-row: 1 / 3;
  }

  .surveys-map {
    grid-column: 2;
  }

  .surveys-question-layout__context-block {
    grid-column: 2;
  }
}

@media (min-width: 1440px) {
  .surveys-question-layout {
    grid-template-columns: 1fr 280px 280px;
  }

  .surveys-question-layout__main {
    grid-row: auto;
  }

  .surveys-map {
    grid-column: auto;
  }

  .surveys-question-layout__context-block {
    grid-column: auto;
  }
}


/* fulgore: ui/bases/button.css */
.ui-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-5);
  border-radius: var(--radius-md);
  font-family: var(--font-family-base);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  line-height: 1;
  cursor: pointer;
  border: 1.5px solid transparent;
  text-decoration: none;
  white-space: nowrap;
  user-select: none;
  transition:
    background var(--duration-fast) var(--easing-default),
    color var(--duration-fast) var(--easing-default),
    border-color var(--duration-fast) var(--easing-default),
    box-shadow var(--duration-fast) var(--easing-default),
    opacity var(--duration-fast) var(--easing-default);

  .svg {
    height: var(--space-4);
    fill: currentColor;
  }

  &:focus-visible {
    outline: none;
    box-shadow: var(--focus-ring);
  }

  

  &.ui-button--primary {
    background: var(--color-brand);
    color: var(--color-text-inverted);
    border-color: var(--color-brand);

    &:hover:not(:disabled):not(.ui-button--disabled) {
      background: var(--color-brand-dark);
      border-color: var(--color-brand-dark);
    }

    &:active:not(:disabled):not(.ui-button--disabled) {
      background: var(--color-brand-dark);
      box-shadow: none;
    }
  }

  &.ui-button--secondary {
    background: transparent;
    color: var(--color-brand);
    border-color: var(--color-brand);

    &:hover:not(:disabled):not(.ui-button--disabled) {
      background: var(--color-brand-surface);
    }
  }

  &.ui-button--danger {
    background: var(--color-danger);
    color: var(--color-text-inverted);
    border-color: var(--color-danger);

    &:hover:not(:disabled):not(.ui-button--disabled) {
      background: var(--color-danger-dark);
      border-color: var(--color-danger-dark);
    }

    &:active:not(:disabled):not(.ui-button--disabled) {
      background: var(--color-danger-dark);
      box-shadow: none;
    }

    &:focus-visible {
      box-shadow: var(--focus-ring-danger);
    }
  }

  &.ui-button--ghost {
    background: transparent;
    color: var(--color-text-subtle);
    border-color: transparent;

    &:hover:not(:disabled):not(.ui-button--disabled) {
      background: var(--color-surface-raised);
      color: var(--color-text);
    }

    &:focus-visible {
      box-shadow: var(--focus-ring-neutral);
    }
  }

  

  &.ui-button--sm {
    font-size: var(--font-size-xs);
    padding: var(--space-1) var(--space-3);
  }

  &.ui-button--lg {
    font-size: var(--font-size-base);
    padding: var(--space-3) var(--space-6);
  }

  

  &:disabled,
  &.ui-button--disabled {
    opacity: 0.45;
    cursor: not-allowed;
    pointer-events: none;
  }
}


/* fulgore: ui/bases/card.css */
.ui-bases-card {
  margin-inline: auto;
  padding: var(--space-8);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  background: var(--color-surface);
}

.ui-bases-card__heading {
  display: grid;
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
  grid-template-columns: min-content auto;
  align-items: end;
}

.ui-bases-card__title {
  font: inherit;
}

.ui-bases-card__details {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: start;
  gap: var(--space-2) var(--space-6);
}

@media (max-width: 480px) {
  .ui-bases-card {
    padding: var(--space-4);
  }

  .ui-bases-card__details {
    grid-template-columns: 1fr;
  }
}


/* fulgore: ui/bases/card_row.css */
.ui-bases-card-row__dt {
  grid-column: 1;
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  font-weight: var(--font-weight-medium);
}

.ui-bases-card-row__dd {
  grid-column: 2;
  margin: 0;
  font-size: var(--font-size-sm);
}

@media (max-width: 480px) {
  .ui-bases-card-row__dt {
    grid-column: auto;
  }

  .ui-bases-card-row__dd {
    grid-column: auto;
  }
}


/* fulgore: ui/bases/context_block.css */
.ui-bases-context-block {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-5) var(--space-6);
  border: 1.5px solid var(--color-brand-a10);
  border-radius: var(--radius-lg);
  background: var(--color-brand-surface);

  .ui-bases-context-block__heading {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-semibold);
    color: var(--color-brand);
  }

  .ui-bases-context-block__description {
    font-size: var(--font-size-sm);
    color: var(--color-text-subtle);
  }

  .ui-bases-context-block__list {
    margin: 0;
    padding-left: var(--space-5);

    & li {
      font-size: var(--font-size-sm);
      color: var(--color-text-subtle);
      margin-bottom: var(--space-1);
    }
  }
}

.ui-bases-context-block--warning {
  background: var(--color-warning-surface);
  border-color: var(--color-warning-a10);
  margin-bottom: var(--space-6);

  .ui-bases-context-block__heading {
    color: var(--color-warning);
  }
}


/* fulgore: ui/bases/edit.css */
.ui-bases-edit__header {
  margin-block-end: var(--space-6);
}

.ui-bases-edit__body {
}


/* fulgore: ui/bases/filter_bar.css */
.ui-filter-bar__fields {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  flex-wrap: wrap;
}

.filter-field__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
  margin-right: var(--space-2);
}

.filter-search-wrapper {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.filter-search {
  padding: var(--space-2) var(--space-8) var(--space-2) var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  font-size: var(--font-size-sm);
  background: var(--color-surface);
  color: var(--color-text);
  min-width: 16rem;

  &:focus {
    outline: none;
    border-color: var(--color-brand);
  }
}

.filter-search-clear {
  position: absolute;
  right: var(--space-2);
  display: none;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  background: var(--color-neutral-300);
  color: var(--color-neutral-700);
  border: none;
  border-radius: 999px;
  font-size: var(--font-size-xs);
  line-height: 1;
  cursor: pointer;
  padding: 0;

  &:hover {
    background: var(--color-neutral-400);
  }
}

.filter-search:not(:placeholder-shown) ~ .filter-search-clear {
  display: flex;
}

.filter-field--multi-select {
  display: flex;
  align-items: center;
}

.filter-multi-select {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}

.filter-multi-select__option {
  display: inline-flex;
  align-items: center;
  padding: var(--space-1) var(--space-3);
  border-radius: 999px;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  border: 1px solid var(--color-border);
  background: var(--color-surface);
  color: var(--color-text-subtle);
  cursor: pointer;
  transition: background var(--duration-fast), color var(--duration-fast), border-color var(--duration-fast);

  input[type="checkbox"] {
    display: none;
  }

  &:hover {
    border-color: var(--color-brand);
    color: var(--color-brand);
  }

  &.is-active {
    background: var(--color-brand-surface);
    border-color: var(--color-brand);
    color: var(--color-brand);
    font-weight: var(--font-weight-semibold);
  }
}

.filter-multi-select__option.is-active.ui-pill--violet {
  background: var(--color-violet-100);
  color: var(--color-violet-700);
  border-color: var(--color-violet-100);
}

.filter-multi-select__option.is-active.ui-pill--blue {
  background: var(--color-blue-100);
  color: var(--color-blue-700);
  border-color: var(--color-blue-100);
}

.filter-multi-select__option.is-active.ui-pill--green {
  background: var(--color-green-100);
  color: var(--color-green-700);
  border-color: var(--color-green-100);
}

.filter-multi-select__option.is-active.ui-pill--red {
  background: var(--color-red-100);
  color: var(--color-red-700);
  border-color: var(--color-red-100);
}

.filter-field--switch {
  display: flex;
  align-items: center;
}

.filter-switch {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  cursor: pointer;

  input[type="checkbox"] {
    width: 1rem;
    height: 1rem;
    accent-color: var(--color-brand);
    cursor: pointer;
  }
}


/* fulgore: ui/bases/form.css */
.ui-bases-form {
  form {
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
  }
}

.ui-form {
  display: grid;

  .ui-input + .ui-input {
    margin-top: var(--space-6);
  }
}

.form-error-summary {
  padding: var(--space-3) var(--space-4);
  background: var(--color-danger-a10);
  border: 1.5px solid var(--color-danger);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-4);

  .form-error-summary__title {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--color-danger);
    margin-bottom: var(--space-2);
  }

  ul {
    margin: 0;
    padding-left: var(--space-4);

    li {
      font-size: var(--font-size-sm);
      color: var(--color-danger);
    }
  }
}

.form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin-top: var(--space-6);
  justify-content: flex-end;
}


/* fulgore: ui/bases/input.css */
.ui-input {
  display: grid;
  gap: var(--space-2);

  label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--color-text);
  }

  input,
  textarea {
    width: 100%;
    padding: var(--space-3) var(--space-4);
    font-family: var(--font-family-base);
    font-size: var(--font-size-base);
    color: var(--color-text);
    background: var(--color-surface);
    border: 1.5px solid var(--color-border);
    border-radius: var(--radius-md);
    outline: none;
    box-sizing: border-box;
    transition:
      border-color var(--duration-fast) var(--easing-default),
      box-shadow var(--duration-fast) var(--easing-default);

    &::placeholder {
      color: var(--color-text-disabled);
    }

    &:focus {
      border-color: var(--color-brand);
      box-shadow: var(--focus-ring);
    }
  }

  textarea {
    resize: vertical;
    min-height: 6rem;
    line-height: var(--line-height-normal);
  }

  .ui-input__required {
    color: var(--color-danger);
    margin-left: var(--space-1);
  }

  .ui-input__hint {
    font-size: var(--font-size-xs);
    color: var(--color-text-subtle);
  }

  .ui-input__error {
    font-size: var(--font-size-xs);
    color: var(--color-danger);
  }

  

  &.ui-input--error {
    label {
      color: var(--color-danger);
    }

    input,
    textarea {
      border-color: var(--color-danger);

      &:focus {
        box-shadow: 0 0 0 3px var(--color-danger-a10);
      }
    }
  }

  

  &.ui-input--disabled {
    opacity: 0.5;
    cursor: not-allowed;

    input,
    textarea {
      cursor: not-allowed;
    }
  }
}


/* fulgore: ui/bases/list.css */
.ui-bases-list {
  padding: var(--space-8);
  display: grid;
  gap: var(--space-6);

  h1 {
    margin: 0;
  }
}

.ui-list-sort-disabled-notice {
  margin: var(--space-2) 0 0;
  color: var(--color-text-subtle);
  font-size: var(--font-size-sm);
}

.ui-list-table-wrapper {
  overflow-x: auto;
}

.ui-list-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;

  th,
  td {
    white-space: nowrap;
    padding: var(--space-3) var(--space-4);
    text-align: left;
    vertical-align: middle;
    border-bottom: 1px solid var(--color-border);
    font-size: var(--font-size-sm);
  }

  th {
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-subtle);
    font-size: var(--font-size-sm);
  }

  .ui-list-table__th--sortable {
    padding: 0;
  }

  .ui-col--spacer {
    width: 100%;
  }

  .ui-list-table__th--right {
    text-align: right;
  }

  .sort-link {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    padding: var(--space-3) var(--space-4);
    color: var(--color-text-subtle);
    text-decoration: none;
    white-space: nowrap;

    &:hover {
      color: var(--color-brand);
    }

    &.sort-link--active {
      color: var(--color-brand);
    }
  }

  .sort-arrow {
    font-size: var(--font-size-xs);
    opacity: 0.5;
  }

  .sort-link--active .sort-arrow {
    opacity: 1;
  }

  .ui-list-table__th--actions,
  .ui-list-table__td--actions,
  .ui-bases-row__actions {
    position: sticky;
    right: 0;
    background: var(--color-surface);
    box-shadow: -4px 0 8px -2px rgb(0 0 0 / 0.04);
  }

}

@media (min-width: 1025px) {
  .ui-list-table {
    .ui-list-table__th--actions,
    .ui-list-table__td--actions,
    .ui-bases-row__actions {
      box-shadow: none;
    }
  }
}

@media (max-width: 1024px) {
  .ui-list-table .ui-col--optional {
    display: none;
  }
}

@media (max-width: 768px) {
  .ui-list-table {
    thead {
      display: none;
    }

    .ui-col--optional,
    .ui-col--important {
      display: flex;
    }

    tbody tr {
      display: block;
      width: 100%;
      box-sizing: border-box;
      border: 1px solid var(--color-border);
      border-radius: var(--radius-md);
      margin-bottom: var(--space-3);
      padding: var(--space-2);
      box-shadow: var(--shadow-md);
    }

    td {
      display: flex;
      width: 100%;
      box-sizing: border-box;
      justify-content: space-between;
      align-items: center;
      border-bottom: 1px solid var(--color-border);
      white-space: normal;
    }


    td:last-child {
      border-bottom: none;
    }

    .ui-col--spacer {
      display: none;
    }

    td::before {
      content: attr(data-label);
      font-weight: var(--font-weight-semibold);
      color: var(--color-text-subtle);
      font-size: var(--font-size-sm);
      flex-shrink: 0;
      margin-right: var(--space-3);
    }

    .ui-list-table__td--actions {
      position: static;
      box-shadow: none;
    }
  }
}

@media (max-width: 480px) {
  .ui-bases-list {
    padding: var(--space-3);
  }
}


/* fulgore: ui/bases/modal.css */
.ui-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: var(--z-modal);
  align-items: center;
  justify-content: center;

  &.is-open {
    display: flex;

    .ui-modal__backdrop {
      animation: fade-in var(--duration-normal) var(--easing-out) both;
    }

    .ui-modal__dialog {
      animation: scale-in var(--duration-normal) var(--easing-spring) both;
    }
  }
}

.ui-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.ui-modal__dialog {
  position: relative;
  white-space: normal;
  background: var(--color-surface);
  border-radius: var(--radius-xl);
  padding: var(--space-8);
  width: 100%;
  max-width: 32rem;
  max-height: calc(100vh - var(--space-8) * 2);
  margin: var(--space-4);
  box-shadow: var(--shadow-xl);
  overflow-x: hidden;
  overflow-y: auto;
}

@media (max-width: 1023px) {
  .ui-modal {
    padding-top: var(--navbar-height);
  }

  .ui-modal__dialog {
    max-height: calc(100vh - var(--navbar-height) - var(--space-8));
  }
}

.ui-modal__dialog > .ui-button {
  position: absolute;
  top: var(--space-4);
  right: var(--space-4);
}

.ui-modal__body {
  max-width: 100%;
  overflow-wrap: break-word;
  text-align: center;
}

.ui-modal__header {
  margin-bottom: var(--space-4);
  text-align: center;
}

.ui-modal__footer {
  margin-top: var(--space-6);
}

.ui-modal__footer .form-actions {
  justify-content: center;
}

.ui-modal__footer .form-actions:has(> :nth-child(2)) {
  justify-content: space-between;
}

@media (max-width: 480px) {
  .ui-modal__dialog {
    padding: var(--space-5);
    margin: var(--space-2);
  }
}


/* fulgore: ui/bases/navbar.css */
.ui-bases-navbar {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--space-4);
  height: var(--navbar-height);
  padding: var(--space-1) var(--space-4);
  box-sizing: border-box;
  align-items: center;
  background: var(--color-brand);
  color: var(--color-text-inverted);
  position: sticky;
  top: 0;
  z-index: var(--z-sticky);
}

.ui-bases-navbar a {
  display: block;
  color: inherit;
  text-decoration: none;
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  transition: background var(--duration-fast) var(--easing-default);
}

.ui-bases-navbar a:hover {
  background: rgba(255, 255, 255, 0.15);
}

/* ── Left section ── */

.navbar-left {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.navbar-brand {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  color: inherit;
  text-decoration: none;
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  transition: background var(--duration-fast) var(--easing-default);
  width: fit-content;
}

.navbar-brand:hover {
  background: rgba(255, 255, 255, 0.15);
}

.navbar-brand svg {
  width: 2rem;
  height: 2rem;
  flex-shrink: 0;
}

/* ── Hamburger ── */

.navbar-hamburger {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border: none;
  background: transparent;
  border-radius: var(--radius-md);
  color: var(--color-text-inverted);
  cursor: pointer;
  transition: background var(--duration-fast) var(--easing-default);
}

.navbar-hamburger:hover {
  background: rgba(255, 255, 255, 0.15);
}

.navbar-hamburger:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

/* ── Right section ── */

.navbar-actions {
  display: flex;
  gap: var(--space-3);
  align-items: center;
}

/* ── Responsive ── */

@media (max-width: 1023px) {
  .ui-bases-navbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
  }
}


/* fulgore: ui/bases/new.css */
.ui-bases-new__header {
  margin-block-end: var(--space-6);
}

.ui-bases-new__body {
}


/* fulgore: ui/bases/page_header.css */
.page-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin-bottom: var(--space-6);
}

.page-title {
  align-items: center;
}

.page-header--size-md .page-title {
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  margin: 0;
}

.page-header--size-sm .page-title {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  margin: 0;
}

@media (max-width: 480px) {
  .page-header {
    flex-direction: column;
    gap: var(--space-3);
  }
}


/* fulgore: ui/bases/progress_bar.css */
.ui-bases-progress-bar {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.ui-bases-progress-bar__label {
  margin: 0;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
}

.ui-bases-progress-bar__track {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.ui-bases-progress-bar__bar {
  flex: 1;
  height: var(--space-2);
  border-radius: var(--radius-full);
  background-color: var(--color-surface-subtle);
  overflow: hidden;
}

.ui-bases-progress-bar__fill {
  height: 100%;
  border-radius: var(--radius-full);
  background-color: var(--color-text-subtle);
  transition: width var(--duration-normal) var(--easing-default);
}

.ui-bases-progress-bar--brand .ui-bases-progress-bar__fill {
  background-color: var(--color-brand);
}

.ui-bases-progress-bar--accent .ui-bases-progress-bar__fill {
  background-color: var(--color-accent);
}

.ui-bases-progress-bar--sm .ui-bases-progress-bar__bar {
  height: var(--space-1);
}

.ui-bases-progress-bar--sm .ui-bases-progress-bar__percentage {
  font-size: var(--font-size-xs);
}

.ui-bases-progress-bar__percentage {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  font-variant-numeric: tabular-nums;
  min-width: 3ch;
  text-align: right;
}


/* fulgore: ui/bases/record_view.css */
.ui-bases-record-view__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  margin-bottom: var(--space-6);
}

.ui-bases-record-view__title-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  margin: var(--space-6) 0 var(--space-8) 0;
}

.ui-bases-record-view__body {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-6);
  align-items: start;
}

.ui-bases-record-view__body > :only-child {
  grid-column: 1 / -1;
  max-width: 48rem;
  margin-inline: auto;
  width: 100%;
}

.ui-bases-record-view__body > .ui-bases-record-view__layout {
  max-width: none;
  margin-inline: 0;
}

/* ── Layout (used by Show/Edit body_content) ── */

.ui-bases-record-view__layout {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

/* ── Row (2-column grid) ── */

.ui-bases-record-view__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-6);
  align-items: start;
}

@media (max-width: 768px) {
  .ui-bases-record-view__body {
    grid-template-columns: 1fr;
  }

  .ui-bases-record-view__row {
    grid-template-columns: 1fr;
  }
}


/* fulgore: ui/bases/record_view_title.css */
.ui-bases-record-view-title {
  font-family: var(--font-family-display);
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-semibold);
  line-height: var(--line-height-tight);
  color: var(--color-text);
  margin: 0;
}


/* fulgore: ui/bases/row.css */
.ui-bases-row__actions-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
}

@media (max-width: 480px) {
  .ui-bases-row__actions-inner {
    justify-content: flex-end;
    flex-wrap: wrap;
  }
}


@keyframes position-flip {
  0%   { transform: perspective(120px) rotateX(0deg);   opacity: 1; }
  45%  { transform: perspective(120px) rotateX(-90deg); opacity: 0; }
  55%  { transform: perspective(120px) rotateX(-90deg); opacity: 0; }
  100% { transform: perspective(120px) rotateX(0deg);   opacity: 1; }
}

.ui-bases-row__position {
  color: var(--color-text-subtle);
  font-size: var(--font-size-sm);
  user-select: none;
}

.ui-bases-row__position.is-flipping {
  animation: position-flip 300ms ease-in-out;
  will-change: transform;
}

.ui-bases-row__grip {
  width: 1.25rem;
  padding-right: 0;
  color: var(--color-text-subtle);
  user-select: none;
  cursor: grab;

  &:active {
    cursor: grabbing;
  }
}

tr[draggable="true"] {
  cursor: grab;

  
  & td:not(:has(a, button)) {
    cursor: grab;
  }

  &:active,
  &:active td:not(:has(a, button)) {
    cursor: ns-resize;
  }
}

tr.sortable--dragging,
tr.sortable--dragging td {
  cursor: ns-resize;
}

tr.sortable--dragging {
  opacity: 0.7;
  background: var(--color-surface-raised);
  outline: 1.5px dashed var(--color-border-strong);
  outline-offset: -1px;
  box-shadow: var(--shadow-md);
}


/* fulgore: ui/bases/show.css */
.ui-bases-show__header {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  margin-block-end: var(--space-6);

  .ui-links-back {
    margin-block: 0;
  }
}

.ui-bases-show__body {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: start;
  gap: var(--space-8);
}

.ui-bases-show__list {
  width: 100%;
  margin-block-start: var(--space-8);
}

.ui-bases-show__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-block-start: var(--space-8);
}

@media (max-width: 767px) {
  .ui-bases-show__body {
    grid-template-columns: 1fr;
  }

  .ui-bases-show__header {
    grid-template-columns: 1fr;
  }
}


/* fulgore: ui/bases/sidebar.css */
.sidebar {
  position: fixed;
  top: var(--navbar-height);
  left: 0;
  bottom: 0;
  width: var(--sidebar-width);
  background: var(--color-surface);
  border-right: 1px solid var(--color-border);
  padding: var(--space-4) 0;
  overflow-y: auto;
  z-index: var(--z-raised);
  box-sizing: border-box;
}

.sidebar nav {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.sidebar-link {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-5);
  color: var(--color-text-subtle);
  text-decoration: none;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  transition: background var(--duration-fast), color var(--duration-fast);
  border-left: 3px solid transparent;
}

.sidebar-link:hover {
  background: var(--color-surface-subtle);
  color: var(--color-text);
}

.sidebar-link:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

.sidebar-link svg {
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;
}

.sidebar-link--active {
  color: var(--color-brand);
  background: var(--color-brand-surface);
  border-left-color: var(--color-brand);
  font-weight: var(--font-weight-semibold);
}

/* ── Responsive ── */

@media (max-width: 1023px) {
  .sidebar {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sidebar-link {
    transition: none;
  }
}


/* fulgore: ui/bases/stat_card.css */
.ui-stat-card {
  padding: var(--space-8);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  background: var(--color-surface);
}

.ui-stat-card__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4);
  margin-bottom: var(--space-4);
}

.ui-stat-card__title {
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-bold);
  line-height: 1.2;
  margin: 0;
}


/* fulgore: ui/bases/step_footer.css */
.ui-bases-step-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;

  > form {
    display: flex;
  }

  > :only-child {
    margin-inline-start: auto;
  }
}


/* fulgore: ui/bases/stepper.css */
.ui-bases-stepper {
  width: 100%;
  padding: var(--space-4) 0 var(--space-3);
  margin-block-end: var(--space-6);
}

.ui-bases-stepper__list {
  display: flex;
  align-items: flex-start;
  list-style: none;
  margin: 0;
  padding: 0;
}

.ui-bases-stepper__step {
  display: flex;
  align-items: center;
  flex: 1;
  min-width: 0;
  position: relative;

  &:not(:last-child)::after {
    content: "";
    position: absolute;
    top: calc(var(--stepper-badge-size) / 2 - 2px);
    left: 25px;
    right: -25px;
    height: 7px;
    background: var(--color-border);
    z-index: 0;
  }
}

.ui-bases-stepper__step:last-child {
  flex: 0 0 auto;
}

.ui-bases-stepper__step form {
  display: contents;
}

.ui-bases-stepper__anchor {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-1);
  text-decoration: none;
  flex-shrink: 0;
  position: relative;
  z-index: 1;
}

.ui-bases-stepper__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--stepper-badge-size);
  height: var(--stepper-badge-size);
  border-radius: var(--radius-full);
  border: 1.5px solid var(--color-border);
  background: var(--color-surface-raised);
  position: relative;
  z-index: 1;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  font-family: var(--font-family-base);
  color: var(--color-text-disabled);
  transition:
    background var(--duration-fast) var(--easing-default),
    border-color var(--duration-fast) var(--easing-default),
    color var(--duration-fast) var(--easing-default),
    box-shadow var(--duration-fast) var(--easing-default);

  & svg {
    display: block;
    width: 12px;
    height: 12px;
    flex-shrink: 0;
  }
}

.ui-bases-stepper__label {
  font-size: var(--font-size-xs);
  font-family: var(--font-family-base);
  color: var(--color-text-disabled);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 80px;
  transition: color var(--duration-fast) var(--easing-default);
}

.ui-bases-stepper__connector {
  flex: 1;
  height: 4px;
  background: transparent;
  margin: 0;
  align-self: flex-start;
  position: relative;
  z-index: 0;
}

.ui-bases-stepper__step--in-progress .ui-bases-stepper__badge {
  background: var(--color-brand);
  border-color: var(--color-brand);
  color: var(--color-text-inverted);
  box-shadow: 0 0 0 3px var(--color-brand-a20);
}

.ui-bases-stepper__step--in-progress .ui-bases-stepper__label {
  color: var(--color-text);
  font-weight: var(--font-weight-semibold);
}

.ui-bases-stepper__step--completed .ui-bases-stepper__badge {
  background: var(--color-brand-surface);
  border-color: var(--color-brand);
  color: var(--color-brand);
}

.ui-bases-stepper__step--completed .ui-bases-stepper__label {
  color: var(--color-text-subtle);
}

.ui-bases-stepper__step--completed:not(:last-child)::after {
  background: var(--color-brand);
}

.ui-bases-stepper__step--blocked .ui-bases-stepper__badge {
  background: var(--color-warning-surface);
  border-color: var(--color-warning);
  color: var(--color-warning);
}

.ui-bases-stepper__step--blocked .ui-bases-stepper__label {
  color: var(--color-text-subtle);
}

.ui-bases-stepper--vertical {
  width: auto;
  padding: var(--space-4) 0;
}

.ui-bases-stepper--vertical .ui-bases-stepper__list {
  flex-direction: column;
  align-items: stretch;
  gap: 0;
}

.ui-bases-stepper--vertical .ui-bases-stepper__step {
  display: grid;
  grid-template-columns: var(--stepper-badge-size) 1fr;
  grid-template-rows: var(--stepper-badge-size) auto;
  column-gap: var(--space-3);
  align-items: start;
  flex: none;
  min-width: 0;

  &:not(:last-child)::after {
    top: calc(var(--stepper-badge-size) / 2);
    bottom: calc(var(--stepper-badge-size) / -2);
    right: auto;
    left: 12px;
    width: 7px;
    height: auto;
  }
}

.ui-bases-stepper--vertical .ui-bases-stepper__connector {
  grid-column: 1;
  grid-row: 2;
  width: 4px;
  height: var(--space-6);
  background: transparent;
  justify-self: center;
  flex: none;
  align-self: start;
  position: relative;
  z-index: 0;
}

.ui-bases-stepper--vertical .ui-bases-stepper__anchor {
  grid-column: 1 / -1;
  grid-row: 1;
  display: grid;
  grid-template-columns: var(--stepper-badge-size) 1fr;
  column-gap: var(--space-3);
  align-items: center;
}

.ui-bases-stepper--vertical .ui-bases-stepper__badge {
  grid-column: 1;
  flex-shrink: 0;
  position: relative;
  z-index: 1;
  overflow: visible;
}

.ui-bases-stepper--vertical .ui-bases-stepper__label {
  grid-column: 2;
  font-size: var(--font-size-sm);
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  max-width: none;
}

.ui-bases-stepper--vertical .ui-bases-stepper__step--completed:not(:last-child)::after {
  background: var(--color-brand);
}

@media (max-width: 765px) {
  .ui-bases-stepper__label {
    display: none;
  }
}

@media (max-width: 480px) {
  .ui-bases-stepper__list {
    display: none;
  }

  .ui-bases-stepper__compact {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    align-items: center;
  }

  .ui-bases-stepper__compact-label {
    font-size: var(--font-size-sm);
    color: var(--color-text-subtle);
  }

  .ui-bases-stepper__compact-label strong {
    color: var(--color-text);
    font-weight: var(--font-weight-semibold);
  }

  .ui-bases-stepper__progress-bar {
    width: 100%;
    height: 4px;
    background: var(--color-border);
    border-radius: var(--radius-full);
    overflow: hidden;
  }

  .ui-bases-stepper__progress-fill {
    height: 100%;
    background: var(--color-brand);
    border-radius: var(--radius-full);
    transition: width var(--duration-slow) var(--easing-out);
  }
}

@media (min-width: 481px) {
  .ui-bases-stepper__compact {
    display: none;
  }
}


/* fulgore: ui/bases/sub_list.css */
.ui-bases-sub-list {
  background: var(--color-surface);
  border-radius: var(--radius-md);

  .ui-list-table__th--actions,
  .ui-list-table__td--actions,
  .ui-bases-row__actions {
    background: transparent;
  }
}

.ui-bases-sub-list__empty {
  padding: var(--space-3) var(--space-4);
  margin: 0;
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}


/* fulgore: ui/bases/view_actions.css */
.ui-bases-view-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-2);
}


/* fulgore: ui/buttons/switch.css */
.ui-buttons-switch {
  display: inline-flex;
  cursor: pointer;
  align-items: center;

  form,
  button {
    display: contents;
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    cursor: pointer;
  }
}

.ui-buttons-switch__track {
  position: relative;
  display: inline-flex;
  align-items: center;
  width: 2.75rem;
  height: 1.5rem;
  border-radius: var(--radius-full);
  background-color: var(--color-border);
  transition: background-color var(--duration-slow) var(--easing-default);
  padding: 0 var(--space-1);
  box-sizing: border-box;
  box-shadow:
    inset 0 2px 4px rgba(0, 0, 0, 0.18),
    inset 0 1px 2px rgba(0, 0, 0, 0.10);
}

.ui-buttons-switch--checked .ui-buttons-switch__track {
  background-color: var(--color-brand);
}

.ui-buttons-switch__thumb {
  position: absolute;
  left: var(--space-1);
  width: 1.25rem;
  height: 1.25rem;
  border-radius: var(--radius-full);
  background: radial-gradient(circle at 35% 30%, #ffffff, #c8c8c8);
  box-shadow:
    0 2px 4px rgba(0, 0, 0, 0.22),
    0 1px 2px rgba(0, 0, 0, 0.14),
    0 0 0 1px rgba(0, 0, 0, 0.06);
  transition:
    transform var(--duration-slow) var(--easing-spring),
    width var(--duration-fast) var(--easing-out);
}

.ui-buttons-switch--checked .ui-buttons-switch__thumb {
  transform: translateX(1rem);
}

.ui-buttons-switch:active .ui-buttons-switch__thumb {
  width: 1.5rem;
}


/* fulgore: ui/chat/bubble.css */
.ui-chat-bubble {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  max-width: 75%;
}

.ui-chat-bubble--sent {
  align-self: flex-end;
  align-items: flex-end;
}

.ui-chat-bubble--received {
  align-self: flex-start;
  align-items: flex-start;
}

.ui-chat-bubble__author {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.ui-chat-bubble__meta {
  display: flex;
  justify-content: flex-end;
}

.ui-chat-bubble__time {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

.ui-chat-bubble__body {
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-lg);
  font-size: var(--font-size-sm);
  line-height: var(--line-height-relaxed);
  word-break: break-word;
}

.ui-chat-bubble--sent .ui-chat-bubble__body {
  background: var(--color-brand-surface);
  color: var(--color-text);
  border-bottom-right-radius: var(--radius-sm);
}

.ui-chat-bubble--received .ui-chat-bubble__body {
  background: var(--color-surface-subtle);
  color: var(--color-text);
  border-bottom-left-radius: var(--radius-sm);
}


/* fulgore: ui/chat/conversation_item.css */
.ui-chat-conversation-item {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: var(--space-3);
  align-items: center;
  padding: var(--space-3) var(--space-4);
  text-decoration: none;
  color: var(--color-text);
  border-radius: var(--radius-md);
  transition: background var(--duration-fast) var(--easing-default);

  &:hover {
    background: var(--color-surface-raised);
  }

  &--unread {
    background: var(--color-brand-surface);

    &:hover {
      background: var(--color-brand-a10);
    }

    .ui-chat-conversation-item__names {
      font-weight: var(--font-weight-semibold);
    }

    .ui-chat-conversation-item__preview {
      color: var(--color-text);
    }
  }
}

/* --- Avatars --- */

.ui-chat-conversation-item__avatars {
  display: flex;
  flex-direction: row;
  align-items: center;
  align-self: center;
}

.ui-chat-conversation-item__avatar {
  margin-left: -6px;

  &:first-child {
    margin-left: 0;
  }

  .ui-user-badge {
    gap: 0;
  }

  .ui-user-badge__text {
    display: none;
  }

  .ui-user-badge__circle {
    width: 1.75rem !important;
    height: 1.75rem !important;
    font-size: 0.6875rem !important;
    border: 2px solid var(--color-surface);
  }
}

/* --- Content --- */

.ui-chat-conversation-item__content {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.ui-chat-conversation-item__header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-2);
}

.ui-chat-conversation-item__names {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ui-chat-conversation-item__time {
  font-size: 0.625rem;
  color: var(--color-text-subtle);
  white-space: nowrap;
  flex-shrink: 0;
}

.ui-chat-conversation-item__subject {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ui-chat-conversation-item__preview {
  margin: 0;
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* --- Unread badge --- */

.ui-chat-conversation-item__unread-badge {
  display: inline-block;
  min-width: 1.25rem;
  height: 1.25rem;
  line-height: 1.25rem;
  padding-inline: 5px;
  border-radius: var(--radius-full);
  background: var(--color-danger);
  color: var(--color-text-inverted);
  font-family: system-ui, -apple-system, sans-serif;
  font-size: 0.6875rem;
  font-weight: 600;
  text-align: center;
  font-variant-numeric: tabular-nums;
  align-self: center;
}


/* fulgore: ui/chat/empty_state.css */
.ui-chat-empty-state {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-3);
  padding: var(--space-8);
  color: var(--color-text-subtle);

  .svg {
    width: var(--icon-size-lg);
    height: var(--icon-size-lg);
    opacity: 0.4;
  }
}

.ui-chat-empty-state__text {
  margin: 0;
  font-size: var(--font-size-sm);
  text-align: center;
}


/* fulgore: ui/chat/input.css */
.ui-chat-input {
  flex-shrink: 0;
  border-top: 1px solid var(--color-border);
  padding: var(--space-3) var(--space-4);
}

.ui-chat-input__form {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

.ui-chat-input__textarea {
  flex: 1;
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  font-size: 16px;
  font-family: inherit;
  resize: none;
  outline: none;
  transition: border-color var(--duration-fast) var(--easing-default);

  &:focus {
    border-color: var(--color-brand);
    box-shadow: var(--focus-ring);
  }
}

.ui-chat-input__submit {
  padding: var(--space-2) var(--space-4);
  border: none;
  border-radius: var(--radius-lg);
  background: var(--color-brand);
  color: var(--color-text-inverted);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--duration-fast) var(--easing-default);

  &:hover {
    background: var(--color-brand-dark);
  }

  &:focus-visible {
    outline: none;
    box-shadow: var(--focus-ring);
  }

  &:disabled {
    opacity: 0.6;
    cursor: not-allowed;
  }
}


/* fulgore: ui/chat/list.css */
.ui-chat-list {
  flex: 1;
  min-height: 20rem;
  max-height: 60vh;
  overflow-y: auto;
  padding: var(--space-4);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.ui-chat-list[data-full-height="true"] {
  min-height: 0;
  max-height: none;
}


/* fulgore: ui/display/code.css */
.code-container {
  display: grid;
  user-select: text;
}

/* ── Toggle button ── */

.code-container .collapse-toggle {
  background-color: var(--color-neutral-900);
  border: 1px solid var(--color-neutral-900);
  border-radius: var(--radius-lg);
  color: var(--color-text-inverted);
  cursor: pointer;
  font-size: var(--font-size-2xl);
  margin: 0 var(--space-4) 0 auto;
  padding: var(--space-2);
  position: relative;
  top: var(--space-6);
  transition: background-color var(--duration-normal) var(--easing-default),
              border-color var(--duration-normal) var(--easing-default);
  width: fit-content;
  z-index: var(--z-raised);
}

.code-container .collapse-toggle:hover {
  background-color: var(--color-surface);
  border-color: var(--color-neutral-900);
  color: var(--color-text);
}

/* ── Code block ── */

.code-container .code {
  background-color: var(--color-neutral-900);
  color: var(--color-neutral-0);
  overflow: scroll;
  padding: var(--space-2);
  transition: height var(--duration-normal) var(--easing-default);
  z-index: 1;
}

.code-container pre.collapsed {
  height: 5rem;
  overflow: hidden;
  cursor: pointer;
  padding: 0;
}

.code-container pre.expanded {
  height: 100%;
  overflow: scroll;
}


/* fulgore: ui/display/counter.css */
.ui-display-counter {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: 2px var(--space-3);
  border-radius: 999px;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  white-space: nowrap;
  background: var(--color-surface-raised);
  color: var(--color-text-subtle);
}

.ui-display-counter .ui-icon {
  width: 0.875rem;
  height: 0.875rem;
}


/* fulgore: ui/display/datetime.css */
.ui-display-datetime {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  white-space: nowrap;
}


/* fulgore: ui/display/distribution_bar.css */
.ui-display-distribution-bar {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.ui-display-distribution-bar {
  min-width: 0;
}

.ui-display-distribution-bar__row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto minmax(40px, 80px);
  align-items: center;
  gap: var(--space-2);
  min-width: 0;
}

.ui-display-distribution-bar__emoji {
  font-size: var(--font-size-base);
  line-height: 1;
}

.ui-display-distribution-bar__label {
  font-size: var(--font-size-sm);
  color: var(--color-text-default);
  margin: 0;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ui-display-distribution-bar__count {
  font-size: var(--font-size-sm);
  font-variant-numeric: tabular-nums;
  color: var(--color-text-subtle);
  text-align: right;
}

.ui-display-distribution-bar__track {
  height: 8px;
  background-color: var(--color-surface-subtle);
  border-radius: 999px;
  overflow: hidden;
}

.ui-display-distribution-bar__fill {
  height: 100%;
  background-color: var(--color-brand);
  transition: width 200ms ease;
}


/* fulgore: ui/display/iban.css */
.ui-display-iban {
  font-variant-numeric: tabular-nums;
}


/* fulgore: ui/display/image_skeleton.css */
/* .ui-image-skeleton — classe utility skeleton image partagée.
 * Pose un shimmer en background + un spinner via ::before sur l'élément porteur.
 * Réutilise @keyframes skeleton-shimmer et @keyframes spin (fulgore/animations.css).
 * Le wrapper doit définir ses propres dimensions (aspect-ratio, width, height,
 * border-radius, overflow).
 *
 * Deux usages possibles (selon la présence d'un wrapper) :
 *
 *   1. Sur un wrapper <div> qui contient un <picture> rendu par UI::Display::Picture
 *      → le shimmer + spinner sont sur le wrapper, l'image enfant le masque
 *        une fois chargée (z-index:1 sur le picture/img).
 *
 *   2. Directement sur le <picture> lui-même (via css_class de Picture, pour les
 *      cas sans wrapper parent — ex. miniatures en ligne dans un Row)
 *      → le ::before n'aurait pas d'effet sur un <img> seul (replaced element),
 *        mais le <picture> n'est PAS replaced, donc ::before fonctionne ;
 *        le <img> enfant masque le skeleton via z-index.
 *
 * Caveat asset transparent : le contract suppose un asset opaque (JPEG/WebP en
 * object-fit:cover). Pour un SVG/PNG transparent avec object-fit:contain,
 * les zones transparentes laissent voir le shimmer en permanence — préférer
 * dans ce cas un wrapper neutre sans skeleton (cf. show.css logo).
 */

.ui-image-skeleton {
  position: relative;
  overflow: hidden;
  background: linear-gradient(
    90deg,
    var(--color-surface-raised) 25%,
    var(--color-surface-subtle) 50%,
    var(--color-surface-raised) 75%
  );
  background-size: 200% 100%;
  animation: skeleton-shimmer 1.5s ease-in-out infinite;
}

.ui-image-skeleton::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 24px;
  height: 24px;
  margin: -12px 0 0 -12px;
  border: 3px solid var(--color-border);
  border-top-color: var(--color-brand);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
  z-index: 0;
}

.ui-image-skeleton > picture,
.ui-image-skeleton > picture > img,
picture.ui-image-skeleton,
picture.ui-image-skeleton > img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}


/* fulgore: ui/display/money.css */
.ui-display-money {
  display: block;
  font-size: var(--font-size-sm);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  text-align: right;
}

.ui-display-money--default {
  color: var(--color-brand);
}

.ui-display-money--positive {
  color: var(--color-success);
}

.ui-display-money--negative {
  color: var(--color-danger);
}


/* fulgore: ui/display/range_bar.css */
.ui-display-range-bar {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  min-width: 0;
}

.ui-display-range-bar__labels {
  display: flex;
  justify-content: space-between;
  gap: var(--space-2);
  font-size: var(--font-size-xs);
  font-weight: 500;
  color: var(--color-text-subtle);
}

.ui-display-range-bar__min,
.ui-display-range-bar__max {
  margin: 0;
  min-width: 0;
  font-variant-numeric: tabular-nums;
}

.ui-display-range-bar__max {
  text-align: right;
}

.ui-display-range-bar__track {
  position: relative;
  height: 6px;
  border-radius: 999px;
  background: linear-gradient(
    to right,
    var(--color-surface-subtle) 0%,
    var(--color-brand-surface) 50%,
    var(--color-surface-subtle) 100%
  );
  overflow: hidden;
}

.ui-display-range-bar__marker {
  position: absolute;
  top: 50%;
  width: 12px;
  height: 12px;
  background-color: var(--color-brand);
  border-radius: 50%;
  transform: translateY(-50%) translateX(-50%);
}

.ui-display-range-bar__marker-label {
  position: absolute;
  top: 100%;
  white-space: nowrap;
  margin-top: var(--space-1);
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  transform: translateX(-50%);
}


/* fulgore: ui/display/rna.css */
.ui-display-rna {
  font-variant-numeric: tabular-nums;
}


/* fulgore: ui/display/simple_format.css */
.simple-format {
  white-space: pre-line;
}

.simple-format p {
  margin: 0 0 1em;
}

.simple-format br {
  display: inline;
}


/* fulgore: ui/display/siret.css */
.ui-display-siret {
  font-variant-numeric: tabular-nums;
}


/* fulgore: ui/display/stat_block.css */
.ui-display-stat-block {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-3);
  min-width: 0;
  text-align: center;
}

/* Large variant — default */
.ui-display-stat-block--large {
  .ui-display-stat-block__value {
    font-size: var(--font-size-3xl);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
    margin: 0;
  }

  .ui-display-stat-block__label {
    font-size: var(--font-size-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--color-text-subtle);
    margin: 0;
  }
}

/* Compact variant */
.ui-display-stat-block--compact {
  min-width: 0;

  .ui-display-stat-block__value {
    font-size: var(--font-size-lg);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    line-height: 1.3;
    margin: 0;
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .ui-display-stat-block__label {
    font-size: var(--font-size-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--color-text-subtle);
    margin: 0;
  }
}


/* fulgore: ui/display/thumbnail.css */
.ui-display-thumbnail {
  width: 40px;
  height: 40px;
  overflow: hidden;
  border-radius: var(--radius-sm);
  flex-shrink: 0;
}

.ui-display-thumbnail picture,
.ui-display-thumbnail .ui-display-thumbnail__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 1;
}


/* fulgore: ui/empty_state.css */
.ui-empty-state {
  text-align: center;
  padding: var(--space-12) var(--space-8);
  color: var(--color-text-subtle);

  .empty-state-title {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-medium);
    margin: 0 0 var(--space-2) 0;
  }

  .empty-state-description {
    font-size: var(--font-size-base);
    margin: 0;
  }
}


/* fulgore: ui/gauge.css */
.ui-gauge {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-1);
  padding: var(--space-4) var(--space-3);
  background-color: var(--color-brand-surface);
  border: 1px solid var(--color-brand-a10);
  border-radius: var(--radius-lg);
  text-align: center;
}

.ui-gauge__icon {
  font-size: var(--font-size-2xl);
  line-height: 1;
}

.ui-gauge__label {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-brand-light);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.ui-gauge .ui-bases-progress-bar {
  width: 100%;
}

.ui-gauge .ui-bases-progress-bar__track {
  flex-direction: column;
  gap: var(--space-2);
}

.ui-gauge .ui-bases-progress-bar__bar {
  flex: none;
  width: 100%;
  height: var(--space-1);
}

.ui-gauge .ui-bases-progress-bar__percentage {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  color: var(--color-brand);
  text-align: center;
  min-width: unset;
}


/* fulgore: ui/ghost_row.css */
.ui-ghost-row {
  
  & .ui-ghost-row__cell {
    
    border: 3px dashed var(--color-brand);
    background-color: var(--color-brand-a20);
    padding-block: var(--space-1);
  }
}


/* fulgore: ui/help_tooltip.css */
.ui-help-tooltip {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.ui-help-tooltip__trigger {
  width: 1.1rem;
  height: 1.1rem;
  background: var(--color-surface-raised);
  color: var(--color-text-subtle);
  font-size: var(--font-size-xs);
  border-radius: var(--radius-full);
  border: 1px solid var(--color-border);
  cursor: pointer;
  line-height: 1;
  padding: 0;
}

.ui-help-tooltip__trigger:hover {
  background: var(--color-surface);
  color: var(--color-text);
}

.ui-help-tooltip__trigger:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

.ui-help-tooltip__panel {
  position: absolute;
  top: 50%;
  right: calc(100% + var(--space-2));
  transform: translateY(-50%);
  background: var(--color-surface);
  border: 1.5px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-3) var(--space-4);
  font-size: var(--font-size-sm);
  color: var(--color-text);
  box-shadow: var(--shadow-lg);
  min-width: 220px;
  max-width: 320px;
  z-index: var(--z-dropdown);
  white-space: normal;
}


/* fulgore: ui/icon.css */
.svg {
  width: var(--icon-size-md);
  height: var(--icon-size-md);
  flex-shrink: 0;
  fill: currentColor;
}


/* fulgore: ui/inputs/checkbox.css */
.ui-input--checkbox {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: flex-end;
  gap: var(--space-3);

  label {
    cursor: pointer;
  }

  input[type="checkbox"] {
    width: 1.125rem;
    height: 1.125rem;
    accent-color: var(--color-brand);
    cursor: pointer;
  }

  input[type="hidden"] {
    display: none;
  }
}


/* fulgore: ui/inputs/checkbox_card.css */
.ui-inputs-checkbox-card {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: var(--space-4);
  padding: var(--space-4) var(--space-6);
  border: 1.5px solid var(--color-border);
  border-radius: var(--radius-lg);
  cursor: pointer;
  transition:
    border-color var(--duration-fast) var(--easing-default),
    background var(--duration-fast) var(--easing-default);

  &:hover {
    border-color: var(--color-brand);
    background: var(--color-brand-a10);
  }

  &.is-checked {
    border-color: var(--color-brand);
    background: var(--color-brand-a10);
  }
}

.ui-inputs-checkbox-card__checkbox {
  width: 1.25rem;
  height: 1.25rem;
  accent-color: var(--color-brand);
  cursor: pointer;
  transition: transform var(--duration-fast) var(--easing-bounce, cubic-bezier(0.34, 1.56, 0.64, 1));

  .no-transition & {
    transition: none;
  }
}

.ui-inputs-checkbox-card.is-checked .ui-inputs-checkbox-card__checkbox {
  animation: checkbox-pop var(--duration-normal, 250ms) var(--easing-bounce, cubic-bezier(0.34, 1.56, 0.64, 1));
}

.ui-inputs-checkbox-card.no-transition .ui-inputs-checkbox-card__checkbox {
  animation: none;
}

@keyframes checkbox-pop {
  0%   { transform: scale(1); }
  40%  { transform: scale(1.35); }
  100% { transform: scale(1); }
}

.ui-inputs-checkbox-card__text {
  position: relative;
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}

.ui-inputs-checkbox-card__label {
  display: block;
  transition: opacity var(--duration-fast) var(--easing-default);
}

.ui-inputs-checkbox-card__label--unchecked {
  opacity: 1;
}

.ui-inputs-checkbox-card__label--checked {
  position: absolute;
  inset: 0;
  opacity: 0;
}

.ui-inputs-checkbox-card.is-checked .ui-inputs-checkbox-card__label--unchecked {
  opacity: 0;
}

.ui-inputs-checkbox-card.is-checked .ui-inputs-checkbox-card__label--checked {
  opacity: 1;
}


/* fulgore: ui/inputs/checkbox_select.css */
.ui-input {
  .ui-checkbox-select {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
  }

  .ui-checkbox-select__option {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--space-2);
    cursor: pointer;
    font-size: var(--text-sm);
    color: var(--color-text);

    input[type="checkbox"] {
      accent-color: var(--color-brand);
      cursor: pointer;
    }
  }
}


/* fulgore: ui/inputs/color.css */
.ui-input {
  [data-controller="color-picker"] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--space-2);
    width: 100%;
  }

  [data-color-picker-target="swatch"] {
    flex: 0 0 auto;
    width: 2.25rem;
    height: 2.25rem;
    padding: var(--space-1);
    border: 1.5px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
    cursor: pointer;
    transition:
      border-color var(--duration-fast) var(--easing-default),
      box-shadow var(--duration-fast) var(--easing-default);

    &::-webkit-color-swatch-wrapper {
      padding: 0;
    }

    &::-webkit-color-swatch {
      border: none;
      border-radius: var(--radius-sm);
    }

    &::-moz-color-swatch {
      border: none;
      border-radius: var(--radius-sm);
    }

    &:focus {
      border-color: var(--color-brand);
      box-shadow: var(--focus-ring);
    }
  }

  [data-color-picker-target="hex"] {
    flex: 1;
    width: auto;
    font-family: var(--font-family-mono);
  }

  &.ui-input--error {
    [data-color-picker-target="swatch"] {
      border-color: var(--color-danger);

      &:focus {
        box-shadow: 0 0 0 3px var(--color-danger-a10);
      }
    }
  }
}


/* fulgore: ui/inputs/date_range.css */
.filter-field--date-range {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  flex-wrap: wrap;
}

.filter-date-range__field {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
}

.filter-date-range__label {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.filter-field--date-range input[type="date"] {
  padding: var(--space-1) var(--space-2);
  font-size: var(--font-size-sm);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
  color: var(--color-text);
}


/* fulgore: ui/inputs/file_dropzone.css */
.ui-inputs-file-dropzone__zone {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-5) var(--space-4);
  border: 2px dashed var(--color-border);
  border-radius: var(--radius-lg);
  background-color: var(--color-surface);
  cursor: pointer;
  transition: border-color 150ms ease, background-color 150ms ease;
}

.ui-inputs-file-dropzone__zone:hover {
  border-color: var(--color-brand);
  background-color: var(--color-brand-surface);
}

.ui-inputs-file-dropzone__zone.is-dragover {
  border-color: var(--color-brand);
  background-color: var(--color-brand-surface);
}

.ui-inputs-file-dropzone__icon {
  font-size: var(--font-size-2xl);
}

.ui-inputs-file-dropzone__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}

.ui-inputs-file-dropzone__hint {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

.ui-inputs-file-dropzone__zone.is-uploading {
  border-color: var(--color-brand);
  background-color: var(--color-brand-surface);
  pointer-events: none;
  cursor: default;
}

.ui-inputs-file-dropzone__zone.is-uploading .ui-inputs-file-dropzone__icon,
.ui-inputs-file-dropzone__zone.is-uploading .ui-inputs-file-dropzone__label,
.ui-inputs-file-dropzone__zone.is-uploading .ui-inputs-file-dropzone__hint {
  display: none;
}

.ui-inputs-file-dropzone__zone.is-uploading::after {
  content: "Envoi en cours…";
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-brand);
}

.ui-inputs-file-dropzone__zone.is-uploading::before {
  content: "";
  width: 1rem;
  height: 1rem;
  border: 2px solid var(--color-brand);
  border-right-color: transparent;
  border-radius: var(--radius-full);
  animation: dropzone-spin 600ms linear infinite;
}

@keyframes dropzone-spin {
  to { transform: rotate(360deg); }
}

.ui-inputs-file-dropzone__input {
  display: none;
}


/* fulgore: ui/inputs/money.css */
.ui-inputs-money {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  width: 100%;
  border: 1.5px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  transition:
    border-color var(--duration-fast) var(--easing-default),
    box-shadow var(--duration-fast) var(--easing-default);
}

.ui-inputs-money:focus-within {
  border-color: var(--color-brand);
  box-shadow: var(--focus-ring);
}

.ui-inputs-money input[type="text"] {
  flex: 1;
  border: none;
  border-radius: 0;
  box-shadow: none;
}

.ui-inputs-money input[type="text"]:focus {
  border-color: transparent;
  box-shadow: none;
}

.ui-inputs-money__currency {
  display: flex;
  align-items: center;
  padding: 0 var(--space-3);
  border-left: 1px solid var(--color-border);
  background: var(--color-surface-subtle);
  color: var(--color-text-subtle);
  font-size: var(--font-size-sm);
  white-space: nowrap;
}

.ui-input--error .ui-inputs-money {
  border-color: var(--color-danger);
}

.ui-input--error .ui-inputs-money:focus-within {
  border-color: var(--color-danger);
  box-shadow: 0 0 0 3px var(--color-danger-a10);
}


/* fulgore: ui/inputs/password.css */
.ui-input {
  .password-wrapper {
    position: relative;
  }

  .password-wrapper input {
    padding-right: var(--space-10);
  }

  .password-toggle {
    position: absolute;
    right: var(--space-3);
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: var(--color-text-subtle);
    display: flex;
    align-items: center;
    transition: color var(--duration-fast) var(--easing-default);

    &:hover { color: var(--color-text); }

    .svg {
      display: block;
      width: 1rem;
      height: 1rem;
    }
  }
}


/* fulgore: ui/inputs/percentage.css */
.ui-inputs-percentage {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  width: 100%;
  border: 1.5px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  transition:
    border-color var(--duration-fast) var(--easing-default),
    box-shadow var(--duration-fast) var(--easing-default);
}

.ui-inputs-percentage:focus-within {
  border-color: var(--color-brand);
  box-shadow: var(--focus-ring);
}

.ui-inputs-percentage input[type="number"] {
  flex: 1;
  border: none;
  border-radius: 0;
  box-shadow: none;
}

.ui-inputs-percentage input[type="number"]:focus {
  border-color: transparent;
  box-shadow: none;
}

.ui-inputs-percentage__suffix {
  display: flex;
  align-items: center;
  padding: 0 var(--space-3);
  border-left: 1px solid var(--color-border);
  background: var(--color-surface-subtle);
  color: var(--color-text-subtle);
  font-size: var(--font-size-sm);
  white-space: nowrap;
}

.ui-input--error .ui-inputs-percentage {
  border-color: var(--color-danger);
}

.ui-input--error .ui-inputs-percentage:focus-within {
  border-color: var(--color-danger);
  box-shadow: 0 0 0 3px var(--color-danger-a10);
}


/* fulgore: ui/inputs/pill_select.css */
.pill-select {
  position: relative;
  display: inline-block;
  width: 100%;
}

.pill-select__trigger {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  width: 100%;
  padding: var(--space-1) var(--space-2);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  cursor: pointer;
  text-align: left;
}

.pill-select__caret {
  margin-left: auto;
  color: var(--color-text-subtle);
  font-size: var(--font-size-xs);
}

.pill-select__dropdown {
  position: absolute;
  top: calc(100% + var(--space-1));
  left: 0;
  z-index: var(--z-dropdown);
  min-width: 100%;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
  padding: var(--space-1);
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.pill-select__dropdown[hidden] {
  display: none;
}

.pill-select__option {
  display: flex;
  align-items: center;
  padding: var(--space-1) var(--space-2);
  background: transparent;
  border: none;
  border-radius: var(--radius-sm);
  cursor: pointer;
  width: 100%;
  text-align: left;
}

.pill-select__option:hover {
  background: var(--color-surface-subtle);
}


/* fulgore: ui/inputs/select.css */
.ui-select {
  width: 100%;
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background-color: var(--color-surface);
  color: var(--color-text);
  font-size: var(--text-sm);
  cursor: pointer;
}


/* fulgore: ui/inputs/vat_breakdown.css */
.ui-inputs-vat-breakdown {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}


/* fulgore: ui/inputs/verification_code.css */
.ui-verification-code__boxes {
  display: flex;
  flex-direction: row;
  gap: var(--space-2);
}

.ui-verification-code__box {
  width: 3rem;
  height: 3.5rem;
  text-align: center;
  font-family: var(--font-family-mono);
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background-color: var(--color-surface);
  color: var(--color-text);
  transition: border-color var(--duration-fast) var(--easing-default),
              box-shadow var(--duration-fast) var(--easing-default);
  appearance: none;
  -moz-appearance: textfield;
}

.ui-verification-code__box::-webkit-outer-spin-button,
.ui-verification-code__box::-webkit-inner-spin-button {
  appearance: none;
}

.ui-verification-code__box:focus {
  outline: none;
  border-color: var(--color-brand);
  box-shadow: var(--focus-ring);
}

.ui-input--error .ui-verification-code__box {
  border-color: var(--color-danger);
}

.ui-input--error .ui-verification-code__box:focus {
  box-shadow: 0 0 0 3px var(--color-danger-a10);
}

.ui-verification-code__box:disabled {
  background-color: var(--color-surface-raised);
  color: var(--color-text-disabled);
  cursor: not-allowed;
}


/* fulgore: ui/label_with_tooltip.css */
.ui-label-with-tooltip {
  display: flex;
  align-items: center;
  gap: var(--space-1);
  flex: 1;
  min-width: 0;
}

.ui-label-with-tooltip__text {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}


/* fulgore: ui/links/back.css */
.ui-links-back {
  display: flex;
  align-items: center;
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  margin-block: var(--space-6);
}

.ui-links-back a {
  color: inherit;
  text-decoration: none;
  transition: color var(--duration-fast) var(--easing-default);

  &:hover {
    color: var(--color-brand);
  }
}


/* fulgore: ui/links/edit.css */
.ui-button--sm .svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}


/* fulgore: ui/links/plain.css */
.ui-link {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  transition: opacity var(--duration-fast) var(--easing-default);

  &:hover {
    opacity: 0.7;
  }

  &:focus-visible {
    outline: none;
    box-shadow: var(--focus-ring);
    border-radius: var(--radius-sm);
  }
}


/* fulgore: ui/map.css */
.ui-map {
  width: 100%;
  height: 20rem;
  border-radius: var(--radius-md);
  overflow: hidden;
  z-index: 0;
}


/* fulgore: ui/metric_card.css */
.ui-metric-card {
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
}

.ui-metric-card__label {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  font-weight: var(--font-weight-medium);
  margin-bottom: var(--space-1);
  position: relative;
}

.ui-metric-card__value {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
  margin: 0;
  font-variant-numeric: tabular-nums;
}

/* ── Tooltip repositioning inside card ── */

.ui-metric-card .ui-help-tooltip__panel {
  top: calc(100% + var(--space-1));
  right: auto;
  left: 0;
  transform: none;
  min-width: 12rem;
}

/* ── Comparison delta (M/M-1, etc.) ── */

.ui-metric-card__comparison {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
  margin-top: var(--space-1);
  font-size: var(--font-size-xs);
}

.ui-metric-card__delta-value {
  font-weight: var(--font-weight-semibold);
  font-variant-numeric: tabular-nums;
}

.ui-metric-card__delta-label {
  color: var(--color-text-subtle);
}

.ui-metric-card__comparison--positive .ui-metric-card__delta-value {
  color: var(--color-success);
}

.ui-metric-card__comparison--negative .ui-metric-card__delta-value {
  color: var(--color-danger);
}

.ui-metric-card__comparison--neutral .ui-metric-card__delta-value {
  color: var(--color-text-subtle);
}


/* fulgore: ui/notification/badge.css */
.ui-notification-badge {
  display: inline-block;
  min-width: 1.25rem;
  height: 1.25rem;
  line-height: 1.25rem;
  padding-inline: 5px;
  border-radius: var(--radius-full);
  background: var(--color-danger);
  color: var(--color-text-inverted);
  font-family: system-ui, -apple-system, sans-serif;
  font-size: 0.6875rem;
  font-weight: 600;
  text-align: center;
  font-variant-numeric: tabular-nums;
  box-sizing: border-box;
}


/* fulgore: ui/notification/bell.css */
.ui-notification-bell {
  position: relative;
}

.ui-notification-bell__button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
  border: none;
  border-radius: var(--radius-md);
  background: transparent;
  color: var(--color-text-inverted);
  cursor: pointer;
  position: relative;
  transition: background var(--duration-fast) var(--easing-default);

  .svg {
    width: var(--icon-size-sm);
    height: var(--icon-size-sm);
  }

  &:hover {
    background: rgba(255, 255, 255, 0.15);
  }

  &:focus-visible {
    outline: none;
    box-shadow: var(--focus-ring);
  }
}

.ui-notification-bell__badge {
  position: absolute;
  top: 2px;
  right: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 1rem;
  height: 1rem;
  padding: 0 3px;
  border-radius: var(--radius-full);
  background: var(--color-danger);
  color: var(--color-text-inverted);
  font-size: 0.625rem;
  font-weight: var(--font-weight-semibold);
  line-height: 1;
}

.ui-notification-bell__badge--hidden {
  display: none;
}

.ui-notification-bell__dropdown {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: var(--space-2);
  width: 22rem;
  max-width: calc(100vw - 2rem);
  max-height: 28rem;
  overflow-y: auto;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-xl);
  z-index: var(--z-dropdown);

  &.is-open {
    display: block;
  }
}

.ui-notification-bell__dropdown-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid var(--color-border);
}

.ui-notification-bell__dropdown-title {
  margin: 0;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.ui-notification-bell__mark-all {
  border: none;
  background: none;
  padding: 0;
  font-size: var(--font-size-xs);
  color: var(--color-brand);
  cursor: pointer;

  &:hover {
    text-decoration: underline;
  }
}

.ui-notification-bell__list {
  display: flex;
  flex-direction: column;
}

.ui-notification-bell__empty {
  padding: var(--space-6);
  text-align: center;
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  margin: 0;
}


/* fulgore: ui/notification/item.css */
.ui-notification-item {
  display: grid;
  grid-template-columns: 1.75rem 1fr;
  gap: var(--space-2);
  align-items: start;
  padding: var(--space-2) var(--space-4);
  text-decoration: none;
  color: var(--color-text);

  &:not(:last-child) {
    border-bottom: 1px solid var(--color-border);
  }

  &:hover {
    background: var(--color-surface-raised);
  }

  &--unread {
    background: var(--color-brand-surface);

    &:hover {
      background: var(--color-brand-a10);
    }
  }
}

.ui-notification-item__avatar {
  flex-shrink: 0;

  .ui-user-badge {
    gap: 0;
  }

  .ui-user-badge__text {
    display: none;
  }

  .ui-user-badge__circle {
    width: 1.75rem !important;
    height: 1.75rem !important;
    font-size: 0.625rem !important;
  }
}

.ui-notification-item__content {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.ui-notification-item__title-line {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-1);
}

.ui-notification-item__actor-name {
  font-size: var(--font-size-xs);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ui-notification-item .ui-pill {
  font-size: 0.5625rem;
  padding: 0 4px;
  line-height: 1.125rem;
  flex-shrink: 0;
}

.ui-notification-item__body {
  margin: 0;
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ui-notification-item__meta {
  display: flex;
  align-items: center;
  gap: var(--space-1);
  margin-top: 1px;
}

.ui-notification-item__time,
.ui-notification-item__context {
  font-size: 0.625rem;
  color: var(--color-text-disabled);
}


/* fulgore: ui/pagination.css */
.ui-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-1);
}

.ui-pagination__arrow,
.ui-pagination__page,
.ui-pagination__gap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--space-8);
  height: var(--space-8);
  padding: 0 var(--space-2);
  border-radius: var(--radius-md);
  font-size: var(--font-size-sm);
  text-decoration: none;
}

.ui-pagination__arrow {
  color: var(--color-text-subtle);

  &:hover {
    background: var(--color-surface-subtle);
    color: var(--color-text);
  }
}

.ui-pagination__arrow--disabled {
  color: var(--color-text-disabled);
  pointer-events: none;
}

.ui-pagination__page {
  color: var(--color-text-subtle);

  &:hover {
    background: var(--color-surface-subtle);
    color: var(--color-text);
  }
}

.ui-pagination__page--current {
  background: var(--color-brand);
  color: var(--color-text-inverted);
  border: 1px solid var(--color-brand);
  font-weight: var(--font-weight-medium);
  pointer-events: none;
}

.ui-pagination__gap {
  color: var(--color-text-disabled);
  pointer-events: none;
}


/* fulgore: ui/pill.css */
.ui-pill {
  display: inline-flex;
  align-items: center;
  padding: 2px var(--space-3);
  border-radius: 999px;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  white-space: nowrap;
}

.ui-pill--brand {
  background: var(--color-violet-100);
  color: var(--color-violet-700);
}

.ui-pill--info {
  background: var(--color-blue-100);
  color: var(--color-blue-700);
}

.ui-pill--success {
  background: var(--color-green-100);
  color: var(--color-green-700);
}

.ui-pill--danger {
  background: var(--color-red-100);
  color: var(--color-red-700);
}

.ui-pill--warning {
  background: var(--color-amber-100);
  color: var(--color-amber-700);
}

.ui-pill--neutral {
  background: var(--color-neutral-100);
  color: var(--color-neutral-700);
}

.ui-pill--draft {
  background: var(--color-surface-raised);
  color: var(--color-text-subtle);
}

.ui-pill--in_progress {
  background: var(--color-success-surface);
  color: var(--color-success);
}

.ui-pill--review {
  background: var(--color-warning-surface);
  color: var(--color-warning);
}

.ui-pill--completed {
  background: var(--color-info-surface);
  color: var(--color-info);
}

.ui-pill--archived {
  background: var(--color-surface-raised);
  color: var(--color-text-subtle);
}

.ui-pill--admin {
  background: var(--color-violet-100);
  color: var(--color-violet-700);
}

.ui-pill--accountant {
  background: var(--color-blue-100);
  color: var(--color-blue-700);
}

.ui-pill--active {
  background: var(--color-success-surface);
  color: var(--color-success);
}

.ui-pill--suspended {
  background: var(--color-red-100);
  color: var(--color-red-700);
}

.ui-pill--pending {
  background: var(--color-warning-surface);
  color: var(--color-warning);
}

.ui-pill--read {
  background: var(--color-blue-100);
  color: var(--color-blue-700);
}

.ui-pill--lmnp {
  background: var(--color-brand-surface);
  color: var(--color-brand);
}

.ui-pill--lmnp_vat {
  background: var(--color-info-surface);
  color: var(--color-info);
}

.ui-pill--lg {
  padding: var(--space-2) var(--space-4);
  font-size: var(--font-size-sm);
}

.ui-pill--strong {
  padding: 4px 10px;
  font-weight: var(--font-weight-bold);
  box-shadow: 0 2px 6px rgb(0 0 0 / 0.18);
}

.ui-pill--strong.ui-pill--brand   { background: var(--color-violet-600); color: var(--color-neutral-0); }
.ui-pill--strong.ui-pill--info    { background: var(--color-blue-700);   color: var(--color-neutral-0); }
.ui-pill--strong.ui-pill--success { background: var(--color-green-500);  color: var(--color-neutral-0); }
.ui-pill--strong.ui-pill--warning { background: var(--color-amber-500);  color: var(--color-neutral-0); }
.ui-pill--strong.ui-pill--danger  { background: var(--color-red-500);    color: var(--color-neutral-0); }
.ui-pill--strong.ui-pill--neutral { background: var(--color-neutral-700); color: var(--color-neutral-0); }


/* fulgore: ui/progress_ring.css */
.ui-progress-ring {
  display: flex;
  align-items: center;
  gap: var(--space-6);
  padding: var(--space-6) var(--space-8);
  background-color: var(--color-brand-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
}

.ui-progress-ring__ring {
  flex-shrink: 0;
  width: 5rem;
  height: 5rem;
}

.ui-progress-ring__svg {
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
}

.ui-progress-ring__track {
  fill: none;
  stroke: var(--color-border);
  stroke-width: 8;
}

.ui-progress-ring__fill {
  fill: none;
  stroke: var(--color-brand);
  stroke-width: 8;
  stroke-linecap: round;
  transition: stroke-dashoffset 1.2s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.ui-progress-ring__ratio {
  transform: rotate(90deg);
  transform-origin: 60px 60px;
  text-anchor: middle;
  dominant-baseline: central;
  font-family: var(--font-display);
  font-size: 1.25rem;
  font-weight: var(--font-weight-bold);
  fill: var(--color-text);
}

.ui-progress-ring__text {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.ui-progress-ring__title {
  font-family: var(--font-display);
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}

.ui-progress-ring__subtitle {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  margin: 0;
}


/* fulgore: ui/section.css */
.ui-section {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-5);
}

/* ── Header ── */

.ui-section__header {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding-bottom: var(--space-3);
  border-bottom: 1px solid var(--color-border);
  margin-bottom: var(--space-4);
}

.ui-section__header[data-action] {
  cursor: pointer;
  user-select: none;
}

.ui-section__icon {
  flex-shrink: 0;
  font-size: var(--font-size-lg);
  line-height: 1;
}

.ui-section__title {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}

.ui-section__counter {
  font-weight: var(--font-weight-normal);
  color: var(--color-text-subtle);
}

.ui-section__action {
  margin-left: auto;
  flex-shrink: 0;
}

.ui-section__toggle {
  margin-left: auto;
  background: none;
  border: none;
  padding: var(--space-1);
  cursor: pointer;
  color: var(--color-text-subtle);
  font-size: var(--font-size-sm);
  transition: transform var(--duration-fast);
}

.ui-section__action + .ui-section__toggle {
  margin-left: 0;
}

/* ── Body ── */

.ui-section__body {
  min-height: 0;
}

/* ── Footer ── */

.ui-section__footer {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding-top: var(--space-3);
  border-top: 1px solid var(--color-border);
  margin-top: var(--space-4);
}


/* fulgore: ui/section_header.css */
.ui-section-header {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding-bottom: var(--space-3);
  border-bottom: 1px solid var(--color-border);
  margin-bottom: var(--space-4);
}

.ui-section-header__icon {
  flex-shrink: 0;
  font-size: var(--font-size-lg);
  line-height: 1;
}

.ui-section-header__title {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}

.ui-section-header__action {
  margin-left: auto;
  flex-shrink: 0;
}


/* fulgore: ui/skeleton_block.css */
@keyframes skeleton-shimmer {
  0%   { background-position: 200% center; }
  100% { background-position: -200% center; }
}

.ui-skeleton-block {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.ui-skeleton-block--card {
  padding: var(--space-4);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  gap: var(--space-3);
}

.ui-skeleton-block__title {
  height: 0.875rem;
  width: 45%;
  border-radius: var(--radius-sm);
  background: linear-gradient(
    90deg,
    var(--color-surface-raised) 25%,
    var(--color-surface-subtle) 50%,
    var(--color-surface-raised) 75%
  );
  background-size: 200%;
  animation: skeleton-shimmer 1.5s infinite;
  margin-bottom: var(--space-1);
}

.ui-skeleton-block__row {
  display: flex;
  flex-direction: row;
  gap: var(--space-3);
  height: 2rem;
  border-radius: var(--radius-sm);
  background: linear-gradient(
    90deg,
    var(--color-surface-raised) 25%,
    var(--color-surface-subtle) 50%,
    var(--color-surface-raised) 75%
  );
  background-size: 200%;
  animation: skeleton-shimmer 1.5s infinite;
}

.ui-skeleton-block--card .ui-skeleton-block__row {
  height: 1.25rem;
}

.ui-skeleton-block__cell--wide {
  flex: 3;
}

.ui-skeleton-block__cell--narrow {
  flex: 1;
}


/* fulgore: ui/spinner.css */
.ui-spinner {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
}

.ui-spinner::before {
  content: "";
  display: block;
  width: 1em;
  height: 1em;
  border: 2px solid var(--color-border);
  border-top-color: var(--color-brand);
  border-radius: var(--radius-full);
  animation: spinner-spin var(--duration-slow) linear infinite;
}

@keyframes spinner-spin {
  to { transform: rotate(360deg); }
}

.spinner-label {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}


/* fulgore: ui/stat_grid.css */
/* ── Stat grid: reusable dt/dd key-value layout ── */

.ui-stat-grid {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: var(--space-2) var(--space-4);
  margin: 0;
}

.ui-stat-grid__label {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  font-weight: var(--font-weight-medium);
  position: relative;
}

.ui-stat-grid__icon {
  font-size: var(--font-size-base);
}

.ui-stat-grid__value {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
  text-align: right;
}

/* ── Tooltip repositioning ── */

.ui-stat-grid .ui-help-tooltip__panel {
  top: calc(100% + var(--space-1));
  right: auto;
  left: 0;
  transform: none;
}


/* fulgore: ui/status_icon.css */
.ui-status-icon {
  font-size: var(--font-size-base);
  flex-shrink: 0;
  line-height: 1;
}


/* fulgore: ui/summary_row.css */
.ui-summary-row {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-4);
  text-decoration: none;
  color: inherit;
}

.ui-summary-row--clickable {
  border-radius: var(--radius-md);
  transition: background var(--duration-fast) var(--easing-default);
}

.ui-summary-row--clickable:hover {
  background: var(--color-surface-subtle);
}

.ui-summary-row__icon {
  font-size: var(--font-size-base);
  flex-shrink: 0;
  line-height: 1;
}

.ui-summary-row__label {
  flex: 1;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ui-summary-row__dots {
  display: flex;
  align-items: center;
  gap: var(--space-1);
  flex-shrink: 0;
}

.ui-summary-row__dot {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: var(--radius-full);
}

.ui-summary-row__dot--validated {
  background: var(--color-success);
}

.ui-summary-row__dot--pending {
  background: var(--color-warning);
}

.ui-summary-row__dot--rejected {
  background: var(--color-danger);
}

.ui-summary-row__dot--missing {
  background: var(--color-neutral-300);
}

.ui-summary-row__count {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  font-variant-numeric: tabular-nums;
  flex-shrink: 0;
}


/* fulgore: ui/tabs.css */
.ui-tabs__list {
  display: flex;
  gap: var(--space-1);
  border-bottom: 1px solid var(--color-border);
  margin-bottom: var(--space-4);
}

.ui-tabs__tab {
  padding: var(--space-2) var(--space-4);
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  color: var(--color-text-subtle);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  cursor: pointer;
  transition: color var(--duration-fast) var(--easing-default),
              border-color var(--duration-fast) var(--easing-default);
}

.ui-tabs__tab:hover {
  color: var(--color-text);
}

.ui-tabs__tab--active {
  color: var(--color-brand);
  border-bottom-color: var(--color-brand);
}

.ui-tabs__panel[hidden] {
  display: none;
}


/* fulgore: ui/timeline.css */
.ui-timeline {
  padding: var(--space-4) 0;
}

/* ── Track ── */

.ui-timeline__track {
  position: relative;
  height: 2rem;
  margin: 0 var(--space-6);
}

.ui-timeline__line {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--color-border-strong);
  transform: translateY(-50%);
}

.ui-timeline__dot {
  position: absolute;
  top: 50%;
  width: 0.75rem;
  height: 0.75rem;
  border-radius: var(--radius-full);
  background: var(--color-neutral-400);
  border: 2px solid var(--color-surface);
  transform: translate(-50%, -50%);
  z-index: 1;
}

.ui-timeline__dot--past {
  background: var(--color-brand);
}

.ui-timeline__today {
  position: absolute;
  top: 50%;
  width: 0.5rem;
  height: 1.25rem;
  background: var(--color-danger);
  border-radius: var(--radius-sm);
  transform: translate(-50%, -50%);
  z-index: 2;
}

/* ── Labels ── */

.ui-timeline__labels {
  position: relative;
  margin: var(--space-2) var(--space-6) 0;
  height: 3.5rem;
}

.ui-timeline__label {
  position: absolute;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  white-space: nowrap;
}

.ui-timeline__label-text {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.ui-timeline__label-date {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

.ui-timeline__delay {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
  margin-top: var(--space-1);
}

.ui-timeline__delay--urgent {
  color: var(--color-danger);
  font-weight: var(--font-weight-semibold);
}


/* fulgore: ui/user_badge.css */
.ui-user-badge {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.ui-user-badge__circle {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-full);
  overflow: hidden;
  color: var(--color-neutral-0);
  font-weight: var(--font-weight-semibold);
  flex-shrink: 0;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.ui-user-badge__text {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.ui-user-badge__name {
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ui-user-badge__email {
  color: var(--color-text-subtle);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ui-user-badge__avatar {
  width: 100%;
  height: 100%;
  border-radius: var(--radius-full);
  object-fit: cover;
}

.ui-user-badge__you {
  color: var(--color-text-subtle);
  font-style: italic;
  font-size: var(--font-size-xs);
}

/* --- Tailles --- */

.ui-user-badge--sm .ui-user-badge__circle {
  width: 1.5rem;
  height: 1.5rem;
  font-size: var(--font-size-xs);
}

.ui-user-badge--sm .ui-user-badge__name {
  font-size: 0.8125rem;
}

.ui-user-badge--sm .ui-user-badge__email {
  font-size: var(--font-size-xs);
}

.ui-user-badge--md .ui-user-badge__circle {
  width: 2rem;
  height: 2rem;
  font-size: 0.8125rem;
}

.ui-user-badge--md .ui-user-badge__name {
  font-size: var(--font-size-sm);
}

.ui-user-badge--md .ui-user-badge__email {
  font-size: var(--font-size-xs);
}

.ui-user-badge--lg .ui-user-badge__circle {
  width: 2.5rem;
  height: 2.5rem;
  font-size: var(--font-size-base);
}

.ui-user-badge--lg .ui-user-badge__name {
  font-size: var(--font-size-base);
}

.ui-user-badge--lg .ui-user-badge__email {
  font-size: var(--font-size-sm);
}


/* fulgore: ui/widgets/grid.css */
.ui-widgets-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
  gap: var(--space-6);
  align-items: start;
}


/* admin/dashboard.css */
.admin-dashboard {
  padding: var(--space-8);
  display: grid;
  gap: var(--space-8);
}


/* admin/leads/card.css */
.admin-leads-card {
  max-width: 48rem;
}

.admin-leads-card__details {
  margin-block-end: var(--space-8);
}

.admin-leads-card__message {
  margin: 0;
  white-space: pre-wrap;
}

.admin-leads-card .ui-pill--pending {
  background: var(--color-amber-100);
  color: var(--color-amber-700);
}

.admin-leads-card .ui-pill--read {
  background: var(--color-blue-100);
  color: var(--color-blue-700);
}

.admin-leads-card .ui-pill--archived {
  background: var(--color-neutral-100);
  color: var(--color-neutral-700);
}


/* admin/matters/card.css */
.admin-matters-card {
  max-width: 64rem;
  display: grid;
  gap: var(--space-6);
}

.admin-matters-card__heading {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.admin-matters-card__subtitle {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  margin: 0;
}



/* admin/matters/memberships/list.css */
.admin-matters-memberships-list {
  padding: var(--space-6);
  display: grid;
  gap: var(--space-4);
}


/* admin/navigation/sidebar.css */
.admin-navigation-sidebar {
  align-self: flex-start;
  position: sticky;
  top: var(--navbar-height);
  height: calc(100dvh - var(--navbar-height));
  width: 0;
  background: var(--color-surface-subtle);
  border-right: none;
  padding: 0;
  box-sizing: border-box;
  flex-shrink: 0;
  overflow: hidden;
  transition:
    width var(--duration-slow) var(--easing-out),
    padding var(--duration-slow) var(--easing-out);

  nav {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
  }

  .sidebar-expand-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: flex-end;
    width: 2rem;
    height: 2rem;
    padding: 0;
    border: none;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--color-text-subtle);
    cursor: pointer;
    flex-shrink: 0;
    transition:
      background var(--duration-fast) var(--easing-default),
      color var(--duration-fast) var(--easing-default);

    &:hover {
      background: var(--color-surface-raised);
      color: var(--color-text);
    }

    &:focus-visible {
      outline: none;
      box-shadow: var(--focus-ring);
    }

    .svg {
      width: 1rem;
      height: 1rem;
      flex-shrink: 0;
      transition: transform var(--duration-slow) var(--easing-out);
    }
  }

  .sidebar-link {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-3);
    padding: var(--space-3);
    border-radius: var(--radius-md);
    text-decoration: none;
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-subtle);
    transition:
      background var(--duration-fast) var(--easing-default),
      color var(--duration-fast) var(--easing-default);

    span {
      display: none;
    }

    .svg {
      width: var(--icon-size-sm);
      height: var(--icon-size-sm);
      flex-shrink: 0;
    }

    &:hover:not(.sidebar-link--active) {
      background: var(--color-brand-a10);
      color: var(--color-text);
    }

    &:focus-visible {
      outline: none;
      box-shadow: var(--focus-ring);
    }
  }

  .sidebar-link--active {
    background: var(--color-brand-surface);
    color: var(--color-brand);
    font-weight: var(--font-weight-semibold);
    box-shadow: inset var(--space-1) 0 0 var(--color-brand);
  }

  &.is-compact {
    width: var(--sidebar-compact-width);
    padding: var(--space-6) var(--space-3);

    .sidebar-expand-toggle {
      align-self: center;
    }
  }

  &.is-compact {
    border-right: 1px solid var(--color-border);
    overflow-x: hidden;
    overflow-y: auto;
  }

  &.is-expanded {
    width: var(--sidebar-width);
    padding: var(--space-6) var(--space-4);
    border-right: 1px solid var(--color-border);
    overflow-x: hidden;
    overflow-y: auto;

    .sidebar-expand-toggle {
      align-self: flex-end;

      .svg {
        transform: rotate(180deg);
      }
    }

    .sidebar-link {
      justify-content: flex-start;
      padding: var(--space-3) var(--space-4);

      span {
        display: block;
      }
    }
  }
}

@media (max-width: 1023px) {
  .admin-navigation-sidebar {
    position: fixed;
    top: var(--navbar-height);
    left: 0;
    bottom: 0;
    z-index: var(--z-modal);
    width: 0;
    padding: 0;
    border-right: none;
    box-shadow: none;
    align-self: auto;
  }

  .admin-navigation-sidebar.is-compact {
    width: var(--sidebar-compact-width);
    padding: var(--space-6) var(--space-3);
    border-right: 1px solid var(--color-border);
    box-shadow: var(--shadow-lg);
    overflow-y: auto;
  }

  .admin-navigation-sidebar.is-expanded {
    width: var(--sidebar-width);
    padding: var(--space-6) var(--space-4);
    border-right: 1px solid var(--color-border);
    box-shadow: var(--shadow-lg);
    overflow-y: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .admin-navigation-sidebar,
  .admin-navigation-sidebar .sidebar-expand-toggle .svg {
    transition: none;
  }
}


/* admin/users/card.css */
.admin-users-card {
  max-width: 48rem;
}

.admin-users-card__heading {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
}

.admin-users-card__details {
  margin-block-end: var(--space-8);
}



/* admin/users/form.css */
.admin-users-form {
  max-width: 48rem;
  margin-inline: auto;
  padding: var(--space-8);
}


/* auth/accept_invitation_form.css */
.auth-accept-invitation-form {
  max-width: 28rem;
  margin: var(--space-16) auto;
  display: grid;
  gap: var(--space-6);

  h2 {
    margin: 0;
  }

  form {
    display: grid;
    gap: var(--space-5);
  }
}


/* auth/account_settings.css */
.auth-account-settings {
  max-width: 40rem;
  margin-inline: auto;
  padding: var(--space-8);
}

.auth-account-settings__section {
  padding-block: var(--space-6);
}

.auth-account-settings__section--security {
  border-top: 1px solid var(--color-border);
}

.auth-account-settings__heading {
  margin-block-end: var(--space-4);
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.auth-account-settings__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding-block: var(--space-3);
}

.auth-account-settings__label-group {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

.auth-account-settings__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
}

.auth-account-settings__value {
  font-size: var(--font-size-sm);
  color: var(--color-text);
}

.auth-account-settings__badge {
  display: inline-flex;
  align-items: center;
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-full);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
}

.auth-account-settings__badge--enabled {
  background-color: var(--color-success-subtle);
  color: var(--color-success);
}

.auth-account-settings__badge--disabled {
  background-color: var(--color-surface-raised);
  color: var(--color-text-subtle);
}

.auth-account-settings__action {
  display: inline-flex;

  form {
    display: contents;
  }
}


/* auth/invitation_form.css */
.auth-invitation-form {
  max-width: 28rem;
  margin: var(--space-16) auto;
  display: grid;
  gap: var(--space-6);

  h2 {
    margin: 0;
  }

  form {
    display: grid;
    gap: var(--space-5);
  }
}


/* auth/login_form.css */
.auth-login-form {
  max-width: 28rem;
  margin: var(--space-16) auto;
  display: grid;
  gap: var(--space-6);

  h2 {
    margin: 0;
  }

  form {
    display: grid;
    gap: var(--space-5);
  }

  .alert {
    color: var(--color-danger);
  }
}


/* auth/logout_button.css */
.auth-logout-button form {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
}

.auth-logout-button button {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  background: none;
  color: inherit;
  border: 1.5px solid rgba(255, 255, 255, 0.35);
  padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-sm);
  font-size: var(--font-size-sm);
  cursor: pointer;
  transition: background var(--transition-fast), border-color var(--transition-fast);
}

.auth-logout-button button .svg {
  display: block;
  width: 1.25rem;
  height: 1.25rem;
}

.auth-logout-button button:hover {
  background: rgba(255, 255, 255, 0.15);
  border-color: rgba(255, 255, 255, 0.6);
}


/* auth/register_form.css */
.auth-register-form {
  max-width: 28rem;
  margin: var(--space-16) auto;
  display: grid;
  gap: var(--space-6);

  h2 {
    margin: 0;
  }

  form {
    display: grid;
    gap: var(--space-5);
  }
}


/* inbox/conversation_header.css */
.inbox-conversation-header {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.inbox-conversation-header__title {
  margin: 0;
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
}

/* --- Participants --- */

.inbox-conversation-header__participants {
  display: flex;
  gap: var(--space-2);
  flex-wrap: wrap;
}

.inbox-conversation-header__participant {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-3);
  background: var(--color-surface-subtle);
  border-radius: var(--radius-md);
}

.inbox-conversation-header__participant-avatar {
  flex-shrink: 0;

  .ui-user-badge__text {
    display: none;
  }
}

.inbox-conversation-header__participant-info {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.inbox-conversation-header__participant-name {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  white-space: nowrap;
}


/* inbox/index.css */
.inbox-index {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.inbox-index__groups {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.inbox-index__group {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.inbox-index__group-heading {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-4);
  background: var(--color-surface-subtle);
  border-bottom: 1px solid var(--color-border);

  .svg {
    width: var(--icon-size-sm);
    height: var(--icon-size-sm);
    color: var(--color-brand);
    flex-shrink: 0;
  }
}

.inbox-index__group-info {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  min-width: 0;
}

.inbox-index__group-title {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.inbox-index__group-address {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

.inbox-index__group-list {
  display: flex;
  flex-direction: column;
}

.inbox-index__empty-action {
  display: flex;
  justify-content: center;
}

.inbox-index__group-list .inbox-conversation-item {
  border-radius: 0;
  border-bottom: 1px solid var(--color-border);

  &:last-child {
    border-bottom: none;
  }
}


/* inbox/matter_card.css */
.inbox-matter-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  text-decoration: none;
  color: var(--color-text);
  background: var(--color-surface);
  transition:
    border-color var(--duration-fast) var(--easing-default),
    box-shadow var(--duration-fast) var(--easing-default);
  cursor: pointer;

  &:hover {
    border-color: var(--color-brand);
    box-shadow: var(--shadow-md);
  }

  &:focus-visible {
    outline: none;
    box-shadow: var(--focus-ring);
  }
}

.inbox-matter-card__title-row {
  display: flex;
  align-items: center;
  gap: var(--space-2);

  .svg {
    width: var(--icon-size-sm);
    height: var(--icon-size-sm);
    color: var(--color-brand);
    flex-shrink: 0;
  }
}

.inbox-matter-card__titles {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  min-width: 0;
}

.inbox-matter-card__title {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.inbox-matter-card__subtitle {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.inbox-matter-card__address {
  margin: 0;
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.inbox-matter-card__meta {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-wrap: wrap;
}

.inbox-matter-card__count {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}


/* inbox/matter_context.css */
.inbox-matter-context {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-4);
  background: var(--color-surface-subtle);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
}

.inbox-matter-context__title-row {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  width: 100%;

  .svg {
    width: var(--icon-size-sm);
    height: var(--icon-size-sm);
    color: var(--color-brand);
    flex-shrink: 0;
  }
}

.inbox-matter-context__title {
  flex: 1;
  min-width: 0;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.inbox-matter-context__address {
  margin: 0;
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

.inbox-matter-context__meta {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}


/* inbox/new_conversation.css */
.inbox-new-conversation .ui-bases-record-view__header {
  margin-block-end: var(--space-6);
}

.inbox-new-conversation__instruction {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  margin: 0 0 var(--space-4);
}

/* --- Step 1: Matter grid --- */

.inbox-new-conversation__matter-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
  gap: var(--space-4);
}

/* --- Step 2: Participants --- */

.inbox-new-conversation__form {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
  max-width: 36rem;
}

.inbox-new-conversation__matter-summary {
  padding: var(--space-4);
  background: var(--color-surface-subtle);
  border-radius: var(--radius-md);
}

.inbox-new-conversation__matter-title {
  margin: 0;
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
}

.inbox-new-conversation__matter-address {
  margin: var(--space-1) 0 0;
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.inbox-new-conversation__participants {
  border: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.inbox-new-conversation__legend {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  margin-block-end: var(--space-3);
}

.inbox-new-conversation__participant {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3);
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: background var(--duration-fast) var(--easing-default);

  &:hover {
    background: var(--color-surface-raised);
  }
}

.inbox-new-conversation__checkbox {
  accent-color: var(--color-brand);
  flex-shrink: 0;
}

.inbox-new-conversation__participant-info {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  min-width: 0;
}

.inbox-new-conversation__participant-name {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
}

.inbox-new-conversation__participant-role {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

/* --- Subject + submit --- */

.inbox-new-conversation__field {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.inbox-new-conversation__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  text-align: left;
}

.inbox-new-conversation__input {
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  font-size: var(--font-size-sm);
  font-family: inherit;
  outline: none;

  &:focus {
    border-color: var(--color-brand);
    box-shadow: var(--focus-ring);
  }
}

.inbox-new-conversation__submit {
  align-self: flex-start;
  padding: var(--space-2) var(--space-5);
  border: none;
  border-radius: var(--radius-md);
  background: var(--color-brand);
  color: var(--color-text-inverted);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  cursor: pointer;
  transition: background var(--duration-fast) var(--easing-default);

  &:hover {
    background: var(--color-brand-dark);
  }

  &:focus-visible {
    outline: none;
    box-shadow: var(--focus-ring);
  }
}

@media (max-width: 768px) {
  .inbox-new-conversation__matter-grid {
    grid-template-columns: 1fr;
  }
}


/* inbox/read_receipts.css */
.inbox-read-receipts {
  display: flex;
  align-items: center;
  gap: var(--space-1);
}

.inbox-read-receipts__avatar {
  display: inline-flex;
  cursor: default;
  position: relative;
  opacity: 0.8;
  transition: opacity var(--duration-fast) var(--easing-default);

  &:hover {
    opacity: 1;
  }

  .ui-user-badge {
    transform: scale(0.65);
    transform-origin: bottom right;
  }
}


/* inbox/receipt_zone.css */
.inbox-receipt-zone {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}


/* inbox/show.css */
.inbox-show {
  display: flex;
  flex-direction: column;
}

.inbox-show__layout {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: var(--space-6);
  align-items: start;
  margin-block-start: var(--space-6);
}

.inbox-show__main {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.inbox-show__sidebar {
  position: sticky;
  top: var(--space-6);
}

@media (max-width: 1024px) {
  .inbox-show__layout {
    grid-template-columns: 1fr;
  }

  .inbox-show__sidebar {
    position: static;
    order: -1;
  }
}


/* marketing/concept_section.css */
.marketing-concept-section .steps-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
  counter-reset: steps;
}

@media (min-width: 768px) {
  .marketing-concept-section .steps-list {
    flex-direction: row;
    gap: var(--space-8);
  }
}

.marketing-concept-section .steps-item {
  position: relative;
  display: flex;
  gap: var(--space-4);
  align-items: flex-start;
  flex: 1;
  counter-increment: steps;
  overflow: hidden;
}

.marketing-concept-section .steps-item::before {
  content: counter(steps);
  position: absolute;
  bottom: 0;
  right: 0;
  font-size: 8rem;
  font-weight: var(--font-weight-bold);
  font-family: var(--font-family-display);
  color: var(--color-brand);
  opacity: 0.06;
  line-height: 1;
  pointer-events: none;
  user-select: none;
}

.marketing-concept-section .steps-item-number {
  flex-shrink: 0;
  width: 2rem;
  height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-full);
  background-color: var(--color-brand);
  color: var(--color-text-inverted);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  line-height: 1;
}

.marketing-concept-section .steps-item-body {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.marketing-concept-section .steps-item-label {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  line-height: var(--line-height-snug);
}

.marketing-concept-section .steps-item-description {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  line-height: var(--line-height-normal);
}


/* marketing/contact_form.css */
.marketing-contact-form {
  .contact-field {
    display: grid;
    gap: var(--space-1);
    margin-bottom: var(--space-4);
  }

  label {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--color-text);
  }

  .ui-button[type="submit"] {
    margin-top: var(--space-6);
  }

  input,
  select,
  textarea {
    width: 100%;
    padding: var(--space-2) var(--space-3);
    border: 1.5px solid var(--color-border);
    border-radius: var(--radius-md);
    font-family: var(--font-family-base);
    font-size: var(--font-size-base);
    background: var(--color-surface);
    color: var(--color-text);
    box-sizing: border-box;

    &:focus {
      outline: none;
      border-color: var(--color-brand);
      box-shadow: var(--focus-ring);
    }
  }
}


/* marketing/contact_modal.css */
.marketing-contact-modal {
  h2 {
    margin: 0 0 var(--space-6) 0;
  }
}


/* marketing/engagements_section.css */
.marketing-engagements-section .engagements-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: var(--space-6);
}

@media (min-width: 640px) {
  .marketing-engagements-section .engagements-list {
    grid-template-columns: repeat(2, 1fr);
  }
}

.marketing-engagements-section .engagements-item {
  display: flex;
  gap: var(--space-4);
  align-items: flex-start;
}

.marketing-engagements-section .engagements-item-icon {
  flex-shrink: 0;
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-full);
  background-color: var(--color-brand-surface);
  color: var(--color-brand);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  margin-top: var(--space-1);
}

.marketing-engagements-section .engagements-item-body {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.marketing-engagements-section .engagements-item-label {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  line-height: var(--line-height-snug);
}

.marketing-engagements-section .engagements-item-description {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  line-height: var(--line-height-normal);
}


/* marketing/footer.css */
.marketing-footer {
  display: flex;
  border-top: 1px solid var(--color-border);
  width: 100%;
  margin-top: var(--space-4);
}

.marketing-footer .footer-content-wrapper {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: var(--space-4);
  padding: var(--space-4) 0;
}

.marketing-footer .footer-brand-name {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
}

.marketing-footer .footer-legal {
  font-size: var(--font-size-xs);
  color: var(--color-text-disabled);
}


/* marketing/hero_section.css */
.marketing-hero-section {
  position: relative;
  text-align: center;
  padding: var(--space-16) var(--space-8) var(--space-20);
  background-color: var(--color-brand-surface);
  border-radius: var(--radius-xl);
  overflow: hidden;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 94%);
  margin-bottom: var(--space-4);
}

@media (min-width: 768px) {
  .marketing-hero-section {
    padding-bottom: 0;
  }
}

.marketing-hero-section::before {
  content: "";
  position: absolute;
  top: -40%;
  right: -20%;
  width: 70%;
  padding-bottom: 70%;
  border-radius: 50%;
  background: radial-gradient(circle, var(--color-brand) 0%, transparent 65%);
  opacity: 0.32;
  pointer-events: none;
  z-index: 0;
}

.marketing-hero-section::after {
  content: "";
  position: absolute;
  bottom: 5%;
  left: -15%;
  width: 45%;
  padding-bottom: 45%;
  border-radius: 50%;
  background: radial-gradient(circle, var(--color-brand) 0%, transparent 65%);
  opacity: 0.2;
  pointer-events: none;
  z-index: 0;
}

.marketing-hero-section > * {
  position: relative;
  z-index: 1;
}

.marketing-hero-section h1 {
  font-family: var(--font-family-display);
  font-size: var(--font-size-4xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
  line-height: var(--line-height-tight);
  margin: 0 0 var(--space-4) 0;
}

@media (min-width: 640px) {
  .marketing-hero-section h1 {
    font-size: var(--font-size-5xl);
  }
}

.marketing-hero-section .sub-title {
  font-size: var(--font-size-lg);
  color: var(--color-text-subtle);
  font-style: italic;
  margin-bottom: var(--space-8);
  line-height: var(--line-height-normal);
}

.marketing-hero-section .hero-mockup {
  display: none;
  margin-top: var(--space-12);
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  overflow: hidden;
  border: 1px solid var(--color-border);
  border-bottom: none;
  box-shadow: var(--shadow-xl);
  text-align: left;
  width: 82%;
  margin-inline: auto;
}

@media (min-width: 768px) {
  .marketing-hero-section .hero-mockup {
    display: block;
  }
}

.marketing-hero-section .hero-mockup-bar {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-4);
  background-color: var(--color-surface-subtle);
  border-bottom: 1px solid var(--color-border);
}

.marketing-hero-section .hero-mockup-dot {
  display: block;
  width: 0.75rem;
  height: 0.75rem;
  border-radius: var(--radius-full);
  flex-shrink: 0;
}

.marketing-hero-section .hero-mockup-dot--close    { background-color: #ff5f57; }
.marketing-hero-section .hero-mockup-dot--minimize { background-color: #febc2e; }
.marketing-hero-section .hero-mockup-dot--zoom     { background-color: #28c840; }

.marketing-hero-section .hero-mockup-screenshot {
  display: block;
  width: 100%;
  height: auto;
}


/* marketing/homepage.css */
.marketing-homepage {
  display: grid;
  gap: var(--space-16);
  max-width: 72rem;
  margin-inline: auto;
  padding-inline: var(--space-4);
  padding-block: var(--space-12);
}

@media (min-width: 640px) {
  .marketing-homepage {
    padding-inline: var(--space-8);
  }
}

@media (min-width: 1024px) {
  .marketing-homepage {
    padding-inline: var(--space-12);
  }
}

.marketing-homepage .homepage-cta-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-6);
  text-align: center;
  padding: var(--space-10) var(--space-4);
  background-color: var(--color-brand-surface);
  border-radius: var(--radius-xl);
}

@media (min-width: 640px) {
  .marketing-homepage .homepage-cta-block {
    padding: var(--space-12) var(--space-8);
  }
}

.marketing-homepage .homepage-cta-block .ui-button {
  width: 100%;
}

@media (min-width: 640px) {
  .marketing-homepage .homepage-cta-block .ui-button {
    width: auto;
  }
}

.marketing-homepage .homepage-cta-heading {
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  line-height: var(--line-height-snug);
  margin: 0;
}


/* marketing/problems_section.css */
.marketing-problems-section {
  .problems-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-6);
    position: relative;

    @media (min-width: 768px) {
      grid-template-columns: 1fr auto 1fr;
      align-items: start;
    }
  }

  .problems-arrow {
    display: none;

    @media (min-width: 768px) {
      display: flex;
      align-items: center;
      justify-content: center;
      align-self: center;
      width: 2.5rem;
      height: 2.5rem;
      border-radius: var(--radius-full);
      background-color: var(--color-brand);
      color: var(--color-text-inverted);
      font-size: var(--font-size-lg);
      font-weight: var(--font-weight-bold);
      flex-shrink: 0;
      box-shadow: var(--shadow-md);
      margin-top: 3.25rem;
    }
  }

  .problems-column {
    display: flex;
    flex-direction: column;
    gap: 0;
    border-radius: var(--radius-lg);
    overflow: hidden;
  }

  .problems-column--before {
    background: var(--color-danger-subtle);
  }

  .problems-column--after {
    background: var(--color-success-subtle);
  }

  .problems-column-header {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-4) var(--space-5);
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-base);
  }

  .problems-column-header--before {
    color: var(--color-danger);
  }

  .problems-column-header--after {
    color: var(--color-success);
  }

  .problems-header-icon {
    width: 1.125rem;
    height: 1.125rem;
    flex-shrink: 0;
  }

  .problems-column ul {
    list-style: none;
    padding: var(--space-4) var(--space-4);
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
  }

  .problems-item {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    border-radius: var(--radius-md);
    background-color: rgba(255, 255, 255, 0.7);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.9);
  }

  .problems-item-icon {
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-sm);
    flex-shrink: 0;
    width: 1.25rem;
    text-align: center;
  }

  .problems-item--before .problems-item-icon {
    color: var(--color-danger);
  }

  .problems-item--after .problems-item-icon {
    color: var(--color-success);
  }

  .problems-item-text {
    flex: 1;
    color: var(--color-text);
    font-size: var(--font-size-sm);
    line-height: var(--line-height-snug);
  }
}


/* marketing/section_title.css */
.marketing-section-title {
  font-family: var(--font-family-display);
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  line-height: var(--line-height-snug);
  margin-bottom: var(--space-8);
  padding-left: var(--space-4);
  border-left: 3px solid var(--color-brand);
}


/* marketing/services_section.css */
.marketing-services-section .services-grid {
  display: grid;
  gap: var(--space-4);
  grid-template-columns: 1fr;
}

@media (min-width: 640px) {
  .marketing-services-section .services-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .marketing-services-section .services-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.marketing-services-section .services-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding: var(--space-6) var(--space-6);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background-color: var(--color-surface);
  user-select: none;
  transition: box-shadow var(--duration-normal) var(--easing-default),
              border-color var(--duration-normal) var(--easing-default),
              transform var(--duration-normal) var(--easing-default);
}

.marketing-services-section .services-card-icon {
  transition: transform var(--duration-normal) var(--easing-default);
}

.marketing-services-section .services-card:hover {
  border-color: var(--color-brand-light);
  border-top-color: var(--color-brand);
  border-top-width: 2px;
  box-shadow: var(--shadow-md);
  transform: translateY(-3px);
}

.marketing-services-section .services-card:hover .services-card-icon {
  transform: scale(1.15);
}

.marketing-services-section .services-card-icon {
  width: 1.75rem;
  height: 1.75rem;
  color: var(--color-brand);
  margin-bottom: var(--space-2);
  flex-shrink: 0;
}

.marketing-services-section .services-card-label {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  line-height: var(--line-height-snug);
}

.marketing-services-section .services-card-description {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  line-height: var(--line-height-normal);
}


/* member/navigation/sidebar.css */
.member-navigation-sidebar .ui-notification-badge {
  margin-left: auto;
}

.member-navigation-sidebar {
  align-self: flex-start;
  position: sticky;
  top: var(--navbar-height);
  height: calc(100dvh - var(--navbar-height));
  width: 0;
  background: var(--color-surface-subtle);
  border-right: none;
  padding: 0;
  box-sizing: border-box;
  flex-shrink: 0;
  overflow: hidden;
  transition:
    width var(--duration-slow) var(--easing-out),
    padding var(--duration-slow) var(--easing-out);

  nav {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
  }

  .sidebar-expand-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: flex-end;
    width: 2rem;
    height: 2rem;
    padding: 0;
    border: none;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--color-text-subtle);
    cursor: pointer;
    flex-shrink: 0;
    transition:
      background var(--duration-fast) var(--easing-default),
      color var(--duration-fast) var(--easing-default);

    &:hover {
      background: var(--color-surface-raised);
      color: var(--color-text);
    }

    &:focus-visible {
      outline: none;
      box-shadow: var(--focus-ring);
    }

    .svg {
      width: 1rem;
      height: 1rem;
      flex-shrink: 0;
      transition: transform var(--duration-slow) var(--easing-out);
    }
  }

  .sidebar-link {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-3);
    padding: var(--space-3);
    border-radius: var(--radius-md);
    text-decoration: none;
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-subtle);
    transition:
      background var(--duration-fast) var(--easing-default),
      color var(--duration-fast) var(--easing-default);

    span {
      display: none;
    }

    .svg {
      width: var(--icon-size-sm);
      height: var(--icon-size-sm);
      flex-shrink: 0;
    }

    &:hover:not(.sidebar-link--active) {
      background: var(--color-brand-a10);
      color: var(--color-text);
    }

    &:focus-visible {
      outline: none;
      box-shadow: var(--focus-ring);
    }
  }

  .sidebar-link--active {
    background: var(--color-brand-surface);
    color: var(--color-brand);
    font-weight: var(--font-weight-semibold);
    box-shadow: inset var(--space-1) 0 0 var(--color-brand);
  }

  &.is-compact {
    width: var(--sidebar-compact-width);
    padding: var(--space-6) var(--space-3);

    .sidebar-expand-toggle {
      align-self: center;
    }
  }

  &.is-compact {
    border-right: 1px solid var(--color-border);
    overflow-x: hidden;
    overflow-y: auto;
  }

  &.is-expanded {
    width: var(--sidebar-width);
    padding: var(--space-6) var(--space-4);
    border-right: 1px solid var(--color-border);
    overflow-x: hidden;
    overflow-y: auto;

    .sidebar-expand-toggle {
      align-self: flex-end;

      .svg {
        transform: rotate(180deg);
      }
    }

    .sidebar-link {
      justify-content: flex-start;
      padding: var(--space-3) var(--space-4);

      span {
        display: block;
      }
    }
  }
}

@media (max-width: 1023px) {
  .member-navigation-sidebar {
    position: fixed;
    top: var(--navbar-height);
    left: 0;
    bottom: 0;
    z-index: var(--z-modal);
    width: 0;
    padding: 0;
    border-right: none;
    box-shadow: none;
    align-self: auto;
  }

  .member-navigation-sidebar.is-compact {
    width: var(--sidebar-compact-width);
    padding: var(--space-6) var(--space-3);
    border-right: 1px solid var(--color-border);
    box-shadow: var(--shadow-lg);
    overflow-y: auto;
  }

  .member-navigation-sidebar.is-expanded {
    width: var(--sidebar-width);
    padding: var(--space-6) var(--space-4);
    border-right: 1px solid var(--color-border);
    box-shadow: var(--shadow-lg);
    overflow-y: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .member-navigation-sidebar,
  .member-navigation-sidebar .sidebar-expand-toggle .svg {
    transition: none;
  }
}


/* member/notary/agent_profiles/form_intro.css */
.member-notary-agent-profiles-form-intro {
  padding: var(--space-4);
  background-color: var(--color-surface-subtle);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-6);
}

.member-notary-agent-profiles-form-intro__heading {
  margin: 0 0 var(--space-2) 0;
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.member-notary-agent-profiles-form-intro__description {
  margin: 0 0 var(--space-4) 0;
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  line-height: var(--line-height-normal);
}

.member-notary-agent-profiles-form-intro__steps {
  margin: 0;
  padding-left: var(--space-6);
  list-style-type: decimal;
}

.member-notary-agent-profiles-form-intro__step {
  font-size: var(--font-size-sm);
  color: var(--color-text);
  line-height: var(--line-height-normal);
  margin-bottom: var(--space-2);
}

.member-notary-agent-profiles-form-intro__step:last-child {
  margin-bottom: 0;
}

@media (min-width: 640px) {
  .member-notary-agent-profiles-form-intro {
    padding: var(--space-6);
    margin-bottom: var(--space-8);
  }
}


/* member/notary/agent_profiles/show.css */
.member-notary-agent-profiles-show {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: var(--space-4);
}

.member-notary-agent-profiles-show__header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
  padding-bottom: var(--space-4);
  border-bottom: 1px solid var(--color-border);
}

.member-notary-agent-profiles-show__header-content {
  flex: 1;
}

.member-notary-agent-profiles-show__title {
  margin: 0;
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  color: var(--color-text);
}

.member-notary-agent-profiles-show__preview {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-6);
  align-items: start;
}

.member-notary-agent-profiles-show__photo {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 150px;
  padding: var(--space-4);
  background-color: var(--color-surface-subtle);
  border-radius: var(--radius-md);
}

.member-notary-agent-profiles-show__photo--empty {
  border: 1px dashed var(--color-border);
  color: var(--color-text-subtle);
  font-size: var(--font-size-sm);
  text-align: center;
}

.member-notary-agent-profiles-show__details {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}

.member-notary-agent-profiles-show__detail {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.member-notary-agent-profiles-show__detail--empty {
  opacity: 0.6;
}

.member-notary-agent-profiles-show__label {
  margin: 0;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.member-notary-agent-profiles-show__value {
  margin: 0;
  font-size: var(--font-size-base);
  color: var(--color-text);
  word-break: break-word;
  white-space: pre-wrap;
}

.member-notary-agent-profiles-show__footer {
  display: flex;
  justify-content: flex-end;
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-border);
}

@media (min-width: 640px) {
  .member-notary-agent-profiles-show {
    padding: var(--space-6);
    gap: var(--space-6);
  }

  .member-notary-agent-profiles-show__header {
    flex-direction: row;
    justify-content: space-between;
  }

  .member-notary-agent-profiles-show__preview {
    grid-template-columns: minmax(200px, 1fr) 2fr;
  }

  .member-notary-agent-profiles-show__photo {
    min-height: 200px;
  }
}


/* member/notary/agent_websites/edit.css */
.member-notary-agent-websites-edit__body .ui-form {
  gap: var(--space-8);
}

.member-notary-agent-websites-edit__body .ui-form > * {
  margin-top: 0;
}

.member-notary-agent-websites-edit__body .ui-input label {
  justify-content: flex-start;
  gap: var(--space-2);
}


/* member/notary/agent_websites/file_preview_field.css */
.member-notary-agent-websites-file-preview-field {
  display: grid;
  column-gap: var(--space-4);
  row-gap: var(--space-2);
  align-items: start;
}

.member-notary-agent-websites-file-preview-field:has(> .member-notary-agent-websites-file-preview-field__preview) {
  grid-template-areas:
    "preview label"
    "preview input";
}

.member-notary-agent-websites-file-preview-field--square:has(> .member-notary-agent-websites-file-preview-field__preview) {
  grid-template-columns: 64px 1fr;
}

.member-notary-agent-websites-file-preview-field--wide:has(> .member-notary-agent-websites-file-preview-field__preview) {
  grid-template-columns: 200px 1fr;
}

.member-notary-agent-websites-file-preview-field:not(:has(> .member-notary-agent-websites-file-preview-field__preview)) {
  grid-template-columns: 1fr;
  grid-template-areas:
    "label"
    "input";
}

.member-notary-agent-websites-file-preview-field__preview {
  grid-area: preview;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-2);
  background-color: var(--color-surface-subtle);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
}

.member-notary-agent-websites-file-preview-field--square .member-notary-agent-websites-file-preview-field__preview {
  width: 64px;
  height: 64px;
}

.member-notary-agent-websites-file-preview-field--wide .member-notary-agent-websites-file-preview-field__preview {
  width: 200px;
  height: 64px;
}

.member-notary-agent-websites-file-preview-field__preview-img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}

.member-notary-agent-websites-file-preview-field .ui-input {
  display: contents;
}

.member-notary-agent-websites-file-preview-field .ui-input > label {
  grid-area: label;
  justify-content: flex-start;
  gap: var(--space-2);
}

.member-notary-agent-websites-file-preview-field .ui-help-tooltip__panel {
  right: auto;
  left: calc(100% + var(--space-2));
}

.member-notary-agent-websites-file-preview-field .ui-input > input {
  grid-area: input;
  justify-self: start;
  width: auto;
  max-width: 100%;
}

@media (max-width: 640px) {
  .member-notary-agent-websites-file-preview-field--square:has(> .member-notary-agent-websites-file-preview-field__preview),
  .member-notary-agent-websites-file-preview-field--wide:has(> .member-notary-agent-websites-file-preview-field__preview) {
    grid-template-columns: 1fr;
    grid-template-areas:
      "label"
      "preview"
      "input";
  }
}


/* member/notary/agent_websites/publications/index.css */
.publication-row-thumb {
  display: block;
  width: 96px;
  height: 72px;
  border-radius: var(--radius-md);
  overflow: hidden;
  background-color: var(--color-surface-subtle);
  flex-shrink: 0;
}

.publication-row-thumb__img,
.publication-row-thumb__img > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 768px) {
  td:has(> .publication-row-thumb) {
    display: block;
    padding: 0;
    margin-bottom: var(--space-3);
    border-bottom: none;
  }

  td:has(> .publication-row-thumb)::before {
    display: none;
  }

  .publication-row-thumb {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
  }
}


/* member/notary/agent_websites/publications/unpublish_modal.css */


/* member/notary/agent_websites/show.css */
.member-notary-agent-websites-show {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: var(--space-4);
}

.member-notary-agent-websites-show__header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
  padding-bottom: var(--space-4);
  border-bottom: 1px solid var(--color-border);
}

.member-notary-agent-websites-show__header-content {
  flex: 1;
}

.member-notary-agent-websites-show__title {
  margin: 0;
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  color: var(--color-text);
}

.member-notary-agent-websites-show__subtitle {
  margin: var(--space-2) 0 0;
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.member-notary-agent-websites-show__preview {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-6);
  align-items: start;
}

.member-notary-agent-websites-show__logo {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 150px;
  padding: var(--space-4);
  background-color: var(--color-surface-subtle);
  border-radius: var(--radius-md);
}

/* Neutralise le wrapper <picture> rendu par UI::Display::Picture pour que
   l'<img> enfant respecte directement le flex (centrage) du parent .__logo. */
picture.member-notary-agent-websites-show__logo-img {
  display: contents;
}

img.member-notary-agent-websites-show__logo-img {
  display: block;
  max-width: 100%;
  max-height: 120px;
  width: auto;
  height: auto;
  object-fit: contain;
}

.member-notary-agent-websites-show__logo--empty {
  border: 1px dashed var(--color-border);
  color: var(--color-text-subtle);
  font-size: var(--font-size-sm);
  text-align: center;
}

.member-notary-agent-websites-show__details {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  min-width: 0;
}

.member-notary-agent-websites-show__detail {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.member-notary-agent-websites-show__detail--empty {
  opacity: 0.6;
}

.member-notary-agent-websites-show__label {
  margin: 0;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.member-notary-agent-websites-show__value {
  margin: 0;
  font-size: var(--font-size-base);
  color: var(--color-text);
  word-break: break-word;
  white-space: pre-wrap;
}

.member-notary-agent-websites-show__header-actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-2);
}

@media (min-width: 640px) {
  .member-notary-agent-websites-show {
    padding: var(--space-6);
    gap: var(--space-6);
  }

  .member-notary-agent-websites-show__header {
    flex-direction: row;
    justify-content: space-between;
  }

  .member-notary-agent-websites-show__preview {
    grid-template-columns: minmax(200px, 1fr) 2fr;
  }

  .member-notary-agent-websites-show__logo {
    min-height: 200px;
  }
}


/* member/notary/properties/card.css */
.member-notary-properties-card {
  display: flex;
  flex-direction: column;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  text-decoration: none;
  color: var(--color-text);
  transition: border-color 150ms, transform 150ms;
}

.member-notary-properties-card:hover {
  border-color: var(--color-border-strong);
  transform: translateY(-2px);
}

.member-notary-properties-card__cover,
.member-notary-properties-card__cover-placeholder {
  width: 100%;
  aspect-ratio: 4 / 3;
  background-color: var(--color-surface-subtle);
  overflow: hidden;
}

.member-notary-properties-card__cover-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.member-notary-properties-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding: var(--space-4);
}

.member-notary-properties-card__title {
  margin: 0;
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  line-height: var(--line-height-tight);
}

.member-notary-properties-card__address {
  margin: 0;
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.member-notary-properties-card__matter {
  margin: 0;
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  font-style: italic;
}

.member-notary-properties-card__pills {
  display: flex;
  gap: var(--space-2);
  margin-top: var(--space-2);
  flex-wrap: wrap;
}


/* member/notary/properties/list.css */
.member-notary-properties-list__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: var(--space-4);
  margin-top: var(--space-4);
}


/* notary/email_drafts/composer.css */
.notary-email-drafts-composer {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.notary-email-drafts-composer__layout {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: var(--space-6);
  align-items: start;
  padding: var(--space-6);
  flex: 1;
}

.notary-email-drafts-composer__main {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-email-drafts-composer__intention {
  margin-bottom: var(--space-2);
}

.notary-email-drafts-composer__form {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: var(--space-4);
  background: var(--color-surface-subtle);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
}

.notary-email-drafts-composer__field {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.notary-email-drafts-composer__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
}

.notary-email-drafts-composer__recipient-value {
  font-size: var(--font-size-sm);
  color: var(--color-text);
  padding: var(--space-2) var(--space-3);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
}

.notary-email-drafts-composer__input {
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  font-size: var(--font-size-sm);
  font-family: inherit;
  color: var(--color-text);
  background: var(--color-surface);
}

.notary-email-drafts-composer__input:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 2px var(--color-primary-subtle);
}

.notary-email-drafts-composer__textarea {
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  font-size: var(--font-size-sm);
  font-family: inherit;
  color: var(--color-text);
  background: var(--color-surface);
  resize: vertical;
  min-height: 200px;
}

.notary-email-drafts-composer__textarea:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 2px var(--color-primary-subtle);
}

.notary-email-drafts-composer__info {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2);
  padding: var(--space-3);
  background: var(--color-info-subtle);
  border: 1px solid var(--color-info);
  border-radius: var(--radius-sm);
  font-size: var(--font-size-sm);
  color: var(--color-info);
}

.notary-email-drafts-composer__info-icon {
  flex-shrink: 0;
  font-weight: var(--font-weight-bold);
}

.notary-email-drafts-composer__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--space-3);
  padding: var(--space-4);
  border-top: 1px solid var(--color-border);
  background: var(--color-surface-subtle);
}

.notary-email-drafts-composer__sidebar {
  position: sticky;
  top: var(--space-6);
}

@media (max-width: 1024px) {
  .notary-email-drafts-composer__layout {
    grid-template-columns: 1fr;
    gap: var(--space-4);
  }

  .notary-email-drafts-composer__sidebar {
    position: static;
  }
}


/* notary/email_drafts/confirm_sent_screen.css */
.notary-email-drafts-confirm-sent-screen {
  max-width: 480px;
  margin: var(--space-8) auto;
  padding: var(--space-6);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  text-align: center;
  box-shadow: var(--shadow-md);
}

.notary-email-drafts-confirm-sent-screen__heading {
  margin-bottom: var(--space-6);
}

.notary-email-drafts-confirm-sent-screen__title {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin-bottom: var(--space-2);
}

.notary-email-drafts-confirm-sent-screen__description {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.notary-email-drafts-confirm-sent-screen__actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-3);
}

@media (max-width: 640px) {
  .notary-email-drafts-confirm-sent-screen {
    margin: var(--space-4);
    padding: var(--space-4);
  }

  .notary-email-drafts-confirm-sent-screen__actions {
    flex-direction: column;
    width: 100%;
  }

  .notary-email-drafts-confirm-sent-screen__actions button {
    width: 100%;
  }
}


/* notary/email_drafts/pending_banner.css */
.notary-email-drafts-pending-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  background: var(--color-warning-subtle);
  border: 1px solid var(--color-warning);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-4);
}

.notary-email-drafts-pending-banner__content {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.notary-email-drafts-pending-banner__icon {
  font-size: var(--font-size-lg);
  flex-shrink: 0;
}

.notary-email-drafts-pending-banner__text {
  font-size: var(--font-size-sm);
  color: var(--color-text);
}

.notary-email-drafts-pending-banner__actions {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-shrink: 0;
}


/* notary/matters/aspect_gauge.css */
.notary-matters-aspect-gauge__link {
  display: block;
  width: 100%;
  text-decoration: none;
  color: inherit;
  border: none;
  background: none;
  padding: 0;
  margin: 0;
  font: inherit;
  text-align: inherit;
  border-radius: var(--radius-lg);
  cursor: pointer;
  position: relative;
  transition: transform var(--duration-fast) var(--easing-default),
              box-shadow var(--duration-fast) var(--easing-default);
}

.notary-matters-aspect-gauge__link:disabled {
  cursor: default;
}

.notary-matters-aspect-gauge__link:not(:disabled):hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}

.notary-matters-aspect-gauge__link:not(:disabled):active {
  transform: translateY(0);
  box-shadow: var(--shadow-sm);
}

/* Override loading-link spinner: overlay centered */
.notary-matters-aspect-gauge__link.loading-link--loading::after {
  position: absolute;
  inset: 0;
  margin: auto;
  width: 1.5rem;
  height: 1.5rem;
}

.notary-matters-aspect-gauge__link.loading-link--loading .ui-gauge {
  opacity: 0.3;
}


/* notary/matters/card.css */
.notary-matters-card__cover {
  display: block;
  width: 100%;
  max-height: 240px;
  object-fit: cover;
  border-radius: var(--radius-md);
  margin-block: var(--space-3);
}

.notary-matters-card__prices {
  display: flex;
  gap: var(--space-6);
  padding-block: var(--space-4);
  margin-block: var(--space-2);
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
}

.notary-matters-card__price {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.notary-matters-card__price-value {
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}

.notary-matters-card__price--estimated .notary-matters-card__price-value {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
}

.notary-matters-card__price-label {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.notary-matters-card__details {
  margin-block-start: var(--space-2);
}

.notary-matters-card__role-value {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}


/* notary/matters/context_card.css */
.notary-matters-context-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  min-width: 0;
}

.notary-matters-context-card__title {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-matters-context-card__row {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--font-size-sm);
  min-width: 0;
}

.notary-matters-context-card__row-icon {
  flex-shrink: 0;
  line-height: 1;
}

.notary-matters-context-card__row-label {
  color: var(--color-text-subtle);
  flex-shrink: 0;
}

.notary-matters-context-card__row-value {
  color: var(--color-text);
}

.notary-matters-context-card__dates {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.notary-matters-context-card__delay {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
  margin-left: auto;
}

.notary-matters-context-card__delay--urgent {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-danger);
  margin-left: auto;
}

.notary-matters-context-card__progress {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.notary-matters-context-card__progress .ui-bases-progress-bar {
  width: 100%;
}


/* notary/matters/copy_invitation_link_button.css */
.notary-matters-copy-invitation-link-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-1);
  padding: var(--space-1) var(--space-2);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-brand);
  background: var(--color-white);
  border: 1px solid var(--color-brand-a20);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: color 300ms ease-out, border-color 300ms ease-out, background 150ms ease-out;
}

.notary-matters-copy-invitation-link-button:hover {
  background: var(--color-brand-a10);
}

.notary-matters-copy-invitation-link-button--copied {
  color: var(--color-success);
  border-color: var(--color-success-light);
}

.notary-matters-copy-invitation-link-button .svg {
  width: 14px;
  height: 14px;
}


/* notary/matters/diagnostics/checklist_nav.css */
.notary-matters-diagnostics-checklist-nav__heading {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0 0 var(--space-2) 0;
}

.notary-matters-diagnostics-checklist-nav__list {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  max-height: 280px;
  overflow-y: auto;
}


/* notary/matters/diagnostics/checklist_nav_item.css */
.notary-matters-diagnostics-checklist-nav-item {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-3);
  font-size: var(--font-size-xs);
  color: var(--color-text);
  text-decoration: none;
  border-bottom: 1px solid var(--color-border);
  cursor: pointer;
}

.notary-matters-diagnostics-checklist-nav-item:last-child {
  border-bottom: none;
}

a.notary-matters-diagnostics-checklist-nav-item:hover {
  background-color: var(--color-surface-subtle);
}

.notary-matters-diagnostics-checklist-nav-item--active {
  background-color: var(--color-brand-surface);
  cursor: default;
}

.notary-matters-diagnostics-checklist-nav-item__label {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.notary-matters-diagnostics-checklist-nav-item__context {
  color: var(--color-text-disabled);
  font-size: var(--font-size-xs);
  white-space: nowrap;
}


/* notary/matters/diagnostics/diagnostic_item.css */
.notary-matters-diagnostics-diagnostic-item + .notary-matters-diagnostics-diagnostic-item {
  border-top: 1px solid var(--color-border);
}

.notary-matters-diagnostics-diagnostic-item__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  text-decoration: none;
  color: inherit;
  border-radius: var(--radius-sm);
  transition: background-color var(--duration-fast) var(--easing-default);

  &:hover {
    background-color: var(--color-surface-raised);
  }
}

.notary-matters-diagnostics-diagnostic-item__label {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-width: 0;
}

.notary-matters-diagnostics-diagnostic-item__type {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.notary-matters-diagnostics-diagnostic-item__scope {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  white-space: nowrap;
}

.notary-matters-diagnostics-diagnostic-item__status {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-shrink: 0;
}

.notary-matters-diagnostics-diagnostic-item__auto-badge {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-brand);
  background-color: var(--color-brand-surface);
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-full);
  white-space: nowrap;
}



/* notary/matters/diagnostics/overview.css */
.notary-matters-diagnostics-overview__header-progress {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-width: 8rem;
}

.notary-matters-diagnostics-overview__header-progress .ui-bases-progress-bar {
  flex: 1;
}

.notary-matters-diagnostics-overview__progress-count {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.notary-matters-diagnostics-overview__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-matters-diagnostics-overview__group {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.notary-matters-diagnostics-overview__group-label {
  margin: 0;
  padding: var(--space-2) var(--space-4);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  background-color: var(--color-surface-subtle);
  border-bottom: 1px solid var(--color-border);
}

.notary-matters-diagnostics-overview__list {
  list-style: none;
  margin: 0;
  padding: 0;
}


/* notary/matters/diagnostics/show.css */
.notary-matters-diagnostics-show {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-matters-diagnostics-show__split {
  display: grid;
  grid-template-columns: 3fr 2fr;
  gap: var(--space-6);
  min-height: 70vh;
}

.notary-matters-diagnostics-show__preview {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background-color: var(--color-surface-subtle);
}

.notary-matters-diagnostics-show__info {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background-color: var(--color-surface);
  align-self: start;
}

.notary-matters-diagnostics-show__info-row {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding-bottom: var(--space-4);
  border-bottom: 1px solid var(--color-border);
}

.notary-matters-diagnostics-show__info-row:last-child {
  padding-bottom: 0;
  border-bottom: none;
}

.notary-matters-diagnostics-show__info-label {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.notary-matters-diagnostics-show__info-value {
  font-size: var(--font-size-sm);
  color: var(--color-text);
}

@media (max-width: 767px) {
  .notary-matters-diagnostics-show__split {
    grid-template-columns: 1fr;
    min-height: auto;
  }

  .notary-matters-diagnostics-show__preview {
    min-height: 50vh;
  }
}


/* notary/matters/documents/category_label.css */
.notary-matters-documents-checklist-item--missing .ui-label-with-tooltip__text {
  color: var(--color-text-subtle);
}

.notary-matters-documents-checklist-item-row .ui-help-tooltip__panel {
  right: auto;
  left: calc(100% + var(--space-2));
  z-index: var(--z-modal);
  background: var(--color-surface);
  border: 1.5px solid var(--color-border);
  box-shadow: var(--shadow-lg);
}


/* notary/matters/documents/checklist_item.css */
.notary-matters-documents-checklist-item {
  display: flex;
  flex-direction: column;
  background-color: var(--color-surface);
  position: relative;
  z-index: 0;
  scroll-margin-top: calc(var(--navbar-height) + var(--space-4));
}

.notary-matters-documents-checklist-item:has(.ui-help-tooltip__panel:not([hidden])) {
  z-index: var(--z-modal);
}

.notary-matters-documents-checklist-item .ui-inputs-file-dropzone {
  padding: 0 var(--space-4) var(--space-3);
}

.notary-matters-documents-checklist-item__reupload {
  padding: 0 var(--space-4) var(--space-3);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.notary-matters-documents-checklist-item__reupload-dropzone.collapsed {
  display: none;
}

.notary-matters-documents-checklist-item__reupload-dropzone.expanded {
  display: block;
}


/* notary/matters/documents/checklist_item_row.css */
.notary-matters-documents-checklist-item-row {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
}

.notary-matters-documents-checklist-item-row__link {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  text-decoration: none;
  color: inherit;
}

.notary-matters-documents-checklist-item-row__link:hover {
  background-color: var(--color-surface-subtle);
}


/* notary/matters/documents/checklist_nav.css */
.notary-matters-documents-checklist-nav__heading {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0 0 var(--space-2) 0;
}

.notary-matters-documents-checklist-nav__list {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  max-height: 100px;
  overflow-y: auto;
}


/* notary/matters/documents/checklist_nav_item.css */
.notary-matters-documents-checklist-nav-item {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-3);
  font-size: var(--font-size-xs);
  color: var(--color-text);
  text-decoration: none;
  border-bottom: 1px solid var(--color-border);
  cursor: pointer;
}

.notary-matters-documents-checklist-nav-item:last-child {
  border-bottom: none;
}

a.notary-matters-documents-checklist-nav-item:hover {
  background-color: var(--color-surface-subtle);
}

.notary-matters-documents-checklist-nav-item--active {
  background-color: var(--color-brand-surface);
  cursor: default;
}

.notary-matters-documents-checklist-nav-item__label {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.notary-matters-documents-checklist-nav-item__context {
  color: var(--color-text-disabled);
  font-size: var(--font-size-xs);
  white-space: nowrap;
}


/* notary/matters/documents/document_actions.css */
.notary-matters-documents-document-actions {
  display: flex;
  gap: var(--space-3);
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-border);
}

.notary-matters-documents-document-actions > * {
  flex: 1;
}


/* notary/matters/documents/document_context.css */
.notary-matters-documents-document-context {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-matters-documents-document-context__block {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.notary-matters-documents-document-context__heading {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0;
}

.notary-matters-documents-document-context__category {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.notary-matters-documents-document-context__documentable {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3);
  background-color: var(--color-surface-subtle);
  border-radius: var(--radius-md);
}

.notary-matters-documents-document-context__documentable-icon {
  font-size: var(--font-size-lg);
  flex-shrink: 0;
}

.notary-matters-documents-document-context__documentable-info {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  min-width: 0;
}

.notary-matters-documents-document-context__documentable-name {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.notary-matters-documents-document-context__documentable-type {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

.notary-matters-documents-document-context__detail {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--space-3);
  padding: var(--space-1) 0;
}

.notary-matters-documents-document-context__detail + .notary-matters-documents-document-context__detail {
  border-top: 1px solid var(--color-border);
}

.notary-matters-documents-document-context__detail-label {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  flex-shrink: 0;
}

.notary-matters-documents-document-context__detail-value {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  text-align: right;
}

.notary-matters-documents-document-context__status {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-3);
  border-radius: var(--radius-md);
}

.notary-matters-documents-document-context__status--missing {
  background-color: var(--color-surface-subtle);
}

.notary-matters-documents-document-context__status--pending {
  background-color: var(--color-warning-surface);
}

.notary-matters-documents-document-context__status--validated {
  background-color: var(--color-success-surface);
}

.notary-matters-documents-document-context__status--rejected {
  background-color: var(--color-danger-surface);
}

.notary-matters-documents-document-context__status-content {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.notary-matters-documents-document-context__status-label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}

.notary-matters-documents-document-context__status-hint {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

.notary-matters-documents-document-context__status--rejected .notary-matters-documents-document-context__status-hint {
  color: var(--color-danger);
}

.notary-matters-documents-document-context__history {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.notary-matters-documents-document-context__history-line {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-2) var(--space-3);
  background-color: var(--color-danger-surface);
  border-radius: var(--radius-md);
}

.notary-matters-documents-document-context__history-content {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  min-width: 0;
}

.notary-matters-documents-document-context__history-filename {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.notary-matters-documents-document-context__history-meta {
  font-size: var(--font-size-xs);
  color: var(--color-danger);
}


/* notary/matters/documents/document_detail.css */
.notary-matters-documents-document-detail {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding: 0 var(--space-4) var(--space-3);
  padding-left: calc(var(--space-4) + var(--font-size-base) + var(--space-3));
}

.notary-matters-documents-document-detail__file {
  display: flex;
  align-items: center;
  gap: var(--space-1);
}

.notary-matters-documents-document-detail__file-icon {
  font-size: var(--font-size-sm);
}

.notary-matters-documents-document-detail__filename {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-brand);
  text-decoration: none;
}

.notary-matters-documents-document-detail__filename:hover {
  text-decoration: underline;
}

.notary-matters-documents-document-detail__filesize {
  font-size: var(--font-size-xs);
  color: var(--color-text-disabled);
}

.notary-matters-documents-document-detail__meta {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

.notary-matters-documents-document-detail__meta--validated {
  color: var(--color-success);
}


/* notary/matters/documents/document_item.css */
.notary-matters-documents-document-item {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-5);
  border: 1px solid var(--color-border);
  border-top: none;
  background-color: var(--color-surface);
}

.notary-matters-documents-document-item:last-child {
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
}

.notary-matters-documents-document-item__status-icon {
  font-size: var(--font-size-sm);
  flex-shrink: 0;
}

.notary-matters-documents-document-item__info {
  flex: 1;
}

.notary-matters-documents-document-item__filename {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}

.notary-matters-documents-document-item__detail {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

.notary-matters-documents-document-item__detail--validated {
  color: var(--color-success);
}

.notary-matters-documents-document-item__detail--rejected {
  color: var(--color-danger);
}


/* notary/matters/documents/document_metadata.css */
.notary-matters-documents-document-metadata__heading {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0 0 var(--space-2) 0;
}

.notary-matters-documents-document-metadata__list {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-1) var(--space-4);
}

.notary-matters-documents-document-metadata__dt {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
}

.notary-matters-documents-document-metadata__dd {
  font-size: var(--font-size-sm);
  color: var(--color-text);
  margin: 0;
}

.notary-matters-documents-document-metadata__dt--danger {
  color: var(--color-danger);
}

.notary-matters-documents-document-metadata__dd--danger {
  color: var(--color-danger);
  font-weight: var(--font-weight-medium);
}


/* notary/matters/documents/document_preview.css */
.notary-matters-documents-document-preview {
  width: 100%;
  height: 100%;
}

.notary-matters-documents-document-preview__iframe {
  width: 100%;
  height: 100%;
  border: none;
}

.notary-matters-documents-document-preview__image {
  width: 100%;
  height: auto;
  max-height: 100%;
  object-fit: contain;
  cursor: zoom-in;
}

.notary-matters-documents-document-preview__unsupported {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-3);
  height: 100%;
  padding: var(--space-8);
}

.notary-matters-documents-document-preview__unsupported-icon {
  font-size: var(--font-size-4xl);
}

.notary-matters-documents-document-preview__unsupported-label {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.notary-matters-documents-document-preview__download-link {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-brand);
}


/* notary/matters/documents/group_card.css */
.notary-matters-documents-group-card {
  border-bottom: 1px solid var(--color-border);
}

.notary-matters-documents-group-card:last-child {
  border-bottom: none;
}

.notary-matters-documents-group-card__header {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-5);
  background-color: var(--color-surface);
  border-bottom: 1px solid var(--color-border);
}

.notary-matters-documents-group-card__icon {
  font-size: var(--font-size-base);
  flex-shrink: 0;
}

.notary-matters-documents-group-card__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.notary-matters-documents-group-card__counter {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  flex-shrink: 0;
}

.notary-matters-documents-group-card__items {
  display: flex;
  flex-direction: column;
}

.notary-matters-documents-group-card__items > .notary-matters-documents-checklist-item + .notary-matters-documents-checklist-item {
  border-top: 1px solid var(--color-border);
}


/* notary/matters/documents/index.css */
.notary-matters-documents-index {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.notary-matters-documents-index__tabs {
  display: flex;
  gap: var(--space-1);
  border-bottom: 1px solid var(--color-border);
}

.notary-matters-documents-index__tab {
  padding: var(--space-2) var(--space-4);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-secondary);
  text-decoration: none;
  border-bottom: 2px solid transparent;
  transition: color 0.15s, border-color 0.15s;
  margin-bottom: -1px;
}

.notary-matters-documents-index__tab:hover {
  color: var(--color-text-primary);
}

.notary-matters-documents-index__tab--active {
  color: var(--color-brand);
  border-bottom-color: var(--color-brand);
}

.notary-matters-documents-index__body {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-6);
  align-items: start;
}

.notary-matters-documents-index__body--single {
  grid-template-columns: 1fr;
}

.notary-matters-documents-index__sections {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.notary-matters-documents-index__context {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  position: sticky;
  top: calc(var(--navbar-height) + var(--space-4));
}

@media (max-width: 768px) {
  .notary-matters-documents-index__body {
    grid-template-columns: 1fr;
  }

  .notary-matters-documents-index__context {
    order: -1;
    position: static;
  }
}


/* notary/matters/documents/info_panel.css */
.notary-matters-documents-info-panel {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  overflow-y: auto;
  max-height: 70vh;
}

.notary-matters-documents-info-panel__section {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.notary-matters-documents-info-panel__heading {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-matters-documents-info-panel__alert {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  font-size: var(--font-size-sm);
}

.notary-matters-documents-info-panel__alert--danger {
  background-color: var(--color-danger-surface);
  border: 1px solid var(--color-danger);
  color: var(--color-danger);
}

.notary-matters-documents-info-panel__alert-reason {
  margin: 0;
  font-weight: var(--font-weight-normal);
  color: var(--color-text);
  font-style: italic;
}

@media (max-width: 767px) {
  .notary-matters-documents-info-panel {
    max-height: none;
  }
}


/* notary/matters/documents/navigation_bar.css */
.notary-matters-documents-navigation-bar {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: var(--space-4);
}

.notary-matters-documents-navigation-bar > :first-child {
  justify-self: start;
}

.notary-matters-documents-navigation-bar > :last-child {
  justify-self: end;
}

.notary-matters-documents-navigation-bar__center {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-1);
}

.notary-matters-documents-navigation-bar__title-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
}

.notary-matters-documents-navigation-bar__title {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
  text-align: center;
}

.notary-matters-documents-navigation-bar__progress {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

.notary-matters-documents-navigation-bar__placeholder {
  /* Empty cell placeholder — grid column occupied even without a link */
}


/* notary/matters/documents/ocr_panel.css */
.notary-matters-documents-ocr-panel__heading {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0 0 var(--space-2) 0;
}

.notary-matters-documents-ocr-panel__content {
  display: flex;
  flex-direction: column;
}

.notary-matters-documents-ocr-panel__list {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-1) var(--space-4);
}

.notary-matters-documents-ocr-panel__dt {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
}

.notary-matters-documents-ocr-panel__dd {
  font-size: var(--font-size-sm);
  color: var(--color-text);
  margin: 0;
}

.notary-matters-documents-ocr-panel__loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-2);
  min-height: 120px;
}

.notary-matters-documents-ocr-panel__spinner {
  width: 24px;
  height: 24px;
  border: 2px solid var(--color-brand-light);
  border-top-color: var(--color-brand);
  border-radius: 50%;
  animation: ocr-panel-spinner-spin 1s ease-in-out infinite;
}

.notary-matters-documents-ocr-panel__status {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  margin: 0;
}

.notary-matters-documents-ocr-panel__error {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding: var(--space-3);
  border: 1px solid var(--color-danger);
  background-color: var(--color-danger-soft);
  border-radius: var(--radius-md);
}

.notary-matters-documents-ocr-panel__error-title {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-danger);
}

.notary-matters-documents-ocr-panel__error-reason {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  margin: 0;
}

.notary-matters-documents-ocr-panel__empty {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  text-align: center;
  margin: 0;
  padding: var(--space-3);
}

@keyframes ocr-panel-spinner-spin {
  to {
    transform: rotate(360deg);
  }
}


/* notary/matters/documents/overview.css */
.notary-matters-documents-overview__header-progress {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-width: 8rem;
}

.notary-matters-documents-overview__header-progress .ui-bases-progress-bar {
  flex: 1;
}

.notary-matters-documents-overview__progress-count {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.notary-matters-documents-overview__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-matters-documents-overview__section {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.notary-matters-documents-overview__section-label {
  padding: var(--space-2) var(--space-4);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  background-color: var(--color-surface-subtle);
  border-bottom: 1px solid var(--color-border);
}

.notary-matters-documents-overview__summary-row {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  color: var(--color-text);
}

.notary-matters-documents-overview__summary-row + .notary-matters-documents-overview__summary-row {
  border-top: 1px solid var(--color-border);
}

.notary-matters-documents-overview__summary-icon {
  font-size: var(--font-size-base);
  flex-shrink: 0;
}

.notary-matters-documents-overview__summary-label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.notary-matters-documents-overview__summary-count {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  flex-shrink: 0;
}

.notary-matters-documents-overview__footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-block-start: var(--space-2);
}


/* notary/matters/documents/progress_summary.css */
.notary-matters-documents-progress-summary {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: var(--space-4) var(--space-5);
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
}

.notary-matters-documents-progress-summary__sections {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-3);
}

.notary-matters-documents-progress-summary__section-link {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
  text-decoration: none;
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-md);
  border: 1px solid var(--color-border);
  transition: all var(--duration-fast) var(--easing-default);
}

.notary-matters-documents-progress-summary__section-link:hover {
  color: var(--color-brand);
  border-color: var(--color-brand);
  background-color: var(--color-brand-surface);
}

.notary-matters-documents-progress-summary__statuses {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.notary-matters-documents-progress-summary__line {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

.notary-matters-documents-progress-summary__line--link {
  text-decoration: none;
  color: inherit;
  border-radius: var(--radius-md);
  padding: var(--space-1) var(--space-2);
  margin: 0 calc(var(--space-2) * -1);
  transition: background-color var(--duration-fast) var(--easing-default);
}

.notary-matters-documents-progress-summary__line--link:hover {
  background-color: var(--color-surface-subtle);
}

.notary-matters-documents-progress-summary__count {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  min-width: 1.25rem;
}

.notary-matters-documents-progress-summary__label {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}


/* notary/matters/documents/recent_activity.css */
.notary-matters-documents-recent-activity {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-5);
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
}

.notary-matters-documents-recent-activity__title {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-matters-documents-recent-activity__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.notary-matters-documents-recent-activity__event {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
}

.notary-matters-documents-recent-activity__event-content {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  min-width: 0;
}

.notary-matters-documents-recent-activity__event-category {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.notary-matters-documents-recent-activity__event-meta {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}


/* notary/matters/documents/reject_button.css */
.notary-matters-documents-reject-button__btn {
  width: 100%;
  padding: var(--space-2) var(--space-4);
  border: 1.5px solid var(--color-danger);
  border-radius: var(--radius-md);
  background-color: var(--color-danger-surface);
  color: var(--color-danger);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  cursor: pointer;
  text-align: center;
}

.notary-matters-documents-reject-button__btn:hover {
  background-color: var(--color-danger);
  color: white;
}


/* notary/matters/documents/reject_modal.css */
.notary-matters-documents-reject-modal__form {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  text-align: left;
}

.notary-matters-documents-reject-modal__info {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.notary-matters-documents-reject-modal__info-label {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
}

.notary-matters-documents-reject-modal__info-value {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.notary-matters-documents-reject-modal__field {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.notary-matters-documents-reject-modal__field-label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}

.notary-matters-documents-reject-modal__textarea {
  width: 100%;
  padding: var(--space-3);
  border: 1.5px solid var(--color-border);
  border-radius: var(--radius-md);
  font-size: var(--font-size-sm);
  font-family: inherit;
  resize: vertical;
  box-sizing: border-box;
}

.notary-matters-documents-reject-modal__textarea:focus {
  outline: none;
  border-color: var(--color-brand);
  box-shadow: var(--focus-ring);
}

.notary-matters-documents-reject-modal__actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-3);
}

.notary-matters-documents-reject-modal__cancel {
  padding: var(--space-2) var(--space-4);
  border: 1.5px solid var(--color-border);
  border-radius: var(--radius-md);
  background-color: var(--color-surface);
  color: var(--color-text-subtle);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  cursor: pointer;
}

.notary-matters-documents-reject-modal__cancel:hover {
  background-color: var(--color-surface-subtle);
  color: var(--color-text);
}


/* notary/matters/documents/section.css */
.notary-matters-documents-section {
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-md);
  border-left: 4px solid var(--color-border);
  scroll-margin-top: calc(var(--navbar-height) + var(--space-4));
}

.notary-matters-documents-section--properties {
  border-left-color: var(--color-info);
}

.notary-matters-documents-section--sellers {
  border-left-color: var(--color-warning);
}

.notary-matters-documents-section--buyers {
  border-left-color: var(--color-success);
}

.notary-matters-documents-section__header {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-5);
  background-color: var(--color-surface-subtle);
  border-bottom: 1px solid var(--color-border);
}

.notary-matters-documents-section__icon {
  font-size: var(--font-size-lg);
  flex-shrink: 0;
}

.notary-matters-documents-section__label {
  font-family: var(--font-display);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
  flex: 1;
}

.notary-matters-documents-section__body {
  display: flex;
  flex-direction: column;
}


/* notary/matters/documents/show.css */
.notary-matters-documents-show {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-matters-documents-show__split {
  display: grid;
  grid-template-columns: 3fr 2fr;
  gap: var(--space-6);
  min-height: 70vh;
}

.notary-matters-documents-show__preview {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background-color: var(--color-surface-subtle);
  display: flex;
  flex-direction: column;
}

.notary-matters-documents-show__upload-zone {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-4);
  padding: var(--space-8);
  flex: 1;
}

.notary-matters-documents-show__upload-hint {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  text-align: center;
  max-width: 400px;
  margin: 0;
}

@media (max-width: 767px) {
  .notary-matters-documents-show__split {
    grid-template-columns: 1fr;
    min-height: auto;
  }

  .notary-matters-documents-show__preview {
    min-height: 50vh;
  }
}


/* notary/matters/documents/transactional_list.css */
.notary-matters-documents-transactional-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-matters-documents-transactional-list__intro {
  color: var(--color-text-secondary);
  font-size: var(--font-size-sm);
  line-height: var(--line-height-relaxed);
}

.notary-matters-documents-transactional-list__items {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.notary-matters-documents-transactional-list__item {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
}

.notary-matters-documents-transactional-list__label {
  flex: 1;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-primary);
}


/* notary/matters/documents/validate_button.css */
.notary-matters-documents-validate-button__btn {
  width: 100%;
  padding: var(--space-2) var(--space-4);
  border: 1.5px solid var(--color-success);
  border-radius: var(--radius-md);
  background-color: var(--color-success-surface);
  color: var(--color-success);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  cursor: pointer;
  text-align: center;
}

.notary-matters-documents-validate-button__btn:hover {
  background-color: var(--color-success);
  color: white;
}


/* notary/matters/global_progress.css */
.notary-matters-global-progress {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.notary-matters-global-progress__heading {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-matters-global-progress__overall {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.notary-matters-global-progress__aspects {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-3);
}

@media (max-width: 768px) {
  .notary-matters-global-progress__aspects {
    grid-template-columns: repeat(2, 1fr);
  }
}


/* notary/matters/index_card.css */
.notary-matters-index-card {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

.notary-matters-index-card:hover {
  border-color: var(--color-border-strong);
  box-shadow: var(--shadow-md);
}

.notary-matters-index-card__link {
  display: block;
  padding: var(--space-5);
  color: inherit;
  text-decoration: none;
}

.notary-matters-index-card__link:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
  border-radius: var(--radius-lg);
}

.notary-matters-index-card__header {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-block-end: var(--space-4);
}

.notary-matters-index-card__title {
  flex: 1;
  margin: 0;
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.notary-matters-index-card__cover {
  display: block;
  width: 100%;
  height: 160px;
  object-fit: cover;
  border-radius: var(--radius-md);
  margin-bottom: var(--space-4);
}

.notary-matters-index-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.notary-matters-index-card__address {
  margin: 0;
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.notary-matters-index-card__price {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
}

.notary-matters-index-card__price-value {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
  font-variant-numeric: tabular-nums;
}

.notary-matters-index-card__price-label {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

.notary-matters-index-card__date {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
}

.notary-matters-index-card__date-label {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
}

.notary-matters-index-card__date-value {
  font-size: var(--font-size-sm);
  color: var(--color-text);
}


/* notary/matters/invitation_form.css */
.notary-matters-invitation-form__header {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  margin-bottom: var(--space-4);
}

.notary-matters-invitation-form__title {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-primary);
  margin: 0;
}

.notary-matters-invitation-form__subtitle {
  font-size: var(--font-size-base);
  color: var(--color-text-secondary);
  margin: 0;
}

/* --- Role cards (DescriptiveChoice style) --- */

.notary-matters-invitation-form__roles {
  border: none;
  padding: 0;
  margin: 0 0 var(--space-6);
}

.notary-matters-invitation-form__roles-legend {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-primary);
  margin-bottom: var(--space-3);
}

.notary-matters-invitation-form__roles-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: var(--space-3);
}

.notary-matters-invitation-form__role-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-5) var(--space-3);
  border: 1.5px solid var(--color-brand-a10);
  border-radius: var(--radius-lg);
  background: var(--color-brand-surface);
  cursor: pointer;
  transition: border-color 200ms ease-out, box-shadow 200ms ease-out, transform 150ms ease-out;
  text-align: center;
}

.notary-matters-invitation-form__role-card:hover {
  border-color: var(--color-brand-light);
  box-shadow: 0 0 0 3px var(--color-brand-a10);
  transform: translateY(-2px);
}

.notary-matters-invitation-form__role-card:active {
  transform: translateY(0);
  box-shadow: none;
}

.notary-matters-invitation-form__role-card.selected {
  border-color: var(--color-brand);
  box-shadow: 0 0 0 3px var(--color-brand-a20);
}

.notary-matters-invitation-form__role-radio {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.notary-matters-invitation-form__role-icon {
  font-size: var(--font-size-2xl);
  line-height: 1;
}

.notary-matters-invitation-form__role-label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.notary-matters-invitation-form__role-desc {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  line-height: var(--line-height-relaxed);
}

/* --- Side cards (conditional) --- */

.notary-matters-invitation-form__side-cards {
  border: none;
  padding: 0;
  margin: 0 0 var(--space-6);
}

.notary-matters-invitation-form__side-cards[hidden] {
  display: none;
}

.notary-matters-invitation-form__side-legend {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-primary);
  margin-bottom: var(--space-3);
}

.notary-matters-invitation-form__side-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: var(--space-2);
}

.notary-matters-invitation-form__side-card {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3);
  border: 1px solid var(--color-border-secondary);
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: border-color 150ms ease-out, background-color 150ms ease-out;
}

.notary-matters-invitation-form__side-card:hover {
  border-color: var(--color-brand-light);
  background-color: var(--color-brand-a05);
}

.notary-matters-invitation-form__side-radio {
  cursor: pointer;
}

.notary-matters-invitation-form__side-label {
  font-size: var(--font-size-sm);
  color: var(--color-text-primary);
  cursor: pointer;
}

/* --- Notary office field (conditional) --- */

.notary-matters-invitation-form__notary-office {
  border: none;
  padding: 0;
  margin: 0 0 var(--space-6);
}

.notary-matters-invitation-form__notary-office[hidden] {
  display: none;
}

.notary-matters-invitation-form__notary-office-wrapper {
  width: 100%;
}

/* --- Two-column grid --- */

.notary-matters-invitation-form__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-6);
  margin-bottom: var(--space-6);
}

.notary-matters-invitation-form__left {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-matters-invitation-form__right {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

@media (max-width: 767px) {
  .notary-matters-invitation-form__grid {
    grid-template-columns: 1fr;
  }

  .notary-matters-invitation-form__roles-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .notary-matters-invitation-form__side-grid {
    grid-template-columns: 1fr;
  }
}


/* notary/matters/list.css */
.notary-matters-list__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: var(--space-6);
  padding-block: var(--space-4);
}

.notary-matters-list__section {
  display: flex;
  flex-direction: column;
}

.notary-matters-list__section + .notary-matters-list__section {
  margin-block-start: var(--space-6);
}

.notary-matters-list__section-title {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-primary);
  margin: 0;
  padding-block-end: var(--space-2);
  border-bottom: 1px solid var(--color-border);
}

.notary-matters-list__empty-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-4);
  padding: var(--space-10) 0;
}

.notary-matters-list__section-empty {
  font-size: var(--font-size-sm);
  color: var(--color-text-tertiary);
  padding: var(--space-4);
  margin: 0;
}


/* notary/matters/messaging/preview.css */
.notary-matters-messaging-preview {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: var(--space-3);
}

.notary-matters-messaging-preview .ui-section-header {
  align-self: stretch;
}

.notary-matters-messaging-preview__message {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  align-self: stretch;
  overflow: hidden;
}

.notary-matters-messaging-preview__message-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  overflow: hidden;
}

.notary-matters-messaging-preview__message-header .ui-user-badge {
  min-width: 0;
  flex: 1;
  overflow: hidden;
}

.notary-matters-messaging-preview__message-header .ui-user-badge__name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.notary-matters-messaging-preview__message-header .ui-user-badge__circle {
  flex-shrink: 0;
}

.notary-matters-messaging-preview__time {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  white-space: nowrap;
}

.notary-matters-messaging-preview__body {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  line-height: var(--line-height-relaxed);
  margin: 0;
}

.notary-matters-messaging-preview__link {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-brand);
  text-decoration: none;

  &:hover {
    text-decoration: underline;
  }
}

.notary-matters-messaging-preview__cta {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-brand);
  text-decoration: none;

  &:hover {
    text-decoration: underline;
  }
}


/* notary/matters/participants/index.css */
.notary-matters-participants-index__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}

.notary-matters-participants-index__group {
  display: flex;
  flex-direction: column;
}

.notary-matters-participants-index__group-label {
  padding: var(--space-2) var(--space-5);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  background-color: var(--color-surface-subtle);
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  border: 1px solid var(--color-border);
  border-bottom: none;
}

.notary-matters-participants-index__group-footer {
  display: flex;
  justify-content: flex-end;
  padding: var(--space-3) var(--space-5);
  border: 1px solid var(--color-border);
  border-top: none;
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
  background-color: var(--color-surface-subtle);
}

.notary-matters-participants-index__ask-question {
  display: flex;
  justify-content: flex-start;
}

.notary-matters-participants-index__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-4);
}


/* notary/matters/participants/offices_group.css */
.notary-matters-participants-offices-group {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.notary-matters-participants-offices-group__label {
  padding: var(--space-2) var(--space-5);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  background-color: var(--color-surface-subtle);
  border-bottom: 1px solid var(--color-border);
}

.notary-matters-participants-offices-group__row {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-5);
}

.notary-matters-participants-offices-group__row + .notary-matters-participants-offices-group__row {
  border-top: 1px solid var(--color-border);
}

.notary-matters-participants-offices-group__icon {
  font-size: var(--font-size-base);
  flex-shrink: 0;
}

.notary-matters-participants-offices-group__name {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  flex: 1;
}

.notary-matters-participants-offices-group__row > * {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
}

.notary-matters-participants-offices-group__name {
  flex-shrink: 1;
}


/* notary/matters/participants/participant_item.css */
.notary-matters-participants-participant-item {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-5);
  border: 1px solid var(--color-border);
  border-top: none;
  background-color: var(--color-surface);
}

.notary-matters-participants-participant-item:last-child {
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
}

.notary-matters-participants-participant-item > .ui-user-badge {
  flex: 1;
  min-width: 0;
}


/* notary/matters/parties_list.css */
.notary-matters-parties-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-5);
  background: var(--color-bg-secondary);
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-lg);
  margin-bottom: var(--space-6);
}

.notary-matters-parties-list__heading {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0;
}

.notary-matters-parties-list__table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--font-size-sm);
}

.notary-matters-parties-list__table th,
.notary-matters-parties-list__table td {
  padding: var(--space-2) var(--space-3);
  text-align: left;
}

.notary-matters-parties-list__table th {
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
  font-size: var(--font-size-xs);
  border-bottom: 1px solid var(--color-border-light);
}

.notary-matters-parties-list__table tbody tr {
  border-bottom: 1px solid var(--color-border-lightest);
}

.notary-matters-parties-list__table tbody tr:last-child {
  border-bottom: none;
}

.notary-matters-parties-list__badge--accepted {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  color: var(--color-success);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
}

.notary-matters-parties-list__badge--pending {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  color: var(--color-warning);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
}

.notary-matters-parties-list__empty-cell {
  color: var(--color-text-subtle);
}

.notary-matters-parties-list__badge--you {
  display: inline-flex;
  align-items: center;
  margin-inline-start: var(--space-2);
  padding: var(--space-0) var(--space-2);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-brand);
  background-color: var(--color-brand-lightest);
  border-radius: var(--radius-full);
}


/* notary/matters/pending_actions.css */
.notary-matters-pending-actions__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.notary-matters-pending-actions__item {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-md);
  background: var(--color-surface-subtle);
  overflow: hidden;
}

.notary-matters-pending-actions__item-icon {
  flex-shrink: 0;
  font-size: var(--font-size-sm);
  line-height: 1;
  padding-top: 2px;
}

.notary-matters-pending-actions__item-content {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.notary-matters-pending-actions__item-label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}

.notary-matters-pending-actions__item-detail {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  word-break: break-word;
}


/* notary/matters/properties/coproperty_group.css */
.notary-matters-properties-coproperty-group {
  border-top: 1px solid var(--color-border);
}

.notary-matters-properties-coproperty-group__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-2) var(--space-5);
  background-color: var(--color-surface-subtle);
}

.notary-matters-properties-coproperty-group__label {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}


/* notary/matters/properties/index.css */
.notary-matters-properties-index__cards {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  margin-block-end: var(--space-6);
}

.notary-matters-properties-index__footer {
  display: flex;
  justify-content: flex-start;
}


/* notary/matters/properties/property_card.css */
.notary-matters-properties-property-card {
  display: block;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background-color: var(--color-surface);
  overflow: hidden;
}

/* Header */

.notary-matters-properties-property-card__header {
  padding: var(--space-4) var(--space-5);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.notary-matters-properties-property-card__header-top {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.notary-matters-properties-property-card__icon {
  font-size: var(--font-size-lg);
  line-height: 1;
  flex-shrink: 0;
}

.notary-matters-properties-property-card__address {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}

/* Unit summaries */

.notary-matters-properties-property-card__units {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding-inline-start: calc(var(--font-size-lg) + var(--space-2));
}

.notary-matters-properties-property-card__unit-summary {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

/* Progress */

.notary-matters-properties-property-card__progress {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-5);
  border-top: 1px solid var(--color-border);
}

.notary-matters-properties-property-card__progress-label {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

/* Footer */

.notary-matters-properties-property-card__footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: var(--space-3) var(--space-5);
  border-top: 1px solid var(--color-border);
  background-color: var(--color-surface-subtle);
}


/* notary/matters/properties/unit_item.css */
.notary-matters-properties-unit-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-3) var(--space-5);
  border-top: 1px solid var(--color-border);
}

.notary-matters-properties-unit-item__info {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.notary-matters-properties-unit-item__icon {
  font-size: var(--font-size-base);
}

.notary-matters-properties-unit-item__kind {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}

.notary-matters-properties-unit-item__separator {
  color: var(--color-text-subtle);
}

.notary-matters-properties-unit-item__position {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.notary-matters-properties-unit-item .ui-bases-progress-bar {
  width: 4rem;
  flex-shrink: 0;
}

.notary-matters-properties-unit-item__check {
  color: var(--color-success);
  font-weight: var(--font-weight-bold);
  font-size: var(--font-size-sm);
  flex-shrink: 0;
}


/* notary/matters/settings/read_only_notarial.css */
.notary-matters-settings-read-only-notarial__explanation {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  margin: 0 0 var(--space-3) 0;
}


/* notary/matters/show.css */
.notary-matters-show__layout {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
  margin-block-start: var(--space-6);
}

/* --- Row 1: Card + GlobalProgress --- */

.notary-matters-show__row-overview {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-6);
  align-items: start;
}

/* --- Row 2: Frise (full width) --- */

.notary-matters-show__row-frise {
  width: 100%;
}

/* --- Row 3: Tabs (2/3) + Sidebar (1/3) --- */

.notary-matters-show__row-main {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: var(--space-6);
  align-items: start;
}

.notary-matters-show__tabs {
  min-width: 0;
}

.notary-matters-show__sidebar {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.notary-matters-show__backdrop {
  display: none;
}

.notary-matters-show__drawer-close {
  display: none;
}

.notary-matters-show__drawer-toggle {
  display: none;
}

/* --- Responsive: tablet + mobile (drawer) --- */

@media (max-width: 1024px) {
  .notary-matters-show__row-main {
    grid-template-columns: 1fr;
  }

  /* Drawer sidebar */
  .notary-matters-show__sidebar {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 85vw;
    max-width: 24rem;
    z-index: var(--z-modal);
    background: var(--color-surface);
    padding: var(--space-6);
    box-shadow: var(--shadow-xl);
    transform: translateX(100%);
    transition: transform var(--duration-slow) var(--easing-out);
    overflow-y: auto;

    &.is-open {
      transform: translateX(0);
    }
  }

  /* Backdrop */
  .notary-matters-show__backdrop {
    position: fixed;
    inset: 0;
    z-index: calc(var(--z-modal) - 1);
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(2px);
    transition: opacity var(--duration-slow) var(--easing-out);
    opacity: 0;
    pointer-events: none;

    &.is-open {
      display: block;
      opacity: 1;
      pointer-events: auto;
    }
  }

  /* FAB toggle button */
  .notary-matters-show__drawer-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    bottom: var(--space-6);
    right: var(--space-6);
    z-index: var(--z-sticky);
    width: 3rem;
    height: 3rem;
    padding: 0;
    border: none;
    border-radius: var(--radius-full);
    background: var(--color-brand);
    color: var(--color-text-inverted);
    box-shadow: var(--shadow-lg);
    cursor: pointer;
    transition:
      background var(--duration-fast) var(--easing-default),
      box-shadow var(--duration-fast) var(--easing-default);

    .svg {
      width: var(--icon-size-md);
      height: var(--icon-size-md);
    }

    &:hover {
      background: var(--color-brand-dark);
      box-shadow: var(--shadow-xl);
    }

    &:focus-visible {
      outline: none;
      box-shadow: var(--focus-ring);
    }
  }

  /* Close button inside drawer */
  .notary-matters-show__drawer-close {
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: flex-end;
    width: 2rem;
    height: 2rem;
    padding: 0;
    border: none;
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--color-text-subtle);
    cursor: pointer;
    margin-block-end: var(--space-4);

    .svg {
      width: var(--icon-size-sm);
      height: var(--icon-size-sm);
    }

    &:hover {
      background: var(--color-surface-raised);
      color: var(--color-text);
    }

    &:focus-visible {
      outline: none;
      box-shadow: var(--focus-ring);
    }
  }
}

/* --- Responsive: mobile only --- */

@media (max-width: 768px) {
  .notary-matters-show__row-overview {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .notary-matters-show__sidebar,
  .notary-matters-show__backdrop {
    transition: none;
  }
}


/* notary/matters/stage_actions.css */
.notary-matters-stage-actions {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-4);
  background: var(--color-surface-raised);
  border-radius: var(--radius-md);
  border: 1px solid var(--color-border);
}

.notary-matters-stage-actions__heading {
  margin: 0;
  font-size: var(--text-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-secondary);
}

.notary-matters-stage-actions__actions {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.notary-matters-stage-actions__hint {
  margin: 0;
  font-size: var(--text-xs);
  color: var(--color-text-secondary);
  font-style: italic;
}


/* notary/matters/team_member_item.css */
.notary-matters-team-member-item {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid var(--color-border);
}

.notary-matters-team-member-item > * {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
}

.notary-matters-team-member-item:last-child {
  border-bottom: none;
}

.notary-matters-team-member-item--available {
  opacity: 0.6;
}

.notary-matters-team-member-item--available:hover {
  opacity: 1;
}

.notary-matters-team-member-item__dot {
  font-size: var(--font-size-xs);
  flex-shrink: 0;
  line-height: 1;
}

.notary-matters-team-member-item--assigned .notary-matters-team-member-item__dot {
  color: var(--color-success);
}

.notary-matters-team-member-item--available .notary-matters-team-member-item__dot {
  color: var(--color-text-disabled);
}

.notary-matters-team-member-item > .ui-user-badge {
  flex: 1;
  min-width: 0;
}


/* notary/matters/team_page.css */
.notary-matters-team-page {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.notary-matters-team-page__body {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: var(--space-6);
  align-items: start;
}

@media (max-width: 1024px) {
  .notary-matters-team-page__body {
    grid-template-columns: 1fr;
  }
}


/* notary/matters/team_section.css */
.notary-matters-team-section__body {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.notary-matters-team-section__group + .notary-matters-team-section__group {
  border-top: 2px solid var(--color-border);
}

.notary-matters-team-section__group-label {
  padding: var(--space-2) var(--space-4);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  background-color: var(--color-surface-subtle);
  border-bottom: 1px solid var(--color-border);
}


/* notary/matters/team_summary.css */
.notary-matters-team-summary__members {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.notary-matters-team-summary__empty {
  color: var(--color-text-subtle);
  font-size: var(--font-size-sm);
  margin: 0;
}


/* notary/matters/timeline/frise.css */
.notary-matters-timeline-frise {
  padding: var(--space-4) 0;
}

.notary-matters-timeline-frise__track {
  position: relative;
  height: 2rem;
  margin: 0 var(--space-6);
}

.notary-matters-timeline-frise__line {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--color-border-strong);
  transform: translateY(-50%);
}

.notary-matters-timeline-frise__dot {
  position: absolute;
  top: 50%;
  width: 0.75rem;
  height: 0.75rem;
  border-radius: var(--radius-full);
  background: var(--color-neutral-400);
  border: 2px solid var(--color-surface);
  transform: translate(-50%, -50%);
  z-index: 1;
}

.notary-matters-timeline-frise__dot--past {
  background: var(--color-brand);
}

.notary-matters-timeline-frise__today {
  position: absolute;
  top: 50%;
  width: 0.5rem;
  height: 1.25rem;
  background: var(--color-danger);
  border-radius: var(--radius-sm);
  transform: translate(-50%, -50%);
  z-index: 2;
}

.notary-matters-timeline-frise__labels {
  position: relative;
  margin: var(--space-2) var(--space-6) 0;
  height: 3.5rem;
}

.notary-matters-timeline-frise__label {
  position: absolute;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  white-space: nowrap;
}

.notary-matters-timeline-frise__label-text {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.notary-matters-timeline-frise__label-date {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

.notary-matters-timeline-frise__delay {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
  margin-top: var(--space-1);
}

.notary-matters-timeline-frise__delay--urgent {
  color: var(--color-danger);
  font-weight: var(--font-weight-semibold);
}

.notary-matters-timeline-frise__empty {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

.notary-matters-timeline-frise__empty-text {
  color: var(--color-text-subtle);
  font-size: var(--font-size-sm);
  margin: 0;
}


/* notary/offers/index.css */
.notary-offers-index .ui-bases-record-view__header {
  margin-bottom: var(--space-4);
}

.notary-offers-index__layout {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: var(--space-6);
  align-items: start;
}

.notary-offers-index__sidebar {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  min-width: 0;
  overflow: hidden;
}

.notary-offers-index__property-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  min-width: 0;
}

.notary-offers-index__property-card .notary-prospects-property-interests-property-card-body__title {
  margin-top: var(--space-3);
}

.notary-offers-index__property-card .notary-prospects-property-interests-property-card-body,
.notary-offers-index__property-card .notary-prospects-property-interests-property-card-details {
  padding: 0 var(--space-4) var(--space-4);
}


/* notary/offers/list.css */
.notary-offers-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}


/* notary/offers/new.css */
.notary-offers-new__body > :first-child {
  position: sticky;
  top: var(--space-4);
}

.notary-offers-new__context {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  min-width: 0;
  overflow: hidden;
}

.notary-offers-new__property-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  min-width: 0;
}

.notary-offers-new__property-card .notary-prospects-property-interests-property-card-body__title {
  margin-top: var(--space-3);
}

.notary-offers-new__property-card .notary-prospects-property-interests-property-card-body,
.notary-offers-new__property-card .notary-prospects-property-interests-property-card-details {
  padding: 0 var(--space-4) var(--space-4);
}


/* notary/offers/new_counter.css */
.notary-offers-new-counter__body > :first-child {
  position: sticky;
  top: var(--space-4);
}

.notary-offers-new-counter__context {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  min-width: 0;
  overflow: hidden;
}

.notary-offers-new-counter__section-title {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  margin-bottom: var(--space-2);
}

.notary-offers-new-counter__original-offer {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-4);
}

.notary-offers-new-counter__property-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  min-width: 0;
}

.notary-offers-new-counter__property-card .notary-prospects-property-interests-property-card-body__title {
  margin-top: var(--space-3);
}

.notary-offers-new-counter__property-card .notary-prospects-property-interests-property-card-body,
.notary-offers-new-counter__property-card .notary-prospects-property-interests-property-card-details {
  padding: 0 var(--space-4) var(--space-4);
}


/* notary/offers/offer_card.css */
.notary-offers-offer-card {
  display: flex;
  flex-direction: column;
  padding: var(--space-4) var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  min-width: 0;
}


/* notary/offers/offer_card_amount.css */
.notary-offers-offer-card-amount {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-brand);
  margin: var(--space-2) 0 var(--space-3);
  letter-spacing: -0.01em;
}


/* notary/offers/offer_card_details.css */
.notary-offers-offer-card-details {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding-top: var(--space-3);
  border-top: 1px solid var(--color-border);
}

.notary-offers-offer-card-details__row {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
  font-size: var(--font-size-sm);
  min-width: 0;
}

.notary-offers-offer-card-details__row-label {
  color: var(--color-text-subtle);
  flex-shrink: 0;
}

.notary-offers-offer-card-details__row-value {
  color: var(--color-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

/* ── Conditions collapsible ── */

.notary-offers-offer-card-details__conditions {
  display: flex;
  flex-direction: column;
}

.notary-offers-offer-card-details__conditions-toggle {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
  font-size: var(--font-size-sm);
  min-width: 0;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  text-align: left;
  width: 100%;
}

.notary-offers-offer-card-details__conditions-toggle:hover .notary-offers-offer-card-details__row-value {
  color: var(--color-brand);
}

.notary-offers-offer-card-details__caret {
  display: inline-flex;
  align-items: center;
  margin-left: auto;
  flex-shrink: 0;
  transition: transform 0.2s;
  color: var(--color-text-subtle);
}

.notary-offers-offer-card-details__caret .ui-icon {
  width: 14px;
  height: 14px;
}

[data-collapsible-collapsed-value="false"] .notary-offers-offer-card-details__caret {
  transform: rotate(180deg);
}

/* Collapsible content — height:0 when collapsed for smooth animation */
[data-collapsible-collapsed-value="true"] .notary-offers-offer-card-details__conditions-content {
  display: block;
  height: 0;
  overflow: hidden;
}

.notary-offers-offer-card-details__conditions-content {
  overflow: hidden;
}

/* ── Conditions list ── */

.notary-offers-offer-card-details__conditions-list {
  list-style: none;
  padding: var(--space-2) 0 0 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.notary-offers-offer-card-details__condition-item {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
  font-size: var(--font-size-xs);
  padding: var(--space-1) var(--space-2);
  background: var(--color-surface-subtle);
  border-radius: var(--radius-sm);
}

.notary-offers-offer-card-details__condition-kind {
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  flex-shrink: 0;
}

.notary-offers-offer-card-details__condition-details {
  color: var(--color-text-subtle);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}


/* notary/offers/offer_card_footer.css */
.notary-offers-offer-card-footer {
  margin-top: var(--space-3);
  padding-top: var(--space-3);
  border-top: 1px solid var(--color-border);
}

.notary-offers-offer-card-footer__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}

.notary-offers-offer-card-footer__date {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  flex-shrink: 0;
}

.notary-offers-offer-card-footer__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: var(--space-3);
}


/* notary/offers/offer_card_header.css */
.notary-offers-offer-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}

.notary-offers-offer-card-header__author {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}


/* notary/offers/prospect_summary.css */
.notary-offers-prospect-summary.ui-bases-context-block {
  gap: var(--space-2);
}

.notary-offers-prospect-summary .ui-bases-context-block__description {
  margin: 0;
}


/* notary/offers/survey_page.css */
@media (min-width: 1440px) {
  .notary-offers-survey-page__body.notary-offers-survey-page__body {
    display: block;
  }

  .notary-offers-survey-page__body.notary-offers-survey-page__body > :only-child {
    max-width: none;
  }
}


/* notary/office/empty_state.css */
.notary-office-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-4);
  padding: var(--space-16) var(--space-8);
  text-align: center;
}

.notary-office-empty-state__icon {
  font-size: 3rem;
}

.notary-office-empty-state__title {
  font-family: var(--font-display);
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-office-empty-state__description {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  max-width: 24rem;
  margin: 0;
}


/* notary/office/info_card.css */
.notary-office-info-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: var(--space-6);
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
}

.notary-office-info-card__name {
  font-family: var(--font-display);
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
  margin: 0;
}

.notary-office-info-card__detail {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--space-3);
}

.notary-office-info-card__detail-label {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.notary-office-info-card__detail-value {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}


/* notary/office/member_item.css */
.notary-office-member-item {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid var(--color-border);
}

.notary-office-member-item > * {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
}

.notary-office-member-item:last-of-type {
  border-bottom: none;
}

.notary-office-member-item > .ui-user-badge {
  flex: 1;
  min-width: 0;
}

.notary-office-member-item__actions {
  position: relative;
  flex-shrink: 0;
}

.notary-office-member-item__actions-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: var(--radius-full);
  border: 1px solid var(--color-border);
  background-color: var(--color-surface);
  color: var(--color-text-subtle);
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.notary-office-member-item__actions-trigger .svg {
  width: var(--icon-size-sm);
  height: var(--icon-size-sm);
  transition: transform 0.3s ease;
}

.notary-office-member-item__actions-trigger:hover {
  border-color: var(--color-brand);
  color: var(--color-brand);
}

.is-open .notary-office-member-item__actions-trigger {
  background-color: var(--color-brand);
  border-color: var(--color-brand);
  color: var(--color-text-inverted);
}

.is-open .notary-office-member-item__actions-trigger .svg {
  transform: rotate(90deg);
}

.notary-office-member-item__actions-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + var(--space-2));
  right: 0;
  flex-direction: column;
  gap: var(--space-1);
  padding: var(--space-3);
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  z-index: var(--z-dropdown, 50);
  white-space: nowrap;
}

.is-open .notary-office-member-item__actions-dropdown {
  display: flex;
}

.notary-office-member-item__actions-dropdown > * {
  width: 100%;
  box-sizing: border-box;
  text-align: center;
}


/* notary/office/member_list.css */
.notary-office-member-list {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: visible;
}

.notary-office-member-list__add-form {
  padding: var(--space-4);
  background-color: var(--color-surface-subtle);
  border-top: 1px solid var(--color-border);
}

.notary-office-member-list__add-fields {
  display: flex;
  gap: var(--space-3);
  align-items: center;
}

.notary-office-member-list__add-input {
  flex: 1;
  padding: var(--space-2) var(--space-3);
  font-size: var(--font-size-sm);
  border: 1.5px solid var(--color-border);
  border-radius: var(--radius-md);
}

.notary-office-member-list__add-input:focus {
  border-color: var(--color-brand);
  box-shadow: var(--focus-ring);
  outline: none;
}

.notary-office-member-list__add-select {
  padding: var(--space-2) var(--space-3);
  font-size: var(--font-size-sm);
  border: 1.5px solid var(--color-border);
  border-radius: var(--radius-md);
  background-color: var(--color-surface);
}


/* notary/office/members_section.css */
.notary-office-members-section {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-office-members-section__title {
  font-family: var(--font-display);
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}


/* notary/office/membership_matters/index.css */
.notary-office-membership-matters-index {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.notary-office-membership-matters-index__back {
  align-self: flex-start;
}

.notary-office-membership-matters-index__heading {
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-primary);
  margin: 0;
}

.notary-office-membership-matters-index__section {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.notary-office-membership-matters-index__section-title {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-primary);
  margin: 0;
  padding-block-end: var(--space-2);
  border-bottom: 1px solid var(--color-border);
}

.notary-office-membership-matters-index__empty {
  font-size: var(--font-size-sm);
  color: var(--color-text-tertiary);
  padding: var(--space-4);
  margin: 0;
}


/* notary/office/membership_matters/matter_row.css */
.notary-office-membership-matters-matter-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
}

.notary-office-membership-matters-matter-row__info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.notary-office-membership-matters-matter-row__title-row {
  display: flex;
  align-items: center;
  gap: var(--space-2);

  .svg {
    width: var(--icon-size-sm);
    height: var(--icon-size-sm);
    color: var(--color-brand);
    flex-shrink: 0;
  }
}

.notary-office-membership-matters-matter-row__titles {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  min-width: 0;
}

.notary-office-membership-matters-matter-row__title {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.notary-office-membership-matters-matter-row__subtitle {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.notary-office-membership-matters-matter-row__address {
  margin: 0;
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

.notary-office-membership-matters-matter-row__meta {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.notary-office-membership-matters-matter-row__count {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}


/* notary/office/membership_matters/stage_filter.css */
.notary-office-membership-matters-stage-filter {
  display: flex;
  gap: var(--space-2);
  padding-block: var(--space-2);
}

.notary-office-membership-matters-stage-filter__link {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-secondary);
  padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-full);
  text-decoration: none;
  transition: background var(--duration-fast), color var(--duration-fast);
}

.notary-office-membership-matters-stage-filter__link:hover {
  background: var(--color-bg-hover);
  color: var(--color-text-primary);
}

.notary-office-membership-matters-stage-filter__link--active {
  background: var(--color-bg-brand-subtle);
  color: var(--color-text-brand);
  font-weight: var(--font-weight-semibold);
}


/* notary/office/role_permissions.css */
.notary-office-role-permissions {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: var(--space-5);
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  min-width: 0;
}

.notary-office-role-permissions__heading {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-office-role-permissions__description {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  margin: 0;
}

.notary-office-role-permissions__table {
  display: flex;
  flex-direction: column;
  overflow-x: auto;
}

.notary-office-role-permissions__row {
  display: grid;
  grid-template-columns: 1fr auto auto auto;
  gap: var(--space-2);
  padding: var(--space-2) 0;
  align-items: center;
}

.notary-office-role-permissions__row + .notary-office-role-permissions__row {
  border-top: 1px solid var(--color-border);
}

.notary-office-role-permissions__row--header {
  border-top: none;
  padding-bottom: var(--space-3);
}

.notary-office-role-permissions__cell {
  font-size: var(--font-size-xs);
  text-align: center;
  min-width: 1.75rem;
}

.notary-office-role-permissions__cell--label {
  text-align: left;
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}

.notary-office-role-permissions__row--header .notary-office-role-permissions__cell {
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.notary-office-role-permissions__cell--allowed {
  color: var(--color-success);
  font-weight: var(--font-weight-bold);
}

.notary-office-role-permissions__cell--denied {
  color: var(--color-text-disabled);
}


/* notary/office/show.css */
.notary-office-show .ui-bases-record-view__header {
  margin-bottom: var(--space-6);
}

.notary-office-show__body {
  display: grid;
  grid-template-columns: 3fr 2fr;
  gap: var(--space-6);
  align-items: start;
}

.notary-office-show__main {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.notary-office-show__context {
  position: sticky;
  top: calc(var(--navbar-height) + var(--space-4));
}

@media (max-width: 768px) {
  .notary-office-show__body {
    grid-template-columns: 1fr;
  }

  .notary-office-show__context {
    order: -1;
    position: static;
  }
}


/* notary/parties/buyer_card.css */
.notary-parties-buyer-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background-color: var(--color-surface);
  overflow: hidden;
}


/* notary/parties/buyer_cards/footer.css */
.notary-parties-buyer-cards-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: var(--space-3) var(--space-5);
  border-top: 1px solid var(--color-border);
}


/* notary/parties/buyer_situation_card.css */
.notary-parties-buyer-situation-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background-color: var(--color-surface);
  overflow: hidden;
}

.notary-parties-buyer-situation-card__header {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-5);
}

.notary-parties-buyer-situation-card__name {
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--color-text);
}

.notary-parties-buyer-situation-card__body {
  border-top: 1px solid var(--color-border);
  padding: var(--space-3) var(--space-4);
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-parties-buyer-situation-card__section {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
}

.notary-parties-buyer-situation-card__section-heading {
  width: 100%;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: var(--space-1);
}

.notary-parties-buyer-situation-card__tag {
  display: inline-flex;
  align-items: baseline;
  gap: var(--space-1);
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-border);
  background-color: var(--color-surface);
  font-size: var(--font-size-xs);
  line-height: 1.2;
}

.notary-parties-buyer-situation-card__tag--empty {
  border-style: dashed;
  background-color: transparent;
}

.notary-parties-buyer-situation-card__label {
  font-weight: var(--font-weight-medium);
  color: var(--color-brand-light);
}

.notary-parties-buyer-situation-card__tag--empty .notary-parties-buyer-situation-card__label {
  color: var(--color-text-disabled);
}

.notary-parties-buyer-situation-card__value {
  font-weight: var(--font-weight-normal);
  color: var(--color-text-subtle);
}

.notary-parties-buyer-situation-card__footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: var(--space-3) var(--space-5);
  border-top: 1px solid var(--color-border);
}


/* notary/parties/buyer_situation_group.css */
.notary-parties-buyer-situation-group {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.notary-parties-buyer-situation-group__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-3) var(--space-5);
  background-color: var(--color-surface);
}

.notary-parties-buyer-situation-group__address {
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-parties-buyer-situation-group__grid {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-5);
  background-color: var(--color-surface-subtle);
  border-top: 1px solid var(--color-border);
}


/* notary/parties/buyers/global_progress.css */
.notary-parties-buyers-global-progress {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
  min-width: 220px;
}

.notary-parties-buyers-global-progress__heading {
  font-size: var(--text-lg);
  font-weight: var(--font-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-parties-buyers-global-progress__overall {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.notary-parties-buyers-global-progress__counters {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.notary-parties-buyers-global-progress__counter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
}

.notary-parties-buyers-global-progress__counter-label {
  font-size: var(--text-sm);
  font-weight: var(--font-medium);
  color: var(--color-text);
}

.notary-parties-buyers-global-progress__counter-value {
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--color-brand);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}


/* notary/parties/buyers/show.css */
.notary-parties-buyers-show {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.notary-parties-buyers-show__summary {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: start;
  gap: var(--space-8);
}

.notary-parties-buyers-show__section {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-parties-buyers-show__section + .notary-parties-buyers-show__section {
  padding-top: var(--space-6);
  border-top: 1px solid var(--color-border);
}

.notary-parties-buyers-show__persons {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

@media (max-width: 767px) {
  .notary-parties-buyers-show__summary {
    grid-template-columns: 1fr;
  }
}


/* notary/parties/buyers/summary_card.css */
.notary-parties-buyers-summary-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background-color: var(--color-surface);
}

.notary-parties-buyers-summary-card__title {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-xl);
  font-weight: var(--font-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-parties-buyers-summary-card__icon {
  font-size: var(--text-2xl);
}

.notary-parties-buyers-summary-card__counters {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-sm);
  color: var(--color-text-subtle);
}

.notary-parties-buyers-summary-card__dot {
  color: var(--color-text-disabled);
}

.notary-parties-buyers-summary-card__names {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.notary-parties-buyers-summary-card__name {
  font-size: var(--text-sm);
  color: var(--color-text);
}


/* notary/parties/property_situation_card.css */
.notary-parties-property-situation-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background-color: var(--color-surface);
  overflow: hidden;
}

.notary-parties-property-situation-card__header {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-5);
}

.notary-parties-property-situation-card__name {
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--color-text);
}

.notary-parties-property-situation-card__body {
  border-top: 1px solid var(--color-border);
  padding: var(--space-3) var(--space-4);
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-parties-property-situation-card__section {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
}

.notary-parties-property-situation-card__section-heading {
  width: 100%;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: var(--space-1);
}

.notary-parties-property-situation-card__tag {
  display: inline-flex;
  align-items: baseline;
  gap: var(--space-1);
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-border);
  background-color: var(--color-surface);
  font-size: var(--font-size-xs);
  line-height: 1.2;
}

.notary-parties-property-situation-card__tag--empty {
  border-style: dashed;
  background-color: transparent;
}

.notary-parties-property-situation-card__label {
  font-weight: var(--font-weight-medium);
  color: var(--color-brand-light);
}

.notary-parties-property-situation-card__tag--empty .notary-parties-property-situation-card__label {
  color: var(--color-text-disabled);
}

.notary-parties-property-situation-card__value {
  font-weight: var(--font-weight-normal);
  color: var(--color-text-subtle);
}

.notary-parties-property-situation-card__footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: var(--space-3) var(--space-5);
  border-top: 1px solid var(--color-border);
}


/* notary/parties/property_situation_group.css */
.notary-parties-property-situation-group {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.notary-parties-property-situation-group__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-3) var(--space-5);
  background-color: var(--color-surface);
}

.notary-parties-property-situation-group__address {
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-parties-property-situation-group__grid {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-5);
  background-color: var(--color-surface-subtle);
  border-top: 1px solid var(--color-border);
}


/* notary/parties/seller_block.css */
.notary-parties-seller-block {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-parties-seller-block__heading {
  font-size: var(--text-lg);
  font-weight: var(--font-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-parties-seller-block__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: var(--space-3);
}


/* notary/parties/seller_card.css */
.notary-parties-seller-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background-color: var(--color-surface);
  overflow: hidden;
}


/* notary/parties/seller_cards/body.css */
.notary-parties-seller-cards-body {
  border-top: 1px solid var(--color-border);
  padding: var(--space-3) var(--space-4);
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-parties-seller-cards-body__section {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
}

.notary-parties-seller-cards-body__section-heading {
  width: 100%;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: var(--space-1);
}

.notary-parties-seller-cards-body__tag {
  display: inline-flex;
  align-items: baseline;
  gap: var(--space-1);
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-border);
  background-color: var(--color-surface);
  font-size: var(--font-size-xs);
  line-height: 1.2;
}

.notary-parties-seller-cards-body__tag--empty {
  border-style: dashed;
  background-color: transparent;
}

.notary-parties-seller-cards-body__label {
  font-weight: var(--font-weight-medium);
  color: var(--color-brand-light);
}

.notary-parties-seller-cards-body__tag--empty .notary-parties-seller-cards-body__label {
  color: var(--color-text-disabled);
}

.notary-parties-seller-cards-body__value {
  font-weight: var(--font-weight-normal);
  color: var(--color-text-subtle);
}


/* notary/parties/seller_cards/footer.css */
.notary-parties-seller-cards-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: var(--space-3) var(--space-5);
  border-top: 1px solid var(--color-border);
}


/* notary/parties/seller_cards/header.css */
.notary-parties-seller-cards-header {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-5);
}

.notary-parties-seller-cards-header__top {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.notary-parties-seller-cards-header__name {
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--color-text);
}

.notary-parties-seller-cards-header__spouse {
  font-size: var(--text-xs);
  color: var(--color-text-muted);
}


/* notary/parties/seller_cards/spouse_link.css */
.notary-parties-seller-cards-spouse-link {
  display: flex;
  align-items: center;
  gap: var(--space-2);

  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-brand-a10);
  border-radius: var(--radius-md);
  background: var(--color-brand-surface);

  margin-bottom: var(--space-3);
}

.notary-parties-seller-cards-spouse-link__icon {
  font-size: var(--font-size-sm);
  line-height: 1;
}

.notary-parties-seller-cards-spouse-link__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}


/* notary/parties/seller_situation_card.css */
.notary-parties-seller-situation-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background-color: var(--color-surface);
  overflow: hidden;
}

.notary-parties-seller-situation-card__header {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-5);
}

.notary-parties-seller-situation-card__name {
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--color-text);
}

.notary-parties-seller-situation-card__body {
  border-top: 1px solid var(--color-border);
  padding: var(--space-3) var(--space-4);
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-parties-seller-situation-card__section {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
}

.notary-parties-seller-situation-card__section-heading {
  width: 100%;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: var(--space-1);
}

.notary-parties-seller-situation-card__tag {
  display: inline-flex;
  align-items: baseline;
  gap: var(--space-1);
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-border);
  background-color: var(--color-surface);
  font-size: var(--font-size-xs);
  line-height: 1.2;
}

.notary-parties-seller-situation-card__tag--empty {
  border-style: dashed;
  background-color: transparent;
}

.notary-parties-seller-situation-card__label {
  font-weight: var(--font-weight-medium);
  color: var(--color-brand-light);
}

.notary-parties-seller-situation-card__tag--empty .notary-parties-seller-situation-card__label {
  color: var(--color-text-disabled);
}

.notary-parties-seller-situation-card__value {
  font-weight: var(--font-weight-normal);
  color: var(--color-text-subtle);
}

.notary-parties-seller-situation-card__footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: var(--space-3) var(--space-5);
  border-top: 1px solid var(--color-border);
}


/* notary/parties/sellers/global_progress.css */
.notary-parties-sellers-global-progress {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
  min-width: 220px;
}

.notary-parties-sellers-global-progress__heading {
  font-size: var(--text-lg);
  font-weight: var(--font-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-parties-sellers-global-progress__overall {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.notary-parties-sellers-global-progress__counters {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.notary-parties-sellers-global-progress__counter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
}

.notary-parties-sellers-global-progress__counter-label {
  font-size: var(--text-sm);
  font-weight: var(--font-medium);
  color: var(--color-text);
}

.notary-parties-sellers-global-progress__counter-value {
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--color-brand);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}


/* notary/parties/sellers/show.css */
.notary-parties-sellers-show {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.notary-parties-sellers-show__summary {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: start;
  gap: var(--space-8);
}

.notary-parties-sellers-show__section {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-parties-sellers-show__section + .notary-parties-sellers-show__section {
  padding-top: var(--space-6);
  border-top: 1px solid var(--color-border);
}

.notary-parties-sellers-show__persons {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

@media (max-width: 767px) {
  .notary-parties-sellers-show__summary {
    grid-template-columns: 1fr;
  }
}


/* notary/parties/sellers/summary_card.css */
.notary-parties-sellers-summary-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background-color: var(--color-surface);
}

.notary-parties-sellers-summary-card__title {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-xl);
  font-weight: var(--font-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-parties-sellers-summary-card__icon {
  font-size: var(--text-2xl);
}

.notary-parties-sellers-summary-card__counters {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-sm);
  color: var(--color-text-subtle);
}

.notary-parties-sellers-summary-card__dot {
  color: var(--color-text-disabled);
}

.notary-parties-sellers-summary-card__names {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.notary-parties-sellers-summary-card__name {
  font-size: var(--text-sm);
  color: var(--color-text);
}


/* notary/parties/survey_page.css */
@media (min-width: 1440px) {
  .notary-parties-survey-page__body.notary-parties-survey-page__body {
    display: block;
  }

  .notary-parties-survey-page__body.notary-parties-survey-page__body > :only-child {
    max-width: none;
  }
}


/* notary/properties/address_title.css */
.notary-properties-address-title {
  font-size: var(--text-xl);
  font-weight: var(--font-semibold);
  color: var(--color-text);
  margin: 0;
}


/* notary/properties/annonce_panel.css */
.notary-properties-annonce-panel {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  position: sticky;
  top: var(--space-4);
}

.notary-properties-annonce-panel__section {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.notary-properties-annonce-panel__heading {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}

/* ── Checklist ── */

.notary-properties-annonce-panel__checklist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.notary-properties-annonce-panel__checklist-item {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.notary-properties-annonce-panel__checklist-item--filled {
  color: var(--color-text);
}

.notary-properties-annonce-panel__checklist-icon {
  font-size: var(--font-size-xs);
  width: 16px;
  text-align: center;
  flex-shrink: 0;
}

.notary-properties-annonce-panel__checklist-item--filled .notary-properties-annonce-panel__checklist-icon {
  color: var(--color-success);
}

/* ── Actions ── */

.notary-properties-annonce-panel__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-1);
  width: 100%;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-2) var(--space-3);
  cursor: pointer;
  transition: background 0.15s;
}

.notary-properties-annonce-panel__btn:hover {
  background: var(--color-neutral-50);
}

.notary-properties-annonce-panel__link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-1);
  width: 100%;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-brand);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-2) var(--space-3);
  text-decoration: none;
  transition: background 0.15s;
}

.notary-properties-annonce-panel__link:hover {
  background: var(--color-neutral-50);
}

/* ── Meta ── */

.notary-properties-annonce-panel__meta {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  padding-top: var(--space-3);
  border-top: 1px solid var(--color-border);
}


/* notary/properties/card.css */
.notary-properties-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background-color: var(--color-surface);
}


/* notary/properties/coproperty_section.css */
.notary-properties-coproperty-section {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.notary-properties-coproperty-section__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-3) var(--space-5);
  background-color: var(--color-surface);
}

.notary-properties-coproperty-section__title {
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-properties-coproperty-section__count {
  font-size: var(--text-xs);
  font-weight: var(--font-medium);
  color: var(--color-brand-light);
}

.notary-properties-coproperty-section__summary {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-5);
  padding: var(--space-3) var(--space-5);
  background-color: var(--color-surface-subtle);
  border-top: 1px solid var(--color-border);
}

.notary-properties-coproperty-section__summary-item {
  display: flex;
  align-items: baseline;
  gap: var(--space-1);
}

.notary-properties-coproperty-section__summary-item--missing .notary-properties-coproperty-section__summary-value {
  color: var(--color-text-disabled);
  font-style: italic;
  font-weight: var(--font-weight-regular);
}

.notary-properties-coproperty-section__summary-label {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

.notary-properties-coproperty-section__summary-value {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}

.notary-properties-coproperty-section__body {
  padding: var(--space-4) var(--space-5);
  background-color: var(--color-surface);
}

.notary-properties-coproperty-section__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: var(--space-3);
}

.notary-properties-coproperty-section__footer {
  display: flex;
  justify-content: flex-end;
  padding: var(--space-3) var(--space-5);
  background-color: var(--color-surface);
  border-top: 1px solid var(--color-border);
}


/* notary/properties/cover_button.css */
.notary-properties-cover-button {
  position: absolute;
  bottom: var(--space-2);
  left: var(--space-2);
  z-index: 1;
  opacity: 0;
  transition: opacity var(--duration-fast) var(--easing-default);
}

.notary-properties-photo-gallery__item:hover .notary-properties-cover-button {
  opacity: 1;
}

/* Loading state — fulgore form-loading puts ui-button--loading on the button */
.notary-properties-cover-button:has(.ui-button--loading) {
  opacity: 1;
}

.notary-properties-cover-button:has(.ui-button--loading) .ui-button {
  pointer-events: none;
  cursor: wait;
  position: relative;
  min-width: 40px;
}

.notary-properties-cover-button .ui-button--loading {
  color: transparent;
}

.notary-properties-cover-button .ui-button--loading::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 14px;
  height: 14px;
  margin: -7px 0 0 -7px;
  border: 2px solid rgba(255, 255, 255, 0.3);
  border-top-color: currentColor;
  border-radius: 50%;
  animation: cover-btn-spin 0.6s linear infinite;
  vertical-align: initial;
  display: block;
  margin-inline-start: -7px;
  color: white;
}

@keyframes cover-btn-spin {
  to { transform: rotate(360deg); }
}


/* notary/properties/delete_photo_modal.css */
.notary-properties-delete-photo-modal__preview {
  display: flex;
  justify-content: center;
  padding: var(--space-3) 0;
}

picture.notary-properties-delete-photo-modal__image {
  display: contents;
}

img.notary-properties-delete-photo-modal__image {
  max-width: 100%;
  max-height: 200px;
  object-fit: contain;
  border-radius: var(--radius-md);
}


/* notary/properties/description_display.css */
/* ── Container ── */

.notary-properties-description-display {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  font-size: var(--font-size-xs);
}

/* ── Cover photo ── */

.notary-properties-description-display__cover-wrapper,
picture.notary-properties-description-display__cover {
  display: contents;
}

img.notary-properties-description-display__cover {
  width: 100%;
  height: auto;
  max-height: 220px;
  object-fit: cover;
  display: block;
}

/* ── Type + Price banner ── */

.notary-properties-description-display__banner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--space-3) var(--space-4);
  background: var(--color-brand);
  color: white;
}

.notary-properties-description-display__type {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  letter-spacing: 0.05em;
}

.notary-properties-description-display__price {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
}

/* ── Headline + address ── */

.notary-properties-description-display__headline-section {
  padding: var(--space-3) var(--space-4) 0;
}

.notary-properties-description-display__headline {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0 0 var(--space-1) 0;
  line-height: var(--line-height-tight);
}

.notary-properties-description-display__address {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  margin: 0;
}

/* ── Two-column descriptif + financials ── */

.notary-properties-description-display__columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4);
  padding: var(--space-3) var(--space-4);
}

.notary-properties-description-display__col {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.notary-properties-description-display__col-title {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-bold);
  color: var(--color-brand);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin: 0;
  padding-bottom: var(--space-1);
  border-bottom: 2px solid var(--color-brand);
}

.notary-properties-description-display__dl {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-0-5) var(--space-2);
  margin: 0;
}

.notary-properties-description-display__dt {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

.notary-properties-description-display__dd {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
  text-align: right;
}

/* ── Amenities ── */

.notary-properties-description-display__amenities {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
  padding: 0 var(--space-4);
}

.notary-properties-description-display__amenity {
  font-size: 10px;
  font-weight: var(--font-weight-medium);
  color: var(--color-brand);
  background: var(--color-brand-surface);
  padding: var(--space-0-5) var(--space-2);
  border-radius: var(--radius-full);
}

/* ── DPE / GES visual scales ── */

.notary-properties-description-display__energy {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4);
  padding: var(--space-3) var(--space-4);
}

/* ── Body section ── */

.notary-properties-description-display__body-section {
  padding: 0 var(--space-4);
}

.notary-properties-description-display__body {
  font-size: var(--font-size-xs);
  color: var(--color-text);
  margin: 0;
  line-height: var(--line-height-relaxed);
  white-space: pre-line;
}

/* ── Thumbnail strip ── */

.notary-properties-description-display__thumbnails {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
  gap: var(--space-1);
  padding: var(--space-2) var(--space-4);
}

picture.notary-properties-description-display__thumb {
  display: contents;
}

img.notary-properties-description-display__thumb {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--radius-sm);
  display: block;
}

/* ── Footer ── */

.notary-properties-description-display__footer {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: var(--space-3) var(--space-4);
  border-top: 1px solid var(--color-border);
  background: var(--color-neutral-50);
  gap: var(--space-3);
}

.notary-properties-description-display__footer-left {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.notary-properties-description-display__ref {
  font-size: 10px;
  color: var(--color-text-subtle);
}

.notary-properties-description-display__tour-link {
  font-size: 10px;
  font-weight: var(--font-weight-medium);
  color: var(--color-brand);
  text-decoration: none;
}

.notary-properties-description-display__tour-link:hover {
  text-decoration: underline;
}

.notary-properties-description-display__agent {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 1px;
}

.notary-properties-description-display__agent-line {
  font-size: 10px;
  color: var(--color-text-subtle);
}

.notary-properties-description-display__agent-line:first-child {
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

/* ── Print styles ── */

@media print {
  .notary-properties-description-display {
    border: none;
    box-shadow: none;
    border-radius: 0;
    font-size: 11pt;
  }

  .notary-properties-description-display__cover {
    max-height: 200px;
  }

  .notary-properties-description-display__tour-link {
    display: none;
  }
}


/* notary/properties/description_display_parts/energy_scale.css */
.notary-properties-description-display-parts-energy-scale {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.notary-properties-description-display-parts-energy-scale__title {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
}

.notary-properties-description-display-parts-energy-scale__bars {
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.notary-properties-description-display-parts-energy-scale__bar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: var(--bar-width);
  padding: 1px 4px;
  font-size: 9px;
  font-weight: var(--font-weight-bold);
  color: white;
  border-radius: 0 2px 2px 0;
  line-height: 1.4;
}

.notary-properties-description-display-parts-energy-scale__bar--active {
  outline: 2px solid var(--color-text);
  outline-offset: 1px;
  z-index: 1;
}

/* ── DPE colors (vert → rouge) ── */

.notary-properties-description-display-parts-energy-scale__bar--dpe-a { background: #319834; }
.notary-properties-description-display-parts-energy-scale__bar--dpe-b { background: #33cc31; }
.notary-properties-description-display-parts-energy-scale__bar--dpe-c { background: #cbfc34; color: var(--color-text); }
.notary-properties-description-display-parts-energy-scale__bar--dpe-d { background: #fbfe06; color: var(--color-text); }
.notary-properties-description-display-parts-energy-scale__bar--dpe-e { background: #fbcc05; color: var(--color-text); }
.notary-properties-description-display-parts-energy-scale__bar--dpe-f { background: #fc9935; }
.notary-properties-description-display-parts-energy-scale__bar--dpe-g { background: #fc1a10; }

/* ── GES colors (violet clair → violet foncé) ── */

.notary-properties-description-display-parts-energy-scale__bar--ges-a { background: #f2e6ff; color: var(--color-text); }
.notary-properties-description-display-parts-energy-scale__bar--ges-b { background: #dab8f0; color: var(--color-text); }
.notary-properties-description-display-parts-energy-scale__bar--ges-c { background: #cc99e6; color: var(--color-text); }
.notary-properties-description-display-parts-energy-scale__bar--ges-d { background: #b366cc; }
.notary-properties-description-display-parts-energy-scale__bar--ges-e { background: #9933b3; }
.notary-properties-description-display-parts-energy-scale__bar--ges-f { background: #730099; }
.notary-properties-description-display-parts-energy-scale__bar--ges-g { background: #4d0066; }


/* notary/properties/global_progress.css */
.notary-properties-global-progress {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.notary-properties-global-progress__heading {
  font-size: var(--text-lg);
  font-weight: var(--font-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-properties-global-progress__overall {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.notary-properties-global-progress__counters {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.notary-properties-global-progress__counter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
}

.notary-properties-global-progress__counter-label {
  font-size: var(--text-sm);
  font-weight: var(--font-medium);
  color: var(--color-text);
}

.notary-properties-global-progress__counter-value {
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--color-brand);
  font-variant-numeric: tabular-nums;
}


/* notary/properties/location_context/dvf_panel.css */
.notary-properties-location-context-dvf-panel {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-6);
}

.notary-properties-location-context-dvf-panel .ui-section-header {
  margin-bottom: 0;
}

.notary-properties-location-context-dvf-panel__stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-4);
}

.notary-properties-location-context-dvf-panel__stat-with-tooltip {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: var(--space-1);
}

@media (max-width: 640px) {
  .notary-properties-location-context-dvf-panel__stats {
    grid-template-columns: 1fr;
  }
}


/* notary/properties/location_context/georisques_panel.css */
.notary-properties-location-context-georisques-panel {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-6);
}

.notary-properties-location-context-georisques-panel .ui-section-header {
  margin-bottom: 0;
}

.notary-properties-location-context-georisques-panel__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.notary-properties-location-context-georisques-panel__empty {
  color: var(--color-text-subtle);
  font-style: italic;
}


/* notary/properties/location_context/risk_item.css */
.notary-properties-location-context-risk-item {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: var(--space-4);
  align-items: center;
  padding: var(--space-3) var(--space-4);
  background: var(--color-surface-subtle);
  border-radius: var(--radius-md);
  border-left: 3px solid var(--color-border);
}

.notary-properties-location-context-risk-item--inondation {
  border-left-color: var(--color-info);
}

.notary-properties-location-context-risk-item--mouvement_terrain,
.notary-properties-location-context-risk-item--feu_foret,
.notary-properties-location-context-risk-item--minier,
.notary-properties-location-context-risk-item--radon,
.notary-properties-location-context-risk-item--transport_marchandises_dangereuses {
  border-left-color: var(--color-warning);
}

.notary-properties-location-context-risk-item--seisme,
.notary-properties-location-context-risk-item--industriel,
.notary-properties-location-context-risk-item--nucleaire {
  border-left-color: var(--color-danger);
}

.notary-properties-location-context-risk-item__icon {
  font-size: var(--font-size-3xl);
  line-height: 1;
}

.notary-properties-location-context-risk-item__text {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.notary-properties-location-context-risk-item__category {
  font-size: var(--font-size-xs);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-text-subtle);
  font-weight: var(--font-weight-semibold);
}

.notary-properties-location-context-risk-item__label {
  font-size: var(--font-size-sm);
  color: var(--color-text);
}

.notary-properties-location-context-risk-item__severity {
  justify-self: end;
}


/* notary/properties/location_context/source_footer.css */
.notary-properties-location-context-source-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-4);
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-border);
  font-size: var(--font-size-sm);
}

.notary-properties-location-context-source-footer__link {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  color: var(--color-brand);
  text-decoration: none;
  font-weight: var(--font-weight-medium);
}

.notary-properties-location-context-source-footer__link:hover {
  text-decoration: underline;
}

.notary-properties-location-context-source-footer__external-icon {
  font-size: 0.85em;
  line-height: 1;
}

.notary-properties-location-context-source-footer__meta {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
}

@media (max-width: 640px) {
  .notary-properties-location-context-source-footer {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-2);
  }
}


/* notary/properties/location_context/transaction_row.css */
.notary-properties-location-context-transaction-row {
  transition: background-color 0.12s ease-out;
}

.notary-properties-location-context-transaction-row:hover {
  background-color: var(--color-surface-subtle);
}

.notary-properties-location-context-transaction-row__cell {
  padding: var(--space-2) var(--space-3);
  border-bottom: 1px solid var(--color-border);
  font-size: var(--font-size-sm);
  color: var(--color-text);
}

.notary-properties-location-context-transaction-row__cell--numeric {
  text-align: right;
  font-variant-numeric: tabular-nums;
}


/* notary/properties/location_context/transactions_table.css */
.notary-properties-location-context-transactions-table {
  overflow-x: auto;
}

.notary-properties-location-context-transactions-table__table {
  width: 100%;
  border-collapse: collapse;
}

.notary-properties-location-context-transactions-table__header-cell {
  padding: var(--space-2) var(--space-3);
  border-bottom: 2px solid var(--color-border);
  text-align: left;
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  font-size: var(--font-size-xs);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  white-space: nowrap;
}

.notary-properties-location-context-transactions-table__header-cell--numeric {
  text-align: right;
}

.notary-properties-location-context-transactions-table__empty {
  padding: var(--space-4);
  color: var(--color-text-subtle);
  font-style: italic;
  text-align: center;
}


/* notary/properties/location_context_tab.css */
.notary-properties-location-context-tab {
  padding: var(--space-6);
}

.notary-properties-location-context-tab__empty,
.notary-properties-location-context-tab__loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-4);
  padding: var(--space-12) var(--space-6);
  color: var(--color-text-subtle);
  text-align: center;
}

.notary-properties-location-context-tab__panels {
  display: flex;
  flex-direction: column;
  gap: var(--space-8);
}

.notary-properties-location-context-tab__warning {
  padding: var(--space-4);
  background: var(--color-warning-surface);
  border-radius: var(--radius-md);
  color: var(--color-warning-text);
  font-size: var(--font-size-sm);
}

.notary-properties-location-context-tab__disclaimer {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2);
  margin-top: var(--space-4);
  padding: var(--space-3) var(--space-4);
  background: var(--color-surface-subtle);
  border-radius: var(--radius-md);
  border-left: 3px solid var(--color-border-strong);
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  line-height: 1.5;
}

.notary-properties-location-context-tab__disclaimer::before {
  content: "ℹ️";
  flex-shrink: 0;
  font-size: var(--font-size-base);
  line-height: 1;
}


/* notary/properties/map.css */
.notary-properties-map {
  position: relative;
  z-index: 0;
  height: 200px;
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.notary-properties-map--empty {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px dashed var(--color-border);
  background-color: var(--color-surface-subtle);
}

.notary-properties-map__label {
  font-size: var(--text-sm);
  color: var(--color-text-subtle);
}


/* notary/properties/photo_gallery.css */
.notary-properties-photo-gallery__title {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0 0 var(--space-3) 0;
}

.notary-properties-photo-gallery__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-3);
  margin-bottom: var(--space-4);
}

@media (min-width: 640px) {
  .notary-properties-photo-gallery__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .notary-properties-photo-gallery__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.notary-properties-photo-gallery__item {
  position: relative;
  border-radius: var(--radius-md);
  overflow: hidden;
  aspect-ratio: 3 / 2;
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 200% 100%;
  animation: photo-shimmer 1.5s ease-in-out infinite;
}

@keyframes photo-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Spinner (pseudo-element, behind the image) */
.notary-properties-photo-gallery__item::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 24px;
  height: 24px;
  margin: -12px 0 0 -12px;
  border: 3px solid rgba(0, 0, 0, 0.1);
  border-top-color: var(--color-brand);
  border-radius: 50%;
  animation: photo-spin 0.8s linear infinite;
}

@keyframes photo-spin {
  to { transform: rotate(360deg); }
}

/* UI::Display::Picture rend un <picture> wrapper — le neutraliser pour que les règles ciblent l'<img>. */
.notary-properties-photo-gallery__image-wrapper,
picture.notary-properties-photo-gallery__image {
  display: contents;
}

/* Image covers skeleton once loaded */
img.notary-properties-photo-gallery__image {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  cursor: pointer;
  z-index: 1;
  transition: transform var(--duration-normal) var(--easing-default);
}

.notary-properties-photo-gallery__item:hover .notary-properties-photo-gallery__image {
  transform: scale(1.02);
}

/* Drag & drop */
.notary-properties-photo-gallery__item[draggable="true"] {
  cursor: grab;
}

.notary-properties-photo-gallery__item--dragging {
  opacity: 0.3;
}

.notary-properties-photo-gallery__ghost {
  aspect-ratio: 3 / 2;
  border: 2px dashed var(--color-brand);
  border-radius: var(--radius-md);
  background: var(--color-brand-subtle, rgba(99, 66, 232, 0.08));
}

/* Delete button */
.notary-properties-photo-gallery__delete {
  position: absolute;
  top: var(--space-2);
  right: var(--space-2);
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
  margin: 0;
  border: none;
  border-radius: 50%;
  font-size: 16px;
  line-height: 1;
  color: #fff;
  background: #e53e3e;
  cursor: pointer;
  opacity: 0;
  transition: opacity var(--duration-fast) var(--easing-default), background 0.15s ease;
}

.notary-properties-photo-gallery__item:hover .notary-properties-photo-gallery__delete {
  opacity: 1;
}

.notary-properties-photo-gallery__delete:hover {
  background: #c53030;
}

/* Cover badge */
.notary-properties-photo-gallery__item--cover {
  outline: 3px solid var(--color-brand);
  outline-offset: -3px;
}

.notary-properties-photo-gallery__cover-badge {
  position: absolute;
  bottom: var(--space-2);
  left: var(--space-2);
  z-index: 1;
  padding: 2px 8px;
  font-size: 11px;
  font-weight: 600;
  color: #fff;
  background: var(--color-brand);
  border-radius: var(--radius-sm);
}



/* notary/properties/show.css */
.notary-properties-show {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.notary-properties-show .ui-bases-view-actions {
  display: grid;
  gap: var(--space-2);
}

.notary-properties-show__summary {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: start;
  gap: var(--space-8);
}

@media (max-width: 767px) {
  .notary-properties-show__summary {
    grid-template-columns: 1fr;
  }
}

.notary-properties-show__lots-recap {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  margin: 0 0 var(--space-4) 0;
  padding-bottom: var(--space-4);
  border-bottom: 1px solid var(--color-border);
}

.notary-properties-show__standalone {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-properties-show__section-title {
  font-size: var(--text-base);
  font-weight: var(--font-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-properties-show__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: var(--space-3);
}

/* ── Annonce tab — two-column layout ── */

.notary-properties-show__annonce {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: var(--space-6);
  align-items: start;
}

@media (max-width: 900px) {
  .notary-properties-show__annonce {
    grid-template-columns: 1fr;
  }
}

/* ── Left column — A4 preview ── */

.notary-properties-show__annonce-preview {
  background: var(--color-neutral-100);
  border-radius: var(--radius-lg);
  padding: var(--space-4);
  display: flex;
  justify-content: center;
}

.notary-properties-show__annonce-preview .notary-properties-description-display {
  width: 100%;
  max-width: 595px;
  aspect-ratio: 210 / 297;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

/* ── A4 skeleton (empty state) ── */

.notary-properties-show__annonce-skeleton {
  width: 100%;
  max-width: 595px;
  aspect-ratio: 210 / 297;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
  padding: var(--space-6);
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-properties-show__skeleton-photo {
  width: 100%;
  height: 30%;
  background: var(--color-neutral-100);
  border-radius: var(--radius-md);
}

.notary-properties-show__skeleton-line {
  height: 12px;
  background: var(--color-neutral-100);
  border-radius: var(--radius-sm);
  width: 100%;
}

.notary-properties-show__skeleton-line--title {
  height: 18px;
  width: 70%;
}

.notary-properties-show__skeleton-line--short {
  width: 40%;
}

.notary-properties-show__skeleton-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-2);
}

.notary-properties-show__skeleton-block {
  height: 36px;
  background: var(--color-neutral-100);
  border-radius: var(--radius-sm);
}

.notary-properties-show__skeleton-message {
  margin: auto 0 0;
  text-align: center;
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

/* ── Print: only show the A4 preview ── */

@media print {
  body > *:not(.notary-properties-show) {
    display: none !important;
  }

  .notary-properties-show > *:not(.ui-tabs),
  .notary-properties-annonce-panel,
  .notary-properties-show__annonce-preview {
    display: none !important;
  }

  .notary-properties-show__annonce {
    display: block !important;
  }

  .notary-properties-show__annonce-preview {
    display: block !important;
    background: none;
    padding: 0;
  }

  .notary-properties-show__annonce-preview .notary-properties-description-display {
    max-width: none;
    aspect-ratio: auto;
    box-shadow: none;
    border: none;
    border-radius: 0;
  }
}


/* notary/properties/survey_page.css */
@media (min-width: 1440px) {
  .notary-properties-survey-page__body.notary-properties-survey-page__body {
    display: block;
  }

  .notary-properties-survey-page__body.notary-properties-survey-page__body > :only-child {
    max-width: none;
  }
}

/* ── Wide variant (property_description survey) — full width at all sizes ── */

.notary-properties-survey-page--wide__body {
  display: block;
  margin-inline: calc(-1 * var(--space-8));
  padding-inline: var(--space-4);
}

@media (max-width: 767px) {
  .notary-properties-survey-page--wide__body {
    margin-inline: calc(-1 * var(--space-4));
    padding-inline: var(--space-2);
  }
}

.notary-properties-survey-page--wide__body > :only-child {
  max-width: none;
}

@media (min-width: 768px) {
  .notary-properties-survey-page--wide__body .surveys-question-layout {
    grid-template-columns: 3fr 2fr;
    gap: var(--space-8);
  }

  .notary-properties-survey-page--wide__body .surveys-question-layout__main {
    grid-column: 1;
    grid-row: 1 / 3;
  }

  .notary-properties-survey-page--wide__body .surveys-map {
    grid-column: 2;
  }

  .notary-properties-survey-page--wide__body .surveys-question-layout__context-block {
    grid-column: 2;
  }
}

@media (min-width: 1024px) {
  .notary-properties-survey-page--wide__body .surveys-question-layout {
    grid-template-columns: 1fr 280px 280px;
  }

  .notary-properties-survey-page--wide__body .surveys-question-layout__main {
    grid-row: auto;
  }

  .notary-properties-survey-page--wide__body .surveys-map {
    grid-column: auto;
  }

  .notary-properties-survey-page--wide__body .surveys-question-layout__context-block {
    grid-column: auto;
  }
}


/* notary/properties/unit_card.css */
.notary-properties-unit-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background-color: var(--color-surface);
  overflow: hidden;
}


/* notary/properties/unit_cards/body.css */
.notary-properties-unit-cards-body {
  border-top: 1px solid var(--color-border);
  padding: var(--space-3) var(--space-4);
}

.notary-properties-unit-cards-body__list {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
}

.notary-properties-unit-cards-body__group {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
  flex: 1;
  min-width: 0;
}

.notary-properties-unit-cards-body__separator {
  flex-shrink: 0;
  width: 1px;
  align-self: stretch;
  background-color: var(--color-border);
}

.notary-properties-unit-cards-body__tag {
  display: inline-flex;
  align-items: baseline;
  gap: var(--space-1);
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-border);
  background-color: var(--color-surface);
  font-size: var(--font-size-xs);
  line-height: 1.2;
}

.notary-properties-unit-cards-body__tag--empty {
  border-style: dashed;
  background-color: transparent;
}

.notary-properties-unit-cards-body__label {
  font-weight: var(--font-weight-medium);
  color: var(--color-brand-light);
}

.notary-properties-unit-cards-body__tag--empty .notary-properties-unit-cards-body__label {
  color: var(--color-text-disabled);
}

.notary-properties-unit-cards-body__value {
  font-weight: var(--font-weight-normal);
  color: var(--color-text-subtle);
}


/* notary/properties/unit_cards/footer.css */
.notary-properties-unit-cards-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-3) var(--space-5);
  border-top: 1px solid var(--color-border);
}


/* notary/properties/unit_cards/header.css */
.notary-properties-unit-cards-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-3) var(--space-5);
}

.notary-properties-unit-cards-header__identity {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.notary-properties-unit-cards-header__icon {
  font-size: var(--text-base);
  line-height: 1;
}

.notary-properties-unit-cards-header__kind {
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--color-text);
}

.notary-properties-unit-cards-header__percentage {
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--color-brand);
  font-variant-numeric: tabular-nums;
}


/* notary/property_descriptions/edit.css */
/* Sidecar conventionnel — pas de surcharge visuelle propre à cette page Edit. */


/* notary/property_descriptions/form.css */
/* Sidecar conventionnel — pas de surcharge visuelle propre à ce form. */


/* notary/prospection/commune_indicator.css */
.notary-prospection-commune-indicator {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-sm);
  background: var(--color-surface-subtle);
  border: 1px solid var(--color-border);
  font-size: var(--font-size-sm);
  margin-bottom: var(--space-3);
  transition: background var(--duration-fast) var(--easing-default),
              border-color var(--duration-fast) var(--easing-default),
              color var(--duration-fast) var(--easing-default);
}

.notary-prospection-commune-indicator__icon {
  flex-shrink: 0;
  font-size: var(--font-size-base);
}

.notary-prospection-commune-indicator__label {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--color-text);
}

/* State: followed (green) */
.notary-prospection-commune-indicator[data-state="followed"] {
  background: rgba(34, 197, 94, 0.08);
  border-color: rgba(34, 197, 94, 0.3);
  color: rgb(22, 101, 52);
}

/* State: followable (yellow) */
.notary-prospection-commune-indicator[data-state="followable"] {
  background: rgba(250, 204, 21, 0.08);
  border-color: rgba(250, 204, 21, 0.3);
  color: rgb(133, 77, 14);
}

/* State: out of range (gray) */
.notary-prospection-commune-indicator[data-state="out_of_range"] {
  background: var(--color-surface-subtle);
  border-color: var(--color-border);
  color: var(--color-text-subtle);
  font-style: italic;
}


/* notary/prospection/coverage_badge.css */
.notary-prospection-coverage-badge {
  display: inline-flex;
  align-items: center;
  color: var(--color-text-subtle);
  cursor: help;
  transition: color var(--duration-fast) var(--easing-default);
}

.notary-prospection-coverage-badge:hover {
  color: var(--color-text);
}


/* notary/prospection/filter_bar.css */
.notary-prospection-filter-bar {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-3);
}

@media (min-width: 768px) {
  .notary-prospection-filter-bar {
    flex-direction: row;
    align-items: flex-start;
    gap: var(--space-4);
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
  }

  .notary-prospection-filter-bar::-webkit-scrollbar {
    display: none;
  }
}

/* Vertical variant — stack sections in a column whatever the viewport.
   Used inside narrow containers (e.g. FilterDrawer 280px) where the
   default row layout would overflow horizontally and clip sections. */
.notary-prospection-filter-bar--vertical {
  flex-direction: column;
  overflow: visible;
  gap: var(--space-3);
  padding: 0;
}

.notary-prospection-filter-bar__section {
  border: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
  row-gap: var(--space-2);
  align-items: flex-start;
}

.notary-prospection-filter-bar__legend {
  width: 100%;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  margin-bottom: var(--space-2);
}

.notary-prospection-filter-bar__legend--compact {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

.notary-prospection-filter-bar__input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.notary-prospection-filter-bar__input:focus-visible + .notary-prospection-filter-bar__chip {
  outline: 2px solid var(--color-brand);
  outline-offset: 2px;
}

.notary-prospection-filter-bar__chip {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-1) var(--space-3);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-full);
  font-size: var(--font-size-sm);
  cursor: pointer;
  user-select: none;
  transition: all 150ms ease;
}

.notary-prospection-filter-bar__chip:hover {
  border-color: var(--color-brand);
}

.notary-prospection-filter-bar__input:checked + .notary-prospection-filter-bar__chip {
  background: var(--color-brand-surface);
  border-color: var(--color-brand);
  color: var(--color-brand-dark);
}

.notary-prospection-filter-bar__count {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

/* Icon-only variant — hide label visually (tooltip rendered via utility .tooltip-hover) */
.notary-prospection-filter-chip--icon-only .notary-prospection-filter-bar__label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

/* Compact mode — mobile only: hide label, show tooltip on hover/focus */
@media (max-width: 767px) {
  .notary-prospection-filter-chip--compact .notary-prospection-filter-bar__label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
  }

  .notary-prospection-filter-chip--compact .notary-prospection-filter-bar__chip:hover::after,
  .notary-prospection-filter-chip--compact .notary-prospection-filter-bar__chip:focus-visible::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: calc(100% + var(--space-2));
    left: 50%;
    transform: translateX(-50%);
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-sm);
    font-size: var(--font-size-xs);
    color: var(--color-surface);
    background: var(--color-text);
    white-space: nowrap;
    z-index: var(--z-raised);
    pointer-events: none;
  }
}


/* notary/prospection/filter_drawer.css */
/* Animation strategy: Option B (smooth).
 * The drawer renders with the `hidden` HTML attribute for SSR a11y (collapsed by default).
 * The Stimulus controller removes `hidden` on first expand, then toggles the `--expanded`
 * modifier on the root for subsequent open/close cycles. CSS drives a smooth opacity +
 * translateY transition via the modifier, with `pointer-events: none` to neutralize the
 * collapsed-but-visible drawer.
 */

.notary-prospection-filter-drawer {
  /* Overlay top-left on the map (sibling of MapContainer__map / PoiPanel).
     The trigger stays compact; the drawer expands below it on demand. */
  position: absolute;
  top: var(--space-4);
  left: var(--space-4);
  z-index: var(--z-dropdown);
}

.notary-prospection-filter-drawer__trigger {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
  cursor: pointer;
  transition:
    border-color var(--duration-fast) var(--easing-default),
    box-shadow var(--duration-fast) var(--easing-default);
}

.notary-prospection-filter-drawer__trigger:hover:not(:disabled) {
  border-color: var(--color-brand);
}

.notary-prospection-filter-drawer__trigger:focus-visible {
  outline: none;
  border-color: var(--color-brand);
  box-shadow: var(--focus-ring);
}

.notary-prospection-filter-drawer__trigger-label {
  line-height: var(--line-height-tight);
}

.notary-prospection-filter-drawer__trigger-chevron {
  display: inline-flex;
  align-items: center;
  transition: transform var(--duration-normal) var(--easing-default);
}

.notary-prospection-filter-drawer--expanded .notary-prospection-filter-drawer__trigger-chevron {
  transform: rotate(180deg);
}

.notary-prospection-filter-drawer__drawer {
  /* Compact panel anchored to the trigger (~280px). Sits above other map
     overlays (iso/POI/zoom) via z-sticky when expanded. */
  position: absolute;
  top: calc(100% + var(--space-1));
  left: 0;
  width: 280px;
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  box-shadow: var(--shadow-lg);
  z-index: var(--z-sticky);
  opacity: 0;
  transform: translateY(-8px);
  pointer-events: none;
  transition:
    opacity var(--duration-normal) var(--easing-out),
    transform var(--duration-normal) var(--easing-out);
}

.notary-prospection-filter-drawer--expanded .notary-prospection-filter-drawer__drawer {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

@media (max-width: 767px) {
  .notary-prospection-filter-drawer__drawer {
    padding: var(--space-3);
  }
}


/* notary/prospection/isochrone_drawer.css */
/* ============================================================
   Notary::Prospection::IsochroneDrawer
   Section interne du FilterDrawer (panneau de filtres carte).
   Desktop-first : caché sous 768px.
   ============================================================ */

.notary-prospection-isochrone-drawer {
  /* Layout — inline section inside FilterDrawer__drawer (no longer an
     absolute overlay; the parent FilterDrawer handles positioning). */
  display: flex;
  flex-direction: column;
  gap: var(--space-2);

  /* Box model — fit parent drawer width including padding (global box-sizing: border-box). */
  width: 100%;
  padding: var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);

  /* Couleurs — visually distinct sub-panel inside the filters drawer */
  background: var(--color-surface-subtle);
}

/* Desktop-first : feature cachée sous 768px */
@media (max-width: 767px) {
  .notary-prospection-isochrone-drawer {
    display: none;
  }
}

/* ----------------------------------------------------------
   Field — groupe input (label retiré en cadrage 2)
   ---------------------------------------------------------- */

.notary-prospection-isochrone-drawer__field {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

/* ----------------------------------------------------------
   Transport toggle — segmented control compact (3 segments)
   220px - padding 24 = ~196px utiles → ~65px par segment
   ---------------------------------------------------------- */

.notary-prospection-isochrone-drawer__transport-toggle {
  display: flex;
  width: 100%;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
}

.notary-prospection-isochrone-drawer__transport-segment {
  flex: 1;
  display: flex;
  position: relative;
}

.notary-prospection-isochrone-drawer__transport-segment + .notary-prospection-isochrone-drawer__transport-segment {
  border-left: 1px solid var(--color-border);
}

/* Input radio caché — accessibilité conservée */
.notary-prospection-isochrone-drawer__transport-segment-input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.notary-prospection-isochrone-drawer__transport-segment-label {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-2) 0;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
  background: var(--color-surface);
  cursor: pointer;
  user-select: none;
  transition: background var(--duration-fast) var(--easing-default),
              color var(--duration-fast) var(--easing-default);
}

.notary-prospection-isochrone-drawer__transport-segment-label:hover {
  background: var(--color-surface-subtle);
}

/* Segment sélectionné */
.notary-prospection-isochrone-drawer__transport-segment-input:checked + .notary-prospection-isochrone-drawer__transport-segment-label {
  background: var(--color-brand-surface);
  color: var(--color-brand);
}

/* Focus clavier */
.notary-prospection-isochrone-drawer__transport-segment-input:focus-visible + .notary-prospection-isochrone-drawer__transport-segment-label {
  outline: none;
  box-shadow: inset 0 0 0 2px var(--color-brand);
}

/* ----------------------------------------------------------
   Minutes — slider + value (label "Durée" retiré, hints retirés)
   ---------------------------------------------------------- */

.notary-prospection-isochrone-drawer__minutes {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.notary-prospection-isochrone-drawer__minutes-header {
  display: flex;
  justify-content: flex-end;
}

.notary-prospection-isochrone-drawer__minutes-value {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  font-variant-numeric: tabular-nums;
  color: var(--color-brand);
}

.notary-prospection-isochrone-drawer__minutes-range {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 4px;
  margin: var(--space-1) 0;
  background: var(--color-border);
  border-radius: var(--radius-full);
  cursor: pointer;
}

.notary-prospection-isochrone-drawer__minutes-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 16px;
  height: 16px;
  border-radius: var(--radius-full);
  background: var(--color-brand);
  border: 2px solid var(--color-surface);
  box-shadow: 0 0 0 1px var(--color-brand-dark);
  cursor: grab;
  transition: transform var(--duration-fast) var(--easing-default);
}

.notary-prospection-isochrone-drawer__minutes-range::-webkit-slider-thumb:active {
  cursor: grabbing;
  transform: scale(1.1);
}

.notary-prospection-isochrone-drawer__minutes-range::-moz-range-thumb {
  width: 16px;
  height: 16px;
  border-radius: var(--radius-full);
  background: var(--color-brand);
  border: 2px solid var(--color-surface);
  box-shadow: 0 0 0 1px var(--color-brand-dark);
  cursor: grab;
  transition: transform var(--duration-fast) var(--easing-default);
}

.notary-prospection-isochrone-drawer__minutes-range::-moz-range-thumb:active {
  cursor: grabbing;
  transform: scale(1.1);
}

.notary-prospection-isochrone-drawer__minutes-range:focus-visible {
  outline: none;
}

.notary-prospection-isochrone-drawer__minutes-range:focus-visible::-webkit-slider-thumb {
  box-shadow: var(--focus-ring);
}

.notary-prospection-isochrone-drawer__minutes-range:focus-visible::-moz-range-thumb {
  box-shadow: var(--focus-ring);
}

/* ----------------------------------------------------------
   Origine — badge contextuel
   ---------------------------------------------------------- */

.notary-prospection-isochrone-drawer__origin {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-md);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  background: var(--color-surface-subtle);
  color: var(--color-text-subtle);
  transition: background var(--duration-fast) var(--easing-default),
              color var(--duration-fast) var(--easing-default);
}

.notary-prospection-isochrone-drawer__origin-text {
  flex: 1;
}

/* Par défaut : les deux textes affichés ; le modifier --origin-* en cache un */
.notary-prospection-isochrone-drawer__origin-text--marker,
.notary-prospection-isochrone-drawer__origin-text--center {
  display: none;
}

/* Modifier origin-marker : badge brand, texte marker visible */
.notary-prospection-isochrone-drawer--origin-marker .notary-prospection-isochrone-drawer__origin {
  background: var(--color-brand-surface);
  color: var(--color-brand);
}

.notary-prospection-isochrone-drawer--origin-marker .notary-prospection-isochrone-drawer__origin-text--marker {
  display: inline;
}

/* Modifier origin-center : badge neutre italic, texte center visible */
.notary-prospection-isochrone-drawer--origin-center .notary-prospection-isochrone-drawer__origin {
  background: var(--color-surface-subtle);
  color: var(--color-text-subtle);
  font-style: italic;
}

.notary-prospection-isochrone-drawer--origin-center .notary-prospection-isochrone-drawer__origin-text--center {
  display: inline;
}

/* ----------------------------------------------------------
   Actions — wrapper boutons (60/40 quand state-applied)
   ---------------------------------------------------------- */

.notary-prospection-isochrone-drawer__actions {
  display: flex;
  gap: var(--space-2);
}

.notary-prospection-isochrone-drawer__calculate-button {
  flex: 1;
  min-width: 0;
}

.notary-prospection-isochrone-drawer__clear-button {
  display: none;
  min-width: 0;
}

/* Forcer les boutons enfants à fill leur wrapper et réduire le padding
   horizontal pour tenir dans 40% à 220px de drawer */
.notary-prospection-isochrone-drawer__calculate-button > .ui-button,
.notary-prospection-isochrone-drawer__clear-button > .ui-button {
  width: 100%;
  min-width: 0;
  padding-left: var(--space-3);
  padding-right: var(--space-3);
}

/* En state applied : Recalculer 60% / Effacer 40% */
.notary-prospection-isochrone-drawer--state-applied .notary-prospection-isochrone-drawer__calculate-button {
  flex: 3;
}

.notary-prospection-isochrone-drawer--state-applied .notary-prospection-isochrone-drawer__clear-button {
  display: flex;
  flex: 2;
}

/* Labels du bouton primary — un seul visible selon l'etat
   idle/error : calculate ; loading : loading ; applied : recalculate */
.notary-prospection-isochrone-drawer__calculate-button-label--calculate {
  display: inline;
}

.notary-prospection-isochrone-drawer__calculate-button-label--recalculate,
.notary-prospection-isochrone-drawer__calculate-button-label--loading {
  display: none;
}

.notary-prospection-isochrone-drawer--state-loading .notary-prospection-isochrone-drawer__calculate-button-label--calculate,
.notary-prospection-isochrone-drawer--state-loading .notary-prospection-isochrone-drawer__calculate-button-label--recalculate {
  display: none;
}

.notary-prospection-isochrone-drawer--state-loading .notary-prospection-isochrone-drawer__calculate-button-label--loading {
  display: inline;
}

.notary-prospection-isochrone-drawer--state-applied .notary-prospection-isochrone-drawer__calculate-button-label--calculate {
  display: none;
}

.notary-prospection-isochrone-drawer--state-applied .notary-prospection-isochrone-drawer__calculate-button-label--recalculate {
  display: inline;
}

/* ----------------------------------------------------------
   Applied status — ligne text-only "Zone active"
   ---------------------------------------------------------- */

.notary-prospection-isochrone-drawer__applied-status {
  display: none;
  margin: 0;
  padding: 0;
  font-size: var(--font-size-xs);
  color: var(--color-brand);
}

.notary-prospection-isochrone-drawer--state-applied .notary-prospection-isochrone-drawer__applied-status {
  display: block;
  animation: notary-prospection-isochrone-drawer-status-in var(--duration-normal) var(--easing-out);
}

/* ----------------------------------------------------------
   Error status — ligne text-only (icône circle-info + texte)
   ---------------------------------------------------------- */

.notary-prospection-isochrone-drawer__error-status {
  display: none;
  align-items: center;
  gap: var(--space-2);
  margin: 0;
  padding: 0;
  font-size: var(--font-size-xs);
  color: var(--color-danger);
}

.notary-prospection-isochrone-drawer--state-error .notary-prospection-isochrone-drawer__error-status {
  display: flex;
  animation: notary-prospection-isochrone-drawer-status-in var(--duration-normal) var(--easing-out);
}

/* Icône SVG hérite de la couleur courante (rendue par UI::Icon) */
.notary-prospection-isochrone-drawer__error-status svg {
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  fill: currentColor;
}

@keyframes notary-prospection-isochrone-drawer-status-in {
  from {
    opacity: 0;
    transform: translateY(2px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ----------------------------------------------------------
   State loading — inputs désactivés visuellement
   ---------------------------------------------------------- */

.notary-prospection-isochrone-drawer--state-loading .notary-prospection-isochrone-drawer__field,
.notary-prospection-isochrone-drawer--state-loading .notary-prospection-isochrone-drawer__transport-toggle,
.notary-prospection-isochrone-drawer--state-loading .notary-prospection-isochrone-drawer__minutes,
.notary-prospection-isochrone-drawer--state-loading .notary-prospection-isochrone-drawer__origin {
  opacity: 0.5;
  pointer-events: none;
}


/* notary/prospection/layout.css */
.notary-prospection-layout {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  height: 100%;
}

.notary-prospection-layout__map-column {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-width: 0;
}

.notary-prospection-layout__panel-column {
  min-width: 0;
  overflow: hidden auto;
  border-left: 1px solid var(--color-border);
  background-color: var(--color-surface);
}

@media (max-width: 767px) {
  .notary-prospection-layout {
    grid-template-columns: 1fr;
  }

  .notary-prospection-layout__panel-column {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 100;
    height: 90vh;
    transform: translateY(calc(100% - 80px));
    transition: transform 0.3s ease-out;
    border-left: none;
    border-top: 1px solid var(--color-border);
    border-radius: 16px 16px 0 0;
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.1);
  }

  .notary-prospection-layout__panel-column[data-notary-prospection-sheet-height-value="half"] {
    transform: translateY(50vh);
  }

  .notary-prospection-layout__panel-column[data-notary-prospection-sheet-height-value="full"] {
    transform: translateY(10vh);
  }
}


/* notary/prospection/map_container.css */
.notary-prospection-map-container {
  --isochrone-fill-color:     var(--color-violet-500);
  --isochrone-fill-opacity:   0.15;
  --isochrone-stroke-color:   var(--color-violet-600);
  --isochrone-stroke-weight:  2;
  --isochrone-stroke-opacity: 0.8;

  flex: 1;
  display: flex;
  position: relative;
  overflow: hidden;
}

.notary-prospection-map-container__map {
  flex: 1;
  width: 100%;
  height: 100%;
  background-color: var(--color-background);
  isolation: isolate;
}

.notary-prospection-map-container__loader {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-surface);
  opacity: 0.9;
  z-index: var(--z-raised);
  pointer-events: none;
}

.notary-prospection-map-container__loader[hidden] {
  display: none;
}

.prospection-marker {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 2px solid #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

.prospection-marker--dvf {
  background-color: var(--color-brand);
}

.prospection-marker--property {
  background-color: var(--color-warning);
}

.prospection-marker--active {
  animation: prospection-marker-pulse 1.4s ease-out infinite;
}

@keyframes prospection-marker-pulse {
  0% {
    box-shadow: 0 0 0 0 color-mix(in srgb, var(--color-brand) 40%, transparent);
  }
  100% {
    box-shadow: 0 0 0 16px transparent;
  }
}

/* DVF stack marker — represents N≥2 transactions on the same physical asset
   (same coords + same property_type + same surface).
   Same base visual as .prospection-marker--dvf, with a small +N badge overlay. */

.prospection-marker--dvf-stack {
  position: relative;
  overflow: visible;
}

.prospection-marker__stack-badge {
  position: absolute;
  top: -6px;
  right: -8px;
  min-width: 14px;
  height: 14px;
  padding: 0 3px;
  border: 1px solid var(--color-surface);
  border-radius: var(--radius-full);
  font-size: 9px;
  font-weight: var(--font-weight-bold);
  line-height: 14px;
  text-align: center;
  white-space: nowrap;
  color: var(--color-surface);
  background: var(--color-text);
  pointer-events: none;
}

/* Aggregate markers — commune (zoom 11) */

.prospection-marker--aggregate {
  width: auto;
  height: auto;
  background-color: var(--color-brand);
  cursor: pointer;
  transition: transform var(--duration-fast) var(--easing-default);
}

.prospection-marker--aggregate:hover {
  transform: scale(1.05);
}

.prospection-marker__bubble {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-bold);
  line-height: 1;
  color: #fff;
}

/* Aggregate markers — departement (zoom <= 10) */

.prospection-marker--departement {
  width: auto;
  height: auto;
  background-color: var(--color-brand-strong, var(--color-brand));
  cursor: pointer;
  transition: transform var(--duration-fast) var(--easing-default);
  border-width: 3px;
}

.prospection-marker--departement:hover {
  transform: scale(1.05);
}

.prospection-marker--departement .prospection-marker__bubble {
  flex-direction: column;
  gap: 2px;
  padding: 4px;
}

.prospection-marker--departement .prospection-marker__count {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  line-height: 1;
}

.prospection-marker--departement .prospection-marker__sub {
  font-size: 10px;
  font-weight: var(--font-weight-medium);
  line-height: 1;
  opacity: 0.85;
}

/* POI markers (Leaflet divIcon). The class chain `.leaflet-marker-icon.prospection-poi-marker`
 * is required because Leaflet's CSS is loaded AFTER `:app` (CDN tag in member.html.erb),
 * and `.leaflet-marker-icon { display: block }` (spec 0,1,0) would override our
 * `display: grid` at equal specificity. The chain bumps us to (0,2,0) — always wins.
 *
 * Magic values intentional: outer 24×24 is set inline by Leaflet via iconSize.
 * Tokens --shadow-sm (too subtle for map contrast) and --icon-size-sm (16px, too
 * large inside a 24×24 cercle with 2px border) don't drop-in cleanly. */
.leaflet-marker-icon.prospection-poi-marker {
  display: grid;
  place-items: center;
  background: currentColor;
  border: 2px solid currentColor;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgb(0 0 0 / 0.12);
  cursor: pointer;
  line-height: 0;
}

.leaflet-marker-icon.prospection-poi-marker svg.svg {
  display: block;
  width: 14px;
  height: 14px;
  margin: 0;
  fill: var(--color-text-inverted);
}

.prospection-poi-marker--transports       { color: var(--color-blue-500); }
.prospection-poi-marker--ecoles           { color: var(--color-violet-500); }
.prospection-poi-marker--sante            { color: var(--color-red-500); }
.prospection-poi-marker--commerces        { color: var(--color-amber-500); }
.prospection-poi-marker--services_publics { color: var(--color-neutral-500); }
.prospection-poi-marker--culture          { color: var(--color-success); }


/* notary/prospection/panel.css */
.notary-prospection-panel {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  background: var(--color-surface);
  overflow: hidden;
}

.notary-prospection-panel,
.notary-prospection-panel *,
.notary-prospection-panel *::before,
.notary-prospection-panel *::after {
  box-sizing: border-box;
  min-width: 0;
}

.notary-prospection-panel__header {
  position: sticky;
  top: 0;
  z-index: var(--z-sticky);
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid var(--color-border);
  background: var(--color-surface);
}

.notary-prospection-panel__back {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  padding: var(--space-1) var(--space-2);
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  background: transparent;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
  cursor: pointer;
  transition: background var(--duration-fast) var(--easing-default), color var(--duration-fast) var(--easing-default);
}

.notary-prospection-panel__back[hidden] {
  display: none;
}

.notary-prospection-panel__back:hover:not(:disabled) {
  background: var(--color-surface-subtle);
  color: var(--color-text);
}

.notary-prospection-panel__back:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

.notary-prospection-panel__title {
  flex: 1;
  min-width: 0;
  margin: 0;
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.notary-prospection-panel__notifications {
  position: sticky;
  top: var(--space-12);
  z-index: var(--z-sticky);
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding: 0 var(--space-4);
}

.notary-prospection-panel__notifications:empty {
  display: none;
}

.notary-prospection-import-toast {
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-sm);
  background: var(--color-surface-subtle);
  border: 1px solid var(--color-border);
  font-size: var(--font-size-sm);
  color: var(--color-text);
  box-shadow: var(--shadow-sm);
  animation: notary-prospection-toast-in var(--duration-fast) var(--easing-default);
}

@keyframes notary-prospection-toast-in {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

.notary-prospection-panel__active-content {
  flex: 1;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: var(--space-4);
  overflow: hidden auto;
}


/* notary/prospection/panel_dvf_card.css */
.notary-prospection-panel-dvf-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding: var(--space-3);
  border-radius: var(--radius-sm);
  background: var(--color-surface-subtle, var(--color-surface));
  cursor: pointer;
  transition: background-color var(--duration-fast) var(--easing-default);
}

.notary-prospection-panel-dvf-card:hover {
  background: var(--color-surface-hover, var(--color-surface-subtle));
}

.notary-prospection-panel-dvf-card:focus-visible {
  outline: none;
  box-shadow: inset 0 0 0 2px var(--color-brand);
}

.notary-prospection-panel-dvf-card__row-top {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: var(--font-size-base);
}

.notary-prospection-panel-dvf-card__date {
  color: var(--color-text);
  font-weight: var(--font-weight-medium);
}

.notary-prospection-panel-dvf-card__price {
  color: var(--color-text);
  font-weight: var(--font-weight-semibold);
  font-variant-numeric: tabular-nums;
}

.notary-prospection-panel-dvf-card__row-meta {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.notary-prospection-panel-dvf-card__row-meta [data-fill="type"] {
  text-transform: capitalize;
}


/* notary/prospection/panel_dvf_detail.css */
.notary-prospection-panel-dvf-detail__subheading {
  margin: 0 0 var(--space-2);
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.notary-prospection-panel-dvf-detail__subline {
  margin: var(--space-1) 0 var(--space-4);
  font-size: var(--font-size-base);
  color: var(--color-text-subtle);
}

.notary-prospection-panel-dvf-detail__details {
  border-top: 1px solid var(--color-border);
  padding-top: var(--space-4);
  margin-top: var(--space-4);
}

.notary-prospection-panel-dvf-detail__row {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-3);
  align-items: start;
  margin: 0 0 var(--space-2);
}

.notary-prospection-panel-dvf-detail__row:last-child {
  margin-bottom: 0;
}

.notary-prospection-panel-dvf-detail__row-emoji {
  font-size: var(--font-size-lg);
  line-height: 1;
}

.notary-prospection-panel-dvf-detail__row-content {
  font-size: var(--font-size-base);
}

.notary-prospection-panel-dvf-detail__row-meta {
  color: var(--color-text-subtle);
  margin-left: var(--space-1);
}

.notary-prospection-panel-dvf-detail__row-rooms:empty {
  display: none;
}


/* notary/prospection/panel_dvf_list.css */
.notary-prospection-panel-dvf-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.notary-prospection-panel-dvf-list__count {
  margin: 0;
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.notary-prospection-panel-dvf-list__location {
  margin: 0;
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.notary-prospection-panel-dvf-list__sort {
  display: flex;
  gap: var(--space-2);
  padding-bottom: var(--space-2);
  border-bottom: 1px solid var(--color-border);
}

.notary-prospection-panel-dvf-list__sort-btn {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  padding: var(--space-1) var(--space-2);
  border: none;
  border-radius: var(--radius-sm);
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  background: transparent;
  cursor: pointer;
}

.notary-prospection-panel-dvf-list__sort-btn:hover {
  background: var(--color-surface-subtle);
}

.notary-prospection-panel-dvf-list__sort-btn--active {
  color: var(--color-text);
  font-weight: var(--font-weight-medium);
}

.notary-prospection-panel-dvf-list__rows {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  max-height: 50vh;
  margin: 0;
  padding: 0;
  list-style: none;
  overflow-y: auto;
  mask-image: linear-gradient(to bottom, black calc(100% - 24px), transparent 100%);
}


/* notary/prospection/panel_property_detail.css */
.notary-prospection-panel-property-detail__subheading {
  margin: 0 0 var(--space-4);
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.notary-prospection-panel-property-detail__price-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  margin-bottom: var(--space-4);
}

.notary-prospection-panel-property-detail__status {
  flex-shrink: 0;
}

.notary-prospection-panel-property-detail__details {
  border-top: 1px solid var(--color-border);
  padding-top: var(--space-4);
  margin-top: var(--space-4);
}

.notary-prospection-panel-property-detail__row {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-3);
  align-items: start;
  margin: 0 0 var(--space-2);
}

.notary-prospection-panel-property-detail__row:last-child {
  margin-bottom: 0;
}

.notary-prospection-panel-property-detail__row-emoji {
  font-size: var(--font-size-lg);
  line-height: 1;
}

.notary-prospection-panel-property-detail__row-content {
  font-size: var(--font-size-base);
}

.notary-prospection-panel-property-detail__owner-info-wrapper {
  margin-top: var(--space-5);
}

.notary-prospection-panel-property-detail__owner-coordinates {
  margin-top: var(--space-3);
}

.notary-prospection-panel-property-detail__cta {
  margin-top: var(--space-5);
}

.notary-prospection-panel-property-detail__archived-banner {
  margin-top: var(--space-4);
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  background: var(--color-warning-surface);
  font-size: var(--font-size-sm);
  color: var(--color-text);
}

.notary-prospection-panel-property-detail__archived-banner[hidden] {
  display: none;
}


/* notary/prospection/panel_stats_zone.css */
.notary-prospection-panel-stats-zone__subheading {
  margin: 0 0 var(--space-4);
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.notary-prospection-panel-stats-zone__section {
  margin-top: var(--space-5);
}

.notary-prospection-panel-stats-zone__section-title {
  margin: 0 0 var(--space-2);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  letter-spacing: var(--letter-spacing-wide);
  color: var(--color-text-subtle);
  text-transform: uppercase;
}

.notary-prospection-panel-stats-zone__medians-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--space-3);
}

@media (max-width: 480px) {
  .notary-prospection-panel-stats-zone__medians-grid {
    grid-template-columns: 1fr;
  }
}

.notary-prospection-panel-stats-zone__empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-6) var(--space-4);
  text-align: center;
}

.notary-prospection-panel-stats-zone__empty-state[hidden] {
  display: none;
}

.notary-prospection-panel-stats-zone__empty-state-heading {
  margin: 0;
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.notary-prospection-panel-stats-zone__empty-state-description {
  margin: 0 0 var(--space-2);
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.notary-prospection-panel-stats-zone__import {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-1);
  padding: 0 0 var(--space-3);
  border-bottom: 1px solid var(--color-border);
  margin-bottom: var(--space-3);
}

.notary-prospection-panel-stats-zone__import-helper {
  margin: 0;
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  text-align: center;
}

.notary-prospection-panel-stats-zone__import-secondary-hint {
  margin: var(--space-1) 0 0;
  font-size: var(--font-size-xs);
  font-style: italic;
  color: var(--color-text-subtle);
  text-align: center;
  opacity: 0.8;
}

.notary-prospection-panel-stats-zone__import .ui-button.is-loading {
  cursor: wait;
  opacity: 0.7;
}

.notary-prospection-panel-stats-zone__import .ui-button.is-loading::after {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-left: var(--space-2);
  vertical-align: -2px;
  border: 2px solid currentColor;
  border-top-color: transparent;
  border-radius: 50%;
  animation: notary-prospection-import-spin 0.6s linear infinite;
}

.notary-prospection-panel-stats-zone__import .ui-button.is-followed {
  cursor: default;
  background: transparent;
  color: var(--color-success, var(--color-brand));
  border-color: var(--color-success, var(--color-brand));
  opacity: 1;
}

@keyframes notary-prospection-import-spin {
  to { transform: rotate(360deg); }
}


/* notary/prospection/period_range.css */
.notary-prospection-period-range {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  flex: 1;
  min-width: 180px;
}

.notary-prospection-period-range__labels {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  font-size: var(--font-size-sm);
  font-variant-numeric: tabular-nums;
  color: var(--color-text-subtle);
}

.notary-prospection-period-range__label {
  font-weight: var(--font-weight-semibold);
  color: var(--color-brand-dark);
}

.notary-prospection-period-range__separator {
  color: var(--color-text-subtle);
}

.notary-prospection-period-range__track {
  position: relative;
  height: 28px;
  display: flex;
  align-items: center;
}

.notary-prospection-period-range__track::before {
  content: "";
  position: absolute;
  inset: 50% 0 auto 0;
  height: 4px;
  margin-top: -2px;
  background: var(--color-border);
  border-radius: var(--radius-full);
  pointer-events: none;
}

.notary-prospection-period-range__thumb {
  position: absolute;
  inset: 0 0 0 0;
  width: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  pointer-events: none;
  -webkit-appearance: none;
  appearance: none;
}

.notary-prospection-period-range__thumb:focus-visible {
  outline: none;
}

.notary-prospection-period-range__thumb::-webkit-slider-runnable-track {
  background: transparent;
  height: 28px;
  border: none;
}

.notary-prospection-period-range__thumb::-moz-range-track {
  background: transparent;
  height: 28px;
  border: none;
}

.notary-prospection-period-range__thumb::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  pointer-events: all;
  width: 18px;
  height: 18px;
  border-radius: var(--radius-full);
  background: var(--color-brand);
  border: 2px solid var(--color-surface);
  box-shadow: 0 0 0 1px var(--color-brand-dark);
  cursor: grab;
  transition: transform 100ms ease;
}

.notary-prospection-period-range__thumb::-webkit-slider-thumb:active {
  cursor: grabbing;
  transform: scale(1.1);
}

.notary-prospection-period-range__thumb::-moz-range-thumb {
  pointer-events: all;
  width: 18px;
  height: 18px;
  border-radius: var(--radius-full);
  background: var(--color-brand);
  border: 2px solid var(--color-surface);
  box-shadow: 0 0 0 1px var(--color-brand-dark);
  cursor: grab;
  transition: transform 100ms ease;
}

.notary-prospection-period-range__thumb::-moz-range-thumb:active {
  cursor: grabbing;
  transform: scale(1.1);
}

.notary-prospection-period-range__thumb:focus-visible::-webkit-slider-thumb {
  box-shadow: 0 0 0 3px var(--color-brand-surface);
}

.notary-prospection-period-range__thumb:focus-visible::-moz-range-thumb {
  box-shadow: 0 0 0 3px var(--color-brand-surface);
}

.notary-prospection-period-range__thumb--min {
  z-index: 1;
}

.notary-prospection-period-range__thumb--max {
  z-index: 2;
}


/* notary/prospection/poi_panel.css */
.notary-prospection-poi-panel {
  --poi-color-transports:       var(--color-blue-500);
  --poi-color-ecoles:           var(--color-violet-500);
  --poi-color-sante:            var(--color-red-500);
  --poi-color-commerces:        var(--color-amber-500);
  --poi-color-services_publics: var(--color-neutral-500);
  --poi-color-culture:          var(--color-success);

  position: absolute;
  /* Offset below the Leaflet zoom control (also top-right, ~60px tall). */
  top: 5rem;
  right: 1rem;
  z-index: var(--z-dropdown);
}

/* ─── Collapsed (default) ─────────────────────────────────────────────── */

.notary-prospection-poi-panel__trigger {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  padding: 0;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-full);
  background: var(--color-surface);
  box-shadow: var(--shadow-lg);
  cursor: pointer;
  color: var(--color-text);
  font-size: var(--text-base);
  transition: background var(--duration-fast) var(--easing-default);
}

.notary-prospection-poi-panel__trigger:hover {
  background: var(--color-surface-subtle);
}

.notary-prospection-poi-panel__trigger:focus-visible {
  outline: none;
  box-shadow: var(--shadow-lg), var(--focus-ring);
}

.notary-prospection-poi-panel__drawer {
  display: none;
}

/* ─── Expanded ───────────────────────────────────────────────────────── */

.notary-prospection-poi-panel--expanded .notary-prospection-poi-panel__trigger {
  display: none;
}

.notary-prospection-poi-panel--expanded .notary-prospection-poi-panel__drawer {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  width: 220px;
  padding: var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  box-shadow: var(--shadow-lg);
}

.notary-prospection-poi-panel__drawer-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
}

.notary-prospection-poi-panel__heading {
  margin: 0;
  font-size: var(--text-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.notary-prospection-poi-panel__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  padding: 0;
  border: 0;
  border-radius: var(--radius-full);
  background: transparent;
  cursor: pointer;
  color: var(--color-text-subtle);
  font-size: var(--text-sm);
  transition: background var(--duration-fast) var(--easing-default);
}

.notary-prospection-poi-panel__close:hover {
  background: var(--color-surface-subtle);
  color: var(--color-text);
}

.notary-prospection-poi-panel__close:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

/* ─── Toggle rows ─────────────────────────────────────────────────────── */

.notary-prospection-poi-panel__row {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding: var(--space-1) 0;
}

.notary-prospection-poi-panel__row-main {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.notary-prospection-poi-panel__error {
  display: none;
  margin: 0;
  padding-left: calc(1.25rem + var(--space-2));
  font-size: var(--text-xs);
  color: var(--color-danger);
}

.notary-prospection-poi-panel__row--error .notary-prospection-poi-panel__error {
  display: block;
}

.notary-prospection-poi-panel__zoom-hint {
  display: none;
  margin: 0;
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-md);
  background: var(--color-surface-subtle);
  font-size: var(--text-xs);
  font-style: italic;
  color: var(--color-text-subtle);
}

.notary-prospection-poi-panel--zoom-blocked .notary-prospection-poi-panel__zoom-hint {
  display: block;
}

.notary-prospection-poi-panel__icon {
  flex-shrink: 0;
  width: 1.25rem;
  height: 1.25rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-base);
}

.notary-prospection-poi-panel__icon[data-category="transports"]       { color: var(--poi-color-transports); }
.notary-prospection-poi-panel__icon[data-category="ecoles"]           { color: var(--poi-color-ecoles); }
.notary-prospection-poi-panel__icon[data-category="sante"]            { color: var(--poi-color-sante); }
.notary-prospection-poi-panel__icon[data-category="commerces"]        { color: var(--poi-color-commerces); }
.notary-prospection-poi-panel__icon[data-category="services_publics"] { color: var(--poi-color-services_publics); }
.notary-prospection-poi-panel__icon[data-category="culture"]          { color: var(--poi-color-culture); }

.notary-prospection-poi-panel__label {
  flex: 1;
  font-size: var(--text-sm);
  color: var(--color-text);
}

.notary-prospection-poi-panel__switch {
  position: relative;
  flex-shrink: 0;
  width: 2rem;
  height: 1.125rem;
  cursor: pointer;
}

.notary-prospection-poi-panel__switch-input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
  margin: 0;
}

.notary-prospection-poi-panel__switch-track {
  position: absolute;
  inset: 0;
  background: var(--color-border);
  border-radius: var(--radius-full);
  transition: background var(--duration-fast) var(--easing-default);
}

.notary-prospection-poi-panel__switch-track::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0.125rem;
  width: 0.875rem;
  height: 0.875rem;
  background: var(--color-surface);
  border-radius: var(--radius-full);
  transform: translateY(-50%);
  transition: left var(--duration-fast) var(--easing-default);
}

.notary-prospection-poi-panel__switch-input:checked + .notary-prospection-poi-panel__switch-track {
  background: var(--color-brand);
}

.notary-prospection-poi-panel__switch-input:checked + .notary-prospection-poi-panel__switch-track::after {
  left: calc(100% - 1rem);
}

.notary-prospection-poi-panel__switch-input:focus-visible + .notary-prospection-poi-panel__switch-track {
  box-shadow: var(--focus-ring);
}

/* ─── Responsive ──────────────────────────────────────────────────────── */

@media (max-width: 767px) {
  .notary-prospection-poi-panel {
    display: none;
  }
}


/* notary/prospection/sheet_handle.css */
.notary-prospection-sheet-handle {
  display: none;
  width: 100%;
  min-height: 32px;
  padding: var(--space-2) 0;
  background: transparent;
  border: none;
  cursor: grab;
  touch-action: none;
}

.notary-prospection-sheet-handle__bar {
  display: block;
  width: 40px;
  height: 4px;
  margin: 0 auto;
  background-color: var(--color-border-strong);
  border-radius: var(--radius-sm);
}

@media (max-width: 767px) {
  .notary-prospection-sheet-handle {
    display: flex;
    align-items: center;
    justify-content: center;
  }
}


/* notary/prospection/sheet_teaser.css */
.notary-prospection-sheet-teaser {
  display: none;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-4);
  width: 100%;
}

.notary-prospection-sheet-teaser__heading {
  margin: 0;
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-neutral-900);
}

.notary-prospection-sheet-teaser__count {
  font-size: var(--font-size-sm);
  color: var(--color-neutral-600);
}

@media (max-width: 767px) {
  .notary-prospection-sheet-teaser {
    display: flex;
  }
}


/* notary/prospection/show.css */
/* Desktop full-bleed page: lock body scroll and let the show occupy exactly
 * viewport - navbar. Mobile (≤1023px) uses a different layout — panel-column
 * becomes a bottom sheet drawer fixed (see layout.css mobile media query) —
 * and shouldn't apply this gate (would double-count navbar via #main padding-top). */
@media (min-width: 1024px) {
  body:has(.notary-prospection-show) {
    overflow: hidden;
  }

  .notary-prospection-show {
    /* Negative margins compensate #view paddings defined in
     * app/assets/stylesheets/application.css:107-116. If those paddings change,
     * this scoped escape will break silently. */
    margin: calc(-1 * var(--space-8));
    margin-bottom: calc(-1 * var(--space-20));
    height: calc(100vh - var(--navbar-height));
  }
}

.notary-prospection-show {
  display: flex;
  flex-direction: column;
  background-color: var(--color-background);
}

.notary-prospection-show .notary-prospection-layout {
  flex: 1;
}


/* notary/prospects/budget_match_indicator.css */
.notary-prospects-budget-match-indicator {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  line-height: 1;
  margin-block-start: var(--space-1);
}

.notary-prospects-budget-match-indicator--match {
  color: var(--color-success);
  background-color: var(--color-success-surface);
}

.notary-prospects-budget-match-indicator--over {
  color: var(--color-danger);
  background-color: var(--color-danger-surface);
}

.notary-prospects-budget-match-indicator--under {
  color: var(--color-warning);
  background-color: var(--color-warning-surface);
}

.notary-prospects-budget-match-indicator .svg {
  width: 0.75rem;
  height: 0.75rem;
  flex-shrink: 0;
}


/* notary/prospects/budget_range_bar.css */
.notary-prospects-budget-range-bar {
  margin-block: var(--space-3);
}

.notary-prospects-budget-range-bar__heading {
  display: block;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  margin-block-end: var(--space-2);
}

/* Labels — above the bar */
.notary-prospects-budget-range-bar__labels {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-block-end: var(--space-2);
}

.notary-prospects-budget-range-bar__label-min,
.notary-prospects-budget-range-bar__label-max {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-bold);
  font-variant-numeric: tabular-nums;
}

.notary-prospects-budget-range-bar__label-min {
  color: var(--color-success);
}

.notary-prospects-budget-range-bar__label-max {
  color: var(--color-danger);
}

/* Markers row — triangles at each end */
.notary-prospects-budget-range-bar__markers {
  display: flex;
  justify-content: space-between;
  margin-block-end: var(--space-1);
}

.notary-prospects-budget-range-bar__triangle {
  display: block;
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
}

.notary-prospects-budget-range-bar__triangle--min {
  border-top: 8px solid var(--color-success);
}

.notary-prospects-budget-range-bar__triangle--max {
  border-top: 8px solid var(--color-danger);
}

/* Track — full width */
.notary-prospects-budget-range-bar__track {
  width: 100%;
  height: 0.5rem;
  border-radius: var(--radius-full);
  background: var(--color-border-light);
  position: relative;
  overflow: hidden;
}

.notary-prospects-budget-range-bar__fill {
  position: absolute;
  inset: 0;
  border-radius: var(--radius-full);
  background: linear-gradient(90deg, var(--color-success), var(--color-warning), var(--color-danger));
}


/* notary/prospects/card.css */
.notary-prospects-card .ui-display-money {
  text-align: left;
}


/* notary/prospects/dpe_badge.css */
.notary-prospects-dpe-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  line-height: 1;
}

.notary-prospects-dpe-badge__label {
  font-weight: var(--font-weight-normal);
  opacity: 0.8;
}

.notary-prospects-dpe-badge__rating {
  font-weight: var(--font-weight-bold);
}

.notary-prospects-dpe-badge--a { color: #1b7d3a; background-color: #e6f4eb; }
.notary-prospects-dpe-badge--b { color: #2e7d32; background-color: #e8f5e9; }
.notary-prospects-dpe-badge--c { color: #558b2f; background-color: #f1f8e9; }
.notary-prospects-dpe-badge--d { color: #f9a825; background-color: #fffde7; }
.notary-prospects-dpe-badge--e { color: #ef6c00; background-color: #fff3e0; }
.notary-prospects-dpe-badge--f { color: #d84315; background-color: #fbe9e7; }
.notary-prospects-dpe-badge--g { color: #b71c1c; background-color: #ffebee; }


/* notary/prospects/list.css */
/* Styles handled by UI::Bases::List — no custom CSS needed */


/* notary/prospects/offers_timeline.css */
.notary-prospects-offers-timeline {
  display: flex;
  flex-direction: column;
  gap: var(--space-0);
  position: relative;
}

.notary-prospects-offers-timeline__entry {
  display: flex;
  gap: var(--space-4);
  padding: var(--space-3) var(--space-3);
  position: relative;
  text-decoration: none;
  color: inherit;
  border-radius: var(--radius-md);
  transition: background-color 0.15s ease;
}

.notary-prospects-offers-timeline__entry:hover {
  background-color: var(--color-surface-subtle);
}

.notary-prospects-offers-timeline__entry:not(:last-child)::before {
  content: "";
  position: absolute;
  left: calc(var(--space-3) + 2px);
  top: calc(100% - var(--space-3));
  width: 2px;
  height: var(--space-3);
  background-color: var(--color-border);
}

.notary-prospects-offers-timeline__dot {
  width: var(--space-6);
  height: var(--space-6);
  border-radius: 50%;
  background-color: var(--color-brand);
  border: 3px solid var(--color-background);
  flex-shrink: 0;
  margin-top: var(--space-1);
  box-shadow: 0 0 0 2px var(--color-border);
}

.notary-prospects-offers-timeline__content {
  flex: 1;
  min-width: 0;
  padding-top: var(--space-1);
}

.notary-prospects-offers-timeline__header {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin-bottom: var(--space-2);
  flex-wrap: wrap;
}

.notary-prospects-offers-timeline__amount {
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  white-space: nowrap;
}

.notary-prospects-offers-timeline__counter-badge {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  white-space: nowrap;
}

.notary-prospects-offers-timeline__subline {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  margin-bottom: var(--space-1);
  line-height: 1.4;
  word-break: break-word;
}

.notary-prospects-offers-timeline__date {
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
  margin-top: var(--space-1);
}

@media (min-width: 768px) {
  .notary-prospects-offers-timeline__header {
    flex-wrap: nowrap;
  }
}


/* notary/prospects/property_interests/index.css */
.notary-prospects-property-interests-index__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-block-end: var(--space-4);
}

.notary-prospects-property-interests-index__title {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
}


/* notary/prospects/property_interests/list.css */
.notary-prospects-property-interests-list {
  width: 100%;
  border-collapse: collapse;
}

.notary-prospects-property-interests-list th {
  text-align: left;
  padding: var(--space-2) var(--space-3);
  font-weight: var(--font-weight-semibold);
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  border-bottom: 1px solid var(--color-border);
}

.notary-prospects-property-interests-list td {
  padding: var(--space-3);
  font-size: var(--font-size-sm);
  border-bottom: 1px solid var(--color-border-light);
}

.notary-prospects-property-interests-list__row:hover {
  background-color: var(--color-surface-hover);
}

.notary-prospects-property-interests-list__select {
  padding: var(--space-1) var(--space-2);
  font-size: var(--font-size-sm);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
}


/* notary/prospects/property_interests/property_card.css */
.notary-prospects-property-interests-property-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--color-surface);
  transition: box-shadow 0.15s;
}

.notary-prospects-property-interests-property-card:hover {
  box-shadow: var(--shadow-md);
}

.notary-prospects-property-interests-property-card__details-wrapper {
  padding: 0 var(--space-4);
  border-top: 1px solid var(--color-border-light);
  overflow: hidden;
}

/* Override fulgore collapsible display:none — use height:0 instead for smooth animation */
.notary-prospects-property-interests-property-card[data-collapsible-collapsed-value="true"] [data-collapsible-target="content"] {
  display: block;
  height: 0;
  overflow: hidden;
}

.notary-prospects-property-interests-property-card__details-wrapper > * {
  padding: var(--space-3) 0;
}


/* notary/prospects/property_interests/property_card_body.css */
.notary-prospects-property-interests-property-card-body {
  padding: var(--space-3) var(--space-4);
}

.notary-prospects-property-interests-property-card-body__title {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  margin: 0 0 var(--space-2) 0;
  line-height: var(--line-height-tight);
}

.notary-prospects-property-interests-property-card-body__figures {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-block-end: var(--space-2);
}

.notary-prospects-property-interests-property-card-body__interest-count {
  font-size: var(--font-size-xs);
  color: var(--color-text-tertiary);
  margin: var(--space-1) 0 0 0;
}


/* notary/prospects/property_interests/property_card_details.css */
/* Excerpt */
.notary-prospects-property-interests-property-card-details__excerpt {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  font-style: italic;
  line-height: var(--line-height-relaxed);
  margin: 0 0 var(--space-3) 0;
  padding-block-end: var(--space-3);
  border-bottom: 1px solid var(--color-border-light);
}

/* Photo gallery */
.notary-prospects-property-interests-property-card-details__gallery {
  display: flex;
  gap: var(--space-2);
  overflow-x: auto;
  padding-block-end: var(--space-3);
  margin-block-end: var(--space-3);
  border-bottom: 1px solid var(--color-border-light);
  scrollbar-width: thin;
}

.notary-prospects-property-interests-property-card-details__thumb {
  flex-shrink: 0;
  width: 7.5rem;
  height: 5rem;
  border-radius: var(--radius-sm);
  overflow: hidden;
}

picture.notary-prospects-property-interests-property-card-details__thumb-img {
  display: contents;
}

img.notary-prospects-property-interests-property-card-details__thumb-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Sections */
.notary-prospects-property-interests-property-card-details__section {
  margin-block-end: var(--space-3);
}

.notary-prospects-property-interests-property-card-details__section:last-child {
  margin-block-end: 0;
}

.notary-prospects-property-interests-property-card-details__section-heading {
  display: block;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  margin-block-end: var(--space-2);
}

/* Highlights — ChoiceCard-style badges */
.notary-prospects-property-interests-property-card-details__highlights {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}

.notary-prospects-property-interests-property-card-details__highlight {
  display: inline-flex;
  align-items: center;
  padding: var(--space-1) var(--space-3);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  background: var(--color-brand-surface);
  border: 1.5px solid var(--color-brand-a10);
  border-radius: var(--radius-lg);
}

/* Specs grid */
.notary-prospects-property-interests-property-card-details__grid {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-1) var(--space-3);
  font-size: var(--font-size-sm);
}

.notary-prospects-property-interests-property-card-details__dt {
  color: var(--color-text-secondary);
  font-weight: var(--font-weight-medium);
}

.notary-prospects-property-interests-property-card-details__dd {
  margin: 0;
}

/* Energy scales */
.notary-prospects-property-interests-property-card-details__scales {
  display: flex;
  gap: var(--space-4);
}

.notary-prospects-property-interests-property-card-details__scale-item {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.notary-prospects-property-interests-property-card-details__scale-label {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-secondary);
}

.notary-prospects-property-interests-property-card-details__scale-bar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2rem;
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-bold);
  color: #fff;
  line-height: 1;
}

/* DPE colors */
.notary-prospects-property-interests-property-card-details__scale-bar--dpe-a { background: #319834; }
.notary-prospects-property-interests-property-card-details__scale-bar--dpe-b { background: #33cc31; }
.notary-prospects-property-interests-property-card-details__scale-bar--dpe-c { background: #cbfc34; color: var(--color-text); }
.notary-prospects-property-interests-property-card-details__scale-bar--dpe-d { background: #fbfe06; color: var(--color-text); }
.notary-prospects-property-interests-property-card-details__scale-bar--dpe-e { background: #fbcc05; color: var(--color-text); }
.notary-prospects-property-interests-property-card-details__scale-bar--dpe-f { background: #fc9935; }
.notary-prospects-property-interests-property-card-details__scale-bar--dpe-g { background: #fc1a10; }

/* GES colors */
.notary-prospects-property-interests-property-card-details__scale-bar--ges-a { background: #f2e6ff; color: var(--color-text); }
.notary-prospects-property-interests-property-card-details__scale-bar--ges-b { background: #dab8f0; color: var(--color-text); }
.notary-prospects-property-interests-property-card-details__scale-bar--ges-c { background: #cc99e6; color: var(--color-text); }
.notary-prospects-property-interests-property-card-details__scale-bar--ges-d { background: #b266d9; }
.notary-prospects-property-interests-property-card-details__scale-bar--ges-e { background: #9933cc; }
.notary-prospects-property-interests-property-card-details__scale-bar--ges-f { background: #7a1fa0; }
.notary-prospects-property-interests-property-card-details__scale-bar--ges-g { background: #5c0d80; }


/* notary/prospects/property_interests/property_card_footer.css */
.notary-prospects-property-interests-property-card-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--space-3) var(--space-4);
  border-top: 1px solid var(--color-border-light);
}

.notary-prospects-property-interests-property-card-footer__toggle {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  background: none;
  border: none;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-secondary);
  cursor: pointer;
  padding: 0;
  line-height: 1;
}

.notary-prospects-property-interests-property-card-footer__toggle:hover {
  color: var(--color-text-primary);
}

.notary-prospects-property-interests-property-card-footer__toggle-label {
  line-height: 1;
}

.notary-prospects-property-interests-property-card-footer__caret {
  display: inline-flex;
  align-items: center;
  transition: transform 0.2s;
  transform: rotate(0deg);
}

.notary-prospects-property-interests-property-card-footer__caret svg {
  width: var(--icon-size-sm);
  height: var(--icon-size-sm);
}

/* Caret points up when expanded */
[data-collapsible-collapsed-value="false"] .notary-prospects-property-interests-property-card-footer__caret {
  transform: rotate(-90deg);
}

.notary-prospects-property-interests-property-card-footer__add-form {
  display: inline;
}


/* notary/prospects/property_interests/property_card_photo.css */
.notary-prospects-property-interests-property-card-photo {
  height: 8rem;
  overflow: hidden;
  background: var(--color-surface-secondary);
}

.notary-prospects-property-interests-property-card-photo--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-text-tertiary);
}

.notary-prospects-property-interests-property-card-photo__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}


/* notary/prospects/property_interests/property_picker.css */
.notary-prospects-property-interests-property-picker__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-3);
  margin-block-end: var(--space-6);
}


/* notary/prospects/property_interests/prospect_summary.css */
.notary-prospects-property-interests-prospect-summary__name {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  margin: 0 0 var(--space-3) 0;
}

/* Contact */
.notary-prospects-property-interests-prospect-summary__contact {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  margin-block-end: var(--space-3);
}

.notary-prospects-property-interests-prospect-summary__contact-item {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--font-size-sm);
  color: var(--color-text);
}

.notary-prospects-property-interests-prospect-summary__contact-icon {
  font-size: var(--font-size-base);
  flex-shrink: 0;
  line-height: 1;
}

/* Budget section label */
.notary-prospects-property-interests-prospect-summary__section-label {
  display: block;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  margin-block-end: var(--space-2);
}

/* Criteria */
.notary-prospects-property-interests-prospect-summary__criteria {
  margin-block-start: var(--space-3);
  padding-block-start: var(--space-3);
  border-top: 1px solid var(--color-border-light);
}

.notary-prospects-property-interests-prospect-summary__criteria-heading {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  margin: 0 0 var(--space-2) 0;
}

.notary-prospects-property-interests-prospect-summary__criteria-pills {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}


/* notary/prospects/property_interests/search_bar.css */
.notary-prospects-property-interests-search-bar {
  margin-block-end: var(--space-4);
}

.notary-prospects-property-interests-search-bar__input {
  width: 100%;
  padding: var(--space-2) var(--space-3);
  font-size: var(--font-size-sm);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
}


/* notary/prospects/property_interests/selected_properties_list.css */
.notary-prospects-property-interests-selected-properties-list {
  margin-block-start: var(--space-4);
  padding-block-start: var(--space-4);
  border-top: 1px solid var(--color-border-light);
}

.notary-prospects-property-interests-selected-properties-list__list {
  list-style: none;
  padding: 0;
  margin: var(--space-2) 0 0 0;
}


/* notary/prospects/property_interests/selected_property_item.css */
.notary-prospects-property-interests-selected-property-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2) 0;
  border-bottom: 1px solid var(--color-border-light);
}

.notary-prospects-property-interests-selected-property-item:last-child {
  border-bottom: none;
}

.notary-prospects-property-interests-selected-property-item__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  flex: 1;
  min-width: 0;
}

.notary-prospects-property-interests-selected-property-item__remove-form {
  display: inline;
  flex-shrink: 0;
}


/* notary/prospects/property_interests/selection_panel.css */
/* SelectionPanel — orchestrates ProspectSummary + SelectedPropertiesList */
/* Styles are in the sub-components */


/* notary/prospects/submission_tokens/index.css */
.notary-prospects-submission-tokens-index {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-prospects-submission-tokens-index__back {
  align-self: flex-start;
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  text-decoration: none;
  transition: color 150ms ease;
}

.notary-prospects-submission-tokens-index__back:hover {
  color: var(--color-text);
}

.notary-prospects-submission-tokens-index__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}

.notary-prospects-submission-tokens-index__title {
  margin: 0;
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  flex: 1;
}

.notary-prospects-submission-tokens-index__highlight {
  padding: var(--space-3);
  background-color: var(--color-success-surface);
  border: 1px solid var(--color-success);
  border-radius: var(--radius-md);
}


/* notary/prospects/submission_tokens/list.css */
.notary-prospects-submission-tokens-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.notary-prospects-submission-tokens-list__row {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding: var(--space-3);
  background-color: var(--color-surface-subtle);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  transition: background-color 150ms ease, border-color 150ms ease;
}

.notary-prospects-submission-tokens-list__row--just-created {
  background-color: var(--color-success-surface);
  border-color: var(--color-success);
}

.notary-prospects-submission-tokens-list__main {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-wrap: wrap;
}

.notary-prospects-submission-tokens-list__property {
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  font-size: var(--font-size-sm);
}

.notary-prospects-submission-tokens-list__date {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

.notary-prospects-submission-tokens-list__consumed {
  display: flex;
  align-items: center;
  gap: var(--space-1);
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

.notary-prospects-submission-tokens-list__offer-link {
  color: var(--color-brand);
  text-decoration: none;
  font-weight: var(--font-weight-medium);
  transition: color 150ms ease;
}

.notary-prospects-submission-tokens-list__offer-link:hover {
  color: var(--color-brand-dark);
  text-decoration: underline;
}

.notary-prospects-submission-tokens-list__details {
  border-top: 1px solid var(--color-border);
  padding-top: var(--space-2);
}

.notary-prospects-submission-tokens-list__details[open] {
  padding-bottom: var(--space-2);
}

.notary-prospects-submission-tokens-list__summary {
  font-size: var(--font-size-sm);
  color: var(--color-brand);
  cursor: pointer;
  font-weight: var(--font-weight-medium);
  user-select: none;
  transition: color 150ms ease;
}

.notary-prospects-submission-tokens-list__summary:hover {
  color: var(--color-brand-dark);
}

.notary-prospects-submission-tokens-list__details[open] .notary-prospects-submission-tokens-list__summary {
  margin-bottom: var(--space-2);
}


/* notary/prospects/submission_tokens/new.css */
.notary-prospects-submission-tokens-new {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  max-width: 600px;
}

.notary-prospects-submission-tokens-new__back {
  align-self: flex-start;
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  text-decoration: none;
  transition: color 150ms ease;
}

.notary-prospects-submission-tokens-new__back:hover {
  color: var(--color-text);
}

.notary-prospects-submission-tokens-new__heading {
  margin: 0;
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.notary-prospects-submission-tokens-new__description {
  margin: 0;
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  line-height: var(--line-height-loose);
}


/* notary/prospects/submission_tokens/property_picker.css */
.notary-prospects-submission-tokens-property-picker {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-prospects-submission-tokens-property-picker__heading {
  margin: 0;
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}

.notary-prospects-submission-tokens-property-picker__single {
  margin: 0;
  padding: var(--space-2);
  font-size: var(--font-size-sm);
  color: var(--color-text);
  background-color: var(--color-surface-subtle);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
}

.notary-prospects-submission-tokens-property-picker__choices {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  border: none;
  padding: 0;
  margin: 0;
}

.notary-prospects-submission-tokens-property-picker__choice {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2);
  font-size: var(--font-size-sm);
  color: var(--color-text);
  background-color: var(--color-surface-subtle);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background-color 150ms ease, border-color 150ms ease;
}

.notary-prospects-submission-tokens-property-picker__choice:hover {
  background-color: var(--color-surface-raised);
  border-color: var(--color-border-strong);
}

.notary-prospects-submission-tokens-property-picker__choice input[type="radio"] {
  margin: 0;
  cursor: pointer;
}

.notary-prospects-submission-tokens-property-picker__choice input[type="radio"]:checked {
  accent-color: var(--color-brand);
}

.notary-prospects-submission-tokens-property-picker__choice span {
  flex: 1;
}

.notary-prospects-submission-tokens-property-picker__actions {
  display: flex;
  gap: var(--space-2);
  padding-top: var(--space-2);
}

.notary-prospects-submission-tokens-property-picker__submit {
  padding: var(--space-2) var(--space-4);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-inverted);
  background-color: var(--color-brand);
  border: 1px solid var(--color-brand);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background-color 150ms ease, border-color 150ms ease;
}

.notary-prospects-submission-tokens-property-picker__submit:hover {
  background-color: var(--color-brand-dark);
  border-color: var(--color-brand-dark);
}

.notary-prospects-submission-tokens-property-picker__submit:active {
  background-color: var(--color-brand-dark);
}


/* notary/prospects/submission_tokens/share_dialog.css */
.notary-prospects-submission-tokens-share-dialog {
  padding: var(--space-3);
  background-color: var(--color-surface-subtle);
  border-radius: var(--radius-md);
  border: 1px solid var(--color-border);
}

.notary-prospects-submission-tokens-share-dialog__header {
  margin-bottom: var(--space-3);
}

.notary-prospects-submission-tokens-share-dialog__title {
  margin: 0;
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}

.notary-prospects-submission-tokens-share-dialog__subtitle {
  margin: var(--space-1) 0 0 0;
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.notary-prospects-submission-tokens-share-dialog__url-row {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  margin-bottom: var(--space-3);
}

.notary-prospects-submission-tokens-share-dialog__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}

.notary-prospects-submission-tokens-share-dialog__input {
  width: 100%;
  padding: var(--space-2);
  font-size: var(--font-size-sm);
  font-family: var(--font-family-mono);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background-color: var(--color-surface);
  color: var(--color-text);
}

.notary-prospects-submission-tokens-share-dialog__input:focus {
  outline: none;
  box-shadow: var(--focus-ring);
}

.notary-prospects-submission-tokens-share-dialog__actions {
  display: flex;
  gap: var(--space-2);
  margin-bottom: var(--space-3);
}

.notary-prospects-submission-tokens-share-dialog__copy {
  padding: var(--space-2) var(--space-3);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-inverted);
  background-color: var(--color-brand);
  border: 1px solid var(--color-brand);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background-color 150ms ease, border-color 150ms ease;
}

.notary-prospects-submission-tokens-share-dialog__copy:hover {
  background-color: var(--color-brand-dark);
  border-color: var(--color-brand-dark);
}

.notary-prospects-submission-tokens-share-dialog__copy:active {
  background-color: var(--color-brand-dark);
}

.notary-prospects-submission-tokens-share-dialog__mailto {
  padding: var(--space-2) var(--space-3);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
  background-color: transparent;
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-sm);
  cursor: pointer;
  text-decoration: none;
  transition: color 150ms ease, border-color 150ms ease;
}

.notary-prospects-submission-tokens-share-dialog__mailto:hover {
  color: var(--color-text);
  border-color: var(--color-border);
}

.notary-prospects-submission-tokens-share-dialog__meta {
  border-top: 1px solid var(--color-border);
  padding-top: var(--space-3);
}

.notary-prospects-submission-tokens-share-dialog__expires {
  margin: 0 0 var(--space-1) 0;
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.notary-prospects-submission-tokens-share-dialog__note {
  margin: 0;
  font-size: var(--font-size-xs);
  color: var(--color-text-disabled);
  font-style: italic;
}


/* notary/unit_kind_label.css */
.notary-unit-kind-label {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
}

.notary-unit-kind-label__icon {
  font-size: var(--text-base);
  line-height: 1;
}

.notary-unit-kind-label__label {
  font-size: var(--text-sm);
  font-weight: var(--font-medium);
  color: var(--color-text);
}


/* public/layouts/application_public.css */
/* Tokens publics — scopés à la classe public-body, ne polluent pas le design system interne */
.public-body {
  --color-public-accent:         #1a3a5c;
  --color-public-accent-light:   #2a5280;
  --color-public-accent-surface: #eef3f8;
  --color-public-accent-text:    #ffffff;
  --public-container-max-width:  860px;
  --public-state-max-width:      480px;

  margin: 0;
  padding: 0;
  font-family: var(--font-family-base);
  color: var(--color-text);
  background: var(--color-surface);
}

.public-main {
  max-width: var(--public-container-max-width);
  margin: 0 auto;
  padding: var(--space-8) var(--space-6) var(--space-12);
  box-sizing: border-box;
}

@media (max-width: 767px) {
  .public-main {
    padding: var(--space-6) var(--space-4) var(--space-12);
  }
}


/* public/layouts/application_public_footer.css */
.public-layouts-application-public-footer {
  border-top: 1px solid var(--color-border);
  padding: var(--space-6);
  text-align: center;
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

.public-layouts-application-public-footer__links {
  display: flex;
  justify-content: center;
  gap: var(--space-4);
  margin-bottom: var(--space-2);
  flex-wrap: wrap;
}

.public-layouts-application-public-footer__link {
  color: var(--color-text-subtle);
  text-decoration: none;
}

.public-layouts-application-public-footer__link:hover {
  text-decoration: underline;
}

.public-layouts-application-public-footer__separator {
  display: inline;
}

.public-layouts-application-public-footer__copy {
  margin: 0 0 var(--space-2);
}

.public-layouts-application-public-footer__note {
  margin: 0;
  max-width: 540px;
  margin-left: auto;
  margin-right: auto;
}


/* public/layouts/application_public_header.css */
.public-layouts-application-public-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-4) var(--space-6);
  border-bottom: 2px solid var(--color-public-accent);
  background: white;
}

.public-layouts-application-public-header__logo-wrapper {
  display: flex;
  align-items: center;
}

.public-layouts-application-public-header__logo {
  height: 24px;
  width: auto;
}

.public-layouts-application-public-header__tagline {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  font-weight: var(--font-weight-medium);
  margin: 0;
}

@media (max-width: 480px) {
  .public-layouts-application-public-header__tagline {
    display: none;
  }
}


/* public/notary/agent_websites/_effects.css */
/* Vitrine effects — utilitaires E&V hybride
 *
 * Classes scopées body.agent-website. Sélecteurs :
 * - .aw-link                          : underline-reveal hover (signature E&V)
 * - .aw-image-zoom                    : container hover zoom subtil sur enfant img
 * - [data-controller~="reveal"]       : état initial pour reveal_controller (Phase 4)
 * - [data-controller~="sticky-header"]: header sticky hide-on-scroll-down (Phase 4)
 *
 * Respecte prefers-reduced-motion.
 */

body.agent-website .aw-link {
  position: relative;
  display: inline-block;
  text-decoration: none;
  color: inherit;
}

body.agent-website .aw-link::after {
  content: "";
  position: absolute;
  inset: auto 0 -2px 0;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: 0 50%;
  transition: transform var(--aw-duration-link) var(--aw-easing-link);
}

body.agent-website .aw-link:hover::after,
body.agent-website .aw-link:focus-visible::after {
  transform: scaleX(1);
}

body.agent-website .aw-image-zoom {
  overflow: hidden;
}

body.agent-website .aw-image-zoom > img,
body.agent-website .aw-image-zoom picture > img {
  transition: transform var(--aw-duration-hover) var(--aw-easing-hover);
  transform-origin: center center;
  will-change: transform;
}

body.agent-website .aw-image-zoom:hover > img,
body.agent-website .aw-image-zoom:hover picture > img {
  transform: scale(var(--aw-card-scale-hover));
}

body.agent-website [data-controller~="reveal"] {
  opacity: 0;
  translate: 0 24px;
  transition: opacity var(--aw-duration-enter) var(--aw-easing-reveal),
              translate var(--aw-duration-enter) var(--aw-easing-reveal);
}

body.agent-website [data-controller~="reveal"].is-visible {
  opacity: 1;
  translate: 0 0;
}

body.agent-website [data-controller~="sticky-header"] {
  position: sticky;
  top: 0;
  z-index: 10;
  background: var(--ivory);
  transition: transform 400ms var(--aw-easing-soft),
              opacity 400ms var(--aw-easing-soft);
}

body.agent-website [data-controller~="sticky-header"].is-hidden {
  transform: translateY(-100%);
  opacity: 0;
}

body.agent-website [data-controller~="parallax"] {
  overflow: hidden;
  position: relative;
}

body.agent-website [data-controller~="parallax"] img {
  min-height: 115%;
}

@media (prefers-reduced-motion: reduce) {
  body.agent-website .aw-link::after,
  body.agent-website .aw-image-zoom > img,
  body.agent-website .aw-image-zoom picture > img,
  body.agent-website [data-controller~="reveal"],
  body.agent-website [data-controller~="sticky-header"] {
    transition: none;
  }

  body.agent-website [data-controller~="reveal"] {
    opacity: 1;
    translate: 0 0;
  }
}


/* public/notary/agent_websites/_tokens.css */
/* Design System V1 le78-immo — tokens scopés vitrine
 * Arbitrages Anne 2026-05-27 : terra 550, typo C (Cormorant + DM Sans).
 * Voir wiki/projects/Termina/design-system-v1-arbitrages.md.
 * Override des tokens fulgore uniquement dans le contexte body.agent-website.
 */

body.agent-website {
  /* Palette terra */
  --terra-300: #E5B89E;
  --terra-500: #C4886C;
  --terra-550: #B47657;
  --terra-600: #A56850;
  --terra-700: #8A5240;

  /* Neutrals ivoire + gris + noir */
  --ivory-soft: #FAF6EE;
  --ivory: #F5EFE3;
  --ivory-dark: #E0D5C0;
  --noir: #1A1714;
  --gris-300: #C8C0B0;
  --gris-500: #8A8478;
  --gris-700: #4F4A40;

  /* Override des tokens fulgore */
  --color-brand: var(--terra-550);
  --color-brand-light: var(--terra-500);
  --color-brand-dark: var(--terra-700);
  --color-brand-surface: var(--ivory-soft);
  --color-text: var(--noir);
  --color-text-subtle: var(--gris-500);
  --color-surface: var(--ivory);
  --color-surface-subtle: var(--ivory-soft);
  --color-border: var(--ivory-dark);

  --font-family-base: "DM Sans", system-ui, sans-serif;
  --font-family-display: "Cormorant Garamond", Georgia, serif;

  /* ── Vitrine layout tokens ─────────────────────────────────────────────── */
  --aw-max-width: 1200px;
  --aw-gutter: clamp(1rem, 4vw, 2.5rem);
  --aw-section-gap: clamp(4rem, 8vw, 8rem);
  --aw-hero-home-h: min(72vh, 680px);

  /* ── Vitrine aspect ratios (calibrés E&V) ──────────────────────────────── */
  --aw-ratio-square: 1;
  --aw-ratio-teaser: 3 / 2;
  --aw-ratio-landscape: 4 / 3;
  --aw-ratio-portrait: 3 / 4;
  --aw-ratio-video: 16 / 9;
  --aw-ratio-widescreen: 21 / 9;

  /* ── Vitrine motion tokens ─────────────────────────────────────────────── */
  --aw-duration-enter: 500ms;
  --aw-duration-hover: 220ms;
  --aw-duration-header: 200ms;
  --aw-duration-link: 300ms;

  /* Easings calibrés (mix audit ui + audit E&V) */
  --aw-easing-reveal: cubic-bezier(0.16, 1, 0.3, 1);
  --aw-easing-hover: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --aw-easing-link: cubic-bezier(0.39, 0.575, 0.565, 1);
  --aw-easing-soft: cubic-bezier(0.3, 0.2, 0.2, 0.8);
  --aw-easing-transform: cubic-bezier(0.42, 0, 0.48, 1);

  /* Hover & parallax magnitudes */
  --aw-card-scale-hover: 1.03;
  --aw-parallax-depth: 0.3;

  /* ── Vitrine radius / shadow / letter-spacing (signature E&V) ──────────── */
  --aw-radius-card: 2px;
  --aw-shadow-s: 0 2px 4px rgba(0, 0, 0, 0.10);
  --aw-shadow-m: 0 4px 12px rgba(0, 0, 0, 0.12);
  --aw-shadow-l: 0 8px 24px rgba(0, 0, 0, 0.16);
  --aw-shadow-xl: 0 16px 40px rgba(0, 0, 0, 0.20);
  --aw-letter-spacing-editorial: 0.03em;

}


/* public/notary/agent_websites/admin_banner.css */
.public-notary-agent-websites-admin-banner {
  position: sticky;
  top: 0;
  z-index: var(--z-raised);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-2) var(--space-4);
  background: var(--color-surface-raised);
  border-bottom: 1px solid var(--color-border);
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.public-notary-agent-websites-admin-banner__label {
  font-weight: var(--font-weight-medium);
}

.public-notary-agent-websites-admin-banner__link {
  color: var(--color-brand);
  font-weight: var(--font-weight-medium);
  text-decoration: none;
}

.public-notary-agent-websites-admin-banner__link:hover {
  text-decoration: underline;
}


/* public/notary/agent_websites/footer.css */
/* Footer — DS V1 le78-immo : full-width band, 2-column inner layout
 * Phase 5 — palette noire E&V (fond noir, texte ivory + gris clair). */

.public-notary-agent-websites-footer {
  background: var(--noir);
  border-top: 1px solid var(--gris-700);
  color: var(--gris-300);
  width: 100%;
  margin-top: 48px;
}

.public-notary-agent-websites-footer__inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 56px 32px 28px;
  font-family: var(--font-family-base);
  color: var(--gris-300);
}

/* ── 2-column grid ───────────────────────────────────────────────── */

.public-notary-agent-websites-footer__columns {
  display: grid;
  grid-template-columns: 1fr;
  gap: 40px;
  margin-bottom: 32px;
}

@media (min-width: 768px) {
  .public-notary-agent-websites-footer__columns {
    grid-template-columns: 1fr 1.6fr;
    gap: 64px;
  }
}

.public-notary-agent-websites-footer__column-heading {
  margin: 0 0 16px;
  font-size: 11px;
  font-weight: 600;
  color: var(--ivory-dark);
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

/* ── About column (left) ─────────────────────────────────────────── */

.public-notary-agent-websites-footer__about-name {
  margin: 0;
  font-family: var(--font-family-display);
  font-size: 22px;
  font-weight: 500;
  color: var(--ivory);
  letter-spacing: var(--aw-letter-spacing-editorial);
}

.public-notary-agent-websites-footer__about-pro-title {
  margin: 4px 0 0;
  font-size: 12px;
  color: var(--ivory-dark);
}

.public-notary-agent-websites-footer__about-zones {
  margin: 16px 0 0;
  font-size: 12px;
  line-height: 1.5;
  color: var(--gris-300);
  white-space: pre-line;
}

/* ── Legal column (right) ────────────────────────────────────────── */

.public-notary-agent-websites-footer__legal-line {
  margin: 0 0 6px;
  font-size: 11px;
  line-height: 1.6;
  color: var(--gris-300);
}

.public-notary-agent-websites-footer__legal-fees {
  margin-top: 16px;
}

.public-notary-agent-websites-footer__legal-fees-heading {
  margin: 0 0 6px;
  font-size: 11px;
  font-weight: 600;
  color: var(--ivory-dark);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.public-notary-agent-websites-footer__legal-fees-text {
  margin: 0;
  font-family: var(--font-family-base);
  font-size: 11px;
  line-height: 1.6;
  white-space: pre-wrap;
  background: transparent;
  color: var(--gris-300);
}

/* ── Powered by (full-width separator) ───────────────────────────── */

.public-notary-agent-websites-footer__powered-by {
  padding-top: 20px;
  border-top: 1px solid var(--gris-700);
  text-align: center;
  font-size: 11px;
  color: var(--gris-300);
}

.public-notary-agent-websites-footer__powered-by-link {
  color: var(--gris-300);
  text-decoration: none;
  opacity: 0.7;
  transition: opacity var(--aw-duration-hover) var(--aw-easing-soft),
              color var(--aw-duration-hover) var(--aw-easing-soft);
}

.public-notary-agent-websites-footer__powered-by-link:hover {
  opacity: 1;
  color: var(--terra-300);
}


/* public/notary/agent_websites/home.css */
/* Home — DS V1 le78-immo (root container uniquement) */

.public-notary-agent-websites-home {
  font-family: var(--font-family-base);
  color: var(--noir);
  background: var(--ivory);
  min-height: 100vh;
}


/* public/notary/agent_websites/logo.css */
/* Logo wordmark "78-immo.fr" + silhouette SVG — DS V1 placeholder */

.public-notary-agent-websites-logo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--noir);
  text-decoration: none;
}

.public-notary-agent-websites-logo__img {
  display: block;
  max-height: 56px;
  width: auto;
  object-fit: contain;
}

.public-notary-agent-websites-logo__silhouette {
  display: block;
  width: 38px;
  height: 27px;
  color: var(--noir);
  flex-shrink: 0;
}

.public-notary-agent-websites-logo__wordmark {
  font-family: "DM Sans", system-ui, sans-serif;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: var(--noir);
  white-space: nowrap;
}

.public-notary-agent-websites-logo__wordmark-text {
  color: inherit;
}

.public-notary-agent-websites-logo__wordmark-dot {
  color: var(--terra-550);
  font-weight: 700;
}


/* public/notary/agent_websites/property_card.css */
/* Card annonce — DS V1 le78-immo (RIPTOR harmonisation Index/Show)
 * Blanc + shadow E&V offsets verticaux + radius 20px + title serif + hover.
 */

.public-notary-agent-websites-property-card {
  display: block;
  text-decoration: none;
  color: inherit;
  background-color: #ffffff;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: var(--aw-shadow-m);
  transition: box-shadow var(--aw-duration-hover) var(--aw-easing-soft),
              transform var(--aw-duration-hover) var(--aw-easing-soft);
}

.public-notary-agent-websites-property-card:hover {
  box-shadow: var(--aw-shadow-l);
  transform: translateY(-2px);
}

.public-notary-agent-websites-property-card__cover-wrapper {
  position: relative;
  display: block;
}

.public-notary-agent-websites-property-card__cover,
.public-notary-agent-websites-property-card__cover-placeholder {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  background-color: var(--noir);
  overflow: hidden;
}

.public-notary-agent-websites-property-card__cover-stage {
  position: absolute;
  top: var(--space-3);
  left: var(--space-3);
  z-index: 2;
}

.public-notary-agent-websites-property-card__cover-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--aw-duration-hover) var(--aw-easing-hover);
  will-change: transform;
}

.public-notary-agent-websites-property-card:hover .public-notary-agent-websites-property-card__cover-img {
  transform: scale(var(--aw-card-scale-hover));
}

.public-notary-agent-websites-property-card__body {
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.public-notary-agent-websites-property-card__price {
  margin: 0;
  font-family: var(--font-family-display);
  font-size: 28px;
  font-weight: 500;
  letter-spacing: -0.4px;
  color: var(--noir);
  line-height: 1.1;
}

.public-notary-agent-websites-property-card__title {
  margin: 0;
  font-family: var(--font-family-display);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: var(--aw-letter-spacing-editorial);
  color: var(--noir);
  line-height: 1.2;
  text-wrap: pretty;
}

.public-notary-agent-websites-property-card__address {
  margin: 0;
  font-family: var(--font-family-base);
  font-size: 13px;
  font-weight: 400;
  color: var(--gris-500);
  line-height: 1.4;
}


/* public/notary/agent_websites/property_show.css */
/* PropertyShow — DS V1 le78-immo (root container + page-content layout) */

.public-notary-agent-websites-property-show {
  display: flex;
  flex-direction: column;
}

.public-notary-agent-websites-property-show__page-content {
  display: flex;
  flex-direction: column;
  gap: 48px;
  max-width: 1100px;
  width: 100%;
  margin: 0 auto;
  padding: 24px 16px;
}

@media (min-width: 768px) {
  .public-notary-agent-websites-property-show__page-content {
    padding: 40px 24px;
    gap: 64px;
  }
}


/* public/notary/agent_websites/sections/agent_contact_section.css */
/* AgentContactSection — design canonique extrait de Home (DRY Phase 2)
 * RIPTOR fix : layout split éditorial E&V (photo / texte), padding section gap,
 * letter-spacing signature, suppression border-top brutal.
 */

.public-notary-agent-websites-sections-agent-contact-section {
  background: var(--ivory-soft);
  padding: var(--aw-section-gap) var(--aw-gutter);
  scroll-margin-top: 24px;
}

.public-notary-agent-websites-sections-agent-contact-section__heading {
  max-width: 900px;
  margin: 0 auto 48px;
  font-family: var(--font-family-display);
  font-size: 36px;
  font-weight: 500;
  letter-spacing: var(--aw-letter-spacing-editorial);
  line-height: 1.1;
  text-align: center;
  color: var(--noir);
}

.public-notary-agent-websites-sections-agent-contact-section__body {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 32px;
  justify-items: center;
  text-align: center;
}

.public-notary-agent-websites-sections-agent-contact-section__photo {
  flex-shrink: 0;
  width: 200px;
  height: 200px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--ivory-dark);
}

.public-notary-agent-websites-sections-agent-contact-section__photo-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.public-notary-agent-websites-sections-agent-contact-section__text {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 540px;
}

.public-notary-agent-websites-sections-agent-contact-section__name {
  margin: 0;
  font-family: var(--font-family-display);
  font-size: 32px;
  font-weight: 500;
  letter-spacing: var(--aw-letter-spacing-editorial);
  color: var(--noir);
  line-height: 1.1;
}

.public-notary-agent-websites-sections-agent-contact-section__title {
  margin: 0;
  font-family: var(--font-family-base);
  font-size: 12px;
  color: var(--gris-500);
  text-transform: uppercase;
  letter-spacing: 0.16em;
}

.public-notary-agent-websites-sections-agent-contact-section__bio {
  margin: 12px 0 0;
  font-family: var(--font-family-base);
  font-size: 14px;
  line-height: 1.7;
  color: var(--gris-700);
}

.public-notary-agent-websites-sections-agent-contact-section__phone {
  margin: 16px 0 0;
}

.public-notary-agent-websites-sections-agent-contact-section__phone-link {
  display: inline-block;
  padding: 12px 26px;
  background: var(--noir);
  color: var(--ivory);
  text-decoration: none;
  border-radius: 999px;
  font-family: var(--font-family-base);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  transition: background-color var(--aw-duration-hover) var(--aw-easing-soft);
}

.public-notary-agent-websites-sections-agent-contact-section__phone-link:hover {
  background: var(--terra-700);
}

@media (min-width: 768px) {
  .public-notary-agent-websites-sections-agent-contact-section__body {
    grid-template-columns: auto 1fr;
    gap: 80px;
    align-items: center;
    justify-items: start;
    text-align: left;
  }

  .public-notary-agent-websites-sections-agent-contact-section__text {
    max-width: 600px;
  }
}


/* public/notary/agent_websites/sections/hero_home_section.css */
/* HeroHomeSection — grille hero (3 cards max, premières publications) */

.public-notary-agent-websites-sections-hero-home-section {
  max-width: var(--aw-max-width);
  margin: 0 auto;
  padding: 48px var(--aw-gutter) 32px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}

@media (min-width: 640px) {
  .public-notary-agent-websites-sections-hero-home-section {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 960px) {
  .public-notary-agent-websites-sections-hero-home-section {
    grid-template-columns: repeat(3, 1fr);
  }
}


/* public/notary/agent_websites/sections/property_description_section.css */
/* PropertyDescriptionSection — bloc description longue du bien */

.public-notary-agent-websites-sections-property-description-section {
  background-color: var(--ivory-soft);
  border: 1px solid var(--ivory-dark);
  border-radius: 20px;
  padding: 32px 28px;
}

.public-notary-agent-websites-sections-property-description-section__heading {
  margin: 0 0 16px;
  font-family: var(--font-family-display);
  font-size: 28px;
  font-weight: 500;
  letter-spacing: -0.3px;
  color: var(--noir);
}

.public-notary-agent-websites-sections-property-description-section__body {
  margin: 0;
  font-family: var(--font-family-base);
  font-size: 15px;
  line-height: 1.7;
  color: var(--gris-700);
  white-space: pre-line;
  text-wrap: pretty;
}


/* public/notary/agent_websites/sections/property_gallery_section.css */
/* PropertyGallerySection — grille photos secondaires (drop first cover) */

.public-notary-agent-websites-sections-property-gallery-section {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

.public-notary-agent-websites-sections-property-gallery-section__item {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: 14px;
  background-color: var(--ivory-soft);
}

.public-notary-agent-websites-sections-property-gallery-section__item[data-controller~="image-viewer"] {
  cursor: zoom-in;
}

.public-notary-agent-websites-sections-property-gallery-section__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (min-width: 768px) {
  .public-notary-agent-websites-sections-property-gallery-section {
    grid-template-columns: repeat(2, 1fr);
  }
}


/* public/notary/agent_websites/sections/property_grid_section.css */
/* PropertyGridSection — grille N publications (suite après le hero) */

.public-notary-agent-websites-sections-property-grid-section {
  max-width: var(--aw-max-width);
  margin: 0 auto;
  padding: 0 var(--aw-gutter) 64px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}

@media (min-width: 640px) {
  .public-notary-agent-websites-sections-property-grid-section {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 960px) {
  .public-notary-agent-websites-sections-property-grid-section {
    grid-template-columns: repeat(3, 1fr);
  }
}


/* public/notary/agent_websites/sections/property_hero_section.css */
/* PropertyHeroSection — hero PropertyShow : cover gauche + info droite */

.public-notary-agent-websites-sections-property-hero-section {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  min-height: 380px;
  background-color: var(--ivory-soft);
  border: 1px solid var(--ivory-dark);
  border-radius: 20px;
  overflow: hidden;
}

.public-notary-agent-websites-sections-property-hero-section__cover,
.public-notary-agent-websites-sections-property-hero-section__cover-placeholder {
  display: block;
  width: 100%;
  min-height: 280px;
  background-color: var(--noir);
  overflow: hidden;
}

.public-notary-agent-websites-sections-property-hero-section__cover-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.public-notary-agent-websites-sections-property-hero-section__cover[data-controller~="image-viewer"] {
  cursor: zoom-in;
}

.public-notary-agent-websites-sections-property-hero-section__info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 32px 28px;
  gap: 0;
}

.public-notary-agent-websites-sections-property-hero-section__stage {
  margin: 0 0 12px;
}

.public-notary-agent-websites-sections-property-hero-section__stage-fallback {
  font-family: var(--font-family-base);
  font-size: 11px;
  font-weight: 600;
  color: var(--terra-600);
  text-transform: uppercase;
  letter-spacing: 0.16em;
}

.public-notary-agent-websites-sections-property-hero-section__title {
  margin: 0 0 8px;
  font-family: var(--font-family-display);
  font-size: 36px;
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: -0.6px;
  color: var(--noir);
  text-wrap: pretty;
}

.public-notary-agent-websites-sections-property-hero-section__accroche {
  margin: 0 0 16px;
  font-family: var(--font-family-display);
  font-size: 17px;
  font-style: italic;
  font-weight: 400;
  line-height: 1.4;
  color: var(--gris-700);
  text-wrap: pretty;
}

.public-notary-agent-websites-sections-property-hero-section__location {
  margin: 0 0 28px;
  font-family: var(--font-family-base);
  font-size: 14px;
  color: var(--gris-500);
}

.public-notary-agent-websites-sections-property-hero-section__price {
  margin: 0 0 28px;
  font-family: var(--font-family-display);
  font-size: 32px;
  font-weight: 500;
  letter-spacing: -0.4px;
  color: var(--noir);
}

.public-notary-agent-websites-sections-property-hero-section__cta {
  align-self: flex-start;
  display: inline-block;
  padding: 10px 18px;
  background-color: var(--terra-550);
  color: #ffffff;
  font-family: var(--font-family-base);
  font-size: 13px;
  font-weight: 600;
  border-radius: 8px;
  text-decoration: none;
  transition: background-color var(--aw-duration-hover) var(--aw-easing-soft);
}

.public-notary-agent-websites-sections-property-hero-section__cta:hover {
  background-color: var(--terra-700);
}

@media (min-width: 768px) {
  .public-notary-agent-websites-sections-property-hero-section {
    grid-template-columns: 1.4fr 1fr;
  }

  .public-notary-agent-websites-sections-property-hero-section__cover,
  .public-notary-agent-websites-sections-property-hero-section__cover-placeholder {
    min-height: 100%;
  }

  .public-notary-agent-websites-sections-property-hero-section__info {
    padding: 48px 44px;
  }

  .public-notary-agent-websites-sections-property-hero-section__title {
    font-size: 42px;
    letter-spacing: -0.8px;
  }

  .public-notary-agent-websites-sections-property-hero-section__price {
    font-size: 38px;
    letter-spacing: -0.5px;
  }
}


/* public/notary/agent_websites/sections/site_header_section.css */
/* SiteHeaderSection — 2 variantes via back_link_path :
 * --with-contact-cta (default) | --with-back-link
 *
 * RIPTOR fix : full-width band + inner max-width wrapper, padding uniforme,
 * transition slide-down doux piloté dans _effects.css (sticky-header).
 */

.public-notary-agent-websites-sections-site-header-section {
  width: 100%;
  background: var(--ivory);
  border-bottom: 1px solid var(--ivory-dark);
}

.public-notary-agent-websites-sections-site-header-section__inner {
  max-width: var(--aw-max-width);
  margin: 0 auto;
  padding: 20px var(--aw-gutter);
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
}

.public-notary-agent-websites-sections-site-header-section--with-back-link .public-notary-agent-websites-sections-site-header-section__inner {
  justify-content: space-between;
}

.public-notary-agent-websites-sections-site-header-section__text {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 160px;
}

.public-notary-agent-websites-sections-site-header-section__site-name {
  margin: 0;
  font-family: var(--font-family-base);
  font-size: 15px;
  font-weight: 500;
  color: var(--noir);
  letter-spacing: 0;
}

.public-notary-agent-websites-sections-site-header-section__tagline {
  margin: 0;
  font-family: var(--font-family-base);
  font-size: 13px;
  color: var(--gris-500);
  line-height: 1.4;
}

.public-notary-agent-websites-sections-site-header-section__contact-anchor {
  padding: 10px 18px;
  background: var(--terra-550);
  color: #ffffff;
  text-decoration: none;
  border-radius: 999px;
  font-family: var(--font-family-base);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.03em;
  transition: background-color var(--aw-duration-hover) var(--aw-easing-soft);
}

.public-notary-agent-websites-sections-site-header-section__contact-anchor:hover {
  background: var(--terra-700);
}

.public-notary-agent-websites-sections-site-header-section__back-link {
  font-family: var(--font-family-base);
  font-size: 14px;
  font-weight: 500;
  color: var(--terra-700);
  text-decoration: none;
  transition: color var(--aw-duration-hover) var(--aw-easing-soft);
}

.public-notary-agent-websites-sections-site-header-section__back-link:hover {
  text-decoration: underline;
}


/* public/notary/agent_websites/under_construction.css */
.public-notary-agent-websites-under-construction {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  font-family: var(--font-family-display);
  color: var(--color-text);
  background: var(--color-surface);
}

.public-notary-agent-websites-under-construction__main {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: var(--space-16) var(--space-6);
  max-width: 640px;
  margin: 0 auto;
  gap: var(--space-6);
}

.public-notary-agent-websites-under-construction__site-name {
  font-size: var(--font-size-4xl);
  font-weight: var(--font-weight-bold);
  margin: 0;
  letter-spacing: -0.02em;
}

.public-notary-agent-websites-under-construction__message {
  font-size: var(--font-size-lg);
  color: var(--color-text-subtle);
  line-height: 1.6;
  margin: 0;
  max-width: 480px;
}

.public-notary-agent-websites-under-construction__contact-phone {
  margin: var(--space-2) 0 0;
  font-size: var(--font-size-base);
}

.public-notary-agent-websites-under-construction__contact-phone-link {
  color: var(--color-text);
  text-decoration: none;
  font-weight: var(--font-weight-medium);
  padding: var(--space-2) var(--space-4);
  border: 1px solid var(--color-neutral-300, #d4d4d8);
  border-radius: var(--radius-full);
  transition: background 0.15s ease;
  display: inline-block;
}

.public-notary-agent-websites-under-construction__contact-phone-link:hover {
  background: var(--color-surface-subtle);
}


/* public/notary/offers/agent_avatar.css */
.public-notary-offers-agent-avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background-color: var(--color-accent-surface, #e8f0ff);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  color: var(--color-accent);
  flex-shrink: 0;
}


/* public/notary/offers/already_submitted.css */
.public-notary-offers-already-submitted--pending .public-notary-offers-base-state-page__icon {
  color: var(--color-warning, #b8860b);
}

.public-notary-offers-already-submitted--accepted .public-notary-offers-base-state-page__icon {
  color: var(--color-success, #2d7c4a);
}

.public-notary-offers-already-submitted--refused .public-notary-offers-base-state-page__icon {
  color: var(--color-danger, #c41d1d);
}

.public-notary-offers-already-submitted--countered .public-notary-offers-base-state-page__icon {
  color: var(--color-info, #0066cc);
}

.public-notary-offers-already-submitted--unknown .public-notary-offers-base-state-page__icon {
  color: var(--color-text-subtle);
}

.public-notary-offers-already-submitted .public-notary-offers-base-state-page__heading {
  margin: 0 0 var(--space-2);
}

.public-notary-offers-already-submitted__description {
  font-size: var(--font-size-base);
  line-height: 1.5;
  color: var(--color-text-subtle);
  margin: 0 0 var(--space-6);
  text-align: center;
}

.public-notary-offers-already-submitted__agent {
  margin: var(--space-6) 0 0;
  padding: var(--space-4) 0;
  border-top: 1px solid var(--color-border);
}

.public-notary-offers-already-submitted__agent-heading {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  margin: 0 0 var(--space-4);
  color: var(--color-text);
}

.public-notary-offers-already-submitted__agent-row {
  display: flex;
  gap: var(--space-3);
  align-items: flex-start;
}

.public-notary-offers-already-submitted__agent-info {
  flex: 1;
}

.public-notary-offers-already-submitted__agent-name {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin-bottom: var(--space-1);
}

.public-notary-offers-already-submitted__agent-role {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.public-notary-offers-already-submitted__cta-note {
  margin: var(--space-6) 0 0;
  padding: var(--space-4);
  background-color: var(--color-surface-subtle);
  border-radius: var(--radius-md);
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  text-align: center;
}


/* public/notary/offers/base_state_page.css */
.public-notary-offers-base-state-page {
  max-width: var(--public-state-max-width);
  margin: var(--space-12) auto;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-8) var(--space-6);
}

.public-notary-offers-base-state-page__icon {
  font-size: 2.5rem;
  margin-bottom: var(--space-3);
  text-align: center;
}

.public-notary-offers-base-state-page__heading {
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-semibold);
  margin: 0 0 var(--space-3);
  color: var(--color-text);
  text-align: center;
}


/* public/notary/offers/offer_recap.css */
.public-notary-offers-offer-recap {
  margin: var(--space-6) 0;
  padding: var(--space-4) 0;
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
}

.public-notary-offers-offer-recap__heading {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  margin: 0 0 var(--space-4);
  color: var(--color-text);
}

.public-notary-offers-offer-recap__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.public-notary-offers-offer-recap__pair {
  display: flex;
  flex-direction: column;
  margin-bottom: var(--space-3);
}

.public-notary-offers-offer-recap__pair:last-child {
  margin-bottom: 0;
}

.public-notary-offers-offer-recap__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
  margin: 0 0 var(--space-1);
}

.public-notary-offers-offer-recap__value {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}


/* public/notary/offers/submission_confirmation.css */
.public-notary-offers-submission-confirmation .public-notary-offers-base-state-page__icon {
  color: var(--color-success, #2d7c4a);
}

.public-notary-offers-submission-confirmation .public-notary-offers-base-state-page__heading {
  margin: 0 0 var(--space-6);
}

.public-notary-offers-submission-confirmation__followup {
  margin: var(--space-6) 0 0;
  padding: var(--space-4) 0;
  border-top: 1px solid var(--color-border);
}

.public-notary-offers-submission-confirmation__followup-heading {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  margin: 0 0 var(--space-4);
  color: var(--color-text);
}

.public-notary-offers-submission-confirmation__followup-row {
  display: flex;
  gap: var(--space-3);
  align-items: flex-start;
}

.public-notary-offers-submission-confirmation__followup-text {
  font-size: var(--font-size-base);
  line-height: 1.5;
  color: var(--color-text);
  flex: 1;
}

.public-notary-offers-submission-confirmation__close-note {
  margin: var(--space-6) 0 0;
  padding: var(--space-4);
  background-color: var(--color-surface-subtle);
  border-radius: var(--radius-md);
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  text-align: center;
}


/* public/notary/offers/token_expired.css */
.public-notary-offers-token-expired .public-notary-offers-base-state-page__icon {
  color: var(--color-warning, #b8860b);
}

.public-notary-offers-token-expired__description {
  font-size: var(--font-size-base);
  line-height: 1.5;
  color: var(--color-text-subtle);
  margin: 0;
  text-align: center;
}


/* public/notary/offers/token_invalid.css */
.public-notary-offers-token-invalid .public-notary-offers-base-state-page__icon {
  color: var(--color-text-subtle);
}

.public-notary-offers-token-invalid__description {
  font-size: var(--font-size-base);
  line-height: 1.5;
  color: var(--color-text-subtle);
  margin: 0;
  text-align: center;
}


/* public/notary/properties/description.css */
.public-notary-properties-description {
  padding: var(--space-6) 0;
  border-bottom: 1px solid var(--color-border);
}

.public-notary-properties-description__headline {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0 0 var(--space-4) 0;
}

.public-notary-properties-description__body {
  font-size: var(--font-size-base);
  line-height: 1.6;
  color: var(--color-text);
  margin: 0;
}

.public-notary-properties-description__body p {
  margin: 0 0 var(--space-3) 0;
}

.public-notary-properties-description__body p:last-child {
  margin-bottom: 0;
}


/* public/notary/properties/gallery.css */
.public-notary-properties-gallery {
  padding: var(--space-6) 0;
  border-bottom: 1px solid var(--color-border);
}

.public-notary-properties-gallery__heading {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0 0 var(--space-4) 0;
}

.public-notary-properties-gallery__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-3);
}

@media (min-width: 640px) {
  .public-notary-properties-gallery__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.public-notary-properties-gallery__tile {
  aspect-ratio: 1;
  border-radius: var(--radius-md);
  cursor: zoom-in;
}

.public-notary-properties-gallery__tile-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: var(--radius-md);
}

picture.public-notary-properties-gallery__tile-img {
  display: contents;
}

.public-notary-properties-gallery__tile--placeholder {
  aspect-ratio: 1;
  background-color: var(--color-surface-raised);
  border-radius: var(--radius-md);
  cursor: default;
}


/* public/notary/properties/hero_photo.css */
.public-notary-properties-hero-photo {
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: var(--radius-lg);
}

.public-notary-properties-hero-photo__image {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  /* Animated shimmer placeholder visible while the image data is downloading.
     Once the image is rendered, it covers the background entirely. */
  background: linear-gradient(
    90deg,
    var(--color-surface-raised) 25%,
    var(--color-surface-subtle) 50%,
    var(--color-surface-raised) 75%
  );
  background-size: 200%;
  animation: skeleton-shimmer 1.5s infinite;
}

.public-notary-properties-hero-photo__placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  aspect-ratio: 4 / 3;
  background-color: var(--color-surface-raised);
  color: var(--color-text-subtle);
  font-size: var(--font-size-sm);
  border-radius: var(--radius-lg);
}


/* public/notary/properties/identity_banner.css */
.public-notary-properties-identity-banner {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  border-bottom: 1px solid var(--color-border);
  padding-bottom: var(--space-6);
}

.public-notary-properties-identity-banner__badge {
  display: inline-block;
  width: fit-content;
  padding: var(--space-2) var(--space-3);
  background-color: var(--color-public-accent-surface);
  color: var(--color-public-accent);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  border-radius: var(--radius-md);
}

.public-notary-properties-identity-banner__title {
  font-size: var(--font-size-3xl);
  font-weight: var(--font-weight-bold);
  line-height: 1.2;
  color: var(--color-text);
}

.public-notary-properties-identity-banner__address {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  margin: 0;
}

.public-notary-properties-identity-banner__price {
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-semibold);
  color: var(--color-public-accent);
  margin: var(--space-2) 0 0 0;
}

.public-notary-properties-identity-banner__mandate-badge {
  display: inline-block;
  width: fit-content;
  padding: var(--space-2) var(--space-3);
  background-color: var(--color-success-surface);
  color: var(--color-success);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  border-radius: var(--radius-md);
}


/* public/notary/properties/key_facts.css */
.public-notary-properties-key-facts {
  padding: var(--space-6) 0;
  border-bottom: 1px solid var(--color-border);
}

.public-notary-properties-key-facts__heading {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0 0 var(--space-4) 0;
}

.public-notary-properties-key-facts__list {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-4);
}

@media (min-width: 640px) {
  .public-notary-properties-key-facts__list {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 768px) {
  .public-notary-properties-key-facts__list {
    grid-template-columns: repeat(3, 1fr);
  }
}

.public-notary-properties-key-facts__pair {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.public-notary-properties-key-facts__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
  margin: 0;
}

.public-notary-properties-key-facts__value {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}


/* public/notary/properties/offer_cta.css */
.public-notary-properties-offer-cta {
  padding: var(--space-6) 0;
}

.public-notary-properties-offer-cta__button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  width: 100%;
  padding: var(--space-5) var(--space-4);
  background-color: var(--color-public-accent);
  color: var(--color-public-accent-text);
  text-decoration: none;
  border-radius: var(--radius-lg);
  font-weight: var(--font-weight-semibold);
  font-size: var(--font-size-base);
  transition: background-color 0.2s ease-out;
  cursor: pointer;
}

.public-notary-properties-offer-cta__button:hover {
  background-color: var(--color-public-accent-light);
}

.public-notary-properties-offer-cta__label {
  display: block;
}

.public-notary-properties-offer-cta__price {
  display: block;
  font-size: var(--font-size-sm);
  opacity: 0.9;
}

.public-notary-properties-offer-cta__disabled {
  padding: var(--space-5) var(--space-4);
  text-align: center;
  background-color: var(--color-surface-raised);
  border-radius: var(--radius-lg);
  color: var(--color-text-subtle);
  margin: 0;
}


/* public/notary/properties/show.css */
.public-notary-properties-show {
  display: flex;
  flex-direction: column;
  gap: var(--space-8);
  max-width: var(--public-container-max-width, 860px);
  margin: 0 auto;
  padding: var(--space-8) var(--space-4);
}

@media (min-width: 768px) {
  .public-notary-properties-show {
    padding: var(--space-8) var(--space-6);
  }
}


/* public/notary/properties/sticky_cta_banner.css */
.public-notary-properties-sticky-cta-banner {
  display: none;
}

@media (max-width: 767px) {
  .public-notary-properties-sticky-cta-banner {
    display: block;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--color-surface);
    border-top: 1px solid var(--color-border);
    padding: var(--space-3) var(--space-4);
    z-index: 100;
    transition: transform 0.2s ease-out;
  }

  .public-notary-properties-sticky-cta-banner.is-hidden {
    transform: translateY(100%);
  }

  .public-notary-properties-sticky-cta-banner__button {
    display: flex;
    justify-content: center;
    align-items: baseline;
    gap: var(--space-2);
    background: var(--color-public-accent);
    color: var(--color-public-accent-text);
    padding: var(--space-3);
    text-decoration: none;
    border-radius: var(--radius-md);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-base);
    width: 100%;
  }

  .public-notary-properties-sticky-cta-banner__button:hover {
    background: var(--color-public-accent-light);
  }

  .public-notary-properties-sticky-cta-banner__label {
    display: block;
  }

  .public-notary-properties-sticky-cta-banner__price {
    display: block;
    font-size: var(--font-size-sm);
  }
}


/* public/notary/properties/trust_signals.css */
.public-notary-properties-trust-signals {
  padding: var(--space-6);
  background-color: var(--color-public-accent-surface);
  border-radius: var(--radius-lg);
}

.public-notary-properties-trust-signals__title {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  margin: 0 0 var(--space-3) 0;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.public-notary-properties-trust-signals__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.public-notary-properties-trust-signals__pair {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.public-notary-properties-trust-signals__label {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
  margin: 0;
}

.public-notary-properties-trust-signals__value {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  margin: 0;
}


/* shared/navigation/navbar.css */
.shared-navigation-navbar {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--space-4);
  height: var(--navbar-height);
  padding: var(--space-1) var(--space-4);
  box-sizing: border-box;
  align-items: center;
  background: var(--color-brand);
  color: var(--color-text-inverted);
  position: sticky;
  top: 0;
  z-index: var(--z-sticky);

  .navbar-left {
    display: flex;
    align-items: center;
    gap: var(--space-2);
  }

  .navbar-brand {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    color: inherit;
    text-decoration: none;
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-sm);
    transition: background 150ms ease;
    width: fit-content;
    &:hover { background: rgba(255, 255, 255, 0.15); }

    svg {
      width: 2rem;
      height: 2rem;
      flex-shrink: 0;
    }
    #company-name {
      font-size: var(--font-size-xl);
    }
  }

  a {
    display: block;
    color: inherit;
    text-decoration: none;
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-sm);
    transition: background 150ms ease;
    &:hover { background: rgba(255, 255, 255, 0.15); }
  }

  .navbar-actions {
    display: flex;
    gap: var(--space-3);
    align-items: center;
  }

  .navbar-email {
    opacity: 0.7;
  }
}

.navbar-menu-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border: none;
  background: transparent;
  border-radius: var(--radius-md);
  color: var(--color-text-inverted);
  cursor: pointer;
  transition: background var(--duration-fast) var(--easing-default);

  &:hover {
    background: rgba(255, 255, 255, 0.15);
  }

  &:focus-visible {
    outline: none;
    box-shadow: var(--focus-ring);
  }

}

@media (max-width: 767px) {
  .shared-navigation-navbar #company-name {
    display: none;
  }
}

@media (max-width: 1023px) {
  .shared-navigation-navbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
  }
}


/* shared/navigation/notification_item.css */
.shared-navigation-notification-item:not(:last-child) {
  border-bottom: 1px solid var(--color-border);
}

.shared-navigation-notification-item:hover {
  background: var(--color-surface-raised);
}

.shared-navigation-notification-item--unread {
  background: var(--color-brand-surface);
}

.shared-navigation-notification-item--unread:hover {
  background: var(--color-brand-a10);
}

.shared-navigation-notification-item .ui-pill {
  font-size: 0.5625rem;
  padding: 0 4px;
  line-height: 1.125rem;
  flex-shrink: 0;
}


/* shared/navigation/user_menu.css */
.shared-navigation-user-menu {
  position: relative;

  .user-menu {
    display: flex;
    align-items: center;
    gap: var(--space-6);
  }

  .user-menu__trigger {
    max-width: 16rem;
    overflow: hidden;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: inherit;
    padding: var(--space-1) var(--space-3);
    border-radius: var(--radius-sm);
    cursor: pointer;
    font-size: var(--font-size-sm);
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: background 150ms ease;

    &:hover {
      background: rgba(255, 255, 255, 0.15);
    }

    .ui-user-badge__name {
      color: var(--color-neutral-0);
    }

    .ui-user-badge__email {
      color: rgba(255, 255, 255, 0.7);
    }
  }

  .user-menu__menu {
    display: none;
    position: absolute;
    top: calc(100% + var(--space-1));
    right: 0;
    min-width: 14rem;
    background: var(--color-surface);
    color: var(--color-text);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
    overflow: hidden;
    z-index: var(--z-dropdown);
  }

  .user-menu.is-open .user-menu__menu {
    display: block;
  }

  .user-menu__item {
    display: block;
    width: 100%;
    padding: var(--space-2) var(--space-4);
    text-align: left;
    color: var(--color-text);
    text-decoration: none;
    font-size: var(--font-size-sm);
    background: transparent;
    border: none;
    cursor: pointer;
    transition: background 150ms ease;

    &:hover {
      background: var(--color-surface-subtle);
    }
  }

  .user-menu__item--logout {
    border-top: 1px solid var(--color-border);
    color: var(--color-danger);

    form {
      display: contents;
    }
  }
}

@media (max-width: 767px) {
  .shared-navigation-user-menu .user-menu__trigger {
    max-width: 100%;
  }
}


/* shared/notification.css */
.shared-notification {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  margin-bottom: var(--space-2);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
  opacity: 1;
  transition: opacity 300ms ease-out, transform 300ms ease-out;
}

.shared-notification--info {
  border-left: 4px solid var(--color-brand);
}

.shared-notification--success {
  border-left: 4px solid var(--color-success);
}

.shared-notification--error {
  border-left: 4px solid var(--color-danger);
}

.shared-notification__message {
  flex: 1;
  color: var(--color-text);
  font-size: var(--font-size-sm);
}

.shared-notification__close {
  background: none;
  border: none;
  color: var(--color-text-muted);
  font-size: var(--font-size-lg);
  cursor: pointer;
  padding: 0 var(--space-1);
  line-height: 1;
}

.shared-notification__close:hover {
  color: var(--color-text);
}

.notification--dismissing {
  opacity: 0;
  transform: translateY(-8px);
}


/* surveys/completion_screen.css */
.surveys-completion-screen {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-4);
  margin-block-start: var(--space-8);
}

.surveys-completion-screen__heading {
  font-size: var(--font-size-4xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-primary);
  margin: 0;
}

.surveys-completion-screen__description {
  font-size: var(--font-size-xl);
  color: var(--color-text-secondary);
  margin: 0;
}

.surveys-completion-screen__actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-3);
  margin-block-start: var(--space-4);
  margin-block-end: var(--space-8);
}

.surveys-completion-screen__footer {
  align-self: flex-start;
}


/* surveys/contexts/attribute_tag.css */
.surveys-contexts-attribute-tag {
  display: grid !important;
  grid-template-columns: 1fr auto;
  gap: var(--space-1);
  align-items: baseline;
}

.surveys-contexts-attribute-tag__label {
  display: inline !important;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-brand-light);
  text-transform: none;
}

.surveys-contexts-attribute-tag__value {
  display: inline !important;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-normal);
  color: var(--color-text-subtle);
  text-align: right;
  text-transform: none;
}


/* surveys/contexts/notary/buyer_party/details.css */
.surveys-contexts-notary-buyer-party-details__heading {
  font-size: var(--text-lg);
  font-weight: var(--font-semibold);
  color: var(--color-text);
  margin: 0 0 var(--space-4) 0;
}

.surveys-contexts-notary-buyer-party-details__party {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  margin-bottom: var(--space-4);
}

.surveys-contexts-notary-buyer-party-details__name {
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--color-text);
}

.surveys-contexts-notary-buyer-party-details__type {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

.surveys-contexts-notary-buyer-party-details__completion {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
}

.surveys-contexts-notary-buyer-party-details__label {
  font-size: var(--text-sm);
  color: var(--color-text-subtle);
}

.surveys-contexts-notary-buyer-party-details__value {
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--color-brand);
  font-variant-numeric: tabular-nums;
}


/* surveys/contexts/notary/buyer_party/party_details/attribute_list.css */
.surveys-contexts-notary-buyer-party-party-details-attribute-list {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: var(--space-1);
}


/* surveys/contexts/notary/buyer_situation/details.css */
.surveys-contexts-notary-buyer-situation-details__buyer,
.surveys-contexts-notary-buyer-situation-details__property {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.surveys-contexts-notary-buyer-situation-details__label {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-brand-light);
}

.surveys-contexts-notary-buyer-situation-details__name {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}


/* surveys/contexts/notary/buyer_situation/situation_details/attribute_list.css */
.surveys-contexts-notary-buyer-situation-situation-details-attribute-list {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: var(--space-1);
}


/* surveys/contexts/notary/coproperty/coproperty_details/attribute_list.css */
.surveys-contexts-notary-coproperty-coproperty-details-attribute-list {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: var(--space-1);
}


/* surveys/contexts/notary/party/details.css */
.surveys-contexts-notary-party-details__heading {
  font-size: var(--text-lg);
  font-weight: var(--font-semibold);
  color: var(--color-text);
  margin: 0 0 var(--space-4) 0;
}

.surveys-contexts-notary-party-details__party {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  margin-bottom: var(--space-4);
}

.surveys-contexts-notary-party-details__name {
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--color-text);
}

.surveys-contexts-notary-party-details__type {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

.surveys-contexts-notary-party-details__completion {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
}

.surveys-contexts-notary-party-details__label {
  font-size: var(--text-sm);
  color: var(--color-text-subtle);
}

.surveys-contexts-notary-party-details__value {
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--color-brand);
  font-variant-numeric: tabular-nums;
}


/* surveys/contexts/notary/party/party_details/attribute_list.css */
.surveys-contexts-notary-party-party-details-attribute-list {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: var(--space-1);
}


/* surveys/contexts/notary/property_description/details.css */
.surveys-contexts-notary-property-description-details span {
  text-transform: none;
}

.surveys-contexts-notary-property-description-details__attributes {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-1);
}


/* surveys/contexts/notary/property_situation/details.css */
.surveys-contexts-notary-property-situation-details__property {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.surveys-contexts-notary-property-situation-details__label {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-brand-light);
}

.surveys-contexts-notary-property-situation-details__name {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}


/* surveys/contexts/notary/property_situation/situation_details/attribute_list.css */
.surveys-contexts-notary-property-situation-situation-details-attribute-list {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: var(--space-1);
}


/* surveys/contexts/notary/seller_situation/details.css */
.surveys-contexts-notary-seller-situation-details__seller,
.surveys-contexts-notary-seller-situation-details__property {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.surveys-contexts-notary-seller-situation-details__label {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-brand-light);
}

.surveys-contexts-notary-seller-situation-details__name {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}


/* surveys/contexts/notary/seller_situation/situation_details/attribute_list.css */
.surveys-contexts-notary-seller-situation-situation-details-attribute-list {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: var(--space-1);
}


/* surveys/contexts/notary/unit/unit_details/attribute_list.css */
.surveys-contexts-notary-unit-unit-details-attribute-list {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: var(--space-1);
}


/* surveys/inputs/notary/buyer_situation/funds_origin.css */
.surveys-inputs-notary-buyer-situation-funds-origin {
  grid-template-columns: repeat(6, 1fr);
}

.surveys-inputs-notary-buyer-situation-funds-origin .surveys-inputs-descriptive-choice__form {
  display: grid;
  grid-column: span 2;
}

.surveys-inputs-notary-buyer-situation-funds-origin .surveys-inputs-descriptive-choice__form:nth-child(n+4) {
  grid-column: span 3;
}

@media (max-width: 767px) {
  .surveys-inputs-notary-buyer-situation-funds-origin {
    grid-template-columns: repeat(2, 1fr);
  }

  .surveys-inputs-notary-buyer-situation-funds-origin .surveys-inputs-descriptive-choice__form,
  .surveys-inputs-notary-buyer-situation-funds-origin .surveys-inputs-descriptive-choice__form:nth-child(n+4) {
    grid-column: span 1;
  }
}


/* surveys/inputs/notary/party/matrimonial_regime.css */
.surveys-inputs-notary-party-matrimonial-regime {
  grid-template-columns: repeat(2, 1fr) !important;
}


/* surveys/inputs/notary/party/spouse_choice.css */
.surveys-inputs-notary-party-spouse-choice__spouse-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);

  padding: var(--space-4) var(--space-5);
  border: 1.5px solid var(--color-brand-a10);
  border-radius: var(--radius-lg);
  background: var(--color-brand-surface);

  margin-bottom: var(--space-4);
}

.surveys-inputs-notary-party-spouse-choice__spouse-name {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.surveys-inputs-notary-party-spouse-choice__spouse-relation {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.surveys-inputs-notary-party-spouse-choice__invite-trigger {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  width: 100%;
  padding: var(--space-4) var(--space-5);
  border: 1.5px dashed var(--color-brand);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  color: var(--color-brand);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease;
  margin-bottom: var(--space-3);
}

.surveys-inputs-notary-party-spouse-choice__invite-trigger:hover {
  background: var(--color-brand-surface);
  border-color: var(--color-brand-hover);
}

.surveys-inputs-notary-party-spouse-choice__invite-icon {
  font-size: var(--font-size-lg);
}

.surveys-inputs-notary-party-spouse-choice__invite-text {
  flex: 1;
}


/* surveys/inputs/notary/party/spouse_invite_modal.css */
.surveys-inputs-notary-party-spouse-invite-modal__form {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.surveys-inputs-notary-party-spouse-invite-modal__actions {
  display: flex;
  justify-content: flex-end;
  padding-top: var(--space-2);
}


/* surveys/inputs/notary/property_situation/rental_lease_type.css */
.surveys-inputs-notary-property-situation-rental-lease-type {
  grid-template-columns: repeat(2, 1fr) !important;
}


/* surveys/inputs/notary/property_situation/rental_notice_given.css */
.surveys-inputs-notary-property-situation-rental-notice-given {
  grid-template-columns: repeat(2, 1fr) !important;
}

.surveys-inputs-notary-property-situation-rental-notice-given > .surveys-inputs-descriptive-choice__form:last-child {
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
}


/* surveys/inputs/notary/seller_situation/acquisition_mode.css */
.surveys-inputs-notary-seller-situation-acquisition-mode {
  grid-template-columns: repeat(2, 1fr) !important;
}

.surveys-inputs-notary-seller-situation-acquisition-mode > .surveys-inputs-descriptive-choice__form:last-child {
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
}


/* surveys/inputs/notary/unit/building_material.css */
.surveys-inputs-notary-unit-building-material {
  grid-template-columns: repeat(4, 1fr);
}


/* surveys/inputs/notary/unit/construction_era.css */
.surveys-inputs-notary-unit-construction-era {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-2);
}

.surveys-inputs-notary-unit-construction-era__form {
  display: contents;
}

.surveys-inputs-notary-unit-construction-era__card {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-3) var(--space-2);
  border: 1.5px solid var(--color-brand-a10);
  border-radius: var(--radius-lg);
  background: var(--color-brand-surface);
  cursor: pointer;
  transition: border-color 200ms ease-out, box-shadow 200ms ease-out, transform 150ms ease-out;
}

.surveys-inputs-notary-unit-construction-era__card:hover {
  border-color: var(--color-brand-light);
  box-shadow: 0 0 0 3px var(--color-brand-a10);
  transform: translateY(-2px);
}

.surveys-inputs-notary-unit-construction-era__card:active {
  transform: translateY(0);
  box-shadow: none;
}

.surveys-inputs-notary-unit-construction-era__card--selected {
  border-color: var(--color-brand);
  box-shadow: 0 0 0 3px var(--color-brand-a20);
}

.surveys-inputs-notary-unit-construction-era__label {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}

@media (max-width: 767px) {
  .surveys-inputs-notary-unit-construction-era {
    grid-template-columns: repeat(2, 1fr);
  }
}


/* surveys/inputs/notary/unit/dpe_rating.css */
.surveys-inputs-notary-unit-dpe-rating {
  display: flex;
  flex-direction: column;
  gap: var(--space-8);
}

.surveys-inputs-notary-unit-dpe-rating__scale {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.surveys-inputs-notary-unit-dpe-rating__scale-title {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}

.surveys-inputs-notary-unit-dpe-rating__bars {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.surveys-inputs-notary-unit-dpe-rating__form {
  display: contents;
}

/* ── Bar (arrow shape) ── */

.surveys-inputs-notary-unit-dpe-rating__bar {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: var(--bar-width);
  padding: var(--space-2) var(--space-4);
  padding-right: var(--space-6);
  border: none;
  clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 50%, calc(100% - 14px) 100%, 0 100%);
  cursor: pointer;
  transition: padding 200ms ease-out, transform 150ms ease-out, filter 150ms ease-out, box-shadow 200ms ease-out;
}

/* Indicator arrow (hidden by default) */
.surveys-inputs-notary-unit-dpe-rating__bar .surveys-inputs-notary-unit-dpe-rating__indicator {
  opacity: 0;
  transition: opacity 200ms ease-out;
}

.surveys-inputs-notary-unit-dpe-rating__bar:hover {
  filter: brightness(1.1);
  transform: translateX(4px);
}

.surveys-inputs-notary-unit-dpe-rating__bar:active {
  transform: translateX(0);
}

/* ── Selected state ── */

.surveys-inputs-notary-unit-dpe-rating__bar--selected {
  padding: var(--space-3) var(--space-6);
  padding-right: var(--space-8);
  margin: var(--space-2) 0;
  transform: translateX(8px);
  filter: brightness(1.1) saturate(1.2);
  z-index: 1;
}

.surveys-inputs-notary-unit-dpe-rating__bar--selected .surveys-inputs-notary-unit-dpe-rating__indicator {
  opacity: 1;
}

.surveys-inputs-notary-unit-dpe-rating__bar--selected:hover {
  transform: translateX(8px);
}

.surveys-inputs-notary-unit-dpe-rating__indicator {
  font-size: var(--font-size-sm);
  color: white;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
  margin-left: var(--space-2);
}

/* ── Letter ── */

.surveys-inputs-notary-unit-dpe-rating__letter {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  color: white;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

/* ── DPE colors (vert → rouge) ── */

.surveys-inputs-notary-unit-dpe-rating__bar--dpe-a { background: #319834; }
.surveys-inputs-notary-unit-dpe-rating__bar--dpe-b { background: #33cc31; }
.surveys-inputs-notary-unit-dpe-rating__bar--dpe-c { background: #cbfc34; }
.surveys-inputs-notary-unit-dpe-rating__bar--dpe-d { background: #fbfe06; }
.surveys-inputs-notary-unit-dpe-rating__bar--dpe-e { background: #fbcc05; }
.surveys-inputs-notary-unit-dpe-rating__bar--dpe-f { background: #fc9935; }
.surveys-inputs-notary-unit-dpe-rating__bar--dpe-g { background: #fc0205; }

/* DPE — lettres sombres sur fonds clairs */
.surveys-inputs-notary-unit-dpe-rating__bar--dpe-c .surveys-inputs-notary-unit-dpe-rating__letter,
.surveys-inputs-notary-unit-dpe-rating__bar--dpe-d .surveys-inputs-notary-unit-dpe-rating__letter,
.surveys-inputs-notary-unit-dpe-rating__bar--dpe-e .surveys-inputs-notary-unit-dpe-rating__letter {
  color: rgba(0, 0, 0, 0.7);
  text-shadow: none;
}

.surveys-inputs-notary-unit-dpe-rating__bar--dpe-c .surveys-inputs-notary-unit-dpe-rating__indicator,
.surveys-inputs-notary-unit-dpe-rating__bar--dpe-d .surveys-inputs-notary-unit-dpe-rating__indicator,
.surveys-inputs-notary-unit-dpe-rating__bar--dpe-e .surveys-inputs-notary-unit-dpe-rating__indicator {
  color: rgba(0, 0, 0, 0.7);
  text-shadow: none;
}

/* ── GES colors (violet clair → violet foncé) ── */

.surveys-inputs-notary-unit-dpe-rating__bar--ges-a { background: #f2e6ff; }
.surveys-inputs-notary-unit-dpe-rating__bar--ges-b { background: #dab8f0; }
.surveys-inputs-notary-unit-dpe-rating__bar--ges-c { background: #cc99e6; }
.surveys-inputs-notary-unit-dpe-rating__bar--ges-d { background: #b366cc; }
.surveys-inputs-notary-unit-dpe-rating__bar--ges-e { background: #9933b3; }
.surveys-inputs-notary-unit-dpe-rating__bar--ges-f { background: #730099; }
.surveys-inputs-notary-unit-dpe-rating__bar--ges-g { background: #4d0066; }

/* GES — lettres sombres sur fonds clairs */
.surveys-inputs-notary-unit-dpe-rating__bar--ges-a .surveys-inputs-notary-unit-dpe-rating__letter,
.surveys-inputs-notary-unit-dpe-rating__bar--ges-b .surveys-inputs-notary-unit-dpe-rating__letter,
.surveys-inputs-notary-unit-dpe-rating__bar--ges-c .surveys-inputs-notary-unit-dpe-rating__letter {
  color: rgba(0, 0, 0, 0.7);
  text-shadow: none;
}

.surveys-inputs-notary-unit-dpe-rating__bar--ges-a .surveys-inputs-notary-unit-dpe-rating__indicator,
.surveys-inputs-notary-unit-dpe-rating__bar--ges-b .surveys-inputs-notary-unit-dpe-rating__indicator,
.surveys-inputs-notary-unit-dpe-rating__bar--ges-c .surveys-inputs-notary-unit-dpe-rating__indicator {
  color: rgba(0, 0, 0, 0.7);
  text-shadow: none;
}


/* surveys/inputs/notary/unit/heating_type.css */
/* Inherits all styles from surveys/inputs/descriptive_choice.css */
/* Default 3-column grid is correct for 8 options */


/* surveys/inputs/notary/unit/hot_water_type.css */
/* Overrides grid to 2 columns with last option centered */
.surveys-inputs-notary-unit-hot-water-type {
  grid-template-columns: repeat(2, 1fr);
}

.surveys-inputs-notary-unit-hot-water-type .surveys-inputs-descriptive-choice__form:last-child {
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
}


/* surveys/inputs/notary/unit/orientation.css */
/* Overrides grid to 2 columns with last option centered */
.surveys-inputs-notary-unit-orientation {
  grid-template-columns: repeat(2, 1fr);
}

.surveys-inputs-notary-unit-orientation .surveys-inputs-descriptive-choice__form:last-child {
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
}


/* surveys/inputs/notary/unit/property_kind.css */
.surveys-inputs-notary-unit-property-kind {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
}


/* surveys/inputs/notary/unit/state.css */
/* Inherits all styles from surveys/inputs/descriptive_choice.css */
/* Default 3-column grid is correct for 3 options */


/* widgets/grid.css */
.widgets-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
  gap: var(--space-6);
  align-items: start;
}


/* widgets/lead_count.css */
.widgets-lead-count {
  padding: var(--space-4);
  background: var(--color-surface);
  border-radius: var(--radius-md);
  border: 1px solid var(--color-border);
}

.widgets-lead-count .widget-title {
  font-size: var(--text-sm);
  color: var(--color-muted);
  margin-bottom: var(--space-2);
}

.widgets-lead-count .widget-count {
  font-size: var(--text-2xl);
  font-weight: var(--font-bold);
  color: var(--color-text);
}


/* widgets/matter_summary.css */
.widgets-matter-summary {
  padding: var(--space-6);
  background: var(--color-surface);
  border-radius: var(--radius-xl);
  border: 1px solid var(--color-border);
  box-shadow: var(--shadow-sm);
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.widgets-matter-summary__title {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0;
}

.widgets-matter-summary__kpi {
  display: flex;
  align-items: baseline;
  gap: var(--space-3);
}

.widgets-matter-summary__count {
  font-size: var(--font-size-5xl, 3rem);
  font-weight: var(--font-weight-bold);
  line-height: 1;
  color: var(--color-brand);
}

.widgets-matter-summary__count-label {
  font-size: var(--font-size-base);
  color: var(--color-text-subtle);
}

.widgets-matter-summary__breakdown {
  list-style: none;
  padding: var(--space-3) 0 0 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  border-top: 1px solid var(--color-border);
}

.widgets-matter-summary__breakdown-item {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.widgets-matter-summary__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

.widgets-matter-summary__dot--neutral { background: var(--color-border-strong, #9ca3af); }
.widgets-matter-summary__dot--brand   { background: var(--color-brand); }
.widgets-matter-summary__dot--warning { background: var(--color-warning); }
.widgets-matter-summary__dot--success { background: var(--color-success); }

.widgets-matter-summary__breakdown-text {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}


/* widgets/member_stats.css */
.widgets-member-stats {
  padding: var(--space-4);
  background: var(--color-surface);
  border-radius: var(--radius-md);
  border: 1px solid var(--color-border);
}

.widgets-member-stats .widget-title {
  font-size: var(--text-sm);
  color: var(--color-muted);
  margin-bottom: var(--space-2);
}

.widgets-member-stats .widget-stats {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.widgets-member-stats .widget-stat {
  font-size: var(--text-base);
  color: var(--color-text);
}

.widgets-member-stats .widget-empty {
  font-size: var(--text-sm);
  color: var(--color-muted);
}