/*
Theme Name: soutien-canin
Theme URI: 
*/
/* =========================================================
   Variables https://gemini.google.com/app/4a1368dcc6d20003
   ========================================================= */
:root {
    /* Couleurs de la charte graphique */
    --couleur-fond-page: #FFF;
    --couleur-liens: #45bbe6;
    --couleur-liens-menu: #333;
    --couleur-liens-menu-survol: #5fd249;
    --couleur-fond-menu: #F5F5F5;
    --couleur-post-metas: #888;
    --couleur-section-impair: #c7f6a8a1;
    --couleur-section-pair: #c7f6a8;
    --couleur-bouton-categ: #5da21a;

    /* Dimensions du Header / Logo */
    --logo-max-height-mobile: 80px;
    --logo-max-height-desktop: 200px;
}

* {
  box-sizing: border-box;
}
html {
	height:101%;	/* on a toujours une barre de défilement verticale */
}
body {
	text-align: left;
}
#page {
	background-color: var(--couleur-fond-page);
	max-width: 1180px;
	margin: 0 auto;
	box-shadow: 0 0 20px 0 rgba(0,0,0,.1);
}
a {
	text-decoration: none;
	color: var(--couleur-liens);
}
img {
	max-width: 100%;
	height: auto;
}

/* header */ 
/* --- Structure globale du Header --- */
header {
	display: flex;
    flex-wrap: wrap;       /* LA CLÉ : autorise les éléments à passer à la ligne */
    justify-content: space-between; 
    align-items: center;
    padding: 10px 20px;
    position: relative;
    width: 100%;
}
header hgroup {	  			/* --- Conteneur du Logo --- */
    flex: 1 1 auto;
	min-width: 150px;       /* SÉCURITÉ : on force le conteneur à ne jamais descendre sous 150px de large */
    display: flex;
    align-items: center;
	flex-wrap: wrap;        /* Sécurité au cas où le slogan serait trop long sur petit écran */
}
/* --- L'image du Logo (La clé du problème) --- */
header hgroup a.logo {
    display: block;         /* INDISPENSABLE : donne un référentiel physique à l'image qu'il contient */
}
header hgroup img, header hgroup .custom-logo {
    display: block;
    width: auto;                  /* Laisse la largeur s'adapter proportionnellement */
    max-width: 100%;              /* Ne dépasse jamais son conteneur */
    height: auto;
    max-height: var(--logo-max-height-mobile);  /* Protège la hauteur du header : l'image se réduit si nécessaire */
}

/* --- Adaptation pour les écrans d'ordinateur (au-dessus de 800px) --- */
@media (min-width: 801px) {
    header hgroup {
        flex: 1 1 100%;             /* Force le logo à s'isoler sur sa propre ligne */
        justify-content: center;    /* Centre le logo au-dessus du menu */
        margin-bottom: 20px;        /* Ajoute un bel espacement avant la barre grise du menu */
    }
    header hgroup img,
    header hgroup .custom-logo {
        max-height: var(--logo-max-height-desktop);  /* Autorise le logo à s'afficher en grand sur PC */
    }
}

/* --- Bouton Mobile --- */
.menu-toggle {
    flex-shrink: 0;               /* Interdit au bouton de se déformer ou de rétrécir */
    position: relative;
    z-index: 10;                  /* Force le bouton à rester au-dessus de tout débordement */
}

header {
/*	color: white;*/
}

header nav {
	width: 100%;           /* Le menu prend toute la largeur... */
    order: 3;              /* ... et se place obligatoirement SOUS le logo et le bouton */
	background-color: var(--couleur-fond-menu);
	margin-top: 10px;      /* Ajoute un petit espace sous le logo */
}
header nav ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
header nav li {
	display: inline-block;
}
header nav a {
	display: block;
	color: var(--couleur-liens-menu);
	font-weight: bold;
	padding: 20px;
	line-height: 35px;
	transition: color .2s;
}
header nav a:hover{
	color: var(--couleur-liens-menu-survol);
	transition: color .5s;
}
/* main */ 
main.wp-content {
	display: flex;
	flex-direction:row;
	width: 100%;
}
main.wp-content section {
	flex: 4;
	padding: 20px;
}
main.wp-content aside {
	flex: 1;
	padding: 20px;
	min-width:300px;
	max-width:330px;
	min-height:500px;
}

