/* Les actions de Préparer (groupe preparer) : classes `rp-act-preparer-*` seulement. Chaque
   dmc.Button d'ici porte `rp-bouton rp-act-preparer-btn` ; seule la seconde est stylée ici. */

/* Mantine pose ses variables `--button-*` en style en ligne : les couleurs s'écrivent donc
   directement, en !important. */
.mantine-Button-root.rp-act-preparer-btn {
  height: auto;
  min-height: 44px;
  font-size: 1rem;
  background: var(--rp-sombre-accent) !important;
  color: var(--rp-sombre) !important;
  border: none !important;
}
.mantine-Button-root.rp-act-preparer-btn.rp-bouton-contour {
  background: transparent !important;
  color: var(--rp-sombre-accent) !important;
  border: 1px solid var(--rp-sombre-accent) !important;
}
.mantine-Button-root.rp-act-preparer-btn:disabled,
.mantine-Button-root.rp-act-preparer-btn[data-disabled] { opacity: 0.75; cursor: default; }

/* Sur fond clair (fenêtres) : l'accent du clair, texte blanc ; contour accent. */
.mantine-Button-root.rp-act-preparer-btn.rp-act-preparer-clair {
  background: var(--rp-accent) !important;
  color: #FFFFFF !important;
}
.mantine-Button-root.rp-act-preparer-btn.rp-act-preparer-clair:hover { background: var(--rp-accent-fonce) !important; }
.mantine-Button-root.rp-act-preparer-btn.rp-act-preparer-clair.rp-bouton-contour {
  background: transparent !important;
  color: var(--rp-accent) !important;
  border: 1px solid var(--rp-accent) !important;
}

/* Un geste discret, en lien (« changer › ») : 44 px à toucher, pas de fond. */
.mantine-Button-root.rp-act-preparer-lien {
  background: transparent !important;
  color: var(--rp-accent) !important;
  padding: 0;
  height: auto;
  min-height: 44px;
  font-weight: 600;
  font-size: var(--rp-taille-secondaire);
  align-self: flex-start;
}
.mantine-Button-root.rp-act-preparer-lien:hover { text-decoration: underline; }
.mantine-Button-root.rp-act-preparer-lien.rp-act-preparer-lien-sombre { color: var(--rp-sombre-accent) !important; }
.rp-act-preparer-liens { display: flex; flex-wrap: wrap; column-gap: var(--rp-espace-4); }

/* La ligne d'une zone, cliquable. */
.rp-act-preparer-zone { display: block; width: 100%; text-align: left; border-radius: var(--rp-rayon-moyen); }
.rp-act-preparer-zone:hover { background: rgba(31, 95, 102, 0.05); }
.rp-act-preparer-zone:focus-visible { outline: 2px solid var(--rp-accent); outline-offset: 2px; }
.rp-act-preparer-regler { font-family: var(--rp-police-texte); font-size: var(--rp-taille-mention); font-weight: 600; color: var(--rp-accent); margin-top: var(--rp-espace-1); }

/* La mention sous les boutons de la carte sombre. */
.rp-act-preparer-mention { flex-basis: 100%; }
.rp-act-preparer-pied-bloc { margin-top: var(--rp-espace-2); }

/* Les fenêtres. */
.rp-act-preparer-corps { display: flex; flex-direction: column; gap: var(--rp-espace-3); }
.rp-act-preparer-titre { font-weight: 600; }
.rp-act-preparer-temps strong { font-family: var(--rp-police-chiffres); }
.rp-act-preparer-section { display: flex; flex-direction: column; gap: var(--rp-espace-3); padding-top: var(--rp-espace-3); border-top: 1px solid var(--rp-ligne-douce); }
.rp-act-preparer-grandeur { display: flex; justify-content: space-between; align-items: center; gap: var(--rp-espace-3); flex-wrap: wrap; }
.rp-act-preparer-grandeur-texte { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.rp-act-preparer-valeur { font-family: var(--rp-police-chiffres); font-size: 22px; font-weight: 600; }
.rp-act-preparer-suivie { font-size: var(--rp-taille-mention); color: var(--rp-texte-secondaire); min-height: 24px; }
.rp-act-preparer-pas { display: flex; gap: var(--rp-espace-2); }
.rp-act-preparer-ok { font-weight: 600; color: var(--rp-accent); }
.rp-carte-sombre .rp-act-preparer-ok { color: var(--rp-sombre-accent); }
.rp-act-preparer-echec { color: var(--rp-texte-secondaire); }
.rp-carte-sombre .rp-act-preparer-echec { color: var(--rp-sombre-texte-secondaire); }
.rp-act-preparer-montre-ligne { display: flex; justify-content: space-between; align-items: center; gap: var(--rp-espace-3); padding-top: var(--rp-espace-3); border-top: 1px solid var(--rp-ligne-douce); }
.rp-act-preparer-montre-texte { font-size: var(--rp-taille-secondaire); min-width: 0; }

@media (max-width: 767px) {
  .rp-act-preparer-reserve { width: 100%; }
  .rp-act-preparer-montre-ligne { flex-direction: column; align-items: stretch; }
  .rp-act-preparer-pas { width: 100%; }
  .rp-act-preparer-pas > .mantine-Button-root { flex: 1 1 0; }
}

/* U56 (Préparer) : chaque bloc de la carte sombre prend la hauteur de son contenu (pas de bloc
   étiré à côté d'un plus long). */
#rp-plan .rp-blocs { align-items: start; }

/* M34 (3) : la ligne d'une stratégie, cliquable (un clic la choisit), et le carré « Réserve
   visée », cliquable (son origine, ses courses, le champ), serré contre le temps. */
#rp-plan .rp-course-repere { flex: 1 1 auto; }
.rp-act-preparer-strat { display: block; width: 100%; text-align: left; color: inherit; border-radius: var(--rp-rayon-moyen); }
.rp-act-preparer-strat:hover { background: rgba(255, 255, 255, 0.06); }
.rp-act-preparer-strat:focus-visible, .rp-act-preparer-reserve:focus-visible { outline: 2px solid var(--rp-sombre-accent); outline-offset: 2px; }
.rp-act-preparer-reserve {
  display: flex;
  flex-direction: column;
  gap: var(--rp-espace-1);
  flex: none;
  width: 168px;
  padding: var(--rp-espace-3) var(--rp-espace-4);
  border: 1px solid var(--rp-sombre-ligne);
  border-radius: var(--rp-rayon-grand);
  color: inherit;
  text-align: left;
}
.rp-act-preparer-reserve:hover { background: rgba(255, 255, 255, 0.06); }

/* M49 : la pastille d'état de la course courue, dans la tête sombre du plan, à côté de la date.
   Fermée : le titre court ; ouverte : la phrase entière. */
.rp-pastille { margin-top: 0.5rem; }
.rp-pastille-courue {
  display: inline-block;
  cursor: pointer;
  list-style: none;
  padding: 0.125rem 0.75rem;
  border: 1px solid var(--rp-sombre-accent);
  border-radius: 999px;
  color: var(--rp-sombre-accent);
  font-size: var(--rp-taille-mention);
}
.rp-pastille-courue::-webkit-details-marker { display: none; }
.rp-pastille-courue:focus-visible { outline: 2px solid var(--rp-sombre-accent); outline-offset: 2px; }
.rp-pastille-texte {
  margin: 0.5rem 0 0;
  color: var(--rp-sombre-texte-secondaire);
  font-size: var(--rp-taille-mention);
}

/* La carte « Ta trace » : ses gestes l'un sous l'autre. */
.rp-trace-gestes { flex-direction: column; align-items: flex-start; }
