/* shared/pages/mes-rendez-vous.css — feuille de mes-rendez-vous.html, sortie de son bloc \3c style> le 17/10/2026 (lot 8 du dossier 1 : CSP sans
   style en ligne). Chargée par une balise <link> à la place exacte de l’ancien bloc : même ordre dans la cascade. */
.rdv-page { max-width: 1080px; margin: 0 auto; padding: var(--palette-espacement-cabinet) var(--palette-espacement-components-3) var(--palette-espacement-changer-psychologue); }
.head-row { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--palette-espacement-cabinet-conversation-2); margin-bottom: var(--palette-espacement-cabinet-conversation-10); }
.head-row h1 { font-size: var(--palette-typographie-cabinet); letter-spacing: var(--palette-typographie-layout-2); margin: 0 0 var(--palette-espacement-cabinet-2); font-weight: 700; color: var(--ink); }
.head-row .lede { color: var(--muted); font-size: var(--palette-typographie-composants-14); }
.cta-primary { background: var(--adaptation-fond-action-accent, var(--accent)); color: var(--palette-texte-inverse-components); padding: var(--palette-espacement-components-2) var(--palette-espacement-cabinet-conversation-8); border-radius: var(--palette-rayon-components); font-weight: 600; font-size: var(--palette-typographie-components); text-decoration: none; display: inline-flex; align-items: center; gap: var(--palette-espacement-cabinet-conversation-11); white-space: nowrap; }
.cta-primary:hover { background: var(--adaptation-fond-action-accent-hover, var(--accent-hover)); }

/* ── Mobile credit card (compact, visible <=640px uniquement) ─────────
   La sidebar desktop affiche déjà la carte crédit. Sur mobile la sidebar
   est cachée, donc on duplique l'info en haut de la page. */
.mobile-credit-card { display: none; }

/* ── Empty state (sans inline styles — refactor 20/05/2026) ─────── */
.appts-empty {
  padding: var(--palette-espacement-demarrer-5) var(--palette-espacement-components-3);
  text-align: center;
  color: var(--muted);
  background: var(--surface);
  border: 1px dashed var(--line-strong);
  border-radius: var(--palette-rayon-composants-3);
}
.appts-empty-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px; height: 56px;
  border-radius: var(--palette-rayon-composants-2);
  background: var(--accent-softer);
  color: var(--accent);
  margin-bottom: var(--palette-espacement-cabinet-conversation-5);
}
.appts-empty-title { display: block; color: var(--ink); font-size: var(--palette-typographie-cabinet-conversation-5); margin-bottom: var(--palette-espacement-cabinet-conversation-3); font-weight: 700; }
.appts-empty-sub { font-size: var(--palette-typographie-components); }

.tabs { display: inline-flex; gap: var(--palette-espacement-cabinet-2); padding: var(--palette-espacement-cabinet-2); background: var(--surface-2); border-radius: var(--palette-rayon-cabinet-conversation-3); border: 1px solid var(--line); margin-bottom: var(--palette-espacement-cabinet-conversation-8); }
.tabs button { padding: var(--palette-espacement-cabinet-conversation-11) var(--palette-espacement-cabinet-conversation-8); border-radius: var(--palette-rayon-cabinet-conversation-2); font-size: var(--palette-typographie-components); font-weight: 600; color: var(--muted); background: transparent; cursor: pointer; border: 0; }
.tabs button.on { background: var(--surface); color: var(--ink); }
.tabs .pill-count { margin-left: var(--palette-espacement-cabinet-conversation-3); padding: var(--palette-espacement-composants-5) var(--palette-espacement-components); border-radius: var(--palette-rayon-components-2); background: var(--accent-softer); color: var(--accent-ink); font-size: var(--palette-typographie-composants-3); }

