/* ============================================================
   SFHI CHROME — compléments navbar/footer non couverts par le
   design system vendorisé : sélecteur de langue + logos sponsors
   du footer. 100 % piloté par les tokens du DS.
   ============================================================ */

/* Le footer du DS reste fixé en bas même sur les pages courtes */
body { min-height: 100vh; display: flex; flex-direction: column; }
main { flex: 1 0 auto; }

/* ---------------------------------------------------------- LANGUAGE SWITCH */
.phla-langswitch {
  display: inline-flex;
  gap: 2px;
  padding: 2px;
  margin: 0;
  background: var(--surface-sunken);
  border: var(--border-width) solid var(--border-subtle);
  border-radius: var(--radius-pill);
}
.phla-langswitch__btn {
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  letter-spacing: var(--tracking-mono);
  color: var(--text-muted);
  background: transparent;
  border: 0;
  border-radius: var(--radius-pill);
  padding: 0.3rem 0.6rem;
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.phla-langswitch__btn:hover { color: var(--text-strong); }
.phla-langswitch__btn:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.phla-langswitch__btn.is-active {
  background: var(--surface-card);
  color: var(--color-primary);
  box-shadow: var(--shadow-xs);
}

/* ---------------------------------------------------------- FOOTER SPONSORS */
.phla-footer__sponsors { display: flex; gap: var(--space-4); align-items: center; flex-wrap: wrap; }
.phla-footer__sponsors img {
  height: 36px; width: auto; object-fit: contain;
  background: #fff; padding: 4px 8px; border-radius: var(--radius-sm);
  filter: grayscale(1); opacity: .8;
  transition: filter var(--dur-base) var(--ease-out), opacity var(--dur-base) var(--ease-out);
}
.phla-footer__sponsors img:hover { filter: none; opacity: 1; }

/* ---------------------------------------------------------- RESPONSIVE NAVBAR */
@media (max-width: 720px) {
  .phla-navbar { flex-wrap: wrap; height: auto; padding-block: var(--space-3); gap: var(--space-3); }
  .phla-navbar__links { flex-wrap: wrap; }
  .phla-wordmark__sub { display: none; }
}
