/* ============================================================================
   annoncesphp v2 — skins.css : SIX DÉCLINAISONS de la MÊME mise en page (site.css).
   Chaque déclinaison ne change que la palette, la typographie, les bandeaux, les
   bordures et les filets — jamais la composition (en-tête à deux rangées, colonne
   latérale, annonces en lignes, pagination, fiche à deux colonnes). La couleur du site
   (--an-accent, posée par le layout depuis site.config.json) reste la teinte des liens,
   des boutons, des bandeaux ; chaque déclinaison la décline dans ses fonds sombres
   (color-mix) plutôt que d'imposer une teinte.

     .skin-1  « plan cul rose »        fond bordeaux profond, contenu chaud, logo serif
     .skin-2  « BDSM noir-rouge »      fond anthracite texturé, barre rouge sombre, bandeaux gris
     .skin-3  « libertin bordeaux »    fond bordeaux-brun, papier crème, serif, filets doubles
     .skin-4  « gay bleu nuit »        fond marine, surfaces froides, bandeaux dégradés
     .skin-5  « trans violet »         fond prune, en-tête en dégradé, angles arrondis
     .skin-6  « classique gris-bleu »  fond gris clair, conteneur bordé, Verdana, angles vifs

   Contrastes mesurés (WCAG 2.x) : texte courant ≥ 12:1, --an-ink-2 ≥ 7:1, --an-ink-3 ≥ 4,6:1
   sur chaque fond de contenu ; --an-band-ink blanc sur un accent de luminance ≤ 0,3 ≥ 4,5:1.
   ============================================================================ */

