/* Discreet staff entrance to the admin console, in the footer's legal row.
 *
 * It sits in the same <ul> as "Politique de confidentialité" so the footer
 * layout is untouched, but it is drawn as a small outlined pill rather than
 * a plain link: staff can pick it out at a glance, while it stays quiet
 * enough not to read as something the public is meant to click. Muted until
 * hover, in the footer's own cream (#f8f5ef) on dark blue.
 *
 * The selector carries the footer ancestor because the theme sets
 * `.c-footer__copyrights-legal a { opacity: .5 }`, which outranks a bare
 * class and would otherwise pin the pill at half opacity on hover too.
 */

.c-footer__copyrights-legal a.c-footer__staff-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  padding: 0.45em 1.1em;
  border: 1px solid rgba(248, 245, 239, 0.3);
  border-radius: 999px;
  opacity: 0.62;
  white-space: nowrap;
  transition:
    opacity 0.3s cubic-bezier(0.25, 1, 0.5, 1),
    border-color 0.3s cubic-bezier(0.25, 1, 0.5, 1),
    background-color 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}

.c-footer__copyrights-legal a.c-footer__staff-link:hover,
.c-footer__copyrights-legal a.c-footer__staff-link:focus-visible {
  opacity: 1;
  border-color: rgba(248, 245, 239, 0.6);
  background-color: rgba(248, 245, 239, 0.08);
}

/* The padlock is an inline SVG rather than a glyph: the theme's Font
 * Awesome build comes from a cached copy whose .eot/.ttf/.svg fallbacks are
 * missing, and one small shape is not worth depending on it.
 *
 * Its size is NOT set here. The theme has a blanket `svg { width: 100% }`,
 * which beats the SVG's own width/height attributes, so a padlock with no
 * winning size declaration is drawn at the full width of its line — 130 px
 * instead of 10 px. That is a big enough failure, from a small enough
 * cause, that it should not depend on this file arriving: the size lives in
 * a style attribute on the element, which outranks any stylesheet. What is
 * left here is only what a missing size would not break. */
.c-footer__copyrights-legal a.c-footer__staff-link .c-footer__staff-lock {
  flex-shrink: 0;
  position: relative;
  top: -0.03em;
}

/* The legal menu spaces its items with a 1.2rem side margin, which would
 * push the pill away from the row's edge on mobile where the list wraps. */
.c-footer__copyrights-legal li.c-footer__staff-item {
  margin-right: 0;
}

@media (prefers-reduced-motion: reduce) {
  .c-footer__copyrights-legal a.c-footer__staff-link {
    transition: none;
  }
}