.appts { display: flex; flex-direction: column; gap: var(--palette-espacement-cabinet-conversation-6); }
.appt { background: var(--surface); border: 1px solid var(--line); border-radius: var(--palette-rayon-cabinet); padding: var(--palette-espacement-cabinet-conversation-8); display: grid; grid-template-columns: 70px 1fr auto; gap: var(--palette-espacement-cabinet-conversation-8); align-items: center; }
.date-block { background: var(--accent-softer); border-radius: var(--palette-rayon-cabinet-conversation-3); padding: var(--palette-espacement-cabinet-conversation-6) var(--palette-espacement-cabinet-conversation-11); text-align: center; }
.date-block .dow { font-size: var(--palette-typographie-composants-3); text-transform: uppercase; letter-spacing: var(--palette-typographie-demarrer-2); color: var(--accent); font-weight: 600; }
.date-block .dom { font-size: var(--palette-typographie-composants-15); font-weight: 700; color: var(--ink); line-height: 1; margin: var(--palette-espacement-composants-5) 0; }
.date-block .mon { font-size: var(--palette-typographie-components-4); color: var(--muted); }

.middle .psy-line { display: flex; align-items: center; gap: var(--palette-espacement-cabinet-conversation-6); }
.middle .psy-av { width: 32px; height: 32px; border-radius: var(--palette-rayon-composants-2); background: linear-gradient(135deg, var(--accent-soft), var(--adaptation-fond-action-accent, var(--accent))); color: var(--palette-texte-inverse-components); display: inline-flex; align-items: center; justify-content: center; font-size: var(--palette-typographie-composants-3); font-weight: 600; }
.middle .psy-name { font-size: var(--palette-typographie-composants-14); font-weight: 600; color: var(--ink); }
.middle .psy-title { font-size: var(--palette-typographie-cabinet-conversation-4); color: var(--muted); }
.middle .meta { display: flex; gap: var(--palette-espacement-cabinet-conversation-5); margin-top: var(--palette-espacement-cabinet-conversation-3); }
.middle .meta .item { font-size: var(--palette-typographie-components-2); color: var(--muted); display: inline-flex; gap: var(--palette-espacement-cabinet-conversation-9); align-items: center; }

.appt-actions { display: flex; flex-direction: column; gap: var(--palette-espacement-cabinet-conversation-3); align-items: flex-end; }
.btn-join { background: var(--adaptation-fond-action-accent, var(--accent)); color: var(--palette-texte-inverse-components); padding: var(--palette-espacement-cabinet-conversation-4) var(--palette-espacement-cabinet-conversation-5); border-radius: var(--palette-rayon-cabinet-conversation-4); font-size: var(--palette-typographie-cabinet-conversation-3); font-weight: 600; text-decoration: none; display: inline-flex; gap: var(--palette-espacement-cabinet-conversation-3); align-items: center; }
.btn-join:hover { background: var(--adaptation-fond-action-accent-hover, var(--accent-hover)); }
.btn-ghost-action { padding: var(--palette-espacement-components) var(--palette-espacement-cabinet-conversation-7); border: 1px solid var(--line); border-radius: var(--palette-rayon-cabinet-2); font-size: var(--palette-typographie-components-2); color: var(--ink-2); background: var(--surface); cursor: pointer; }
.btn-ghost-action:hover { background: var(--surface-2); }
.hint-line { font-size: var(--palette-typographie-components-4); color: var(--muted); display: flex; align-items: center; gap: var(--palette-espacement-cabinet-conversation-9); }

.status-pill { display: inline-flex; padding: var(--palette-espacement-components-4) var(--palette-espacement-cabinet-conversation-4); border-radius: var(--palette-rayon-components-2); font-size: var(--palette-typographie-components-4); font-weight: 600; gap: var(--palette-espacement-cabinet-2); align-items: center; margin-left: var(--palette-espacement-cabinet-conversation-6); }
.status-pill.done { background: var(--success-soft); color: var(--palette-texte-succes-components); }
.status-pill.cancelled { background: var(--surface-2); color: var(--muted); }
.status-pill.past { background: var(--surface-2); color: var(--muted); }
.status-pill.upcoming { background: var(--accent-softer); color: var(--accent-ink); }

.month-divider { font-size: var(--palette-typographie-cabinet-conversation-4); text-transform: uppercase; letter-spacing: var(--palette-typographie-layout); color: var(--muted); font-weight: 600; margin: var(--palette-espacement-cabinet-conversation-8) 0 var(--palette-espacement-cabinet-conversation-11); padding: 0 var(--palette-espacement-cabinet-2); }

