/* 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 */
/* LE QR A BESOIN D'UN FOND CLAIR, SINON IL NE SE SCANNE PAS.
   RQRCode le peint en `#000` et ne pose aucun fond (Mfa::Enroll, `color: "000"`).
   Un consumer dont le gabarit d'accès est sombre obtient donc du noir sur noir :
   mesuré au rendu WebKit sur Fatima le 2026-08-31, 1,03:1 de contraste. Le QR
   était bien là, bien centré, bien dimensionné — et parfaitement inscannable,
   donc personne ne s'enrôlait et personne n'entrait dans l'admin.

   Aucun spec ne pouvait le voir : la couleur des modules vit dans les octets du
   SVG, pas dans un style calculé. C'est la capture qui l'a sorti.

   La marge n'est pas décorative : les lecteurs de QR attendent une zone de
   silence autour du motif pour l'accrocher. */
.auth-mfa-setup-form {
  .mfa-qr-code {
    display: flex;
    justify-content: center;
    margin-block: var(--space-4);
    margin-inline: auto;
    width: fit-content;
    background: #fff;
    padding: var(--space-4);
    border-radius: var(--radius-md);
  }
}


/* 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;
}

/* Raccourcis facultatifs sous le bouton de retour. Ils s'enroulent plutôt que
   de déborder : sur un écran étroit, quatre libellés ne tiennent pas sur une
   ligne. */
.shared-errors-not-found__links,
.shared-errors-internal-server__links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--space-2) var(--space-4);
  max-width: 100%;
}


/* 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-loose);
  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-loose);
  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);
}

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


/* 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: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-3);
}

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

.surveys-inputs-descriptive-choice__card {
  flex: 0 1 240px;
  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-loose);
}



/* 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;
}

/* ── Clickable wrapper (jump_path active) ── */

.surveys-map-stop__form {
  display: contents;
}

.surveys-map-stop__button {
  all: unset;
  display: flex;
  align-items: center;
  gap: var(--space-3);
  width: 100%;
  cursor: pointer;
}

.surveys-map-stop__button:hover .surveys-map-stop__label {
  color: var(--color-text);
}


/* 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-8);
}


/* fulgore: surveys/question_layout.css */
.surveys-question-layout {
  display: grid;
  /* start : la map et le bloc contexte gardent la hauteur de leur contenu
     au lieu de s'étirer à la hauteur de la colonne principale */
  align-items: start;
  gap: var(--space-6);
}

/* Le frame survey n'est pas un formulaire simple : lever le plafond 48rem
   posé par record-view sur son enfant unique, sinon la grille multi-colonnes
   ci-dessous s'applique dans 768px et écrase la colonne principale. */
.ui-bases-record-view__body > turbo-frame:only-child:has(.surveys-question-layout) {
  max-width: none;
}

.surveys-question-layout__context-block {
  min-height: var(--space-16);
  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;
}

@keyframes surveys-question-enter {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

.surveys-question-layout__main {
  animation: surveys-question-enter 320ms cubic-bezier(0.4, 0, 0.2, 1) both;
}

@media (prefers-reduced-motion: reduce) {
  .surveys-question-layout__main {
    animation: none;
  }
}

@media (min-width: 768px) {
  .surveys-question-layout {
    grid-template-columns: 3fr 2fr;
    /* 3e rangée 1fr : absorbe l'excédent de hauteur de la colonne
       principale (section dépliée), sinon il se répartit sur la rangée 1
       et le bloc contexte tombe en bas de page. */
    grid-template-rows: auto auto 1fr;
    gap: var(--space-8);
  }

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

  .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;
    grid-template-rows: none;
  }

  .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);
  }

  &.ui-button--icon-only {
    padding: var(--space-2);

    /* Shield the icon from consumer resets like `svg { max-width: 100% }`:
       100% of a shrink-to-fit content box computes to 0 width and hides
       the icon entirely — same trap as the sortable grip (cf. row.css). */
    .svg {
      width: var(--space-4);
      min-width: var(--space-4);
      max-width: none;
    }

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

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



  /* L'ÉTAT DÉSACTIVÉ SE LIT « INACTIF », PAS « CASSÉ ». `opacity: 0.45` délave
     la couleur de marque du consumer sans rien garantir : sur le terracotta de
     FBordes, le libellé blanc tombait à ~2,6:1 (contre 6,44:1 à l'état actif) —
     sous les deux planchers WCAG. Et c'est le PREMIER état que voit un visiteur
     d'un écran de connexion, dont `form-validation` désactive le bouton tant que
     les champs sont vides.
     Des couleurs franches le disent sans ambiguïté et ne dépendent plus de la
     teinte de marque : mesuré 5,69:1 au navigateur le 2026-08-03, dans les deux
     moteurs et aux deux tailles d'écran.
     ⚠️ CE SIDECAR EST LA COPIE SERVIE — voir la note jumelle dans
     `ui/inputs/password.css`. `app/assets/stylesheets/fulgore/button.css` porte
     une seconde définition qui n'atteint aucun consumer. */
  &:disabled,
  &.ui-button--disabled {
    background: var(--color-surface-raised);
    border-color: var(--color-border);
    color: var(--color-text-subtle);
    cursor: not-allowed;
    pointer-events: none;
  }
}


/* fulgore: ui/bases/card.css */
.ui-bases-card {
  box-sizing: border-box;
  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 */
/* `flex-start` et non `center` : dès qu'une barre porte des champs de hauteurs
   différentes (un multi-select à huit options est bien plus haut qu'une
   recherche), le centrage aligne chaque champ sur le milieu de sa ligne et
   dessine un escalier. Sur une barre à champs de même hauteur — le cas de tous
   les consumers jusqu'ici — les deux valeurs rendent à l'identique. */
.ui-filter-bar__fields {
  display: flex;
  align-items: flex-start;
  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);
}

/* ⚠️ `flex` ET NON `inline-flex`, et c'est le contraire d'un détail. Un
   `inline-flex` se dimensionne sur son CONTENU : sa largeur est « indéfinie »
   au sens de CSS, et tout `width: %` d'un enfant s'y résout alors contre rien
   — l'input retombe sur sa taille intrinsèque quelle que soit la place qu'on
   lui offre. Mesuré le 2026-08-03 : 302 px pris dans un conteneur de 328,
   et 302 px dans une piste de grille de 416 chez RatsAndFrogs, où la barre
   paraissait décentrée alors que la GRILLE était juste.
   Le passage en `flex` (donc de niveau bloc) ne change RIEN aux barres à
   plusieurs champs : `.filter-field--search` y est un élément flex de
   `.ui-filter-bar__fields`, dimensionné sur son `max-content` — vérifié au
   rendu avant/après, à 1280 et 390 px, sur `UI::Bases::ExampleFilterBar`. */
.filter-search-wrapper {
  position: relative;
  display: 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;

  /* ⚠️ `flex: 1` EST LA SECONDE MOITIÉ DU CORRECTIF, et sans elle la première
     ne sert à rien : passer le conteneur en `flex` lui donne une largeur
     définie, mais l'input reste `flex: 0 1 auto`, donc dimensionné sur son
     contenu. Mesuré le 2026-08-03 par injection : conteneur porté à 600 px,
     input toujours à 302. Les deux règles se tiennent — ne pas en retirer une
     en croyant l'autre suffisante.
     ⚠️⚠️ `flex: 1` ET NON `width: 100%`, essayé d'abord et REVERTÉ : un `100%`
     oblige à déclarer `box-sizing: border-box` (la gem n'a aucune remise à
     zéro globale — chaque composant le déclare chez lui), et ce border-box
     fait alors compter les 46 px de padding et de bordure DANS le `min-width:
     16rem` ci-dessus, qui a toujours été écrit en largeur de contenu. Mesuré :
     les champs des barres passaient de 302 à 256 px, soit 46 px perdus dans
     les dix-sept barres de la flotte. Le flex, lui, dimensionne sur la boîte
     de bordure quel que soit le `box-sizing` — rien à compenser. */
  flex: 1;

  &: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;
}

/* `min-width: 0` est le remède au piège WebKit : un item flex garde par défaut
   `min-width: auto` et refuse de se rétrécir sous son `min-content` — un
   multi-select à beaucoup d'options débordait alors sa case et se dessinait
   PAR-DESSUS le champ voisin. Mesuré en WebKit : recouvrement du champ de
   recherche par les options de type, ramené à zéro par cette règle. */
.filter-field--multi-select {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  min-width: 0;
  max-width: 100%;
}

.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);
  }

  /* Le badge se teinte par `currentColor` plutôt qu'en dur : l'option prend
     l'une des 12 teintes de `UI::Pill` quand elle est active, et le compteur
     suit sans qu'on redéclare douze règles. */
  .filter-multi-select__count {
    margin-left: var(--space-2);
    min-width: 1.25em;
    padding: 0 var(--space-1);
    border-radius: 999px;
    background: color-mix(in srgb, currentColor 15%, transparent);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    line-height: 1.5;
    text-align: center;
    font-variant-numeric: tabular-nums;
  }
}

.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);
  }
}