/* articles */
.blog .post {
	margin-bottom: 20px;
	padding-bottom: 20px;
}
.post h2 a{
	font-weight: normal;
}
.post__metas {
	text-align: center;
	font-size: .8em;
	color: var(--couleur-post-metas);
	margin-bottom: 10px;
} 
.post__link {
	text-align: right;
	margin-bottom: 0;
}
.post__categories ul {
	display: inline-block; 
	margin: 0;
	padding: 0;
	list-style-type: none;
}
.post__categories li {
	display: inline-block; 
	margin: 0;
}

/* WP Content */
.wp-content p{
	margin: 1.2em 0;
}
.wp-content figure {
/*	width: auto !important;*/
}
.wp-content .wp-caption-text {
	text-align: center;
	font-size: 1.1rem;
}

/* sidebar */
aside > ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
aside > ul > li {
	margin-bottom: 40px;
}
aside h2 {
	margin-top: 0;
}

/* single */
.div_thumbnail, figure {
	float:right;
}
.div_thumbnail caption{
	float:right;
}
/*
.thumbnail, figure img {	// images arrondies sur mrk
	border-radius: 10%;
	overflow: hidden;
}
*/
figcaption {
	text-align:center;
	font-size:80%;
}

.posts-nav {
  display: flex;
  margin-top: 40px;
  color: #666;
  padding-top: 20px;
  border-top: 1px solid #DFDFDF;
}
.posts-nav div {
  flex: 1;
}
.posts-nav div:last-child {
  text-align: right; 
}

/* archive */
.post.archive h2 {
	padding-top:0;
	text-align:center !important;
}
.lien-cache {
    cursor: pointer;
}
.ingrid{
	display: grid;
/* Crée autant de colonnes que possible (auto-fill). Chaque colonne doit faire au minimum 250px de large.
 *  s'il reste de la place sur l'écran, On le étirer pour qu'elles se partagent l'espace restant équitablement
*/
	grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
	gap: 2rem;
}
.article.ingrid {
	margin: initial;
	width: initial;
}   
.post__thumbnail{
	margin: 0 auto;
	width:250px;
	height:250px;
	border-radius: 10%;
	overflow: hidden;
}   
.post__thumbnail a{
	height:100%;
}   

/* footer */
footer {
	font-size: .9em;
	margin: 30px 0 10px 0;
	padding: 35px;
	border-top: 1px solid #ccc;
}
footer .credits {
	float: left;
	color: #999;
	margin: 0;
}
footer nav {
	float: right;
}
footer nav ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
footer nav li {
	display: inline-block;
}
footer nav a {
	display: block;
	color: #888;
	padding: 0 0 0 10px;
	line-height: 35px;
	transition: color .2s;
}
footer nav a:hover {
	color: var(--couleur-liens);
}

img.alignright { margin: 0 0 1em 1em; }
img.alignleft { margin: 0 1em 1em 0; }
img.aligncenter { margin-left: auto; margin-right: auto; }
.alignright { float: right; }
.alignleft { float: left; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }

.screen-reader-text {display:none;} 	/* ne pas afficher le texte devant le form de recherche */

/*--------------------------------------------------------------
5.0 Typography
--------------------------------------------------------------*/
html {
	font-size: .625em; /* fallback IE8+ */
	font-size: calc(1em * .625); /* IE9-IE11 math fixing. */
}
body,
button,
input,
select,
textarea {
	color: #333;
	font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;
	font-size: 16px;
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1.66;
}
button,
input,
select,
textarea {
	color: #111;	/* couleur des boutons : le blanc du reste du site s'affiche mal */
	}