/* ============== Page interne RESCHEDULE ============== */
.rs-back { display: inline-flex; align-items: center; gap: var(--palette-espacement-cabinet-conversation-3); color: var(--muted); font-size: var(--palette-typographie-components); padding: var(--palette-espacement-cabinet-conversation-11) var(--palette-espacement-cabinet-conversation-7) var(--palette-espacement-cabinet-conversation-11) var(--palette-espacement-cabinet-conversation-3); border-radius: var(--palette-rayon-cabinet-conversation-2); cursor: pointer; background: transparent; border: 0; font-family: inherit; margin-bottom: var(--palette-espacement-cabinet-conversation-8); }
.rs-back:hover { background: var(--surface-2); color: var(--ink-2); }
.rs-current { background: var(--accent-softer); border: 1px solid var(--adaptation-bordure-accent-soft, var(--accent-soft)); border-radius: var(--palette-rayon-composants-3); padding: var(--palette-espacement-cabinet-conversation-2) var(--palette-espacement-cabinet-conversation-10); margin-bottom: var(--palette-espacement-cabinet-conversation-10); }
.rs-current .lbl { font-size: var(--palette-typographie-composants-3); text-transform: uppercase; letter-spacing: var(--palette-typographie-layout); color: var(--accent); font-weight: 700; margin-bottom: var(--palette-espacement-cabinet-conversation-3); }
.rs-current .when {
  font-size: var(--palette-typographie-composants);
  font-weight: 600;
  color: var(--ink);
  letter-spacing: var(--palette-typographie-layout-4);
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: var(--palette-espacement-cabinet-conversation-6);
}
.rs-current .rs-date {
  font-size: var(--palette-typographie-components-3);
  font-weight: 500;
  color: var(--ink-2);
}
.rs-current .rs-time {
  font-size: var(--palette-typographie-cabinet-conversation);
  font-weight: 700;
  color: var(--accent);
  letter-spacing: var(--palette-typographie-layout-4);
  font-variant-numeric: tabular-nums;
  padding: var(--palette-espacement-composants-5) var(--palette-espacement-cabinet-conversation-6);
  background: var(--accent-softer);
  border-radius: var(--palette-rayon-cabinet-2);
  line-height: 1.2;
}
.rs-current .sub { font-size: var(--palette-typographie-cabinet-conversation-3); color: var(--muted); margin-top: var(--palette-espacement-cabinet-conversation-3); }
.rs-section-title { font-size: var(--palette-typographie-components-3); font-weight: 700; color: var(--ink); letter-spacing: var(--palette-typographie-layout-4); margin: 0 0 var(--palette-espacement-cabinet-conversation-5); }
.rs-week-nav { display: inline-flex; align-items: center; gap: var(--palette-espacement-cabinet-2); margin-left: auto; }
.rs-week-nav button { width: 32px; height: 32px; border-radius: var(--palette-rayon-cabinet-2); border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink-2); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; font-family: inherit; }
.rs-week-nav button:hover:not(:disabled) { background: var(--surface-2); }
.rs-week-nav button:disabled { opacity: .4; cursor: not-allowed; }
.rs-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: var(--palette-espacement-cabinet-conversation-6); margin-top: var(--palette-espacement-cabinet-conversation-11); }
.rs-col { display: flex; flex-direction: column; gap: var(--palette-espacement-cabinet-conversation-3); }
.rs-day-head { text-align: center; padding: var(--palette-espacement-cabinet-conversation-11) 0 var(--palette-espacement-cabinet-conversation-6); border-bottom: 1px solid var(--line); margin-bottom: var(--palette-espacement-cabinet-conversation-3); }
.rs-day-head .dow { font-size: var(--palette-typographie-composants-3); text-transform: uppercase; letter-spacing: var(--palette-typographie-layout-3); color: var(--muted); font-weight: 600; }
.rs-day-head .dom { font-size: var(--palette-typographie-composants); font-weight: 700; color: var(--ink); margin-top: var(--palette-espacement-composants-5); }
.rs-slot { padding: var(--palette-espacement-cabinet-conversation-6) var(--palette-espacement-cabinet-conversation-11); border-radius: var(--palette-rayon-cabinet-conversation-4); border: 1px solid var(--adaptation-bordure-accent-soft, var(--accent-soft)); background: var(--accent-softer); color: var(--accent-ink); font-size: var(--palette-typographie-cabinet-conversation-3); font-weight: 600; cursor: pointer; transition: all .15s; text-align: center; font-family: inherit; font-variant-numeric: tabular-nums; }
.rs-slot:hover { background: var(--adaptation-fond-action-accent, var(--accent)); color: var(--palette-texte-inverse-components); border-color: var(--adaptation-bordure-action-accent, var(--accent)); transform: translateY(-1px); }
.rs-slot:disabled { background: var(--surface-2); border-color: var(--line); color: var(--muted-2); cursor: wait; }
.rs-slot-empty { background: transparent; border: 1px dashed var(--line-strong); color: var(--muted-2); padding: var(--palette-espacement-cabinet-conversation-6) var(--palette-espacement-cabinet-conversation-11); border-radius: var(--palette-rayon-cabinet-conversation-4); font-size: var(--palette-typographie-cabinet-conversation-4); text-align: center; cursor: default; }
.rs-section-head { display: flex; align-items: center; }

