/* Styles propres au site de l'atelier.
   Fichier distinct de styles.css, qui est un lien symbolique vers celui du
   site personnel : y écrire toucherait aussi michelduprez.fr. */

/* --- Planning en grille -------------------------------------------------
   Jours en colonnes, horaires en lignes, comme le programme de MAJSC 2026.
   Les fonds sont translucides plutôt que pleins : ils se posent sur le fond
   du thème et tiennent donc en clair comme en sombre. */

.schedule-wrap {
  overflow-x: auto;          /* la grille défile seule, la page jamais */
  margin: 1.5rem 0 2rem;
}

.schedule {
  border-collapse: separate;
  border-spacing: 5px;
  width: 100%;
  min-width: 820px;          /* en deçà, les cellules deviennent illisibles */
}

.schedule th {
  font-size: .92rem;
  font-weight: 700;
  text-align: center;
  padding: .35rem .5rem .6rem;
}

.schedule td {
  vertical-align: top;
  padding: .55rem .7rem;
  border-radius: 5px;
  font-size: .92rem;
  line-height: 1.35;
}

.schedule .time {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  font-size: .85rem;
  opacity: .7;
  text-align: right;
  padding: .6rem .85rem .6rem 0;
}

.slot-title { display: block; font-weight: 600; }
.slot-note  { display: block; font-size: .85rem; opacity: .75; margin-top: .15rem; }

.slot-talk  { background: rgba(0, 105, 92, .13);   border-left: 3px solid var(--bs-primary, #00695c); }
.slot-disc  { background: rgba(214, 124, 20, .16); border-left: 3px solid #d67c14; }
.slot-event { background: rgba(122, 60, 140, .16); border-left: 3px solid #7a3c8c; }
.slot-break { background: rgba(127, 127, 127, .13); text-align: center; font-size: .88rem; opacity: .85; }

/* Légende sous la grille */
.schedule-key { display: flex; flex-wrap: wrap; gap: 1.2rem; font-size: .9rem; margin-bottom: 1.5rem; }
.schedule-key span { display: flex; align-items: center; gap: .45rem; }
.schedule-key i { width: 14px; height: 14px; border-radius: 3px; display: inline-block; }
.key-talk  { background: rgba(0, 105, 92, .35); }
.key-disc  { background: rgba(214, 124, 20, .45); }
.key-event { background: rgba(122, 60, 140, .45); }

/* --- Bandeau d'accueil --------------------------------------------------- */

.hero {
  border-left: 4px solid var(--bs-primary, #00695c);
  background: rgba(0, 105, 92, .08);
  border-radius: 6px;
  padding: 1.1rem 1.4rem;
  margin-bottom: 1.8rem;
}
.hero p { margin: 0; }
.hero .hero-where { font-size: 1.15rem; font-weight: 600; }

/* --- Formulaire d'inscription -------------------------------------------
   Le formulaire est heberge chez Framaforms et insere ici. Le cadre garde une
   hauteur fixe : sans script, une iframe ne peut pas s'ajuster a son contenu,
   et la page Framaforms n'en expose pas la hauteur. */

.reg-frame {
  width: 100%;
  height: 1500px;
  border: 1px solid rgba(127, 127, 127, .32);
  border-radius: 6px;
  background: #fff;          /* le formulaire est clair, quel que soit le theme */
}

.reg-frame--short { height: 950px; }

@media (max-width: 767.98px) {
  .reg-frame { height: 1950px; }
  .reg-frame--short { height: 1150px; }   /* les champs s'empilent, il faut plus de place */
}