/**
 * Espace associations et professionnels : habillage complet (réglage « Apparence » : style de l'extension)
 *
 * Chargée après la mise en page (assets/espace.css). Couleurs, bordures et arrondis réglables
 * par les variables --espace-* : un thème les déclare sur :root, elles priment sur celles-ci.
 */

:where(:root) {
  --espace-ink: #1f2937;
  --espace-title: #111827;
  --espace-soft: #4b5563;
  --espace-line: #d1d5db;
  --espace-backdrop: #f9fafb;
  --espace-surface: #ffffff;
  --espace-surface-alt: #f3f4f6;
  --espace-brand: #1d4ed8;
  --espace-brand-soft: #eff6ff;
  --espace-brand-strong: #1e3a8a;
  --espace-on-brand: #ffffff;
  --espace-radius: 0.375rem;
  --espace-panel-radius: 0.75rem;
  --espace-field-border: 2px solid #6b7280;
}

/* Boutons */
.espace-button {
  display: inline-flex;
  gap: 0.5rem;
  align-items: center;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.5rem 1.25rem;
  font: inherit;
  font-weight: 700;
  line-height: 1.2;
  color: var(--espace-on-brand);
  text-decoration: none;
  cursor: pointer;
  background: var(--espace-brand);
  border: 2px solid var(--espace-brand);
  border-radius: var(--espace-radius);
}

.espace-button:hover {
  color: var(--espace-on-brand);
  background: var(--espace-brand-strong);
  border-color: var(--espace-brand-strong);
}

.espace-button:focus-visible {
  outline: 3px solid var(--espace-brand);
  outline-offset: 3px;
}

.espace-button > .espace-icon:first-child {
  margin: 0;
}

.espace-button--secondary {
  color: var(--espace-brand);
  background: transparent;
}

.espace-button--secondary:hover {
  color: var(--espace-on-brand);
}

.espace-button--danger {
  color: #ffffff;
  background: var(--espace-danger);
  border-color: var(--espace-danger);
}

/* Champs */
.espace-input {
  min-height: 3rem;
  padding: 0.5rem 1rem;
  font-size: 1.0625rem;
  color: var(--espace-ink);
  background: var(--espace-surface);
  border: var(--espace-field-border);
  border-radius: var(--espace-radius);
}

.espace-input:focus-visible {
  border-color: var(--espace-brand);
  outline: 3px solid var(--espace-brand);
  outline-offset: 2px;
}

.has-error .espace-input {
  border-color: var(--espace-danger);
  box-shadow: inset 0 0 0 1px var(--espace-danger);
}

textarea.espace-input {
  min-height: 6rem;
  line-height: 1.5;
}

select.espace-input {
  padding-right: 2.75rem;
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position: calc(100% - 1.375rem) 50%, calc(100% - 1rem) 50%;
  background-size: 0.375rem 0.375rem;
  background-repeat: no-repeat;
}

input[type="file"].espace-input {
  padding-block: 0.625rem;
  font-size: 1rem;
}

/* Liens d'action */
.espace-item-actions a,
.espace-links-list :is(a, button),
.espace-link-icon {
  color: var(--espace-brand);
}

.espace-item-actions a:hover,
.espace-links-list :is(a, button):hover,
.espace-link-icon:hover {
  color: var(--espace-title);
}

.espace-item-actions .espace-action-danger,
.espace-item-actions .espace-action-danger:hover {
  color: var(--espace-danger);
}