
/* ---------------------------------------------------------------------------
 * « Tous nos articles » : icones dans les onglets, et « Lire la suite »
 *
 * La maquette met une icone de 30px a gauche du libelle de chaque onglet, et termine
 * chaque carte par « Lire la suite » aligne a droite. Le composant rend les onglets en
 * liens nus et les cartes sans ce libelle : on ajoute les deux ici.
 *
 * Les dessins sont ceux de la maquette. Trois exceptions, signalees : « Banque »,
 * « Actualite » et l onglet « Tous » n existent pas dans la maquette (elle n a ni rubrique
 * Banque ni onglet « Actualite » ou « Tous »), ils sont de nous, dans le meme style.
 *
 * ATTENTION : chaque onglet est cible par son href. Une rubrique sans regle ici sort SANS
 * icone, et son libelle remonte sur la ligne des icones : la barre parait desalignee, sans
 * la moindre erreur. C est ce qui est arrive le 05/11 a « Actualite » et « Avis & Test »,
 * ajoutees aux menus le soir de la reprise des 587 articles. Toute nouvelle rubrique doit
 * donc recevoir sa regle ici.
 * --------------------------------------------------------------------------- */
.eldorado-bib-articles-par-rubrique nav a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.eldorado-bib-articles-par-rubrique nav a::before {
    content: "";
    display: none;
    width: 30px;
    height: 30px;
    flex: none;
    background-color: currentColor;   /* l onglet actif est en accent, les autres en gris : l icone suit */
    -webkit-mask: var(--lmi-icone-onglet) center / contain no-repeat;
    mask: var(--lmi-icone-onglet) center / contain no-repeat;
}

/* « Tous » : cible par sa POSITION, pas par la classe « actif ».
 * La premiere version s'appuyait sur « a.eldorado-bib-lien-pastille-actif », ce qui marchait
 * tant que l'accueil etait la seule page a afficher la barre. Depuis le filtrage sur place,
 * la classe « actif » se deplace d'un onglet a l'autre : « Tous » perdait alors son icone, et
 * la rubrique choisie en recevait deux (la sienne et celle de « Tous »). Le composant emet
 * toujours « Tous » en premier, c'est donc le repere stable.
 * (Cibler l'href n'etait pas une option : il faudrait y coder le domaine, ce qui casserait
 * au demenagement vers le vrai domaine de LMI.) */
.eldorado-bib-articles-par-rubrique nav li:first-child > a::before {

    display: inline-block;
    --lmi-icone-onglet: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223.5%22%20y%3D%223.5%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221.5%22%2F%3E%3Crect%20x%3D%2213.5%22%20y%3D%223.5%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221.5%22%2F%3E%3Crect%20x%3D%223.5%22%20y%3D%2213.5%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221.5%22%2F%3E%3Crect%20x%3D%2213.5%22%20y%3D%2213.5%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221.5%22%2F%3E%3C%2Fsvg%3E");
}

.eldorado-bib-articles-par-rubrique nav a[href$="/actualite/"]::before {
    display: inline-block;
    --lmi-icone-onglet: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%204h12v16H6a2%202%200%200%201-2-2z%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M16%208h3a1%201%200%200%201%201%201v9a2%202%200%200%201-2%202%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M7%208h6M7%2012h6M7%2016h4%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
}

.eldorado-bib-articles-par-rubrique nav a[href$="/alternatifs/"]::before {
    display: inline-block;
    --lmi-icone-onglet: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%203h12l3%206-9%2012L3%209z%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M3%209h18M9%203l3%2018%203-18%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
}

.eldorado-bib-articles-par-rubrique nav a[href$="/assurance-vie/"]::before {
    display: inline-block;
    --lmi-icone-onglet: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%203C7%203%203%207%203%2012h18c0-5-4-9-9-9z%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M12%2012v7a2%202%200%200%200%204%200%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
}