/* ============================================================ 1 — plan cul rose */
.skin-1 {
  --an-body-bg: color-mix(in srgb, var(--an-accent) 26%, #1b0d12);
  --an-body-image: radial-gradient(ellipse at 20% 0%, rgba(255, 255, 255, .07), transparent 55%);
  --an-page-bg: #f6f2ee;
  --an-bg: #f6f2ee;
  --an-bg-2: #fffdfb;
  --an-bg-3: #efe8e2;
  --an-line: #e2d9d2;
  --an-line-strong: #c9bcb2;
  --an-header-bg: #241c1f;
  --an-header-ink: #fff;
  --an-nav-bg: color-mix(in srgb, var(--an-accent) 62%, #1f1316);
  --an-nav-cur-bg: rgba(255, 255, 255, .18);
  --an-band-bg: var(--an-accent);
  --an-band-ink: #fff;
  --an-footer-bg: #241c1f;
  --an-footer-ink: #efe8ea;
  --an-footer-ink-2: #b3a7ab;
  --an-font-logo: Georgia, "Times New Roman", serif;
  --an-font-head: Georgia, "Times New Roman", serif;
  --an-radius: 5px; --an-radius-s: 3px; --an-radius-btn: 4px;
  --an-ligne-sep: 1px solid #d9cfc7;
  --an-thumb-border: #b9aaa0;
}
.skin-1 .an-titre__h1, .skin-1 .an-fiche__h1 { font-weight: 400; letter-spacing: 0; }
.skin-1 .an-bandeau { font-weight: 400; font-size: 1.05rem; }
.skin-1 .an-ligne__title { font-family: var(--an-font); }
.skin-1 .an-logo__text { font-style: italic; }

/* ============================================================ 2 — BDSM noir-rouge */
.skin-2 {
  --an-accent-ink: color-mix(in srgb, var(--an-accent) 70%, #000);
  --an-body-bg: #2e2c2c;
  --an-body-image: repeating-linear-gradient(135deg, rgba(255, 255, 255, .025) 0 2px, transparent 2px 10px);
  --an-page-bg: #fff;
  --an-page-border: #1c1a1a;
  --an-bg: #fff;
  --an-bg-2: #fff;
  --an-bg-3: #f0f0f0;
  --an-ink: #262424;
  --an-ink-2: #4a4747;
  --an-ink-3: #6e6a6a;
  --an-line: #e2e0e0;
  --an-line-strong: #c6c2c2;
  --an-title-ink: color-mix(in srgb, var(--an-accent) 70%, #000);
  --an-header-bg: color-mix(in srgb, var(--an-accent) 65%, #2a0000);
  --an-header-ink: #fff;
  --an-nav-bg: color-mix(in srgb, var(--an-accent) 50%, #1a0000);
  --an-nav-cur-bg: #fff;
  --an-nav-cur-ink: color-mix(in srgb, var(--an-accent) 70%, #000);
  --an-band-bg: #8f8b8b;
  --an-band-ink: #fff;
  --an-footer-bg: #e9e7e7;
  --an-footer-ink: #333;
  --an-footer-ink-2: #6b6767;
  --an-font: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  --an-font-head: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  --an-font-logo: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
  --an-radius: 3px; --an-radius-s: 2px; --an-radius-btn: 3px;
  --an-ligne-sep: 1px dotted #b9b5b5;
  --an-thumb-border: #cfcaca;
}
.skin-2 .an-page { border-radius: 0; }
.skin-2 .an-logo__cap { color: #fff; text-decoration: underline; text-decoration-color: var(--an-accent-line); text-underline-offset: 4px; }
.skin-2 .an-logo__mark { background: #fff; color: var(--an-header-bg); }
.skin-2 .an-logo__lignes { stroke: var(--an-header-bg); }
.skin-2 .an-side__h.an-bandeau, .skin-2 .an-fiche__h2.an-bandeau, .skin-2 .an-reponse__h { text-transform: uppercase; font-size: .8rem; letter-spacing: .06em; }
.skin-2 .an-bloc__h.an-bandeau { background: color-mix(in srgb, var(--an-accent) 80%, #000); }
.skin-2 .an-fiche__contact-h, .skin-2 .an-hero__h2, .skin-2 .an-moteur__h2, .skin-2 .an-popup__head { background: color-mix(in srgb, var(--an-accent) 80%, #000); }
.skin-2 .an-side__list li::before, .skin-2 .an-cats__link::before, .skin-2 .an-geo li::before { content: "♥"; font-size: .7em; top: .45em; }
.skin-2 .an-ligne__title a { color: var(--an-accent); }
.skin-2 .an-footer__h { color: #333; border-color: #cfcaca; }
.skin-2 .an-footer__bottom { border-color: #cfcaca; }
.skin-2 .an-footer a:hover { color: var(--an-accent-ink); }
.skin-2 .an-nav__list a[aria-current] { font-weight: 700; }

/* ============================================================ 3 — libertin bordeaux */
.skin-3 {
  --an-body-bg: color-mix(in srgb, var(--an-accent) 22%, #2a1418);
  --an-body-image: linear-gradient(180deg, rgba(0, 0, 0, .25), transparent 40%);
  --an-page-bg: #fbf6ec;
  --an-page-border: #3b2a22;
  --an-bg: #fbf6ec;
  --an-bg-2: #fffdf7;
  --an-bg-3: #f2eadc;
  --an-ink: #2a2320;
  --an-ink-2: #514640;
  --an-ink-3: #6f635c;
  --an-line: #e4d9c8;
  --an-line-strong: #c9b8a0;
  --an-header-bg: #fbf6ec;
  --an-header-ink: #2a2320;
  --an-nav-bg: color-mix(in srgb, var(--an-accent) 72%, #2a1418);
  --an-nav-ink: #fbf6ec;
  --an-nav-cur-bg: rgba(255, 255, 255, .2);
  --an-band-bg: color-mix(in srgb, var(--an-accent) 78%, #2a1418);
  --an-band-ink: #fbf6ec;
  --an-footer-bg: #2b1c1b;
  --an-footer-ink: #efe6dc;
  --an-footer-ink-2: #b3a597;
  --an-font: Georgia, "Times New Roman", serif;
  --an-font-head: Georgia, "Times New Roman", serif;
  --an-font-logo: Georgia, "Times New Roman", serif;
  --an-font-meta: system-ui, "Segoe UI", Arial, sans-serif;
  --an-radius: 2px; --an-radius-s: 2px; --an-radius-btn: 2px;
  --an-ligne-sep: 3px double #d7c8b4;
  --an-thumb-border: #b59d7f;
}
.skin-3 .an-header__top { border-bottom: 1px solid #d9c9b3; }
.skin-3 .an-logo__text { font-size: 1.75rem; letter-spacing: .02em; }
.skin-3 .an-logo__mark { border-radius: 50%; }
.skin-3 .an-header__slogan { font-style: italic; opacity: .8; }
.skin-3 .an-bandeau { font-style: italic; font-weight: 400; font-size: 1.05rem; letter-spacing: .01em; }
.skin-3 .an-bandeau .an-bloc__lien { font-style: normal; }
.skin-3 .an-titre__h1, .skin-3 .an-fiche__h1 { font-weight: 400; }
.skin-3 .an-titre { border-bottom: 3px double var(--an-line-strong); }
.skin-3 .an-ligne__title { font-weight: 400; font-size: 1.12rem; }
.skin-3 .an-ligne__title a { text-decoration: none; border-bottom: 1px solid var(--an-accent-line); }
.skin-3 .an-ligne__img { padding: 3px; }
.skin-3 .an-btn { background-image: none; box-shadow: none; text-transform: uppercase; letter-spacing: .06em; font-size: .88rem; }
.skin-3 .an-btn--big { font-size: .95rem; }
.skin-3 .an-page { border-radius: 0; }
.skin-3 .an-side__bloc, .skin-3 .an-hero, .skin-3 .an-moteur, .skin-3 .an-list { border-color: #d9c9b3; }

/* ============================================================ 4 — gay bleu nuit */
.skin-4 {
  --an-body-bg: color-mix(in srgb, var(--an-accent) 18%, #0e1626);
  --an-body-image: linear-gradient(180deg, rgba(255, 255, 255, .05), transparent 30%);
  --an-page-bg: #f4f6fa;
  --an-bg: #f4f6fa;
  --an-bg-2: #fff;
  --an-bg-3: #e9edf4;
  --an-ink: #171d2b;
  --an-ink-2: #3f4a5f;
  --an-ink-3: #5f6a7e;
  --an-line: #d8dee8;
  --an-line-strong: #b6c0d0;
  --an-header-bg: color-mix(in srgb, var(--an-accent) 22%, #101a2e);
  --an-header-ink: #fff;
  --an-nav-bg: color-mix(in srgb, var(--an-accent) 40%, #101a2e);
  --an-nav-cur-bg: var(--an-accent);
  --an-band-bg: linear-gradient(90deg, color-mix(in srgb, var(--an-accent) 70%, #0e1626), var(--an-accent));
  --an-band-ink: #fff;
  --an-footer-bg: #101a2e;
  --an-footer-ink: #e6ebf5;
  --an-footer-ink-2: #9aa7bf;
  --an-font: "Segoe UI", system-ui, Roboto, Arial, sans-serif;
  --an-font-head: "Segoe UI", system-ui, Roboto, Arial, sans-serif;
  --an-font-logo: "Segoe UI", system-ui, Roboto, Arial, sans-serif;
  --an-radius: 6px; --an-radius-s: 4px; --an-radius-btn: 4px;
  --an-ligne-sep: 1px solid #dfe5ee;
  --an-thumb-border: #b6c0d0;
}
.skin-4 .an-logo__text { font-weight: 800; letter-spacing: -.02em; text-transform: uppercase; font-size: 1.35rem; }
.skin-4 .an-logo__mark { border-radius: 50%; }
.skin-4 .an-bandeau { text-transform: uppercase; letter-spacing: .06em; font-size: .82rem; }
.skin-4 .an-ligne__img { border-radius: 6px; }
.skin-4 .an-ligne__title a { text-decoration: none; }
.skin-4 .an-ligne__title a:hover { text-decoration: underline; }
.skin-4 .an-nav__list a[aria-current] { box-shadow: inset 0 -3px 0 #fff; }
.skin-4 .an-side__list li::before, .skin-4 .an-cats__link::before, .skin-4 .an-geo li::before { content: "▸"; font-size: .75em; top: .35em; }
.skin-4 .an-btn--main { border-color: transparent; }
.skin-4 .an-fiche__contact { border-color: var(--an-line-strong); }

/* ============================================================ 5 — trans violet */
.skin-5 {
  --an-body-bg: color-mix(in srgb, var(--an-accent) 24%, #1e1428);
  --an-body-image: radial-gradient(ellipse at 80% 0%, rgba(255, 255, 255, .08), transparent 50%);
  --an-page-bg: #faf7fd;
  --an-page-border: rgba(255, 255, 255, .25);
  --an-bg: #faf7fd;
  --an-bg-2: #fff;
  --an-bg-3: #f0eaf6;
  --an-ink: #221a2b;
  --an-ink-2: #4d4256;
  --an-ink-3: #6d6176;
  --an-line: #e2d9ea;
  --an-line-strong: #c6b8d2;
  --an-header-bg: linear-gradient(135deg, color-mix(in srgb, var(--an-accent) 80%, #000), var(--an-accent));
  --an-header-ink: #fff;
  --an-nav-bg: #fff;
  --an-nav-ink: #221a2b;
  --an-nav-cur-bg: color-mix(in srgb, var(--an-accent) 12%, #fff);
  --an-nav-cur-ink: var(--an-accent-ink);
  --an-band-bg: color-mix(in srgb, var(--an-accent) 88%, #000);
  --an-band-ink: #fff;
  --an-footer-bg: #221a2b;
  --an-footer-ink: #eee8f3;
  --an-footer-ink-2: #aa9fb5;
  --an-font: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --an-font-head: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --an-font-logo: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --an-radius: 10px; --an-radius-s: 7px; --an-radius-btn: 999px;
  --an-ligne-sep: 1px solid #e6def0;
  --an-thumb-border: #c6b8d2;
}
.skin-5 .an-logo__cap { color: #fff; }
.skin-5 .an-logo__text { font-weight: 800; letter-spacing: -.02em; }
.skin-5 .an-logo__mark { background: #fff; color: var(--an-accent); border-radius: 50%; }
.skin-5 .an-logo__lignes { stroke: var(--an-accent); }
.skin-5 .an-nav { border-bottom: 1px solid var(--an-line); box-shadow: 0 2px 6px -4px rgba(0, 0, 0, .3); }
.skin-5 .an-burger { border-color: rgba(255, 255, 255, .5); }
.skin-5 .an-nav__list a[aria-current] { box-shadow: inset 0 -3px 0 var(--an-accent); }
.skin-5 .an-bandeau { border-radius: 999px; padding: .45em 1em; }
.skin-5 .an-side__h.an-bandeau, .skin-5 .an-hero__h2, .skin-5 .an-moteur__h2, .skin-5 .an-reponse__h, .skin-5 .an-form__group > legend, .skin-5 .an-fiche__contact-h { border-radius: 0; }
.skin-5 .an-ligne__img { border-radius: 10px; }
.skin-5 .an-ligne__title a { text-decoration: none; }
.skin-5 .an-ligne__title a:hover { text-decoration: underline; }
.skin-5 .an-pager a, .skin-5 .an-pager span[aria-current] { border-radius: 999px; }
.skin-5 .an-chip, .skin-5 .an-form__radios--seg span { border-radius: 999px; }
.skin-5 .an-side__list li::before, .skin-5 .an-cats__link::before, .skin-5 .an-geo li::before { content: "•"; }
@media (max-width: 899px) { .skin-5 .an-nav { color: #221a2b; } .skin-5 .an-nav__list a { border-bottom-color: var(--an-line); } }

/* ============================================================ 6 — classique gris-bleu */
.skin-6 {
  --an-accent-ink: color-mix(in srgb, var(--an-accent) 75%, #000);
  --an-body-bg: #dde1e7;
  --an-body-image: none;
  --an-page-bg: #fff;
  --an-page-border: #b9c0cc;
  --an-page-shadow: 0 2px 10px rgba(0, 0, 0, .15);
  --an-bg: #fff;
  --an-bg-2: #fff;
  --an-bg-3: #f1f3f6;
  --an-ink: #222;
  --an-ink-2: #444;
  --an-ink-3: #666;
  --an-line: #d5dae2;
  --an-line-strong: #aeb7c4;
  --an-title-ink: #2f3f5f;
  --an-header-bg: #fff;
  --an-header-ink: #2f3f5f;
  --an-nav-bg: color-mix(in srgb, var(--an-accent) 30%, #3b4a6b);
  --an-nav-ink: #fff;
  --an-nav-cur-bg: rgba(255, 255, 255, .22);
  --an-band-bg: color-mix(in srgb, var(--an-accent) 25%, #5b6b8c);
  --an-band-ink: #fff;
  --an-footer-bg: #eef1f5;
  --an-footer-ink: #2f3f5f;
  --an-footer-ink-2: #6a778c;
  --an-font: Verdana, Geneva, Tahoma, sans-serif;
  --an-font-head: Verdana, Geneva, Tahoma, sans-serif;
  --an-font-logo: "Trebuchet MS", Verdana, Tahoma, sans-serif;
  --an-font-meta: Verdana, Geneva, Tahoma, sans-serif;
  --an-radius: 0; --an-radius-s: 0; --an-radius-btn: 2px;
  --an-ligne-sep: 1px solid #d5dae2;
  --an-thumb-border: #aeb7c4;
}
.skin-6 body, .skin-6 { font-size: 14px; }
.skin-6 .an-page { border-radius: 0; }
.skin-6 .an-header__top { border-bottom: 3px solid var(--an-nav-bg); }
.skin-6 .an-logo__text { font-size: 1.5rem; }
.skin-6 .an-burger { border-color: var(--an-line-strong); }
.skin-6 .an-bandeau { font-size: .85rem; text-transform: uppercase; letter-spacing: .04em; }
.skin-6 .an-ligne__title { font-size: 1rem; }
.skin-6 .an-ligne__title a { color: var(--an-accent-ink); }
.skin-6 .an-btn { background-image: linear-gradient(#fff3, #0001); }
.skin-6 .an-footer__h { color: #2f3f5f; border-color: #c9d0da; }
.skin-6 .an-footer__bottom { border-color: #c9d0da; }
.skin-6 .an-footer a:hover { color: var(--an-accent-ink); }
.skin-6 .an-side__list li::before, .skin-6 .an-cats__link::before, .skin-6 .an-geo li::before { content: "»"; color: var(--an-nav-bg); }
@media (max-width: 899px) { .skin-6 .an-header__top { color: #2f3f5f; } }