h1, h2, h3, h4, h5, h6 {
/*	clear: both;*/
	line-height: 1.4;
	margin: 0 0 0.75em;
	padding: 1em 0 0;
}
h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child {
	padding-top: 0;
}

h1 {
	font-size: 30px;
	font-size: 3rem;
	font-weight: bold;
	letter-spacing: -1px;
	margin-bottom:10px; 
	padding: 0.5em 0 0 0.5em;
	text-align:center;
}
h2, .home.blog .entry-title, p.widget-title {
	font-size: 24px;
	font-size: 2.4rem;
	font-weight: bold;
	margin-bottom:10px; 
}
h3 {
	font-size: 18px;
	font-size: 1.8rem;
	font-weight: 300;
}
h4 {
	font-size: 16px;
	font-size: 1.6rem;
	font-weight: 800;
}
h5, h6 {
	font-size: 16px;
	font-size: 1.6rem;
	font-weight: normal;
}
h6 {
	text-decoration: underline;
}
p {
	margin: 0 0 1.5em;
	padding: 0;
}
dfn,
cite,
em,
i {
	font-style: italic;
}
blockquote {
	color: #666;
	font-size: 18px;
	font-size: 1.125rem;
	font-style: italic;
	line-height: 1.7;
	margin: 0;
	overflow: hidden;
	padding: 0;
}
blockquote cite {
	display: block;
	font-style: normal;
	font-weight: 600;
	margin-top: 0.5em;
}
address {
	margin: 0 0 1.5em;
}
pre {
	background: #eee;
	font-family: "Courier 10 Pitch", Courier, monospace;
	font-size: 15px;
	font-size: 0.9375rem;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}
code,
kbd,
tt,
var {
	font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
	font-size: 15px;
	font-size: 0.9375rem;
}
abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}
mark,
ins {
	background: #eee;
	text-decoration: none;
}
big {
	font-size: 125%;
}
blockquote {
	quotes: "" "";
}
q {
	quotes: "“" "”" "‘" "’";
}
blockquote:before,
blockquote:after {
	content: "";
}
:focus {
	outline: none;
}

/*--------------------------------------------------------------
5.1 gallerie photos
--------------------------------------------------------------*/
#gallerie {
	width:620px;
}
#container {
	margin:0;
	padding:0;
	overflow:auto;
	height:330px;
}
#container ul {
	margin:0;
	padding:0;
	list-style:none;
	display: table-row;
	white-space: nowrap;
}
#container ul li {
	display: table-cell;
	padding:0 10px;
	vertical-align: top;
}
#container img {
/*	max-height:280px;*/
	max-width:280px;
}

/*--------------------------------------------------------------
 tableaux responsive
--------------------------------------------------------------*/
table {
	border: 1px solid #ccc;
	border-collapse: collapse;
	margin: 0;
	padding: 0;
	width: 100%;
}
table tr {
	background: #f8f8f8;
	border: 1px solid #ddd;
	padding: .35em;
}
table th, table td {
	padding: .625em;
    vertical-align: top;
}
table th {
	font-size: .85em;
	letter-spacing: .1em;
	text-transform: uppercase;
	text-align: center;
	background-color: #d9edf7;
    font-weight: 700;
    vertical-align: middle;
}
td[data-label="Note"] {
    width:100px;
	text-align: center;
	padding: .625em .3em;
}
table .even td {
    background-color: #fff;
}
table .even td {
    background-color: #f9f9f9;
}
table img {
    margin: 0;
    padding: 0;
    border: none;
    max-width: none;
}
.comparatif h3 {
    margin: 0;
    text-align: center;
    font-weight: 700;
}
/*--------------------------------------------------------------
 fil d'Ariane
--------------------------------------------------------------*/

#breadcrumbs{margin-top:10px;;font-family:inherit;color:rgb(160, 160, 160);font-size: 80%;}

