/* MFTD 2027 - page publique "Rencontres B2B" (2026-10-31).
   Chargée par-dessus base.css (B2b::index()). Tout est préfixé .b2b-,
   comme .speaker-card / .stand-card sur les autres pages publiques. */

/* --- bandeau édition sous le titre ---------------------------------------- */

.b2b-event {
  margin: 0 0 var(--s-3);
  color: var(--c-muted);
}

.b2b-event strong { color: var(--c-primary); }
.b2b-event span { display: block; font-size: var(--fs-small); }

/* --- message "réservations fermées" --------------------------------------- */

.b2b-notice {
  background: var(--c-warning-bg);
  color: var(--c-warning);
  border-radius: var(--radius);
  padding: var(--s-4) var(--s-5);
  margin: 0 0 var(--s-6);
  font-size: var(--fs-small);
}

/* --- barre de filtres ------------------------------------------------------ */

.b2b-filters {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-4);
  align-items: flex-end;
  margin-bottom: var(--s-6);
}

.b2b-filters__field { flex: 1 1 14rem; min-width: 0; }

.b2b-filters__field label {
  display: block;
  font-size: var(--fs-tiny);
  font-weight: var(--fw-medium);
  color: var(--c-muted);
  margin-bottom: var(--s-2);
}

.b2b-filters__field input,
.b2b-filters__field select {
  width: 100%;
  padding: var(--s-3);
  border: 1px solid var(--c-border-strong);
  border-radius: var(--radius-sm);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  background: var(--c-bg);
  color: var(--c-ink);
}

.b2b-filters__field input:focus-visible,
.b2b-filters__field select:focus-visible { box-shadow: var(--focus-ring); outline: none; }

.b2b-filters__count {
  flex: 0 0 auto;
  margin: 0 0 var(--s-3);
  font-size: var(--fs-small);
  color: var(--c-muted);
}

/* Sous 560px le compteur se retrouve coincé à côté du menu : on le passe
   sur sa propre ligne. */
@media (max-width: 560px) {
  .b2b-filters__field { flex: 1 1 100%; }
  .b2b-filters__count { flex: 1 1 100%; margin-bottom: 0; }
}

.b2b-noresult {
  text-align: center;
  color: var(--c-muted);
  padding: var(--s-7) 0;
}

/* --- grille de fiches ------------------------------------------------------ */

.b2b-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--s-6);
}

@media (max-width: 900px) { .b2b-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .b2b-grid { grid-template-columns: 1fr; } }

.b2b-card {
  display: flex;
  flex-direction: column;
  background: var(--c-bg);
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
  padding: var(--s-6);
  transition: box-shadow var(--t-base) var(--ease), transform var(--t-base) var(--ease);
}

.b2b-card:hover { box-shadow: var(--shadow-hover); transform: translateY(-2px); }

/* Le filtre masque par l'attribut hidden ; la grille le remettrait en
   display:block sans cette règle. */
.b2b-card[hidden] { display: none; }

.b2b-card__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--s-3);
  margin-bottom: var(--s-4);
}

.b2b-card__logo {
  max-width: 8rem;
  max-height: 3.5rem;
  object-fit: contain;
  object-position: left center;
}

.b2b-card__logo--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.5rem;
  height: 3.5rem;
  border-radius: var(--radius-sm);
  background: var(--c-surface-2);
  color: var(--c-accent-text);
}

.b2b-card__logo--placeholder .icon { width: 1.75rem; height: 1.75rem; }

.b2b-card__stand {
  flex: 0 0 auto;
  display: inline-block;
  padding: var(--s-1) var(--s-3);
  border-radius: var(--radius-pill);
  background: var(--c-accent);
  color: #FFFFFF;
  font-size: var(--fs-tiny);
  font-weight: var(--fw-medium);
  white-space: nowrap;
}

.b2b-card__name {
  font-size: var(--fs-h4);
  color: var(--c-primary);
  margin: 0 0 var(--s-2);
}

.b2b-card__sector {
  display: inline-block;
  align-self: flex-start;
  padding: var(--s-1) var(--s-3);
  margin-bottom: var(--s-3);
  border-radius: var(--radius-pill);
  background: var(--c-surface);
  color: var(--c-muted);
  font-size: var(--fs-tiny);
  text-transform: uppercase;
  letter-spacing: var(--ls-eyebrow);
}

