/* ==========================================================================
   TIMCOD — icônes de secours de l'en-tête et du pied de page.
   Les pictos du site (loupe, menu, croix, flèches, triangles des menus, picto
   « Besoin d'aide ? ») viennent de sa police d'icônes, servie par timcod.fr et
   chargée seulement sur son domaine. Si elle ne se charge pas (pages ouvertes en
   local, autre domaine), timcod-site.js ajoute la classe « tc-icones-svg » sur
   <html> et ces dessins SVG prennent le relais, aux mêmes endroits et tailles.
   Sur www.timcod.fr, la police se charge : ce sont les pictos d'origine qui s'affichent.
   Règles générées à partir de assets/site/timcod.css (mêmes sélecteurs).
   ========================================================================== */
:root {
  --tc-ico-loupe: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='10' cy='10' r='7' fill='none' stroke='%23000' stroke-width='2.4'/%3E%3Cpath d='M15.2 15.2 22 22' stroke='%23000' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E");
  --tc-ico-menu: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 5h20M2 12h20M2 19h20' stroke='%23000' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E");
  --tc-ico-fermer: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 4l16 16M20 4 4 20' stroke='%23000' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E");
  --tc-ico-triangle: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 12'%3E%3Cpath d='M0 0h20L10 12z'/%3E%3C/svg%3E");
  --tc-ico-fleche: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 24'%3E%3Cpath d='M2 12h22M16 4l8 8-8 8' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --tc-ico-timcod: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2.5 3.2c0-1 1.2-1.5 1.9-.8L12 9.6l7.6-7.2c.7-.7 1.9-.2 1.9.8v17.6c0 1-1.2 1.5-1.9.8L12 14.4l-7.6 7.2c-.7.7-1.9.2-1.9-.8z'/%3E%3C/svg%3E");
}

html.tc-icones-svg .icon-search:before { content: ""; display: inline-block; width: 1em; height: 1em; vertical-align: middle; background-color: currentColor; -webkit-mask: var(--tc-ico-loupe) center / contain no-repeat; mask: var(--tc-ico-loupe) center / contain no-repeat; }
html.tc-icones-svg .icon-menu-opener:before { content: ""; display: inline-block; width: 1em; height: 1em; vertical-align: middle; background-color: currentColor; -webkit-mask: var(--tc-ico-menu) center / contain no-repeat; mask: var(--tc-ico-menu) center / contain no-repeat; }
html.tc-icones-svg .icon-arrow-submenu:before { content: ""; display: inline-block; width: 2em; height: 1.2em; vertical-align: middle; background-color: currentColor; -webkit-mask: var(--tc-ico-triangle) center / contain no-repeat; mask: var(--tc-ico-triangle) center / contain no-repeat; }
html.tc-icones-svg .btn--close:before { content: ""; display: inline-block; width: 1em; height: 1em; vertical-align: middle; background-color: currentColor; -webkit-mask: var(--tc-ico-fermer) center / contain no-repeat; mask: var(--tc-ico-fermer) center / contain no-repeat; }
html.tc-icones-svg .Header[data-header-search-is-open=true] .Search-opener:before { content: ""; display: inline-block; width: 1em; height: 1em; vertical-align: middle; background-color: currentColor; -webkit-mask: var(--tc-ico-fermer) center / contain no-repeat; mask: var(--tc-ico-fermer) center / contain no-repeat; }
html.tc-icones-svg .Header [data-sliding-menu-is-open=true] .Navigation-opener:before { content: ""; display: inline-block; width: 1em; height: 1em; vertical-align: middle; background-color: currentColor; -webkit-mask: var(--tc-ico-fermer) center / contain no-repeat; mask: var(--tc-ico-fermer) center / contain no-repeat; }
html.tc-icones-svg .Menu--main .SubMenu-help:before { content: ""; display: inline-block; width: 1em; height: 1em; vertical-align: middle; background-color: currentColor; -webkit-mask: var(--tc-ico-timcod) center / contain no-repeat; mask: var(--tc-ico-timcod) center / contain no-repeat; }
html.tc-icones-svg .Menu--main .SubMenu-panel_left-link_all:before { content: ""; display: inline-block; width: 1em; height: 1em; vertical-align: middle; background-color: currentColor; -webkit-mask: var(--tc-ico-timcod) center / contain no-repeat; mask: var(--tc-ico-timcod) center / contain no-repeat; }
html.tc-icones-svg .Menu--main .SubMenu-panel_right-wrapper .Menu-item-link[data-menu-level="1"]:after { content: ""; display: inline-block; width: 1.2em; height: 1em; vertical-align: middle; background-color: currentColor; -webkit-mask: var(--tc-ico-fleche) center / contain no-repeat; mask: var(--tc-ico-fleche) center / contain no-repeat; }
html.tc-icones-svg form .js-form-type-search:before { content: ""; display: inline-block; width: 1em; height: 1em; vertical-align: middle; background-color: currentColor; -webkit-mask: var(--tc-ico-loupe) center / contain no-repeat; mask: var(--tc-ico-loupe) center / contain no-repeat; }
@media (width<=900px) {
  html.tc-icones-svg .Header .Navigation-opener:before { content: ""; display: inline-block; width: 1em; height: 1em; vertical-align: middle; background-color: currentColor; -webkit-mask: var(--tc-ico-menu) center / contain no-repeat; mask: var(--tc-ico-menu) center / contain no-repeat; }
  html.tc-icones-svg .Menu--main .SubMenu-button_back:after { content: ""; display: inline-block; width: 2em; height: 1.2em; vertical-align: middle; background-color: currentColor; -webkit-mask: var(--tc-ico-triangle) center / contain no-repeat; mask: var(--tc-ico-triangle) center / contain no-repeat; }
  html.tc-icones-svg .Menu--main .SubMenu-panel_left-items .btn:after { content: ""; display: inline-block; width: 2em; height: 1.2em; vertical-align: middle; background-color: currentColor; -webkit-mask: var(--tc-ico-triangle) center / contain no-repeat; mask: var(--tc-ico-triangle) center / contain no-repeat; }
}

/* Pied de page : icônes des réseaux sociaux en SVG (affichées partout ; même taille et mêmes couleurs que
   celles du site : 2,2rem, blanc, orange au survol). */
.LinkIcon-icon--svg { display: block; width: 2.2rem; height: 2.2rem; color: inherit; }
.LinkIcon-icon--svg svg { display: block; width: 100%; height: 100%; fill: currentColor; transition: color .2s; }
.Footer .LinkIcon:hover .LinkIcon-icon--svg, .Footer .LinkIcon:focus-visible .LinkIcon-icon--svg { color: #ff9600; }