/*--------------------------------------------------------------
 Responsive
--------------------------------------------------------------*/
@media screen and (max-width: 50em) {	/* 800 à 1000px */
	#page {
		max-width: 100%;
	}
	main section {
		display: block;
		width: 100%;
	}
    h1 {font-size:2em;   }
	header p span{
		font-size: 6vw;
    }
}
@media screen and (max-width: 40em) {  /* 640 px */
	#page {
		max-width: 100%;
	}
	main section {
		display: block;
		width: 100%;
	}
    main  {
        flex-direction: column;
    }
    h1 {font-size:1.5em;   }
	header p span, header h1 span{
		font-size: 6vw;
    }
}
@media screen and (max-width: 30em) {  /* 480 px */
	/* layout */
	#page {
		max-width: 100%;
	}
	main {
		display: block;
		width: 100%;
	}
	header hgroup{
		height:17vh;	/* hauteur proportionnelle à la largeur de la page */
	}
	header hgroup p {
		margin:10px;	/*  page */
	}
	/* typo */
    h1 {
        font-size:1.2em;
    }
	header p {
		font-size: 5.4vw;
    }
	.ingrid{
        display: block;
	}
}

/* /css de base */

@font-face{font-display:block;font-family:TablePress;font-style:normal;font-weight:400;src:url(data:application/font-woff2;charset=utf-8;base64,d09GMgABAAAAAAPUAA0AAAAACZAAAAN+AAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP0ZGVE0cGh4GYACCUhEICoQIgnILFgABNgIkAygEIAWGcgeBARv6B8iuBzK53oAhKg2KWDsrezjalSefocfD9/uZ575PSbYEqJHAIdo6tMDGdCprFIHd+F9r+rZE46O2iHBJfoAuxwW0yfgKS8KGVFE4dHX1gPmgVhzwhcJbReQ9RWXcraeutbmNHE7T7B1sex8stfMfnkvv0XsgUZrYO1hirXme9TnUkBvQ22RGX50VAr48H54Cn9b8GD73edAAhjboBpIQ6kKOhCz7GA8V5HfzyeA6h0mnrFTJnPjxC7KCrl9caqIUg0EAYACGDBn6YGCxeIE+EkwANTWJX/brZpNfyE5o/7r9uPZjS4tESbCTExLCjxOEbxGi2dQeNEAXUMMlvADkqSV0IHXtkQXNOnI2ctJpRIPt8+HjNivx3rlQYA8FqGwdCxF2aZrdJluMnaqFvy+yngVKbBcn0fSOd1xTpnW4HTkptV8Gi2kvCeUHC0BD+D0VKMIqXniZPJyPya9D7gT6DvUpwJER6avgKDsOfW9jU+YGc/ng6MhA3VSar3NdtvrD9WHZurKVKYOi0RwlY9500YSuWDE084F+jMinu4sTudD5yBTTozA9Horpmb+M3TwIBHempnzdpu1/raWypX0JND/ki4p71CQQlFqnAvkijABrVFIq5BdNJbFncoBOF03/h3IINPQRBxJCYDoAOnkRIDR0w0BSmYiBzDinAuQ6eROg0DEGY6DUiEUYqKyILwFq2qS9GKhrpFsykdeFLmDjknYG4jKbNeNyQ1zhCoP840pdYiqu8jTW4mp6pMXH1HVJp8wRmHmQKTKiUOBVSMHrlKuBlYidxkMgw6/bMoG5RD6qfs8yO8LVqFCFa8ELrcVLEqTaS7UG5aqVq1GlWi28k3rRgCjbiU+qqOItvDEqXjkvwF/dUF595jB8LSqqgwIWAWsRmcJJ5GsHbYUqVbirBi5IpRMxLso/i2oSA6ZYDoMFCiknI7ZkGacSVYUjlLSXyG8n08nOQcXTeyzU5ozbiGRQZRt0vu/TMoEV8RLI3DiBSiVzMtNKAPgErlwLoqiAY2fJ9UbRMU/0rz38UP5FQtH3i8V3KYSHYJdSYRnwW8XazUAUop3gQY19hkEH98OA2QQ6wg0S+FjtwOwdOvF5J2VXBBLQmo2EAxsIKVJkkUcRZVRRa7NrP+my6Ns8cKszHYJf+fPPLPTq5vFcmYKZNL+fn1CZDgoYecKZHwA=) format("woff2"),url(tablepress.woff) format("woff")}.tablepress{--text-color:#111;--head-text-color:var(--text-color);--head-bg-color:#d9edf7;--odd-text-color:var(--text-color);--odd-bg-color:#f9f9f9;--even-text-color:var(--text-color);--even-bg-color:#fff;--hover-text-color:var(--text-color);--hover-bg-color:#f3f3f3;--border-color:#ddd;--padding:0.5rem;border:none;border-collapse:collapse;border-spacing:0;clear:both;margin:0 auto 1rem;table-layout:auto;width:100%}.tablepress>:not(caption)>*>*{background:none;border:none;box-sizing:content-box;float:none!important;padding:var(--padding);text-align:left;vertical-align:top}.tablepress>*+tbody>*>*,.tablepress>tbody>*~*>*,.tablepress>tfoot>*>*{border-top:1px solid var(--border-color)}.tablepress>:where(thead,tfoot)>*>th{background-color:var(--head-bg-color);color:var(--head-text-color);font-weight:700;vertical-align:middle;word-break:normal}.tablepress>:where(tbody)>.odd>*{background-color:var(--odd-bg-color);color:var(--odd-text-color)}.tablepress>:where(tbody)>.even>*{background-color:var(--even-bg-color);color:var(--even-text-color)}.tablepress>.row-hover>tr:hover>*{background-color:var(--hover-bg-color);color:var(--hover-text-color)}.tablepress img{border:none;margin:0;max-width:none;padding:0}.tablepress-table-description{clear:both;display:block}.dataTables_wrapper{clear:both;margin-bottom:1rem;position:relative}.dataTables_wrapper .tablepress{clear:both;margin-bottom:0}.dataTables_wrapper:after{clear:both;content:"";display:block;height:0;line-height:0;visibility:hidden}.dataTables_wrapper label input,.dataTables_wrapper label select{display:inline;margin:2px;width:auto}.dataTables_length{float:left;white-space:nowrap}.dataTables_filter{float:right;white-space:nowrap}.dataTables_filter label input{margin-left:.5em;margin-right:0}.dataTables_info{clear:both;float:left;margin:4px 0 0}.dataTables_paginate{float:right;margin:4px 0 0}.dataTables_paginate .paginate_button{color:#111;display:inline-block;margin:0 5px;outline:none;position:relative;text-decoration:underline}.dataTables_paginate .paginate_button:first-child{margin-left:0}.dataTables_paginate .paginate_button:last-child{margin-right:0}.dataTables_paginate .paginate_button:after,.dataTables_paginate .paginate_button:before{color:#d9edf7}.dataTables_paginate .paginate_button:hover{cursor:pointer;text-decoration:none}.dataTables_paginate .paginate_button:hover:after,.dataTables_paginate .paginate_button:hover:before{color:#049cdb}.dataTables_paginate .paginate_button.disabled{color:#999;cursor:default;text-decoration:none}.dataTables_paginate .paginate_button.disabled:after,.dataTables_paginate .paginate_button.disabled:before{color:#f9f9f9}.dataTables_paginate .paginate_button.current{cursor:default;font-weight:700;text-decoration:none}.dataTables_paginate.paging_simple{padding:0 15px}.dataTables_paginate.paging_simple .paginate_button.next:after,.dataTables_paginate.paging_simple .paginate_button.previous:before{-webkit-font-smoothing:antialiased;bottom:0;content:"\f053";font-family:TablePress;font-size:14px;font-weight:700;height:14px;left:-14px;line-height:1;margin:auto;position:absolute;right:auto;text-align:left;text-shadow:.1em .1em #666;top:0;width:14px}.dataTables_paginate.paging_simple .paginate_button.next:after{content:"\f054";left:auto;text-align:right}.dataTables_scroll{clear:both}.dataTables_scroll .tablepress{width:100%!important}.dataTables_scrollHead table.tablepress{margin:0}.dataTables_scrollBody{-webkit-overflow-scrolling:touch}.dataTables_scrollBody .tablepress thead th:after{content:""}.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody td>div.dataTables_sizing,.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody th>div.dataTables_sizing{height:0;margin:0!important;overflow:hidden;padding:0!important}.tablepress{--head-active-bg-color:#049cdb;--head-active-text-color:var(--head-text-color)}.tablepress .sorting,.tablepress .sorting_asc,.tablepress .sorting_desc{cursor:pointer;outline:none;padding-right:20px;position:relative}.tablepress .sorting:after,.tablepress .sorting_asc:after,.tablepress .sorting_desc:after{-webkit-font-smoothing:antialiased;bottom:0;font-family:TablePress;font-size:14px;font-weight:400;height:14px;left:auto;line-height:1;margin:auto;position:absolute;right:6px;top:0}.tablepress .sorting:after{content:"\f0dc"}.tablepress .sorting_asc:after{content:"\f0d8";padding:0 0 2px}.tablepress .sorting_desc:after{content:"\f0d7"}.tablepress .sorting:hover,.tablepress .sorting_asc,.tablepress .sorting_desc{background-color:var(--head-active-bg-color);color:var(--head-active-text-color)}

.product-container {
	display: flex;
	flex-direction: row;
	border: 1px solid #99e164; 
	border-radius: 6px; 
	box-shadow: 0 5px 6px -6px #99e164;
	padding:0 10px 10px;
}
.product-container-gauche {
	width:310px;
}
.product-container-droite {
	width:calc(100% - 320px);
	padding:0 10px;
}
.productImg {
	margin:2em auto 0;
}

/*-------------------------------------------------*/
/* boutons amazon */
/*-------------------------------------------------*/

.lnk {
    cursor:pointer;
    }
.AmznBtn  {
    display: block;
    height: auto;
    width: fit-content;
    margin: 10px auto;
}
.AmznBtn a {
    color:white;
}
.AmznBtn span {
    padding: .5em .8em;
    margin: .5em;
    display:block;
    text-align: center;
    font-size: 1.4em;
    background: #99e164;
    color:white;
/*    background: linear-gradient( #ff9100,#ffab3d);*/
    border-radius: .6em;
    box-shadow: 0 0 5px rgba(0,0,0,0.5), 0 -1px 0 rgba(255,255,255,0.4);
}

.voirTouteCategorie {
    display: block;
    height: auto;
    width: fit-content;
    margin: 10px auto 15px;
}
.voirTouteCategorie a {
    color:white;
}
.voirTouteCategorie span {
    padding: .5em .8em;
    margin: .5em;
    display:block;
    text-align: center;
    font-size: 1.4em;
    background: var(--couleur-bouton-categ);
    color:white;
    border-radius: .6em;
    box-shadow: 0 0 5px rgba(0,0,0,0.5), 0 -1px 0 rgba(255,255,255,0.4);
}

/*-------------------------------------------------*/
/* liste des derniers articles de la PA            */
/*-------------------------------------------------*/
.presPageAccueil   { 
	display: block;
    width: 70%;
    margin: 0 auto;
	}
.pair {
    padding: 0 10px 10px 0;
    background-color: var(--couleur-section-pair);
	}
.impair {
    padding: 0 10px 10px 0;
	background-color: var(--couleur-section-impair);
	}
	
#listeCategoriesNews   { 
    display: block;
    height: auto;
    width: fit-content;
    margin: 10px auto;
	}