.eldorado-bib-articles-par-rubrique nav a[href$="/avis-et-test/"]::before {
    display: inline-block;
    --lmi-icone-onglet: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%203l2.6%205.3%205.9.9-4.3%204.1%201%205.8L12%2016.4%206.8%2019.1l1-5.8L3.5%209.2l5.9-.9z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
}

.eldorado-bib-articles-par-rubrique nav a[href$="/bourse/"]::before {
    display: inline-block;
    --lmi-icone-onglet: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2020h18%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M4%2016l5-5%204%203%207-8%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M15%206h5v5%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
}

.eldorado-bib-articles-par-rubrique nav a[href$="/crowdfunding/"]::before {
    display: inline-block;
    --lmi-icone-onglet: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%228%22%20cy%3D%228%22%20r%3D%223%22%3E%3C%2Fcircle%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%228%22%20r%3D%223%22%3E%3C%2Fcircle%3E%3Cpath%20d%3D%22M2%2020c0-3%203-5%206-5s6%202%206%205M12%2015.5c1-.4%202.5-.5%204-.5%203%200%206%202%206%205%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
}

.eldorado-bib-articles-par-rubrique nav a[href$="/crypto/"]::before {
    display: inline-block;
    --lmi-icone-onglet: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%3E%3C%2Fcircle%3E%3Cpath%20d%3D%22M9.5%207.5h4a2%202%200%200%201%200%204h-4zm0%204h4.5a2%202%200%200%201%200%204H9.5zM11%206v1.5M11%2015.5V17%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
}

.eldorado-bib-articles-par-rubrique nav a[href$="/epargne/"]::before {
    display: inline-block;
    --lmi-icone-onglet: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M19%207c0-1-1-2-3-2H8C5%205%203%207%203%2010c0%202%201%203%202%204v4h3v-2h6v2h3v-4c1-.5%202-1.5%202-3h2V9h-2%22%3E%3C%2Fpath%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%229%22%20r%3D%220.6%22%3E%3C%2Fcircle%3E%3C%2Fsvg%3E");
}

.eldorado-bib-articles-par-rubrique nav a[href$="/immobilier/"]::before {
    display: inline-block;
    --lmi-icone-onglet: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2021h18%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M5%2021V9l7-5%207%205v12%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M10%2021v-6h4v6%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
}

.eldorado-bib-articles-par-rubrique nav a[href$="/retraite/"]::before {
    display: inline-block;
    --lmi-icone-onglet: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M14%203H6v18h12V7z%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M14%203v4h4M9%2012h6M9%2016h6%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E");
}

.eldorado-bib-articles-par-rubrique nav a[href$="/banque/"]::before {
    display: inline-block;
    --lmi-icone-onglet: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2010l9-5%209%205%22%2F%3E%3Cpath%20d%3D%22M5%2010v8M9.5%2010v8M14.5%2010v8M19%2010v8%22%2F%3E%3Cpath%20d%3D%22M3%2021h18%22%2F%3E%3C%2Fsvg%3E");
}


/* « Lire la suite » : dans la maquette c est un libelle decoratif en fin de carte, aligne
 * a droite, dans l accent. La carte entiere est deja cliquable : un vrai lien en plus
 * ferait doublon pour un lecteur d ecran, d ou le pseudo-element.
 * aria-hidden n existe pas en CSS : un ::after n est de toute facon pas annonce comme un lien. */
/* Sur une page de rubrique, GeneratePress rend un SECOND .entry-meta, vide, en enfant
 * direct de .inside-article : le libelle s'affichait donc DEUX fois. On vise explicitement
 * celui de l'en-tete, le seul qui porte la date et l'auteur. */
.eldorado-bib-cartes article .entry-header .entry-meta::after {
    content: "Lire la suite";
    display: block;
    margin-top: 8px;
    text-align: right;
    font-size: 14px;
    font-weight: 600;
    color: var(--eldorado-accent);
}