.ui-form__footer {
  margin: var(--space-4) 0 0;
  text-align: center;
  font-size: var(--font-size-sm);

  a {
    color: var(--color-text-subtle);
    transition: color var(--duration-fast) var(--easing-default);

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

.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;
    /* gap : espace minimal entre le texte et le tooltip quand le label est
       à largeur de contenu (checkbox) — space-between n'y suffit pas */
    gap: var(--space-2);
    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 {
    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);
  }

  /* ⚠️ MONTÉES ICI LE 2026-09-02, ET ELLES CHANGENT L'ASPECT DE TOUTES LES
     LISTES DU PARC. C'étaient les deux seules choses qu'une table de la gem ne
     donnait pas, et deux sidecars de Fatima les recopiaient donc à l'identique.
     Les laisser dehors condamnait chaque consumer à les réécrire pour obtenir
     un tableau d'apparence ordinaire.
     Sous 768 px, `thead` est masqué par la bascule en cartes : la première
     règle y est inerte, la seconde teinte la carte survolée. */
  thead {
    background-color: var(--color-surface-subtle);
  }

  tbody tr:hover {
    background-color: var(--color-surface-subtle);
  }

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

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

  .ui-col--thumb {
    width: 3rem;
  }

  /* ⚠️ `white-space: nowrap` A CESSÉ D'ÊTRE LE DÉFAUT DE TOUTE CELLULE — NE PAS
     LE REMETTRE SUR `th, td`. Il l'a été jusqu'au 2026-08-02, et il fabriquait
     un débordement là où il n'y avait aucune raison d'en avoir un : la largeur
     du tableau devenait la somme de ses contenus les plus longs tenus sur UNE
     ligne. Mesuré en production sur un tableau de cinq colonnes dans 880 px de
     large — 1010 px de contenu, donc 130 px cachés, à cause d'une seule cellule
     de texte libre (« Me contacter (différents packs proposés) »).

     Et ce débordement n'était pas qu'un défilement de plus : il décalait la
     colonne d'actions collée à droite, qui RECOUVRAIT alors la dernière colonne
     de données. Chez le consumer c'était « Publiée », le champ qui dit si une
     fiche est en ligne — 7 en-têtes dans le DOM, 6 visibles à l'écran, dans les
     deux moteurs. Rien ne rougissait : le `<th>` est bien rendu, il n'est ni
     clippé ni hors cadre, il est simplement PEINT DESSOUS.

     La colonne collée n'était donc pas le défaut, elle en était le symptôme.
     Le `nowrap` général était la cause, et il aurait rejoué sur le prochain
     tableau du prochain site.

     Il reste juste là où couper serait pire que replier : un libellé d'en-tête,
     une vignette, la poignée, le rang, et la cellule d'actions — tous courts ou
     atomiques. Pour une cellule de données qui ne doit jamais se couper (une
     date, un montant, une référence), l'opt-in est `ui-col--nowrap`, dans la
     même famille que `ui-col--optional` / `--important` / `--thumb`.

     Borné à partir de 769 px : en dessous, le tableau devient une pile de
     cartes et TOUT doit se replier (cf. le bloc `max-width: 768px`). */
  @media (min-width: 769px) {
    th,
    .ui-col--nowrap,
    .ui-col--thumb,
    .ui-bases-row__grip,
    .ui-bases-row__position,
    .ui-list-table__td--actions,
    .ui-bases-row__actions {
      white-space: nowrap;
    }
  }

  .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);
  }

  /* `position: sticky` ALWAYS creates a stacking context, so every Actions
     cell is its own layer painted in DOM order — and a RowActionsMenu's
     `z-index: var(--z-dropdown)` only ever ranks INSIDE its own cell. Result:
     an open kebab menu is painted over by the next row's Actions cell (33% of
     the panel covered, measured WebKit + Chromium). Raising just the cell that
     holds an open menu lifts its whole layer above its siblings, which are all
     at `z-index: auto`. Floating mode (`position: fixed`, dropdown_controller)
     escapes CLIPPING, not stacking — it does not help here.
     Keep this rule INSIDE the `.ui-list-table` block: flattened out it drops
     from (0,2,0) to (0,1,0) and is silently outranked. */
  .ui-list-table__td--actions:has(.ui-row-actions-menu.is-open),
  .ui-bases-row__actions:has(.ui-row-actions-menu.is-open) {
    z-index: 1;
  }

}

/* ⚠️ ICI VIVAIT UNE RÈGLE QUI ÉTEIGNAIT L'OMBRE DE LA COLONNE COLLÉE AU-DESSUS
   DE 1025 px — NE PAS LA REMETTRE. L'ombre est le SEUL indice qui dise que
   cette colonne flotte au-dessus du reste et qu'il reste du contenu à sa
   gauche. La couper aux largeurs de bureau, c'est la couper exactement là où
   on regarde : le 2026-08-02, en production à 1280, une colonne de données
   entière était recouverte sans qu'aucun signe ne l'indique — et la barre de
   défilement du cadre mesure 0 px de haut (barre superposée macOS, invisible
   tant qu'on ne fait pas le geste). Aucun indice, donc, d'aucune sorte.

   Le pari de cette règle était « à cette largeur le tableau tient, l'ombre
   serait du bruit ». Il ne tient pas : un tableau déborde en fonction de son
   CONTENU, pas de la largeur de l'écran. Et le bruit est faible — l'ombre vaut
   4 % d'opacité, invisible quand la colonne est à sa place naturelle. */

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

@media (max-width: 768px) {
  .ui-list-table {
    display: block;
    width: 100%;

    thead {
      display: none;
    }

    tbody {
      display: block;
      width: 100%;
    }

    .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;
    }

    .ui-col--card-hidden {
      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 1fr;
  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);
}

/* ── Center section ── */

.navbar-nav {
  display: flex;
  justify-content: center;
  gap: var(--space-4);
  flex-wrap: wrap;
}

.navbar-link {
  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);
}

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

.navbar-link--active {
  background: rgba(255, 255, 255, 0.25);
  font-weight: var(--font-weight-semibold);
}

/* ── 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 {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.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;
  /* wrap + min-width 0 : sans eux, une zone d'actions plus large que
     l'espace restant déborde du viewport mobile (flex min-width:auto). */
  flex-wrap: wrap;
  gap: var(--space-3);
  margin-bottom: var(--space-6);
}

.ui-bases-record-view__header > * {
  min-width: 0;
}

.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;
}

/* td-qualified: must outrank `.ui-list-table td` (list.css) or its padding
   collapses the cell content box to 0 and hides the handle. */
td.ui-bases-row__grip {
  width: 1.25rem;
  padding-right: 0;
  color: var(--color-text-subtle);
  user-select: none;
  cursor: grab;

  &:active {
    cursor: grabbing;
  }

  /* Shield the handle from consumer resets like `svg { max-width: 100% }`
     (100% of a zero-width content box renders the handle invisible). */
  & svg {
    width: 10px;
    min-width: 10px;
    max-width: none;
  }
}

/* The handle is a real button so it can be reached by Tab and driven by the
   arrow keys — mouse dragging is not the only way to reorder. It must not look
   like one: no native chrome, it inherits the cell's colour and grab cursor.
   The focus ring is the one thing it keeps, and it must stay visible — it is
   the only cue telling a keyboard user which row the arrows will move. */
button.ui-bases-row__grip-button {
  display: inline-flex;
  align-items: center;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  cursor: inherit;
  font: inherit;
  line-height: 0;

  /* Même anneau que partout ailleurs dans la gem (bouton, menu d'actions,
     lien de barre latérale) : `--focus-ring`, jamais un outline maison. */
  &:focus-visible {
    outline: none;
    border-radius: var(--radius-sm);
    box-shadow: var(--focus-ring);
  }
}

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 */
/* Le panneau reçoit le focus à l'ouverture en mobile (cf. nav_sidebar_controller
   #enableFocusTrap) : ce n'est pas un contrôle, aucun anneau ne doit s'y
   dessiner. Sélecteur d'attribut et non de classe — la règle doit valoir pour
   toute sidebar branchée sur le contrôleur, y compris les panneaux propres aux
   consumers qui n'utilisent pas .sidebar. */
[data-nav-sidebar-target="sidebar"]:focus {
  outline: none;
}

.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/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-loose);
  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/directions_dropdown.css */
/* "Directions" dropdown — anchors the absolute menu under the trigger.
   Stimulus `dropdown` toggles .is-open on this root element, not the menu. */

.ui-directions-dropdown {
  position: relative;
  display: inline-block;
}

.ui-directions-dropdown__toggle::after {
  content: "▾";
  margin-left: var(--space-1);
  font-size: 0.75em;
}

.ui-directions-dropdown__menu {
  display: none;
  position: absolute;
  top: calc(100% + var(--space-1));
  left: 0;
  z-index: var(--z-dropdown);
  min-width: 12rem;
  padding: var(--space-1) 0;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--color-surface);
  box-shadow: var(--shadow-md);
}

.ui-directions-dropdown.is-open .ui-directions-dropdown__menu {
  display: block;
}

.ui-directions-dropdown__item {
  display: block;
  padding: var(--space-2) var(--space-4);
  font-size: var(--font-size-sm);
  color: var(--color-text);
  text-decoration: none;
  white-space: nowrap;
}

.ui-directions-dropdown__item:hover,
.ui-directions-dropdown__item:focus {
  background: var(--color-surface-alt);
}


/* 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);
  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-icon {
    margin-bottom: var(--space-3);

    .svg {
      width: var(--space-10);
      height: var(--space-10);
      fill: currentColor;
      opacity: 0.4;
      /* Consumer resets may force `svg { display: block }`, which escapes
         the text-align: center of the root — margin-inline keeps a block
         svg centered and is a no-op on an inline one. */
      margin-inline: auto;
    }
  }

  .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;
  }

  .empty-state-cta {
    margin-top: var(--space-5);
  }
}


/* 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);
  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 {
  position: relative;
  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;
}

/* Le rond visible fait 17,6 px (1.1rem, bordure comprise) ; le minimum
   WCAG 2.5.8 (AA) est 24 px. On étend la zone touchable AUTOUR du rond au lieu
   de grossir le rond : l'aspect ne bouge dans aucun consumer, et la cible passe
   la norme.
   ⚠️ Le débord se choisit à la mesure, pas au calcul : 3 px donnent 23,6 px,
   sous la barre. Mesuré au navigateur (WebKit ET Chromium, 390×844, sonde
   elementFromPoint), 0.25rem rend 24,4 px — ça passe, mais 0,4 px de marge se
   perd au premier arrondi d'appareil. 0.3rem rend 26 px. */
.ui-help-tooltip__trigger::before {
  content: "";
  position: absolute;
  inset: -0.3rem;
  border-radius: var(--radius-full);
}

.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 {
  --ui-tooltip-shift: 0;

  position: absolute;
  top: 50%;
  right: calc(100% + var(--space-2));
  transform: translateY(-50%);
  /* Rattrapage horizontal posé par tooltip_controller quand la bulle dépasse
     encore un bord après bascule. `translate` est une propriété distincte de
     `transform` : elle se compose avec le centrage ci-dessus ET avec les
     `transform: none` que certains consumers posent en repositionnant. */
  translate: var(--ui-tooltip-shift);
  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;
}

/* Bascule posée par tooltip_controller quand la bulle sortirait du bord
   gauche du viewport : elle s'ouvre alors à droite du déclencheur. */
.ui-help-tooltip__panel[data-flipped] {
  right: auto;
  left: calc(100% + var(--space-2));
}


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


/* fulgore: ui/icon_label.css */
.ui-icon-label {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
}

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

.ui-icon-label__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}


/* fulgore: ui/inputs/checkbox.css */
.ui-input--checkbox {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: flex-start;
  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;
    justify-content: flex-start;
    gap: var(--space-2);
    cursor: pointer;
    font-size: var(--font-size-sm);
    color: var(--color-text);

    input[type="checkbox"] {
      width: auto;
      flex: none;
      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/file_zone.css */
.ui-inputs-file-zone__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 var(--duration-normal) var(--easing-default),
    background-color var(--duration-normal) var(--easing-default);
}

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

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

.ui-inputs-file-zone__current {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-1);
  margin-bottom: var(--space-2);
}