/* ============================================================
   Modale confirmation reprogrammation (remplace confirm() natif)
   ============================================================ */
.rs-confirm-modal { display: none; }
.rs-confirm-modal[hidden] { display: none !important; }
.rs-confirm-modal:not([hidden]) {
  display: flex;
  position: fixed;
  inset: 0;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  padding: var(--palette-espacement-cabinet-conversation-10);
}
.rs-confirm-backdrop {
  position: absolute;
  inset: 0;
  background: var(--palette-fond-inverse-mes-rendez-vous);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  animation: rs-fade .18s ease-out;
}
.rs-confirm-box {
  position: relative;
  background: var(--surface);
  border-radius: var(--palette-rayon-cabinet-conversation);
  padding: var(--palette-espacement-components-5) var(--palette-espacement-cabinet-conversation) var(--palette-espacement-composants-3);
  max-width: 380px;
  width: 100%;
  box-shadow: 0 30px 60px -20px var(--palette-ombre-mes-rendez-vous);
  text-align: center;
  animation: modalPop var(--dur-base) var(--ease-spring) both;
}
.rs-confirm-ico {
  width: 52px;
  height: 52px;
  border-radius: var(--palette-rayon-composants-2);
  background: var(--accent-softer);
  color: var(--accent);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto var(--palette-espacement-cabinet-conversation-5);
}
.rs-confirm-box h3 {
  font-size: var(--palette-typographie-composants);
  letter-spacing: var(--palette-typographie-layout-4);
  font-weight: 700;
  color: var(--ink);
  margin: 0 0 var(--palette-espacement-cabinet-conversation-6);
}
.rs-confirm-body {
  font-size: var(--palette-typographie-cabinet-conversation-2);
  color: var(--ink-2);
  margin: 0 0 var(--palette-espacement-composants-3);
  line-height: 1.55;
}
.rs-confirm-body b {
  font-weight: 600;
  color: var(--ink);
}
.rs-confirm-hint {
  display: block;
  margin-top: var(--palette-espacement-cabinet-conversation-11);
  font-size: var(--palette-typographie-components-2);
  color: var(--muted);
}
.rs-confirm-err {
  margin: 0 0 var(--palette-espacement-composants-3);
  padding: var(--palette-espacement-cabinet-conversation-5) var(--palette-espacement-cabinet-conversation-2);
  background: var(--palette-surface-danger-composants);
  border: 1px solid var(--palette-bordure-composants-2);
  border-radius: var(--palette-rayon-cabinet-conversation-3);
  font-size: var(--palette-typographie-components);
  color: var(--palette-texte-danger-composants);
  line-height: 1.5;
  text-align: left;
}
.rs-confirm-err::before {
  content: "⚠️ ";
  font-size: var(--palette-typographie-components-3);
  margin-right: var(--palette-espacement-cabinet-2);
}
.rs-confirm-actions {
  display: flex;
  gap: var(--palette-espacement-cabinet-conversation-6);
  justify-content: center;
}
.rs-confirm-actions .btn-ghost-action {
  flex: 1;
  padding: var(--palette-espacement-cabinet-conversation-7) var(--palette-espacement-cabinet-conversation-8);
  font-size: var(--palette-typographie-cabinet-conversation-2);
  font-weight: 600;
  background: var(--surface);
  color: var(--ink-2);
  border: 1px solid var(--line-strong);
  border-radius: var(--palette-rayon-cabinet-conversation-3);
  cursor: pointer;
  font-family: inherit;
}
.rs-confirm-actions .btn-ghost-action:hover { background: var(--surface-2); }
.btn-primary-confirm {
  flex: 1.4;
  padding: var(--palette-espacement-cabinet-conversation-7) var(--palette-espacement-cabinet-conversation-8);
  font-size: var(--palette-typographie-cabinet-conversation-2);
  font-weight: 600;
  background: var(--adaptation-fond-action-accent, var(--accent));
  color: var(--palette-texte-inverse-components);
  border: 0;
  border-radius: var(--palette-rayon-cabinet-conversation-3);
  cursor: pointer;
  font-family: inherit;
  transition: background .15s;
}
.btn-primary-confirm:hover { background: var(--adaptation-fond-action-accent-hover, var(--accent-hover)); }
.btn-primary-confirm:disabled { background: var(--adaptation-surface-secondaire-muted, var(--muted)); cursor: wait; }
@keyframes rs-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes modalPop { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: scale(1); } }
@media (max-width: 640px) {
  .rs-confirm-box {
    padding: var(--palette-espacement-cabinet-conversation) var(--palette-espacement-cabinet-conversation-8) var(--palette-espacement-cabinet-conversation-8);
    padding-bottom: calc(var(--palette-espacement-cabinet-conversation-8) + env(safe-area-inset-bottom, var(--palette-espacement-composants)));
    border-radius: var(--palette-rayon-cabinet);
  }
  .rs-confirm-actions { flex-direction: column-reverse; }
  .rs-confirm-actions .btn-ghost-action,
  .btn-primary-confirm { width: 100%; }
}

