@charset "UTF-8";

/* =========================================================================
   THÈME « ÉLYSÉE » POUR FRESHRSS — version sobre
   Inspiré de la charte réelle du site officiel elysee.fr :
   - Fond blanc partout, aucun aplat de couleur
   - Bleu Marianne (#000091) réservé au texte : liens, titres
   - Rouge institutionnel (#e1000f) utilisé uniquement en filet très fin
   - Typographie sérif pour les titres, sans-serif fine pour le texte
   - Beaucoup de gris neutre, hiérarchie discrète, pas d'effets de survol
     agressifs

   Ce fichier s'appuie en priorité sur les variables CSS (--frss-*) définies
   par le thème de base : elles pilotent déjà l'essentiel de l'interface
   (fond, texte, bordures, boutons, formulaires, pagination, alertes...).

   La section « AJUSTEMENTS AVANCÉS » en fin de fichier cible des sélecteurs
   plus spécifiques (en-tête, barre latérale, liste des articles). Si un bloc
   ne s'applique pas chez vous, inspectez l'élément concerné (clic droit →
   Inspecter) et adaptez le sélecteur.
   ========================================================================= */

@import 
url('https://fonts.googleapis.com/css2?family=Source+Serif+4:ital,wght@0,400;0,600;0,700;1,400&family=Public+Sans:wght@400;500;600&display=swap');

:root {
  /* --- Palette Élysée, dosée avec parcimonie --- */
  --elysee-navy: #000091;
  --elysee-red: #e1000f;
  --elysee-cream: #f6f6f4;
  --elysee-grey: #6a6a6a;
  --elysee-grey-light: #929292;
  --elysee-border: #e5e5e5;
  --elysee-ink: #262626;

  --elysee-font-serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --elysee-font-sans: "Public Sans", "OpenSans", "Cantarell", "Helvetica", "Arial", sans-serif;

  /* --- Remplacement des variables du thème de base --- */
  --frss-font-color-dark: var(--elysee-ink);
  --frss-font-color-grey-dark: var(--elysee-grey);
  --frss-font-color-grey-light: var(--elysee-grey-light);
  --frss-font-color-light: #fff;
  --frss-font-color-disabled: #b5b5b5;

  --frss-background-color-error-transparent: #e1000f14;
  --frss-font-color-error: var(--elysee-red);
  --frss-border-color-error: var(--elysee-red);

  --frss-background-color: #ffffff;
  --frss-background-color-transparent: #ffffffcc;
  --frss-background-color-middle: var(--elysee-cream);
  --frss-background-color-dark: #ececec;

  --frss-border-color: var(--elysee-border);

  --frss-switch-accent-color: var(--elysee-navy);

  --frss-noThumbnailImage-background-color: var(--elysee-cream);
  --frss-darken-background-hover-transparent: #0000910d;
  --frss-modal-background-color-transparent: #000019a6;
  --frss-box-shadow-color-transparent: #00009114;

  --frss-scrollbar-handle: #00009126;
  --frss-scrollbar-handle-hover: #00009140;
  --frss-scrollbar-track: transparent;
  --frss-scrollbar-track-hover: transparent;

  line-height: 1.6;
}

/* =========================================================================
   BASE : typographie et fond
   ========================================================================= */

html, body {
  font-family: var(--elysee-font-sans);
  font-weight: 400;
  background-color: var(--frss-background-color);
  color: var(--elysee-ink);
}

h1, h2, h3 {
  font-family: var(--elysee-font-serif);
  font-weight: 600;
  color: var(--elysee-ink);
  letter-spacing: 0;
}

h1 {
  padding-bottom: 0.6rem;
  border-bottom: 1px solid var(--elysee-border);
  position: relative;
}

/* Le seul aplat de rouge du thème : un très fin repère sous les h1,
   à la manière du filet tricolore discret du site officiel. */
h1::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 2.5rem;
  height: 2px;
  background-color: var(--elysee-red);
}

/* =========================================================================
   LIENS — texte bleu marine sobre, jamais de fond coloré
   ========================================================================= */

a {
  color: var(--elysee-navy);
  text-decoration: none;
}

a:hover,
a:focus {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

/* =========================================================================
   BOUTONS — contour fin, pas d'aplat plein sauf l'action principale
   ========================================================================= */

.btn {
  font-family: var(--elysee-font-sans);
  font-weight: 500;
  border-radius: 2px;
  border: 1px solid var(--elysee-border);
  background-color: #fff;
  color: var(--elysee-ink);
  padding: 0.5rem 1rem;
  transition: border-color 0.15s ease, color 0.15s ease;
}

.btn:hover:not([disabled]) {
  border-color: var(--elysee-navy);
  color: var(--elysee-navy);
  cursor: pointer;
}

.btn-important,
button[type="submit"].btn {
  background-color: var(--elysee-navy);
  color: #fff;
  border-color: var(--elysee-navy);
}

.btn-important:hover:not([disabled]),
button[type="submit"].btn:hover:not([disabled]) {
  background-color: #00007a;
  border-color: #00007a;
  color: #fff;
}

/* =========================================================================
   FORMULAIRES
   ========================================================================= */

input, select, textarea {
  border: 1px solid var(--elysee-border);
  border-radius: 2px;
  background-color: #fff;
  color: var(--elysee-ink);
}

input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--elysee-navy);
  box-shadow: 0 0 0 1px var(--elysee-navy);
}

