#header,
#footer { display: none !important; }

/* Les `--ac-*` de couleur et de police sont des ALIAS des jetons de charte : les regles
   de cette feuille continuent de lire les memes noms, seule leur SOURCE change. Un site
   qui regle sa charte repeint donc l'espace candidat, qui cessait jusqu'ici de suivre le
   reste du site. La geometrie, elle, reste propre a l'espace : rayons, ombres et densites
   restent litteraux, l'espace ne devient pas la fiche offre. */
.rlcc-account {
  --ac-primary:      var(--rlcc-color-primary);
  --ac-primary-dark: var(--rlcc-color-primary-hover);
  --ac-on-primary:   var(--rlcc-color-on-primary);
  --ac-red:          var(--rlcc-color-danger);
  --ac-ink:          var(--rlcc-color-ink);
  --ac-text:         var(--rlcc-color-text);
  --ac-muted:        var(--rlcc-color-muted);
  --ac-canvas:       var(--rlcc-color-surface-low);
  --ac-sidebar-bg:   var(--rlcc-color-surface-low);
  --ac-surface:      var(--rlcc-color-surface);
  --ac-surface-alt:  var(--rlcc-color-surface-high);
  --ac-border:       var(--rlcc-color-border-soft);
  --ac-empty-bg:     var(--rlcc-color-surface-low);
  --ac-empty-text:   var(--rlcc-color-text);
  --ac-font-heading: var(--rlcc-font-heading);
  --ac-font-body:    var(--rlcc-font-body);

  /* Bandeau d'appel « Completer mon profil » : deux teintes tres eclaircies de la
     primaire. Il figurait plus bas parmi les couleurs DECORATIVES, et c'etait une erreur
     de classement — un bandeau qui traverse la page en pleine largeur n'est pas une
     pastille de repere : il pesait un cyan sans rapport avec la charte du site, sur
     lequel aucun reglage n'avait prise. */
  --ac-cta-from:     var(--rlcc-color-cta-from);
  --ac-cta-to:       var(--rlcc-color-cta-to);

  /* Couleurs DECORATIVES : elles ne portent aucun role de la charte — ni aplat, ni encre,
     ni fond, ni sens. Ce sont les teintes propres des cartes de synthese, des pastilles et
     du bandeau d'appel. La charte ne leur donnerait pas de valeur : les faire suivre la
     couleur du site ecraserait sous une seule teinte trois reperes que l'oeil distingue.
     Elles restent donc litterales, et le test les enumere pour qu'aucune autre ne se
     glisse dans le lot sous ce pretexte. */
  --ac-teal:         #248386;
  --ac-teal-dark:    #1D6B6E;
  --ac-teal-deep:    #026864;
  --ac-pink:         #D37DAC;
  --ac-purple:       #5F5FAA;
  --ac-plum:         #8C2896;
  --ac-kpi-purple:   #44448A;
  --ac-kpi-purple-bg:#EFEFF7;
  --ac-kpi-teal:     #225454;
  --ac-kpi-teal-bg:  #E6F5F5;
  --ac-kpi-pink:     #CD385D;
  --ac-kpi-pink-bg:  #FDF2F4;
  /* Le bandeau d'accueil et l'ecran de connexion posent un voile sombre sur leur image :
     le texte y est blanc quelle que soit la charte, ce n'est pas un « texte sur aplat ». */
  --ac-on-image:     #FFFFFF;

  /* Geometrie propre a l'espace, hors charte. */
  --ac-radius-lg:    24px;
  --ac-radius:       16px;
  --ac-radius-sm:    10px;
  --ac-radius-inner: 8px;
  --ac-shadow:       0 8px 24px rgba(0, 0, 0, .06);
  --ac-shadow-sm:    0 2px 8px rgba(0, 0, 0, .05);

  font-family: var(--ac-font-body);
  color: var(--ac-text);
  -webkit-font-smoothing: antialiased;
}

/* La variante de presentation ne redeclare plus AUCUNE couleur : ses teintes ne
   differaient de la variante de recrutement que par des nuances de gris, et les deux
   lisent desormais la meme charte. Ce qui la distingue reellement — des coins moins
   arrondis, aucune ombre — reste ecrit ici. `--ac-brand` reste son nom d'aplat de marque,
   distinct dans le gabarit, mais il tient sa valeur du meme jeton que `--ac-primary` :
   deux noms pour un role ne peuvent plus diverger. */
.rlcc-account--presentation {
  --ac-brand:        var(--rlcc-color-primary);
  --ac-brand-hover:  var(--rlcc-color-primary-hover);
  --ac-radius-lg:    10px;
  --ac-radius:       10px;
  --ac-radius-sm:    10px;
  --ac-radius-inner: 8px;
  --ac-shadow:       none;
  --ac-shadow-sm:    none;
}
.rlcc-account--presentation .rlcc-account__avatar {
  background: linear-gradient(145deg, var(--ac-brand), var(--ac-brand-hover));
  width: 76px;
  height: 76px;
  font-size: 28px;
}

.rlcc-account *,
.rlcc-account *::before,
.rlcc-account *::after { box-sizing: border-box; }

.rlcc-account:not(.rlcc-account--auth) {
  display: flex;
  align-items: stretch;
  gap: 0;
  max-width: none;
  margin: 0;
  padding: 0;
  background: var(--ac-canvas);
  min-height: 100vh;
  border-radius: 0;
}
.rlcc-account__sidebar {
  position: relative;
  flex: 0 0 310px;
  width: 310px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 40px 16px 20px;
  background: var(--ac-sidebar-bg);
  box-shadow: 0 0 24px rgba(0, 0, 0, .10);
  z-index: 1;
}
.rlcc-account__main {
  flex: 0 1 80%;
  width: 80%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: 40px;
}

.rlcc-account__profile {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding: 0 0 30px;
}
.rlcc-account__avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: var(--ac-primary);
  color: var(--ac-on-primary);
  font-size: 28px;
  font-weight: 400;
}
.rlcc-account__name {
  margin: 0;
  font-size: 18px;
  font-weight: 500;
  color: var(--ac-ink);
  text-align: center;
}

.rlcc-account__nav { display: flex; flex-direction: column; gap: 6px; }
.rlcc-account__navlink {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border-radius: 8px;
  color: var(--ac-ink);
  font-size: 16px;
  font-weight: 400;
  line-height: 1;
  text-decoration: none;
  transition: background-color .2s ease, color .2s ease;
}
.rlcc-account__navlink:hover { background: rgba(0, 0, 0, .05); color: var(--ac-ink); text-decoration: none; }
.rlcc-account__navlink.is-current { background: var(--ac-primary); color: var(--ac-on-primary); font-weight: 400; }
.rlcc-account__navlink.is-current:hover { background: var(--ac-primary); color: var(--ac-on-primary); }
.rlcc-account__navicon { display: inline-flex; flex: 0 0 auto; align-items: center; }
.rlcc-account__navicon svg { display: block; }
.rlcc-account__navicon .fi { font-size: 20px; line-height: 0; display: inline-flex; }
.rlcc-account__navicon .fi::before { line-height: 1; }
.rlcc-account__navlabel { flex: 1 1 auto; }
.rlcc-account__navbadge {
  flex: 0 0 auto;
  padding: 2px 6px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 4px;
  background: var(--ac-teal-deep);
  color: var(--ac-on-primary);
  font-size: 13px; font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.rlcc-account__navlink.is-current .rlcc-account__navbadge { background: var(--ac-surface); color: var(--ac-ink); }

.rlcc-account__logout {
  margin-top: 12px;
  padding-top: 13px;
  border-top: 1px solid var(--ac-border);
}
.rlcc-account__logout-btn {
  width: 100%;
  display: flex; align-items: center; justify-content: center; gap: 12px;
  padding: 14px;
  border: 0;
  border-radius: 8px;
  background: color-mix(in srgb, var(--ac-purple) 20%, transparent);
  color: var(--ac-ink);
  font-family: inherit; font-size: 16px; font-weight: 600;
  cursor: pointer;
  transition: background-color .15s ease;
}
.rlcc-account__logout-btn:hover { background: color-mix(in srgb, var(--ac-purple) 30%, transparent); }
.rlcc-account__logout-btn .fi { color: var(--ac-ink); }

.rlcc-account__back {
  align-self: flex-end; margin-bottom: 40px;
  padding-bottom: 2px;
  border-bottom: 1px solid var(--ac-primary);
  color: var(--ac-primary); font-size: 15px; font-weight: 700; text-decoration: none;
}
.rlcc-account__back:hover { text-decoration: none; }
.rlcc-account__body { width: 100%; }

.rlcc-account-panel { display: block; }
.rlcc-account-panel__title {
  margin: 0 0 16px; font-size: 28px; font-weight: 400; color: var(--ac-ink); line-height: 1;
}
.rlcc-account-panel__title strong { font-weight: 700; }
.rlcc-account-panel__sub { margin: 0 0 24px; font-size: 16px; color: var(--ac-ink); line-height: 1.3; }
.rlcc-account .rlcc-account-profile { margin-top: 32px; }

.rlcc-account-hero {
  display: flex; align-items: center;
  padding: 80px 60px;
  border-radius: 24px;
  overflow: hidden;
  background-color: var(--ac-primary);
  background-image:
    linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, .6)),
    var(--ac-hero-bg, linear-gradient(120deg, var(--ac-primary) 0%, var(--ac-teal) 100%));
  background-size: cover;
  background-position: 50% 80%;
}
.rlcc-account-hero__title {
  margin: 0; width: 100%; text-align: center;
  color: var(--ac-on-image); font-size: 34px; font-weight: 700;
  text-shadow: none;
}
.rlcc-account-home__heading { margin: 60px 0 24px; font-size: 28px; font-weight: 400; color: var(--ac-ink); }
.rlcc-account-home__heading strong { font-weight: 700; }

.rlcc-account-kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.rlcc-account-kpi {
  display: flex; flex-direction: column;
  padding: 10px 20px 20px; border-radius: 10px;
  background: var(--ac-surface); border: 1px solid var(--ac-border);
  box-shadow: none;
}
.rlcc-account-kpi__head { display: flex; align-items: center; gap: 15px; margin: 0 0 10px; }
.rlcc-account-kpi__num { font-size: 48px; font-weight: 600; line-height: 1.15; flex: 0 0 auto; }
.rlcc-account-kpi__label { font-size: 18px; font-weight: 500; color: var(--ac-ink); }
.rlcc-account-kpi__link {
  margin-top: auto; display: block;
  padding: 16px; border-radius: var(--ac-radius-inner);
  background: var(--ac-surface); border: 1px solid var(--ac-border);
  color: var(--ac-ink); font-size: 15px; font-weight: 400;
  text-align: center; text-decoration: none;
  transition: background-color .15s ease, border-color .15s ease;
}
.rlcc-account-kpi__link:hover { background: var(--ac-canvas); border-color: var(--ac-border); text-decoration: none; }
.rlcc-account-kpi--purple { border-color: var(--ac-kpi-purple); background: var(--ac-kpi-purple-bg); }
.rlcc-account-kpi--purple .rlcc-account-kpi__num { color: var(--ac-kpi-purple); }
.rlcc-account-kpi--teal   { border-color: var(--ac-kpi-teal); background: var(--ac-kpi-teal-bg); }
.rlcc-account-kpi--teal   .rlcc-account-kpi__num { color: var(--ac-kpi-teal); }
.rlcc-account-kpi--pink   { border-color: var(--ac-kpi-pink); background: var(--ac-kpi-pink-bg); }
.rlcc-account-kpi--pink   .rlcc-account-kpi__num { color: var(--ac-kpi-pink); }

.rlcc-account-cardgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
.rlcc-account-card {
  display: flex; flex-direction: column; min-height: 210px;
  background: var(--ac-surface); border: 0;
  border-radius: var(--ac-radius-lg); box-shadow: 0 8px 24px rgba(0, 0, 0, .05); overflow: hidden;
}
/* …sauf le temps qu'une liste cherchable est ouverte. Le panneau des suggestions flotte
   sous son champ (`position: absolute`, front.css) et déborde donc de la carte dès que le
   champ est en bas — le cas de tous les derniers champs. Le rognage ci-dessus le tranchait
   net : mesuré sur le staging, 8 px visibles sur 173. Il n'est levé que pendant
   l'ouverture, et sur la seule carte concernée : au repos les coins arrondis rognent
   toujours ce qui les dépasse, et rien d'autre ne sort de la carte pendant ce laps. */
.rlcc-account .rlcc-account-card:has(.rlcc-combo.is-open) { overflow: visible; }
.rlcc-account-card__head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  min-height: 66px; padding: 16px 24px; border-bottom: 1px solid var(--ac-border);
}
.rlcc-account-card__title { margin: 0; display: flex; align-items: center; gap: 8px; font-size: 18px; font-weight: 600; color: var(--ac-ink); }
/* Le titre reste un titre : le lien n'en change ni la couleur ni la graisse, mais un
   fond en pastille (meme valeur que .rlcc-account-card__action) et une fleche qui avance
   signalent desormais qu'il mene ailleurs, au survol comme au focus clavier. */
.rlcc-account-card__titlelink {
  color: inherit;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 8px;
  margin: -4px -8px;
  border-radius: var(--ac-radius-inner);
  cursor: pointer;
  transition: background-color .15s ease, color .15s ease;
}
.rlcc-account-card__titlelink:hover,
.rlcc-account-card__titlelink:focus-visible {
  text-decoration: underline;
  background: color-mix(in srgb, var(--ac-primary) 10%, transparent);
}
/* Meme mecanique que .rlcc-offre__arrow (card.php) : fleche fixe, qui avance de 4px au
   survol/focus du lien qui la contient. */