/* ============================================================
   Modale « Laisser un avis » — notation étoiles + commentaire
   Réutilise le squelette visuel de .rs-confirm-modal (overlay, box,
   anims rs-fade/modalPop) pour rester cohérent avec la reschedule.
   ============================================================ */
.rv-modal { display: none; }
.rv-modal[hidden] { display: none !important; }
.rv-modal:not([hidden]) {
  display: flex;
  position: fixed;
  inset: 0;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  padding: var(--palette-espacement-cabinet-conversation-10);
  padding-top: calc(var(--palette-espacement-cabinet-conversation-10) + env(safe-area-inset-top, var(--palette-espacement-composants)));
  padding-bottom: calc(var(--palette-espacement-cabinet-conversation-10) + env(safe-area-inset-bottom, var(--palette-espacement-composants)));
}
.rv-backdrop {
  position: absolute;
  inset: 0;
  background: var(--palette-fond-inverse-mes-rendez-vous);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  animation: rs-fade .18s ease-out;
}
.rv-box {
  position: relative;
  background: var(--surface);
  border-radius: var(--palette-rayon-cabinet-conversation);
  padding: var(--palette-espacement-composants-2) var(--palette-espacement-cabinet-conversation) var(--palette-espacement-composants-3);
  max-width: 400px;
  width: 100%;
  box-shadow: 0 30px 60px -20px var(--palette-ombre-mes-rendez-vous);
  text-align: center;
  animation: modalPop var(--dur-base) var(--ease-spring) both;
}
.rv-box h3 {
  font-size: var(--palette-typographie-composants);
  letter-spacing: var(--palette-typographie-layout-4);
  font-weight: 700;
  color: var(--ink);
  margin: 0 0 var(--palette-espacement-cabinet-2);
}
.rv-sub {
  font-size: var(--palette-typographie-cabinet-conversation-3);
  color: var(--muted);
  margin: 0 0 var(--palette-espacement-cabinet-conversation-8);
}
/* Barre d'étoiles — boutons accessibles (radiogroup) */
.rv-stars {
  display: inline-flex;
  gap: var(--palette-espacement-cabinet-conversation-3);
  margin: 0 0 var(--palette-espacement-cabinet-conversation-3);
  direction: ltr;
}
.rv-star {
  background: none;
  border: 0;
  padding: var(--palette-espacement-cabinet-2);
  cursor: pointer;
  line-height: 1;
  color: var(--adaptation-texte-action-line-strong, var(--line-strong));
  transition: transform .12s, color .12s;
  -webkit-tap-highlight-color: transparent;
}
.rv-star svg { display: block; }
.rv-star:hover { transform: scale(1.12); }
.rv-star.on { color: var(--palette-texte-avertissement-composants); }
.rv-star:focus-visible {
  outline: 2px solid var(--adaptation-bordure-action-accent, var(--accent));
  outline-offset: 2px;
  border-radius: var(--palette-rayon-cabinet-2);
}
.rv-rating-label {
  font-size: var(--palette-typographie-components-2);
  color: var(--ink-2);
  min-height: 18px;
  margin: 0 0 var(--palette-espacement-cabinet-conversation-2);
  font-weight: 600;
}
.rv-field { text-align: left; margin: 0 0 var(--palette-espacement-cabinet-conversation-11); }
.rv-field label {
  display: block;
  font-size: var(--palette-typographie-components-2);
  font-weight: 600;
  color: var(--ink-2);
  margin: 0 0 var(--palette-espacement-cabinet-conversation-3);
}
.rv-textarea {
  width: 100%;
  box-sizing: border-box;
  min-height: 86px;
  max-height: 220px;
  padding: var(--palette-espacement-components-2) var(--palette-espacement-cabinet-conversation-7);
  border: 1px solid var(--line-strong);
  border-radius: var(--palette-rayon-cabinet-conversation-3);
  font-family: inherit;
  font-size: var(--palette-typographie-cabinet-conversation-2);
  color: var(--ink);
  background: var(--surface);
  resize: vertical;
  line-height: 1.5;
}
.rv-textarea:focus {
  outline: none;
  border-color: var(--adaptation-bordure-action-accent, var(--accent));
  box-shadow: 0 0 0 3px var(--accent-softer);
}
.rv-count {
  font-size: var(--palette-typographie-composants-3);
  color: var(--muted);
  text-align: right;
  margin: var(--palette-espacement-cabinet-2) 0 var(--palette-espacement-cabinet-conversation-2);
}
.rv-err {
  margin: 0 0 var(--palette-espacement-cabinet-conversation-2);
  padding: var(--palette-espacement-cabinet-conversation-7) var(--palette-espacement-cabinet-conversation-5);
  background: var(--palette-surface-danger-composants);
  border: 1px solid var(--palette-bordure-composants-2);
  border-radius: var(--palette-rayon-cabinet-conversation-3);
  font-size: var(--palette-typographie-cabinet-conversation-3);
  color: var(--palette-texte-danger-composants);
  line-height: 1.45;
  text-align: left;
}
.rv-err::before { content: "⚠️ "; margin-right: var(--palette-espacement-components-4); }
.rv-actions {
  display: flex;
  gap: var(--palette-espacement-cabinet-conversation-6);
  align-items: center;
}
.rv-actions .btn-ghost-action {
  flex: 1;
  padding: var(--palette-espacement-cabinet-conversation-7) var(--palette-espacement-cabinet-conversation-8);
  font-size: var(--palette-typographie-cabinet-conversation-2);
  font-weight: 600;
  background: var(--surface);
  color: var(--ink-2);
  border: 1px solid var(--line-strong);
  border-radius: var(--palette-rayon-cabinet-conversation-3);
  cursor: pointer;
  font-family: inherit;
}
.rv-actions .btn-ghost-action:hover { background: var(--surface-2); }
.rv-submit {
  flex: 1.5;
  padding: var(--palette-espacement-cabinet-conversation-7) var(--palette-espacement-cabinet-conversation-8);
  font-size: var(--palette-typographie-cabinet-conversation-2);
  font-weight: 600;
  background: var(--adaptation-fond-action-accent, var(--accent));
  color: var(--palette-texte-inverse-components);
  border: 0;
  border-radius: var(--palette-rayon-cabinet-conversation-3);
  cursor: pointer;
  font-family: inherit;
  transition: background .15s, opacity .15s;
}
.rv-submit:hover:not(:disabled) { background: var(--adaptation-fond-action-accent-hover, var(--accent-hover)); }
.rv-submit:disabled { opacity: .5; cursor: not-allowed; }
/* Lien « Supprimer mon avis » — discret, sous les actions, en mode édition */
.rv-delete {
  display: none;
  margin: var(--palette-espacement-cabinet-conversation-5) auto 0;
  background: none;
  border: 0;
  font-family: inherit;
  font-size: var(--palette-typographie-components-2);
  font-weight: 600;
  color: var(--palette-texte-danger-composants);
  cursor: pointer;
  text-decoration: underline;
}
.rv-delete:hover { color: var(--palette-texte-danger-mes-rendez-vous); }
.rv-box.is-editing .rv-delete { display: block; }
@media (max-width: 640px) {
  .rv-box {
    padding: var(--palette-espacement-composants-3) var(--palette-espacement-cabinet-conversation-8) var(--palette-espacement-cabinet-conversation-8);
    border-radius: var(--palette-rayon-cabinet);
  }
  .rv-actions { flex-direction: column-reverse; }
  .rv-actions .btn-ghost-action,
  .rv-submit { width: 100%; }
  .rv-star { padding: var(--palette-espacement-cabinet-conversation-3); }
}