#listeCategoriesNews h2  { 
    width: fit-content;
    margin: 10px auto;
	}
.listeCategoriesUneNews   { 
    display: block;
    height: auto;
    width: fit-content;
    margin: 10px auto;
	display: grid;
/*	grid-template-columns: 40% calc( 30% - 1rem) calc( 30% - 1rem); */
    grid-template-columns: 40% repeat(auto-fill, minmax(270px, 1fr));
	grid-gap: 1rem;
	}
.listeCategoriesUneNews div  { 
    padding: 5px;
	}
.firstCol   {
    grid-column: 1 / 2;
   	grid-row: span 3; 
}
.secondCol hr  {
    clear:both; 
    visibility: hidden;
}
.vignetteNews   {
    width: 100px;
    float:left;
	margin-right: 10px;
}
.vignetteFirstNews   {
    width: 400px;
    margin:0 auto;
    float:none;
}
h3 {
	font-weight: bold;
	}
h3.categoriesNews {
	padding:0;
	}
h3.categoriesNews a {
	color:black;
	}
.intextLnk {
	background-color: azure;
    border-radius: 5px;
    padding: 5px;
    }
/* liens obf */
.post__metas .lien-cache, #breadcrumbs .lien-cache  {
	text-decoration: none;
	color: var(--couleur-liens);
	}