.rlcc-account-card__titlearrow {
  display: inline-flex;
  color: var(--ac-primary);
  transition: transform .15s ease;
}
.rlcc-account-card__titlelink:hover .rlcc-account-card__titlearrow,
.rlcc-account-card__titlelink:focus-visible .rlcc-account-card__titlearrow { transform: translateX(4px); }
.rlcc-account-count {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: 50%;
  background: color-mix(in srgb, var(--ac-teal) 50%, transparent); color: var(--ac-ink); font-size: 16px; font-weight: 600; font-variant-numeric: tabular-nums;
}
.rlcc-account-card__action {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 20px; border-radius: 150px;
  background: color-mix(in srgb, var(--ac-primary) 10%, transparent); color: var(--ac-ink);
  font-size: 15px; font-weight: 700; text-decoration: none; white-space: nowrap;
  transition: background-color .15s ease;
}
.rlcc-account-card__action:hover { background: color-mix(in srgb, var(--ac-primary) 18%, transparent); text-decoration: none; }
.rlcc-account-card__action--round {
  width: 34px; height: 34px; padding: 0; border-radius: 50%;
  background: var(--ac-primary); color: var(--ac-on-primary); justify-content: center;
}
.rlcc-account-card__action--round:hover { background: var(--ac-primary-dark); }
.rlcc-account-card__action--round .fi { font-size: 15px; line-height: 0; }
.rlcc-account-card__body { flex: 1 1 auto; display: flex; flex-direction: column; padding: 20px 24px 24px; }
.rlcc-account-card__summary { margin: 0 0 12px; font-size: 15px; color: var(--ac-text); }
.rlcc-account-minilist { list-style: none; margin: 0 0 12px; padding: 0; }
.rlcc-account-minilist__item {
  display: grid;
  grid-template-columns: 44px 1fr;
  align-items: center;
  gap: 14px;
  padding: 14px 0;
  border-bottom: 1px solid var(--ac-border);
}
.rlcc-account-minilist__item:first-child { padding-top: 0; }
.rlcc-account-minilist__item:last-child { border-bottom: 0; }
.rlcc-account-minilist__avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: var(--ac-radius-inner);
  background: var(--ac-surface-alt);
  color: var(--ac-ink);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .02em;
}
.rlcc-account-minilist__logo {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}
.rlcc-account-minilist__avatar i { font-size: 18px; line-height: 1; color: var(--ac-muted); }
.rlcc-account-minilist__body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.rlcc-account-minilist__badge { align-self: flex-start; padding: 3px 10px; font-size: 11px; }
.rlcc-account-minilist__title {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
  color: var(--ac-ink);
  text-decoration: none;
}
a.rlcc-account-minilist__title:hover { color: var(--ac-primary); text-decoration: underline; }
.rlcc-account-minilist__metas { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; }
.rlcc-account-minilist__meta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--ac-muted);
  white-space: nowrap;
}
.rlcc-account-minilist__meta i { font-size: 13px; line-height: 1; color: var(--ac-primary); opacity: .75; }
.rlcc-account-minilist__more {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 12px;
  font-size: 13px;
  color: var(--ac-muted);
}
.rlcc-account-minilist__pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 34px;
  padding: 0 8px;
  border: 1px solid var(--ac-primary);
  border-radius: 999px;
  color: var(--ac-primary);
  font-size: 13px;
  font-weight: 600;
}
@media (max-width: 480px) {
  .rlcc-account-minilist__item { grid-template-columns: 36px 1fr; gap: 10px; }
  .rlcc-account-minilist__avatar { width: 36px; height: 36px; font-size: 12px; }
  .rlcc-account-minilist__meta { white-space: normal; }
}
.rlcc-account-kpi__preview {
  margin: 8px 0 0;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.rlcc-account-search .rlcc-account-cardgrid { margin-top: 12px; }

.rlcc-account-empty { margin: 0 0 8px; padding: 16px; border-radius: var(--ac-radius-inner); background: var(--ac-empty-bg); text-align: left; }
.rlcc-account-empty__text { margin: 0; color: var(--ac-ink); font-size: 16px; font-weight: 400; line-height: 1.65; }
.rlcc-account-empty .rlcc-btn { margin-top: 12px; }
.rlcc-account-empty .rlcc-account-link {
  display: block; width: fit-content; margin: 10px auto 0;
  border-bottom: 1px solid currentColor;
}
.rlcc-account-link { display: inline-block; color: var(--ac-primary); font-size: 15px; font-weight: 600; text-decoration: none; }

/* Retour d'un sous-écran vers l'entrée qui l'abrite. Même dessin que celui des pages
   d'aide (account-help.css) : la flèche colle au libellé, et la marge du bas le sépare
   du titre qui suit. Il se pose AU-DESSUS du titre, là où le regard cherche d'où il
   vient — plus bas, il se lirait comme une action de la page. */
.rlcc-account-back { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 24px; }

.rlcc-account-card .rlcc-account-empty {
  flex: 1 1 auto; margin: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 12px; text-align: center;
}
.rlcc-account-card .rlcc-account-empty__text { margin: 0; }
.rlcc-account-card .rlcc-account-empty .rlcc-account-link,
.rlcc-account-card .rlcc-account-empty .rlcc-btn { margin: 0; }

.rlcc-account-panel .rlcc-note { margin-bottom: 18px; }
.rlcc-account-table {
  width: 100%; border-collapse: collapse;
  background: var(--ac-surface); border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius); box-shadow: var(--ac-shadow-sm); overflow: hidden;
}
.rlcc-account-table th, .rlcc-account-table td { padding: 15px 18px; text-align: left; border-bottom: 1px solid var(--ac-border); }
.rlcc-account-table thead th { background: var(--ac-canvas); font-size: 13px; font-weight: 600; color: var(--ac-muted); }
.rlcc-account-table tbody tr:last-child td { border-bottom: 0; }
.rlcc-account-table__link { color: var(--ac-primary); font-weight: 600; text-decoration: none; }
.rlcc-account-table__link:hover { text-decoration: underline; }
.rlcc-account-table__muted { color: var(--ac-muted); }

/* Bandeau de commandes d'un tableau de candidatures : le réglage du nombre de lignes à
   gauche, la position dans le total à droite. Le même bandeau coiffe les deux tableaux
   de l'écran, celui des offres en ligne et celui des offres retirées. */
.rlcc-account-tablebar {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 12px; margin-bottom: 12px;
}
.rlcc-account-perpage { display: flex; align-items: center; gap: 10px; margin: 0; }
.rlcc-account-perpage__label { font-size: 14px; color: var(--ac-muted); white-space: nowrap; }
/* La règle générique des formulaires étire tout `select` de l'espace sur la largeur
   disponible : celui-ci tient dans un bandeau, il ne remplit pas une colonne de
   formulaire. Deux classes suffisent à la battre (0,2,0 contre 0,1,1). */
.rlcc-account .rlcc-account-perpage__select {
  width: auto; min-width: 88px; height: 40px; padding: 5px 40px 5px 12px; font-size: 15px;
}
.rlcc-account .rlcc-account-perpage__submit {
  height: 40px; padding: 0 16px; border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius-inner); background: var(--ac-surface); color: var(--ac-ink);
  font-family: inherit; font-size: 14px; font-weight: 600; cursor: pointer;
}
.rlcc-account .rlcc-account-perpage__submit:hover { border-color: var(--ac-ink); }
.rlcc-account-tablebar__count { margin: 0; font-size: 14px; color: var(--ac-muted); font-variant-numeric: tabular-nums; }
/* Les deux tableaux de l'écran se suivent verticalement, et leurs intitulés d'offre
   n'ont pas la même longueur : à largeur automatique, chacun calait ses colonnes sur son
   propre contenu et les dates ne tombaient pas en face. Date et statut sont donc fixés,
   l'intitulé prend ce qui reste. */
.rlcc-account-table th:nth-child(2), .rlcc-account-table td:nth-child(2) { width: 22%; }
.rlcc-account-table th:nth-child(3), .rlcc-account-table td:nth-child(3) { width: 24%; }

/* Offres retirées : posées sous le tableau principal, détachées par un vrai blanc — le
   candidat doit voir qu'il change de lot, pas croire que la liste continue. */
.rlcc-account-expired { margin-top: 40px; }
.rlcc-account-panel__subtitle {
  display: flex; align-items: center; gap: 10px;
  margin: 0 0 4px; font-size: 20px; font-weight: 600; color: var(--ac-ink);
}

.rlcc-account .rlcc-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 24px; }

.rlcc-account .rlcc-badge { display: inline-block; padding: 5px 12px; border-radius: 999px; background: color-mix(in srgb, var(--ac-primary) 10%, transparent); color: var(--ac-primary); font-size: 12px; font-weight: 600; }
.rlcc-account .rlcc-badge--accent { background: color-mix(in srgb, var(--ac-teal) 12%, transparent); color: var(--ac-teal); }
.rlcc-account .rlcc-badge--muted  { background: var(--ac-surface-alt); color: var(--ac-muted); }
.rlcc-account .rlcc-badge--danger { background: color-mix(in srgb, var(--ac-red) 10%, transparent); color: var(--ac-red); }

.rlcc-account .rlcc-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 12px 22px; border-radius: 8px; border: 1px solid transparent;
  font-family: inherit; font-size: 14px; font-weight: 600; line-height: 1.2;
  text-decoration: none; text-transform: none; letter-spacing: normal; cursor: pointer;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.rlcc-account .rlcc-btn--primary { background: var(--ac-primary); border-color: var(--ac-primary); color: var(--ac-on-primary); }
.rlcc-account .rlcc-btn--primary:hover { background: var(--ac-primary-dark); border-color: var(--ac-primary-dark); color: var(--ac-on-primary); }
.rlcc-account .rlcc-btn--lg { padding: 14px 26px; font-size: 15px; }
.rlcc-account .rlcc-btn--ghost { background: transparent; border-color: var(--ac-border); color: var(--ac-ink); }
.rlcc-account .rlcc-btn--ghost:hover { background: var(--ac-canvas); }

.rlcc-account .rlcc-label { display: block; margin-bottom: 8px; font-size: 14px; font-weight: 500; color: var(--ac-ink); text-transform: none; letter-spacing: normal; line-height: 1.43; }
.rlcc-account .rlcc-input,
.rlcc-account .rlcc-select,
.rlcc-account select,
.rlcc-account textarea,
.rlcc-account input[type="text"],
.rlcc-account input[type="email"],
.rlcc-account input[type="tel"],
.rlcc-account input[type="search"],
.rlcc-account input[type="number"] {
  width: 100%; height: 46px; padding: 5px 16px;
  border: 1px solid var(--ac-ink); border-radius: var(--ac-radius-inner);
  background: var(--ac-surface); font-family: inherit; font-size: 16px; color: var(--ac-ink);
}
/* Le champ de recherche interne d'une liste cherchable (.rlcc-combo__input, posé par
   front.js quand une liste dépasse le seuil cherchable) est un input[type="text"] : les
   deux règles génériques ci-dessus ET plus bas (bordure, hauteur) le capturaient par
   erreur et écrasaient son propre style (border: 0, hauteur 34px dans front.css). Un
   sélecteur plus spécifique que les deux, posé UNE SEULE FOIS, le restaure sans toucher
   aux deux règles génériques (qui continuent de s'appliquer identiquement à tous les
   autres champs, y compris email/téléphone/civilité). */
.rlcc-account .rlcc-combo__input[type="text"] { border: 0; height: 34px; }
/* Le CONTENANT de ce champ, lui, n'était rattrapé nulle part. `.rlcc-combo__control` est
   un `div` : les deux règles génériques ci-dessus ne visent que input/select/textarea et
   ne l'atteignent jamais. Il gardait donc le filet générique de front.css
   (`--rlcc-color-border-strong`, que newwork-account.css retaille en beige pour ces
   surfaces) — 1,6:1 sur blanc quand le champ d'à côté est à 16,9:1. À l'écran, une liste
   cherchable n'avait pas l'air d'être là : elle ne se matérialisait qu'au focus, quand le
   filet passe à l'accent. Seule la COULEUR est reprise ; la géométrie du contrôle
   (flex, hauteur, gouttières) reste celle du composant. */
.rlcc-account .rlcc-combo__control { border-color: var(--ac-ink); }
/* Les surfaces qui FLOTTENT gardent leur ombre, même là où la variante de présentation
   met `--ac-shadow` à plat. Sur ces écrans, `--rlcc-shadow-md` vaut `none` (cf. l'entête
   de newwork-account.css) et le panneau d'une liste déroulante n'a par ailleurs aucune
   bordure : blanc sur blanc, il se confondait avec la page — on ne voyait plus où
   commençait la liste, ni que le pied « Valider » lui appartenait. L'ombre n'est pas un
   ornement ici, elle dit qu'une couche est passée au-dessus du formulaire ; c'est
   pourquoi elle ne suit pas les jetons que la variante aplatit, et reste discrète.
   Le panneau des suggestions, lui, n'est pas repris : il porte déjà un filet à l'encre
   qui le détache (cf. newwork-account.css), et l'ombre par-dessus l'alourdirait. */
.rlcc-account .rlcc-combo__panel {
  box-shadow:
    0 0 0 1px rgba(0, 0, 0, .06),
    0 2px 4px rgba(0, 0, 0, .05),
    0 10px 24px rgba(0, 0, 0, .10);
}
.rlcc-account textarea { height: auto; min-height: 100px; padding: 12px 16px; }
.rlcc-account .rlcc-select,
.rlcc-account select {
  -webkit-appearance: none; -moz-appearance: none; appearance: none;
  padding-right: 40px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6' fill='none'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23003264' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: calc(100% - 12px) center; background-size: 10px;
}
/* Les deux dernières lignes tiennent l'état actif d'une liste cherchable. Elles ne sont
   pas décoratives : front.css le pose déjà, mais à DEUX classes — exactement le poids du
   filet de repos ci-dessus, qui est écrit après lui et l'emporterait. Reposées ici à trois
   classes, elles repassent devant, et le champ continue de s'allumer quand on l'ouvre. */
.rlcc-account .rlcc-input:focus,
.rlcc-account .rlcc-select:focus,
.rlcc-account select:focus,
.rlcc-account textarea:focus,
.rlcc-account input:focus,
.rlcc-account .rlcc-combo.is-open .rlcc-combo__control,
.rlcc-account .rlcc-combo__control:focus-within { outline: none; border-color: var(--ac-primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ac-primary) 12%, transparent); }
.rlcc-account .rlcc-field { margin-bottom: 40px; }
.rlcc-account .rlcc-account-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
.rlcc-account .rlcc-account-form__grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 40px 16px; }
.rlcc-account .rlcc-account-form__grid > .rlcc-field { margin-bottom: 0; grid-column: span 2; }
.rlcc-account .rlcc-account-form__grid > .rlcc-field--full  { grid-column: 1 / -1; }
.rlcc-account .rlcc-account-form__grid > .rlcc-field--half  { grid-column: span 3; }
.rlcc-account .rlcc-account-form__grid > .rlcc-field--third { grid-column: span 2; }
/* Date de naissance : champ non natif rendu par FormRenderer (générique, sans classe de
   largeur) — un champ court reste en demi-largeur, comme code postal et civilité. */
.rlcc-account .rlcc-account-form__grid > .rlcc-field[data-field="date_naissance"] { grid-column: span 3; }
@media (max-width: 900px) {
  .rlcc-account .rlcc-account-form__grid { grid-template-columns: 1fr; }
  .rlcc-account .rlcc-account-form__grid > .rlcc-field { grid-column: 1 / -1; }
}
/* Date de naissance : trois listes alignées, comme dans le formulaire de candidature
   (cf. apply-form.css) — sans cette règle, `.rlcc-select` (largeur 100%) les empile l'une
   sous l'autre. Pas de palier dédié : `flex-wrap` les replie de lui-même quand la place
   manque, exactement comme à la candidature — trois colonnes tassées sur un téléphone
   seraient moins lisibles qu'une ligne qui rend l'année à elle seule. Le mois porte le
   texte le plus long (les noms de mois en français, jusqu'à 9 caractères) : c'est lui qui
   reçoit le plus de place, l'année n'en demandant qu'un peu plus que le jour (4 chiffres
   contre 2). */