.ui-inputs-file-zone__current-thumb {
  max-height: 7.5rem;
  border-radius: var(--radius-md);
  object-fit: contain;
}

.ui-inputs-file-zone__current-name {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

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

.ui-inputs-file-zone__zone.has-file .ui-inputs-file-zone__current {
  display: none !important;
}

.ui-inputs-file-zone__preview {
  max-height: 7.5rem;
  margin-bottom: var(--space-2);
  border-radius: var(--radius-md);
  object-fit: contain;
}

.ui-inputs-file-zone__preview[hidden] {
  display: none !important;
}

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

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

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

.ui-inputs-file-zone__filename[hidden] {
  display: none !important;
}

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

.ui-inputs-file-zone__zone.has-file .ui-inputs-file-zone__invite {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-normal);
  color: var(--color-text-subtle);
}


/* 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);
  }

  /* LA ZONE TACTILE, PAS L'ICÔNE. La pastille mesurait 16×16 — la taille de son
     icône, avec `padding: 0` autour. Le minimum WCAG 2.5.8 est 24×24 et Apple
     recommande 44 : sur un téléphone, 16px se rate. On agrandit la ZONE et on
     centre l'icône dedans, qui reste à 1rem : l'apparence ne change pas, la
     cible oui. `right` passe à `--space-1` pour que le carré de 44px reste dans
     le champ, qui fait 45px de haut.
     Mesuré au navigateur sur les écrans d'accès de FBordes, le 2026-08-03.
     ⚠️ CE SIDECAR EST LA COPIE SERVIE. `app/assets/stylesheets/fulgore/
     input.css` porte une seconde définition de `.password-toggle` qui n'est
     chargée nulle part chez les consumers — corriger celle-là seule ne change
     rien à l'écran, contre-épreuve faite le 2026-08-03. Les deux sont tenues
     alignées en attendant qu'on tranche laquelle disparaît. */
  .password-toggle {
    position: absolute;
    right: var(--space-1);
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    width: 44px;
    height: 44px;
    padding: 0;
    cursor: pointer;
    color: var(--color-text-subtle);
    display: flex;
    align-items: center;
    justify-content: 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/range_slider.css */
.filter-field--range-slider {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  flex: 1;
  min-width: 180px;
}

.filter-range-slider__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);
  min-height: 1.2em;
  word-break: break-word;
}

.filter-range-slider__label {
  font-weight: var(--font-weight-semibold);
  color: var(--color-brand-dark);
}

.filter-range-slider__separator {
  color: var(--color-text-subtle);
  flex-shrink: 0;
}

.filter-range-slider__track {
  position: relative;
  height: 28px;
  display: flex;
  align-items: center;
}

.filter-range-slider__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;
}

/* Les deux `input[type=range]` sont superposés en plein cadre et transparents :
   seules leurs poignées reçoivent le pointeur, ce qui laisse les deux
   attrapables sur toute la longueur de la piste. */
.filter-range-slider__thumb {
  position: absolute;
  inset: 0 0 0 0;
  width: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  pointer-events: none;
  -webkit-appearance: none;
  appearance: none;
}

.filter-range-slider__thumb:focus-visible {
  outline: none;
}

.filter-range-slider__thumb::-webkit-slider-runnable-track {
  background: transparent;
  height: 28px;
  border: none;
}

.filter-range-slider__thumb::-moz-range-track {
  background: transparent;
  height: 28px;
  border: none;
}

.filter-range-slider__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;
}

.filter-range-slider__thumb::-webkit-slider-thumb:active {
  cursor: grabbing;
  transform: scale(1.1);
}

.filter-range-slider__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;
}

.filter-range-slider__thumb::-moz-range-thumb:active {
  cursor: grabbing;
  transform: scale(1.1);
}

.filter-range-slider__thumb:focus-visible::-webkit-slider-thumb {
  box-shadow: 0 0 0 3px var(--color-brand-surface);
}

.filter-range-slider__thumb:focus-visible::-moz-range-thumb {
  box-shadow: 0 0 0 3px var(--color-brand-surface);
}

.filter-range-slider__thumb--min {
  z-index: 1;
}

.filter-range-slider__thumb--max {
  z-index: 2;
}


/* fulgore: ui/inputs/rich_text.css */
.ui-input__rich-text {
  min-height: 200px;
  padding: var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  font-family: inherit;
  font-size: var(--font-size-base);
  line-height: 1.5;
  background-color: var(--color-surface);
}

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

.ui-input__rich-text:disabled {
  background-color: var(--color-surface-subtle);
  color: var(--color-text-disabled);
  cursor: not-allowed;
}


/* 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(--font-size-sm);
  cursor: pointer;
}

/* ============================================================
   Mode recherche (UI::Inputs::Select searchable: true)
   Le <select> natif garde .ui-select ci-dessus et reste la valeur
   soumise ; ce bloc n'habille que le déclencheur et le panneau que
   search-select_controller révèle par-dessus lui. `.is-open` est
   posé par dropdown_controller sur la racine .ui-search-select,
   jamais sur le panneau — même convention que row_actions_menu.css
   / directions_dropdown.css (racine.is-open racine__menu).
   ============================================================ */

.ui-search-select {
  position: relative;
  display: block;
  width: 100%;
}

/* Doit rendre comme .ui-select ci-dessus (même bordure, rayon,
   fond, taille de texte) pour qu'un formulaire mixant les deux
   modes reste homogène visuellement. */
.ui-search-select__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  width: 100%;

  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);

  font-size: var(--font-size-sm);
  text-align: left;
  color: var(--color-text);

  background-color: var(--color-surface);

  cursor: pointer;

  /* Le libellé peut déborder (valeur longue) : il se coupe
     proprement, jamais le chevron qui reste visible à droite. */
  span {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    min-width: 0;
  }

  &::after {
    content: "▾";
    flex-shrink: 0;
    font-size: 0.75em; /* pas de token pour une taille relative au glyphe — même valeur que directions_dropdown.css */
    color: var(--color-text-subtle);
  }

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

.ui-search-select__panel {
  display: none;
  flex-direction: column;
  position: absolute;
  top: calc(100% + var(--space-1));
  left: 0;
  right: 0;
  z-index: var(--z-dropdown);

  /* Pas de token de hauteur dédié : borne dérivée de l'espacement
     (~15rem) pour garder ~6-7 options visibles avant de défiler. */
  max-height: calc(var(--space-10) * 6);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;

  /* L'écart intérieur est porté PAR LE PANNEAU, et aucun de ses deux enfants
     ne porte de marge horizontale. C'est délibéré : un enfant de conteneur
     flex étiré prend la largeur du contenu du parent SANS en déduire sa
     propre marge — mesuré ici à 9px à gauche et −7px à droite, un débordement
     que le `overflow: hidden` ci-dessus rogne, donc invisible à l'œil et
     visible seulement à la mesure. Reprendre l'écart en marge sur le champ
     réintroduirait exactement ce défaut. */
  padding: var(--space-2);

  background: var(--color-surface);
  box-shadow: var(--shadow-md);
}

.ui-search-select.is-open .ui-search-select__panel {
  display: flex;
}

.ui-search-select__filter {
  flex-shrink: 0;
  box-sizing: border-box;
  /* Aucune marge horizontale : l'écart vient du padding du panneau (cf. son
     commentaire). Seul l'écart SOUS le champ lui appartient. */
  margin: 0 0 var(--space-2);
  padding: var(--space-2) var(--space-3);

  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);

  font-size: var(--font-size-sm);
  color: var(--color-text);

  background: var(--color-surface);

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

/* Liste bornée + défilante : c'est tout l'intérêt du panneau
   recherche. Le champ de filtre ci-dessus reste fixe (flex-shrink: 0)
   pendant que la liste défile dans l'espace restant. */
.ui-search-select__list {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;

  margin: 0;
  padding: var(--space-1) 0;
  list-style: none;
}

.ui-search-select__option {
  padding: var(--space-2) var(--space-3);

  font-size: var(--font-size-sm);
  color: var(--color-text);

  cursor: pointer;

  /* Survol souris et .is-active (option courante au clavier)
     doivent rester visuellement distincts : les deux peuvent être
     vrais en même temps sur deux lignes différentes. */
  &:hover {
    background: var(--color-surface-alt);
  }

  &.is-active {
    background: var(--color-brand-a10);
    color: var(--color-brand-dark);
  }
}

.ui-search-select__empty {
  margin: 0;
  padding: var(--space-4);

  font-size: var(--font-size-sm);
  text-align: center;
  color: var(--color-text-subtle);
}


/* 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/locale_flag_switch.css */
/* Drapeau SVG du switch de langue. PAS de règle `fill` : les couleurs
   viennent du fichier SVG (contrairement à .svg de UI::Icon qui force
   currentColor). Ratio 4:3 (viewBox 640x480), hauteur fixe pour aligner. */
.ui-locale-flag {
  display: block;
  height: 1.25rem;
  width: auto;
  border-radius: var(--radius-sm);
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
}


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

.ui-locale-switch__link {
  text-transform: uppercase;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
}

/* Sous `include_current`, la langue courante est affichée à côté des autres.
   Sans marque visuelle, deux drapeaux côte à côte ne disent pas lequel est
   actif — le sélecteur redevient muet, ce que l'option cherchait à corriger.
   Ce sont donc les AUTRES qui s'effacent, et le `:has()` limite la règle aux
   switchers qui affichent réellement la langue courante : un switcher sans
   `--current` (le régime par défaut) garde ses liens à pleine opacité. */
.ui-locale-switch:has(.ui-locale-switch__link--current)
  .ui-locale-switch__link:not(.ui-locale-switch__link--current) {
  opacity: 0.55;
}

/* Le survol doit ANNULER l'estompage, pas le retour au survol de `.ui-link`
   (`opacity: 0.7`, plain.css). Un simple `.ui-locale-switch__link:hover` a la
   même spécificité que lui et passe après dans le bundle : il l'aurait écrasé
   partout, y compris sur les switchers qui n'utilisent pas `include_current`.
   Le sélecteur reste donc calqué sur celui de l'estompage.
   La valeur est `1` et non `0.7` : depuis un repos à 0.55, un survol à 0.7 ne
   laisserait que 0.15 d'écart, un signal qu'on ne voit plus. Annuler pour de
   bon est aussi ce que le premier mot de ce commentaire promet. */