.b2b-card__desc {
  font-size: var(--fs-small);
  color: var(--c-muted);
  margin: 0 0 var(--s-4);
  /* Les présentations font jusqu'à 1000 caractères : on en montre un
     aperçu pour que les fiches gardent la même hauteur. */
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.b2b-card__slots {
  margin: auto 0 var(--s-4);
  font-size: var(--fs-small);
  font-weight: var(--fw-medium);
  color: var(--c-success);
}

.b2b-card__slots.is-full { color: var(--c-muted); font-weight: var(--fw-regular); }

.b2b-card__cta { align-self: flex-start; }

.b2b-card__cta.is-disabled {
  opacity: .55;
  cursor: not-allowed;
  pointer-events: none;
}

/* --- fiche exposant (B2b::partner) ---------------------------------------- */

.b2b--narrow { max-width: var(--container-narrow); }

.b2b-back { margin: 0 0 var(--s-4); font-size: var(--fs-small); }

.b2b-partner-hero { text-align: left; }

.b2b-partner__id {
  display: flex;
  align-items: center;
  gap: var(--s-5);
  flex-wrap: wrap;
}

.b2b-partner__logo { max-width: 10rem; max-height: 5rem; object-fit: contain; }
.b2b-partner__id h1 { margin: 0 0 var(--s-2); }

.b2b-partner__meta { display: flex; flex-wrap: wrap; gap: var(--s-3); align-items: center; margin: 0; }
.b2b-partner__desc { margin: var(--s-5) 0 0; color: var(--c-muted); }
.b2b-partner__link { margin: var(--s-3) 0 0; font-size: var(--fs-small); }

.b2b-hint {
  background: var(--c-surface);
  border-left: 3px solid var(--c-accent);
  border-radius: 0 var(--radius) var(--radius) 0;
  padding: var(--s-4) var(--s-5);
  margin-bottom: var(--s-5);
  font-size: var(--fs-small);
  color: var(--c-muted);
}

.b2b-day { margin-bottom: var(--s-6); }

.b2b-day__title {
  font-size: var(--fs-h4);
  color: var(--c-primary);
  margin: 0 0 var(--s-3);
}

/* b2b_format_date() rend "jeudi 10 decembre" : en francais seul le premier
   mot prend la majuscule, donc ::first-letter et surtout pas capitalize,
   qui donnerait "Jeudi 10 Decembre". */
.b2b-day__title::first-letter { text-transform: uppercase; }

.b2b-slots {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(7rem, 1fr));
  gap: var(--s-3);
}

.b2b-slot {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: var(--s-3);
  border: 1px solid var(--c-border-strong);
  border-radius: var(--radius-sm);
  background: var(--c-bg);
  text-decoration: none;
  color: var(--c-primary);
  transition: border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}

a.b2b-slot:hover { border-color: var(--c-primary); box-shadow: var(--shadow-sm); }
a.b2b-slot:focus-visible { box-shadow: var(--focus-ring); outline: none; }

.b2b-slot__time { font-weight: var(--fw-semibold); }
.b2b-slot__end { font-size: var(--fs-tiny); color: var(--c-muted); }
.b2b-slot.is-disabled { opacity: .5; cursor: not-allowed; }

/* --- formulaire de réservation -------------------------------------------- */

.b2b-summary {
  background: var(--c-surface);
  border-radius: var(--radius);
  padding: var(--s-5);
  margin-bottom: var(--s-5);
}

.b2b-summary dl { display: grid; grid-template-columns: auto 1fr; gap: var(--s-2) var(--s-5); margin: 0; }
.b2b-summary dt { font-size: var(--fs-small); color: var(--c-muted); }
.b2b-summary dd { margin: 0; font-weight: var(--fw-medium); color: var(--c-primary); }

.b2b-identity {
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  padding: var(--s-5);
  margin-bottom: var(--s-5);
}

.b2b-identity__title {
  display: block;
  font-size: var(--fs-tiny);
  text-transform: uppercase;
  letter-spacing: var(--ls-eyebrow);
  color: var(--c-muted);
  margin-bottom: var(--s-2);
}