/* ============================================================
   Mobile RDV — audit responsive 20/05/2026
   ============================================================ */
@media (max-width: 768px) {
  /* Cards RDV : layout 70px/1fr/auto → empile en mobile */
  .appt {
    grid-template-columns: 1fr;
    gap: var(--palette-espacement-cabinet-conversation-7);
    padding: var(--palette-espacement-cabinet-conversation-5);
  }
  /* Calendrier reschedule 7 col → grid scroll horizontal avec snap.
     Approche progressive : on garde 7 col mais on rend la grille
     scrollable horizontalement avec snap. Chaque colonne fait min
     80px (touch tappable), wrap dans un container scroll. */
  .rs-grid {
    grid-template-columns: repeat(7, minmax(80px, 1fr));
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    padding-bottom: var(--palette-espacement-cabinet-conversation-11);
  }
  .rs-col { scroll-snap-align: start; }
  /* Touch target slots : 44 min */
  .rs-slot { padding: var(--palette-espacement-cabinet-conversation-7) var(--palette-espacement-cabinet-conversation-11); min-height: 44px; font-size: var(--palette-typographie-cabinet-conversation-3); }
  .rs-week-nav button { width: 44px; height: 44px; }
}
@media (max-width: 480px) {
  /* Smartphones étroits : afficher 4 jours simultanés */
  .rs-grid {
    grid-template-columns: repeat(7, minmax(72px, 1fr));
  }
  .rs-day-head .dom { font-size: var(--palette-typographie-components-3); }
  .rs-day-head .dow { font-size: var(--palette-typographie-consultation-5); }
}