.ui-locale-switch:has(.ui-locale-switch__link--current)
  .ui-locale-switch__link:not(.ui-locale-switch__link--current):hover {
  opacity: 1;
}


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


/* fulgore: ui/menu_toggle.css */
.ui-menu-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-full);
  background: none;
  color: var(--color-text);
  cursor: pointer;
  transition: border-color var(--duration-fast) var(--easing-default),
              background-color var(--duration-fast) var(--easing-default);
}

.ui-menu-toggle:hover {
  border-color: var(--color-text-soft);
  background-color: var(--color-surface-alt);
}

.ui-menu-toggle:focus-visible {
  outline: none;
  border-color: var(--color-text-soft);
  box-shadow: var(--focus-ring);
}


/* 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;
  flex-wrap: wrap;
  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);
}

/* Teintes nommées — la couleur est choisie par l'utilisateur d'un consumer,
   le nom ne porte donc aucun sens métier. Les cinq premières doublent
   volontairement une variante sémantique (brand/info/success/danger/warning) :
   « ce que ça veut dire » et « de quelle couleur c'est » sont deux vocabulaires
   distincts, et seul le second est configurable. */
.ui-pill--violet { background: var(--color-violet-100); color: var(--color-violet-700); }
.ui-pill--blue   { background: var(--color-blue-100);   color: var(--color-blue-700); }
.ui-pill--green  { background: var(--color-green-100);  color: var(--color-green-700); }
.ui-pill--red    { background: var(--color-red-100);    color: var(--color-red-700); }
.ui-pill--amber  { background: var(--color-amber-100);  color: var(--color-amber-700); }
.ui-pill--indigo { background: var(--color-indigo-100); color: var(--color-indigo-700); }
.ui-pill--teal   { background: var(--color-teal-100);   color: var(--color-teal-700); }
.ui-pill--lime   { background: var(--color-lime-100);   color: var(--color-lime-700); }
.ui-pill--orange { background: var(--color-orange-100); color: var(--color-orange-700); }
.ui-pill--pink   { background: var(--color-pink-100);   color: var(--color-pink-700); }
.ui-pill--brown  { background: var(--color-brown-100);  color: var(--color-brown-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: var(--space-1) var(--space-3);
  font-weight: var(--font-weight-bold);
  box-shadow: var(--shadow-pill-strong);
}

.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); }

.ui-pill--strong.ui-pill--violet { background: var(--color-violet-600); color: var(--color-neutral-0); }
.ui-pill--strong.ui-pill--blue   { background: var(--color-blue-700);   color: var(--color-neutral-0); }
.ui-pill--strong.ui-pill--green  { background: var(--color-green-500);  color: var(--color-neutral-0); }
.ui-pill--strong.ui-pill--red    { background: var(--color-red-500);    color: var(--color-neutral-0); }
.ui-pill--strong.ui-pill--amber  { background: var(--color-amber-500);  color: var(--color-neutral-0); }
.ui-pill--strong.ui-pill--indigo { background: var(--color-indigo-700); color: var(--color-neutral-0); }
.ui-pill--strong.ui-pill--teal   { background: var(--color-teal-700);   color: var(--color-neutral-0); }
.ui-pill--strong.ui-pill--lime   { background: var(--color-lime-700);   color: var(--color-neutral-0); }
.ui-pill--strong.ui-pill--orange { background: var(--color-orange-700); color: var(--color-neutral-0); }
.ui-pill--strong.ui-pill--pink   { background: var(--color-pink-700);   color: var(--color-neutral-0); }
.ui-pill--strong.ui-pill--brown  { background: var(--color-brown-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-family-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-family-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/row_actions_menu.css */
/* RowActionsMenu — kebab (⋮) dropdown wrapping already-rendered action
   components (UI::Links::* / UI::Buttons::*) as flat, full-width menu rows.
   Stimulus `dropdown` toggles .is-open on this root element, not the menu
   (cf. directions_dropdown.css / dropdown_controller). */

.ui-row-actions-menu {
  position: relative;
  display: inline-block;
}

.ui-row-actions-menu__toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 2rem;
  height: 2rem;
  padding: 0;
  border: none;
  border-radius: var(--radius-md);

  color: var(--color-text-subtle);
  background: transparent;

  cursor: pointer;
  transition: background var(--duration-fast) var(--easing-default),
    color var(--duration-fast) var(--easing-default);

  .svg {
    width: 1.25rem;
    height: 1.25rem;
  }

  &:hover:not(:disabled):not(.ui-row-actions-menu__toggle--disabled) {
    background: var(--color-surface-subtle);
    color: var(--color-text);
  }

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

.ui-row-actions-menu__menu {
  display: none;
  position: absolute;
  top: calc(100% + var(--space-1));
  right: 0;
  z-index: var(--z-dropdown);
  min-width: 12rem;

  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;

  background: var(--color-surface);
  box-shadow: var(--shadow-md);
}

.ui-row-actions-menu.is-open .ui-row-actions-menu__menu {
  display: block;
}

.ui-row-actions-menu__item {
  display: block;
}

/* Neutralize the wrapped action components (ui-link, ui-button — primary/
   secondary/danger, all sizes) back into flat, full-width text menu rows.
   Targets the real classes emitted by UI::Links::Show/Edit/New (<a
   class="ui-button ui-button--{primary,secondary} ui-button--sm">) and
   UI::Buttons::Destroy (<form> root wrapping <button class="ui-button
   ui-button--danger ui-button--sm">). */
.ui-row-actions-menu__item a,
.ui-row-actions-menu__item button,
.ui-row-actions-menu__item form {
  display: block;
  width: 100%;
  box-sizing: border-box;

  margin: 0;
  padding: var(--space-2) var(--space-4);
  border: none;
  border-radius: 0;

  font-size: var(--font-size-sm);
  text-align: left;
  color: var(--color-text);
  text-decoration: none;
  white-space: nowrap;

  background: transparent;
  box-shadow: none;

  cursor: pointer;
}

.ui-row-actions-menu__item a:hover,
.ui-row-actions-menu__item button:hover,
.ui-row-actions-menu__item form:hover {
  background: var(--color-surface-alt);
}

.ui-row-actions-menu__item a:focus-visible,
.ui-row-actions-menu__item button:focus-visible {
  outline: none;
  box-shadow: none;
  background: var(--color-surface-alt);
}

/* The base variant rules (.ui-button.ui-button--primary/secondary/danger,
   specificity 0,2,0) outrank the plain-element resets above (0,1,1) and
   win regardless of concat order — so background/color/hover-background
   from the wrapped button chrome survive unless matched at equal-or-higher
   specificity here. Re-neutralize per variant explicitly. */
.ui-row-actions-menu__item .ui-button--primary,
.ui-row-actions-menu__item .ui-button--secondary,
.ui-row-actions-menu__item .ui-button--danger {
  color: var(--color-text);
  background: transparent;
  border-color: transparent;
}

.ui-row-actions-menu__item .ui-button--primary:hover,
.ui-row-actions-menu__item .ui-button--secondary:hover,
.ui-row-actions-menu__item .ui-button--danger:hover {
  background: var(--color-surface-alt);
  border-color: transparent;
}

/* The wrapped icon (pen-to-square, plus…) rides along the text baseline
   instead of the button's centered flex layout. `display: inline-block`
   defends against a consumer global reset (`svg { display: block }`) that
   would otherwise stack the icon above its label. */
.ui-row-actions-menu__item .svg {
  display: inline-block;
  width: var(--font-size-sm);
  height: var(--font-size-sm);
  margin-right: var(--space-2);
  vertical-align: -0.15em;
}

/* Destroy's <form> is the item's direct child and must not add its own
   padding on top of the <button> it wraps, or add block spacing. */
.ui-row-actions-menu__item form {
  padding: 0;
}

.ui-row-actions-menu__item form button {
  width: 100%;
}

/* Danger row (UI::Buttons::Destroy → .ui-button--danger) keeps a red
   label, overriding the neutral text-color reset above. Source order
   (after the variant reset block) settles the equal-specificity (0,2,0)
   tie in its favor — hover background already comes from the reset
   block above, so only color needs restating here. */
.ui-row-actions-menu__item .ui-button--danger {
  color: var(--color-danger);
}

@media (prefers-reduced-motion: reduce) {
  .ui-row-actions-menu__toggle {
    transition: none;
  }
}


/* 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/shell/navbar.css */
.ui-shell-navbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  height: var(--navbar-height);
  padding: var(--space-1) var(--space-4);
  box-sizing: border-box;
  position: sticky;
  top: 0;
  z-index: var(--z-sticky);
  background: var(--shell-navbar-bg);
  color: var(--shell-navbar-fg);

  .navbar-hamburger { display: none; }
}
@media (max-width: 1023px) {
  .ui-shell-navbar .navbar-hamburger { display: flex; }
}
.navbar-sidebar-toggle {
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border: none;
  border-radius: var(--radius-md);
  color: inherit;
  background: transparent;
  cursor: pointer;
  transition: background var(--duration-fast) var(--easing-default);
  .svg {
    width: var(--icon-size-sm);
    height: var(--icon-size-sm);
    transition: transform var(--duration-fast) var(--easing-default);
  }
  &[aria-expanded="false"] .svg { transform: rotate(180deg); }
  &:hover { background: rgba(255, 255, 255, 0.15); }
  &:focus-visible { outline: none; box-shadow: var(--focus-ring); }
}
.ui-shell-navbar .navbar-sidebar-toggle { display: flex; }
@media (max-width: 1023px) {
  .ui-shell-navbar .navbar-sidebar-toggle { display: none; }
}
.ui-shell-navbar__brand {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  text-decoration: none;
  color: inherit;
}
.ui-shell-navbar__brand-logo { height: 28px; width: auto; }
.ui-shell-navbar__brand-name {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  white-space: nowrap;
}
.navbar-session-email {
  font-size: var(--font-size-sm);
  color: color-mix(in srgb, var(--shell-navbar-fg) 85%, transparent);
  white-space: nowrap;
}
@media (max-width: 1023px) {
  .navbar-session-email { display: none; }
}
.navbar-logout { margin: 0; }
.ui-shell-navbar .navbar-logout .ui-button {
  display: flex;
  align-items: center;
  padding: var(--space-2) var(--space-3);
  border: 1px solid color-mix(in srgb, var(--shell-navbar-fg) 30%, transparent);
  border-radius: var(--radius-sm);
  font-family: inherit;
  font-size: var(--font-size-sm);
  font-weight: inherit;
  color: var(--shell-navbar-fg);
  background: transparent;
  box-shadow: none;
  &:hover:not(:disabled) {
    background: color-mix(in srgb, var(--shell-navbar-fg) 15%, transparent);
    color: var(--shell-navbar-fg);
  }
  &:focus-visible { outline: none; box-shadow: var(--focus-ring); }
}


/* fulgore: ui/shell/sidebar.css */
.ui-shell-sidebar {
  position: fixed;
  top: var(--navbar-height);
  left: 0;
  bottom: 0;
  z-index: var(--z-raised);
  width: var(--sidebar-width);
  max-width: 80vw;
  box-sizing: border-box;
  overflow-x: hidden;
  overflow-y: auto;
  padding: var(--space-6) var(--space-4);
  border-right: 1px solid var(--color-border);
  box-shadow: var(--shadow-lg);
  background: var(--color-surface-subtle);
  transform: translateX(-100%);
  transition: transform var(--duration-slow) var(--easing-out);
  nav { display: flex; flex-direction: column; gap: var(--space-2); }
  &.is-compact, &.is-expanded { transform: translateX(0); }
}
@media (min-width: 1024px) {
  .ui-shell-sidebar {
    position: sticky;
    top: var(--navbar-height);
    left: auto;
    bottom: auto;
    height: calc(100dvh - var(--navbar-height));
    max-width: none;
    width: var(--sidebar-width);
    flex-shrink: 0;
    align-self: flex-start;
    box-shadow: none;
    transform: none;
    transition: width var(--duration-slow) var(--easing-out);
  }
  .ui-shell-sidebar.is-compact {
    width: var(--sidebar-compact-width);
    padding: var(--space-6) var(--space-3);
  }
  .ui-shell-sidebar.is-expanded { width: var(--sidebar-width); }
  .ui-shell-sidebar.is-compact .ui-shell-sidebar__link {
    justify-content: center;
    padding: var(--space-3);
  }
  .ui-shell-sidebar.is-compact .sidebar-link__label { display: none; }
  .ui-shell-sidebar.is-compact .sidebar-section__heading { display: none; }
  .ui-shell-sidebar.is-compact .sidebar-section.is-collapsed .sidebar-section__items { display: flex; }
}
@media (prefers-reduced-motion: reduce) {
  .ui-shell-sidebar,
  .ui-shell-sidebar .sidebar-section__toggle .svg { transition: none; }
}
.sidebar-section {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding-top: var(--space-4);
}
.sidebar-section:first-of-type { padding-top: var(--space-2); }
.sidebar-section__heading { margin: 0; }
.sidebar-section__toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  width: 100%;
  padding: var(--space-1) var(--space-3);
  border: none;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-text-subtle);
  background: transparent;
  cursor: pointer;
  transition: color var(--duration-fast) var(--easing-default);
  .svg {
    width: var(--icon-size-sm);
    height: var(--icon-size-sm);
    flex-shrink: 0;
    transition: transform var(--duration-fast) var(--easing-default);
  }
  &:hover { color: var(--color-text); }
  &:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--radius-sm); }
}
.sidebar-section.is-collapsed .sidebar-section__toggle .svg { transform: rotate(-90deg); }
.sidebar-section__items { display: flex; flex-direction: column; gap: var(--space-2); }
.sidebar-section.is-collapsed .sidebar-section__items { display: none; }
.ui-shell-sidebar__link {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  text-decoration: none;
  font-size: var(--font-size-sm);
  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);
  .svg { width: var(--icon-size-sm); height: var(--icon-size-sm); flex-shrink: 0; }
  &:hover:not(.ui-shell-sidebar__link--active) {
    background: var(--color-surface-raised);
    color: var(--color-text);
  }
  &:focus-visible { outline: none; box-shadow: var(--focus-ring); }
}
.ui-shell-sidebar__link--active {
  background: var(--color-brand-surface);
  color: var(--color-brand);
  font-weight: var(--font-weight-semibold);
}
.sidebar-link__label { display: inline; }