.rlcc-account .rlcc-dob {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 16px;
}
.rlcc-account .rlcc-dob__part {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  flex: 1 1 84px;
}
.rlcc-account .rlcc-dob__part--m { flex: 2 1 148px; }
.rlcc-account .rlcc-dob__part--a { flex: 1 1 104px; }
.rlcc-account .rlcc-dob__label {
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
}
.rlcc-account .rlcc-account-form,
.rlcc-account .rlcc-cv-list,
.rlcc-account .rlcc-account-alert-create,
.rlcc-account .rlcc-account-danger {
  background: var(--ac-surface); border: 0;
  border-radius: 10px; box-shadow: none; padding: 40px;
}
.rlcc-account .rlcc-account-alert-quota {
  background: var(--ac-surface); border: 0;
  border-radius: 10px; box-shadow: none; padding: 30px;
}
.rlcc-account .rlcc-account-alert-quota .rlcc-account-empty { margin: 0; }
.rlcc-account .rlcc-account-alert-create .rlcc-alert__intro { display: none; }
.rlcc-account .rlcc-account-alert-create .rlcc-container { max-width: none; margin: 0; padding: 0; width: 100%; }
.rlcc-account .rlcc-account-alert-create .rlcc-alert-form {
  max-width: none; width: 100%; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none;
}
.rlcc-account .rlcc-account-alert-create .rlcc-alert-form {
  display: flex; flex-direction: column; align-items: stretch;
}
.rlcc-account .rlcc-account-alert-create .rlcc-alert-form__required {
  margin: 0 0 24px; font-size: 13px; font-weight: 400; color: var(--ac-muted); line-height: 1.43;
}
.rlcc-account .rlcc-account-alert-create .rlcc-alert-form__head { margin: 0 0 40px; }
.rlcc-account .rlcc-account-alert-create .rlcc-alert-form__criteria { margin: 0 0 40px; }
.rlcc-account .rlcc-account-alert-create .rlcc-alert-form__field { margin: 0 0 40px; }
.rlcc-account .rlcc-account-alert-create .rlcc-alert-form__section {
  margin: 0 0 32px; padding: 0 0 15px; border-bottom: 1px solid var(--ac-border);
}
.rlcc-account .rlcc-account-alert-create .rlcc-alert-form__section-title {
  margin: 0; font-size: 24px; font-weight: 600; color: var(--ac-ink); line-height: 1.2;
}
.rlcc-account .rlcc-account-alert-create .rlcc-alert-form__section-help { margin: 8px 0 0; }
.rlcc-account .rlcc-account-alert-create .rlcc-alert-form__actions { margin: 0; }
.rlcc-account .rlcc-label__note { font-weight: 400; color: var(--ac-muted); }
.rlcc-account .rlcc-radio input,
.rlcc-account .rlcc-checkbox input { accent-color: var(--ac-primary); }
.rlcc-account .rlcc-account-form__required { margin: 0 0 16px; font-size: 13px; font-weight: 400; color: var(--ac-muted); line-height: 1.43; }
.rlcc-account .rlcc-help { margin: 8px 0 0; font-size: 13px; font-weight: 400; color: var(--ac-muted) !important; line-height: 1.43; }
.rlcc-account .rlcc-account-danger { border-color: color-mix(in srgb, var(--ac-red) 25%, transparent); }
.rlcc-account .rlcc-account-form__actions .rlcc-btn--primary,
.rlcc-account .rlcc-account-alert-create .rlcc-btn--primary,
.rlcc-account button[type="submit"].rlcc-btn--primary {
  border-radius: var(--ac-radius-inner); padding: 14px 36px; font-size: 16px; font-weight: 600; line-height: 1; text-transform: uppercase;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .08);
}
.rlcc-account .rlcc-dropzone {
  border: 1px dashed var(--ac-primary); border-radius: var(--ac-radius-inner); padding: 20px;
  background: color-mix(in srgb, var(--ac-primary) 20%, transparent); text-align: center; color: var(--ac-text);
}
.rlcc-account .rlcc-dropzone:hover,
.rlcc-account .rlcc-dropzone:focus-within { border-color: var(--ac-primary); background: color-mix(in srgb, var(--ac-primary) 20%, transparent); }
.rlcc-account .rlcc-dropzone__icon {
  width: auto; height: auto; border: 0; border-radius: 0;
  background: transparent; color: var(--ac-ink);
}
.rlcc-account .rlcc-dropzone__icon .fi { font-size: 26px; line-height: 0; display: inline-flex; }
.rlcc-account .rlcc-dropzone__label { font-family: inherit; font-size: 14px; font-weight: 500; color: var(--ac-text); letter-spacing: normal; }
.rlcc-account .rlcc-dropzone__btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 38px; padding: 0 16px; border-radius: 6px;
  background: var(--ac-primary); color: var(--ac-on-primary); font-size: 14px; font-weight: 500;
}
.rlcc-account .rlcc-dropzone__hint { margin: 8px 0 0; font-size: 13px; font-weight: 400; color: var(--ac-muted); text-align: left; }
.rlcc-account .rlcc-cv-list, .rlcc-account .rlcc-alert-list { list-style: none; margin: 0; display: flex; flex-direction: column; gap: 0; }
.rlcc-account .rlcc-cv-item, .rlcc-account .rlcc-alert-list__item {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 16px;
  padding: 16px 0; border: 0; border-bottom: 1px solid var(--ac-border); border-radius: 0; background: transparent;
}
.rlcc-account .rlcc-cv-item:last-child, .rlcc-account .rlcc-alert-list__item:last-child { border-bottom: 0; }

.rlcc-account-docs {
  display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap;
  margin-bottom: 22px; padding: 20px 24px;
  background: var(--ac-surface); border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius); box-shadow: var(--ac-shadow-sm);
}
.rlcc-account-docs__title { margin: 0 0 4px; font-size: 16px; font-weight: 600; color: var(--ac-ink); }
.rlcc-account-docs__text { margin: 0; font-size: 14px; color: var(--ac-muted); }

/* Écrans de connexion. Ils redéclaraient ici les jetons de charte à partir des `--ac-*`
   pour imposer le bleu du thème « compte » : maintenant que les `--ac-*` tiennent leur
   valeur de la charte, cette redéclaration formerait un CYCLE (`--rlcc-color-primary`
   lisant `--ac-primary`, qui lit `--rlcc-color-primary`), et un cycle rend les deux
   variables invalides — l'aplat sortirait sans couleur du tout. Les écrans de connexion
   suivent donc la charte comme le reste de l'espace. */
.rlcc-account.rlcc-account--auth {
  display: block; max-width: none; width: 100%;
  margin: 0; padding: 0; border-radius: 0;
  background: var(--ac-surface); min-height: 100vh;
}
.rlcc-auth {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  min-height: 100vh;
}

.rlcc-auth__showcase {
  position: relative;
  display: flex; align-items: center;
  padding: 64px 56px;
  overflow: hidden;
  background-color: var(--ac-primary);
  /* Voile de charte par-dessus l'image (`--ac-auth-veil`, dosé en administration entre 0
     et 1). Il est posé en FACTEUR des trois couches plutôt qu'en couche supplémentaire :
     une quatrième couche opaque cacherait la photo au lieu de la teinter, et le repli à 1
     redonne au multiplicateur les pourcentages historiques — un site qui ne règle rien
     rend donc exactement l'aplat d'avant. */
  background-image:
    linear-gradient(150deg, color-mix(in srgb, var(--ac-primary-dark) calc(78% * var(--ac-auth-veil, 1)), transparent) 0%, color-mix(in srgb, var(--ac-primary) calc(62% * var(--ac-auth-veil, 1)), transparent) 45%, color-mix(in srgb, var(--ac-teal) calc(55% * var(--ac-auth-veil, 1)), transparent) 100%),
    var(--ac-auth-bg, linear-gradient(150deg, var(--ac-primary) 0%, var(--ac-teal) 100%));
  background-size: cover;
  background-position: 50% 40%;
}
.rlcc-auth__showcase-inner { position: relative; max-width: 440px; color: var(--ac-on-image); }
.rlcc-auth__eyebrow {
  margin: 0 0 18px; font-size: 13px; font-weight: 600;
  letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .85);
}
.rlcc-account--auth .rlcc-auth__showcase-title {
  margin: 0 0 18px; font-size: 40px; font-weight: 700; line-height: 1.15; color: var(--ac-on-image);
}
.rlcc-auth__showcase-text {
  margin: 0 0 34px; font-size: 17px; font-weight: 400; line-height: 1.6; color: rgba(255, 255, 255, .92);
}
.rlcc-auth__features { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 16px; }
.rlcc-auth__features li {
  display: flex; align-items: center; gap: 14px;
  font-size: 16px; font-weight: 500; color: var(--ac-on-image);
}
.rlcc-auth__feature-icon {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: 50%;
  background: rgba(255, 255, 255, .18); color: var(--ac-on-image);
}

.rlcc-auth__panel {
  display: flex; align-items: center; justify-content: center;
  padding: 56px 40px; background: var(--ac-surface);
}
.rlcc-auth__card { width: 100%; max-width: 400px; text-align: center; }
.rlcc-auth__badge {
  display: inline-flex; align-items: center; justify-content: center;
  width: 62px; height: 62px; margin: 0 0 22px; border-radius: 50%;
  background: color-mix(in srgb, var(--ac-primary) 10%, transparent); color: var(--ac-primary);
}
.rlcc-auth__badge svg { display: block; }
.rlcc-account--auth .rlcc-account__auth-title::before { content: none; display: none; }
.rlcc-account--auth .rlcc-account__auth-title { margin: 0 0 10px; font-size: 26px; font-weight: 700; color: var(--ac-ink); }
.rlcc-account--auth .rlcc-account__auth-text { margin: 0 auto 28px; max-width: 340px; font-size: 15px; color: var(--ac-muted); line-height: 1.6; }
.rlcc-account--auth .rlcc-note { margin: 0 0 20px; text-align: left; }
.rlcc-account--auth .rlcc-account__auth-form { text-align: left; }
.rlcc-account--auth .rlcc-account__auth-form .rlcc-label {
  display: block; margin: 0 0 8px; font-size: 13px; font-weight: 600; color: var(--ac-ink);
}
.rlcc-account--auth .rlcc-account__auth-form .rlcc-input {
  width: 100%; height: 52px; padding: 0 16px;
  border: 1px solid var(--ac-border); border-radius: var(--ac-radius-sm);
  background: var(--ac-surface); font-size: 15px; color: var(--ac-text);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.rlcc-account--auth .rlcc-account__auth-form .rlcc-input:focus {
  outline: none; border-color: var(--ac-primary);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ac-primary) 14%, transparent);
}
.rlcc-account--auth .rlcc-account__auth-form button[type="submit"].rlcc-btn--primary {
  width: 100%; margin-top: 20px; padding: 16px 20px; border: 0;
  border-radius: var(--ac-radius-sm); background: var(--ac-primary); color: var(--ac-on-primary);
  font-size: 15px; font-weight: 600; letter-spacing: .02em; text-transform: uppercase;
  box-shadow: 0 6px 16px color-mix(in srgb, var(--ac-primary) 22%, transparent); cursor: pointer;
  transition: background-color .15s ease, box-shadow .15s ease;
}
.rlcc-account--auth .rlcc-account__auth-form button[type="submit"].rlcc-btn--primary:hover {
  background: var(--ac-primary-dark); box-shadow: 0 8px 20px color-mix(in srgb, var(--ac-primary) 28%, transparent);
}
.rlcc-account--auth .rlcc-account__auth-hint { margin: 18px 0 0; font-size: 13px; color: var(--ac-muted); line-height: 1.5; }

/* ── Connexion en deux temps : demander l'envoi, puis saisir le code ──────────
   Un seul formulaire porte les deux états, et la classe `is-code` dit lequel est
   à l'écran. Deux formulaires auraient obligé à ressaisir l'adresse au moment
   même où le candidat touche au but.

   Rien ne dépend du script pour ÊTRE COHÉRENT : au premier temps, le champ du
   code est masqué ET désactivé côté gabarit — un champ masqué mais actif partirait
   quand même, et un `required` invisible bloquerait l'envoi sur un champ que
   personne ne peut atteindre. */
.rlcc-account--auth .rlcc-account__auth-form .rlcc-auth__code-field,
.rlcc-account--auth .rlcc-account__auth-form .rlcc-auth__say--code { display: none; }
.rlcc-account--auth .rlcc-account__auth-form.is-code .rlcc-auth__code-field { display: block; }
.rlcc-account--auth .rlcc-account__auth-form.is-code .rlcc-auth__say--code { display: inline; }
.rlcc-account--auth .rlcc-account__auth-form.is-code .rlcc-auth__say--ask { display: none; }
/* La phrase d'accroche vit hors du formulaire, mais doit suivre le même état. Elle
   le lit sur son voisin plutôt que d'attendre une seconde classe : un seul endroit
   décide du temps où l'on en est, et le script n'a rien de plus à tenir à jour. */
.rlcc-account--auth .rlcc-auth__card .rlcc-auth__say--code { display: none; }
.rlcc-account--auth .rlcc-auth__card:has(.rlcc-account__auth-form.is-code) .rlcc-auth__say--code { display: block; }
.rlcc-account--auth .rlcc-auth__card:has(.rlcc-account__auth-form.is-code) .rlcc-auth__say--ask { display: none; }

/* Six chiffres à recopier depuis un écran vers un autre : espacés, tabulaires et
   assez grands pour qu'un 0 ne se lise pas O, ni un 1 comme un l. Le chiffre est
   ici la seule matière, il mérite la place. */
.rlcc-account--auth .rlcc-account__auth-form .rlcc-auth__code {
  font-size: 26px;
  font-weight: 600;
  letter-spacing: .38em;
  text-indent: .38em;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.rlcc-account--auth .rlcc-account__auth-form .rlcc-auth__code::placeholder {
  color: color-mix(in srgb, var(--ac-muted) 45%, transparent);
  font-weight: 400;
}

/* Repartir d'une autre adresse : une porte de sortie, pas une action. Discrète,
   mais assez large pour se toucher au doigt. */
.rlcc-account--auth .rlcc-account__auth-form .rlcc-auth__again {
  width: 100%;
  min-height: 40px;
  margin-top: 12px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--ac-muted);
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  text-decoration: underline;
  cursor: pointer;
  transition: color .15s ease;
}
.rlcc-account--auth .rlcc-account__auth-form .rlcc-auth__again:hover { color: var(--ac-primary); }

.rlcc-account--auth .rlcc-auth__back {
  display: inline-block; margin-top: 30px;
  color: var(--ac-muted); font-size: 14px; font-weight: 600; text-decoration: none;
  transition: color .15s ease;
}
.rlcc-account--auth .rlcc-auth__back:hover { color: var(--ac-primary); text-decoration: none; }

@media (max-width: 900px) {
  .rlcc-auth { grid-template-columns: 1fr; min-height: 100vh; }
  .rlcc-auth__showcase { padding: 48px 32px; min-height: 260px; }
  .rlcc-auth__showcase-inner { max-width: 560px; margin: 0 auto; text-align: center; }
  .rlcc-account--auth .rlcc-auth__showcase-title { font-size: 30px; }
  .rlcc-auth__features { align-items: center; }
  .rlcc-auth__panel { padding: 48px 24px; }
}
@media (max-width: 560px) {
  .rlcc-auth__showcase { padding: 40px 24px; min-height: 0; }
  .rlcc-auth__features { display: none; }
  .rlcc-account--auth .rlcc-auth__showcase-title { font-size: 26px; }
  .rlcc-auth__showcase-text { margin-bottom: 0; font-size: 15px; }
  .rlcc-auth__panel { padding: 36px 20px 48px; }
}

.rlcc-account .rlcc-note { padding: 14px 16px; border: 0; border-radius: 10px; font-size: 14px; }
.rlcc-account .rlcc-note--success { background: color-mix(in srgb, var(--ac-teal) 10%, transparent); color: var(--ac-teal-dark); }
.rlcc-account .rlcc-note--info    { background: color-mix(in srgb, var(--ac-primary) 8%, transparent); color: var(--ac-primary); }
.rlcc-account .rlcc-note--danger  { background: color-mix(in srgb, var(--ac-red) 8%, transparent); color: var(--ac-red); }