/* ============================================================
   Mobile @640 — refonte layout 20/05/2026
   - Padding réduit (40→14)
   - Head-row stack vertical (titre puis CTA pleine largeur)
   - Titre downsize (32→24)
   - Tabs full-width réparties
   - Carte crédit mobile visible
   - Empty state compact
   ============================================================ */
@media (max-width: 640px) {
  .rdv-page {
    padding: var(--palette-espacement-cabinet-conversation-2) var(--palette-espacement-cabinet-conversation-5) calc(var(--palette-espacement-changer-psychologue) + env(safe-area-inset-bottom, var(--palette-espacement-composants)));
  }

  /* Head-row : stack vertical, CTA pleine largeur sous le titre */
  .head-row {
    flex-direction: column;
    align-items: stretch;
    gap: var(--palette-espacement-cabinet-conversation-5);
    margin-bottom: var(--palette-espacement-cabinet-conversation-2);
  }
  .head-row h1 {
    font-size: var(--palette-typographie-composants-15);
    line-height: 1.15;
    /* word-break:keep-all évite que le navigateur coupe "rendez-vous" en
       "rendez-" + "vous". Avec ça, "rendez-vous" reste sur une seule ligne. */
    word-break: keep-all;
    overflow-wrap: normal;
  }
  .head-row .lede { font-size: var(--palette-typographie-cabinet-conversation-3); }
  .cta-primary {
    width: 100%;
    justify-content: center;
    padding: var(--palette-espacement-composants-6) var(--palette-espacement-cabinet-conversation-8);
    font-size: var(--palette-typographie-cabinet-conversation-2);
    border-radius: var(--palette-rayon-cabinet-conversation-3);
  }

  /* Tabs : pleine largeur, réparties */
  .tabs {
    display: flex;
    width: 100%;
    margin-bottom: var(--palette-espacement-cabinet-conversation-5);
  }
  .tabs button {
    flex: 1;
    padding: var(--palette-espacement-cabinet-conversation-6) var(--palette-espacement-cabinet-conversation-3);
    font-size: var(--palette-typographie-components-2);
    /* Le pill-count se met sous le label si pas la place */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--palette-espacement-cabinet-conversation-9);
  }
  .tabs .pill-count { font-size: var(--palette-typographie-composants-17); padding: var(--palette-espacement-conversation) var(--palette-espacement-cabinet-conversation-3); }

  /* Empty state compact */
  .appts-empty {
    padding: var(--palette-espacement-cabinet) var(--palette-espacement-cabinet-conversation-8);
  }
  .appts-empty-ico {
    width: 48px; height: 48px;
    margin-bottom: var(--palette-espacement-cabinet-conversation-6);
  }
  .appts-empty-ico svg { width: 28px; height: 28px; }
  .appts-empty-title { font-size: var(--palette-typographie-cabinet-conversation-2); }
  .appts-empty-sub { font-size: var(--palette-typographie-cabinet-conversation-3); }

  /* ── Carte crédit MOBILE (refonte 20/05/2026 — design épuré) ──
     Pas de carré violet "industriel" : icône feuille subtile en
     haut-droite, gros chiffre, label léger, barre progress fine. */
  .mobile-credit-card[data-state="visible"] {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: start;
    gap: var(--palette-espacement-cabinet-conversation-7);
    padding: var(--palette-espacement-cabinet-conversation-2) var(--palette-espacement-cabinet-conversation-8);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--palette-rayon-cabinet);
    margin-bottom: var(--palette-espacement-cabinet-conversation-8);
    box-shadow: 0 4px 12px -8px var(--palette-ombre-consultation-6);
  }
  .mcc-body { min-width: 0; }
  .mcc-label {
    font-size: var(--palette-typographie-composants-17);
    font-weight: 600;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: var(--palette-typographie-demarrer-2);
  }
  .mcc-count {
    font-family: var(--palette-police-editoriale-espace-patient-2);
    font-size: var(--palette-typographie-demarrer-3);
    font-weight: 400;
    color: var(--ink);
    line-height: 1;
    margin-top: var(--palette-espacement-cabinet-conversation-3);
    letter-spacing: var(--palette-typographie-layout-2);
  }
  .mcc-count-unit {
    font-family: var(--palette-police-interface-facture);
    font-size: var(--palette-typographie-cabinet-conversation-4);
    font-weight: 500;
    color: var(--muted);
    margin-left: var(--palette-espacement-cabinet-conversation-3);
    letter-spacing: 0;
  }
  .mcc-hint {
    font-size: var(--palette-typographie-components-4);
    color: var(--muted);
    margin-top: var(--palette-espacement-cabinet-conversation-3);
  }
  .mcc-icon {
    width: 32px;
    height: 32px;
    border-radius: var(--palette-rayon-composants-2);
    background: var(--accent-softer);
    color: var(--accent);
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 32px;
    align-self: start;
  }
  .mcc-icon svg { width: 16px; height: 16px; }
  .mcc-progress {
    grid-column: 1 / -1;
    width: 100%;
    height: 3px;
    background: var(--line);
    border-radius: var(--palette-rayon-home);
    margin-top: var(--palette-espacement-cabinet-2);
    overflow: hidden;
  }
  .mcc-progress i {
    display: block;
    height: 100%;
    background: var(--adaptation-fond-action-accent, var(--accent));
    border-radius: var(--palette-rayon-home);
    transition: width .4s ease;
  }
}