/* 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 ──
 *
 * PAS un sidecar orphelin : aucun stat_grid.rb n'existe et c'est voulu.
 * `.ui-stat-grid` est une layout utilitaire cross-composant, émise par
 * UI::Bases::StatCard (qui a par ailleurs son propre sidecar
 * bases/stat_card.css) et écrite en dur chez des consumers (Fatima
 * admin/orders/*_section, FBordes manage/dashboard). La purger ou la
 * renommer casse leur rendu sans erreur Ruby. */

.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);
  overflow-x: auto;
  border-bottom: 1px solid var(--color-border);
  margin-bottom: var(--space-4);
  scrollbar-width: none;
}

.ui-tabs__list::-webkit-scrollbar {
  display: none;
}

.ui-tabs__tab {
  flex-shrink: 0;
  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);
  white-space: nowrap;
  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/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/accept_invitation_form_intro.css */
.auth-accept-invitation-form-intro {
  padding: var(--space-4);
  background-color: var(--color-surface-subtle);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-6);
}

.auth-accept-invitation-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);
}

.auth-accept-invitation-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);
}

.auth-accept-invitation-form-intro__steps {
  margin: 0;
  padding-left: var(--space-6);
  list-style-type: decimal;
}

.auth-accept-invitation-form-intro__step {
  font-size: var(--font-size-sm);
  color: var(--color-text);
  line-height: var(--line-height-normal);
  margin-bottom: var(--space-2);
}

.auth-accept-invitation-form-intro__step:last-child {
  margin-bottom: 0;
}

.auth-accept-invitation-form-intro__privacy {
  margin: var(--space-4) 0 0;
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  line-height: var(--line-height-normal);
}

.auth-accept-invitation-form-intro__privacy a {
  color: var(--color-text-subtle);
}

@media (min-width: 640px) {
  .auth-accept-invitation-form-intro {
    padding: var(--space-6);
    margin-bottom: var(--space-8);
  }
}


/* 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;
  }
}


/* member/home.css */
.member-home__section + .member-home__section {
  margin-block-start: var(--space-8);
}