.rlcc-account-profile { display: grid; grid-template-columns: minmax(0, 1.85fr) minmax(0, 1fr); gap: 40px; align-items: start; }
.rlcc-account-profile__card {
  position: relative;
  background: var(--ac-surface); border: 1px solid color-mix(in srgb, var(--ac-purple) 30%, transparent);
  border-radius: var(--ac-radius); box-shadow: none; padding: 24px;
}
.rlcc-account-profile__edit {
  position: absolute; top: 14px; right: 10px;
  display: inline-flex; align-items: center; justify-content: center;
  width: 48px; height: 48px; border-radius: 50%;
  background: color-mix(in srgb, var(--ac-plum) 10%, transparent); color: var(--ac-plum);
  transition: background-color .15s ease;
}
.rlcc-account-profile__edit .fi { font-size: 22px; line-height: 0; }
.rlcc-account-profile__edit:hover { background: color-mix(in srgb, var(--ac-plum) 18%, transparent); }
.rlcc-account-deflist { margin: 0; display: flex; flex-direction: column; gap: 24px; }
.rlcc-account-deflist__row { display: grid; grid-template-columns: 40% 1fr; gap: 0; }
.rlcc-account-deflist dt { margin: 0; font-size: 16px; font-weight: 600; color: var(--ac-ink); line-height: 1; }
.rlcc-account-deflist dt::after { content: ' :'; }
.rlcc-account-deflist dd { margin: 0; font-size: 16px; font-weight: 400; color: var(--ac-ink); line-height: 1; }
.rlcc-account-profile__back { margin-bottom: 18px; }
.rlcc-account-form__actions { display: flex; gap: 12px; margin-top: 0; }
.rlcc-account .rlcc-account-form__parse { margin-bottom: 24px; }

.rlcc-account-docs--column {
  flex-direction: column; align-items: stretch; margin-bottom: 0; gap: 0;
  background: var(--ac-surface); border: 0; border-radius: var(--ac-radius); overflow: hidden;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .05); padding: 0;
}
.rlcc-account-docs--column .rlcc-account-docs__title { font-size: 18px; font-weight: 600; color: var(--ac-ink); margin: 0; padding: 24px; border-bottom: 1px solid var(--ac-border); }
.rlcc-cv-upload-info { margin: 24px; background: color-mix(in srgb, var(--ac-primary) 8%, transparent); border: 1px dashed color-mix(in srgb, var(--ac-primary) 70%, transparent); border-radius: var(--ac-radius-inner); padding: 20px; }
.rlcc-cv-upload-info p { margin: 0 0 8px; font-size: 16px; font-weight: 400; color: var(--ac-ink); line-height: 24px; }
.rlcc-cv-upload-btn {
  display: block; margin-top: 10px; width: 100%;
  padding: 10px 24px; border: 0; border-radius: var(--ac-radius-inner);
  background: var(--ac-primary); color: var(--ac-on-primary);
  font-size: 16px; font-weight: 600; text-align: center; text-decoration: none;
  transition: background-color .15s ease;
}
.rlcc-cv-upload-btn:hover { background: var(--ac-primary-dark); color: var(--ac-on-primary); }

.rlcc-account-docs__list { list-style: none; margin: 0; padding: 8px 24px; }
.rlcc-account-doc {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 14px 0; border-bottom: 1px solid var(--ac-border);
}
.rlcc-account-doc:last-child { border-bottom: 0; }
.rlcc-account-doc__icon { color: var(--ac-primary); font-size: 20px; line-height: 1; flex: 0 0 auto; }
.rlcc-account-doc__icon .fi { line-height: 0; }
.rlcc-account-doc__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.rlcc-account-doc__name {
  font-size: 15px; font-weight: 600; color: var(--ac-primary); text-decoration: none;
  overflow-wrap: anywhere;
}
.rlcc-account-doc__name:hover { text-decoration: underline; }
.rlcc-account-doc__meta { font-size: 13px; color: var(--ac-muted); }
.rlcc-account-docs__manage { display: inline-block; margin: 4px 24px 24px; }

.rlcc-account .rlcc-account-form__parse .rlcc-dropzone { position: relative; }
.rlcc-account .rlcc-account-form__parse .rlcc-dropzone input[type="file"] {
  position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer;
}
.rlcc-account .rlcc-dropzone__status { position: relative; z-index: 1; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; margin: 8px 0 0; }
.rlcc-account .rlcc-dropzone__note { flex-basis: 100%; font-size: 13px; color: var(--ac-muted); }
.rlcc-account .rlcc-dropzone.has-file { border-style: solid; }
.rlcc-account .rlcc-account-form__savecv { display: flex; align-items: flex-start; gap: 8px; margin-top: 12px; font-size: 14px; }

.rlcc-account .rlcc-matching__results { display: flex; flex-direction: column; gap: 16px; margin-top: 16px; }
.rlcc-account :is(.rlcc-offre, .rlcc-card) {
  border: 0; border-radius: var(--ac-radius);
  background: var(--ac-surface); box-shadow: var(--ac-shadow-sm);
  overflow: hidden;
  transition: box-shadow .15s ease, transform .15s ease;
}
.rlcc-account :is(.rlcc-offre, .rlcc-card--offer):hover {
  background: var(--ac-surface);
  box-shadow: var(--ac-shadow); transform: translateY(-2px);
}
.rlcc-account .rlcc-card--expired:hover { transform: none; box-shadow: var(--ac-shadow-sm); }

.rlcc-account .rlcc-offre__link { align-items: center; gap: 16px; padding: 20px 22px; color: var(--ac-text); }
.rlcc-account .rlcc-offre__secteur {
  margin-bottom: 6px; color: var(--ac-primary); font-family: inherit;
  font-size: 12px; font-weight: 600; letter-spacing: 1.2px; line-height: 1.4; text-transform: uppercase;
}
.rlcc-account .rlcc-offre__title {
  margin: 0 0 6px; color: var(--ac-ink); font-family: inherit;
  font-size: 18px; font-weight: 600; line-height: 1.3; letter-spacing: normal;
}
.rlcc-account .rlcc-offre__metas,
.rlcc-account .rlcc-offre__metas .rlcc-offre__meta {
  color: var(--ac-text); font-family: inherit;
  font-size: 14px; font-weight: 400; line-height: 1.5; letter-spacing: normal;
}
.rlcc-account .rlcc-offre__metas .rlcc-offre__meta:not(:last-child)::after { color: var(--ac-muted); }
.rlcc-account .rlcc-offre__arrow { color: var(--ac-primary); }
.rlcc-account .rlcc-offre:hover .rlcc-offre__arrow { color: var(--ac-primary); transform: translateX(4px); }

.rlcc-account .rlcc-card--offer { padding: 22px; gap: 12px; }
.rlcc-account .rlcc-card__title { margin: 0; font-family: inherit; font-size: 18px; font-weight: 600; color: var(--ac-ink); letter-spacing: normal; }
.rlcc-account .rlcc-card__title a { color: var(--ac-ink); }
.rlcc-account .rlcc-card__title a:hover { color: var(--ac-primary); }
.rlcc-account .rlcc-card__excerpt { margin: 0; font-family: inherit; font-size: 14px; line-height: 1.5; color: var(--ac-muted); }
.rlcc-account .rlcc-card__meta { font-size: 13px; color: var(--ac-muted); }
.rlcc-account .rlcc-card__date { color: var(--ac-muted); }
.rlcc-account .rlcc-card__arrow {
  background: color-mix(in srgb, var(--ac-primary) 8%, transparent); color: var(--ac-primary); border-radius: var(--ac-radius-inner);
}
.rlcc-account .rlcc-card--expired { opacity: .7; filter: none; }

.rlcc-account .rlcc-btn--secondary { background: var(--ac-surface); color: var(--ac-primary); border-color: var(--ac-primary); }
.rlcc-account .rlcc-btn--secondary:not(:disabled):hover { background: color-mix(in srgb, var(--ac-primary) 6%, transparent); color: var(--ac-primary); border-color: var(--ac-primary); }
.rlcc-account .rlcc-btn--ghost:not(:disabled):hover { background: var(--ac-canvas); color: var(--ac-ink); }
.rlcc-account .rlcc-btn--danger { background: var(--ac-red); border-color: var(--ac-red); color: var(--ac-on-primary); }
.rlcc-account .rlcc-btn--danger:not(.rlcc-btn--secondary):not(.rlcc-btn--ghost):not(:disabled):hover { background: color-mix(in srgb, var(--ac-red) 85%, var(--ac-ink)); border-color: color-mix(in srgb, var(--ac-red) 85%, var(--ac-ink)); color: var(--ac-on-primary); }
.rlcc-account .rlcc-btn--ghost.rlcc-btn--danger { background: transparent; color: var(--ac-red); border-color: transparent; }
.rlcc-account .rlcc-btn--ghost.rlcc-btn--danger:not(:disabled):hover { background: color-mix(in srgb, var(--ac-red) 8%, transparent); color: var(--ac-red); }

.rlcc-account .rlcc-alert-list__main { min-width: 0; flex: 1 1 260px; }
.rlcc-account .rlcc-alert-list__name { margin: 0 0 6px; font-family: inherit; font-size: 16px; font-weight: 600; color: var(--ac-ink); }
.rlcc-account .rlcc-alert-list__meta { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; margin: 0; font-size: 14px; color: var(--ac-muted); }
.rlcc-account .rlcc-alert-list__sent { color: var(--ac-muted); font-size: 13px; }
.rlcc-account .rlcc-alert-list__actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.rlcc-account .rlcc-alert-list__freq { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0; }
.rlcc-account .rlcc-alert-list__freq .rlcc-select { width: auto; min-width: 150px; height: 42px; }
.rlcc-account .rlcc-label--inline { display: inline-flex; align-items: center; margin: 0; font-size: 13px; font-weight: 500; color: var(--ac-text); text-transform: none; letter-spacing: normal; }

.rlcc-account .rlcc-quota { margin: 0 0 16px; font-family: inherit; font-size: 14px; font-weight: 600; letter-spacing: normal; text-transform: none; color: var(--ac-muted); font-variant-numeric: tabular-nums; }
.rlcc-account .rlcc-cv-item__name { flex: 1 1 200px; min-width: 0; font-family: inherit; font-weight: 600; color: var(--ac-ink); overflow-wrap: anywhere; }
.rlcc-account .rlcc-cv-item__meta { color: var(--ac-muted); font-size: 13px; font-variant-numeric: tabular-nums; }
.rlcc-account .rlcc-cv-item__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-inline-start: auto; }
.rlcc-account .rlcc-cv-item__actions form { margin: 0; }

@media (max-width: 900px) {
  .rlcc-account-profile { grid-template-columns: 1fr; }
  .rlcc-account-deflist__row { grid-template-columns: 1fr; gap: 4px; }
  .rlcc-account:not(.rlcc-account--auth) { flex-direction: column; min-height: 0; }
  .rlcc-account__sidebar { width: 100%; flex-basis: auto; box-shadow: 0 2px 12px rgba(0, 0, 0, .08); }
  .rlcc-account__profile { flex-direction: row; justify-content: flex-start; padding: 6px 4px 16px; }
  .rlcc-account__name { text-align: left; }
  .rlcc-account__nav { display: grid; grid-template-columns: repeat(2, 1fr); }
  .rlcc-account__main { flex: 1 1 auto; width: 100%; padding: 24px 20px 40px; }
  .rlcc-account-kpis, .rlcc-account-cardgrid { grid-template-columns: 1fr; }
  .rlcc-account .rlcc-account-form__row { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .rlcc-account__nav { grid-template-columns: 1fr; }
  .rlcc-account .rlcc-account-panel__title { font-size: 22px; }
  .rlcc-account .rlcc-account-hero__title { font-size: 26px; }
  .rlcc-account-hero { padding: 40px 28px; }
}

.rlcc-account .rlcc-account__nav { border: 0; }
.rlcc-account .rlcc-account__navlink { border: 0; }

.rlcc-account.rlcc-account,
.rlcc-account.rlcc-account :is(button, input, select, textarea, label, legend, optgroup) {
  font-family: var(--ac-font-body);
}
.rlcc-account.rlcc-account :is(h1, h2, h3, h4, h5, h6) {
  font-family: var(--ac-font-heading);
}
.rlcc-account .rlcc-account-hero__title { font-size: 34px; font-weight: 700; line-height: 1.35; margin: 0; }
.rlcc-account .rlcc-account-home__heading { font-size: 28px; font-weight: 400; line-height: 1; margin: 60px 0 24px; }
.rlcc-account .rlcc-account-panel__title { font-size: 28px; font-weight: 400; line-height: 1; margin: 0 0 16px; }
.rlcc-account .rlcc-account-card__title { font-size: 18px; font-weight: 600; line-height: 1.2; margin: 0; }
.rlcc-account .rlcc-account-docs__title { font-size: 16px; font-weight: 600; line-height: 1.2; margin: 0 0 4px; }
.rlcc-account .rlcc-account-docs--column .rlcc-account-docs__title { font-size: 18px; font-weight: 600; margin: 0; }
.rlcc-account .rlcc-account-danger__title { font-size: 18px; font-weight: 600; line-height: 1.2; }
.rlcc-account .rlcc-account__auth-title { font-size: 26px; font-weight: 700; line-height: 1.25; }
.rlcc-account .rlcc-account-hero__title strong,
.rlcc-account .rlcc-account-home__heading strong,
.rlcc-account .rlcc-account-panel__title strong,

.rlcc-account .rlcc-account-hero__title { color: var(--ac-on-image); }
.rlcc-account .rlcc-account-home__heading { color: var(--ac-ink); }
.rlcc-account .rlcc-account-panel__title { color: var(--ac-ink); }
.rlcc-account .rlcc-account-card__title,
.rlcc-account .rlcc-account-kpi__label,
.rlcc-account .rlcc-account-docs__title,
.rlcc-account .rlcc-account-deflist dt,
.rlcc-account .rlcc-account-deflist dd { color: var(--ac-ink); }

.rlcc-account .rlcc-account__navlink { color: var(--ac-ink); }
.rlcc-account .rlcc-account__back,
.rlcc-account .rlcc-account-link,
.rlcc-account .rlcc-account-table__link { color: var(--ac-primary); }
.rlcc-account .rlcc-account-profile__edit { color: var(--ac-plum); }
.rlcc-account .rlcc-account-card__action { color: var(--ac-ink); }
.rlcc-account .rlcc-account-card__action--round { color: var(--ac-on-primary); }

.rlcc-account a:hover { color: inherit; text-decoration: none; }
.rlcc-account .rlcc-account__navlink:hover { color: var(--ac-ink); background: rgba(0, 0, 0, .05); }
.rlcc-account .rlcc-account__navlink.is-current,
.rlcc-account .rlcc-account__navlink.is-current:hover { color: var(--ac-on-primary); }
.rlcc-account .rlcc-account-kpi__link { color: var(--ac-ink); }
.rlcc-account .rlcc-account-link:hover,
.rlcc-account .rlcc-account-card__action:hover { color: var(--ac-primary); text-decoration: underline; }
.rlcc-account .rlcc-account__back:hover { color: var(--ac-primary); text-decoration: none; }

.rlcc-account .rlcc-cv-upload-btn,
.rlcc-account .rlcc-cv-upload-btn:hover,
.rlcc-account .rlcc-btn--primary,
.rlcc-account .rlcc-btn--primary:hover { color: var(--ac-on-primary); }

.rlcc-account .rlcc-account__logout-btn { color: var(--ac-ink); background: color-mix(in srgb, var(--ac-purple) 20%, transparent); }
.rlcc-account .rlcc-account__logout-btn:hover { background: color-mix(in srgb, var(--ac-purple) 30%, transparent); }

.rlcc-account--presentation .rlcc-account-card {
  background: var(--ac-surface);
  border: none;
  border-radius: 10px;
  box-shadow: none;
}
.rlcc-account--presentation .rlcc-account-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 56px;
  padding: 8px 20px;
  border-bottom: 1px solid var(--ac-border);
}
.rlcc-account--presentation .rlcc-account-card__title {
  gap: 12px;
  font-size: 16px;
  font-weight: 700;
  color: var(--ac-ink);
}
.rlcc-account--presentation .rlcc-account-count {
  min-width: 28px;
  width: auto;
  height: 28px;
  background: var(--ac-surface-alt);
  color: var(--ac-ink);
  border-radius: 999px;
  padding: 0 8px;
  font-size: 14px;
  font-weight: 600;
}
.rlcc-account--presentation .rlcc-account-card__action:not(.rlcc-account-card__action--round) {
  border-radius: 999px;
  padding: 10px 22px;
  font-size: 14px;
  font-weight: 700;
  color: var(--ac-ink);
  background: color-mix(in srgb, var(--ac-brand) 10%, var(--ac-surface));
}
.rlcc-account--presentation .rlcc-account-card__action:not(.rlcc-account-card__action--round):hover {
  color: var(--ac-ink);
  background: color-mix(in srgb, var(--ac-brand) 16%, var(--ac-surface));
  text-decoration: none;
}
.rlcc-account--presentation .rlcc-account-empty {
  background: var(--ac-empty-bg);
  color: var(--ac-empty-text);
  border-radius: 8px;
  padding: 16px 20px;
}
.rlcc-account--presentation .rlcc-account-empty__text {
  color: inherit;
  font-size: 15px;
}
.rlcc-account--presentation .rlcc-account-home__grid .rlcc-account-card__body {
  padding: 20px 20px 24px;
}
.rlcc-account--presentation .rlcc-account-home__grid .rlcc-account-card .rlcc-account-empty {
  flex: 0 0 auto;
  align-items: flex-start;
  justify-content: flex-start;
  text-align: left;
}
.rlcc-account--presentation .rlcc-account-panel__title strong {
  color: var(--ac-ink);
}