.b2b-identity p { margin: 0; font-size: var(--fs-small); }

.b2b-form { margin-top: var(--s-4); }
.b2b-form textarea { min-height: 7rem; }

/* --- espace visiteur ------------------------------------------------------- */

.b2b-account {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: var(--s-3);
  font-size: var(--fs-small);
  color: var(--c-muted);
  padding-bottom: var(--s-4);
  border-bottom: 1px solid var(--c-border);
  margin-bottom: var(--s-5);
}

.b2b-section { text-align: left; margin-top: var(--s-6); }

.b2b-appointments { list-style: none; margin: 0; padding: 0; }

.b2b-appointment {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-4);
  align-items: center;
  padding: var(--s-4) var(--s-5);
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  background: var(--c-bg);
  margin-bottom: var(--s-3);
}

.b2b-appointments--past .b2b-appointment { opacity: .7; }

.b2b-appointment__when { flex: 0 0 7rem; line-height: 1.2; }
.b2b-appointment__time { display: block; font-weight: var(--fw-semibold); color: var(--c-primary); }
.b2b-appointment__date { display: block; font-size: var(--fs-tiny); color: var(--c-muted); }
.b2b-appointment__date::first-letter { text-transform: uppercase; }

.b2b-appointment__body { flex: 1 1 12rem; min-width: 0; }
.b2b-appointment__partner { display: block; color: var(--c-primary); }
.b2b-appointment__stand { display: inline-block; font-size: var(--fs-tiny); color: var(--c-muted); }
.b2b-appointment__subject { display: block; font-size: var(--fs-small); color: var(--c-muted); margin-top: var(--s-1); }

.b2b-appointment__side { flex: 0 0 auto; display: flex; align-items: center; gap: var(--s-3); }
.b2b-appointment__form { margin: 0; }

.b2b-pill {
  display: inline-block;
  padding: var(--s-1) var(--s-3);
  border-radius: var(--radius-pill);
  font-size: var(--fs-tiny);
  font-weight: var(--fw-medium);
  white-space: nowrap;
}

.b2b-pill--on { background: var(--c-success-bg); color: var(--c-success); }
.b2b-pill--warn { background: var(--c-warning-bg); color: var(--c-warning); }
.b2b-pill--danger { background: var(--c-danger-bg); color: var(--c-danger); }
.b2b-pill--off { background: var(--c-surface-2); color: var(--c-muted); }

.b2b-more { margin-top: var(--s-6); font-size: var(--fs-small); }

.b2b-authlinks {
  margin-top: var(--s-5);
  text-align: center;
  font-size: var(--fs-small);
  display: flex;
  gap: var(--s-3);
  justify-content: center;
  flex-wrap: wrap;
}

.b2b-locked {
  background: var(--c-surface);
  border-radius: var(--radius);
  padding: var(--s-4) var(--s-5);
  margin-bottom: var(--s-5);
}

.b2b-locked__label {
  display: block;
  font-size: var(--fs-tiny);
  text-transform: uppercase;
  letter-spacing: var(--ls-eyebrow);
  color: var(--c-muted);
}

.b2b-locked .form-note { margin-top: var(--s-2); }

/* --- formulaires de l'espace visiteur (2026-10-31, retour client) --------- */

/* Connexion, mot de passe oublié, nouveau mot de passe : deux ou trois
   champs. Dans la grille 2 colonnes de .register__form ils flottaient au
   milieu d'une carte trop large. On resserre et on centre. */
.b2b-auth {
  max-width: 26rem;
  margin-left: auto;
  margin-right: auto;
}

.b2b-auth .register__form { grid-template-columns: 1fr; }

/* L'inscription garde ses deux colonnes (prénom/nom, société/fonction),
   mais les champs longs et les mots de passe passent pleine largeur : une
   aide sous un seul des deux champs d'une rangée décalait visuellement
   la rangée suivante. */
.b2b-register { max-width: 34rem; margin-left: auto; margin-right: auto; }

.b2b-form .form-actions { justify-content: flex-start; }
.b2b-form .form-actions .btn { min-width: 12rem; justify-content: center; }