@media screen and (max-width: 1000px) {
	.listeCategoriesUneNews   { 
		grid-template-columns: repeat(2, minmax(270px, 1fr));
		grid-gap: 1rem;
		}
	.firstCol   {
		grid-column: span 2; 
	}
	.vignetteFirstNews   {
		margin-right: 10px;
		float:left;
	}
	.vignetteNews   {
		width: 150px;
	}
}
@media screen and (max-width: 700px) {	
	.vignetteNews   {
		width: 90px;
	}
}
@media screen and (max-width: 600px) {	
	.vignetteNews   {
		width: 150px;
		float:none;
		margin:0 auto;
	}
}
@media screen and (max-width: 480px) {	
	.presPageAccueil   { 
		width: 90%;
		}
	.listeCategoriesUneNews   { 
		grid-template-columns: minmax(270px, 1fr);
		}
	.firstCol   {
		grid-column: 1; 
	}
	.vignetteFirstNews   {
		width: 100%;
		margin:0 auto;
		float:none;
	}
	.vignetteNews   {
		width: 90px;
		margin-right: 10px;
		float:left;
	}
}

#toc_container.no_bullets li, #toc_container.no_bullets ul, #toc_container.no_bullets ul li, .toc_widget_list.no_bullets, .toc_widget_list.no_bullets li {
  margin-bottom: 2px;
}