.rlcc-account--presentation .rlcc-account-home__title {
  margin: 0 0 14px;
  font-size: 36px;
  font-weight: 400;
  line-height: 1.2;
  color: var(--ac-ink);
}
.rlcc-account--presentation .rlcc-account-home__title strong {
  font-weight: 700;
}
.rlcc-account--presentation .rlcc-account-home__subtitle {
  margin: 0 0 40px;
  font-size: 16px;
  line-height: 1.5;
  color: var(--ac-ink);
}
.rlcc-account--presentation .rlcc-account-home__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  align-items: stretch;
}
.rlcc-account--presentation .rlcc-account-home__grid .rlcc-account-card {
  min-height: 175px;
}
.rlcc-account--presentation .rlcc-account-home__cta {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  align-self: start;
  gap: 16px;
  padding: 32px 20px;
  border-radius: 10px;
  background: linear-gradient(90deg, var(--ac-cta-from), var(--ac-cta-to));
  color: var(--ac-ink);
  text-decoration: none;
}
.rlcc-account--presentation .rlcc-account-home__cta:hover {
  color: var(--ac-ink);
  text-decoration: none;
  opacity: .92;
}
/* L'icone lit la primaire, pas la fin du degrade : cette derniere est une teinte tres
   eclaircie, et posee sur la pastille blanche elle ne se verrait plus. */
.rlcc-account--presentation .rlcc-account-home__cta-ico {
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  border-radius: 10px;
  background: rgba(255, 255, 255, .7);
  color: var(--ac-primary);
  font-size: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.rlcc-account--presentation .rlcc-account-home__cta-title {
  flex: 1 1 auto;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  color: var(--ac-ink);
}
.rlcc-account--presentation .rlcc-account-home__cta-arrow {
  flex: 0 0 auto;
  align-self: center;
  font-size: 20px;
  line-height: 1;
  color: var(--ac-ink);
}

.rlcc-account--presentation .rlcc-account-profile__card {
  background: var(--ac-surface);
  border-color: var(--ac-border);
}
.rlcc-account--presentation .rlcc-account-profile__edit {
  background: var(--ac-primary);
  color: var(--ac-on-primary);
}
.rlcc-account--presentation .rlcc-account-profile__edit:hover {
  background: var(--ac-primary-dark);
}
.rlcc-account--presentation .rlcc-account-deflist dt {
  color: var(--ac-muted);
}
.rlcc-account--presentation .rlcc-account-deflist dd {
  color: var(--ac-ink);
}
.rlcc-account--presentation .rlcc-account-docs--column {
  box-shadow: none;
}
.rlcc-account--presentation .rlcc-cv-upload-info {
  background: color-mix(in srgb, var(--ac-primary) 8%, var(--ac-surface));
  border-color: color-mix(in srgb, var(--ac-primary) 50%, transparent);
}

.rlcc-account--presentation .rlcc-btn--primary,
.rlcc-account--presentation .rlcc-btn--primary:hover {
  color: var(--ac-on-primary);
}

.rlcc-account--presentation .rlcc-account-cardgrid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.rlcc-account--presentation .rlcc-account-table thead th {
  background: var(--ac-surface-alt);
}
.rlcc-account--presentation .rlcc-badge:not(.rlcc-badge--accent):not(.rlcc-badge--muted):not(.rlcc-badge--danger) {
  background: color-mix(in srgb, var(--ac-primary) 10%, var(--ac-surface));
}

.rlcc-account--presentation .rlcc-account__sidebar {
  background: var(--ac-surface);
}
.rlcc-account--presentation .rlcc-account__name {
  display: none;
}
.rlcc-account--presentation .rlcc-account__navbadge {
  display: none;
}
.rlcc-account--presentation .rlcc-account__navlink {
  padding: 14px 16px;
}
.rlcc-account--presentation .rlcc-account__navlink.is-current {
  font-weight: 700;
}
.rlcc-account--presentation .rlcc-account__navlink--aide {
  margin-top: 12px;
  padding-top: 20px;
  border-top: 1px solid var(--ac-border);
}

.rlcc-account--presentation .rlcc-account__navlink {
  color: var(--ac-ink);
}
.rlcc-account--presentation .rlcc-account__navlink:hover {
  background: color-mix(in srgb, var(--ac-primary) 8%, var(--ac-surface));
  color: var(--ac-primary);
}
.rlcc-account--presentation .rlcc-account__navlink.is-current:hover {
  background: var(--ac-primary);
}

.rlcc-account--presentation .rlcc-account__logout {
  margin-top: 36px;
  padding-top: 0;
  border-top: 0;
}
.rlcc-account--presentation .rlcc-account__logout-btn {
  background: color-mix(in srgb, var(--ac-brand) 12%, var(--ac-surface));
  color: var(--ac-brand);
  border-radius: 10px;
  width: auto;
  padding: 15px 40px;
}
.rlcc-account--presentation .rlcc-account__logout-btn:hover {
  background: color-mix(in srgb, var(--ac-brand) 18%, var(--ac-surface));
}
.rlcc-account--presentation .rlcc-account__logout-btn .fi {
  color: var(--ac-brand);
}

@media (min-width: 901px) {
  .rlcc-account--presentation .rlcc-account__sidebar {
    flex: 0 0 350px;
    width: 350px;
    padding: 40px 20px 20px;
  }
  .rlcc-account--presentation .rlcc-account__profile {
    align-items: flex-start;
    padding: 0 0 16px;
  }
  .rlcc-account--presentation .rlcc-account__nav {
    gap: 2px;
  }
  .rlcc-account--presentation .rlcc-account__main {
    max-width: 1448px;
    margin: 0 auto;
    padding: 56px 64px 44px;
  }
  .rlcc-account--presentation .rlcc-account__body {
    max-width: 1360px;
  }
}

.rlcc-account--presentation .rlcc-account__back {
  margin-bottom: 8px;
  padding-bottom: 0;
  border-bottom: 0;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--ac-ink);
  font-size: 15px;
  font-weight: 700;
}
.rlcc-account--presentation .rlcc-account__back span {
  padding: 5px 11px;
  border-radius: 5px;
  background: var(--ac-brand);
  color: var(--ac-on-primary);
  font-size: 13px;
  line-height: 1;
}

.rlcc-account--presentation .rlcc-account-card__action--round {
  background: var(--ac-brand);
}
.rlcc-account--presentation .rlcc-account-card__action--round:hover {
  background: var(--ac-brand-hover);
}
.rlcc-account--presentation .rlcc-account-card__round {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--ac-brand);
  color: var(--ac-on-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 900px) {
  .rlcc-account--presentation .rlcc-account-home__grid { grid-template-columns: 1fr; }
  .rlcc-account--presentation .rlcc-account-cardgrid { grid-template-columns: 1fr; }
  .rlcc-account--presentation .rlcc-account-home__title { font-size: 28px; }
}

.rlcc-account .rlcc-account-minilist__item {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
}
.rlcc-account .rlcc-account-doc { display: flex; }
.rlcc-account .rlcc-auth__features li { display: flex; }
@media (max-width: 480px) {
  .rlcc-account .rlcc-account-minilist__item { grid-template-columns: 36px minmax(0, 1fr); gap: 10px; }
}

.rlcc-account--presentation .rlcc-account-card { min-height: 175px; }
.rlcc-account--presentation .rlcc-account-card__head {
  min-height: 64px;
  padding: 12px 20px;
  border-bottom: 1px solid var(--ac-border);
}
.rlcc-account--presentation .rlcc-account-card__body,
.rlcc-account--presentation .rlcc-account-home__grid .rlcc-account-card__body { padding: 20px; }
.rlcc-account--presentation .rlcc-account-home__grid,
.rlcc-account--presentation .rlcc-account-cardgrid,
.rlcc-account--presentation .rlcc-account-profile { gap: 20px; }
.rlcc-account--presentation .rlcc-account-count { background: var(--ac-surface-alt); font-weight: 700; }

.rlcc-account--presentation .rlcc-account-card__action:not(.rlcc-account-card__action--round) {
  min-height: 40px;
  padding: 0 24px;
}
.rlcc-account--presentation .rlcc-account-card__action--round,
.rlcc-account--presentation .rlcc-account-card__round { width: 40px; height: 40px; }
.rlcc-account--presentation .rlcc-account-card__action--round .fi { font-size: 16px; }

.rlcc-account--presentation .rlcc-account-card .rlcc-account-empty {
  flex: 0 0 auto;
  align-items: flex-start;
  justify-content: flex-start;
  text-align: left;
}
.rlcc-account--presentation .rlcc-account-empty { padding: 14px 16px; border-radius: 6px; }
.rlcc-account--presentation .rlcc-account-empty__text { font-size: 15px; line-height: 1.6; }

.rlcc-account--presentation .rlcc-account-home__cta { min-height: 175px; padding: 24px 20px; }
.rlcc-account--presentation .rlcc-account-home__cta-ico { border-radius: var(--ac-radius-inner); }

.rlcc-account .rlcc-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border: 0;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: normal;
  text-transform: none;
  white-space: nowrap;
}
.rlcc-account .rlcc-account-minilist__badge { padding: 3px 8px; font-size: 11px; line-height: 15px; }
.rlcc-account--presentation .rlcc-account-minilist__pill {
  min-width: 28px;
  height: 28px;
  border: 0;
  background: var(--ac-surface-alt);
  color: var(--ac-ink);
}

.rlcc-account .rlcc-badge,
.rlcc-account.rlcc-account :is(th, td) {
  font-family: var(--ac-font-body);
}

.rlcc-account--presentation .rlcc-account-table { border: 0; border-radius: 10px; }
.rlcc-account--presentation .rlcc-account-table th,
.rlcc-account--presentation .rlcc-account-table td { padding: 14px 20px; }
.rlcc-account--presentation .rlcc-account-table td { font-variant-numeric: tabular-nums; }
.rlcc-account--presentation .rlcc-account-table thead th {
  border-bottom-color: var(--ac-border);
  letter-spacing: .04em;
}

.rlcc-account--presentation .rlcc-btn {
  min-height: 40px;
  padding: 0 24px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 700;
  text-transform: none;
  letter-spacing: normal;
}
.rlcc-account--presentation .rlcc-btn--lg { min-height: 44px; padding: 0 28px; font-size: 15px; }
.rlcc-account--presentation .rlcc-account-form__actions .rlcc-btn--primary,
.rlcc-account--presentation .rlcc-account-alert-create .rlcc-btn--primary,
.rlcc-account--presentation button[type="submit"].rlcc-btn--primary {
  min-height: 44px;
  padding: 0 32px;
  border-radius: 999px;
  font-size: 15px;
  text-transform: none;
  box-shadow: none;
}
.rlcc-account--presentation .rlcc-cv-upload-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-height: 44px;
  margin-top: 14px;
  padding: 0 24px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 700;
}
.rlcc-account .rlcc-dropzone__btn { border-radius: 999px; min-height: 40px; }

.rlcc-account .rlcc-account-alert-create .rlcc-alert { padding: 0; }
.rlcc-account--presentation .rlcc-account-alert-quota,
.rlcc-account--presentation .rlcc-account-alert-create,
.rlcc-account--presentation .rlcc-account-form,
.rlcc-account--presentation .rlcc-cv-list,
.rlcc-account--presentation .rlcc-account-danger { padding: 24px; }
.rlcc-account .rlcc-alert-list__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 0 0 6px;
}
.rlcc-account .rlcc-alert-list__name { display: inline; margin: 0; }
.rlcc-account .rlcc-alert-list__actions { align-items: center; }
.rlcc-account--presentation .rlcc-alert-list__actions .rlcc-btn { min-height: 40px; padding: 0 20px; }

.rlcc-account .rlcc-account-profile__card { padding: 0; overflow: hidden; }
.rlcc-account--presentation .rlcc-account-profile__card { border: 0; }
.rlcc-account .rlcc-account-profile__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 64px;
  padding: 12px 20px;
  border-bottom: 1px solid var(--ac-border);
}
.rlcc-account .rlcc-account-profile__cardtitle {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--ac-ink);
}
.rlcc-account .rlcc-account-profile__edit {
  position: static;
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
}
.rlcc-account .rlcc-account-profile__edit .fi { font-size: 18px; }
.rlcc-account .rlcc-account-profile__card .rlcc-account-deflist { gap: 14px; padding: 20px; }
.rlcc-account .rlcc-account-deflist__row {
  grid-template-columns: minmax(0, 34%) minmax(0, 1fr);
  gap: 16px;
  align-items: baseline;
}
.rlcc-account .rlcc-account-deflist dt { font-size: 15px; font-weight: 600; line-height: 1.5; }
.rlcc-account .rlcc-account-deflist dd { font-size: 15px; line-height: 1.5; }
.rlcc-account .rlcc-account-deflist dt::after { content: none; }
.rlcc-account .rlcc-account-profile__back { margin: 0 0 10px; }

.rlcc-account .rlcc-account-docs--column .rlcc-account-docs__title {
  display: flex;
  align-items: center;
  min-height: 64px;
  padding: 12px 20px;
  font-size: 18px;
  font-weight: 700;
  color: var(--ac-ink);
  border-bottom: 1px solid var(--ac-border);
}
.rlcc-account .rlcc-cv-upload-info {
  margin: 20px;
  padding: 16px;
  border-style: solid;
  border-radius: 6px;
}
.rlcc-account .rlcc-cv-upload-info p { font-size: 15px; line-height: 1.55; }
.rlcc-account .rlcc-account-docs__list { padding: 4px 20px; }
.rlcc-account .rlcc-account-docs__manage { margin: 4px 20px 20px; }