.member-home__matters {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.member-home__matter {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  background: var(--color-surface-subtle);
}

.member-home__matter-name {
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.member-home__matter-title {
  margin: 0 0 var(--space-2);
}

.member-home__resting {
  color: var(--color-text-subtle);
}


/* 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/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/composition_callout.css */
.notary-matters-composition-callout {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-6);
  background: var(--color-brand-surface);
  border: 1px solid var(--color-brand);
  border-radius: var(--radius-lg);
  margin-bottom: var(--space-6);
}

.notary-matters-composition-callout__content {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  min-width: 0;
}

.notary-matters-composition-callout__heading {
  margin: 0;
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.notary-matters-composition-callout__description {
  margin: 0;
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

@media (min-width: 640px) {
  .notary-matters-composition-callout {
    flex-wrap: nowrap;
  }
}


/* 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.copy-button--copied {
  color: var(--color-success);
  border-color: var(--color-success);
}


/* notary/matters/creation_choice.css */
.notary-matters-creation-choice {
  container-type: inline-size;
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.notary-matters-creation-choice__options {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

@container (min-width: 640px) {
  .notary-matters-creation-choice__options {
    flex-direction: row;
  }
}

.notary-matters-creation-choice__option {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  text-align: left;
  padding: var(--space-5) var(--space-6);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  cursor: pointer;
  transition: border-color var(--duration-fast) var(--easing-default),
    box-shadow var(--duration-fast) var(--easing-default);
}

.notary-matters-creation-choice__option:hover {
  border-color: var(--color-brand);
}

.notary-matters-creation-choice__option:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

.notary-matters-creation-choice__option--selected {
  border-color: var(--color-brand);
  background: var(--color-brand-surface);
  box-shadow: var(--shadow-sm);
}

.notary-matters-creation-choice__option-title {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-matters-creation-choice__option-description {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  margin: 0;
}

.notary-matters-creation-choice__placeholder {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  text-align: center;
  padding: var(--space-6);
  border: 1px dashed var(--color-border);
  border-radius: var(--radius-lg);
}

.notary-matters-creation-choice__panel {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding: var(--space-5) var(--space-6);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: var(--color-surface-subtle);
}

/* le display:flex ci-dessus écrase le display:none UA de [hidden] — garde-fou */
.notary-matters-creation-choice__panel[hidden] {
  display: none;
}

.notary-matters-creation-choice__steps {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  margin: 0;
  padding-left: var(--space-6);
  color: var(--color-text);
  font-size: var(--font-size-sm);
}


/* 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;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
}

.notary-matters-documents-checklist-item-row__link {
  display: flex;
  flex-wrap: wrap;
  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/diagnostic_extras.css */
.notary-matters-documents-diagnostic-extras {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background-color: var(--color-surface-subtle);
}

.notary-matters-documents-diagnostic-extras__heading {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-matters-documents-diagnostic-extras__list {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  margin: 0;
}

.notary-matters-documents-diagnostic-extras__row {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.notary-matters-documents-diagnostic-extras__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;
  margin: 0;
}

.notary-matters-documents-diagnostic-extras__value {
  font-size: var(--font-size-sm);
  color: var(--color-text);
  margin: 0;
}


/* notary/matters/documents/diagnostic_form.css */
.notary-matters-documents-diagnostic-form {
  margin-top: var(--space-4);
}

.notary-matters-documents-diagnostic-form__heading {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0 0 var(--space-2);
}


/* 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-detail__meta--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__image:focus-visible {
  outline: 2px solid var(--color-brand);
  outline-offset: 2px;
}

.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__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--space-6);
  align-items: start;
}

.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));
}

.notary-matters-documents-index__privacy {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  line-height: var(--line-height-normal);
  margin: 0;
}

.notary-matters-documents-index__privacy a {
  color: var(--color-text-subtle);
}

@media (max-width: 768px) {
  .notary-matters-documents-index__body {
    grid-template-columns: minmax(0, 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__badges {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.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-family-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-section--collapsible > summary.notary-matters-documents-section__header {
  cursor: pointer;
  list-style: none;
}

.notary-matters-documents-section--collapsible > summary::-webkit-details-marker {
  display: none;
}

.notary-matters-documents-section__toggle-icon {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  transition: transform var(--duration-fast) var(--easing-default);
  flex-shrink: 0;
}

.notary-matters-documents-section--collapsible[open] > summary .notary-matters-documents-section__toggle-icon {
  transform: rotate(180deg);
}

.notary-matters-documents-section--auto {
  border-left-color: var(--color-neutral-500);
}

.notary-matters-documents-section--pro {
  border-left-color: var(--color-brand);
}


/* 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;
}

.notary-matters-documents-show__regenerating {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-4);
  padding: var(--space-8);
  height: 100%;
}

.notary-matters-documents-show__regenerating-text {
  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/type_actions.css */
.notary-matters-documents-type-actions {
  display: flex;
  gap: var(--space-3);
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-border);
}

/* Re-récupérer est un <form> (button_to), Choisir-la-parcelle un <button> :
   les deux occupent une part égale, et le bouton interne du form s'étire. */
.notary-matters-documents-type-actions > form,
.notary-matters-documents-type-actions > button {
  flex: 1;
}

.notary-matters-documents-type-actions > form {
  display: flex;
}

.notary-matters-documents-type-actions > form .ui-button {
  flex: 1;
}


/* 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/documents/zone_gauges.css */
.notary-matters-documents-zone-gauges {
  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-zone-gauges__row {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.notary-matters-documents-zone-gauges__row-header {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.notary-matters-documents-zone-gauges__icon {
  font-size: var(--font-size-sm);
  flex-shrink: 0;
}

.notary-matters-documents-zone-gauges__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
  flex: 1;
  min-width: 0;
}

.notary-matters-documents-zone-gauges__count {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  flex-shrink: 0;
}


/* 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__aspect-disabled {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-2);
  opacity: 0.55;
  position: relative;
}

/* Le tooltip d'aide sort du flux : il n'ajoute plus de hauteur à la cellule
   adverse, donc toute la rangée reste à la hauteur des jauges (uniformité). */
.notary-matters-global-progress__aspect-disabled .ui-help-tooltip {
  position: absolute;
  top: var(--space-2);
  right: var(--space-2);
}

.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-surface-subtle);
  border: 1px solid var(--color-border);
  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-subtle);
  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);
}

.notary-matters-parties-list__table tbody tr {
  border-bottom: 1px solid var(--color-neutral-100);
}

.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);
  white-space: nowrap;
  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);
  white-space: nowrap;
  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__link-actions {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.notary-matters-parties-list__actions-header {
  width: 1%;
}

.notary-matters-parties-list__badge--you {
  display: inline-flex;
  align-items: center;
  margin-inline-start: var(--space-2);
  padding: 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-surface);
  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-pending-actions__hero {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-4);
  padding: var(--space-5) var(--space-4);
  border-radius: var(--radius-lg);
  text-align: center;
  background: var(--color-brand-surface);
}

.notary-matters-pending-actions__hero-icon {
  flex-shrink: 0;
  font-size: var(--font-size-4xl);
  line-height: 1;
}

.notary-matters-pending-actions__hero-content {
  display: flex;
  flex-direction: column;
  align-self: stretch;
  gap: var(--space-1);
}

.notary-matters-pending-actions__hero-content > .ui-bases-progress-bar {
  width: 100%;
  margin-top: var(--space-2);
}

.notary-matters-pending-actions__hero-label {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.notary-matters-pending-actions__hero-detail {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.notary-matters-pending-actions__rest {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  margin-top: var(--space-4);
}


/* 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/dates_section.css */
.notary-matters-settings-dates-section {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.notary-matters-settings-dates-section__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-5) var(--space-6);
  border-bottom: 1px solid var(--color-border);
}

.notary-matters-settings-dates-section__header-left {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

.notary-matters-settings-dates-section__title {
  margin: 0;
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.notary-matters-settings-dates-section__body {
  padding: var(--space-5) var(--space-6);
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}

.notary-matters-settings-dates-section__form-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4);
}

.notary-matters-settings-dates-section__form-field {
  display: flex;
  flex-direction: column;
}

.notary-matters-settings-dates-section__detail-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--space-2);
  font-size: var(--font-size-sm);
  min-width: 0;
}

.notary-matters-settings-dates-section__detail-label {
  color: var(--color-text-subtle);
  flex-shrink: 0;
}

.notary-matters-settings-dates-section__detail-value {
  color: var(--color-text);
  text-align: right;
  word-break: break-word;
}

.notary-matters-settings-dates-section__detail-value--empty {
  color: var(--color-text-disabled);
}

@media (max-width: 640px) {
  .notary-matters-settings-dates-section__form-grid-2 {
    grid-template-columns: 1fr;
  }

  .notary-matters-settings-dates-section__body {
    padding: var(--space-4);
  }

  .notary-matters-settings-dates-section__header {
    padding: var(--space-4);
  }
}


/* notary/matters/settings/mandate_section.css */
.notary-matters-settings-mandate-section {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.notary-matters-settings-mandate-section--readonly {
  background: var(--color-surface-subtle);
  border-color: var(--color-neutral-200);
}

.notary-matters-settings-mandate-section--readonly .notary-matters-settings-mandate-section__header {
  background: var(--color-surface-raised);
}

.notary-matters-settings-mandate-section__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-5) var(--space-6);
  border-bottom: 1px solid var(--color-border);
}

.notary-matters-settings-mandate-section__header-left {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

.notary-matters-settings-mandate-section__title {
  margin: 0;
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.notary-matters-settings-mandate-section__body {
  padding: var(--space-5) var(--space-6);
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}

.notary-matters-settings-mandate-section__agency-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: 3px var(--space-3);
  border-radius: var(--radius-full);
  background: var(--color-violet-50);
  border: 1px solid var(--color-violet-200);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-violet-700);
  white-space: nowrap;
  flex-shrink: 0;
}

.notary-matters-settings-mandate-section__agency-badge-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--color-brand);
  flex-shrink: 0;
}

.notary-matters-settings-mandate-section__field-group {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}

.notary-matters-settings-mandate-section__field-group-title {
  margin: 0;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-text-subtle);
}

.notary-matters-settings-mandate-section__form-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4);
}

.notary-matters-settings-mandate-section__form-field {
  display: flex;
  flex-direction: column;
}

.notary-matters-settings-mandate-section__section-title {
  margin: 0;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-text-subtle);
}

.notary-matters-settings-mandate-section__detail-rows {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.notary-matters-settings-mandate-section__detail-rows + .notary-matters-settings-mandate-section__detail-rows {
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-border);
  margin-top: var(--space-1);
}

.notary-matters-settings-mandate-section__detail-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--space-2);
  font-size: var(--font-size-sm);
  min-width: 0;
}

.notary-matters-settings-mandate-section__detail-label {
  color: var(--color-text-subtle);
  flex-shrink: 0;
}

.notary-matters-settings-mandate-section__detail-value {
  color: var(--color-text);
  text-align: right;
  word-break: break-word;
}

.notary-matters-settings-mandate-section__detail-value--empty {
  color: var(--color-text-disabled);
}

@media (max-width: 640px) {
  .notary-matters-settings-mandate-section__form-grid-2 {
    grid-template-columns: 1fr;
  }

  .notary-matters-settings-mandate-section__body {
    padding: var(--space-4);
  }

  .notary-matters-settings-mandate-section__header {
    padding: var(--space-4);
  }
}


/* notary/matters/settings/panel.css */
.notary-matters-settings-panel {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.notary-matters-settings-panel__header {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  margin-bottom: var(--space-8);
}

.notary-matters-settings-panel__eyebrow {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.notary-matters-settings-panel__header-row {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  flex-wrap: wrap;
}

.notary-matters-settings-panel__title {
  margin: 0;
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
  line-height: 1.2;
}

.notary-matters-settings-panel__footer {
  padding: var(--space-5) var(--space-6);
  border-top: 1px solid var(--color-border);
  background: var(--color-surface-subtle);
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
  display: flex;
  justify-content: flex-end;
}

@media (max-width: 640px) {
  .notary-matters-settings-panel__title {
    font-size: var(--font-size-xl);
  }
}


/* notary/matters/settings/price_section.css */
.notary-matters-settings-price-section {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.notary-matters-settings-price-section__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-5) var(--space-6);
  border-bottom: 1px solid var(--color-border);
}

.notary-matters-settings-price-section__header-left {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

.notary-matters-settings-price-section__title {
  margin: 0;
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.notary-matters-settings-price-section__body {
  padding: var(--space-5) var(--space-6);
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}

.notary-matters-settings-price-section__price-primary-wrapper {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding: var(--space-4) var(--space-5);
  background: var(--color-brand-surface);
  border-radius: var(--radius-md);
  border: 1.5px solid var(--color-violet-200);
}

.notary-matters-settings-price-section__secondary-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-3);
}

.notary-matters-settings-price-section__secondary-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding: var(--space-3) var(--space-4);
  background: var(--color-surface-raised);
  border-radius: var(--radius-md);
  border: 1px solid var(--color-border);
}

.notary-matters-settings-price-section__secondary-label {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.notary-matters-settings-price-section__secondary-amount {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-subtle);
  font-variant-numeric: tabular-nums;
}

.notary-matters-settings-price-section__empty {
  color: var(--color-text-disabled);
  font-weight: var(--font-weight-normal);
  font-size: var(--font-size-sm);
}

.notary-matters-settings-price-section__agency-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: 3px var(--space-3);
  border-radius: var(--radius-full);
  background: var(--color-violet-50);
  border: 1px solid var(--color-violet-200);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-violet-700);
  white-space: nowrap;
  flex-shrink: 0;
}

.notary-matters-settings-price-section__agency-badge-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--color-brand);
  flex-shrink: 0;
}

@media (max-width: 640px) {
  .notary-matters-settings-price-section__secondary-grid {
    grid-template-columns: 1fr;
  }

  .notary-matters-settings-price-section__body {
    padding: var(--space-4);
  }

  .notary-matters-settings-price-section__header {
    padding: var(--space-4);
  }
}


/* notary/matters/settings/title_field.css */
.notary-matters-settings-title-field {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.notary-matters-settings-title-field__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-5) var(--space-6);
  border-bottom: 1px solid var(--color-border);
}

.notary-matters-settings-title-field__header-left {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

.notary-matters-settings-title-field__title {
  margin: 0;
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.notary-matters-settings-title-field__body {
  padding: var(--space-5) var(--space-6);
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}

.notary-matters-settings-title-field__detail-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--space-2);
  font-size: var(--font-size-sm);
  min-width: 0;
}

.notary-matters-settings-title-field__detail-label {
  color: var(--color-text-subtle);
  flex-shrink: 0;
}

.notary-matters-settings-title-field__detail-value {
  color: var(--color-text);
  text-align: right;
  word-break: break-word;
}

.notary-matters-settings-title-field__detail-value--empty {
  color: var(--color-text-disabled);
}

.notary-matters-settings-title-field__footer {
  padding: var(--space-5) var(--space-6);
  border-top: 1px solid var(--color-border);
  background: var(--color-surface-subtle);
  display: flex;
  justify-content: flex-end;
}

