/* plan-cul-liege.be — registre « violet profond & pêche, gouttes et étiquettes à encoche »
   Palette : accent #4a148c (favicon) · encre #22102e · neutre chaud pêche #fff5ee / #fde2d2 / #f6b89a (décor)
   Formes signature : photos en GOUTTE (un coin pincé), étiquettes à ENCOCHE (clip-path), cœur SVG en filigrane
   derrière les CTA, pointillés pêche sous les titres. Base : skin-4 « catalogue », compo 3. */

body.sa.skin-4 {
  --sa-fond: #fff5ee; --sa-fond2: #fde6d8; --sa-surface: #fffbf8; --sa-bord: #f0d3c3;
  --sa-texte: #22102e; --sa-muet: #5d4a63; --sa-tete: #fff5ee; --sa-tete-txt: #22102e;
  --sa-pied: #2a0d45; --sa-pied-txt: #f7ddcf; --sa-secondaire: #3a1266; --sa-secondaire-txt: #fff3ea;
  --sa-rayon: 22px; --sa-rayon-s: 12px;
  --pl-peche: #f6b89a; --pl-peche-2: #fde2d2;
  --pl-ombre: 0 2px 4px rgba(74, 20, 140, .06), 0 18px 36px -18px rgba(74, 20, 140, .38);
  --sa-police-titre: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif;
  background: radial-gradient(120% 60% at 100% 0, #fde2d2 0, rgba(253, 226, 210, 0) 60%) #fff5ee;
}
body.sa.skin-4 h1, body.sa.skin-4 h2, body.sa.skin-4 h3 { text-transform: none; letter-spacing: -.005em; }
body.sa.skin-4 .sa-h1, body.sa.skin-4 .sa-fiche__titre { font-weight: 700; color: #2a0d45; }
body.sa.skin-4 .sa-h1::after, body.sa.skin-4 .sa-main .sa-h2::after {
  content: ""; display: block; width: 88px; height: 6px; margin-top: .45rem;
  background: radial-gradient(circle, var(--pl-peche) 2.6px, transparent 3px) 0 50% / 12px 6px repeat-x;
}

/* ---------- en-tête ---------- */
body.sa.skin-4 .sa-header { background: rgba(255, 245, 238, .96); border-bottom: 0; box-shadow: 0 10px 24px -20px rgba(74, 20, 140, .55); }
body.sa.skin-4 .sa-header::after { content: ""; display: block; height: 4px; background: linear-gradient(90deg, #4a148c, #8e44c9 45%, var(--pl-peche) 100%); }
body.sa.skin-4 .sa-logo { letter-spacing: .14em; color: #2a0d45; }
body.sa.skin-4 .sa-logo__mark { background: #4a148c; color: #fff3ea; border-radius: 50% 50% 50% 6px; box-shadow: 3px 3px 0 var(--pl-peche); }
@media (min-width: 900px) {
  body.sa.skin-4 .sa-nav li a { color: #3a1266; border-radius: 0; position: relative; }
  body.sa.skin-4 .sa-nav li a:hover, body.sa.skin-4 .sa-nav li a.is-actif { background: none; color: #4a148c; text-decoration: none; }
  body.sa.skin-4 .sa-nav li a:hover::after, body.sa.skin-4 .sa-nav li a.is-actif::after {
    content: ""; position: absolute; left: 50%; bottom: -2px; width: 8px; height: 8px; margin-left: -4px;
    background: var(--pl-peche); border-radius: 50% 50% 50% 0; transform: rotate(-45deg);
  }
}
body.sa.skin-4 .sa-btn { border-radius: 14px 14px 14px 4px; letter-spacing: .08em; transition: transform .18s ease, box-shadow .18s ease; }
body.sa.skin-4 .sa-btn--accent, body.sa.skin-4 .sa-btn--carte { background: #4a148c; color: #fff; border-color: #4a148c; box-shadow: 0 8px 18px -10px rgba(74, 20, 140, .8); }
body.sa.skin-4 .sa-btn--accent:hover, body.sa.skin-4 .sa-btn--carte:hover { background: #5b1ca8; transform: translateY(-1px); text-decoration: none; }
body.sa.skin-4 .sa-btn--ghost { background: #fffbf8; color: #3a1266; border: 2px solid #4a148c; }
body.sa.skin-4 .sa-btn--ghost:hover { background: var(--pl-peche-2); text-decoration: none; }
body.sa.skin-4 .sa-crumbs, body.sa.skin-4 .sa-crumbs a { color: #5d4a63; }

/* ---------- liste d'annonces : cartes-lignes chaudes ---------- */
body.sa.skin-4 .sa-grille { border-top: 0; gap: 1.1rem; }
body.sa.skin-4 .sa-carte {
  background: #fffbf8; border: 1px solid #f3d9ca; border-radius: 26px 26px 26px 8px; padding: 1rem;
  box-shadow: var(--pl-ombre); transition: transform .2s ease, box-shadow .2s ease;
}
body.sa.skin-4 .sa-carte:hover { transform: translateY(-2px); box-shadow: 0 2px 4px rgba(74, 20, 140, .08), 0 24px 40px -18px rgba(74, 20, 140, .45); }
body.sa.skin-4 .sa-carte__img {
  border-radius: 10px 58% 58% 58% / 10px 48% 48% 48%; overflow: hidden;
  box-shadow: 0 0 0 4px #fffbf8, 0 0 0 6px var(--pl-peche);
  align-self: flex-start; aspect-ratio: 4 / 5; height: auto;
}
body.sa.skin-4 .sa-carte__img img { width: 100%; height: 100%; object-fit: cover; }
body.sa.skin-4 .sa-carte__img img { transition: transform .5s ease; }
body.sa.skin-4 .sa-carte:hover .sa-carte__img img { transform: scale(1.05); }
body.sa.skin-4 .sa-carte__new {
  background: var(--pl-peche); color: #2a0d45; border-radius: 0; font-weight: 700; padding-right: 14px;
  clip-path: polygon(0 0, 100% 0, calc(100% - 8px) 50%, 100% 100%, 0 100%);
}
body.sa.skin-4 .sa-carte__titre { font-family: var(--sa-police-titre); font-size: 1.22rem; color: #2a0d45; }
body.sa.skin-4 .sa-carte__titre a { color: inherit; }
body.sa.skin-4 .sa-carte__pseudo { color: #4a148c; }
body.sa.skin-4 .sa-carte__extrait { color: #3b2a44; }
body.sa.skin-4 .sa-carte__ville, body.sa.skin-4 .sa-carte__age, body.sa.skin-4 .sa-meta { color: #5d4a63; }
@media (min-width: 640px) { body.sa.skin-4 .sa-carte__pied { border-left: 2px dotted var(--pl-peche); } }
body.sa.skin-4 .sa-btn--carte { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }

/* ---------- colonne thèmes / similaires / régions ---------- */
body.sa.skin-4 .sa-tags, body.sa.skin-4 .sa-side, body.sa.skin-4 .sa-similaires, body.sa.skin-4 .sa-regions {
  background: #fffbf8; border: 1px solid #f3d9ca; border-top: 5px solid #4a148c; border-radius: 8px 8px 26px 26px;
  padding: 1.1rem 1.2rem; box-shadow: var(--pl-ombre);
}
body.sa.skin-4 .sa-tags__liste a { border-bottom: 1px dashed #f0d3c3; color: #2a0d45; }
body.sa.skin-4 .sa-pastille, body.sa.skin-4 .sa-badge {
  background: var(--pl-peche-2); color: #3a1266; border: 0; border-radius: 0; padding: .1rem .75rem .1rem .45rem;
  clip-path: polygon(0 0, 100% 0, calc(100% - 7px) 50%, 100% 100%, 0 100%);
}
body.sa.skin-4 .sa-similaires__img { border-radius: 50% 50% 50% 6px; }
body.sa.skin-4 .sa-similaires__titre, body.sa.skin-4 .sa-similaires__titre a { color: #2a0d45; }
body.sa.skin-4 .sa-membres__avatar { border-radius: 50% 50% 50% 8px; border: 0; box-shadow: 0 0 0 3px #fffbf8, 0 0 0 5px var(--pl-peche); }
body.sa.skin-4 .sa-membres__nom { color: #2a0d45; }
body.sa.skin-4 .sa-pagination li a, body.sa.skin-4 .sa-pagination li span { border-radius: 12px 12px 12px 3px; }
body.sa.skin-4 .sa-pagination li.is-actif span { background: #4a148c; border-color: #4a148c; color: #fff; }

/* ---------- fiche d'annonce ---------- */
body.sa.skin-4 .sa-fiche__photo { border-radius: 14px 60% 60% 60% / 14px 46% 46% 46%; overflow: hidden; box-shadow: 0 0 0 6px #fffbf8, 0 0 0 8px var(--pl-peche), var(--pl-ombre); }
body.sa.skin-4 .sa-fiche__id > div { border-top: 1px dashed var(--pl-peche); }
body.sa.skin-4 .sa-fiche__id dt { color: #5d4a63; }
body.sa.skin-4 .sa-fiche__id dd { color: #22102e; }
body.sa.skin-4 .sa-fiche__id-lieu a { color: #4a148c; font-weight: 600; }
body.sa.skin-4 .sa-fiche__texte { background: #fffbf8; border-radius: 22px 22px 22px 6px; padding: 1.1rem 1.3rem; box-shadow: var(--pl-ombre); color: #2a1c33; }
body.sa.skin-4 .sa-dispo { background: #fffbf8; border: 1px solid #f3d9ca; border-radius: 22px 22px 6px 22px; box-shadow: var(--pl-ombre); }
body.sa.skin-4 .sa-chip {
  background: var(--pl-peche-2); color: #3a1266; border: 0; border-radius: 0; padding: .3rem .95rem .3rem .6rem;
  clip-path: polygon(0 0, 100% 0, calc(100% - 9px) 50%, 100% 100%, 0 100%);
}
body.sa.skin-4 .sa-chip:hover { background: var(--pl-peche); text-decoration: none; }
body.sa.skin-4 .sa-btn--like { border-radius: 14px 14px 14px 4px; color: #4a148c; border-color: #4a148c; background: #fffbf8; }
body.sa.skin-4 .sa-cta {
  border: 0; border-radius: 28px 28px 28px 8px; padding: 1.6rem 1.4rem;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23f6b89a' fill-opacity='.45' d='M12 21s-7.5-4.6-9.6-9.2C.8 8.3 3 4.5 6.7 4.5c2.1 0 3.6 1.1 5.3 3 1.7-1.9 3.2-3 5.3-3 3.7 0 5.9 3.8 4.3 7.3C19.5 16.4 12 21 12 21z'/%3E%3C/svg%3E") no-repeat right -18px bottom -22px / 120px 120px,
    linear-gradient(160deg, #fde2d2, #fff3ea);
  box-shadow: 0 0 0 2px #4a148c inset, var(--pl-ombre);
}
body.sa.skin-4 .sa-cta__q { color: #2a0d45; font-family: var(--sa-police-titre); }
body.sa.skin-4 .sa-fiche__barre { background: #fff5ee; border-top: 3px solid var(--pl-peche); }

/* ---------- formulaires (dépôt, commentaire) ---------- */
body.sa.skin-4 .sa-main fieldset { background: #fffbf8; border: 1px solid #f0d3c3; border-radius: 24px 24px 24px 6px; box-shadow: var(--pl-ombre); padding: 1rem 1.2rem 1.2rem; }
body.sa.skin-4 .sa-main legend { background: #4a148c; color: #fff; padding: .2rem 1.2rem .2rem .8rem; font-family: var(--sa-police-titre); clip-path: polygon(0 0, 100% 0, calc(100% - 10px) 50%, 100% 100%, 0 100%); }
body.sa.skin-4 .sa-main input:not([type=checkbox]):not([type=radio]):not([type=file]),
body.sa.skin-4 .sa-main select, body.sa.skin-4 .sa-main textarea {
  border: 1.5px solid #e9c3b0; border-radius: 14px 14px 14px 4px; background: #fff; color: #22102e;
}
body.sa.skin-4 .sa-main input:focus, body.sa.skin-4 .sa-main select:focus, body.sa.skin-4 .sa-main textarea:focus { outline: 2px solid #4a148c; outline-offset: 1px; border-color: #4a148c; }
body.sa.skin-4 .sa-form__lbl { color: #2a0d45; }

/* ---------- bloc d'inscription + pied ---------- */
body.sa.skin-4 .sa-inscrire {
  --sa-texte: #fff3ea; --sa-muet: #f3d6c6;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23f6b89a' fill-opacity='.14' d='M12 21s-7.5-4.6-9.6-9.2C.8 8.3 3 4.5 6.7 4.5c2.1 0 3.6 1.1 5.3 3 1.7-1.9 3.2-3 5.3-3 3.7 0 5.9 3.8 4.3 7.3C19.5 16.4 12 21 12 21z'/%3E%3C/svg%3E") no-repeat 4% 50% / 220px 220px,
    linear-gradient(135deg, #3a1266, #4a148c 60%, #5e1f9e);
  color: #fff3ea; border-radius: 40px 40px 0 0;
}
body.sa.skin-4 .sa-inscrire__h { color: #fff3ea; }
body.sa.skin-4 .sa-inscrire .sa-form__lbl, body.sa.skin-4 .sa-inscrire label { color: #fde2d2; }
body.sa.skin-4 .sa-inscrire .sa-btn--accent { background: var(--pl-peche); color: #2a0d45; border-color: var(--pl-peche); }
body.sa.skin-4 .sa-inscrire .sa-btn--accent:hover { background: #f9c8b0; }
body.sa.skin-4 .sa-inscrire input:not([type=checkbox]) { border-radius: 14px 14px 14px 4px; border: 0; }
body.sa.skin-4 .sa-footer { background: #2a0d45; color: #f7ddcf; margin-top: 0; }
body.sa.skin-4 .sa-liens { --sa-texte: #fff3ea; --sa-muet: #e8cbbd; background: #2a0d45; color: #f7ddcf; }
body.sa.skin-4 .sa-liens a { color: #fde2d2; }
body.sa.skin-4 .sa-liens__h { color: var(--pl-peche); }
body.sa.skin-4 .sa-liens__marque { color: #fff3ea; }
body.sa.skin-4 .sa-footer__tail, body.sa.skin-4 .sa-footer__legal { color: #e8cbbd; }
body.sa.skin-4 .sa-footer a { color: #fde2d2; }

body.sa.skin-4 .sa-footer .sa-membres__h, body.sa.skin-4 .sa-membres .sa-membres__h { color: var(--pl-peche); }
body.sa.skin-4 .sa-footer .sa-membres__nom { color: #fff3ea; }
body.sa.skin-4 .sa-footer .sa-membres__ville { color: #e8cbbd; }
body.sa.skin-4 .sa-footer .sa-btn--ghost { background: transparent; color: #fde2d2; border-color: var(--pl-peche); }
body.sa.skin-4 .sa-footer .sa-btn--ghost:hover { background: rgba(246, 184, 154, .16); }

/* ---------- mobile ---------- */
body.sa.skin-4 .sa-barre-mobile { background: #4a148c; box-shadow: 0 -3px 0 var(--pl-peche), 0 -8px 18px rgba(74, 20, 140, .3); }
@media (max-width: 767px) {
  body.sa.skin-4 .sa-carte { border-radius: 22px 22px 22px 6px; padding: .8rem; }
  body.sa.skin-4 .sa-inscrire { border-radius: 28px 28px 0 0; }
  body.sa.skin-4 .sa-carte__titre { font-size: 1.05rem; }
}
@media (prefers-reduced-motion: reduce) {
  body.sa.skin-4 .sa-carte, body.sa.skin-4 .sa-carte__img img, body.sa.skin-4 .sa-btn { transition: none; }
  body.sa.skin-4 .sa-carte:hover, body.sa.skin-4 .sa-carte:hover .sa-carte__img img { transform: none; }
}