.rlcc-account--presentation .rlcc-account-favs {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}
.rlcc-account--presentation :is(.rlcc-offre, .rlcc-card--offer):hover {
  box-shadow: 0 6px 18px rgba(0, 0, 0, .08);
}
@media (max-width: 900px) {
  .rlcc-account--presentation .rlcc-account-favs { grid-template-columns: 1fr; }
  .rlcc-account .rlcc-account-deflist__row { grid-template-columns: 1fr; gap: 4px; }
}

.rlcc-account .rlcc-account-home__title { overflow-wrap: anywhere; }
.rlcc-account .rlcc-account-panel__title { margin: 0 0 8px; }
.rlcc-account .rlcc-account-panel__sub { margin: 0 0 28px; }
.rlcc-account .rlcc-account-panel__title + *:not(.rlcc-account-panel__sub) { margin-top: 28px; }

.rlcc-account :is(.rlcc-account-panel__title, .rlcc-account-home__title,
  .rlcc-account-profile__cardtitle,
  .rlcc-account-hero__title) { text-wrap: balance; }
.rlcc-account :is(.rlcc-account-panel__sub, .rlcc-account-home__subtitle,
  .rlcc-account-empty__text, .rlcc-account-card__summary, .rlcc-help,
  .rlcc-account-danger__text) { text-wrap: pretty; }
.rlcc-account :is(.rlcc-account-minilist__meta, .rlcc-account-minilist__pill,
  .rlcc-account-doc__meta, .rlcc-alert-list__sent) { font-variant-numeric: tabular-nums; }

.rlcc-account--presentation .rlcc-account__navlink { min-height: 44px; line-height: 1.3; }
.rlcc-account .rlcc-account__navicon { width: 20px; justify-content: center; }

.rlcc-account :is(.rlcc-btn, .rlcc-account-card__action, .rlcc-account-home__cta,
  .rlcc-account__logout-btn, .rlcc-cv-upload-btn, .rlcc-account-profile__edit,
  .rlcc-account-kpi__link, .rlcc-account__navlink, .rlcc-account-link) {
  transition-property: background-color, border-color, color, box-shadow, opacity, scale;
  transition-duration: .15s;
  transition-timing-function: cubic-bezier(.2, 0, 0, 1);
}
.rlcc-account :is(.rlcc-btn, .rlcc-account-card__action, .rlcc-account-home__cta,
  .rlcc-account__logout-btn, .rlcc-cv-upload-btn, .rlcc-account-profile__edit,
  .rlcc-account-kpi__link):active { scale: .96; }

.rlcc-account :is(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--ac-primary);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .rlcc-account *,
  .rlcc-account *::before,
  .rlcc-account *::after {
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
  }
  .rlcc-account :is(.rlcc-btn, .rlcc-account-card__action, .rlcc-account-home__cta,
    .rlcc-account__logout-btn, .rlcc-cv-upload-btn, .rlcc-account-profile__edit,
    .rlcc-account-kpi__link):active { scale: 1; }
  .rlcc-account :is(.rlcc-offre, .rlcc-card--offer):hover { transform: none; }
}

.rlcc-account .rlcc-account__identity {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  width: 100%;
}
.rlcc-account--presentation .rlcc-account__name {
  display: block;
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;
  color: var(--ac-ink);
  text-align: left;
  overflow-wrap: anywhere;
}
.rlcc-account .rlcc-account__role {
  margin: 0;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.4;
  color: var(--ac-muted);
}
.rlcc-account--presentation .rlcc-account__profile { gap: 14px; padding: 0 0 24px; }

.rlcc-account--presentation .rlcc-account__navlink {
  min-height: 48px;
  padding: 0 16px;
  line-height: 1.3;
}
.rlcc-account--presentation .rlcc-account__logout-btn {
  min-height: 48px;
  padding: 0 22px;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 700;
}
.rlcc-account--presentation .rlcc-account__navlink--aide {
  position: relative;
  margin-top: 15px;
  padding-top: 0;
  border-top: 0;
}
.rlcc-account--presentation .rlcc-account__navlink--aide::before {
  content: "";
  position: absolute;
  inset-inline: 0;
  top: -8px;
  height: 1px;
  background: var(--ac-border);
}

.rlcc-account .rlcc-input,
.rlcc-account .rlcc-select,
.rlcc-account select,
.rlcc-account input[type="text"],
.rlcc-account input[type="email"],
.rlcc-account input[type="tel"],
.rlcc-account input[type="search"],
.rlcc-account input[type="number"] { height: 44px; }
.rlcc-account--presentation .rlcc-btn,
.rlcc-account--presentation .rlcc-btn--lg { min-height: 44px; }
.rlcc-account--presentation .rlcc-alert-list__actions .rlcc-btn { min-height: 44px; padding: 0 20px; }
.rlcc-account .rlcc-dropzone__btn { min-height: 44px; font-size: 14px; font-weight: 700; }
.rlcc-account .rlcc-alert-list__freq .rlcc-select {
  height: 44px;
  padding-inline: 16px 40px;
  border-color: var(--ac-ink);
  border-radius: var(--ac-radius-inner);
}
.rlcc-account .rlcc-btn--ghost.rlcc-btn--danger { border-color: var(--ac-border); }
.rlcc-account .rlcc-btn--ghost.rlcc-btn--danger:not(:disabled):hover {
  background: color-mix(in srgb, var(--ac-red) 8%, transparent);
  border-color: color-mix(in srgb, var(--ac-red) 35%, transparent);
  color: var(--ac-red);
}

.rlcc-account .rlcc-account-form__grid { gap: 28px 20px; }
.rlcc-account .rlcc-account-form__grid > .rlcc-field--wide { grid-column: span 4; }
.rlcc-account .rlcc-field { margin-bottom: 24px; }
@media (max-width: 900px) {
  .rlcc-account .rlcc-account-form__grid > .rlcc-field--wide { grid-column: 1 / -1; }
}

.rlcc-account--presentation .rlcc-account-home__cta { min-height: 0; padding: 20px; }

.rlcc-account .rlcc-account-minilist__more {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  margin: 0 0 12px;
}
.rlcc-account .rlcc-account-minilist + .rlcc-account-minilist__more {
  margin-top: -12px;
  padding-top: 14px;
  border-top: 1px solid var(--ac-border);
}
.rlcc-account--presentation .rlcc-account-minilist__pill {
  justify-self: center;
  padding: 0 8px;
  font-size: 14px;
  font-weight: 700;
}
.rlcc-account .rlcc-account-minilist__more-label { font-size: 13px; color: var(--ac-muted); }
@media (max-width: 480px) {
  .rlcc-account .rlcc-account-minilist__more { grid-template-columns: 36px minmax(0, 1fr); gap: 10px; }
}

.rlcc-account :is(.rlcc-account-home__cta-ico, .rlcc-account-card__action--round,
  .rlcc-account-card__round, .rlcc-account-profile__edit, .rlcc-account-minilist__avatar,
  .rlcc-account__navicon, .rlcc-account-doc__icon, .rlcc-dropzone__icon,
  .rlcc-help-acc__ico) .fi {
  display: block;
  line-height: 1;
  transform: translateY(.045em);
}

.rlcc-account .rlcc-dropzone {
  padding: 28px 20px;
  background: color-mix(in srgb, var(--ac-primary) 5%, transparent);
  border: 1px dashed color-mix(in srgb, var(--ac-primary) 45%, transparent);
  border-radius: var(--ac-radius-inner);
  color: var(--ac-text);
}
.rlcc-account .rlcc-dropzone:hover,
.rlcc-account .rlcc-dropzone:focus-within {
  background: color-mix(in srgb, var(--ac-primary) 9%, transparent);
  border-color: var(--ac-primary);
}
.rlcc-account .rlcc-dropzone__label { color: var(--ac-text); font-size: 15px; }
.rlcc-account .rlcc-dropzone__hint { text-align: center; }

.rlcc-account .rlcc-account-cvlib .rlcc-cv-list {
  padding: 0;
  background: transparent;
  border-radius: 0;
}
.rlcc-account .rlcc-account-cvlib .rlcc-quota { margin: 0; white-space: nowrap; }
.rlcc-account .rlcc-account-docgroup {
  margin: 0 0 2px;
  color: var(--ac-muted);
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1.2px;
  line-height: 1.4;
  text-transform: uppercase;
}
.rlcc-account .rlcc-cv-list + .rlcc-account-docgroup { margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--ac-border); }
.rlcc-account .rlcc-doctype {
  display: flex;
  /* .rlcc-field (front.css) impose flex-direction: column ; sans ce reset les
     boutons radio s'empilent et se recentrent chacun sur sa propre ligne. */
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 22px;
  margin: 0 0 18px;
  padding: 0;
  border: 0;
}
.rlcc-account .rlcc-doctype > .rlcc-label { flex: 1 0 100%; margin: 0 0 2px; padding: 0; }
.rlcc-account .rlcc-doctype .rlcc-radio { display: inline-flex; align-items: center; gap: 8px; margin: 0; }
.rlcc-account .rlcc-doctype .rlcc-radio:has(input:disabled) { opacity: .5; }

.rlcc-account .rlcc-account-minilist { margin: -10px 0 12px; }
.rlcc-account .rlcc-account-minilist__item {
  position: relative;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  gap: 4px 14px;
  margin-inline: -12px;
  padding: 10px 12px;
  border: 0;
  border-radius: var(--ac-radius-inner);
  transition: background-color .15s cubic-bezier(.2, 0, 0, 1);
}
.rlcc-account .rlcc-account-minilist__item + .rlcc-account-minilist__item { margin-top: 2px; }
.rlcc-account .rlcc-account-minilist__item.is-linked:hover { background: color-mix(in srgb, var(--ac-primary) 5%, transparent); }
.rlcc-account .rlcc-account-minilist__item.is-linked .rlcc-account-minilist__title::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
}
.rlcc-account a.rlcc-account-minilist__title:hover { text-decoration: none; }
.rlcc-account .rlcc-account-minilist__badge { align-self: center; margin: 0; }
.rlcc-account .rlcc-account-minilist + .rlcc-account-minilist__more {
  margin-top: 2px;
  padding: 10px 12px;
  border-top: 0;
}
.rlcc-account .rlcc-account-minilist__more { margin-inline: -12px; }
.rlcc-account a.rlcc-account-minilist__more {
  border-radius: var(--ac-radius-inner);
  text-decoration: none;
  transition: background-color .15s cubic-bezier(.2, 0, 0, 1);
}
.rlcc-account a.rlcc-account-minilist__more:hover { background: color-mix(in srgb, var(--ac-primary) 5%, transparent); }
.rlcc-account a.rlcc-account-minilist__more:hover .rlcc-account-minilist__more-label { color: var(--ac-primary); }
@media (max-width: 600px) {
  .rlcc-account .rlcc-account-minilist__item { grid-template-columns: 44px minmax(0, 1fr); }
  .rlcc-account .rlcc-account-minilist__badge { grid-column: 2; justify-self: start; }
}

.rlcc-account .rlcc-account-panel > * + .rlcc-account-card,
.rlcc-account .rlcc-account-form--sections > * + .rlcc-account-card { margin-top: 20px; }
.rlcc-account--presentation .rlcc-account-card { min-height: 0; }
.rlcc-account--presentation :is(.rlcc-account-home__grid, .rlcc-account-cardgrid) .rlcc-account-card {
  min-height: 175px;
}

.rlcc-account .rlcc-account-form--sections,
.rlcc-account--presentation .rlcc-account-alert-quota,
.rlcc-account--presentation .rlcc-account-alert-create,
.rlcc-account--presentation .rlcc-account-danger {
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}
.rlcc-account--presentation :is(.rlcc-account-alert-quota, .rlcc-account-alert-create,
  .rlcc-account-danger, .rlcc-cv-upload) {
  background: var(--ac-surface);
  border-radius: var(--ac-radius);
}
.rlcc-account .rlcc-account-form--sections .rlcc-account-form__grid { margin: 0; }
.rlcc-account .rlcc-account-form--sections .rlcc-account-form__actions { margin-top: 20px; }
.rlcc-account .rlcc-account-card__body > .rlcc-account-form__grid > .rlcc-field:last-child { margin-bottom: 0; }
.rlcc-account .rlcc-account-form__extra > .rlcc-field { grid-column: span 3; }
.rlcc-account .rlcc-account-form__extra > .rlcc-field:has(textarea),
.rlcc-account .rlcc-account-form__extra > .rlcc-field:has(select[multiple]),
.rlcc-account .rlcc-account-form__extra > .rlcc-field:has(.rlcc-radios) { grid-column: 1 / -1; }
@media (max-width: 900px) {
  .rlcc-account .rlcc-account-form__extra > .rlcc-field { grid-column: 1 / -1; }
}
.rlcc-account--presentation .rlcc-account-danger .rlcc-account-card__title { color: var(--ac-red); }
.rlcc-account .rlcc-account-danger__text { margin: 0 0 16px; }
.rlcc-account .rlcc-account-danger__form { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }

.rlcc-account .rlcc-alert-list__item {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px 14px;
  padding: 14px 0;
}
.rlcc-account .rlcc-alert-list__item:first-child { padding-top: 0; }
.rlcc-account .rlcc-alert-list__avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: var(--ac-radius-inner);
  background: var(--ac-surface-alt);
}
.rlcc-account .rlcc-alert-list__avatar i { font-size: 18px; color: var(--ac-muted); }
.rlcc-account .rlcc-alert-list__main { flex: none; }
.rlcc-account .rlcc-alert-list__actions { flex-wrap: nowrap; gap: 10px; }
.rlcc-account .rlcc-alert-list__freq { gap: 10px; }
.rlcc-account .rlcc-label--inline { color: var(--ac-muted); }
@media (max-width: 1100px) {
  .rlcc-account .rlcc-alert-list__item { grid-template-columns: 44px minmax(0, 1fr); }
  .rlcc-account .rlcc-alert-list__actions { grid-column: 2; flex-wrap: wrap; }
}

.rlcc-account .rlcc-help-group .rlcc-help-grid { margin: 0; }
.rlcc-account .rlcc-help-tile { border-radius: var(--ac-radius-inner); }
.rlcc-account .rlcc-help-entry__body > *:first-child { margin-top: 0; }
.rlcc-account .rlcc-help-entry__body > *:last-child { margin-bottom: 0; }

.rlcc-account .rlcc-account-alert-create .rlcc-alert-form__section {
  margin: 4px 0 24px;
  padding: 0 0 12px;
  border-bottom: 1px solid var(--ac-border);
}
.rlcc-account .rlcc-account-alert-create .rlcc-alert-form__section-title {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--ac-muted);
}
.rlcc-account .rlcc-account-alert-create .rlcc-alert-form__section-help {
  margin: 6px 0 0;
  font-size: 13px;
  color: var(--ac-muted);
}
.rlcc-account .rlcc-account-alert-create .rlcc-alert-form__required { margin: 0 0 20px; }
.rlcc-account .rlcc-account-alert-create .rlcc-alert-form__head,
.rlcc-account .rlcc-account-alert-create .rlcc-alert-form__criteria { margin: 0 0 8px; }
.rlcc-account .rlcc-account-alert-create .rlcc-alert-form__field:not(:has(input)) {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
  margin: 0 0 20px;
  padding: 14px 16px;
  background: var(--ac-canvas);
  border-radius: var(--ac-radius-inner);
}
.rlcc-account .rlcc-account-alert-create .rlcc-alert-form__field:not(:has(input)) .rlcc-label {
  margin: 0;
  color: var(--ac-muted);
}
.rlcc-account .rlcc-account-alert-create .rlcc-alert-form__email { margin: 0; }
.rlcc-account .rlcc-account-alert-create .rlcc-alert-form__actions { margin: 4px 0 0; }
.rlcc-account .rlcc-help-grid > .rlcc-help-tile:only-child { grid-column: 1 / -1; }