.notary-matters-settings-title-field__footer-hint {
  font-size: var(--font-size-xs);
  color: var(--color-text-subtle);
}

@media (max-width: 640px) {
  .notary-matters-settings-title-field__body {
    padding: var(--space-4);
  }

  .notary-matters-settings-title-field__header {
    padding: var(--space-4);
  }

  .notary-matters-settings-title-field__footer {
    padding: var(--space-4);
  }
}


/* 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--first {
  transform: none;
  align-items: flex-start;
  text-align: left;
}

.notary-matters-timeline-frise__label--last {
  transform: translateX(-100%);
  align-items: flex-end;
  text-align: right;
}

.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;
}

/* Colonnes content-indépendantes (mêmes pistes pour chaque ligne) → les coches
   tombent sous les en-têtes sans dépendre de subgrid (fragile en WebKit nested). */
.notary-office-role-permissions__row {
  display: grid;
  grid-template-columns: minmax(6rem, 2fr) repeat(3, minmax(4.5rem, 1fr));
  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/body.css */
.notary-parties-buyer-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-buyer-cards-body__section {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
}

.notary-parties-buyer-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-buyer-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-buyer-cards-body__tag--empty {
  border-style: dashed;
  background-color: transparent;
}

.notary-parties-buyer-cards-body__label {
  font-weight: var(--font-weight-medium);
  color: var(--color-brand-light);
}

.notary-parties-buyer-cards-body__tag--empty .notary-parties-buyer-cards-body__label {
  color: var(--color-text-disabled);
}

.notary-parties-buyer-cards-body__value {
  font-weight: var(--font-weight-normal);
  color: var(--color-text-subtle);
}


/* 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_cards/header.css */
.notary-parties-buyer-cards-header {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-5);
}

.notary-parties-buyer-cards-header__top {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.notary-parties-buyer-cards-header__name {
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--color-text);
}

.notary-parties-buyer-cards-header__spouse {
  font-size: var(--text-xs);
  color: var(--color-text-muted);
}


/* notary/parties/buyer_cards/spouse_link.css */
.notary-parties-buyer-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-buyer-cards-spouse-link__icon {
  font-size: var(--font-size-sm);
  line-height: 1;
}

.notary-parties-buyer-cards-spouse-link__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}


/* 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);
}

.notary-parties-buyers-global-progress__heading {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-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__aspects {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-3);
}


/* notary/parties/buyers/show.css */
.notary-parties-buyers-show {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.notary-parties-buyers-show__header {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-parties-buyers-show__context {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.notary-parties-buyers-show__screen-label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-parties-buyers-show__matter,
.notary-parties-buyers-show__role {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  margin: 0;
}

.notary-parties-buyers-show__layout {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.notary-parties-buyers-show__row-overview {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: start;
  gap: var(--space-6);
}

.notary-parties-buyers-show__row-main {
  display: grid;
  grid-template-columns: 2fr 1fr;
  align-items: start;
  gap: var(--space-6);
}

.notary-parties-buyers-show__content {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.notary-parties-buyers-show__aside {
  min-width: 0;
}

.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);
}

.notary-parties-buyers-show__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-4);
  padding: var(--space-10) var(--space-4);
}

@media (max-width: 1024px) {
  .notary-parties-buyers-show__row-main {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .notary-parties-buyers-show__row-overview {
    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);
}

.notary-parties-sellers-global-progress__heading {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-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__aspects {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-3);
}

@media (max-width: 767px) {
  .notary-parties-sellers-global-progress__aspects {
    grid-template-columns: repeat(2, 1fr);
  }
}


/* notary/parties/sellers/show.css */
.notary-parties-sellers-show {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.notary-parties-sellers-show__header {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-parties-sellers-show__context {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.notary-parties-sellers-show__screen-label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-parties-sellers-show__matter,
.notary-parties-sellers-show__role {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  margin: 0;
}

.notary-parties-sellers-show__layout {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.notary-parties-sellers-show__row-overview {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: start;
  gap: var(--space-6);
}

.notary-parties-sellers-show__row-main {
  display: grid;
  grid-template-columns: 2fr 1fr;
  align-items: start;
  gap: var(--space-6);
}

.notary-parties-sellers-show__content {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.notary-parties-sellers-show__aside {
  min-width: 0;
}

.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);
}

.notary-parties-sellers-show__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-4);
  padding: var(--space-10) var(--space-4);
}

@media (max-width: 1024px) {
  .notary-parties-sellers-show__row-main {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .notary-parties-sellers-show__row-overview {
    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/aspect_gauge.css */
.notary-properties-aspect-gauge {
  position: relative;
}

/* Le déclencheur d'infobulle est frère de la tuile (HTML valide), mais doit se
   lire comme posé dessus — d'où le positionnement absolu plutôt qu'un flux. */
.notary-properties-aspect-gauge .ui-help-tooltip {
  position: absolute;
  top: var(--space-2);
  right: var(--space-2);
}

.notary-properties-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-properties-aspect-gauge__link:disabled {
  cursor: default;
}

.notary-properties-aspect-gauge__link:not(:disabled):hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}

.notary-properties-aspect-gauge__link:not(:disabled):active {
  transform: translateY(0);
  box-shadow: var(--shadow-sm);
}

/* Override loading-link spinner: overlay centered */
.notary-properties-aspect-gauge__link.loading-link--loading::after {
  position: absolute;
  inset: 0;
  margin: auto;
  width: 1.5rem;
  height: 1.5rem;
}

.notary-properties-aspect-gauge__link.loading-link--loading .ui-gauge {
  opacity: 0.3;
}


/* notary/properties/cadastral_candidate_item.css */
.notary-properties-cadastral-candidate-item {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-3);
  background-color: var(--color-surface-subtle);
  border-radius: var(--radius-md);
}

.notary-properties-cadastral-candidate-item__checkbox {
  flex-shrink: 0;
  width: var(--icon-size-md);
  height: var(--icon-size-md);
  margin-top: 0.125rem;
  cursor: pointer;
  accent-color: var(--color-brand);
}

.notary-properties-cadastral-candidate-item__label {
  flex: 1;
  margin: 0;
  cursor: pointer;
  font-size: var(--font-size-base);
  color: var(--color-text);
}


/* notary/properties/cadastral_candidate_picker.css */
.notary-properties-cadastral-candidate-picker {
  display: block;
  text-align: left;
}

.notary-properties-cadastral-candidate-picker__plan {
  width: 100%;
  height: 340px;
  margin-bottom: var(--space-6);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
}

.notary-properties-cadastral-candidate-picker__legend {
  display: block;
  margin-bottom: var(--space-3);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  font-size: var(--font-size-base);
}

.notary-properties-cadastral-candidate-picker__candidates-fieldset,
.notary-properties-cadastral-candidate-picker__manual-fieldset {
  border: none;
  padding: 0;
  margin: 0 0 var(--space-6) 0;
}

.notary-properties-cadastral-candidate-picker__candidates-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  margin-bottom: var(--space-4);
}

.notary-properties-cadastral-candidate-picker__no-candidates {
  color: var(--color-text-subtle);
  font-size: var(--font-size-sm);
  margin: 0;
}

.notary-properties-cadastral-candidate-picker__manual-inputs {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.notary-properties-cadastral-candidate-picker__input {
  padding: var(--space-2) var(--space-3);
  font-size: var(--font-size-base);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  color: var(--color-text);
  background-color: var(--color-surface);
}

.notary-properties-cadastral-candidate-picker__input:focus {
  outline: none;
  border-color: var(--color-brand);
  box-shadow: var(--focus-ring);
}

.notary-properties-cadastral-candidate-picker__manual-field {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.notary-properties-cadastral-candidate-picker__manual-label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}

.notary-properties-cadastral-candidate-picker__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-border);
}

.notary-properties-cadastral-candidate-picker__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-properties-cadastral-candidate-picker__cancel:hover {
  background-color: var(--color-surface-subtle);
  color: var(--color-text);
}

.notary-properties-cadastral-candidate-picker__submit {
  padding: var(--space-2) var(--space-4);
  font-size: var(--font-size-base);
  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-md);
  cursor: pointer;
}


/* notary/properties/cadastral_modal.css */
/* Correctif : ui-modal__title n'est pas stylé côté fulgore (titre h2 brut).
   Règle globale en attendant la promotion dans fulgore. */
.ui-modal__title {
  margin: 0;
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}


/* notary/properties/cadastral_reference_section.css */
.notary-properties-cadastral-reference-section {
  padding: var(--space-4);
}

.notary-properties-cadastral-reference-section__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  margin-bottom: var(--space-4);
}

.notary-properties-cadastral-reference-section__heading {
  margin: 0;
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.notary-properties-cadastral-reference-section__trigger {
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: transparent;
  color: var(--color-brand);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  white-space: nowrap;
  cursor: pointer;
}

.notary-properties-cadastral-reference-section__trigger:hover {
  background: var(--color-surface-subtle);
}

.notary-properties-cadastral-reference-section__parcels {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.notary-properties-cadastral-reference-section__chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}

.notary-properties-cadastral-reference-section__chip {
  display: inline-block;
  padding: var(--space-2) var(--space-3);
  background-color: var(--color-surface-subtle);
  border-radius: var(--radius-md);
  font-size: var(--font-size-sm);
  color: var(--color-text);
  font-weight: var(--font-weight-medium);
}

.notary-properties-cadastral-reference-section__empty {
  padding: var(--space-4) 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-properties-cadastral-reference-section__plan {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  align-items: flex-start;
}

.notary-properties-cadastral-reference-section__plan-frame {
  width: 100%;
  height: 60vh;
  min-height: 320px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
}

.notary-properties-cadastral-reference-section__plan-pending {
  margin: 0;
  font-size: var(--font-size-sm);
  font-style: italic;
  color: var(--color-text-subtle);
}


/* 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/gauges_panel.css */
.notary-properties-gauges-panel {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.notary-properties-gauges-panel__heading {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}

.notary-properties-gauges-panel__overall {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.notary-properties-gauges-panel__aspects {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-3);
}

@media (max-width: 768px) {
  .notary-properties-gauges-panel__aspects {
    grid-template-columns: repeat(2, 1fr);
  }
}


/* 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__lots-recap {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  margin: 0;
}


/* 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-georisques-panel__erp-link {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  color: var(--color-brand);
  text-decoration: none;
  font-weight: var(--font-weight-medium);
  padding: var(--space-3) 0;
}

.notary-properties-location-context-georisques-panel__erp-link:hover {
  text-decoration: underline;
}


/* 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>. */
picture.notary-properties-photo-gallery__image {
  display: contents;
}

/* Le wrapper porte le focus clavier : il lui faut une vraie boîte.
   `display: contents` n'en génère aucune — l'élément devient alors
   infocusable, `role`/`tabindex` compris (mesuré WebKit ET Chromium). */
.notary-properties-photo-gallery__image-wrapper {
  display: block;
  width: 100%;
  height: 100%;
}

/* L'anneau se dessine vers l'intérieur : `__item` clippe (overflow: hidden). */
.notary-properties-photo-gallery__image-wrapper:focus-visible {
  outline: 2px solid var(--color-brand);
  outline-offset: -2px;
}

/* 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-a10);
}

/* 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__row-main {
  display: grid;
  grid-template-columns: 2fr 1fr;
  align-items: start;
  gap: var(--space-6);
}

.notary-properties-show__content {
  min-width: 0;
}

.notary-properties-show__aside {
  min-width: 0;
}

@media (max-width: 1024px) {
  .notary-properties-show__row-main {
    grid-template-columns: 1fr;
  }
}

.notary-properties-show__lots {
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.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: 768px) {
  .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;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.notary-properties-unit-card .notary-properties-unit-cards-footer {
  margin-top: auto;
}


/* 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;
}


/* 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/property_risk_declarations/form_intro.css */
.notary-property-risk-declarations-form-intro {
  padding: var(--space-4);
  background-color: var(--color-surface-subtle);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-6);
}

.notary-property-risk-declarations-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);
}