/* ==================================== */
/* --- MENU RESPONSIVE (v2025) -------- */
/* ==================================== */
.menu-toggle {
	display: none;
	cursor: pointer;
	padding: 10px;
	background: var(--couleur-fond-menu);
	border: 1px solid #ddd;
	border-radius: 4px;
	margin: 10px;
}

.menu-toggle span {
	display: block;
	width: 25px;
	height: 3px;
	margin: 5px auto;
	background: #333;
	transition: 0.3s;
}

/* Animation croix */
.menu-toggle.active span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.menu-toggle.active span:nth-child(2) { opacity: 0; }
.menu-toggle.active span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* Mobile version */
@media screen and (max-width: 800px) {
  header nav ul {
    display: none;
    flex-direction: column;
    background: var(--couleur-fond-menu);
    padding: 10px;
  }
  header nav ul.show {
    display: flex;
  }
  header nav li {
    display: block;
    border-bottom: 1px solid #ddd;
  }
  header nav a {
    padding: 12px 10px;
    display: block;
  }
  .menu-toggle {
    display: block;
  }
}

/* ===== Sidebar responsive propre ===== */

/* Mobile-first (≤ 600px) : pile en colonne, aside en bas, pleine largeur */
main.wp-content{
  display:flex;
  flex-direction:column;        /* <= clé ici */
  align-items:stretch;
}
main.wp-content section{
  order:1;
  width:100%;
  padding:20px;                 /* déjà présent, on confirme */
}
main.wp-content aside{
  order:2;                      /* après le contenu */
  width:100%;                   /* pleine largeur */
  max-width:none;
  min-width:0;                  /* neutralise min-width:300px du style desktop */
  padding:20px;
  margin:0;                     /* pas de marge latérale en mobile */
}