.rlcc-account--presentation .rlcc-account__avatar {
  width: 60px;
  height: 60px;
  font-size: 22px;
  font-weight: 600;
}
.rlcc-account--presentation .rlcc-account__profile { gap: 12px; padding: 0 0 26px; }
.rlcc-account--presentation .rlcc-account__name { font-size: 16px; line-height: 1.3; }
.rlcc-account .rlcc-account__role {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  line-height: 1.4;
  text-transform: uppercase;
  color: var(--ac-muted);
}
@media (max-width: 900px) {
  .rlcc-account--presentation .rlcc-account__profile { align-items: center; padding: 4px 0 16px; }
}

.rlcc-account--presentation .rlcc-account__profile {
  flex-direction: row;
  align-items: center;
  gap: 14px;
  padding: 0 0 24px;
}
.rlcc-account--presentation .rlcc-account__avatar {
  flex: 0 0 auto;
  width: 46px;
  height: 46px;
  font-size: 17px;
}
.rlcc-account--presentation .rlcc-account__name { font-size: 15px; }

.rlcc-account--presentation .rlcc-btn.rlcc-btn--lg {
  min-height: 44px;
  padding: 0 28px;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: normal;
  line-height: 1.2;
  text-transform: none;
}

.rlcc-account .rlcc-alert-list__actions { gap: 20px; }
.rlcc-account .rlcc-alert-list__freq { gap: 12px; align-items: center; }
.rlcc-account .rlcc-alert-list__freq-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--ac-muted);
}
.rlcc-account .rlcc-segmented {
  display: inline-flex;
  gap: 2px;
  padding: 3px;
  background: var(--ac-surface-alt);
  border-radius: 999px;
}
.rlcc-account .rlcc-segmented__opt {
  min-height: 34px;
  padding: 0 16px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--ac-muted);
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .15s cubic-bezier(.2, 0, 0, 1), color .15s cubic-bezier(.2, 0, 0, 1);
}
.rlcc-account .rlcc-segmented__opt:hover { color: var(--ac-ink); }
.rlcc-account .rlcc-segmented__opt.is-current {
  background: var(--ac-surface);
  color: var(--ac-ink);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .14), 0 0 0 1px rgba(0, 0, 0, .04);
}
.rlcc-account .rlcc-segmented__opt:active { scale: .96; }
.rlcc-account--presentation .rlcc-alert-list__actions .rlcc-btn--ghost { border-color: var(--ac-border); }

@media (max-width: 600px) {
  .rlcc-account .rlcc-alert-list__freq-label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
  .rlcc-account .rlcc-alert-list__freq { width: 100%; }
  .rlcc-account .rlcc-segmented { display: flex; width: 100%; }
  .rlcc-account .rlcc-segmented__opt { flex: 1 1 0; padding: 0 10px; }
}

/* Boîte de confirmation de l'espace candidat, pour les actions qui ne se rattrapent
   pas. Elle est posée à la racine du document — un `position: fixed` se recalerait
   sur le premier ancêtre transformé — donc hors de la portée des `--ac-*`, qui vivent
   sur `.rlcc-account` : ses RAYONS gardent chacun leur repli. Ses COULEURS, elles,
   lisent la charte en direct : account.js pose `class="rlcc rlcc-confirm"`, et `.rlcc`
   est l'une des racines sur lesquelles la charte s'imprime. */
.rlcc-confirm {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  padding: 20px;
  font-family: var(--rlcc-font-body);
}
.rlcc-confirm[hidden] { display: none; }
.rlcc-confirm__scrim {
  position: absolute;
  inset: 0;
  background: color-mix(in srgb, var(--rlcc-color-ink) 55%, transparent);
  animation: rlcc-fade-in 180ms ease both;
}
.rlcc-confirm__box {
  position: relative;
  width: min(100%, 460px);
  padding: 32px;
  background: var(--rlcc-color-surface);
  border-radius: var(--ac-radius, 16px);
  box-shadow: 0 12px 40px rgba(0, 0, 0, .16);
  animation: rlcc-rise 200ms cubic-bezier(.2, 0, 0, 1) both;
}
.rlcc-confirm__title {
  margin: 0 0 10px;
  color: var(--rlcc-color-ink);
  font-family: inherit;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: normal;
}
.rlcc-confirm__text {
  margin: 0 0 26px;
  color: var(--rlcc-color-muted);
  font-size: 15px;
  line-height: 1.5;
}
.rlcc-confirm__error {
  margin: -16px 0 22px;
  color: var(--rlcc-color-danger);
  font-size: 14px;
  line-height: 1.43;
}
.rlcc-confirm__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
}
/* Les états de survol génériques du front portent quatre `:not()` : les règles de
   couleur d'ici reprennent la même forme, sinon le bouton de destruction repasserait à
   l'aplat du bouton principal dès le survol. */
.rlcc-confirm .rlcc-btn { min-height: 44px; padding: 0 22px; border-radius: var(--ac-radius-inner, 8px); font-size: 15px; font-weight: 600; }
.rlcc-confirm .rlcc-btn--ghost { background: transparent; border-color: transparent; color: var(--rlcc-color-muted); }
.rlcc-confirm .rlcc-btn--ghost:not(:disabled):hover { background: var(--rlcc-color-surface-high); color: var(--rlcc-color-text); }
.rlcc-confirm .rlcc-btn--danger { background: var(--rlcc-color-danger); border-color: var(--rlcc-color-danger); color: var(--rlcc-color-on-primary); }
.rlcc-confirm .rlcc-btn--danger:not(.rlcc-btn--secondary):not(.rlcc-btn--ghost):not(:disabled):hover,
.rlcc-confirm .rlcc-btn--danger:not(.rlcc-btn--secondary):not(.rlcc-btn--ghost):not(:disabled):active {
  background: color-mix(in srgb, var(--rlcc-color-danger) 85%, var(--rlcc-color-ink));
  border-color: color-mix(in srgb, var(--rlcc-color-danger) 85%, var(--rlcc-color-ink));
  color: var(--rlcc-color-on-primary);
}
.rlcc-confirm .rlcc-btn:disabled { opacity: .6; }
@media (max-width: 480px) {
  .rlcc-confirm__box { padding: 24px; }
  .rlcc-confirm__actions { justify-content: stretch; }
  .rlcc-confirm__actions .rlcc-btn { flex: 1 1 auto; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
  .rlcc-confirm__scrim,
  .rlcc-confirm__box { animation-duration: .01ms; }
}

/* --- Mention « +N autres » : une entrée de la liste, pas une note de bas de carte ------
   Elle annonce du contenu au même titre que les lignes du dessus, et se lit donc sur la
   MÊME grille : pastille dans la colonne des avatars, à leur gabarit, titre à leur
   graisse. Le filet qui l'en séparait la reléguait en pied de carte, où elle passait pour
   une mention légale. Le cadre en pointillé dit l'inverse : du contenu qui existe, mais
   qui n'est pas déplié ici. Les marges négatives reprennent celles des lignes — sans
   elles, le padding du cadre décalerait la pastille d'un cran vers la droite. */
/* La liste garde 12 px sous elle pour se détacher du lien de bas de carte — mais quand la
   mention la suit, cet espace s'ajoutait à sa propre marge et creusait un trou : la mention
   est la dernière ligne de la liste, pas le bloc d'après. */
.rlcc-account .rlcc-account-minilist:has(+ .rlcc-account-minilist__more) { margin-bottom: 0; }
.rlcc-account .rlcc-account-minilist + .rlcc-account-minilist__more {
  margin-top: 6px;
  padding: 8px 12px;
  border: 1px dashed color-mix(in srgb, var(--ac-primary) 28%, transparent);
  border-radius: var(--ac-radius-inner);
  background: color-mix(in srgb, var(--ac-primary) 2%, transparent);
}
.rlcc-account .rlcc-account-minilist__more {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  margin-inline: -12px;
}
/* Le trait du cadre compte dans le décalage : à -12 px, il repousse son contenu d'un pixel
   et la pastille tombe à côté de la colonne des avatars au lieu de dedans. */
.rlcc-account .rlcc-account-minilist + .rlcc-account-minilist__more { margin-inline: -13px; }
/* La pastille reprend le gabarit ET la forme des avatars du dessus — même carré adouci,
   même rayon : c'est la même colonne, elle ne doit pas y introduire une seconde silhouette.
   Seule la couleur de l'encre la distingue, ce qui suffit à dire qu'elle compte au lieu de
   nommer. */
.rlcc-account .rlcc-account-minilist__more .rlcc-account-minilist__pill,
.rlcc-account--presentation .rlcc-account-minilist__more .rlcc-account-minilist__pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: center;
  min-width: 44px;
  width: 44px;
  height: 44px;
  padding: 0;
  background: var(--ac-surface-alt);
  border: 0;
  border-radius: var(--ac-radius-inner);
  color: var(--ac-primary);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .02em;
}
.rlcc-account .rlcc-account-minilist__more-body {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.rlcc-account .rlcc-account-minilist__more-label {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
  color: var(--ac-ink);
}
.rlcc-account .rlcc-account-minilist__more-hint { font-size: 13px; color: var(--ac-muted); }
.rlcc-account a.rlcc-account-minilist__more:hover {
  background: color-mix(in srgb, var(--ac-primary) 5%, transparent);
  border-color: color-mix(in srgb, var(--ac-primary) 45%, transparent);
}
.rlcc-account a.rlcc-account-minilist__more:hover .rlcc-account-minilist__more-label { color: var(--ac-primary); }
@media (max-width: 480px) {
  .rlcc-account .rlcc-account-minilist__more { grid-template-columns: 36px minmax(0, 1fr); gap: 10px; }
  .rlcc-account .rlcc-account-minilist__more .rlcc-account-minilist__pill,
  .rlcc-account--presentation .rlcc-account-minilist__more .rlcc-account-minilist__pill {
    min-width: 36px;
    width: 36px;
    height: 36px;
  }
}

/* --- Dépôt d'un document : ce que fait l'envoi, pendant qu'il le fait ------------------
   Deux temps distincts, parce que l'attente en a deux : la barre mesure le transfert des
   octets, puis le spinner tient la suite — le serveur déchiffre, contrôle et écrit, et
   pendant ce temps une barre pleine laisserait croire à un écran figé. */
.rlcc-account .rlcc-upload {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0 0 18px;
  padding: 14px 16px;
  background: color-mix(in srgb, var(--ac-primary) 4%, transparent);
  border-radius: var(--ac-radius-inner);
}
.rlcc-account .rlcc-upload__head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  font-size: 14px;
  color: var(--ac-ink);
}
.rlcc-account .rlcc-upload__spinner { color: var(--ac-primary); }
/* Le nom du document est ce qu'on est venu lire : il garde la place, et se tronque plutôt
   que de rejeter l'état à la ligne. */
.rlcc-account .rlcc-upload__name {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rlcc-account .rlcc-upload__state { flex: none; color: var(--ac-muted); font-size: 13px; }
.rlcc-account .rlcc-upload__track {
  position: relative;
  display: block;
  height: 6px;
  overflow: hidden;
  background: color-mix(in srgb, var(--ac-primary) 12%, transparent);
  border-radius: 999px;
}
/* La largeur est animée, pas un `transform` : ici elle EST la donnée: une mise à l'échelle
   horizontale écraserait les extrémités arrondies en ovales. Le calcul de mise en page que
   cela coûte porte sur un seul trait de 6 px rafraîchi quelques fois par seconde, hors de
   toute liste — la règle générale ne s'applique pas à ce cas. */
.rlcc-account .rlcc-upload__bar {
  display: block;
  width: 0;
  height: 100%;
  background: var(--ac-primary);
  border-radius: inherit;
  transition: width .2s linear;
}
/* Transfert fini, serveur au travail : la barre pleine se met à respirer pour dire que
   l'attente continue — sans jamais reculer, ce qui se lirait comme une erreur. */
.rlcc-account .rlcc-upload.is-waiting .rlcc-upload__bar { animation: rlcc-upload-pulse 1.2s ease-in-out infinite; }
@keyframes rlcc-upload-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }
.rlcc-account .rlcc-upload.has-error { background: color-mix(in srgb, var(--ac-red) 6%, transparent); }
.rlcc-account .rlcc-upload.has-error .rlcc-upload__bar { background: var(--ac-red); animation: none; }
.rlcc-account .rlcc-upload.has-error .rlcc-upload__state { color: var(--ac-red); }
@media (prefers-reduced-motion: reduce) {
  .rlcc-account .rlcc-upload__bar { transition: none; }
  .rlcc-account .rlcc-upload.is-waiting .rlcc-upload__bar { animation-duration: 2.4s; }
}

/* Écran des offres sauvegardées : le vidage global partage l'en-tête standard de la carte
   avec le titre — `rlcc-account-card__head` est déjà en `space-between` — et chaque offre
   porte en pied une barre d'actions posée à côté d'elle, jamais dedans, card.php
   enveloppant tout son contenu dans un lien. Aucun interstice sous la carte : c'est ce
   `gap` nul qui fait de cette barre un pied de carte et non une rangée qui flotte
   dessous. */
.rlcc-account-favs__item {
  display: flex;
  flex-direction: column;
  gap: 0;
}
/* Les deux actions forment UNE barre : pas de gouttière entre elles, et chacune prend la
   même part de la largeur. Le retrait d'un pixel superpose les filets voisins — celui du
   bas de la carte et celui du haut des boutons, puis ceux des deux boutons entre eux —
   sans quoi chaque jonction montrerait un trait de 2 px là où l'œil en attend un seul. */
.rlcc-account-favs__actions {
  display: flex;
  gap: 0;
  margin-block-start: -1px;
  /* Fond opaque : la variante de présentation pose une ombre au survol de la carte, et
     elle traversait le bouton fantôme, resté transparent, au lieu de passer derrière. */
  background: var(--ac-surface);
}
/* Le libellé remplace le carré de 44 px du picto seul : chaque action s'étire sur sa
   moitié. Le rayon tombe à zéro pour toutes, les deux angles du bas étant repris plus bas
   par les extrémités de la barre. Porté à 0,3,0 pour passer devant le gabarit de bouton
   de la variante de présentation, qui impose sinon son rembourrage horizontal et son
   rayon. `position: relative` n'est pas décoratif : il retient le complément de nom
   accessible, sorti du flux, dans le bouton qui le porte. */
.rlcc-account .rlcc-account-favs__actions .rlcc-btn {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  min-height: 44px;
  padding: 12px 10px;
  border-radius: 0;
  justify-content: center;
}
.rlcc-account .rlcc-account-favs__actions .rlcc-btn + .rlcc-btn { margin-inline-start: -1px; }
/* Carte et pied ne font qu'un bloc, donc un seul arrondi : celui de la carte descend sous
   la barre. Laissé en haut, il découpait deux encoches au-dessus des angles droits des
   boutons. Une action seule — l'offre expirée, qui n'a pas de lien — est à la fois la
   première et la dernière, et reprend les deux coins. */
.rlcc-account .rlcc-account-favs__actions .rlcc-btn:first-child { border-end-start-radius: var(--ac-radius); }
.rlcc-account .rlcc-account-favs__actions .rlcc-btn:last-child { border-end-end-radius: var(--ac-radius); }
.rlcc-account .rlcc-account-favs__actions .rlcc-btn .fi { font-size: 16px; line-height: 0; }

