/* Mon Menu – candidature restaurant (Rejoindre Mon Menu) */

.join { max-width: 720px; margin: 0 auto; }
.join-steps { display: flex; gap: 8px; margin: 4px 0 20px; }
.join-steps__item {
  flex: 1; display: flex; align-items: center; gap: 8px;
  font-size: 12.5px; font-weight: 700; color: var(--ink-500, #8a8580);
}
.join-steps__dot {
  display: grid; place-items: center; width: 24px; height: 24px; flex: none;
  border-radius: 50%; background: #ece9e5; color: #6d6864; font-size: 12px;
  transition: background var(--dur) var(--ease), color var(--dur) var(--ease);
}
.join-steps__item.is-on { color: var(--ink-900, #111); }
.join-steps__item.is-on .join-steps__dot,
.join-steps__item.is-done .join-steps__dot { background: var(--red-700); color: #fff; }
.join-steps__bar { flex: 1; height: 2px; background: #ece9e5; border-radius: 2px; }

.join-card {
  background: #fff; border: 1px solid #ece9e5; border-radius: 20px;
  padding: 22px; margin-bottom: 16px;
}
.join-card fieldset { border: 0; padding: 0; margin: 0 0 8px; min-width: 0; }
.join-card legend {
  padding: 0; margin: 6px 0 12px; font-size: 11.5px; font-weight: 800;
  letter-spacing: .08em; text-transform: uppercase; color: #6d6864;
}
.join-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
.join-grid .full { grid-column: 1 / -1; }
@media (max-width: 560px) { .join-grid { grid-template-columns: minmax(0, 1fr); } }

.join-field label { display: block; font-size: 13px; font-weight: 700; margin-bottom: 5px; }
.join-field label small { font-weight: 500; color: #8a8580; }
.join-field input[type=text], .join-field input[type=email], .join-field input[type=url],
.join-field input[type=tel], .join-field textarea {
  width: 100%; padding: 11px 13px; border: 1px solid #ddd8d2; border-radius: 12px;
  font: inherit; background: #fff; color: inherit;
}
.join-field textarea { min-height: 80px; resize: vertical; }
.join-field input:focus, .join-field textarea:focus { outline: 2px solid rgba(209, 20, 20, .25); border-color: var(--red-700); }
.join-field.has-error input, .join-field.has-error textarea { border-color: var(--red-700); }
.join-error { display: block; margin-top: 4px; font-size: 12px; color: var(--red-700); font-weight: 600; }

.join-cuisines { display: flex; flex-wrap: wrap; gap: 8px; }
.join-cuisine {
  display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px;
  border: 1px solid #ddd8d2; border-radius: 999px; background: #fff; font: inherit;
  font-size: 13.5px; font-weight: 600; color: inherit; cursor: pointer;
  transition: background .2s, border-color .2s;
}
.join-cuisine.is-on { border-color: var(--red-700); background: #fdeeee; }
.join-cuisine__main { display: none; font-size: 11px; font-weight: 800; color: var(--red-700); }
.join-cuisine.is-main .join-cuisine__main { display: inline; }
.join-hint { margin: 8px 0 0; font-size: 12.5px; color: #6d6864; }

.join-check { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; cursor: pointer; }
.join-check input { margin-top: 3px; accent-color: var(--red-700); }

.join-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px; }
.join-actions .btn { min-width: 160px; }
.join-actions .btn[disabled] { opacity: .6; cursor: wait; }

.join-file {
  display: flex; align-items: center; gap: 12px; padding: 16px; border: 1.5px dashed #d4cfc8;
  border-radius: 14px; cursor: pointer; background: #faf9f7;
}
.join-file:hover { border-color: var(--red-700); }
.join-file input { display: none; }
.join-file__text { font-size: 13.5px; font-weight: 600; }
.join-file__text small { display: block; font-weight: 500; color: #8a8580; margin-top: 2px; }
.join-files { list-style: none; margin: 10px 0 0; padding: 0; font-size: 13px; color: #44403c; }
.join-files li { padding: 4px 0; }

.join-success { text-align: center; padding: 36px 22px; }
.join-success__icon {
  display: grid; place-items: center; width: 64px; height: 64px; margin: 0 auto 14px;
  border-radius: 50%; background: #e6f4ec; color: #1b7f4d;
}
.join-success h2 { font-family: "Fraunces", serif; margin: 0 0 8px; }
.join-success p { margin: 0 auto 6px; max-width: 460px; color: #6d6864; }
.join-ref { font-family: ui-monospace, Menlo, monospace; font-weight: 700; color: var(--ink-900, #111); }