/* ≥ 700px : layout en rangée, aside à droite en colonne fixe */
@media (min-width: 700px){
  main.wp-content{
    flex-direction:row;         /* repasse en ligne à partir de 700px */
    align-items:flex-start;
    gap:0;                      /* optionnel : gère l’écart via la marge de l’aside */
  }
  main.wp-content section{
    order:0;
    flex:1 1 auto;              /* prend l’espace restant */
    width:auto;
  }
  main.wp-content aside{
    order:0;
    flex:0 0 320px;             /* colonne droite d’environ 320px */
    max-width:330px;
    min-width:300px;
    min-height:500px;           /* si tu y tiens, sinon retire */
    margin-left:20px;           /* espace entre contenu et aside */
  }
}

/* Optionnel : aside “collant” sur les écrans plus larges */
@media (min-width: 900px){
  main.wp-content aside{
    position:sticky;
    top:20px;
  }
}


/* ===========================
   Impression — ne garder que <section>
   =========================== */
@media print {

  /* Page et marges */
  @page { size: A4; margin: 15mm 25mm; }
  html, body { background: #fff !important; }
  #page { box-shadow: none !important; max-width: none !important; }

  /* Cacher tout ce qui n’est pas le contenu principal */
  header, nav, footer, aside,
  .menu-toggle, .posts-nav, #toc_container,
  #menu-principal, #menu-entest,
  .AmznBtn, .voirTouteCategorie,
  .presPageAccueil, #listeCategoriesNews,
  .product-container { display: none !important; }

  /* Isoler <section> en pleine largeur */
  main.wp-content { display: block !important; }
  main.wp-content section {
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;       /* retire les marges inutiles pour l’impression */
  }

  /* Typo plus lisible sur papier */
  body { font-size: 12pt !important; line-height: 1.5 !important; color: #000 !important; }
  h1 { font-size: 20pt !important; text-align: left !important; padding: 0 0 .3em 0 !important; }
  h2 { font-size: 16pt !important; }
  h3 { font-size: 13pt !important; }
  a { color: #000 !important; text-decoration: underline !important; }

  /* Afficher l’URL après les liens externes (utile sur papier) */
  a[href^="http"]:after {
    content: " (" attr(href) ")";
    font-weight: normal; font-size: .9em;
  }

  /* Nettoyage visuel */
  * { background: transparent !important; box-shadow: none !important; text-shadow: none !important; }

  /* Images & médias */
  img, svg, video, figure { max-width: 100% !important; height: auto !important; }
  figure, img { page-break-inside: avoid; break-inside: avoid; }
/*  .alignleft, .alignright { float: none !important; display: block; margin: 0 auto 1em !important; } */

  /* Tableaux lisibles en N&B */
  table { width: 100% !important; border-collapse: collapse !important; }
  table, th, td { border: 1px solid #999 !important; }
  th, td { padding: 6px !important; }
  .tablepress>:where(thead,tfoot)>*>th { background: #eee !important; color: #000 !important; }

  /* Éviter les coupures moches */
  h1, h2, h3 { page-break-after: avoid; break-after: avoid; }
  figure, table, blockquote, pre { page-break-inside: avoid; break-inside: avoid; }
  p, li { orphans: 3; widows: 3; }

  /* Optionnel :*/
  p.intextLnk, #breadcrumbs {display:none;}