kbd {
  font-family: var(--elysee-font-sans);
  border-radius: 2px;
}

/* =========================================================================
   NAVIGATION — fond blanc, hiérarchie par le texte, pas par la couleur
   ========================================================================= */

.nav-list .nav-header {
  font-family: var(--elysee-font-sans);
  font-weight: 600;
  color: var(--elysee-grey);
  text-transform: uppercase;
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  padding: 0.75rem 1rem 0.25rem;
}

.nav-list .item > a,
.nav-list .item > .as-link {
  color: var(--elysee-ink);
  border-left: 2px solid transparent;
  padding-left: 0.75rem;
}

.nav-list .item > a:hover,
.nav-list .item.active > a,
.nav-list .item[aria-current="page"] > a {
  color: var(--elysee-navy);
  background-color: transparent;
  border-left-color: var(--elysee-red);
  text-decoration: none;
}

/* La barre du haut reste blanche, comme sur elysee.fr : c'est un simple
   filet inférieur qui la sépare du contenu, pas un bandeau de couleur. */
.horizontal-list {
  background-color: #fff;
  color: var(--elysee-ink);
  border-bottom: 1px solid var(--elysee-border);
}

.horizontal-list .item > a,
.horizontal-list .item > .as-link,
.horizontal-list .item > span,
.horizontal-list .dropdown-toggle {
  color: var(--elysee-ink);
}

.horizontal-list .item > a:hover,
.horizontal-list .item > .as-link:hover {
  color: var(--elysee-navy);
  background-color: transparent;
  text-decoration: none;
}

.horizontal-list .item.active > a,
.horizontal-list .item.current > a {
  color: var(--elysee-navy);
  box-shadow: inset 0 -2px 0 var(--elysee-red);
}

.dropdown-menu {
  background-color: #fff;
  border: 1px solid var(--elysee-border);
  border-radius: 2px;
  box-shadow: 0 4px 14px var(--frss-box-shadow-color-transparent);
}

.dropdown-menu .item > a:hover,
.dropdown-menu .item > .as-link:hover {
  background-color: var(--elysee-cream);
  color: var(--elysee-navy);
}

/* =========================================================================
   ALERTES
   ========================================================================= */

.alert {
  border-radius: 2px;
  border-left: 2px solid var(--elysee-navy);
  background-color: var(--elysee-cream);
  color: var(--elysee-ink);
}

.alert-warn,
.alert-error {
  border-left-color: var(--elysee-red);
}

/* =========================================================================
   PAGINATION
   ========================================================================= */

.pagination .item.active {
  color: var(--elysee-red);
  font-weight: 600;
}

.pagination .item a {
  color: var(--elysee-navy);
}

/* =========================================================================
   PAGE DE CONNEXION / INSCRIPTION (main.prompt)
   ========================================================================= */

main.prompt {
  border-top: 2px solid var(--elysee-navy);
  padding-top: 2.5rem;
}

main.prompt h1 {
  border-bottom: none;
  text-align: center;
}

main.prompt h1::after {
  left: 50%;
  transform: translateX(-50%);
}

/* =========================================================================
   AJUSTEMENTS AVANCÉS (best-effort)
   Sélecteurs usuels des versions récentes de FreshRSS pour l'en-tête,
   la barre latérale et le flux d'articles. Fond blanc conservé partout ;
   seuls le texte et un filet fin portent la couleur institutionnelle.
   À vérifier / adapter avec l'inspecteur si votre version diffère.
   ========================================================================= */

#header,
header.header,
#top {
  background-color: #fff;
  color: var(--elysee-ink);
  border-bottom: 1px solid var(--elysee-border);
}

#header a,
header.header a,
#top a {
  color: var(--elysee-ink);
}

#sidebar,
aside#sidebar {
  background-color: #fff;
  border-right: 1px solid var(--elysee-border);
}

.item.flux,
.flux {
  border-bottom: 1px solid var(--elysee-border);
}

.item.flux.unread .item-title,
.flux.unread .item-title,
.item-title .title {
  font-family: var(--elysee-font-serif);
  font-weight: 600;
  color: var(--elysee-ink);
}

.item.flux .item-title .title:hover {
  color: var(--elysee-navy);
}

/* Barre de défilement (Chromium/WebKit) */
::-webkit-scrollbar-thumb {
  background-color: var(--frss-scrollbar-handle);
}
::-webkit-scrollbar-thumb:hover {
  background-color: var(--frss-scrollbar-handle-hover);
}