/* La grille tient maintenant dans le corps de la carte, qui pose déjà 20 px de rembourrage.
   Les 8 px de `margin-block` que newwork-account.css lui donne — du temps où elle était
   posée à nu dans le panneau — s'y ajoutaient : 28 px mesurés en tête comme en pied, 8 de
   plus que chez les voisins (documents, alertes), dont les listes sont à marge nulle. */
.rlcc-account .rlcc-account-card__body > .rlcc-account-favs { margin-block: 0; }

/* Le retrait était calé en bas d'une carte en colonne (front.css) ; il est désormais dans
   une rangée, où ce calage l'empêcherait d'atteindre la hauteur du bouton voisin. */
.rlcc-account .rlcc-account-favs__actions .rlcc-account-favs__remove { align-self: auto; margin-top: 0; }

/* Bascule des deux états de l'écran des offres sauvegardées, pilotée par account.js après
   un retrait unitaire. Les sélecteurs d'attribut portent la spécificité à 0,3,0 : `hidden`
   seul ne suffirait pas, le `display` des règles d'auteur l'emporte sur celui de la
   feuille du navigateur, et le bouton comme la grille en posent un. */
.rlcc-account [data-rlcc-fav-list].is-hidden,
.rlcc-account [data-rlcc-fav-empty].is-hidden,
.rlcc-account [data-rlcc-fav-reset].is-hidden { display: none; }

/* L'annonce du retrait ne s'adresse qu'aux lecteurs d'écran : la disparition de la ligne
   est déjà l'information pour qui voit l'écran. */
.rlcc-account .rlcc-account-favs__live {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* Les cartes d'une rangée s'égalisent en hauteur : la plus courte reçoit l'espace en trop,
   qui tombait jusqu'ici d'un seul bloc sous sa dernière ligne — d'où le trou signalé sous
   la mention « +x autres ». Le corps le répartit donc de part et d'autre au lieu de le
   reléguer en bas ; l'égalisation des rangées, elle, reste en place. Reste la marge de
   queue de la dernière ligne : la liste remonte de 10 px pour que sa première ligne longe
   le haut du corps, il faut le même débord en bas sinon l'écart du bas garde 22 px
   d'avance sur celui du haut. Le corps sans liste (état vide, résumé) n'a pas ce débord de
   tête et n'en veut donc pas non plus en pied. */
.rlcc-account :is(.rlcc-account-home__grid, .rlcc-account-cardgrid) .rlcc-account-card__body {
  justify-content: center;
}
.rlcc-account :is(.rlcc-account-home__grid, .rlcc-account-cardgrid) .rlcc-account-card__body > :last-child {
  margin-bottom: 0;
}
.rlcc-account :is(.rlcc-account-home__grid, .rlcc-account-cardgrid) .rlcc-account-card__body:has(> .rlcc-account-minilist) > :last-child {
  margin-bottom: -10px;
}

/* Fiche du fichier choisi (account.js) : pastille au type du document, nom, poids et type,
   croix de retrait. Elle vit sous la zone de dépôt dans la bibliothèque, et dans la zone de
   parsing du profil, où le gabarit pose son emplacement de statut. Rendue vide au
   chargement, elle ne doit alors rien occuper — sans jamais sortir de l'arbre
   d'accessibilité, faute de quoi l'annonce du fichier ne partirait plus. */
.rlcc-account .rlcc-dropzone__status--under { display: block; margin: 0; text-align: left; }
.rlcc-account .rlcc-dropzone__status--under:not(:empty) { margin-top: 12px; }
.rlcc-account .rlcc-filecard {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--ac-border);
  border-radius: var(--ac-radius-sm);
  background: var(--ac-surface);
  text-align: left;
}
.rlcc-account .rlcc-filecard__badge {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: var(--ac-radius-inner);
  background: color-mix(in srgb, var(--ac-muted) 12%, var(--ac-surface));
  color: var(--ac-muted);
}
.rlcc-account .rlcc-filecard__badge .fi { font-size: 18px; line-height: 0; }
.rlcc-account .rlcc-filecard__badge--pdf {
  background: color-mix(in srgb, var(--ac-red) 12%, var(--ac-surface));
  color: var(--ac-red);
}
.rlcc-account .rlcc-filecard__badge--word {
  background: color-mix(in srgb, var(--ac-primary) 12%, var(--ac-surface));
  color: var(--ac-primary);
}
.rlcc-account .rlcc-filecard__badge--image {
  background: color-mix(in srgb, var(--ac-teal) 12%, var(--ac-surface));
  color: var(--ac-teal);
}
.rlcc-account .rlcc-filecard__body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
/* Un nom de fichier n'a pas d'espace où se couper : sans quoi il pousse la croix hors de
   la fiche. */
.rlcc-account .rlcc-filecard__name { font-size: 14px; font-weight: 600; color: var(--ac-ink); overflow-wrap: anywhere; }
.rlcc-account .rlcc-filecard__meta { font-size: 13px; font-weight: 400; color: var(--ac-muted); }
.rlcc-account .rlcc-filecard__remove {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--ac-muted);
  cursor: pointer;
  transition: background-color .15s ease, color .15s ease;
}
.rlcc-account .rlcc-filecard__remove:hover {
  background: color-mix(in srgb, var(--ac-red) 10%, var(--ac-surface));
  color: var(--ac-red);
}
.rlcc-account .rlcc-filecard__remove .fi { font-size: 18px; line-height: 0; }

/* Plusieurs documents déposés d'un coup : autant de fiches empilées sous la zone. Le
   conteneur y est en `display: block` (variante `--under`), les fiches s'y suivent donc
   déjà — il ne leur manque que l'air entre elles. Le décompte et le refus éventuel
   ferment la pile, chacun sur sa ligne. */
.rlcc-account .rlcc-dropzone__status--under .rlcc-filecard + .rlcc-filecard { margin-top: 8px; }
.rlcc-account .rlcc-dropzone__status--under .rlcc-dropzone__note { display: block; margin-top: 8px; }
.rlcc-account .rlcc-dropzone__error { margin: 8px 0 0; }

/* « Document 2 sur 5 » pendant l'envoi en série : un repère, pas un titre. Il se range
   entre le nom du document et l'état, et se retire quand il n'y en a qu'un — sans quoi
   il laisserait la gouttière du conteneur flexible autour d'un élément vide. */
.rlcc-account .rlcc-upload__count { flex: none; color: var(--ac-muted); font-size: 13px; }
.rlcc-account .rlcc-upload__count:empty { display: none; }

/* Récapitulatif des documents recalés, à côté de la note du serveur : elle dit ce qui est
   entré, celui-ci dit ce qui n'est pas passé et pourquoi. La spécificité (0,3,0) passe
   devant les règles de liste à une seule classe que le thème pose sur les `li`. */
.rlcc-account .rlcc-note ul { margin: 6px 0 0; padding-inline-start: 20px; }
.rlcc-account .rlcc-note li { margin: 2px 0; list-style: disc; }

/* Écran des offres sauvegardées : les cartes d'offre sont blanches et le conteneur qui les
   accueille désormais l'est aussi — elles se détachaient du panneau gris, elles ne se
   détachent plus de rien. L'ombre ne peut pas jouer ce rôle : la variante de présentation
   neutralise `--ac-shadow-sm`. C'est donc un filet, au jeton de bordure de l'espace.
   Porté au seul conteneur d'item de cet écran (`.rlcc-account-favs__item`, propre à
   tab-favoris.php) : card.php est partagé avec les listes publiques du site, qui gardent
   leur filet supérieur et ne doivent rien hériter d'ici. La spécificité 0,3,0 passe devant
   le `border: 0` du gabarit de carte de l'espace, à 0,2,0. */
.rlcc-account .rlcc-account-favs__item :is(.rlcc-offre, .rlcc-card) {
  border: 1px solid var(--ac-border);
  /* L'arrondi du bas passe au pied de carte, qui vient s'y coller : le garder ici
     laisserait deux encoches entre la courbe de la carte et l'angle droit des boutons. */
  border-end-start-radius: 0;
  border-end-end-radius: 0;
}

/* Partout ailleurs que dans la plage ci-dessous, la poignée n'a pas lieu d'être : la barre
   est déjà à sa place. Déclarée AVANT la plage — à spécificité égale, c'est l'ordre qui
   tranche, et la poser après aurait masqué le bouton jusque dans sa propre plage. */
.rlcc-account__aside-toggle { display: none; }

/* ── REPLI DE LA BARRE LATÉRALE, ÉCRANS DU MILIEU ────────────────────────────────
   LE DÉFAUT. La barre garde 310px à toute largeur au-dessus de 900px. Sur un portable
   autour de 1000px — la fenêtre de recette —, il ne reste que ~700px au contenu, et les
   cartes se coupent en plein mot : « Bioley-Orjulaz (Prilly–Le Mo… ». Sous 900px la
   coquille s'empile déjà et le problème n'existe pas ; au-delà de 1280px la place ne
   manque pas. La correction n'a donc lieu QU'ENTRE LES DEUX, et rien ne bouge ailleurs.

   DEUX CRANS, PAS UN. D'abord la barre se resserre d'elle-même sur la largeur de ses
   libellés — c'est gratuit, ça rend 70px au contenu, et personne n'a rien à cliquer.
   Ensuite le bouton permet de la replier sur ses seules icônes quand il faut vraiment
   toute la place. L'état replié ne vit que dans cette plage : la classe est posée sur la
   coquille mais aucune règle ne la lit ailleurs, si bien qu'un candidat qui replie sur son
   portable puis rouvre sur son écran de bureau retrouve la barre entière.

   LE BOUTON EST À CHEVAL SUR LE BORD, en haut : c'est là que l'oeil cherche une poignée,
   et c'est le seul endroit où il ne recouvre aucun libellé, dans l'un comme dans l'autre
   état. */
@media (min-width: 901px) and (max-width: 1280px) {
  .rlcc-account:not(.rlcc-account--auth):not(.is-aside-collapsed) .rlcc-account__sidebar {
    flex-basis: 240px;
    width: 240px;
    transition: flex-basis .2s ease, width .2s ease;
  }
  .rlcc-account__aside-toggle {
    position: absolute;
    top: 26px;
    right: -14px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 1px solid var(--ac-border);
    border-radius: 50%;
    background: var(--ac-surface);
    color: var(--ac-ink);
    cursor: pointer;
    /* Pas d'ombre portée : le fond opaque et la bordure suffisent à détacher le bouton du
       bord, et toute ombre écrite ici serait une valeur hors charte — ce que le test de
       réconciliation refuse, à raison. */
    transition: background-color .2s ease, color .2s ease;
  }
  .rlcc-account__aside-toggle:hover { background: var(--ac-primary); color: var(--ac-on-primary); }
  .rlcc-account__aside-chevron { display: inline-flex; transition: rotate .2s ease; }

  /* DÉPLIÉE MAIS ÉTROITE : PLUS RIEN NE PASSE À LA LIGNE. À 240px, « Ma recherche
     d'emploi » réclame ~165px quand la ligne n'en offre que 144 : le libellé se cassait en
     deux et l'entrée devenait deux fois plus haute que ses voisines. Le texte est resserré
     — police, gouttière et retraits — jusqu'à tenir, et `nowrap` garantit le résultat
     plutôt que de l'espérer : si un libellé plus long arrive un jour, il se coupera d'une
     ellipsis au lieu de déformer la colonne. */
  .rlcc-account:not(.is-aside-collapsed) .rlcc-account__navlink { padding: 12px; gap: 10px; font-size: 14px; }
  .rlcc-account .rlcc-account__navlabel {
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-wrap: nowrap;
    text-overflow: ellipsis;
  }
  /* L'IDENTITÉ NE DÉBORDE PLUS NON PLUS. Une adresse électronique en guise de nom
     — « gasan71555@prorises.com », faute de nom saisi — n'a aucune césure naturelle : elle
     s'étalait sur deux lignes et poussait la barre. Elle se coupe désormais, et le nom
     entier reste lisible en infobulle (cf. shell.php). */
  .rlcc-account .rlcc-account__name {
    overflow: hidden;
    white-space: nowrap;
    text-wrap: nowrap;
    text-overflow: ellipsis;
  }
  /* LE CONTENU RESPIRE MOINS LARGE. 64px de marge de chaque côté sur un écran de 1000px,
     c'est un huitième de la page donné au vide pendant que les cartes se coupent. */
  .rlcc-account--presentation .rlcc-account__main { padding: 32px 28px 36px; }
  /* LE CONTENU PREND CE QUE LA BARRE LUI REND. Il est réglé sur `flex: 0 1 80%` : une
     part FIXE de la coquille, qui ne bouge pas quand la barre se replie. Mesuré à 1000px,
     cela laissait 124px de vide à droite du contenu — la place était libérée, personne ne
     la prenait, et le repli ne servait donc à rien. */
  .rlcc-account:not(.rlcc-account--auth) .rlcc-account__main { flex: 1 1 auto; width: auto; }

  /* REPLIÉE : les icônes seules, et rien qui dépasse. Le nom, les libellés et les
     compteurs s'en vont ; ce qui reste est centré, sans quoi les icônes resteraient
     alignées à gauche d'une colonne devenue étroite.
     LES TAILLES SONT REPRISES UNE À UNE parce qu'aucune n'avait été pensée pour 76px :
     l'avatar (46px) et le bouton de déconnexion (padding 14px de chaque côté autour d'une
     icône de 20) dépassaient tous deux la colonne, et le padding latéral de la barre leur
     retirait encore 32px. */
  .rlcc-account:not(.rlcc-account--auth).is-aside-collapsed .rlcc-account__sidebar {
    flex-basis: 76px;
    width: 76px;
    padding-inline: 12px;
    transition: flex-basis .2s ease, width .2s ease;
  }
  .rlcc-account.is-aside-collapsed .rlcc-account__navlabel,
  .rlcc-account.is-aside-collapsed .rlcc-account__navbadge,
  .rlcc-account.is-aside-collapsed .rlcc-account__identity,
  .rlcc-account.is-aside-collapsed .rlcc-account__logout-btn > span:not(.rlcc-account__navicon) { display: none; }
  .rlcc-account.is-aside-collapsed .rlcc-account__profile { justify-content: center; gap: 0; padding-bottom: 18px; }
  .rlcc-account.is-aside-collapsed .rlcc-account__avatar { width: 40px; height: 40px; font-size: 15px; }
  /* Le retrait horizontal tombe à zéro : dans une colonne de 52px utiles, ce sont les
     seuls pixels qui restent, et une icône de 20px centrée n'a besoin d'aucun d'eux. */
  .rlcc-account.is-aside-collapsed .rlcc-account__navlink,
  .rlcc-account.is-aside-collapsed .rlcc-account__logout-btn {
    justify-content: center;
    gap: 0;
    padding-inline: 0;
  }
  /* Le bouton de déconnexion RETROUVE LA LARGEUR DE LA COLONNE. Retirer son retrait
     horizontal le laissait à la taille de son icône — 20px sur les 52 disponibles — et il
     se posait alors à gauche, décalé de 16px par rapport aux cinq entrées au-dessus.
     Mesuré au rendu : c'est le décalage visible sur la barre repliée. */
  .rlcc-account.is-aside-collapsed .rlcc-account__logout-btn {
    width: 100%;
    padding-block: 12px;
  }
  .rlcc-account.is-aside-collapsed .rlcc-account__nav { gap: 4px; }
  .rlcc-account.is-aside-collapsed .rlcc-account__logout { margin-top: 10px; padding-top: 12px; }
  .rlcc-account.is-aside-collapsed .rlcc-account__aside-chevron { rotate: 180deg; }
}