.notary-property-risk-declarations-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);
}

.notary-property-risk-declarations-form-intro__steps {
  margin: 0;
  padding-left: var(--space-6);
  list-style-type: decimal;
}

.notary-property-risk-declarations-form-intro__step {
  font-size: var(--font-size-sm);
  color: var(--color-text);
  line-height: var(--line-height-normal);
  margin-bottom: var(--space-2);
}

.notary-property-risk-declarations-form-intro__step:last-child {
  margin-bottom: 0;
}

@media (min-width: 640px) {
  .notary-property-risk-declarations-form-intro {
    padding: var(--space-6);
    margin-bottom: var(--space-8);
  }
}


/* 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/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;
}


/* 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/reminders/editor.css */
.notary-prospects-reminders-editor {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-prospects-reminders-editor__heading {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
  padding: 0;
}

.notary-prospects-reminders-editor__empty {
  color: var(--color-text-subtle);
  font-size: var(--font-size-sm);
  margin: 0;
  padding: var(--space-3) 0;
}

.notary-prospects-reminders-editor__reminders {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.notary-prospects-reminders-editor__group {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.notary-prospects-reminders-editor__group--done {
  opacity: 0.6;
}

.notary-prospects-reminders-editor__row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-3);
  background-color: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
}

.notary-prospects-reminders-editor__info {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-3);
  flex: 1;
  min-width: 0;
}

.notary-prospects-reminders-editor__label {
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}

.notary-prospects-reminders-editor__date {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}

.notary-prospects-reminders-editor__actions {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-shrink: 0;
}

.notary-prospects-reminders-editor__form {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-2);
}

.notary-prospects-reminders-editor__input {
  flex: 1;
  min-width: 0;
  padding: var(--space-2) var(--space-3);
  font-size: var(--font-size-sm);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background-color: var(--color-surface);
  color: var(--color-text);
}

.notary-prospects-reminders-editor__input::placeholder {
  color: var(--color-text-subtle);
}

.notary-prospects-reminders-editor__input:focus {
  outline: none;
  border-color: var(--color-border-strong);
  background-color: var(--color-surface-raised);
  box-shadow: var(--focus-ring);
}


/* 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/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:focus-visible {
  outline: 2px solid var(--color-brand);
  outline-offset: 2px;
}

.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;
}


/* public/static_pages/privacy_policy.css */
.public-static-pages-privacy-policy {
  max-width: 42rem;
  margin: var(--space-16) auto;
  padding: 0 var(--space-4);
  display: flex;
  flex-direction: column;
  gap: var(--space-6);
}

.public-static-pages-privacy-policy__title {
  font-size: var(--font-size-3xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
  margin: 0;
}

.public-static-pages-privacy-policy__intro {
  font-size: var(--font-size-base);
  color: var(--color-text-subtle);
  line-height: var(--line-height-normal);
  margin: 0;
}

.public-static-pages-privacy-policy__section {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.public-static-pages-privacy-policy__section-title {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  margin: 0;
}

.public-static-pages-privacy-policy__section p {
  font-size: var(--font-size-base);
  color: var(--color-text);
  line-height: var(--line-height-normal);
  margin: 0;
}

.public-static-pages-privacy-policy__list {
  margin: 0;
  padding-left: var(--space-6);
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.public-static-pages-privacy-policy__list li {
  font-size: var(--font-size-base);
  color: var(--color-text);
  line-height: var(--line-height-normal);
}

.public-static-pages-privacy-policy__updated {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  margin: 0;
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-border);
}

@media (min-width: 640px) {
  .public-static-pages-privacy-policy {
    margin: var(--space-24) auto;
    padding: 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%;
  }
}


/* 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/funds_declaration/details.css */
.surveys-contexts-notary-funds-declaration-details__buyer,
.surveys-contexts-notary-funds-declaration-details__property {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.surveys-contexts-notary-funds-declaration-details__label {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-brand-light);
}

.surveys-contexts-notary-funds-declaration-details__name {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}


/* surveys/contexts/notary/funds_declaration/recap.css */
.surveys-contexts-notary-funds-declaration-recap {
  display: grid;
  gap: var(--space-3);
}

.surveys-contexts-notary-funds-declaration-recap__summary {
  display: grid;
  gap: var(--space-2);
}

.surveys-contexts-notary-funds-declaration-recap__row {
  display: flex;
  justify-content: space-between;
  gap: var(--space-3);
  align-items: baseline;
  font-size: var(--font-size-sm);
  line-height: var(--line-height-snug);
}

.surveys-contexts-notary-funds-declaration-recap__label {
  color: var(--color-text-muted);
  flex-shrink: 0;
}

.surveys-contexts-notary-funds-declaration-recap__value {
  color: var(--color-text);
  font-weight: var(--font-weight-semibold);
  text-align: right;
  white-space: nowrap;
}


/* surveys/contexts/notary/matter_detail/client_questionnaires.css */
.surveys-contexts-notary-matter-detail-client-questionnaires {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.surveys-contexts-notary-matter-detail-client-questionnaires__questionnaires {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.surveys-contexts-notary-matter-detail-client-questionnaires__questionnaire-title {
  font-size: var(--font-size-sm);
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: var(--space-1);
}

.surveys-contexts-notary-matter-detail-client-questionnaires__questionnaire-questions {
  list-style: disc;
  padding-left: var(--space-5);
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}


/* surveys/contexts/notary/matter_detail/expected_documents.css */
.surveys-contexts-notary-matter-detail-expected-documents {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

.surveys-contexts-notary-matter-detail-expected-documents__intro {
  font-size: var(--font-size-sm);
  color: var(--color-text);
}

.surveys-contexts-notary-matter-detail-expected-documents__points {
  list-style: disc;
  padding-left: var(--space-5);
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}


/* surveys/contexts/notary/matter_detail/mandate.css */
.surveys-contexts-notary-matter-detail-mandate {
  display: grid;
  gap: var(--space-3);
}

.surveys-contexts-notary-matter-detail-mandate__summary {
  display: grid;
  gap: var(--space-2);
}

.surveys-contexts-notary-matter-detail-mandate__row {
  display: flex;
  justify-content: space-between;
  gap: var(--space-3);
  align-items: baseline;
  font-size: var(--font-size-sm);
  line-height: var(--line-height-snug);
}

.surveys-contexts-notary-matter-detail-mandate__label {
  color: var(--color-text-muted);
  flex-shrink: 0;
}

.surveys-contexts-notary-matter-detail-mandate__value {
  color: var(--color-text);
  font-weight: var(--font-weight-semibold);
  text-align: right;
  white-space: nowrap;
}

.surveys-contexts-notary-matter-detail-mandate__placeholder {
  color: var(--color-text-muted);
  font-size: var(--font-size-sm);
  font-style: italic;
}


/* 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/property_announce/attribute_list.css */
.surveys-contexts-notary-property-property-announce-attribute-list {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: var(--space-1);
}


/* surveys/contexts/notary/property/property_charges/attribute_list.css */
.surveys-contexts-notary-property-property-charges-attribute-list {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: var(--space-1);
}


/* surveys/contexts/notary/property/property_essentials/attribute_list.css */
.surveys-contexts-notary-property-property-essentials-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/matter_detail/agency_fees_paid_by.css */
.surveys-inputs-notary-matter-detail-agency-fees-paid-by {
  display: grid;
  gap: var(--space-4);
}


/* surveys/inputs/notary/matter_detail/mandate_reference.css */
.surveys-inputs-notary-matter-detail-mandate-reference {
  display: grid;
  gap: var(--space-4);
}


/* surveys/inputs/notary/matter_detail/mandate_type.css */
.surveys-inputs-notary-matter-detail-mandate-type {
  display: grid;
  gap: var(--space-4);
}


/* 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-choice__mailto-fallback {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  align-items: flex-start;

  margin-top: var(--space-4);
  padding-top: var(--space-4);
  border-top: 1px solid var(--color-border);
}

.surveys-inputs-notary-party-spouse-choice__mailto-hint {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}


/* 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/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/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/agent_reminders.css */
.widgets-agent-reminders {
  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-agent-reminders__header {
  display: flex;
  flex-direction: column;
}

.widgets-agent-reminders__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-agent-reminders__list {
  list-style: none;
  padding: var(--space-3) 0 0 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  border-top: 1px solid var(--color-border);
}

.widgets-agent-reminders__item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2) var(--space-3);
  padding: var(--space-2) 0;
}

.widgets-agent-reminders__label {
  order: 1;
  flex-basis: 100%;
  font-size: var(--font-size-sm);
  color: var(--color-text);
}

.widgets-agent-reminders__date {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  white-space: nowrap;
}

.widgets-agent-reminders__empty {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  margin: var(--space-4) 0;
  text-align: center;
}


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


/* 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__title {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
  margin-bottom: var(--space-2);
}

.widgets-member-stats__stats {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.widgets-member-stats__stat {
  font-size: var(--font-size-base);
  color: var(--color-text);
}

.widgets-member-stats__empty {
  font-size: var(--font-size-sm);
  color: var(--color-text-subtle);
}