/*
 * eVous | Guides compacts des pages interieures | 1.0.0
 * Nouvelle feuille a charger APRES les styles du site.
 * Ne remplace ni evous-composants.css ni evous-recherche.css.
 * Seuil mobile du composant : 860px (voir note dans LIRE_DABORD.md).
 */

.evous-guides-compact {
  --evous-guides-compact-accent: #c60303;
  --evous-guides-compact-fond: #f7f7f8;
  --evous-guides-compact-actif: #fff1f1;
  --evous-guides-compact-bordure: #e3e5e8;
  --evous-guides-compact-texte: #333333;
  box-sizing: border-box;
  display: block;
  clear: both;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0 0 1.5em;
  padding: .75em;
  border: 1px solid var(--evous-guides-compact-bordure);
  border-radius: .5em;
  background: var(--evous-guides-compact-fond);
  color: var(--evous-guides-compact-texte);
  font-family: inherit;
  /* Echelle locale : ne depend pas d'un html a 18px ou 20px. */
  font-size: medium;
  font-style: normal;
  font-weight: 400;
  line-height: 1.4;
  text-align: left;
  letter-spacing: normal;
  text-transform: none;
  box-shadow: none;
}

.evous-guides-compact *,
.evous-guides-compact *::before,
.evous-guides-compact *::after { box-sizing: border-box; }

.evous-guides-compact .evous-guides-compact__titre {
  display: block;
  margin: 0;
  padding: 0 0 .65em;
  border: 0;
  border-bottom: 1px solid var(--evous-guides-compact-bordure);
  background: none;
  color: var(--evous-guides-compact-accent);
  font: inherit;
  font-size: 1em;
  font-weight: 600;
  line-height: 1.3;
  text-align: left;
  letter-spacing: normal;
  text-transform: none;
  overflow-wrap: anywhere;
}

.evous-guides-compact .evous-guides-compact__liste {
  display: block;
  float: none;
  width: auto;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  list-style: none;
}

.evous-guides-compact .evous-guides-compact__item {
  display: block;
  float: none;
  clear: none;
  width: auto;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  list-style: none;
}

.evous-guides-compact .evous-guides-compact__item + .evous-guides-compact__item {
  border-top: 1px solid var(--evous-guides-compact-bordure);
}

.evous-guides-compact .evous-guides-compact__item::before,
.evous-guides-compact .evous-guides-compact__item::after { content: none; }

.evous-guides-compact .evous-guides-compact__lien,
.evous-guides-compact .evous-guides-compact__lien:visited {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: .65em;
  float: none;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  min-height: 44px;
  height: auto;
  margin: 0;
  padding: .65em .5em;
  border: 0;
  border-left: 3px solid transparent;
  border-radius: 0;
  background: transparent;
  color: var(--evous-guides-compact-texte);
  font-family: inherit;
  font-size: .9375em;
  font-style: normal;
  font-weight: 400;
  line-height: 1.4;
  text-align: left;
  text-decoration: none;
  text-transform: none;
  letter-spacing: normal;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
  hyphens: none;
  box-shadow: none;
}

.evous-guides-compact .evous-guides-compact__lien::before,
.evous-guides-compact .evous-guides-compact__lien::after { content: none; }

.evous-guides-compact .evous-guides-compact__libelle {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  padding: 0;
  font: inherit;
  color: inherit;
}

.evous-guides-compact .evous-guides-compact__icone,
.evous-guides-compact .evous-guides-compact__fleche {
  display: block;
  flex: 0 0 auto;
  width: 1.25em;
  height: 1.25em;
  margin: 0;
  padding: 0;
  border: 0;
  color: inherit;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.evous-guides-compact .evous-guides-compact__fleche {
  width: .75em;
  height: .75em;
}

/* Seule la page exacte est marquee, pas tous les articles de la rubrique. */
.evous-guides-compact .evous-guides-compact__lien.is-current {
  border-left-color: var(--evous-guides-compact-accent);
  background: var(--evous-guides-compact-actif);
  color: var(--evous-guides-compact-accent);
  font-weight: 600;
  cursor: default;
}
.evous-guides-compact .evous-guides-compact__lien.is-current .evous-guides-compact__fleche {
  visibility: hidden;
}

@media (hover: hover) {
  .evous-guides-compact a.evous-guides-compact__lien:hover {
    background: #eeeeef;
    color: var(--evous-guides-compact-accent);
  }
  .evous-guides-compact a.evous-guides-compact__lien:hover .evous-guides-compact__libelle {
    text-decoration: underline;
    text-underline-offset: .16em;
  }
}

/* Overrides limites au focus : neutralise le focus noir !important du theme. */
.evous-guides-compact a.evous-guides-compact__lien:focus {
  outline: 2px solid var(--evous-guides-compact-accent);
  outline-offset: -2px;
  background: var(--evous-guides-compact-actif) !important;
  color: var(--evous-guides-compact-accent) !important;
  border-color: var(--evous-guides-compact-accent) !important;
  text-shadow: none;
}
.evous-guides-compact a.evous-guides-compact__lien:active {
  background: var(--evous-guides-compact-actif);
  color: var(--evous-guides-compact-accent);
}

/* Deux emplacements dans le HTML, un seul affiche et accessible a la fois. */
.evous-guides-compact.evous-guides-compact--mobile { display: none; }
.evous-guides-compact.evous-guides-compact--desktop { display: block; }

@media (max-width: 860px) {
  .evous-guides-compact.evous-guides-compact--desktop { display: none; }
  .evous-guides-compact.evous-guides-compact--mobile {
    display: block;
    margin: 1em 0 1.5em;
  }
}

@media print {
  .evous-guides-compact { display: none !important; }
}

@media (forced-colors: active) {
  .evous-guides-compact {
    border-color: CanvasText;
    background: Canvas;
    color: CanvasText;
  }
  .evous-guides-compact .evous-guides-compact__titre { color: CanvasText; }
  .evous-guides-compact .evous-guides-compact__lien,
  .evous-guides-compact .evous-guides-compact__lien:visited { color: LinkText; }
  .evous-guides-compact .evous-guides-compact__lien.is-current {
    border-left-color: Highlight;
    color: CanvasText;
  }
  .evous-guides-compact a.evous-guides-compact__lien:focus {
    outline-color: Highlight;
    background: Canvas !important;
    color: LinkText !important;
    border-color: Highlight !important;
  }
}
