/* CONFIGURATION DES COULEURS ET POLICES */
:root {
    --turquoise: #40E0D0;
    --orange: #c94f29;
    --dark: #2F4F4F;
    --white: #ffffff;
    --bg-light: #f9fdfd;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

img,
video {
    max-width: 100%;
}

html {
    overflow-x: clip;
}

body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    margin: 0;
    padding: 0;
    background-color: var(--bg-light);
    color: var(--dark);
    overflow-x: clip;
}

body.site-theme-night {
    background:
        radial-gradient(circle at top left, rgba(73, 127, 122, 0.18), transparent 28%),
        radial-gradient(circle at top right, rgba(52, 92, 112, 0.24), transparent 30%),
        linear-gradient(180deg, #0f1b1f 0%, #16272c 46%, #1c3036 100%);
    color: #deecea;
}

body.auth-page {
    min-height: 100vh;
    min-height: 100svh;
    display: flex;
    flex-direction: column;
}

/* EN-TÊTE */
.site-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
    padding: 20px 5%;
    background: var(--white);
    border-bottom: 1px solid #e8eff0;
}

body.site-theme-night .site-header {
    background: rgba(16, 29, 33, 0.88);
    border-bottom-color: rgba(112, 160, 159, 0.18);
    backdrop-filter: blur(16px);
}

.logo {
    flex: 0 0 auto;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 98px;
    height: 98px;
    padding: 0;
    border-radius: 50%;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 12px 28px rgba(32, 64, 68, 0.08);
    border: 1px solid rgba(216, 228, 228, 0.9);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.logo-image {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    border-radius: 50%;
    clip-path: circle(50% at 50% 50%);
}

.logo:hover {
    transform: translateY(-1px);
    box-shadow: 0 16px 34px rgba(32, 64, 68, 0.12);
}

body.site-theme-night .logo {
    background: linear-gradient(180deg, rgba(24, 40, 45, 0.9) 0%, rgba(19, 33, 37, 0.94) 100%);
    border-color: rgba(112, 160, 159, 0.22);
    box-shadow: 0 18px 34px rgba(0, 0, 0, 0.26);
}

body.site-theme-night .logo,
body.site-theme-night .nav-link,
body.site-theme-night .nav-welcome {
    color: #e9f6f4;
}

.nav-link {
    text-decoration: none;
    color: var(--dark);
    font-weight: bold;
    display: inline-flex;
    align-items: center;
    min-height: 44px;
}

.nav-link-messages {
    position: relative;
}

.nav-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: #e74c3c;
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    margin-left: 4px;
    vertical-align: middle;
    line-height: 1;
}

.site-nav {
    display: flex;
    align-items: center;
    gap: 10px 18px;
    flex-wrap: wrap;
    justify-content: flex-end;
    flex: 1 1 520px;
}

body.home-page .site-header {
    position: absolute;
    inset: 0 0 auto;
    z-index: 20;
    background: transparent;
    border-bottom: 0;
    padding-top: 18px;
}

body.home-page .logo {
    background: rgba(255, 255, 255, 0.9);
    border-color: rgba(216, 228, 228, 0.78);
}

body.home-page .site-nav {
    flex: 0 1 auto;
    padding: 12px 16px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid rgba(216, 228, 228, 0.72);
    box-shadow: 0 12px 28px rgba(32, 64, 68, 0.08);
    backdrop-filter: blur(12px);
}

body.home-page.site-theme-night .site-nav .nav-link,
body.home-page.site-theme-night .site-nav .nav-welcome {
    color: var(--dark);
}

body.home-page.site-theme-night .site-nav .nav-link.is-active {
    color: var(--orange);
}

.nav-link.is-active {
    color: var(--orange);
}

.nav-welcome {
    color: #5b677a;
    font-weight: 600;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ── Bouton hamburger (caché sur desktop) ─────────────────────────── */
.nav-toggle {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 8px;
    margin-left: auto;
    z-index: 1001;
    flex-shrink: 0;
    width: 44px;
    height: 44px;
}

.nav-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    background: var(--dark);
    border-radius: 2px;
    transition: transform 0.22s ease, opacity 0.22s ease;
}

.nav-toggle.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle.is-open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.nav-toggle.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

body.site-theme-night .nav-toggle span { background: #e9f6f4; }

/* ── Responsive mobile ────────────────────────────────────────────── */
@media (max-width: 680px) {
    .site-header {
        padding: 10px 5%;
        flex-wrap: nowrap;
        align-items: center;
        position: relative;
    }

    .logo {
        width: 52px;
        height: 52px;
        min-width: 52px;
    }

    .logo-image {
        width: 100%;
        height: 100%;
    }

    .nav-toggle {
        display: flex;
    }

    .site-nav {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        flex-direction: column;
        align-items: flex-start;
        gap: 0;
        padding: 8px 0 12px;
        background: var(--white);
        border-bottom: 1px solid #e8eff0;
        box-shadow: 0 8px 24px rgba(32, 64, 68, 0.1);
        z-index: 1000;
    }

    .site-nav.is-open {
        display: flex;
    }

    .site-nav .nav-link,
    .site-nav .nav-welcome {
        width: 100%;
        padding: 12px 5%;
        border-bottom: 1px solid #f0f4f4;
        font-size: 1rem;
    }

    .site-nav .nav-link:last-child,
    .site-nav .nav-welcome:last-child {
        border-bottom: none;
    }

    body.site-theme-night .site-nav {
        background: #101d21;
        border-bottom-color: rgba(112, 160, 159, 0.18);
    }

    body.site-theme-night .site-nav .nav-link,
    body.site-theme-night .site-nav .nav-welcome {
        border-bottom-color: rgba(112, 160, 159, 0.12);
    }

    /* Page d'accueil : nav pill reste visible */
    body.home-page .site-nav {
        position: absolute;
        top: 100%;
        border-radius: 0 0 16px 16px;
    }
}

/* BAS DE PAGE */
.site-footer {
    margin-top: 56px;
    padding: 26px 20px 34px;
    border-top: 1px solid #e6eceb;
    background: rgba(255, 255, 255, 0.88);
}

.site-footer-inner {
    width: min(1120px, calc(100% - 24px));
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 24px;
    align-items: start;
}

.site-footer-brand strong {
    display: block;
    margin-bottom: 8px;
    font-size: 1rem;
}

.site-footer-brand p,
.site-footer-meta span,
.site-footer-meta a {
    margin: 0;
    color: #617277;
    line-height: 1.6;
}

.site-footer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 16px;
}

.site-footer-links a,
.site-footer-meta a {
    color: #2f4f4f;
    text-decoration: none;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    min-height: 44px;
}

.site-footer-links a:hover,
.site-footer-meta a:hover {
    text-decoration: underline;
}

.site-footer-meta {
    display: flex;
    flex-direction: column;
    gap: 8px;
}


.site-footer-social-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
    color: #1877f2;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.9rem;
    transition: opacity 0.15s;
    min-height: 44px;
}

.site-footer-social-link:hover {
    opacity: 0.8;
    text-decoration: none;
}

body.site-theme-night .site-footer-social-link {
    color: #5b9cf6;
}

body.site-theme-night .site-footer {
    background: rgba(14, 26, 30, 0.86);
    border-top-color: rgba(112, 160, 159, 0.16);
}

body.site-theme-night .site-footer-brand p,
body.site-theme-night .site-footer-meta span,
body.site-theme-night .site-footer-meta a,
body.site-theme-night .site-footer-links a,
body.site-theme-night .site-footer-brand strong {
    color: #dceceb;
}
.admin-page {
    padding: 40px 5% 80px;
}

.login-page {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px 20px;
}

.login-card {
    width: 100%;
    max-width: 460px;
    background: white;
    border-radius: 24px;
    box-shadow: 0 15px 35px rgba(0,0,0,0.08);
    padding: 32px;
}

.login-form {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-top: 24px;
}

.login-input {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #c8d2e1;
    border-radius: 12px;
    padding: 14px 16px;
    font-size: 16px;
}

.login-button {
    margin-top: 8px;
}

.form-switch-text {
    margin: 22px 0 0;
    color: #5b677a;
}

.auth-helper-links {
    margin: 18px 0 0;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    color: #5b677a;
}

.auth-helper-links a {
    color: var(--orange);
    font-weight: bold;
    text-decoration: none;
}

.auth-helper-links a:hover {
    text-decoration: underline;
}

.confirmation-text {
    margin: 18px 0 0;
    color: #5b677a;
}

.signup-checkbox {
    margin-top: 4px;
}

.honeypot-field {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.resend-form {
    margin-top: 14px;
}

.link-button {
    background: none;
    border: none;
    padding: 0;
    color: var(--orange);
    font-weight: bold;
    cursor: pointer;
}

.turnstile-wrap {
    margin-top: 4px;
}

.admin-panel {
    background: white;
    border-radius: 24px;
    box-shadow: 0 15px 35px rgba(0,0,0,0.08);
    padding: 32px;
    margin-bottom: 32px;
}

.admin-import-form {
    margin-top: 24px;
}

.field-label {
    display: block;
    font-weight: bold;
    margin-bottom: 12px;
}

.admin-help-text {
    margin: 0 0 14px;
    color: #5b677a;
}

.admin-search-row {
    max-width: 820px;
    margin: 0;
}

.admin-select {
    border: 1px solid #c8d2e1;
    border-radius: 12px;
    padding: 0 12px;
    font-size: 15px;
    background: white;
    color: var(--dark);
}

.admin-type-filters {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin: 18px 0 4px;
}

.admin-type-filters a {
    display: inline-flex;
    align-items: center;
    border: 1px solid #dbe6e8;
    border-radius: 999px;
    background: #f7fbfc;
    color: var(--dark);
    padding: 9px 13px;
    font-weight: 700;
    text-decoration: none;
}

.admin-type-filters a.is-active {
    border-color: rgba(239, 134, 84, 0.42);
    background: rgba(239, 134, 84, 0.14);
    color: #9b4d2e;
}

.manual-form {
    margin-top: 24px;
}

.manual-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.manual-full {
    grid-column: 1 / -1;
}

.admin-input {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #c8d2e1;
    border-radius: 12px;
    padding: 14px 16px;
    font-size: 15px;
    background: white;
    color: var(--dark);
}

.admin-multiselect {
    min-height: 12rem;
}

.file-input {
    padding: 12px;
}

.admin-textarea {
    min-height: 120px;
    resize: vertical;
    font-family: inherit;
}

.manual-checkboxes {
    display: flex;
    gap: 20px;
    margin: 20px 0 24px;
    flex-wrap: wrap;
}

.checkbox-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--dark);
}

.flash-success,
.flash-error {
    padding: 14px 18px;
    border-radius: 12px;
    margin-top: 18px;
}

.flash-success {
    background: #ecfff8;
    color: #156a4d;
}

.flash-error {
    background: #fff1f1;
    color: #8c2f39;
}

.import-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
    margin-top: 24px;
}

.import-stats p {
    margin: 0;
    background: var(--bg-light);
    padding: 14px 16px;
    border-radius: 14px;
}

.admin-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 24px;
    margin-top: 24px;
}

.admin-relation-list {
    display: grid;
    gap: 12px;
    margin-top: 24px;
}

.admin-relation-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 16px;
    border: 1px solid #dbe6e8;
    border-radius: 14px;
    padding: 14px 16px;
}

.admin-relation-row strong,
.admin-relation-row span {
    display: block;
}

.admin-relation-row span,
.admin-relation-row p {
    color: #5b677a;
    margin: 4px 0 0;
}

.admin-relation-row .btn-search {
    min-width: 104px;
}

body.site-theme-night .admin-panel {
    background: rgba(23, 39, 44, 0.92);
    border: 1px solid rgba(110, 154, 152, 0.14);
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.28);
    color: #deecea;
}

body.site-theme-night .admin-panel h1,
body.site-theme-night .admin-panel h2,
body.site-theme-night .admin-panel h3,
body.site-theme-night .admin-relation-row strong {
    color: #eef8f7;
}

body.site-theme-night .admin-panel p,
body.site-theme-night .admin-help-text,
body.site-theme-night .admin-relation-row span,
body.site-theme-night .admin-relation-row p {
    color: #b9cfcd;
}

body.site-theme-night .admin-relation-row {
    background: rgba(14, 27, 31, 0.68);
    border-color: rgba(110, 154, 152, 0.18);
}

body.site-theme-night .admin-input,
body.site-theme-night .admin-select {
    background: rgba(11, 21, 24, 0.84);
    border-color: rgba(117, 165, 163, 0.22);
    color: #eef8f7;
}

body.site-theme-night .admin-input option,
body.site-theme-night .admin-select option {
    background: #17272c;
    color: #eef8f7;
}

.admin-card .card {
    width: auto;
    margin: 0;
}

.review-actions {
    margin-top: 14px;
    display: flex;
    justify-content: center;
}

.btn-secondary {
    background: var(--dark);
}

.btn-secondary:hover {
    background: #254141;
}

.btn-danger {
    background: #c0392b;
    color: white;
    border: none;
    padding: 12px 25px;
    border-radius: 10px;
    cursor: pointer;
    font-weight: bold;
    transition: background 0.3s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

.btn-danger:hover {
    background: #96281b;
}
/* BANNIÈRE PRINCIPALE AVEC IMAGE */
.hero {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    background: #143e45;
    padding: 80px 5% 58px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    border-radius: 0 0 34px 34px;
    min-height: 480px;
}

.hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(7, 22, 27, 0.78) 0%, rgba(11, 38, 45, 0.66) 48%, rgba(13, 45, 53, 0.48) 100%);
}

.hero-media {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.hero-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

body.home-page .hero {
    padding-top: 170px;
}

.hero-text {
    flex: 1;
    min-width: 300px;
    max-width: 1100px;
    color: white;
    position: relative;
    z-index: 2;
}

.hero-kicker {
    display: inline-flex;
    align-items: center;
    padding: 8px 14px;
    border-radius: 999px;
    margin-bottom: 18px;
    background: rgba(9, 24, 28, 0.66);
    border: 1px solid rgba(255, 255, 255, 0.28);
    color: #fff;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.hero-text h1 {
    font-size: 3.35rem;
    line-height: 1.05;
    max-width: 900px;
    margin: 0 0 18px;
    text-shadow: 0 10px 28px rgba(8, 18, 24, 0.35);
}

.hero-subtitle {
    font-size: 1.14rem;
    max-width: 720px;
    margin: 0 0 24px;
    line-height: 1.6;
    text-shadow: 0 6px 22px rgba(8, 18, 24, 0.28);
    color: #f6fffe;
}

.hero-benefits {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: -4px 0 22px;
}

.hero-benefits span {
    display: inline-flex;
    align-items: center;
    padding: 9px 14px;
    border-radius: 999px;
    background: rgba(10, 28, 32, 0.28);
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: #f5fffe;
    font-weight: 700;
    backdrop-filter: blur(6px);
}

.hero-emoji-block {
    flex: 1;
    text-align: center;
    min-width: 300px;
}

.hero-emoji {
    font-size: 150px;
}

/* BARRE DE RECHERCHE */
.search-container {
    background: white;
    padding: 12px;
    border-radius: 14px;
    display: flex;
    gap: 10px;
    max-width: 690px;
    margin-top: 0;
    box-shadow: 0 10px 20px rgba(0,0,0,0.15);
    box-sizing: border-box;
}

.search-container input {
    border: none;
    padding: 12px 14px;
    flex: 1;
    font-size: 16px;
    outline: none;
    min-width: 220px;
    box-sizing: border-box;
}

.search-container-page {
    margin: 30px auto 0;
}

.btn-search {
    background: var(--orange);
    color: white;
    border: none;
    padding: 12px 25px;
    border-radius: 10px;
    cursor: pointer;
    font-weight: bold;
    transition: background 0.3s;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-height: 44px;
}

.btn-search:hover {
    background: #a84020;
}

.hero-actions {
    display: flex;
    gap: 12px 16px;
    align-items: center;
    margin-top: 18px;
    flex-wrap: wrap;
}

.hero-secondary-link {
    color: white;
    font-weight: bold;
    display: inline-flex;
    align-items: center;
    min-height: 44px;
}

.hero-secondary-link-ghost {
    display: inline-flex;
    align-items: center;
    padding: 11px 16px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.18);
    text-decoration: none;
    box-sizing: border-box;
}

.hero-reassurance {
    color: rgba(255, 255, 255, 0.92);
    font-weight: 700;
}

.hero-paths {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    max-width: 900px;
    margin-top: 24px;
}

.hero-path-card {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-height: 44px;
    padding: 16px 18px;
    border-radius: 12px;
    background: rgba(9, 24, 28, 0.44);
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: #fff;
    text-decoration: none;
    backdrop-filter: blur(8px);
    transition: transform 0.2s ease, background 0.2s ease;
    box-sizing: border-box;
}

.hero-path-card:hover {
    transform: translateY(-2px);
    background: rgba(9, 24, 28, 0.56);
}

.hero-path-card span {
    color: rgba(255, 255, 255, 0.94);
    font-size: 0.92rem;
    font-weight: 700;
}

.hero-path-card strong {
    color: #fff;
    font-size: 1.02rem;
    line-height: 1.3;
}

.hero-community-card {
    margin-top: 22px;
    max-width: 760px;
    padding: 22px 24px;
    border-radius: 24px;
    background: rgba(9, 24, 28, 0.48);
    border: 1px solid rgba(255, 255, 255, 0.16);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.16);
    backdrop-filter: blur(10px);
}

.hero-community-kicker {
    display: inline-flex;
    align-items: center;
    padding: 7px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
    color: #dffaf7;
    font-size: 0.92rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.hero-community-card h2 {
    margin: 14px 0 10px;
    font-size: 1.65rem;
    line-height: 1.2;
    color: #fff;
}

.hero-community-card p {
    margin: 0;
    color: rgba(255, 255, 255, 0.92);
    line-height: 1.65;
    max-width: 680px;
}

.hero-community-points {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
}

.hero-community-points span {
    display: inline-flex;
    align-items: center;
    padding: 10px 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    font-weight: 700;
}

.hero-community-cta {
    margin-top: 18px;
    padding: 14px 16px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.14);
}

.hero-community-cta strong {
    display: block;
    margin-bottom: 6px;
    color: #fff;
}

.hero-community-cta span {
    color: rgba(255, 255, 255, 0.92);
    line-height: 1.55;
}

.hero-signup-reasons {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.hero-signup-reasons strong {
    display: block;
    margin-bottom: 10px;
    color: #fff;
}

.hero-signup-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.hero-signup-grid span {
    display: inline-flex;
    align-items: center;
    min-height: 48px;
    padding: 10px 12px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.94);
    font-weight: 600;
}

/* CARTES DE L'ANNUAIRE ET BLOG */
.home-community-section {
    width: min(1380px, 90%);
    margin: -26px auto 18px;
    padding: 30px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(340px, 0.8fr);
    gap: 28px;
    align-items: center;
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(47, 79, 79, 0.08);
    box-shadow: 0 22px 50px rgba(32, 57, 70, 0.1);
    position: relative;
    z-index: 5;
    box-sizing: border-box;
}

.home-community-copy h2 {
    margin: 12px 0 12px;
    max-width: 760px;
    font-size: 2rem;
    line-height: 1.16;
    color: var(--dark);
}

.home-community-copy p {
    margin: 0;
    max-width: 760px;
    color: #536873;
    line-height: 1.7;
    font-size: 1.03rem;
}

.home-community-actions {
    display: flex;
    align-items: center;
    gap: 14px 18px;
    flex-wrap: wrap;
    margin-top: 20px;
}

.home-community-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.home-community-item {
    min-height: 112px;
    padding: 18px;
    border-radius: 14px;
    background: #f5fbfb;
    border: 1px solid rgba(47, 79, 79, 0.08);
    box-sizing: border-box;
}

.home-community-item--facebook {
    text-decoration: none;
    background: #eef4fe;
    border-color: rgba(24, 119, 242, 0.18);
    transition: background 0.15s, transform 0.15s;
    display: flex;
    flex-direction: column;
}

.home-community-item--facebook:hover {
    background: #deeafd;
    transform: translateY(-2px);
}

.home-community-item--facebook strong {
    color: #1877f2;
}

.home-community-item strong {
    display: block;
    margin-bottom: 8px;
    color: var(--dark);
    font-size: 1.04rem;
}

.home-community-item span {
    color: #60717c;
    line-height: 1.55;
}

.home-members-section {
    padding: 24px 5% 8px;
}

.home-member-grid {
    max-width: 1380px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.home-member-card {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(47, 79, 79, 0.08);
    box-shadow: 0 14px 32px rgba(32, 57, 70, 0.07);
    text-decoration: none;
    color: var(--dark);
    transition: transform 0.22s ease, box-shadow 0.22s ease;
}

.home-member-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 36px rgba(32, 57, 70, 0.12);
}

.home-member-card-preview {
    cursor: default;
}

.home-member-card-preview:hover {
    transform: none;
    box-shadow: 0 14px 32px rgba(32, 57, 70, 0.07);
}

.home-member-avatar {
    width: 54px;
    height: 54px;
    flex: 0 0 54px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-radius: 50%;
    background: linear-gradient(135deg, #e7f5f0, #f9ead9);
    color: #2f6f5b;
    font-weight: 800;
    font-size: 1.35rem;
}

.home-member-avatar-blurred {
    filter: blur(6px);
    opacity: 0.78;
    transform: scale(0.96);
}

.home-member-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home-member-copy {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.home-member-copy strong,
.home-member-copy span,
.home-member-copy small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-member-copy strong {
    color: var(--dark);
    font-size: 1rem;
}

.home-member-copy span {
    color: #2f6f5b;
    font-weight: 700;
    font-size: 0.88rem;
}

.home-member-copy small {
    color: #60717c;
    font-size: 0.86rem;
}

.home-featured-section {
    padding: 42px 5% 12px;
}

.features {
    display: flex;
    justify-content: center;
    gap: 30px;
    padding: 10px 0 24px;
    margin: 0 auto;
    flex-wrap: wrap;
    max-width: 1380px;
}

.home-directory-section {
    padding: 28px 5% 10px;
}

.home-section-heading {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 24px;
    margin: 0 auto 22px;
    max-width: 1380px;
}

.home-section-heading h2 {
    margin: 10px 0 8px;
    font-size: 2rem;
}

.home-section-heading p {
    margin: 0;
    max-width: 760px;
    line-height: 1.6;
    color: #5b677a;
}

.home-section-link {
    color: var(--dark);
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    min-height: 44px;
}

.home-section-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px 18px;
    flex-wrap: wrap;
}

.home-classifieds-cta {
    max-width: 1380px;
    margin: 0 auto 6px;
}

.home-classifieds-cta-text {
    margin: 0;
    max-width: 760px;
    line-height: 1.6;
    color: #5b677a;
}

.home-classifieds-cta-link {
    color: var(--orange);
    font-weight: 700;
    text-decoration: none;
}

.home-classifieds-cta-link:hover {
    text-decoration: underline;
}

.home-directory-grid {
    max-width: 1380px;
    margin: 0 auto;
}

.home-link-grid {
    max-width: 1380px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.home-link-card {
    background: #fff;
    border-radius: 22px;
    padding: 24px 24px 22px;
    text-decoration: none;
    color: var(--dark);
    box-shadow: 0 15px 35px rgba(0,0,0,0.06);
    border: 1px solid rgba(47, 79, 79, 0.06);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.home-link-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 38px rgba(0,0,0,0.1);
}

.home-link-card strong {
    display: block;
    margin-bottom: 8px;
    font-size: 1.1rem;
}

.home-link-card span {
    color: #60717c;
    line-height: 1.55;
}
.blog-page,
.article-page {
    padding: 36px 5% 80px;
}

.blog-hero,
.article-card {
    max-width: 1180px;
    margin: 0 auto 28px;
    background: rgba(255, 255, 255, 0.94);
    border-radius: 28px;
    box-shadow: 0 18px 40px rgba(32, 57, 70, 0.08);
}

.blog-hero {
    padding: 34px 36px;
    background:
        radial-gradient(circle at top right, rgba(64, 224, 208, 0.18), transparent 34%),
        linear-gradient(140deg, rgba(255,255,255,0.98), rgba(242,250,251,0.94));
}

.blog-hero h1,
.article-header h1 {
    margin: 10px 0 12px;
    font-size: 3rem;
    line-height: 1.08;
}

.blog-hero p,
.article-intro,
.article-meta {
    color: #5b677a;
}

.blog-grid {
    max-width: 1180px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.blog-grid-home {
    max-width: 1380px;
}

.blog-card {
    background: rgba(255, 255, 255, 0.96);
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 16px 36px rgba(32, 57, 70, 0.08);
    border: 1px solid rgba(47, 79, 79, 0.06);
}

.blog-card-hero {
    min-height: 160px;
    padding: 28px 24px 22px;
    background:
        radial-gradient(circle at top right, rgba(64, 224, 208, 0.22), transparent 34%),
        linear-gradient(135deg, rgba(233, 255, 251, 0.95), rgba(242, 250, 251, 0.92));
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 18px;
}

.blog-card-illustration {
    display: block;
    width: 100%;
    max-height: 156px;
    object-fit: contain;
    object-position: center;
    filter: drop-shadow(0 16px 22px rgba(35, 65, 63, 0.12));
}

.blog-card-emoji {
    font-size: 2.4rem;
}

.blog-card-label {
    display: inline-flex;
    align-self: flex-start;
    padding: 8px 12px;
    border-radius: 999px;
    background: rgba(21, 125, 112, 0.12);
    color: #157d70;
    font-weight: 700;
}

.blog-card-body {
    padding: 24px;
}

.blog-card-meta {
    margin: 0 0 10px;
    color: #6b7f89;
    font-size: 0.9rem;
    font-weight: 700;
}

.blog-card h2,
.blog-card h3 {
    margin: 0 0 12px;
    font-size: 1.35rem;
    line-height: 1.28;
}

.blog-card h2 a,
.blog-card h3 a {
    color: var(--dark);
    text-decoration: none;
}

.blog-card-body p {
    color: #60717c;
    line-height: 1.65;
}

.article-card {
    padding: 0;
    overflow: hidden;
}

.article-header {
    position: relative;
    padding-bottom: 18px;
    border-bottom: 1px solid #edf2f3;
}

.article-hero-emoji {
    font-size: 3rem;
    margin: 18px 0 6px;
}

.article-hero-visual {
    position: relative;
    min-height: 460px;
    background: #deebe7;
    overflow: hidden;
}

.article-hero-illustration {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 460px;
    object-fit: cover;
    object-position: center;
}

.article-hero-scrim {
    position: absolute;
    inset: auto 0 0 0;
    height: 44%;
    background: linear-gradient(180deg, rgba(17, 31, 35, 0) 0%, rgba(17, 31, 35, 0.14) 34%, rgba(17, 31, 35, 0.54) 100%);
    pointer-events: none;
}

.article-header-copy {
    position: relative;
    z-index: 1;
    margin: -78px 36px 0;
    padding: 28px 30px 30px;
    border-radius: 30px 30px 0 0;
    background: linear-gradient(180deg, rgba(252, 255, 254, 0.985), rgba(245, 251, 250, 0.965));
    box-shadow: 0 -1px 0 rgba(255, 255, 255, 0.32), 0 24px 40px rgba(17, 36, 40, 0.12);
}

.article-meta {
    margin: 0 0 16px;
    font-weight: 700;
    font-size: 0.98rem;
    letter-spacing: 0.01em;
}

.article-intro {
    margin: 0;
    max-width: 980px;
    font-size: 1.12rem;
    line-height: 1.8;
}

.article-content {
    padding: 28px 36px 0;
}

.article-section + .article-section {
    margin-top: 28px;
}

.article-section h2 {
    margin: 0 0 14px;
    font-size: 1.55rem;
    line-height: 1.18;
}

.article-section p {
    margin: 0 0 14px;
    color: #405660;
    font-size: 1.02rem;
    line-height: 1.9;
}

.article-footer {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    padding: 20px 36px 34px;
}

.share-panel {
    margin: 10px 36px 0;
    padding: 20px 22px;
    border-radius: 22px;
    background: #f7fbfc;
    border: 1px solid rgba(55, 90, 98, 0.1);
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: center;
    flex-wrap: wrap;
}

.share-panel-compact {
    margin: 16px 0 0;
    padding: 14px 0 0;
    border: 0;
    border-top: 1px solid rgba(55, 90, 98, 0.14);
    border-radius: 0;
    background: transparent;
    justify-content: flex-start;
    align-items: center;
    gap: 14px;
}

.share-panel-copy {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.share-panel-copy strong {
    color: #29414a;
    font-size: 1rem;
}

.share-panel-copy span {
    color: #5d7680;
    font-size: 0.95rem;
}

.share-panel-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.share-panel-compact .share-panel-copy span {
    display: none;
}

.share-panel-compact .share-panel-copy strong {
    font-size: 0.96rem;
}

.share-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 14px;
    border-radius: 999px;
    background: #eef5f7;
    border: 1px solid rgba(70, 108, 117, 0.12);
    color: #35525c;
    font-weight: 700;
    font-size: 0.92rem;
    text-decoration: none;
    cursor: pointer;
    transition: transform 0.18s ease, background 0.18s ease, border-color 0.18s ease;
}

.share-button-icon {
    width: 44px;
    height: 44px;
    padding: 0;
    border-radius: 999px;
}

.share-button-icon svg {
    width: 20px;
    height: 20px;
    display: block;
}

.share-button:hover {
    background: #e4eef1;
    border-color: rgba(70, 108, 117, 0.2);
    transform: translateY(-1px);
}

.share-button-copy.is-copied {
    background: rgba(85, 190, 178, 0.16);
    border-color: rgba(85, 190, 178, 0.42);
    color: #1f6d57;
}

.share-button-copy {
    appearance: none;
    -webkit-appearance: none;
}

.seo-hub-hero .seo-hub-paragraph {
    max-width: 980px;
    margin: 12px 0 0;
    color: #5b677a;
    line-height: 1.72;
}

.seo-hub-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 22px;
}

.seo-hub-related-links {
    max-width: 1380px;
    margin: 0 auto;
}

.seo-hub-section {
    padding-top: 0;
}

.seo-hub-facts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: 24px 0 0;
}

.seo-hub-fact {
    padding: 16px;
    border: 1px solid rgba(70, 108, 117, 0.14);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.74);
}

.seo-hub-fact dt {
    margin: 0 0 6px;
    font-size: 0.82rem;
    font-weight: 800;
    color: #6a7688;
    text-transform: uppercase;
    letter-spacing: 0;
}

.seo-hub-fact dd {
    margin: 0;
    color: #294b4d;
    font-weight: 900;
    line-height: 1.35;
}

.seo-hub-choice-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 420px));
    justify-content: center;
    gap: 16px;
    max-width: 1380px;
    margin: 0 auto;
}

.seo-hub-choice-card {
    display: flex;
    min-height: 210px;
    flex-direction: column;
    gap: 10px;
    padding: 22px;
    border: 1px solid rgba(70, 108, 117, 0.14);
    border-radius: 24px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(244, 250, 249, 0.96));
    color: #294b4d;
    text-decoration: none;
    box-shadow: 0 16px 34px rgba(24, 56, 64, 0.08);
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.seo-hub-choice-card:hover {
    transform: translateY(-4px);
    border-color: rgba(210, 91, 51, 0.24);
    box-shadow: 0 20px 42px rgba(24, 56, 64, 0.12);
}

.seo-hub-choice-label {
    align-self: flex-start;
    padding: 7px 10px;
    border-radius: 999px;
    background: rgba(85, 190, 178, 0.12);
    color: #1f6d57;
    font-size: 0.8rem;
    font-weight: 900;
}

.seo-hub-choice-card strong {
    color: #213c3f;
    font-size: 1.15rem;
    line-height: 1.2;
}

.seo-hub-choice-card small {
    color: #5f7983;
    font-weight: 800;
    line-height: 1.35;
}

.seo-hub-choice-card p {
    margin: auto 0 0;
    color: #5b677a;
    line-height: 1.58;
}

.seo-hub-map-panel {
    max-width: 1380px;
    margin-top: 0;
}

.seo-hub-map-panel .directory-map {
    height: min(52vh, 520px);
}

.seo-hub-faq-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    max-width: 1380px;
    margin: 0 auto;
}

.seo-hub-faq-item {
    padding: 22px;
    border: 1px solid rgba(70, 108, 117, 0.14);
    border-radius: 22px;
    background: #ffffff;
    box-shadow: 0 14px 32px rgba(24, 56, 64, 0.08);
}

.seo-hub-faq-item h3 {
    margin: 0 0 10px;
    color: #294b4d;
    font-size: 1.08rem;
}

.seo-hub-faq-item p {
    margin: 0;
    color: #5b677a;
    line-height: 1.68;
}
.card {
    background: white;
    padding: 40px 30px;
    border-radius: 25px;
    text-align: center;
    box-shadow: 0 15px 35px rgba(0,0,0,0.08);
    transition: transform 0.3s, box-shadow 0.3s;
    width: 320px;
}

.card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0,0,0,0.12);
}

.card-entierement-cliquable {
    display: block;
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}

.card-entierement-cliquable:focus-visible {
    outline: 3px solid rgba(239, 134, 84, 0.65);
    outline-offset: 4px;
}

body.site-theme-night .card,
body.site-theme-night .login-card,
body.site-theme-night .directory-hero,
body.site-theme-night .directory-filters-card,
body.site-theme-night .directory-stat-card,
body.site-theme-night .camping-showcase-copy,
body.site-theme-night .camping-showcase-media,
body.site-theme-night .camping-section-card,
body.site-theme-night .camping-side-card,
body.site-theme-night .search-container {
    background: rgba(23, 39, 44, 0.92);
    border: 1px solid rgba(110, 154, 152, 0.14);
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.28);
}

body.site-theme-night .directory-page,
body.site-theme-night .camping-page,
body.site-theme-night .login-page {
    color: #deecea;
}

body.site-theme-night .card-title,
body.site-theme-night .card-title-link,
body.site-theme-night .directory-hero-copy h1,
body.site-theme-night .camping-showcase-copy h1,
body.site-theme-night .camping-section-card h2,
body.site-theme-night .camping-faq-item h3,
body.site-theme-night .login-card h1,
body.site-theme-night .field-label {
    color: #eef8f7;
}

body.site-theme-night .card-meta,
body.site-theme-night .card-rating,
body.site-theme-night .card-description,
body.site-theme-night .directory-hero-copy p,
body.site-theme-night .directory-results-bar,
body.site-theme-night .camping-hero-location,
body.site-theme-night .camping-hero-meta-line,
body.site-theme-night .camping-story,
body.site-theme-night .camping-detail-card p,
body.site-theme-night .camping-highlights-list,
body.site-theme-night .camping-breadcrumbs,
body.site-theme-night .camping-back-link,
body.site-theme-night .camping-faq-item p,
body.site-theme-night .share-panel-copy span,
body.site-theme-night .login-card p,
body.site-theme-night .form-switch-text,
body.site-theme-night .auth-helper-links,
body.site-theme-night .link-button {
    color: #b9cfcd;
}

body.site-theme-night .card-distance {
    background: rgba(85, 190, 178, 0.14);
    color: #8fe7dc;
}

body.site-theme-night .checkbox-label {
    color: #eef8f7;
}

body.site-theme-night .camping-faq-item,
body.site-theme-night .camping-fact,
body.site-theme-night .camping-detail-card,
body.site-theme-night .camping-location-card,
body.site-theme-night .share-panel {
    background: rgba(14, 27, 31, 0.7);
}

body.site-theme-night .camping-hero-summary,
body.site-theme-night .camping-action-bar,
body.site-theme-night .fiche-meteo-widget {
    background: rgba(14, 27, 31, 0.78);
    border-color: rgba(110, 154, 152, 0.18);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

body.site-theme-night .camping-hero-summary li {
    color: #d5e7e4;
}

body.site-theme-night .camping-summary-label,
body.site-theme-night .fiche-meteo-loading,
body.site-theme-night .fiche-meteo-error {
    color: #8fb7b2;
}

body.site-theme-night .fiche-meteo-current {
    border-bottom-color: rgba(110, 154, 152, 0.18);
}

body.site-theme-night .fiche-meteo-now-temp,
body.site-theme-night .fiche-meteo-day-temps,
body.site-theme-night .fiche-meteo-day-temps strong {
    color: #eef8f7;
}

body.site-theme-night .fiche-meteo-now-wind,
body.site-theme-night .fiche-meteo-day {
    background: rgba(255, 255, 255, 0.08);
    color: #d5e7e4;
}

body.site-theme-night .fiche-meteo-day:hover {
    background: rgba(255, 255, 255, 0.12);
}

body.site-theme-night .fiche-meteo-day-label {
    color: #9ad7cc;
}

body.site-theme-night .fiche-meteo-day-min,
body.site-theme-night .fiche-meteo-day-rain,
body.site-theme-night .fiche-meteo-source,
body.site-theme-night .fiche-meteo-source a {
    color: #8fb7b2;
}

body.site-theme-night .camping-location-card {
    border-color: rgba(110, 154, 152, 0.18);
}

body.site-theme-night .camping-action-bar-copy strong {
    color: #eef8f7;
}

body.site-theme-night .camping-action-bar-copy span {
    color: #b9cfcd;
}

body.site-theme-night .camping-member-card,
body.site-theme-night .camping-rating-panel-compact,
body.site-theme-night .camping-propose-card {
    background: rgba(14, 27, 31, 0.78);
    border-color: rgba(110, 154, 152, 0.18);
}

body.site-theme-night .camping-favorite-star {
    background: rgba(19, 35, 40, 0.94);
    border-color: rgba(117, 165, 163, 0.24);
    color: #8fb7b2;
}

body.site-theme-night .camping-favorite-star.is-active {
    background: rgba(255, 190, 82, 0.14);
    border-color: rgba(255, 190, 82, 0.42);
    color: #ffc55f;
}

body.site-theme-night .camping-member-card-copy,
body.site-theme-night .camping-rating-title,
body.site-theme-night .camping-propose-card strong {
    color: #d5e7e4;
}

body.site-theme-night .camping-rating-help,
body.site-theme-night .camping-rating-hint,
body.site-theme-night .camping-rating-inline-label,
body.site-theme-night .camping-propose-card span {
    color: #8fb7b2;
}

body.site-theme-night .camping-member-card-label {
    color: #8fb7b2;
}

body.site-theme-night .camping-rating-star-label {
    color: #49666a;
}

body.site-theme-night .camping-rating-star-label:hover,
body.site-theme-night .camping-rating-star-label:hover ~ .camping-rating-star-label,
body.site-theme-night .camping-rating-star-input:checked ~ .camping-rating-star-label {
    color: #ffc55f;
}

body.site-theme-night .camping-review-card {
    background: rgba(14, 27, 31, 0.78);
    border-color: rgba(110, 154, 152, 0.18);
}

body.site-theme-night .camping-review-card strong,
body.site-theme-night .camping-review-text,
body.site-theme-night .camping-reviews-summary {
    color: #d5e7e4;
}

body.site-theme-night .camping-review-meta,
body.site-theme-night .camping-review-date {
    color: #8fb7b2;
}

body.site-theme-night .camping-review-rating {
    background: rgba(85, 190, 178, 0.14);
    color: #eef8f7;
}

body.site-theme-night .camping-location-card-head strong {
    color: #eef8f7;
}

body.site-theme-night .camping-location-card-head span {
    color: #b9cfcd;
}

body.site-theme-night .camping-location-map {
    border-color: rgba(110, 154, 152, 0.18);
}

body.site-theme-night .share-panel-copy strong,
body.site-theme-night .share-button {
    color: #eef8f7;
}

body.site-theme-night .share-button {
    background: rgba(23, 39, 44, 0.88);
    border-color: rgba(110, 154, 152, 0.18);
}

body.site-theme-night .share-button:hover {
    background: rgba(33, 54, 60, 0.96);
}

body.site-theme-night .directory-filters input,
body.site-theme-night .directory-filters select,
body.site-theme-night .login-input,
body.site-theme-night .camping-review-textarea,
body.site-theme-night .rating-select {
    background: rgba(11, 21, 24, 0.84);
    color: #eef8f7;
    border-color: rgba(117, 165, 163, 0.22);
}

body.site-theme-night .directory-check span,
body.site-theme-night .directory-filter-label,
body.site-theme-night .directory-theme-pill span,
body.site-theme-night .directory-reset-link,
body.site-theme-night .directory-advanced-summary,
body.site-theme-night .directory-advanced-summary strong,
body.site-theme-night .directory-advanced-summary small,
body.site-theme-night .home-section-heading p,
body.site-theme-night .home-classifieds-cta-text,
body.site-theme-night .home-link-card span,
body.site-theme-night .home-member-copy small {
    color: #dceceb;
}

body.site-theme-night .home-link-card,
body.site-theme-night .home-member-card {
    background: rgba(23, 39, 44, 0.92);
    border-color: rgba(110, 154, 152, 0.14);
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.28);
    color: #eef8f7;
}

body.site-theme-night .home-member-copy strong {
    color: #eef8f7;
}

body.site-theme-night .home-member-copy span {
    color: #a7e0d0;
}

body.site-theme-night .home-member-avatar {
    background: linear-gradient(135deg, rgba(55, 110, 97, 0.8), rgba(136, 101, 65, 0.72));
    color: #eef8f7;
}

body.site-theme-night .home-community-section {
    background: rgba(23, 39, 44, 0.94);
    border-color: rgba(110, 154, 152, 0.14);
    box-shadow: 0 22px 50px rgba(0, 0, 0, 0.28);
}

body.site-theme-night .home-community-copy h2,
body.site-theme-night .home-community-item strong {
    color: #eef8f7;
}

body.site-theme-night .home-community-copy p,
body.site-theme-night .home-community-item span {
    color: #dceceb;
}

body.site-theme-night .home-community-item {
    background: rgba(14, 27, 31, 0.64);
    border-color: rgba(110, 154, 152, 0.14);
}

body.site-theme-night .home-section-link {
    color: #eef8f7;
}

body.site-theme-night .blog-hero,
body.site-theme-night .blog-card,
body.site-theme-night .article-card {
    background: rgba(23, 39, 44, 0.92);
    border: 1px solid rgba(110, 154, 152, 0.14);
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.28);
}

body.site-theme-night .blog-hero {
    background:
        radial-gradient(circle at top right, rgba(69, 155, 148, 0.14), transparent 34%),
        linear-gradient(140deg, rgba(23, 39, 44, 0.96), rgba(19, 33, 37, 0.92));
}

body.site-theme-night .blog-hero h1,
body.site-theme-night .article-header h1,
body.site-theme-night .blog-card h2 a,
body.site-theme-night .blog-card h3 a,
body.site-theme-night .article-section h2 {
    color: #eef8f7;
}

body.site-theme-night .blog-hero p,
body.site-theme-night .blog-card-meta,
body.site-theme-night .blog-card-body p,
body.site-theme-night .article-meta,
body.site-theme-night .article-intro,
body.site-theme-night .article-section p,
body.site-theme-night .seo-hub-hero .seo-hub-paragraph {
    color: #c7d8d6;
}

body.site-theme-night .seo-hub-fact,
body.site-theme-night .seo-hub-choice-card,
body.site-theme-night .seo-hub-faq-item {
    background: rgba(14, 27, 31, 0.72);
    border-color: rgba(110, 154, 152, 0.16);
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.24);
}

body.site-theme-night .seo-hub-fact dt,
body.site-theme-night .seo-hub-choice-card p,
body.site-theme-night .seo-hub-choice-card small,
body.site-theme-night .seo-hub-faq-item p {
    color: #c7d8d6;
}

body.site-theme-night .seo-hub-fact dd,
body.site-theme-night .seo-hub-choice-card strong,
body.site-theme-night .seo-hub-faq-item h3 {
    color: #eef8f7;
}

body.site-theme-night .seo-hub-choice-label {
    background: rgba(85, 190, 178, 0.14);
    color: #8fe7dc;
}

body.site-theme-night .blog-card-hero {
    background:
        radial-gradient(circle at top right, rgba(69, 155, 148, 0.16), transparent 34%),
        linear-gradient(135deg, rgba(29, 50, 55, 0.95), rgba(24, 41, 46, 0.92));
}

body.site-theme-night .blog-card-label {
    background: rgba(85, 190, 178, 0.14);
    color: #8fe7dc;
}

body.site-theme-night .article-header {
    border-bottom-color: rgba(123, 170, 168, 0.16);
}

body.site-theme-night .article-header-copy {
    background: linear-gradient(180deg, rgba(21, 34, 38, 0.96), rgba(20, 32, 36, 0.985));
    box-shadow: 0 -1px 0 rgba(255, 255, 255, 0.04), 0 26px 44px rgba(0, 0, 0, 0.24);
}

.card h3 {
    color: var(--turquoise);
    margin-top: 20px;
    font-size: 1.5rem;
}

.icon {
    font-size: 50px;
}

.home-cta-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 14px;
}

.home-cta-card p {
    margin: 0;
    color: #60717c;
    line-height: 1.6;
}

.home-cta-links {
    display: flex;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 6px;
}

body.site-theme-night .home-cta-card p {
    color: #dceceb;
}

.card-image-wrapper {
    position: relative;
    width: 100%;
    height: 180px;
    overflow: hidden;
    border-radius: 15px;
    margin-bottom: 15px;
}

.card-image {
    width: 100%;
    height: 100%;
    object-position: center;
}

.card-image--cover {
    object-fit: cover;
}

.card-image--contain {
    object-fit: contain;
    background: #f5f7f4;
}

.card-image--fallback {
    background:
        radial-gradient(circle at top right, rgba(241, 217, 154, 0.2), transparent 28%),
        linear-gradient(135deg, #edf2ea 0%, #eef4f1 52%, #e4f0ef 100%);
    padding: 16px;
}

.card-image-placeholder {
    width: 100%;
    height: 100%;
    background:
        radial-gradient(circle at top right, rgba(241, 217, 154, 0.28), transparent 28%),
        linear-gradient(135deg, #edf2ea 0%, #eef4f1 52%, #e4f0ef 100%);
}

.card-title {
    margin: 10px 0;
}

.card-meta {
    color: var(--turquoise);
    font-weight: bold;
    margin-bottom: 5px;
}

.card-distance {
    display: inline-flex;
    align-items: center;
    margin: 8px 0 0;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(85, 190, 178, 0.12);
    color: #1f6d57;
    font-size: 0.84rem;
    font-weight: 900;
    line-height: 1.2;
}

.card-rating {
    margin: 12px 0;
    color: #5b677a;
    font-size: 0.92rem;
}

.card-rating strong {
    color: var(--dark);
}

.card-description {
    font-size: 0.9rem;
    color: #666;
    margin: 15px 0;
    min-height: 45px;
}

.card-services {
    display: flex;
    gap: 10px;
    justify-content: center;
    margin-bottom: 15px;
    font-size: 1.2rem;
}

.card-footer {
    border-top: 1px solid #eee;
    margin-top: 15px;
    padding-top: 15px;
}

.card-updated {
    margin: 0 0 10px;
    color: #718287;
    font-size: 0.82rem;
}

.content-page {
    width: min(920px, calc(100% - 32px));
    margin: 0 auto;
    padding: 36px 0 12px;
}

.content-card {
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(222, 232, 232, 0.96);
    border-radius: 28px;
    padding: 32px;
    box-shadow: 0 26px 50px rgba(31, 58, 60, 0.08);
}

.content-card h1 {
    margin-top: 0;
    margin-bottom: 12px;
}

.content-intro {
    color: #617277;
    font-size: 1.02rem;
    line-height: 1.7;
    margin-bottom: 24px;
}

.content-section + .content-section {
    margin-top: 26px;
    padding-top: 26px;
    border-top: 1px solid #edf2f1;
}

.content-section h2 {
    margin: 0 0 10px;
}

.content-section p,
.content-section li {
    color: #44565b;
    line-height: 1.75;
}

.content-section ul {
    padding-left: 20px;
    margin: 12px 0 0;
}

.contact-form {
    display: grid;
    gap: 12px;
}

.contact-textarea {
    min-height: 180px;
    resize: vertical;
}

.contact-honeypot {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

body.site-theme-night .content-card {
    background: rgba(20, 34, 39, 0.9);
    border-color: rgba(102, 145, 145, 0.18);
    box-shadow: 0 28px 52px rgba(0, 0, 0, 0.28);
}

body.site-theme-night .content-intro,
body.site-theme-night .content-section p,
body.site-theme-night .content-section li {
    color: #d8e7e4;
}

body.site-theme-night .content-section + .content-section {
    border-top-color: rgba(102, 145, 145, 0.16);
}

.community-public-main {
    width: min(1280px, calc(100% - 32px));
    margin: 0 auto;
    padding: 42px 0 8px;
}

.community-public-hero,
.community-public-cta {
    border-radius: 28px;
    background:
        radial-gradient(circle at top right, rgba(64, 224, 208, 0.12), transparent 36%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(245, 251, 251, 0.96));
    border: 1px solid rgba(47, 79, 79, 0.08);
    box-shadow: 0 26px 56px rgba(31, 58, 60, 0.1);
}

.community-public-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(280px, 0.7fr);
    gap: 28px;
    align-items: stretch;
    padding: 42px;
}

.community-public-hero h1,
.community-public-cta h2 {
    margin: 12px 0 14px;
    color: var(--dark);
    line-height: 1.08;
}

.community-public-hero h1 {
    max-width: 820px;
    font-size: clamp(2.2rem, 5vw, 4.7rem);
}

.community-public-hero p,
.community-public-side span,
.community-public-cta p,
.community-feature-card p {
    color: #536873;
    line-height: 1.7;
}

.community-public-hero p {
    max-width: 760px;
    font-size: 1.08rem;
}

.community-public-actions {
    display: flex;
    align-items: center;
    gap: 14px 18px;
    flex-wrap: wrap;
    margin-top: 24px;
}

.community-public-side {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    min-height: 240px;
    padding: 24px;
    border-radius: 22px;
    background: rgba(47, 79, 79, 0.08);
}

.community-public-side strong {
    margin-bottom: 10px;
    color: var(--dark);
    font-size: 1.3rem;
}

.community-public-section {
    margin-top: 46px;
}

.community-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.community-feature-card {
    min-height: 150px;
    padding: 22px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(47, 79, 79, 0.08);
    box-shadow: 0 18px 38px rgba(31, 58, 60, 0.07);
}

.community-feature-card p {
    margin: 0;
    font-weight: 600;
}

.community-public-cta {
    margin-top: 48px;
    padding: 32px;
    text-align: center;
}

.community-public-cta p {
    max-width: 720px;
    margin: 0 auto 22px;
}

body.site-theme-night .community-public-hero,
body.site-theme-night .community-public-cta,
body.site-theme-night .community-feature-card {
    background: rgba(23, 39, 44, 0.92);
    border-color: rgba(110, 154, 152, 0.14);
    box-shadow: 0 22px 50px rgba(0, 0, 0, 0.28);
}

body.site-theme-night .community-public-hero h1,
body.site-theme-night .community-public-side strong,
body.site-theme-night .community-public-cta h2 {
    color: #eef8f7;
}

body.site-theme-night .community-public-hero p,
body.site-theme-night .community-public-side span,
body.site-theme-night .community-public-cta p,
body.site-theme-night .community-feature-card p {
    color: #dceceb;
}

body.site-theme-night .community-public-side {
    background: rgba(14, 27, 31, 0.64);
}

.card-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
}

.card-action-group {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}

.rating-form {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.rating-select {
    border: 1px solid #c8d2e1;
    border-radius: 999px;
    padding: 8px 12px;
    background: white;
    color: var(--dark);
    font-size: 0.85rem;
}

.card-price {
    font-weight: bold;
    color: var(--dark);
}

.card-button,
.coming-soon-link {
    color: var(--orange);
    font-weight: bold;
    text-decoration: none;
}

.card-button {
    background: var(--orange);
    color: white;
    padding: 8px 15px;
    border-radius: 8px;
    font-size: 0.8rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
}

.favorite-button {
    border: 1px solid #ffd1c3;
    background: #fff7f3;
    color: #d4663f;
    border-radius: 999px;
    padding: 9px 14px;
    font-size: 0.8rem;
    font-weight: bold;
    cursor: pointer;
    text-decoration: none;
    min-height: 44px;
}

.favorite-button.is-active {
    background: var(--orange);
    color: white;
    border-color: var(--orange);
}

.center-cta {
    text-align: center;
    margin: 40px 0;
}

.btn-link {
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
}

.page-intro {
    padding: 50px 5%;
    text-align: center;
}

.search-result-text {
    margin-top: 20px;
    color: #666;
}

.member-promo-text {
    margin-top: 18px;
    color: #5b677a;
}

.member-promo-text a,
.form-switch-text a {
    color: var(--orange);
    font-weight: bold;
    text-decoration: none;
}

.features-listing {
    margin-top: 0;
}
.directory-page {
    padding: 36px 5% 80px;
}

.directory-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(280px, 0.9fr);
    gap: 24px;
    align-items: stretch;
    margin-bottom: 24px;
}

.directory-hero-copy,
.directory-filters-card,
.directory-empty-state {
    background: rgba(255, 255, 255, 0.92);
    border-radius: 28px;
    box-shadow: 0 18px 40px rgba(32, 57, 70, 0.08);
}

.directory-hero-copy {
    padding: 34px 36px;
    background:
        radial-gradient(circle at top right, rgba(64, 224, 208, 0.18), transparent 34%),
        linear-gradient(140deg, rgba(255,255,255,0.98), rgba(242,250,251,0.94));
}

.directory-badge {
    display: inline-flex;
    align-items: center;
    padding: 8px 14px;
    border-radius: 999px;
    background: #e9fffb;
    color: #157d70;
    font-weight: 700;
    margin-bottom: 14px;
}

.directory-hero-copy h1 {
    margin: 0 0 14px;
    font-size: 3rem;
    line-height: 1.05;
}

.directory-hero-copy p {
    margin: 0;
    max-width: 780px;
    color: #56707a;
    font-size: 1.05rem;
    line-height: 1.7;
}

.directory-hero-actions {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    margin-top: 22px;
}

.directory-hero-link {
    color: #35535d;
    font-weight: 800;
    text-decoration: none;
}

.directory-hero-link:hover {
    color: #d4663f;
}

.directory-hero-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.directory-stat-card {
    background: linear-gradient(180deg, rgba(255,255,255,0.94), rgba(240,248,249,0.95));
    border-radius: 24px;
    padding: 28px 20px;
    box-shadow: 0 14px 34px rgba(32, 57, 70, 0.07);
}

.directory-stat-card strong {
    display: block;
    font-size: 2rem;
    line-height: 1;
    margin-bottom: 10px;
}

.directory-stat-card span {
    color: #637984;
    font-weight: 600;
}

.directory-map-panel {
    width: 100%;
    max-width: 1180px;
    margin: 18px auto 0;
    background: rgba(255, 255, 255, 0.92);
    border-radius: 28px;
    box-shadow: 0 18px 40px rgba(32, 57, 70, 0.08);
    padding: 22px;
    scroll-margin-top: 120px;
}

.directory-map-panel.seo-hub-map-panel {
    max-width: 1380px;
    margin-top: 0;
}

.directory-map-panel:focus {
    outline: none;
}

.directory-map-head {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: flex-start;
    margin-bottom: 16px;
}

.directory-map-head strong {
    display: block;
    margin-bottom: 6px;
    font-size: 1.05rem;
}

.directory-map-head p,
.directory-map-count {
    margin: 0;
    color: #5f7582;
}

.directory-map-tools {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 14px;
}

.directory-map-filter {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 1px solid #d8e5e3;
    background: #ffffff;
    color: #334a4f;
    border-radius: 999px;
    padding: 8px 12px;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

.directory-map-filter strong {
    color: #5f7582;
    font-size: 0.9rem;
}

.directory-map-filter.is-active {
    border-color: #2f8f6f;
    background: #e9f8f2;
    color: #25484a;
}

.directory-map-filter:disabled {
    cursor: not-allowed;
    opacity: 0.5;
}

.directory-map-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 2px solid #ffffff;
    box-shadow: 0 0 0 1px rgba(51, 74, 79, 0.22);
}

.directory-map-dot-all {
    background: linear-gradient(90deg, #2f8f6f 0 50%, #f0c443 50% 100%);
}

.directory-map-dot-place {
    background: #2f8f6f;
}

.directory-map-dot-beach {
    background: #f0c443;
}

.directory-map {
    height: min(54vh, 480px);
    min-height: 380px;
    border-radius: 22px;
    overflow: hidden;
    border: 1px solid #e5edec;
}

.directory-map-status,
.directory-map-empty {
    margin: 12px 0 0;
    color: #5f7582;
}

.directory-map-popup {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 180px;
}

.directory-map-popup strong {
    font-size: 0.98rem;
}

.directory-map-popup span,
.directory-map-popup small {
    color: #5f7582;
}

.directory-map-popup a {
    margin-top: 4px;
    color: #d4663f;
    font-weight: 700;
    text-decoration: none;
}

.directory-map-popup a:hover {
    text-decoration: underline;
}

.directory-filters-card {
    padding: 28px;
    margin-bottom: 28px;
}

.directory-filters {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.directory-search-main {
    display: grid;
    grid-template-columns: minmax(0, 1.8fr) minmax(220px, 0.9fr) auto;
    gap: 16px;
    align-items: end;
}

.directory-search-field,
.directory-filter-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.directory-search-field label,
.directory-filter-field label {
    font-size: 0.9rem;
    font-weight: 700;
    color: #58717b;
}

.directory-search-field input,
.directory-filter-field select {
    border: 1px solid #dbe7ea;
    background: #fdfefe;
    border-radius: 16px;
    padding: 14px 16px;
    font-size: 0.98rem;
    color: var(--dark);
    outline: none;
}

.directory-search-field input:focus,
.directory-filter-field select:focus {
    border-color: rgba(64, 224, 208, 0.9);
    box-shadow: 0 0 0 4px rgba(64, 224, 208, 0.12);
}

.directory-search-field-main input {
    font-size: 1rem;
    padding-block: 16px;
}

.directory-submit-field {
    display: flex;
    align-items: flex-end;
}

.directory-submit-field .btn-search {
    min-height: 52px;
    padding-inline: 24px;
}

.directory-quick-filters {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.directory-filter-label {
    font-size: 0.9rem;
    font-weight: 700;
    color: #58717b;
}

.directory-theme-options {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.directory-theme-pill,
.directory-check {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-radius: 999px;
    background: #f7fbfc;
    border: 1px solid #dfe9ed;
    color: #35535d;
    font-weight: 600;
    transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, color 0.18s ease;
}

.directory-theme-pill:hover,
.directory-check:hover {
    background: #ffffff;
    border-color: #c8dde2;
}

.directory-theme-pill:has(input:checked),
.directory-check:has(input:checked) {
    background: rgba(64, 224, 208, 0.12);
    border-color: rgba(64, 224, 208, 0.48);
    color: #1b6562;
    box-shadow: 0 12px 22px rgba(64, 224, 208, 0.12);
}

.directory-theme-pill input,
.directory-check input {
    margin: 0;
    accent-color: #ef8654;
}

.directory-advanced-filters {
    margin: 2px 0 0;
    border: 1px solid #e7eff1;
    border-radius: 20px;
    background: linear-gradient(180deg, rgba(250, 253, 253, 0.92), rgba(245, 250, 250, 0.96));
}

.directory-advanced-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    cursor: pointer;
    list-style: none;
    font-weight: 700;
    color: #38555f;
}

.directory-advanced-summary::-webkit-details-marker {
    display: none;
}

.directory-advanced-summary strong,
.directory-advanced-summary small {
    color: #6a7c84;
    font-weight: 700;
}

.directory-advanced-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    padding: 0 16px 16px;
}

.directory-reset-link {
    color: #6f7d87;
    text-decoration: none;
    font-weight: 700;
}

.directory-results-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid #edf2f3;
    flex-wrap: wrap;
}

.directory-results-count {
    display: flex;
    align-items: baseline;
    gap: 10px;
}

.directory-results-bar strong {
    font-size: 1.4rem;
}

.directory-results-bar span {
    color: #637984;
}

.directory-reset-link-inline {
    margin-left: auto;
}

.directory-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}

.directory-grid .card {
    width: auto;
    padding: 0;
    overflow: hidden;
    border-radius: 28px;
    text-align: left;
    box-shadow: 0 18px 40px rgba(32, 57, 70, 0.09);
}

.directory-grid .card:hover {
    transform: translateY(-6px);
}

.directory-grid .card-image-wrapper {
    position: relative;
    height: 250px;
    margin-bottom: 0;
    border-radius: 28px 28px 0 0;
}

.card-image-overlay {
    position: absolute;
    inset: 18px 18px auto 18px;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.card-image-link,
.card-title-link {
    color: inherit;
    text-decoration: none;
}

.card-image-link {
    display: block;
    height: 100%;
}

.card-overlay-pill {
    display: inline-flex;
    align-items: center;
    padding: 8px 12px;
    border-radius: 999px;
    background: rgba(19, 34, 40, 0.68);
    color: white;
    font-size: 0.78rem;
    font-weight: 700;
    backdrop-filter: blur(10px);
}

.directory-grid .card-head,
.directory-grid .card-rating,
.directory-grid .card-location,
.directory-grid .card-description,
.directory-grid .card-services,
.directory-grid .card-footer {
    padding-left: 24px;
    padding-right: 24px;
}

.directory-grid .card-head {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
    padding-top: 22px;
}

.directory-grid .card-title {
    margin: 0 0 8px;
    font-size: 1.5rem;
    color: var(--dark);
}

.directory-grid .card-meta {
    margin: 0;
    color: #5f7983;
}

.directory-grid .card-rating {
    margin: 14px 0 0;
}

.directory-grid .card-location {
    margin-bottom: 0;
}

.directory-grid .card-map-link {
    color: #5d6770;
}

body.site-theme-night .directory-hero-copy,
body.site-theme-night .directory-filters-card,
body.site-theme-night .directory-map-panel,
body.site-theme-night .directory-empty-state,
body.site-theme-night .directory-stat-card,
body.site-theme-night .directory-grid .card {
    background: rgba(23, 39, 44, 0.92);
    border: 1px solid rgba(110, 154, 152, 0.14);
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.28);
}

body.site-theme-night .directory-hero-copy {
    background:
        radial-gradient(circle at top right, rgba(69, 155, 148, 0.14), transparent 34%),
        linear-gradient(140deg, rgba(23, 39, 44, 0.96), rgba(19, 33, 37, 0.92));
}

body.site-theme-night .directory-badge {
    background: rgba(85, 190, 178, 0.14);
    color: #8fe7dc;
}

body.site-theme-night .directory-stat-card strong,
body.site-theme-night .directory-results-bar strong,
body.site-theme-night .directory-grid .card-title,
body.site-theme-night .directory-grid .card-title-link {
    color: #eef8f7;
}

body.site-theme-night .directory-stat-card span,
body.site-theme-night .directory-map-head p,
body.site-theme-night .directory-map-count,
body.site-theme-night .directory-map-status,
body.site-theme-night .directory-map-empty,
body.site-theme-night .directory-grid .card-meta,
body.site-theme-night .directory-grid .card-rating,
body.site-theme-night .directory-grid .card-description,
body.site-theme-night .card-updated,
body.site-theme-night .member-promo-text,
body.site-theme-night .directory-empty-state p {
    color: #b9cfcd;
}

body.site-theme-night .directory-map {
    border-color: rgba(110, 154, 152, 0.14);
}

body.site-theme-night .directory-map-filter {
    background: rgba(236, 246, 246, 0.08);
    border-color: rgba(123, 170, 168, 0.18);
    color: #e6f2f1;
}

body.site-theme-night .directory-map-filter strong {
    color: #b9cfcd;
}

body.site-theme-night .directory-map-filter.is-active {
    background: rgba(85, 190, 178, 0.14);
    border-color: rgba(85, 190, 178, 0.42);
    color: #f0fffc;
}

body.site-theme-night .directory-check,
body.site-theme-night .directory-theme-pill {
    background: rgba(236, 246, 246, 0.08);
    border-color: rgba(123, 170, 168, 0.18);
    color: #e6f2f1;
}

body.site-theme-night .directory-theme-pill:has(input:checked),
body.site-theme-night .directory-check:has(input:checked) {
    background: rgba(85, 190, 178, 0.16);
    border-color: rgba(115, 219, 208, 0.28);
    color: #f0fbfa;
}

body.site-theme-night .directory-advanced-filters {
    background: linear-gradient(180deg, rgba(18, 31, 35, 0.9), rgba(13, 24, 27, 0.92));
    border-color: rgba(110, 154, 152, 0.14);
}

body.site-theme-night .directory-grid .card-footer,
body.site-theme-night .directory-results-bar {
    border-top-color: rgba(123, 170, 168, 0.16);
}

.directory-grid .card-description {
    min-height: auto;
    line-height: 1.65;
}

.directory-grid .card-services {
    margin-bottom: 0;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.card-service-badge {
    display: inline-flex;
    align-items: center;
    padding: 8px 12px;
    border-radius: 999px;
    background: #f3faf9;
    color: #2f5d67;
    font-size: 0.8rem;
    font-weight: 700;
}

.card-themes {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    padding: 6px 24px 0;
}

.card-theme-badge {
    display: inline-flex;
    align-items: center;
    padding: 7px 11px;
    border-radius: 999px;
    background: #eef6ff;
    color: #305b86;
    font-size: 0.76rem;
    font-weight: 700;
}

.directory-grid .card-footer {
    margin-top: 18px;
    padding-top: 18px;
    padding-bottom: 24px;
}

.directory-grid .card-sans-actions {
    padding-bottom: 24px;
}

.directory-grid .card-actions {
    align-items: flex-start;
}

.directory-grid .card-action-group {
    justify-content: flex-start;
}

.directory-empty-state {
    padding: 52px 28px;
    text-align: center;
}

.directory-empty-state h2 {
    margin: 0 0 12px;
}

.directory-empty-state p {
    margin: 0 0 24px;
    color: #5f7983;
}

.directory-load-more {
    display: flex;
    justify-content: center;
    gap: 12px;
    padding: 8px 0 4px;
}

.directory-load-more[hidden] {
    display: none;
}

.directory-load-more .card-button:disabled {
    cursor: progress;
    opacity: 0.72;
}

.directory-load-more.has-error .card-button {
    background: #ffe9e2;
    color: #92422d;
}

html.directory-js-enabled .directory-pagination[data-directory-pagination] {
    display: none;
}

.directory-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin: 26px 0 12px;
}

.directory-page-link,
.directory-page-gap {
    min-width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid #dbe8ea;
    background: #ffffff;
    color: #38555f;
    font-weight: 800;
    text-decoration: none;
}

.directory-page-link:hover {
    border-color: #91c7c1;
    color: #1f6f6a;
}

.directory-page-link.is-current {
    background: #315f68;
    border-color: #315f68;
    color: #ffffff;
}

.directory-page-link.is-disabled {
    color: #9aa9ae;
    pointer-events: none;
}

.directory-page-gap {
    border-color: transparent;
    background: transparent;
    color: #8b9ba1;
    min-width: 24px;
    padding: 0 4px;
}

body.site-theme-night .directory-page-link,
body.site-theme-night .directory-page-gap {
    background: rgba(236, 246, 246, 0.08);
    border-color: rgba(123, 170, 168, 0.18);
    color: #e6f2f1;
}

body.site-theme-night .directory-page-link.is-current {
    background: rgba(85, 190, 178, 0.22);
    border-color: rgba(115, 219, 208, 0.36);
    color: #f0fffc;
}

body.site-theme-night .directory-page-link.is-disabled,
body.site-theme-night .directory-page-gap {
    color: #88a19f;
}
.camping-page {
    padding: 30px 5% 80px;
}

.camping-breadcrumbs {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 18px;
    color: #71818a;
    font-size: 0.92rem;
}

.camping-breadcrumbs a {
    color: #5f7983;
    text-decoration: none;
}

.camping-showcase {
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(380px, 1fr);
    gap: 24px;
    align-items: start;
    margin-bottom: 28px;
}

.camping-showcase-no-media {
    grid-template-columns: 1fr;
}

.camping-showcase-media,
.camping-showcase-copy,
.camping-section-card {
    background: rgba(255, 255, 255, 0.94);
    border-radius: 28px;
    box-shadow: 0 18px 40px rgba(32, 57, 70, 0.08);
    min-width: 0; /* empêche les enfants de grille de dépasser */
}

.camping-showcase-media {
    overflow: hidden;
    min-height: 0;
    height: clamp(520px, 68vh, 720px);
    position: sticky;
    top: 24px;
}

.camping-hero-image {
    width: 100%;
    height: 100%;
    max-width: 100%;
    display: block;
    object-position: center;
}

.camping-hero-image--cover {
    object-fit: cover;
}

.camping-hero-image--contain {
    object-fit: contain;
    background: #f5f7f4;
}

.camping-hero-image--fallback {
    box-sizing: border-box;
    padding: 34px;
    background:
        radial-gradient(circle at top right, rgba(241, 217, 154, 0.2), transparent 28%),
        linear-gradient(135deg, #edf2ea 0%, #eef4f1 52%, #e4f0ef 100%);
}

.camping-showcase-pills {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin: 0 0 18px;
}

.camping-inline-pill {
    display: inline-flex;
    align-items: center;
    padding: 8px 12px;
    border-radius: 999px;
    background: #eef5f7;
    color: #35535d;
    font-size: 0.8rem;
    font-weight: 700;
}

.camping-inline-pill-link {
    text-decoration: none;
    color: #2f6f5b;
    background: #edf7f1;
}

.camping-inline-pill-link:hover {
    color: #214f40;
    background: #dff1e7;
}

.camping-showcase-copy {
    padding: 32px;
}

.camping-showcase-topline {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 18px;
    align-items: center;
}

.camping-back-link {
    color: #5d7883;
    text-decoration: none;
    font-weight: 700;
    justify-self: end;
}

.share-inline {
    display: flex;
    align-items: center;
    justify-content: center;
}

.share-inline-label {
    color: #607983;
    font-size: 0.84rem;
    font-weight: 700;
}

.share-inline .share-panel-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    justify-content: center;
    flex-wrap: nowrap;
}

.share-inline .share-button-icon {
    width: 32px;
    height: 32px;
}

.share-inline .share-button-icon svg {
    width: 14px;
    height: 14px;
}

.camping-showcase-copy h1 {
    margin: 14px 0 8px;
    font-size: clamp(2.15rem, 3vw, 2.55rem);
    line-height: 1.08;
    letter-spacing: 0;
}

@media (max-width: 920px) {
    .camping-showcase-topline {
        grid-template-columns: 1fr;
        justify-items: start;
    }

    .camping-back-link {
        justify-self: start;
    }

    .share-inline {
        justify-content: flex-start;
    }

    .share-inline .share-panel-actions {
        flex-wrap: wrap;
        justify-content: flex-start;
    }
}

@media (max-width: 768px) {
    .camping-page {
        padding: 18px 4% 80px;
    }

    .camping-showcase-copy h1 {
        font-size: 1.9rem;
    }

    .camping-action-bar-controls {
        grid-template-columns: 1fr;
        flex: 1 1 auto;
    }

    .camping-photo-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    /* Carte : remplacer aspect-ratio par une hauteur fixe pour éviter
       que min-height force une largeur > viewport */
    .camping-location-map {
        aspect-ratio: unset;
        min-height: unset;
        height: 300px;
        width: 100%;
    }

    /* Sécurité images et conteneurs */
    .camping-page img,
    .camping-section-card,
    .camping-showcase-media,
    .camping-showcase-copy {
        max-width: 100%;
    }

    .camping-showcase-media,
    .camping-showcase-copy {
        min-width: 0;
    }
}

.camping-hero-meta-line {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    margin: 0 0 16px;
    color: #5f7983;
    font-weight: 600;
}

.camping-hero-meta-line span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.camping-hero-location {
    margin: 0 0 14px;
    color: #58717b;
    font-size: 1.02rem;
    font-weight: 600;
}

.camping-summary-label {
    display: block;
    margin-bottom: 8px;
    color: #627983;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.camping-theme-row {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.camping-hero-summary {
    margin: 4px 0 20px;
    padding: 18px 20px;
    border: 1px solid #e3edef;
    border-radius: 20px;
    background: #f7fbfc;
}

.camping-hero-summary ul {
    display: grid;
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.camping-hero-summary li {
    position: relative;
    padding-left: 22px;
    color: #425c66;
    line-height: 1.5;
}

.camping-hero-summary li::before {
    content: "";
    position: absolute;
    top: 0.68em;
    left: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #ff7a4f;
}

.camping-action-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    padding: 16px 18px;
    margin: 0 0 22px;
    border-radius: 22px;
    background: #f5fafb;
    border: 1px solid #e3edef;
}

.camping-action-bar-member {
    display: block;
    padding: 18px;
}

.camping-action-bar-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.camping-action-bar-copy {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.camping-action-bar-copy strong {
    font-size: 1rem;
}

.camping-action-bar-copy span {
    color: #647d87;
    font-size: 0.9rem;
}

.camping-action-bar-controls {
    display: grid;
    grid-template-columns: minmax(220px, 260px) minmax(0, 1fr);
    align-items: stretch;
    gap: 16px;
    flex: 1 1 700px;
}

.camping-favorite-star-form {
    flex: 0 0 auto;
    margin: 0;
}

.camping-favorite-star {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border: 1px solid #ffd1c3;
    border-radius: 50%;
    background: #fff7f3;
    color: #d86e48;
    font-size: 1.8rem;
    line-height: 1;
    cursor: pointer;
    transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.camping-favorite-star:hover {
    transform: translateY(-1px);
    background: #ffe8de;
}

.camping-favorite-star.is-active {
    background: #fffbeb;
    color: #f5a623;
    border-color: #ffd46f;
}

.camping-propose-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    padding: 16px 18px;
    margin: 0 0 20px;
    border-radius: 22px;
    background: #fff7f3;
    border: 1px solid #ffd1c3;
}

.camping-propose-card div {
    display: flex;
    flex-direction: column;
    gap: 4px;
    max-width: 620px;
}

.camping-propose-card strong {
    color: #30515b;
}

.camping-propose-card span {
    color: #647d87;
    font-size: 0.9rem;
    line-height: 1.5;
}

.camping-member-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 12px;
    padding: 18px;
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid #e3edef;
}

.camping-member-card-label {
    color: #607983;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.camping-member-card-copy {
    margin: 0;
    color: #4f6771;
    line-height: 1.6;
    font-size: 0.95rem;
}

.camping-location-card {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-top: 8px;
    padding: 18px;
    border-radius: 22px;
    background: #f7fbfc;
    border: 1px solid #e3edef;
}

.camping-location-card-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.camping-location-card-head strong {
    color: #29414a;
    font-size: 1rem;
}

.camping-location-card-head span {
    color: #607983;
    font-size: 0.9rem;
    font-weight: 600;
}

.camping-location-map {
    aspect-ratio: 1 / 1;
    min-height: 520px;
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid #dce8eb;
}

.camping-resource-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.card-button-secondary {
    background: #eff5f7;
    color: #30515b;
}

.camping-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, 0.75fr);
    gap: 24px;
}

.camping-layout-single {
    grid-template-columns: minmax(0, 1fr);
}

.camping-main,
.camping-sidebar {
    display: flex;
    flex-direction: column;
    gap: 24px;
    min-width: 0;
}

.camping-section-card {
    padding: 28px;
}

.camping-section-card h2 {
    margin: 0 0 18px;
    font-size: 1.5rem;
}

.camping-story {
    color: #425c66;
    line-height: 1.8;
    font-size: 1.02rem;
}

.camping-story p + p {
    margin-top: 16px;
}

.camping-highlights-list {
    margin: 0;
    padding-left: 22px;
    color: #425c66;
    line-height: 1.8;
}

.camping-highlights-list li + li {
    margin-top: 10px;
}

.camping-search-tags {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 10px;
}

.camping-search-card {
    padding: 20px 24px;
    opacity: 0.78;
}

.camping-search-card h2 {
    margin-bottom: 12px;
    font-size: 1rem;
    color: #607983;
}

.camping-search-tag {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border-radius: 999px;
    background: #eef5f7;
    color: #44616b;
    font-size: 0.78rem;
    font-weight: 600;
}

.camping-facts-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.camping-fact {
    padding: 18px;
    border-radius: 18px;
    background: #f7fbfc;
}

.camping-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.camping-detail-card {
    padding: 18px;
    border-radius: 18px;
    background: #f7fbfc;
}

.camping-detail-card p {
    margin: 0;
    color: #425c66;
    line-height: 1.7;
}

.camping-fact-label {
    display: block;
    margin-bottom: 8px;
    color: #607983;
    font-size: 0.84rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.camping-service-row {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 18px;
}

.camping-official-link {
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.camping-official-link:hover {
    background: #e4f3f0;
    color: #244e55;
    transform: translateY(-1px);
}

.camping-section-head {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    margin-bottom: 18px;
}

.camping-section-intro {
    max-width: 760px;
    margin: -6px 0 18px;
    color: #5f737c;
    line-height: 1.65;
}

.camping-link-group {
    display: grid;
    gap: 10px;
    margin-top: 16px;
}

.camping-link-group-label {
    color: #627983;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.camping-selection-links {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.camping-faq-list {
    display: grid;
    gap: 16px;
}

.camping-faq-item {
    padding: 18px 20px;
    border-radius: 18px;
    background: #f7fbfc;
}

.camping-faq-item h3 {
    margin: 0 0 10px;
    font-size: 1.05rem;
    color: #29414a;
}

.camping-faq-item p {
    margin: 0;
    color: #4a626b;
    line-height: 1.75;
}

.camping-similar-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.camping-similar-grid .card {
    width: auto;
    padding: 0;
    overflow: hidden;
    border-radius: 20px;
    text-align: left;
    box-shadow: 0 12px 26px rgba(32, 57, 70, 0.08);
}

.camping-similar-grid .card-image-wrapper {
    height: 150px;
    margin-bottom: 0;
    border-radius: 20px 20px 0 0;
}

.camping-similar-grid .card-head,
.camping-similar-grid .card-rating,
.camping-similar-grid .card-location,
.camping-similar-grid .card-description,
.camping-similar-grid .card-services,
.camping-similar-grid .card-themes,
.camping-similar-grid .card-footer {
    padding-left: 16px;
    padding-right: 16px;
}

.camping-similar-grid .card-head {
    padding-top: 14px;
}

.camping-similar-grid .card-title {
    font-size: 1.08rem;
    margin-bottom: 6px;
}

.camping-similar-grid .card-meta,
.camping-similar-grid .card-rating,
.camping-similar-grid .card-location,
.camping-similar-grid .card-description,
.camping-similar-grid .card-phone {
    font-size: 0.84rem;
}

.camping-similar-grid .card-description {
    line-height: 1.5;
}

.camping-similar-grid .card-services {
    justify-content: flex-start;
}

.camping-similar-grid .card-footer {
    margin-top: 12px;
    padding-top: 14px;
    padding-bottom: 16px;
}

.camping-similar-grid .card-button,
.camping-similar-grid .favorite-button,
.camping-similar-grid .rating-select {
    font-size: 0.75rem;
}

.camping-inline-form,
.camping-rating-panel {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.camping-inline-form-compact,
.camping-rating-panel-compact {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    margin: 0;
}

.camping-rating-panel-compact {
    flex: 1 1 420px;
    align-items: stretch;
    padding: 18px;
    border-radius: 22px;
    background: #ffffff;
    border: 1px solid #dfe9ec;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

.camping-rating-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
    flex-wrap: wrap;
}

.camping-rating-copy {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.camping-rating-title {
    color: #35535d;
    font-weight: 700;
    font-size: 1.1rem;
}

.camping-rating-help,
.camping-rating-hint,
.camping-rating-inline-label {
    color: #647d87;
    font-size: 0.92rem;
}

.camping-rating-inline-label {
    font-weight: 600;
}

.camping-rating-row {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
}

.camping-rating-stars {
    position: relative;
    display: inline-flex;
    flex-direction: row-reverse;
    gap: 3px;
}

.camping-rating-star-input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.camping-rating-star-label {
    color: #c7d7da;
    cursor: pointer;
    font-size: 1.6rem;
    line-height: 1;
    transition: color 0.18s ease, transform 0.18s ease;
}

.camping-rating-star-label:hover,
.camping-rating-star-label:hover ~ .camping-rating-star-label,
.camping-rating-star-input:checked ~ .camping-rating-star-label {
    color: #f5a623;
}

.camping-rating-star-label:hover {
    transform: translateY(-1px);
}

.camping-rating-star-input:focus-visible + .camping-rating-star-label {
    outline: 3px solid rgba(255, 118, 77, 0.28);
    outline-offset: 3px;
    border-radius: 6px;
}

.camping-review-textarea {
    width: 100%;
    min-height: 120px;
    resize: vertical;
    border-radius: 16px;
    padding: 14px 16px;
    border: 1px solid #dfe9ec;
    background: #f9fcfd;
    color: #35535d;
    font: inherit;
    line-height: 1.6;
}

.camping-review-textarea:focus {
    outline: none;
    border-color: rgba(255, 118, 77, 0.55);
    box-shadow: 0 0 0 4px rgba(255, 118, 77, 0.12);
}

.camping-rating-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-top: 14px;
    flex-wrap: wrap;
}

.camping-rating-panel-compact .card-button {
    border: 0;
    cursor: pointer;
}

.camping-reviews-summary {
    color: #607983;
    font-weight: 700;
}

.camping-reviews-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.camping-review-card {
    padding: 18px 20px;
    border-radius: 20px;
    background: #f7fbfc;
    border: 1px solid #e7f0f2;
}

.camping-review-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 10px;
}

.camping-review-meta,
.camping-review-date {
    display: block;
    color: #69818b;
    font-size: 0.9rem;
    margin-top: 4px;
}

.camping-review-side {
    text-align: right;
}

.camping-review-rating {
    display: inline-block;
    padding: 6px 10px;
    border-radius: 999px;
    background: #ecf6f7;
    color: #2d5966;
    font-weight: 700;
}

.camping-review-text {
    margin: 0;
    color: #415b65;
    line-height: 1.7;
}

.camping-empty-text {
    margin: 0;
    color: #5f7983;
    line-height: 1.7;
}

.camping-sidebar-text {
    margin: 0;
    color: #5f7983;
    line-height: 1.6;
    font-size: 0.94rem;
}

.camping-photo-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.camping-photo-card {
    margin: 0;
    overflow: hidden;
    border-radius: 20px;
    background: #f7fbfc;
    border: 1px solid #e7f0f2;
}

.camping-photo-image {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
}

.camping-photo-caption {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12px 14px;
    color: #5b727b;
    font-size: 0.9rem;
}

.camping-photo-caption strong {
    color: #2f4b55;
}

.camping-photo-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 22px;
    padding-top: 22px;
    border-top: 1px solid #e7f0f2;
}

.camping-photo-form h3 {
    margin: 0;
    font-size: 1.1rem;
}

/* Bloc événements sur fiche lieu */
.fiche-events-list {
    display: grid;
    gap: 10px;
    margin-bottom: 14px;
}

.fiche-event-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 12px 14px;
    border: 1px solid rgba(42, 76, 78, 0.12);
    border-radius: 14px;
    background: rgba(239, 247, 246, 0.6);
}

.fiche-event-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.fiche-event-title {
    font-size: 0.95rem;
    color: var(--dark);
}

.fiche-event-title a {
    color: inherit;
    text-decoration: none;
}

.fiche-event-title a:hover {
    text-decoration: underline;
}

.fiche-event-meta {
    font-size: 0.82rem;
    color: #5b677a;
}

.fiche-events-more {
    margin: 0;
}

/* ── Widget météo ─────────────────────────────────────────────────── */

.fiche-meteo-widget {
    background: linear-gradient(135deg, #e6f3f8 0%, #eaf6f2 55%, #e2f0ec 100%);
    border-radius: 20px;
    padding: 22px 24px 16px;
    overflow: hidden;
}

.fiche-meteo-loading,
.fiche-meteo-error {
    color: #5f7983;
    font-size: 0.92rem;
    margin: 0;
}

/* Conditions actuelles */
.fiche-meteo-current {
    display: flex;
    align-items: center;
    gap: 16px;
    padding-bottom: 18px;
    margin-bottom: 16px;
    border-bottom: 1px solid rgba(50, 120, 100, 0.14);
}

.fiche-meteo-now-icon {
    font-size: 3rem;
    line-height: 1;
    flex-shrink: 0;
}

.fiche-meteo-now-body {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.fiche-meteo-now-temp {
    font-size: 2.4rem;
    font-weight: 700;
    color: #1a3a2f;
    line-height: 1;
}

.fiche-meteo-now-wind {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: rgba(255, 255, 255, 0.65);
    border-radius: 999px;
    padding: 3px 11px;
    font-size: 0.8rem;
    color: #3a5a4f;
    font-weight: 600;
    width: fit-content;
}

/* Prévisions 4 jours */
.fiche-meteo-days {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}

.fiche-meteo-day {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    background: rgba(255, 255, 255, 0.68);
    border-radius: 14px;
    padding: 12px 8px;
    text-align: center;
    transition: background 0.15s ease;
}

.fiche-meteo-day:hover {
    background: rgba(255, 255, 255, 0.88);
}

.fiche-meteo-day-label {
    font-size: 0.72rem;
    font-weight: 700;
    color: #3a5a4f;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.fiche-meteo-day-icon {
    font-size: 1.6rem;
    line-height: 1;
}

.fiche-meteo-day-temps {
    font-size: 0.88rem;
    color: #1a3a2f;
    font-weight: 600;
}

.fiche-meteo-day-temps strong {
    font-size: 1rem;
}

.fiche-meteo-day-min {
    color: #6a8a7f;
    font-weight: 400;
}

.fiche-meteo-day-rain {
    font-size: 0.75rem;
    color: #4a7a8a;
}

/* Source */
.fiche-meteo-source {
    margin: 14px 0 0;
    font-size: 0.72rem;
    color: #6a8a7f;
    text-align: right;
}

.fiche-meteo-source a {
    color: #2f6f5b;
    text-decoration: none;
}

.fiche-meteo-source a:hover {
    text-decoration: underline;
}

@media (max-width: 480px) {
    .fiche-meteo-widget {
        padding: 18px 16px 12px;
    }
    .fiche-meteo-days {
        grid-template-columns: repeat(2, 1fr);
    }
    .fiche-meteo-now-temp {
        font-size: 2rem;
    }
}
.member-page {
    padding: 48px 5% 80px;
}

.member-hero {
    max-width: 760px;
    margin: 0 auto;
    background: white;
    border-radius: 28px;
    padding: 40px;
    box-shadow: 0 15px 35px rgba(0,0,0,0.08);
    text-align: center;
}

.member-badge {
    display: inline-block;
    margin: 0 0 12px;
    padding: 8px 14px;
    border-radius: 999px;
    background: #ecfff8;
    color: #156a4d;
    font-weight: bold;
}

.member-actions {
    display: flex;
    justify-content: center;
    gap: 16px;
    margin-top: 28px;
    flex-wrap: wrap;
}
.member-tabs {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 24px;
}

.member-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 11px 16px;
    border-radius: 999px;
    background: white;
    color: #5b677a;
    text-decoration: none;
    font-weight: 700;
    box-shadow: 0 12px 28px rgba(0,0,0,0.06);
}

.member-tab.is-active {
    background: var(--orange);
    color: white;
}

.community-hero {
    background: white;
    border-radius: 28px;
    box-shadow: 0 15px 35px rgba(0,0,0,0.08);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px 28px;
    margin-bottom: 28px;
    padding: 22px 28px;
    flex-wrap: wrap;
}

.community-hero-copy h1 {
    margin: 0 0 6px;
}

.community-hero-copy p {
    margin: 0;
    color: #5b677a;
}

.community-hero-actions {
    display: flex;
    align-items: center;
    gap: 10px 12px;
    flex-wrap: wrap;
    margin-top: 16px;
}

.community-hero-actions .mini-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.community-hero-stats {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    flex-wrap: wrap;
    color: #5b677a;
    font-size: 0.95rem;
}

.community-hero-stats span {
    background: var(--bg-light);
    border-radius: 999px;
    padding: 10px 14px;
    white-space: nowrap;
}

.community-hero-stats strong {
    color: var(--dark);
    margin-right: 4px;
}

.community-layout {
    display: grid;
    grid-template-columns: minmax(280px, 320px) minmax(0, 1fr);
    gap: 24px;
    align-items: start;
    max-width: 1080px;
    margin-left: auto;
    margin-right: auto;
}

.community-layout--messages-full {
    grid-template-columns: 1fr;
    max-width: 660px;
}

.community-layout--messages-full .community-sidebar {
    display: none;
}

.community-sidebar,
.community-main,
.community-feed {
    display: flex;
    flex-direction: column;
    gap: 24px;
    min-width: 0;
}

@media (max-width: 720px) {
    .community-layout {
        grid-template-columns: 1fr;
    }
    .community-sidebar {
        order: 2;
    }
    .community-main,
    .community-feed {
        order: 1;
    }
}

.community-card {
    background: white;
    border-radius: 24px;
    box-shadow: 0 15px 35px rgba(0,0,0,0.08);
    padding: 28px;
}

.blog-page .community-card {
    max-width: 1180px;
    margin-left: auto;
    margin-right: auto;
}

.flash-with-action {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.onboarding-card {
    margin-bottom: 16px;
    padding: 14px 20px;
}

.onboarding-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.onboarding-head > div:first-child {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.onboarding-head h2 {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
}

.onboarding-head p {
    margin: 0;
    color: #5b677a;
    line-height: 1.55;
}

.onboarding-score {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    border-radius: 12px;
    background: #f3faf9;
    color: var(--dark);
    min-width: auto;
}

.onboarding-score strong {
    font-size: 1.05rem;
    line-height: 1;
}

.onboarding-score span {
    margin-top: 0;
    color: #5b677a;
    font-size: 0.82rem;
    font-weight: 700;
}

.onboarding-head-right {
    display: flex;
    align-items: center;
    gap: 12px;
}

.onboarding-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: 1px solid #d1e0df;
    border-radius: 50%;
    background: #f3faf9;
    color: #5b8a7a;
    font-size: 0.75rem;
    cursor: pointer;
    transition: background 0.15s ease;
    flex-shrink: 0;
}

.onboarding-toggle:hover {
    background: #e2f0ee;
}

.onboarding-progress {
    height: 10px;
    margin: 22px 0 18px;
    overflow: hidden;
    border-radius: 999px;
    background: #e5eff0;
}

.onboarding-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--turquoise), var(--orange));
}

.onboarding-next {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 16px;
    padding: 14px 16px;
    border-radius: 18px;
    background: #fff7ec;
    color: #5d4a35;
}

.onboarding-next span {
    font-weight: 800;
}

.onboarding-list {
    display: grid;
    gap: 0;
}

.onboarding-step {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: 14px 0;
    border-top: 1px solid #eef2f7;
}

.onboarding-step:first-child {
    border-top: none;
}

.onboarding-step-marker {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #edf6f5;
    color: #2f6870;
    font-weight: 900;
}

.onboarding-step.is-done .onboarding-step-marker {
    background: rgba(64, 224, 208, 0.2);
    color: #1e796e;
}

.onboarding-step-copy {
    display: grid;
    gap: 4px;
}

.onboarding-step-copy strong {
    color: var(--dark);
}

.onboarding-step-copy small {
    color: #5b677a;
    line-height: 1.45;
}

.onboarding-step-link,
.onboarding-step-status {
    font-weight: 800;
    white-space: nowrap;
}

.onboarding-step-link {
    color: var(--orange);
    text-decoration: none;
}

.onboarding-step-status {
    color: #2f887e;
}

.section-heading {
    margin-bottom: 18px;
}

.section-heading h2,
.section-heading h3 {
    margin: 0 0 8px;
}

.section-heading p {
    margin: 0;
    color: #5b677a;
    line-height: 1.5;
}

.section-heading-feed {
    padding: 0 6px;
}

.member-proposal-list {
    display: grid;
    gap: 12px;
}

.member-proposal-item {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    padding: 16px;
    border: 1px solid rgba(42, 76, 78, 0.12);
    border-radius: 16px;
    background: rgba(239, 247, 246, 0.7);
}

.member-proposal-item p {
    margin: 6px 0 0;
    color: #5b677a;
}

.member-proposal-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.member-proposal-form-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 18px;
}

.member-proposal-photo-preview {
    margin-top: 10px;
}

.member-proposal-photo-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
    gap: 10px;
    margin-top: 10px;
}

.member-proposal-photo-choice {
    position: relative;
}

.member-proposal-photo-delete-checkbox {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.member-proposal-photo-thumb {
    margin: 0;
    padding: 8px;
    border: 1px solid rgba(42, 76, 78, 0.12);
    border-radius: 14px;
    background: rgba(239, 247, 246, 0.72);
    transition: opacity 0.2s ease, filter 0.2s ease;
}

.member-proposal-photo-thumb img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: 10px;
}

.member-proposal-photo-thumb.is-main {
    max-width: 190px;
}

.member-proposal-photo-thumb figcaption {
    margin-top: 7px;
    color: #5b677a;
    font-size: 0.78rem;
    font-weight: 800;
}

.member-proposal-photo-delete {
    position: absolute;
    top: -7px;
    right: -7px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #ff764d;
    color: white;
    cursor: pointer;
    font-size: 1.1rem;
    font-weight: 900;
    line-height: 1;
    box-shadow: 0 8px 18px rgba(0,0,0,0.16);
}

.member-proposal-photo-delete-checkbox:checked + .member-proposal-photo-thumb {
    opacity: 0.38;
    filter: grayscale(1);
}

.member-proposal-photo-delete-checkbox:checked ~ .member-proposal-photo-delete {
    background: #8f2f3f;
}

.proposal-status {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 8px 12px;
    background: #e8eef3;
    color: var(--dark);
    font-size: 0.88rem;
    font-weight: 800;
}

.proposal-status-published,
.proposal-status-manager {
    background: rgba(77, 153, 132, 0.16);
    color: #2a6c5f;
}

.proposal-status-refused,
.proposal-status-hidden {
    background: rgba(161, 59, 73, 0.14);
    color: #8f2f3f;
}

/* Badges catégorie événement */
.event-category {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 3px 10px;
    background: #eef2f7;
    color: #5b677a;
    font-size: 0.78rem;
    font-weight: 700;
    white-space: nowrap;
    text-decoration: none;
}

a.event-category:hover {
    filter: brightness(0.92);
}

.event-category--rassemblement { background: rgba(64, 224, 208, 0.15); color: #1e796e; }
.event-category--journee-plage  { background: rgba(255, 180, 60, 0.18); color: #7a4e10; }
.event-category--porte-ouverte  { background: rgba(100, 149, 237, 0.2); color: #2a4a8f; }
.event-category--sortie-club    { background: rgba(147, 112, 219, 0.2); color: #5a2d82; }
.event-category--spectacle      { background: rgba(220, 80, 120, 0.15); color: #8b2040; }

.event-extra-dates {
    display: inline-block;
    color: #5b677a;
    font-size: 0.88rem;
}
.event-extra-dates::before {
    content: ' · ';
}

/* Navigation catégorie sur /agenda */
.event-category-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 24px;
}

.event-cat-tab {
    display: inline-flex;
    align-items: center;
    padding: 7px 14px;
    border-radius: 999px;
    background: white;
    color: #5b677a;
    text-decoration: none;
    font-size: 0.88rem;
    font-weight: 700;
    box-shadow: 0 4px 12px rgba(0,0,0,0.06);
    transition: background 0.15s ease, color 0.15s ease;
}

.event-cat-tab.is-active,
.event-cat-tab:hover {
    background: var(--orange);
    color: white;
}

/* Page individuelle événement */
.event-hero-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}

.event-counters {
    margin: 10px 0 0;
    color: #5b677a;
    font-size: 0.95rem;
}

.event-attend-section { }

.event-attend-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

/* ── Event cards (agenda listing) ── */

.event-card {
    grid-template-columns: 200px minmax(0, 1fr);
    transition: box-shadow 0.18s ease, transform 0.18s ease;
}

.event-card:hover {
    box-shadow: 0 20px 48px rgba(0,0,0,0.13);
    transform: translateY(-2px);
}

.classified-card-no-image.event-card {
    grid-template-columns: 1fr;
}

.event-card-poster {
    position: relative;
    overflow: hidden;
    background: #111;
    min-height: 280px;
}

.event-card-poster-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
    transition: transform 0.3s ease;
}

.event-card:hover .event-card-poster-img {
    transform: scale(1.04);
}

.event-card-body {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 22px 24px;
}

.event-card-top {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.event-card-count {
    font-size: 0.78rem;
    color: #9aa5b4;
    font-weight: 600;
    margin-left: auto;
}

.event-card-title {
    margin: 6px 0 8px;
    font-size: 1.15rem;
    line-height: 1.3;
}

.event-card-meta {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin-bottom: 8px;
    padding-bottom: 12px;
    border-bottom: 1px solid #eef2f7;
}

.event-meta-date {
    margin: 0;
    font-size: 0.92rem;
    font-weight: 700;
    color: var(--dark);
}

.event-meta-location {
    margin: 0;
    font-size: 0.85rem;
    color: #5b677a;
}

.event-meta-author {
    margin: 0;
    font-size: 0.8rem;
    color: #9aa5b4;
}

body.site-theme-night .event-card-meta {
    border-bottom-color: rgba(110, 154, 152, 0.14);
}

body.community-theme-night .event-card-meta {
    border-bottom-color: rgba(110, 154, 152, 0.14);
}

@media (max-width: 600px) {
    .event-card {
        grid-template-columns: 1fr;
    }
    .event-card-poster {
        min-height: 240px;
        max-height: 300px;
        border-radius: 20px 20px 0 0;
    }
}

/* ── Page détail événement ── */

.event-detail-layout {
    max-width: 1180px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 28px;
    align-items: start;
}

.event-detail-layout--no-poster {
    grid-template-columns: minmax(0, 1fr);
}

.event-detail-poster-col {
    position: sticky;
    top: 24px;
}

.event-detail-poster-img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 20px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.24);
}

.event-detail-main-col {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.event-detail-card {
    background: white;
    border-radius: 24px;
    box-shadow: 0 15px 35px rgba(0,0,0,0.08);
    padding: 28px 32px;
}

.event-detail-title {
    margin: 10px 0 14px;
    font-size: 2rem;
    line-height: 1.15;
}

.event-detail-meta {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin-bottom: 14px;
    padding-bottom: 16px;
    border-bottom: 1px solid #eef2f7;
}

.event-detail-section {
    background: white;
    border-radius: 20px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.06);
    padding: 22px 28px;
}

.event-detail-section-title {
    margin: 0 0 14px;
    font-size: 1rem;
    font-weight: 800;
    color: var(--dark);
}

/* Night mode */
body.site-theme-night .event-detail-card,
body.site-theme-night .event-detail-section {
    background: rgba(21, 36, 39, 0.92);
    box-shadow: 0 18px 38px rgba(0,0,0,0.28);
}

body.site-theme-night .event-detail-title,
body.site-theme-night .event-detail-section-title {
    color: #f2f8f7;
}

body.site-theme-night .event-detail-meta {
    border-bottom-color: rgba(110, 154, 152, 0.14);
}

body.site-theme-night .event-detail-card-share {
    border-top-color: rgba(110, 154, 152, 0.14) !important;
}

.event-detail-card-share .share-inline {
    justify-content: flex-start;
    gap: 10px;
}

body.site-theme-night .blog-content {
    color: #deecea;
}

@media (max-width: 760px) {
    .event-detail-layout {
        grid-template-columns: 1fr;
    }
    .event-detail-poster-col {
        position: static;
        max-width: 280px;
        margin: 0 auto;
    }
    .event-detail-card {
        padding: 20px;
    }
    .event-detail-title {
        font-size: 1.6rem;
    }
}

.event-map {
    width: 100%;
    height: 280px;
    border-radius: 16px;
    overflow: hidden;
    margin-top: 14px;
    background: #eef2f7;
}

.event-address-label {
    margin: 0 0 4px;
    color: #5b677a;
    font-size: 0.92rem;
}

.event-camping-ref {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    color: #5b677a;
    font-size: 0.95rem;
}

.event-own-note {
    color: #5b677a;
    font-size: 0.95rem;
}

.blog-section-count {
    font-size: 0.85rem;
    font-weight: 400;
    color: #5b677a;
    margin-left: 8px;
}

.link-subtle { color: inherit; text-decoration: underline; text-decoration-color: rgba(0,0,0,0.2); }
.link-dark   { color: var(--dark); text-decoration: none; }
.link-dark:hover { text-decoration: underline; }

/* ── Night mode – page agenda publique (body.site-theme-night) ── */

body.site-theme-night .community-card {
    background: rgba(21, 36, 39, 0.92);
    box-shadow: 0 18px 38px rgba(0,0,0,0.28);
}

body.site-theme-night .community-card h2,
body.site-theme-night .community-card h3,
body.site-theme-night .community-card h4 {
    color: #f2f8f7;
}

body.site-theme-night .community-card .link-dark {
    color: #f2f8f7;
}

body.site-theme-night .section-heading p {
    color: #a9bebd;
}

body.site-theme-night .event-meta-date {
    color: #deecea;
}

body.site-theme-night .event-meta-location,
body.site-theme-night .event-meta-author,
body.site-theme-night .event-counters,
body.site-theme-night .event-address-label,
body.site-theme-night .event-own-note {
    color: #a9bebd;
}

body.site-theme-night .event-extra-dates {
    color: #8faeb3;
}

body.site-theme-night .event-category {
    background: rgba(170, 200, 200, 0.12);
    color: #c7d8d6;
}

body.site-theme-night .event-category--rassemblement { background: rgba(64,224,208,0.18);  color: #76e5da; }
body.site-theme-night .event-category--journee-plage  { background: rgba(255,180,60,0.16);  color: #f5c57a; }
body.site-theme-night .event-category--porte-ouverte  { background: rgba(100,149,237,0.18); color: #8fb3f5; }
body.site-theme-night .event-category--sortie-club    { background: rgba(147,112,219,0.18); color: #c9a8f7; }
body.site-theme-night .event-category--spectacle      { background: rgba(220,80,120,0.18);  color: #f08aaa; }

/* BLOC "PRÈS DE CHEZ TOI" */
.nearby-campings-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 6px;
}

.nearby-camping-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12px 14px;
    border-radius: 14px;
    background: #f5fbfb;
    border: 1px solid rgba(47, 79, 79, 0.08);
    text-decoration: none;
    color: var(--dark);
    transition: background 0.15s, transform 0.15s;
}

.nearby-camping-item:hover {
    background: #e8f5f5;
    transform: translateY(-2px);
}

.nearby-camping-name {
    font-weight: 700;
    font-size: 0.92rem;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nearby-camping-meta {
    font-size: 0.8rem;
    color: #5f7983;
}

.nearby-camping-see-all {
    display: inline-block;
    margin-top: 14px;
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--dark);
    text-decoration: none;
}

.nearby-camping-see-all:hover {
    text-decoration: underline;
}

body.community-theme-night .nearby-camping-item {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.1);
    color: #deecea;
}

body.community-theme-night .nearby-camping-item:hover {
    background: rgba(255, 255, 255, 0.1);
}

body.community-theme-night .nearby-camping-meta {
    color: #8ab0b0;
}

body.community-theme-night .nearby-camping-see-all {
    color: #9dd0cc;
}

/* ── Carte mini dans la sidebar ─────────────────────────── */
.sidebar-map-canvas {
    width: 100%;
    height: 210px;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 10px;
}

.sidebar-map-link {
    display: inline-block;
    font-size: 13px;
    font-weight: 600;
    color: #2f8f6f;
    text-decoration: none;
}

.sidebar-map-link:hover {
    text-decoration: underline;
}

body.community-theme-night .sidebar-map-link {
    color: #9dd0cc;
}
.community-page {
    padding: 40px 5% 80px;
    min-height: calc(100vh - 88px);
    transition: background 0.35s ease, color 0.35s ease;
}

body.community-theme-day .community-page {
    background:
        radial-gradient(circle at 12% 14%, rgba(64, 224, 208, 0.20), transparent 28%),
        radial-gradient(circle at 82% 18%, rgba(255, 186, 120, 0.22), transparent 24%),
        radial-gradient(circle at 60% 72%, rgba(164, 230, 207, 0.22), transparent 28%),
        linear-gradient(180deg, #f6fbfb 0%, #e6f0ef 48%, #edf5f3 100%);
}

body.community-theme-night .community-page {
    background:
        radial-gradient(circle at 18% 18%, rgba(72, 195, 183, 0.18), transparent 26%),
        radial-gradient(circle at 78% 14%, rgba(95, 117, 255, 0.14), transparent 24%),
        radial-gradient(circle at 50% 78%, rgba(26, 68, 74, 0.34), transparent 30%),
        linear-gradient(180deg, #1d2f32 0%, #20383b 42%, #172629 100%);
}

body.community-theme-night .community-hero,
body.community-theme-night .community-card,
body.community-theme-night .member-tab {
    background: rgba(21, 36, 39, 0.92);
    box-shadow: 0 18px 38px rgba(0,0,0,0.28);
}

body.community-theme-night .member-tab {
    color: #d8e6e5;
}

body.community-theme-night .member-tab.is-active {
    background: var(--orange);
    color: white;
}

body.community-theme-night .community-hero-copy h1,
body.community-theme-night .community-card h2,
body.community-theme-night .community-card h3,
body.community-theme-night .community-card h4,
body.community-theme-night .profile-card h2,
body.community-theme-night .post-content,
body.community-theme-night .message-bubble p,
body.community-theme-night .comment-item strong,
body.community-theme-night .conversation-link strong,
body.community-theme-night .member-proposal-item strong,
body.community-theme-night .member-list-item strong,
body.community-theme-night .profile-link {
    color: #f2f8f7;
}

body.community-theme-night .community-hero-copy p,
body.community-theme-night .community-hero-stats,
body.community-theme-night .onboarding-head p,
body.community-theme-night .onboarding-score span,
body.community-theme-night .onboarding-step-copy small,
body.community-theme-night .section-heading p,
body.community-theme-night .member-proposal-item p,
body.community-theme-night .profile-bio,
body.community-theme-night .profile-tag,
body.community-theme-night .member-list-tag,
body.community-theme-night .member-list-item p,
body.community-theme-night .post-meta span,
body.community-theme-night .post-meta time,
body.community-theme-night .post-comments-count,
body.community-theme-night .comment-item span,
body.community-theme-night .empty-text,
body.community-theme-night .message-thread-header span,
body.community-theme-night .message-bubble time {
    color: #a9bebd;
}

body.community-theme-night .community-hero-stats span,
body.community-theme-night .stat-card,
body.community-theme-night .onboarding-score,
body.community-theme-night .onboarding-step-marker,
body.community-theme-night .member-proposal-item,
body.community-theme-night .comment-item,
body.community-theme-night .message-bubble,
body.community-theme-night .conversation-list-item.is-active,
body.community-theme-night .post-image-wrapper {
    background: rgba(33, 54, 58, 0.96);
}

body.community-theme-night .message-bubble.is-mine {
    background: rgba(83, 53, 38, 0.92);
}

body.community-theme-night .mini-action-secondary,
body.community-theme-night .report-select,
body.community-theme-night .admin-input,
body.community-theme-night .admin-textarea {
    background: rgba(31, 49, 53, 0.96);
    color: #eef6f5;
    border-color: #35575a;
}

body.community-theme-night .report-select option,
body.community-theme-night .admin-input option {
    background: #203437;
    color: #eef6f5;
}

body.community-theme-night .member-list-item,
body.community-theme-night .onboarding-step,
body.community-theme-night .member-proposal-item,
body.community-theme-night .member-proposal-photo-thumb,
body.community-theme-night .comments-block,
body.community-theme-night .message-request-list,
body.community-theme-night .message-thread-header {
    border-color: rgba(111, 145, 145, 0.18);
}

body.community-theme-night .member-proposal-photo-thumb {
    background: rgba(33, 54, 58, 0.96);
}

body.community-theme-night .member-proposal-photo-thumb figcaption {
    color: #a9bebd;
}

body.community-theme-night .profile-meta {
    color: #7ed8cf;
}

body.community-theme-night .profile-headline,
body.community-theme-night .onboarding-step-copy strong,
body.community-theme-night .interest-tag {
    color: #eef6f5;
}

body.community-theme-night .onboarding-progress {
    background: rgba(111, 145, 145, 0.18);
}

body.community-theme-night .onboarding-next {
    background: rgba(83, 53, 38, 0.72);
    color: #f4d8c5;
}

body.community-theme-night .onboarding-step.is-done .onboarding-step-marker {
    background: rgba(64, 224, 208, 0.18);
    color: #94eee5;
}

body.community-theme-night .onboarding-step-status {
    color: #94eee5;
}

body.community-theme-night .profile-submeta {
    color: #a9bebd;
}

body.community-theme-night .interest-tag {
    background: rgba(33, 54, 58, 0.96);
}

body.community-theme-night .trust-badge {
    background: rgba(64, 224, 208, 0.16);
    color: #baf7f1;
}

body.community-theme-night .trust-badge-verified {
    background: rgba(92, 129, 207, 0.2);
    color: #c7dcff;
}

body.community-theme-night .profile-visibility-note {
    background: rgba(92, 72, 30, 0.34);
    color: #f2d792;
}

body.community-theme-night .album-card {
    background: rgba(21, 36, 39, 0.92);
    border-color: rgba(111, 145, 145, 0.18);
}

body.community-theme-night .album-cover,
body.community-theme-night .album-photo-thumb,
body.community-theme-night .album-photo-thumb figcaption {
    background: rgba(33, 54, 58, 0.96);
}

body.community-theme-night .album-meta,
body.community-theme-night .album-photo-thumb figcaption {
    color: #a9bebd;
}

/* ── Mode nuit : cartes membres ── */

body.community-theme-night .member-card {
    background: rgba(21, 36, 39, 0.92);
    border-color: rgba(111, 145, 145, 0.18);
}

body.community-theme-night .member-card-link:hover .member-card {
    border-color: rgba(64, 224, 208, 0.45);
}

body.community-theme-night .member-card-name {
    color: #f2f8f7;
}

body.community-theme-night .member-card-location {
    color: #a9bebd;
}

body.community-theme-night .member-card-headline {
    color: #7fa8a5;
}

body.community-theme-night .member-card-online-dot {
    border-color: rgba(21, 36, 39, 0.92);
}

body.community-theme-night .member-card-self-badge {
    background: rgba(43, 122, 120, 0.25);
    border-color: rgba(43, 122, 120, 0.5);
    color: #7ae8e0;
}

body.community-theme-night .member-search-count {
    color: #7fa8a5;
}

/* ── Mode nuit : pills de filtre ── */

body.community-theme-night .member-type-pills label {
    background: rgba(31, 49, 53, 0.96);
    border-color: #35575a;
    color: #c8dedd;
}

body.community-theme-night .member-type-pills label:hover {
    border-color: #7ae8e0;
    color: #7ae8e0;
}

body.community-theme-night .member-type-pills input[type="radio"]:checked + label {
    background: #2b7a78;
    color: #fff;
    border-color: #2b7a78;
}

body.community-theme-night .member-search-online-label {
    background: rgba(31, 49, 53, 0.96);
    border-color: #35575a;
    color: #c8dedd;
}

body.community-theme-night .member-search-online-label:has(input:checked) {
    background: rgba(43, 122, 120, 0.28);
    border-color: #2b7a78;
    color: #7ae8e0;
}

body.community-theme-night .online-dot-indicator {
    background: #3d5a5d;
}

body.community-theme-night .member-search-online-label:has(input:checked) .online-dot-indicator {
    background: #22c55e;
}

body.community-theme-night .online-count-badge {
    background: #2b7a78;
    color: #fff;
}

body.community-theme-night .member-search-online-label:has(input:checked) .online-count-badge {
    background: rgba(255, 255, 255, 0.9);
    color: #2b7a78;
}

body.community-theme-night .member-card-lastseen {
    color: #4e6e6e;
}

body.community-theme-night .member-search-more-btn {
    background: rgba(31, 49, 53, 0.96);
    border-color: #35575a;
    color: #c8dedd;
}

body.community-theme-night .member-search-more-btn:hover {
    border-color: #7ae8e0;
    color: #7ae8e0;
    background: rgba(43, 122, 120, 0.18);
}
.profile-card {
    text-align: center;
}

/* ── Nouvelle présentation profil public (pcv2) ── */

.pcv2-avatar-wrap {
    position: relative;
    width: fit-content;
    margin: 0 auto 14px;
}

.pcv2-online-dot {
    position: absolute;
    bottom: 4px;
    right: 4px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #27ae60;
    border: 2.5px solid #fff;
    z-index: 1;
}

.pcv2-name {
    font-size: 1.3rem;
    font-weight: 800;
    margin: 0 0 4px;
    line-height: 1.2;
}

.pcv2-online-label {
    margin: 0 0 10px;
    font-size: 0.78rem;
    font-weight: 700;
    color: #27ae60;
}

.pcv2-lastseen {
    margin: 0 0 10px;
    font-size: 0.78rem;
    color: #9aa5b4;
}

.pcv2-meta-row {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 0 12px;
}

.pcv2-type-chip {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 999px;
    background: rgba(32, 178, 170, 0.12);
    color: #1a7a74;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.pcv2-headline {
    font-size: 0.97rem;
    font-style: italic;
    font-weight: 600;
    color: var(--dark);
    margin: 0 0 8px;
    line-height: 1.5;
}

.pcv2-location {
    font-size: 0.85rem;
    color: #5b677a;
    margin: 0 0 16px;
}

.pcv2-stats {
    display: flex;
    border-top: 1px solid #eef2f7;
    border-bottom: 1px solid #eef2f7;
    margin: 0 0 16px;
    padding: 14px 0;
}

.pcv2-stat {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

.pcv2-stat + .pcv2-stat {
    border-left: 1px solid #eef2f7;
}

.pcv2-stat strong {
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--dark);
}

.pcv2-stat span {
    font-size: 0.72rem;
    color: #9aa5b4;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.pcv2-bio {
    font-size: 0.9rem;
    color: #5b677a;
    line-height: 1.65;
    margin: 0 0 16px;
}

.pcv2-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 4px;
}

.pcv2-actions .btn-search,
.pcv2-actions .mini-action {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    box-sizing: border-box;
    text-align: center;
}

.pcv2-block-btn {
    font-size: 0.8rem;
    padding: 6px 14px;
    opacity: 0.75;
}

.pcv2-block-btn:hover {
    opacity: 1;
}

.profile-avatar,
.post-avatar {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--turquoise), #20b2aa);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    font-weight: bold;
    overflow: hidden;
}

.post-avatar {
    width: 56px;
    height: 56px;
    font-size: 1rem;
    flex-shrink: 0;
}

.post-avatar-wrap {
    position: relative;
    flex-shrink: 0;
}

.post-online-dot {
    position: absolute;
    bottom: 2px;
    right: 2px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #27ae60;
    border: 2px solid #fff;
    z-index: 1;
}

.profile-avatar {
    margin: 0 auto;
}

.pcv2-avatar-wrap .profile-avatar {
    width: 86px;
    height: 86px;
    font-size: 1.6rem;
}

.profile-avatar-image,
.post-avatar-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.profile-meta {
    color: var(--turquoise);
    font-weight: bold;
    margin: 0 0 10px;
}

.profile-headline {
    margin: 0 0 10px;
    color: var(--dark);
    font-weight: 700;
    line-height: 1.5;
}

.profile-submeta {
    margin: 0 0 10px;
    color: #5b677a;
    font-size: 0.95rem;
}

.trust-badges {
    display: flex;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
    margin: 0 0 12px;
}

.trust-badge {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border-radius: 999px;
    background: #eef7f6;
    color: #2b6f69;
    font-size: 0.78rem;
    font-weight: 800;
}

.trust-badge-verified {
    background: #eaf3ff;
    color: #315b8c;
}

.profile-visibility-note {
    margin: 14px 0 0;
    padding: 12px 14px;
    border-radius: 14px;
    background: #fff7e9;
    color: #7a5a18;
    line-height: 1.5;
}

.profile-tag,
.member-list-tag,
.moderation-meta {
    color: #5b677a;
}

.profile-tag,
.member-list-tag {
    margin: 0 0 8px;
    font-weight: 700;
}

.profile-bio {
    color: #5b677a;
    line-height: 1.6;
    margin: 0;
}

.interest-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.profile-interest-tags {
    margin-top: 16px;
    justify-content: center;
}

.interest-tag {
    display: inline-flex;
    align-items: center;
    padding: 8px 12px;
    border-radius: 999px;
    background: var(--bg-light);
    color: var(--dark);
    font-size: 0.88rem;
    font-weight: 700;
}

.profile-interest-item {
    align-items: flex-start;
}

.profile-link {
    color: var(--orange);
    text-decoration: none;
    font-weight: 700;
}

.community-form {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.community-post-textarea {
    min-height: 140px;
    resize: vertical;
}

/* Post composer */
.post-composer {
    gap: 10px;
}

.post-composer-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 4px;
}

.post-composer-avatar {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px;
    max-width: 38px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
    display: block;
}

.post-composer-avatar-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-primary, #3a8a7a);
    color: #fff;
    font-weight: 700;
    font-size: 1rem;
}

.post-composer-name {
    font-weight: 600;
    font-size: 0.95rem;
    color: var(--text-dark, #1a2e2b);
}

.post-composer-hint {
    margin-left: auto;
    font-size: 0.75rem;
    color: #8a9ab0;
    font-style: italic;
}

.post-composer-textarea {
    min-height: 100px;
    border-radius: 12px;
    font-size: 1rem;
}

.post-composer-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.post-composer-photo-zone {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 18px;
    border-radius: 14px;
    border: 2px dashed #c8dbd8;
    background: #f4faf9;
    color: #3a8a7a;
    cursor: pointer;
    transition: background .15s, border-color .15s;
    position: relative;
    overflow: hidden;
}

.post-composer-photo-zone:hover {
    background: #e8f5f3;
    border-color: #3a8a7a;
}

.post-composer-photo-icon {
    font-size: 1.5rem;
    line-height: 1;
}

.post-composer-photo-text {
    font-size: 0.95rem;
    font-weight: 600;
    color: #3a8a7a;
}

.post-composer-photo-max {
    font-weight: 400;
    font-size: 0.82rem;
    color: #7aaa9a;
}

.post-composer-file-input {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
    font-size: 0;
}

.post-composer-actions {
    display: flex;
}

.post-composer-submit {
    margin-left: auto;
    padding: 10px 28px;
    border-radius: 20px;
}

.member-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.member-list-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 14px 0;
    border-top: 1px solid #eef2f7;
}

.member-list-item:first-child {
    border-top: none;
    padding-top: 0;
}

.member-list-item p {
    margin: 4px 0 0;
    color: #5b677a;
    font-size: 0.92rem;
}

/* --- "Mieux connaître ce membre" : 2 colonnes alignées --- */

.profile-details-list .member-list-item {
    display: grid;
    grid-template-columns: 120px 1fr;
    align-items: baseline;
    gap: 8px;
    justify-content: initial;
}

.profile-details-list .member-list-item p {
    margin: 0;
    text-align: left;
}

.profile-details-list .profile-interest-item {
    align-items: start;
}

.conversation-list-item {
    align-items: flex-start;
}

.conversation-list-item.is-active {
    background: #f6fbff;
    border-radius: 16px;
    padding: 14px;
}

.conversation-link {
    color: inherit;
    text-decoration: none;
    display: block;
    flex: 1;
}

.conversation-badge {
    background: var(--orange);
    color: white;
    border-radius: 999px;
    min-width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.82rem;
    font-weight: 700;
}

/* ── Recherche de membre (messagerie) ───────────────────────────── */

.conv-search-wrap {
    position: relative;
    margin-bottom: 16px;
}

.conv-search-input {
    width: 100%;
    box-sizing: border-box;
    padding: 11px 16px 11px 40px;
    border: 1.5px solid #d4e0dc;
    border-radius: 999px;
    font-size: 0.95rem;
    background: var(--bg-light, #f6f9f8) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%238fa0a8' stroke-width='2' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E") no-repeat 14px center;
    color: var(--dark, #1a2e2b);
    outline: none;
    transition: border-color 0.15s;
}

.conv-search-input:focus {
    border-color: #3a9e8d;
    background-color: #fff;
}

.conv-search-dropdown {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #d4e0dc;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.10);
    z-index: 200;
    list-style: none;
    margin: 0;
    padding: 6px;
    overflow: hidden;
}

.conv-search-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 12px;
    cursor: pointer;
    transition: background 0.12s;
}

.conv-search-item:hover {
    background: #f0faf7;
}

.conv-search-avatar {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: linear-gradient(135deg, #3a9e8d, #2d7a6e);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1rem;
    color: #fff;
    flex-shrink: 0;
    overflow: hidden;
}

.conv-search-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.conv-search-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.conv-search-info strong {
    font-size: 0.92rem;
    color: var(--dark, #1a2e2b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.conv-search-info span {
    font-size: 0.78rem;
    color: #8fa0a8;
}

.conv-search-action {
    font-size: 0.75rem;
    font-weight: 600;
    color: #3a9e8d;
    white-space: nowrap;
    flex-shrink: 0;
}

.conv-search-empty {
    padding: 12px 14px;
    font-size: 0.88rem;
    color: #8fa0a8;
    text-align: center;
}

body.community-theme-night .conv-search-input {
    background-color: rgba(255,255,255,0.05);
    border-color: #2e5450;
    color: #e8f4f2;
}

body.community-theme-night .conv-search-input:focus {
    border-color: #3a9e8d;
    background-color: rgba(255,255,255,0.08);
}

body.community-theme-night .conv-search-dropdown {
    background: #1b3235;
    border-color: #2e5450;
    box-shadow: 0 8px 24px rgba(0,0,0,0.35);
}

body.community-theme-night .conv-search-item:hover {
    background: rgba(58,158,141,0.12);
}

body.community-theme-night .conv-search-info strong {
    color: #e8f4f2;
}

/* ── Liste de conversations enrichie ────────────────────────────── */

.conv-list-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.conv-list-header h3 {
    margin: 0;
    font-size: 1.1rem;
}

.conversation-list {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.conv-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 13px 14px;
    border-radius: 16px;
    text-decoration: none;
    color: inherit;
    transition: background 0.15s, transform 0.1s;
    cursor: pointer;
    position: relative;
}

.conv-item + .conv-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 76px;
    right: 14px;
    height: 1px;
    background: rgba(0,0,0,0.05);
}

.conv-item:hover {
    background: var(--bg-light, #f6f9f8);
    transform: translateX(2px);
}

.conv-item--active {
    background: #e6f5f1;
}

.conv-item--active .conv-item-name {
    color: #1a6b5e;
    font-weight: 700;
}

.conv-item--unread {
    background: #f0faf7;
}

/* Sidebar : avatars légèrement plus petits */
.sidebar-conv-list .conv-item-avatar {
    width: 40px;
    height: 40px;
    font-size: 0.95rem;
}

.sidebar-conv-list .conv-item {
    padding: 10px 10px;
}

.conv-item--unread:hover {
    background: #e4f5f0;
}

.conv-item-avatar-wrap {
    position: relative;
    flex-shrink: 0;
}

.conv-item-avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: linear-gradient(135deg, #3a9e8d, #2d7a6e);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    font-weight: 700;
    font-size: 1.1rem;
    color: #fff;
}

.conv-item-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.conv-item-online {
    position: absolute;
    bottom: 1px;
    right: 1px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #27ae60;
    border: 2px solid #fff;
}

.conv-item-body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.conv-item-top {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.conv-item-name-wrap {
    display: flex;
    align-items: baseline;
    gap: 6px;
    min-width: 0;
    overflow: hidden;
}

.conv-item-name {
    font-size: 0.97rem;
    color: var(--dark, #1a2e2b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex-shrink: 1;
}

.conv-item-type {
    font-size: 0.75rem;
    color: #a0b4b0;
    font-weight: 400;
    white-space: nowrap;
    flex-shrink: 0;
}

.conv-item--unread .conv-item-name {
    font-weight: 700;
}

.conv-item-time {
    font-size: 0.78rem;
    color: #8fa0a8;
    flex-shrink: 0;
    white-space: nowrap;
}

.conv-item--unread .conv-item-time {
    color: #3a9e8d;
    font-weight: 600;
}

.conv-item-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.conv-item-preview {
    font-size: 0.87rem;
    color: #8fa0a8;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
}

.conv-item--empty .conv-item-preview {
    color: #3a9e8d;
    font-style: italic;
    opacity: 0.75;
}

.conv-item--unread .conv-item-preview {
    color: #3a7a6e;
    font-weight: 500;
}

.conv-item-badge {
    background: #e8704a;
    color: #fff;
    border-radius: 999px;
    min-width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0 5px;
    flex-shrink: 0;
}

/* Night mode */
body.community-theme-night .conv-item + .conv-item::before {
    background: rgba(255,255,255,0.06);
}

body.community-theme-night .conv-item-type {
    color: #5a7a78;
}

body.community-theme-night .conv-item--empty .conv-item-preview {
    color: #4a9e90;
}

body.community-theme-night .conv-item:hover {
    background: rgba(255,255,255,0.05);
}

body.community-theme-night .conv-item--unread {
    background: rgba(58, 158, 141, 0.1);
}

body.community-theme-night .conv-item--unread:hover {
    background: rgba(58, 158, 141, 0.16);
}

body.community-theme-night .conv-item-name {
    color: #e8f4f2;
}

body.community-theme-night .conv-item-preview {
    color: #6a8a86;
}

body.community-theme-night .conv-item--unread .conv-item-preview {
    color: #7ecfc4;
}

body.community-theme-night .conv-item-online {
    border-color: #1b3235;
}

.inline-form {
    margin: 0;
}

.friendship-actions {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.mini-action {
    border: none;
    background: var(--orange);
    color: white;
    border-radius: 999px;
    padding: 10px 14px;
    font-weight: bold;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
}

.mini-action-secondary {
    background: #dfe6ef;
    color: var(--dark);
}

.mini-action-danger {
    background: #a13b49;
}

.profile-action-disabled {
    cursor: default;
    pointer-events: none;
}

.profile-action-sent {
    background: rgba(255, 255, 255, 0.08) !important;
    color: #a0b0b0 !important;
    border: 1.5px solid rgba(255, 255, 255, 0.12);
}

.profile-message-btn {
    width: 100%;
    justify-content: center;
    margin-top: 8px;
}

.moderation-grid {
    margin-top: 20px;
}

.moderation-card h3 {
    margin-top: 0;
}

.moderation-list {
    margin-top: 12px;
}

.moderation-list-item {
    align-items: flex-start;
}

.moderation-meta {
    margin: 6px 0 0;
    font-size: 0.92rem;
}

/* --- Recherche membres --- */

.member-search-form {
    margin-bottom: 22px;
}

.member-search-row {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    gap: 10px;
    align-items: center;
    margin-bottom: 12px;
}

.member-search-name,
.member-search-location {
    min-width: 0;
}

.member-search-btn {
    white-space: nowrap;
}

/* --- Barre de filtres pills --- */

.member-search-filters {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}

.member-type-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

.member-type-pills input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    overflow: hidden;
    pointer-events: none;
}

.member-type-pills label {
    display: inline-block;
    padding: 5px 14px;
    border-radius: 20px;
    border: 1.5px solid #d0d8e4;
    font-size: 0.82rem;
    cursor: pointer;
    color: #4a5568;
    background: #fff;
    transition: border-color 0.15s, background 0.15s, color 0.15s;
    line-height: 1.5;
    user-select: none;
}

.member-type-pills input[type="radio"]:checked + label {
    background: #2b7a78;
    color: #fff;
    border-color: #2b7a78;
    font-weight: 600;
}

.member-type-pills label:hover {
    border-color: #2b7a78;
    color: #2b7a78;
}

/* --- Pill "En ligne" --- */

.member-search-online-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 14px;
    border-radius: 20px;
    border: 1.5px solid #d0d8e4;
    font-size: 0.82rem;
    color: #4a5568;
    background: #fff;
    cursor: pointer;
    user-select: none;
    transition: border-color 0.15s, background 0.15s, color 0.15s;
    line-height: 1.5;
}

.member-search-online-label:has(input:checked) {
    background: #e9f5f4;
    border-color: #2b7a78;
    color: #2b7a78;
    font-weight: 600;
}

.member-search-online-label input[type="checkbox"] {
    display: none;
}

.online-dot-indicator {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #c0ccd8;
    flex-shrink: 0;
    transition: background 0.15s;
}

.member-search-online-label:has(input:checked) .online-dot-indicator {
    background: #22c55e;
}

.member-search-count {
    margin: 0 0 16px;
    font-size: 0.9rem;
    color: #5b677a;
}

/* --- Grille de cartes membres --- */

.member-cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(160px, 100%), 1fr));
    gap: 14px;
    min-width: 0;
}

@media (max-width: 480px) {
    .member-cards-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.member-card-link {
    text-decoration: none;
    color: inherit;
    display: block;
    height: 100%;
    min-width: 0;
}

.member-card {
    background: var(--bg-light);
    border-radius: 16px;
    padding: 20px 14px 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    text-align: center;
    border: 1px solid transparent;
    transition: border-color 0.18s, box-shadow 0.18s, transform 0.18s;
    height: 100%;
    box-sizing: border-box;
}

.member-card-link:hover .member-card {
    border-color: var(--turquoise);
    box-shadow: 0 8px 24px rgba(64, 224, 208, 0.22);
    transform: translateY(-3px);
}

.member-card-avatar-wrap {
    position: relative;
    flex-shrink: 0;
    width: fit-content;
}

.member-card-online-dot {
    position: absolute;
    bottom: 2px;
    right: 2px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #27ae60;
    border: 2px solid #fff;
    z-index: 1;
}

.member-card-avatar {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--turquoise), #20b2aa);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
}

.member-card-avatar-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.member-card-avatar-initials {
    color: white;
    font-weight: 700;
    font-size: 1.15rem;
    line-height: 1;
}

.member-card-body {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    min-width: 0;
    width: 100%;
}

.member-card-name {
    font-size: 0.93rem;
    color: var(--dark);
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    text-align: center;
}

.member-card-self-badge {
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    font-size: 0.68rem;
    font-weight: 600;
    color: #2b7a78;
    background: #e9f5f4;
    border: 1px solid #b2d8d6;
    border-radius: 10px;
    padding: 1px 7px;
    margin-left: 4px;
    text-transform: none;
    letter-spacing: 0;
    position: relative;
    top: -1px;
}

.member-card-type {
    font-size: 0.78rem;
    color: var(--turquoise);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.member-card-location {
    font-size: 0.8rem;
    color: #5b677a;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
}

.member-card-headline {
    margin: 4px 0 0;
    font-size: 0.78rem;
    color: #7d8899;
    line-height: 1.4;
    font-style: italic;
}

.member-card-lastseen {
    font-size: 0.72rem;
    color: #9babb8;
    margin-top: 1px;
}

/* --- Compteur "En ligne" dans la pill --- */

.online-count-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 9px;
    background: #2b7a78;
    color: #fff;
    font-size: 0.71rem;
    font-weight: 700;
    line-height: 1;
    margin-left: 4px;
    flex-shrink: 0;
}

.member-search-online-label:has(input:checked) .online-count-badge {
    background: #fff;
    color: #2b7a78;
}

/* --- Voir plus --- */

.member-search-more-wrap {
    text-align: center;
    margin-top: 22px;
}

.member-search-more-btn {
    display: inline-block;
    padding: 9px 28px;
    border-radius: 20px;
    border: 1.5px solid #d0d8e4;
    font-size: 0.88rem;
    color: #4a5568;
    text-decoration: none;
    transition: border-color 0.15s, color 0.15s, background 0.15s;
}

.member-search-more-btn:hover {
    border-color: var(--turquoise);
    color: var(--turquoise);
    background: rgba(64, 224, 208, 0.06);
}

/* ── Mode nuit pcv2 ── */
body.community-theme-night .pcv2-name,
body.community-theme-night .pcv2-stat strong {
    color: #f2f8f7;
}

body.community-theme-night .pcv2-headline {
    color: #deecea;
}

body.community-theme-night .pcv2-bio,
body.community-theme-night .pcv2-location,
body.community-theme-night .pcv2-stat span,
body.community-theme-night .pcv2-lastseen {
    color: #a9bebd;
}

body.community-theme-night .pcv2-type-chip {
    background: rgba(32, 178, 170, 0.18);
    color: #7ae8e0;
}

body.community-theme-night .pcv2-stats,
body.community-theme-night .pcv2-stat + .pcv2-stat {
    border-color: rgba(101, 132, 136, 0.35);
}

body.community-theme-night .pcv2-online-dot {
    border-color: rgba(21, 36, 39, 0.92);
}

/* ── Suggestion du jour — composer ──────────────────────────────── */

.post-composer-prompt-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #f0faf7;
    border: 1px solid #c8e8e2;
    border-radius: 12px;
    padding: 10px 14px;
}

.post-composer-prompt-text {
    flex: 1;
    font-size: 0.92rem;
    color: #1a3a2f;
    font-style: italic;
}

.post-composer-prompt-change,
.post-composer-prompt-dismiss {
    flex-shrink: 0;
    background: none;
    border: 1px solid #b0d8d0;
    border-radius: 999px;
    cursor: pointer;
    transition: background .15s, color .15s, border-color .15s;
    white-space: nowrap;
    line-height: 1;
}

.post-composer-prompt-change {
    padding: 3px 10px;
    font-size: 0.78rem;
    color: #2f7060;
}

.post-composer-prompt-dismiss {
    padding: 3px 8px;
    font-size: 0.75rem;
    color: #c0392b;
    border-color: #e8a89e;
}

.post-composer-prompt-change:hover {
    background: #d8f0ea;
    border-color: #3a8a7a;
    color: #1a4f42;
}

.post-composer-prompt-dismiss:hover {
    background: #fce4e0;
    border-color: #c0392b;
    color: #8b1a12;
}

body.community-theme-night .post-composer-name {
    color: #d8eee8;
}

body.community-theme-night .post-composer-prompt-wrap {
    background: rgba(27, 55, 50, 0.55);
    border-color: rgba(80, 160, 140, 0.3);
}

body.community-theme-night .post-composer-prompt-text {
    color: #c8eae4;
}

body.community-theme-night .post-composer-prompt-change {
    border-color: rgba(80, 160, 140, 0.4);
    color: #9fddd5;
}

body.community-theme-night .post-composer-prompt-dismiss {
    border-color: rgba(200, 80, 60, 0.4);
    color: #e88070;
}

/* ── Tag question dans les posts ─────────────────────────────────── */

.post-prompt-tag {
    display: inline-block;
    background: #f0faf7;
    border: 1px solid #c8e8e2;
    border-radius: 999px;
    padding: 4px 14px;
    font-size: 0.82rem;
    color: #2f7060;
    font-style: italic;
    margin-bottom: 8px;
}

body.community-theme-night .post-prompt-tag {
    background: rgba(27, 55, 50, 0.55);
    border-color: rgba(80, 160, 140, 0.3);
    color: #9fddd5;
}
.post-card {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.message-thread-header {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid #eef2f7;
}

.message-thread-header > div {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.message-thread-header span {
    color: #5b677a;
    font-size: 0.92rem;
}

/* ── Nouveau header de conversation ──────────────────────────────── */

.conv-thread-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 16px;
    margin-bottom: 4px;
    border-bottom: 1px solid #eef2f7;
}

.conv-back-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: var(--bg-light, #f0f4f2);
    color: #3a9e8d;
    font-size: 1.1rem;
    font-weight: 700;
    text-decoration: none;
    flex-shrink: 0;
    transition: background 0.15s;
}

.conv-back-btn:hover {
    background: #d8f0ea;
}

.conv-thread-header-avatar-wrap {
    position: relative;
    flex-shrink: 0;
    display: block;
    text-decoration: none;
}

.conv-thread-header-avatar {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: linear-gradient(135deg, #3a9e8d, #2d7a6e);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    font-weight: 700;
    font-size: 1.1rem;
    color: #fff;
}

.conv-thread-header-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.conv-thread-online {
    position: absolute;
    bottom: 1px;
    right: 1px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #27ae60;
    border: 2px solid #fff;
}

.conv-thread-header-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.conv-thread-header-name {
    display: flex;
    align-items: baseline;
    gap: 8px;
    flex-wrap: wrap;
}

.conv-thread-header-name strong {
    font-size: 1rem;
    color: var(--dark, #1a2e2b);
}

.conv-thread-age {
    font-size: 0.82rem;
    color: #5b8c84;
    font-weight: 500;
}

.conv-thread-status-label {
    font-size: 0.75rem;
    font-weight: 600;
    color: #27ae60;
    background: rgba(39,174,96,0.1);
    border-radius: 999px;
    padding: 1px 8px;
}

.conv-thread-header-meta {
    display: flex;
    gap: 4px;
    font-size: 0.83rem;
    color: #8fa0a8;
}

body.community-theme-night .conv-thread-header {
    border-bottom-color: #2e5450;
}

body.community-theme-night .conv-back-btn {
    background: rgba(255,255,255,0.07);
    color: #5ec9b6;
}

body.community-theme-night .conv-back-btn:hover {
    background: rgba(58,158,141,0.2);
}

body.community-theme-night .conv-thread-online {
    border-color: #1b3235;
}

body.community-theme-night .conv-thread-header-name strong {
    color: #e8f4f2;
}

.message-request-list {
    display: grid;
    gap: 12px;
    margin-bottom: 18px;
    padding-bottom: 18px;
    border-bottom: 1px solid #eef2f7;
}

.message-thread {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 18px;
    max-height: 480px;
    overflow-y: auto;
}

.message-bubble {
    max-width: 78%;
    padding: 14px 16px;
    border-radius: 18px;
    background: var(--bg-light);
}

.message-bubble.is-mine {
    align-self: flex-end;
    background: #fff3ec;
}

.message-bubble p {
    margin: 0;
    line-height: 1.5;
}

.message-bubble time {
    display: block;
    margin-top: 8px;
    color: #5b677a;
    font-size: 0.8rem;
}

.post-header {
    display: flex;
    align-items: center;
    gap: 16px;
}

.post-meta {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
}

.post-meta span,
.post-meta time {
    color: #5b677a;
    font-size: 0.92rem;
}

.post-content {
    margin: 0;
    line-height: 1.7;
    color: var(--dark);
}

/* ── Bloc "nouveau membre" ─────────────────────────────────────── */
.post-meta-joined-label {
    font-size: 0.9rem;
    color: #3a9e8d;
    font-weight: 600;
}

.post-joined-banner {
    display: flex;
    align-items: center;
    gap: 14px;
    background: linear-gradient(135deg, #edfaf6 0%, #f0faf8 100%);
    border: 1px solid #c3ede4;
    border-radius: 18px;
    padding: 16px 20px;
}

.post-joined-wave {
    font-size: 2rem;
    line-height: 1;
    flex-shrink: 0;
}

.post-joined-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
}

.post-joined-welcome {
    flex: 1;
    margin: 0;
    font-size: 0.93rem;
    color: #2d5a54;
    line-height: 1.5;
}

.post-joined-welcome-name {
    font-weight: 700;
    color: #1a3a36;
    text-decoration: none;
}

.post-joined-welcome-name:hover {
    text-decoration: underline;
}

.post-joined-name-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.post-joined-name {
    font-weight: 700;
    font-size: 1rem;
    color: var(--dark);
    text-decoration: none;
}

.post-joined-name:hover {
    text-decoration: underline;
}

.post-joined-badge {
    font-size: 0.7rem;
    font-weight: 600;
    color: #3a9e8d;
    background: rgba(58, 158, 141, 0.12);
    border: 1px solid rgba(58, 158, 141, 0.28);
    border-radius: 20px;
    padding: 2px 9px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
}

.post-joined-sub {
    font-size: 0.88rem;
    color: #5b8c84;
}

body.community-theme-night .post-joined-banner {
    background: linear-gradient(135deg, rgba(37, 70, 65, 0.55) 0%, rgba(30, 55, 52, 0.55) 100%);
    border-color: #2e6460;
}

body.community-theme-night .post-joined-name {
    color: #e8f4f2;
}

body.community-theme-night .post-joined-sub {
    color: #8bbfb8;
}

body.site-theme-night .post-joined-banner {
    background: linear-gradient(135deg, rgba(37, 70, 65, 0.55) 0%, rgba(30, 55, 52, 0.55) 100%);
    border-color: #2e6460;
}

body.site-theme-night .post-joined-name {
    color: #e8f4f2;
}

body.site-theme-night .post-joined-sub {
    color: #8bbfb8;
}

body.community-theme-night .post-meta-joined-label {
    color: #5ec9b6;
}

body.site-theme-night .post-meta-joined-label {
    color: #5ec9b6;
}

.post-engagement {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.comment-own-actions {
    display: flex;
    gap: 10px;
    margin-top: 4px;
}

.comment-action-btn {
    background: none;
    border: none;
    font-size: 0.76rem;
    color: #b0b8c4;
    cursor: pointer;
    padding: 0;
    transition: color 0.15s;
}

.comment-action-btn:hover {
    color: #5b8c84;
}

.comment-action-btn--delete:hover,
.comment-action-btn--confirm {
    color: #c0392b;
    font-weight: 600;
}

.comment-editor {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 6px;
}

.comment-edit-textarea {
    min-height: 64px;
    resize: vertical;
}

.comment-editor-btns {
    display: flex;
    gap: 10px;
    align-items: center;
}

.post-delete-btn {
    margin-left: auto;
    background: none;
    border: none;
    color: #b0b8c4;
    font-size: 0.78rem;
    cursor: pointer;
    padding: 4px 2px;
    transition: color 0.15s;
}

.post-delete-btn:hover {
    color: #c0392b;
}

.post-delete-btn--confirm {
    color: #c0392b;
    font-weight: 600;
}

.post-comments-count {
    color: #5b677a;
    font-size: 0.92rem;
}

.post-avatar-new-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 12px 0 4px;
}

.post-avatar-new {
    width: 300px;
    height: 300px;
    min-width: 300px;
    min-height: 300px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
    border: 4px solid #e8f5f3;
    box-shadow: 0 4px 20px rgba(0,0,0,0.13);
    cursor: zoom-in;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.post-avatar-new:hover {
    transform: scale(1.03);
    box-shadow: 0 8px 32px rgba(0,0,0,0.18);
}

.post-image-wrapper {
    border-radius: 18px;
    overflow: hidden;
    background: var(--bg-light);
}

.post-image-wrapper.post-image-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 4px;
}

.post-image {
    display: block;
    width: 100%;
    height: auto;
    max-height: 600px;
    object-fit: scale-down;
}

.post-image-grid .post-image {
    height: 220px;
    max-height: 220px;
    object-fit: cover;
}

.post-image-grid .post-image:first-child:last-child {
    grid-column: span 2;
    height: auto;
    max-height: 600px;
    object-fit: scale-down;
}

.post-image-grid .post-image:first-child:nth-last-child(3),
.post-image-grid .post-image:first-child:nth-last-child(3) ~ .post-image:nth-child(2) {
    grid-column: span 1;
}
.post-image-grid .post-image:nth-child(3):last-child {
    grid-column: span 2;
}

.comments-block {
    border-top: 1px solid #eef2f7;
    padding-top: 18px;
}

.comments-block h4 {
    margin: 0 0 14px;
}

.comment-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 16px;
}

.comment-item {
    background: var(--bg-light);
    border-radius: 16px;
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    position: relative;
}

.comment-item .report-discreet-form {
    position: absolute;
    top: 8px;
    right: 10px;
    margin-left: 0;
}

.report-form {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 6px;
}

.report-toggle-wrap {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
}

.report-form-inline {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 0;
}

.report-form-inline[hidden] {
    display: none;
}

.report-toggle-cancel {
    background: none;
    border: none;
    padding: 2px 5px;
    font-size: 0.75rem;
    color: #b0b8c8;
    cursor: pointer;
    line-height: 1;
    border-radius: 4px;
    transition: color 0.15s;
}

.report-toggle-cancel:hover {
    color: #e06060;
}

.profile-report-form {
    justify-content: center;
    margin-top: 14px;
}

.report-confirm-btn {
    background: none;
    border: 1px solid #e0a0a0;
    border-radius: 999px;
    padding: 3px 12px;
    font-size: 0.8rem;
    font-weight: 600;
    color: #c0392b;
    cursor: pointer;
    line-height: 1.6;
    transition: background 0.15s, color 0.15s;
    white-space: nowrap;
}

.report-confirm-btn:hover {
    background: #c0392b;
    color: #fff;
    border-color: #c0392b;
}

.report-discreet-form {
    display: inline-flex;
    margin-top: 0;
    margin-left: auto;
}

.report-discreet-btn {
    background: none;
    border: none;
    padding: 2px 4px;
    font-size: 0.85rem;
    color: #b0b8c8;
    cursor: pointer;
    line-height: 1;
    border-radius: 4px;
    transition: color 0.15s;
}

.report-discreet-btn:hover {
    color: #e06060;
}

.report-admin-form {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}

.online-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #27ae60;
    flex-shrink: 0;
    box-shadow: 0 0 0 2px #fff;
}

.btn-compose-attach {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #f0f4f8;
    color: #4a5568;
    border: 1.5px solid #c8d2e1;
    border-radius: 999px;
    padding: 10px 20px;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
    white-space: nowrap;
}

.btn-compose-attach:hover {
    background: #e2e8f0;
}

.btn-video-call {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: #27ae60;
    color: #fff;
    border: none;
    border-radius: 999px;
    padding: 11px 22px;
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s, transform 0.15s;
    white-space: nowrap;
    box-shadow: 0 2px 8px rgba(39, 174, 96, 0.35);
}

.btn-video-call:hover {
    background: #219a52;
    transform: scale(1.04);
}

.btn-ephemeral-compose {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: rgba(230, 126, 34, 0.12);
    color: #e67e22;
    border: 2px solid #e67e22;
    border-radius: 999px;
    padding: 10px 20px;
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s, color 0.2s, transform 0.15s;
    white-space: nowrap;
}

.btn-ephemeral-compose:hover {
    background: rgba(230, 126, 34, 0.22);
    transform: scale(1.04);
}

.btn-ephemeral-compose.is-active {
    background: #e67e22;
    color: #fff;
    border-color: #e67e22;
    box-shadow: 0 2px 8px rgba(230, 126, 34, 0.4);
}

.message-compose-form {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid #eef2f7;
}

.message-compose-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.message-media-label {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.msg-img-zoom-btn {
    display: block;
    padding: 0;
    border: none;
    background: none;
    cursor: zoom-in;
    line-height: 0;
}

.message-bubble-image {
    display: block;
    max-width: 100%;
    max-height: 280px;
    border-radius: 12px;
    object-fit: contain;
}

.message-bubble-video {
    display: block;
    max-width: 100%;
    max-height: 280px;
    border-radius: 12px;
}

/* --- Photos éphémères --- */

.ephemeral-container {
    position: relative;
    display: inline-block;
    border-radius: 12px;
    overflow: hidden;
}

.ephemeral-blur-wrap {
    position: relative;
    display: inline-block;
}

.ephemeral-blur-bg {
    width: 220px;
    height: 160px;
    border-radius: 12px;
    background: linear-gradient(135deg, #e8d8c8 0%, #d4c0a8 40%, #c0a888 100%);
    display: block;
}

.ephemeral-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    background: rgba(0,0,0,0.28);
    border-radius: 12px;
}

.ephemeral-overlay span {
    font-size: 13px;
    color: #fff;
    font-weight: 600;
    text-shadow: 0 1px 3px rgba(0,0,0,0.5);
}

.ephemeral-view-btn {
    background: rgba(255,255,255,0.92);
    color: #1a1a1a;
    border: none;
    border-radius: 20px;
    padding: 6px 16px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s;
}

.ephemeral-view-btn:hover {
    background: #fff;
}

.ephemeral-view-btn:disabled {
    opacity: 0.6;
    cursor: default;
}

.ephemeral-reveal {
    display: block;
    max-width: 100%;
    max-height: 280px;
    border-radius: 12px;
    object-fit: contain;
}

.ephemeral-timer {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: #e67e22;
    font-weight: 700;
    text-align: center;
}

.ephemeral-expired {
    display: inline-block;
    padding: 8px 14px;
    background: #f5f0eb;
    border-radius: 10px;
    font-size: 13px;
    color: #888;
}

.ephemeral-sent {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    background: rgba(230,126,34,0.1);
    border-radius: 10px;
    font-size: 13px;
    color: #c0392b;
    font-weight: 600;
}

.ephemeral-sent-status {
    font-size: 11px;
    color: #888;
    font-weight: 400;
}

.ephemeral-toggle-btn {
    background: none;
    border: 1px solid #ccc;
    border-radius: 20px;
    padding: 5px 12px;
    font-size: 12px;
    cursor: pointer;
    color: #666;
    transition: all 0.2s;
}

.ephemeral-toggle-btn.is-active {
    background: #e67e22;
    border-color: #e67e22;
    color: #fff;
}

/* --- Indicateur "en train d'écrire" --- */

.typing-indicator {
    display: none;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    font-size: 0.85rem;
    color: #5b677a;
    font-style: italic;
}

.typing-dots {
    display: inline-flex;
    gap: 3px;
}

.typing-dots span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #a0aab8;
    animation: typing-bounce 1.2s infinite ease-in-out;
}

.typing-dots span:nth-child(2) { animation-delay: 0.2s; }
.typing-dots span:nth-child(3) { animation-delay: 0.4s; }

@keyframes typing-bounce {
    0%, 80%, 100% { transform: scale(0.7); opacity: 0.5; }
    40%            { transform: scale(1);   opacity: 1;   }
}

/* --- "Voir plus" de messages --- */

.voir-plus-messages {
    display: block;
    text-align: center;
    padding: 8px;
    font-size: 0.85rem;
    color: #5b677a;
    border-bottom: 1px solid #eef2f7;
    margin-bottom: 8px;
    text-decoration: none;
}

.voir-plus-messages:hover {
    color: var(--primary, #e67e22);
}

/* --- Appel vidéo WebRTC --- */

.video-call-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.92);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
}

.video-call-modal {
    width: 100%;
    max-width: 720px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

.video-call-status {
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
    text-align: center;
    margin: 0;
}

.video-container {
    position: relative;
    width: 100%;
    background: #111;
    border-radius: 16px;
    overflow: hidden;
    aspect-ratio: 16 / 9;
}

/* Remote video : position absolute pour empiler sans pousser le flux */
#remote-video,
#global-remote-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    z-index: 1;
}

/* Local video : PiP en bas à droite par-dessus la remote */
#local-video,
#global-local-video {
    position: absolute;
    bottom: 12px;
    right: 12px;
    width: 25%;
    max-width: 160px;
    min-width: 80px;
    aspect-ratio: 4 / 3;
    border-radius: 10px;
    border: 2px solid rgba(255, 255, 255, 0.4);
    object-fit: cover;
    background: #333;
    z-index: 2;
}

/* Plein écran — classe CSS (fonctionne sur iOS + desktop) */
.video-call-overlay.is-fs {
    align-items: stretch;
}

.video-call-overlay.is-fs .video-call-modal {
    height: 100%;
    max-width: 100%;
    padding: 16px 20px 20px;
    box-sizing: border-box;
    justify-content: space-between;
}

.video-call-overlay.is-fs .video-container {
    flex: 1;
    aspect-ratio: unset;
    border-radius: 0;
    min-height: 0;
}

/* Plein écran natif (Android/desktop) */
html:fullscreen          .video-call-overlay,
html:-webkit-full-screen .video-call-overlay { align-items: stretch; }

html:fullscreen          .video-call-modal,
html:-webkit-full-screen .video-call-modal {
    height: 100%; max-width: 100%;
    padding: 16px 20px 20px;
    box-sizing: border-box;
    justify-content: space-between;
}

html:fullscreen          .video-container,
html:-webkit-full-screen .video-container {
    flex: 1; aspect-ratio: unset; border-radius: 0; min-height: 0;
}

.video-call-controls {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
}

.btn-control {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 999px;
    padding: 10px 20px;
    font-size: 0.88rem;
    cursor: pointer;
    transition: background 0.2s;
    white-space: nowrap;
}

.btn-control:hover {
    background: rgba(255, 255, 255, 0.22);
}

.btn-control.is-active {
    background: rgba(231, 76, 60, 0.45);
    border-color: rgba(231, 76, 60, 0.7);
}

.video-call-actions {
    display: flex;
    gap: 12px;
}

.btn-hangup {
    background: #e74c3c;
    color: #fff;
    border: none;
    border-radius: 999px;
    padding: 12px 32px;
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s;
}

.btn-hangup:hover {
    background: #c0392b;
}

.incoming-call-banner {
    display: none;
    position: fixed;
    bottom: 28px;
    right: 28px;
    z-index: 8000;
    align-items: center;
    gap: 14px;
    padding: 16px 20px;
    background: #1a1a2e;
    border-radius: 18px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45);
    color: #fff;
    min-width: 300px;
    animation: call-slide-in 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes call-slide-in {
    from { transform: translateY(40px); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
}

.incoming-call-avatar {
    font-size: 2rem;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    flex-shrink: 0;
    animation: call-pulse 1.4s infinite ease-in-out;
}

@keyframes call-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(39, 174, 96, 0.6); }
    50%       { box-shadow: 0 0 0 10px rgba(39, 174, 96, 0); }
}

.incoming-call-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
}

.incoming-call-info strong {
    color: #fff;
    font-size: 1rem;
}

.incoming-call-info span {
    color: #a0b0c0;
    font-size: 0.82rem;
}

.incoming-call-actions {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.btn-accept-call {
    background: #27ae60;
    color: #fff;
    border: none;
    border-radius: 999px;
    padding: 8px 18px;
    font-size: 0.85rem;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s;
    white-space: nowrap;
}

.btn-accept-call:hover {
    background: #219a52;
}

.btn-block-call {
    background: rgba(80, 80, 80, 0.18);
    color: #ccc;
    border: 1px solid rgba(150, 150, 150, 0.3);
    border-radius: 999px;
    padding: 7px 14px;
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
    white-space: nowrap;
}

.btn-block-call:hover {
    background: rgba(80, 80, 80, 0.35);
}

.btn-block-videocall {
    background: none;
    border: 1px solid #c8d2e1;
    border-radius: 999px;
    padding: 6px 12px;
    font-size: 1rem;
    cursor: pointer;
    color: #5b677a;
    transition: background 0.2s, border-color 0.2s;
    line-height: 1;
}

.btn-block-videocall:hover {
    background: #f0f4f8;
}

.btn-block-videocall.is-blocked {
    background: rgba(231, 76, 60, 0.1);
    border-color: rgba(231, 76, 60, 0.4);
    color: #e74c3c;
}

.btn-decline-call {
    background: rgba(231, 76, 60, 0.18);
    color: #ff6b6b;
    border: 1px solid rgba(231, 76, 60, 0.35);
    border-radius: 999px;
    padding: 7px 18px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
    white-space: nowrap;
}

.btn-decline-call:hover {
    background: rgba(231, 76, 60, 0.35);
}

/* ── Toasts de notification ───────────────────────────────────────── */
#toast-container {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 10px;
    pointer-events: none;
}

.toast-notif {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fff;
    border: 1px solid #e2eaea;
    border-left: 4px solid #3a9e8d;
    border-radius: 14px;
    box-shadow: 0 8px 28px rgba(0,0,0,0.13);
    padding: 13px 16px;
    min-width: 260px;
    max-width: 340px;
    pointer-events: all;
    animation: toast-in 0.3s cubic-bezier(.22,.68,0,1.2) both;
}

.toast-notif.is-hiding {
    animation: toast-out 0.3s ease forwards;
}

@keyframes toast-in {
    from { opacity: 0; transform: translateX(40px) scale(0.95); }
    to   { opacity: 1; transform: translateX(0) scale(1); }
}

@keyframes toast-out {
    from { opacity: 1; transform: translateX(0) scale(1); }
    to   { opacity: 0; transform: translateX(40px) scale(0.95); }
}

.toast-icon {
    font-size: 1.1rem;
    flex-shrink: 0;
    background: #edf7f5;
    border-radius: 50%;
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.78rem;
    font-weight: 700;
    color: #3a9e8d;
}

.toast-body {
    flex: 1;
    min-width: 0;
}

.toast-message {
    font-size: 0.88rem;
    color: #1e3130;
    line-height: 1.4;
    margin: 0 0 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.toast-link {
    font-size: 0.8rem;
    color: #3a9e8d;
    font-weight: 600;
    text-decoration: none;
}

.toast-link:hover { text-decoration: underline; }

.toast-close {
    background: none;
    border: none;
    color: #9aa5b4;
    font-size: 1rem;
    cursor: pointer;
    padding: 2px 4px;
    line-height: 1;
    flex-shrink: 0;
}

.toast-close:hover { color: #5b677a; }

body.community-theme-night .toast-notif,
body.site-theme-night .toast-notif {
    background: #1b3235;
    border-color: #2e5450;
    border-left-color: #3a9e8d;
    box-shadow: 0 8px 28px rgba(0,0,0,0.35);
}

body.community-theme-night .toast-message,
body.site-theme-night .toast-message {
    color: #e8f4f2;
}

body.community-theme-night .toast-icon,
body.site-theme-night .toast-icon {
    background: rgba(58,158,141,0.18);
}

/* ── Infinite scroll ── */
.feed-loading {
    display: flex;
    justify-content: center;
    padding: 1.4rem 0;
}

.feed-loading[hidden],
.feed-end-label[hidden],
.feed-new-banner[hidden] {
    display: none !important;
}

/* ── Bannière nouveaux posts ── */
.feed-new-banner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 11px 20px;
    margin-bottom: 6px;
    background: linear-gradient(135deg, #edfaf6 0%, #e6f7f3 100%);
    border: 1px solid #b2e4d8;
    border-radius: 14px;
    color: #2a7a6c;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s, transform 0.15s;
}

.feed-new-banner:hover {
    background: linear-gradient(135deg, #d8f5ef 0%, #d0f0ea 100%);
    transform: translateY(-1px);
}

body.community-theme-night .feed-new-banner,
body.site-theme-night .feed-new-banner {
    background: linear-gradient(135deg, rgba(37,70,65,0.6) 0%, rgba(30,55,52,0.6) 100%);
    border-color: #2e6460;
    color: #7ecfc4;
}
.feed-loading-spinner {
    width: 28px;
    height: 28px;
    border: 3px solid rgba(0,0,0,0.08);
    border-top-color: #3a9e8d;
    border-radius: 50%;
    animation: feed-spin 0.7s linear infinite;
    display: inline-block;
}
@keyframes feed-spin {
    to { transform: rotate(360deg); }
}
.feed-end-label {
    text-align: center;
    color: #8fa0a8;
    font-size: 0.82rem;
    padding: 1.2rem 0 0.6rem;
    letter-spacing: 0.02em;
}
body.community-theme-night .feed-loading-spinner,
body.site-theme-night .feed-loading-spinner {
    border-color: rgba(255,255,255,0.08);
    border-top-color: #3a9e8d;
}
body.community-theme-night .feed-end-label,
body.site-theme-night .feed-end-label {
    color: #5a7a80;
}
.notifications-toolbar {
    margin-bottom: 18px;
}

.notif-filter-bar {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.notif-filter-chip {
    display: inline-block;
    padding: 6px 14px;
    border-radius: 999px;
    border: 1px solid #c8d2e1;
    background: white;
    color: var(--dark);
    font-size: 0.85rem;
    text-decoration: none;
    transition: background 0.15s, border-color 0.15s;
}

.notif-filter-chip.is-active,
.notif-filter-chip:hover {
    background: var(--turquoise);
    border-color: var(--turquoise);
    color: white;
}

.notif-prefs-block {
    margin-top: 28px;
    padding-top: 20px;
    border-top: 1px solid #e4ecec;
}

.notif-prefs-summary {
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    color: var(--dark);
    list-style: none;
    display: flex;
    align-items: center;
    gap: 8px;
}

.notif-prefs-summary::before {
    content: '▶';
    font-size: 0.7em;
    transition: transform 0.2s;
}

details[open] .notif-prefs-summary::before {
    transform: rotate(90deg);
}

.notif-prefs-form {
    margin-top: 16px;
}

.notif-prefs-hint {
    margin: 0 0 16px;
    font-size: 14px;
    color: #5b677a;
}

.notif-prefs-table-header {
    display: grid;
    grid-template-columns: 1fr 80px 80px;
    gap: 8px;
    padding: 6px 0;
    border-bottom: 1px solid #eef2f7;
    margin-bottom: 8px;
    font-size: 0.82rem;
    font-weight: 700;
    color: #5b677a;
    text-align: center;
}

.notif-prefs-table-header span:first-child {
    text-align: left;
}

.notif-prefs-group-label {
    margin: 14px 0 6px;
    font-size: 0.82rem;
    font-weight: 700;
    color: #5b677a;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.notif-prefs-row {
    display: grid;
    grid-template-columns: 1fr 80px 80px;
    gap: 8px;
    align-items: center;
    padding: 6px 0;
    border-bottom: 1px solid #f2f4f8;
}

.notif-prefs-type-name {
    font-size: 0.9rem;
    color: var(--dark);
}

.notif-pref-toggle {
    display: flex;
    justify-content: center;
    cursor: pointer;
}

.notification-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.notification-item {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px 16px;
    border-radius: 18px;
    background: var(--bg-light);
    border: 1px solid transparent;
    transition: border-color 0.15s;
}

.notification-item:hover {
    border-color: rgba(64, 224, 208, 0.3);
}

.notification-item.is-unread {
    border-color: rgba(64, 224, 208, 0.28);
    background: #f4fcfb;
}

.notification-item-main {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    min-width: 0;
    text-decoration: none;
    color: inherit;
}

.notification-item-badge {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    box-shadow: 0 2px 6px rgba(0,0,0,0.07);
}

.notification-item-copy {
    min-width: 0;
}

.notification-item-text {
    margin: 0;
    color: var(--dark);
    line-height: 1.55;
    font-weight: 600;
}

.notification-item-meta {
    margin: 6px 0 0;
    color: #5b677a;
    font-size: 0.9rem;
}

.notification-item-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    padding-left: 52px;
}

.comment-form {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.comment-form > button[type="submit"] {
    align-self: flex-start;
}

.comment-form-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.comment-image-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--bg-light);
    cursor: pointer;
    font-size: 1rem;
    flex-shrink: 0;
    transition: background 0.15s;
}

.comment-image-label:hover {
    background: #dde5f0;
}

.comment-image-input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.comment-image {
    display: block;
    max-width: 100%;
    max-height: 360px;
    border-radius: 12px;
    object-fit: contain;
    margin-top: 4px;
}

.comment-image-filename {
    font-size: 0.78rem;
    color: #5b677a;
    margin-left: 4px;
}

.compact-form {
    gap: 10px;
}

.comment-textarea {
    min-height: 84px;
    resize: vertical;
}

.empty-text {
    margin: 0;
    color: #5b677a;
}

.empty-feed-card {
    text-align: center;
}
.profile-public-layout {
    align-items: start;
}

.album-list {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.album-card {
    border: 1px solid #eef2f7;
    border-radius: 20px;
    overflow: hidden;
    background: var(--white);
}

.album-thumb-image {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1;
    object-fit: cover;
}

.album-card-body {
    padding: 18px;
}

.album-card-header {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
    margin-bottom: 10px;
}

.album-card-header h4 {
    margin: 0 0 6px;
}

.album-meta {
    margin: 0;
    color: #5b677a;
    font-size: 0.92rem;
}

.album-cover {
    overflow: hidden;
    max-height: 200px;
    background: #f5f7f4;
    position: relative;
}

.album-cover--locked {
    background: #ececec;
}

.album-cover--empty {
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.album-cover-image--blurred {
    filter: blur(12px);
    transform: scale(1.08);
}

.album-lock-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.4rem;
    opacity: 0.75;
    pointer-events: none;
}

.album-cover-image {
    display: block;
    width: 100%;
    height: 200px;
    object-fit: cover;
}

.album-photo-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
    gap: 8px;
    margin-top: 10px;
}

.album-photo-thumb {
    margin: 0;
    border-radius: 12px;
    overflow: hidden;
    background: var(--bg-light);
    border: 1px solid rgba(201, 214, 228, 0.85);
    display: flex;
    flex-direction: column;
}

.album-photo-thumb figcaption {
    padding: 8px 10px;
    color: #5b677a;
    font-size: 0.84rem;
    line-height: 1.4;
}

.album-thumb-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px;
    border-top: 1px solid rgba(201, 214, 228, 0.75);
    background: rgba(255, 255, 255, 0.92);
}

.album-thumb-actions .inline-form {
    width: 100%;
}

.album-thumb-actions .mini-action,
.album-delete-form .mini-action {
    width: 100%;
    justify-content: center;
}

.album-cover-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 10px;
    border-radius: 999px;
    background: #dff7f2;
    color: #1b6d63;
    font-size: 0.82rem;
    font-weight: 700;
    align-self: center;
}

.album-delete-form {
    margin-top: 14px;
}

.album-description {
    margin: 5px 0 0;
    color: #5b677a;
    font-size: 0.88rem;
    line-height: 1.5;
}

.album-photos-section {
    margin-top: 14px;
}


.album-add-photo-toggle,
.album-settings-toggle {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid rgba(201, 214, 228, 0.6);
}

.album-add-photo-toggle > summary,
.album-settings-toggle > summary {
    cursor: pointer;
    font-size: 0.9rem;
    color: #e67e22;
    font-weight: 600;
    list-style: none;
    outline: none;
    user-select: none;
}

.album-add-photo-toggle > summary::-webkit-details-marker,
.album-settings-toggle > summary::-webkit-details-marker {
    display: none;
}

.album-add-photo-form,
.album-settings-form {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 12px;
}

.album-settings-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.album-thumb-zoom {
    display: block;
    width: 100%;
    padding: 0;
    border: none;
    background: none;
    cursor: zoom-in;
    line-height: 0;
}

.album-lightbox {
    border: none;
    border-radius: 16px;
    padding: 0;
    max-width: min(92vw, 960px);
    max-height: 92vh;
    overflow: hidden;
    background: #000;
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.55);
    position: fixed;
    inset: 0;
    margin: auto;
}

.album-lightbox::backdrop {
    background: rgba(0, 0, 0, 0.78);
}

.album-lightbox img {
    display: block;
    max-width: 100%;
    max-height: 92vh;
    object-fit: contain;
}

.album-lightbox-close {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: none;
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    font-size: 1rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    line-height: 1;
}

.album-lightbox-close:hover {
    background: rgba(0, 0, 0, 0.85);
}

/* ── Galerie communautaire ────────────────────────────────────────── */

.gallery-page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.gallery-page-title {
    margin: 0 0 4px;
    font-size: 1.25rem;
}

.gallery-page-sub {
    margin: 0;
    font-size: 0.9rem;
    color: #5b677a;
}

.gallery-cta-banner {
    display: flex;
    align-items: center;
    gap: 14px;
    background: linear-gradient(135deg, #f0fdf9, #e6f7f4);
    border: 1px solid rgba(39, 176, 152, 0.22);
    border-radius: 14px;
    padding: 14px 18px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.gallery-cta-icon {
    font-size: 2rem;
    line-height: 1;
}

.gallery-cta-copy {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.gallery-cta-copy strong {
    font-size: 0.95rem;
}

.gallery-cta-copy span {
    font-size: 0.85rem;
    color: #5b677a;
}

.gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 14px;
}

.gallery-card {
    border-radius: 14px;
    overflow: hidden;
    background: var(--white);
    border: 1px solid rgba(201, 214, 228, 0.7);
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.05);
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.gallery-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1);
}

.gallery-card--locked {
    opacity: 0.85;
}

.gallery-card-cover {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: #f0f5f4;
    text-decoration: none;
}

.gallery-card-img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.25s ease;
}

.gallery-card:hover .gallery-card-img {
    transform: scale(1.04);
}

.gallery-card-cover--empty {
    background: linear-gradient(135deg, #edf5f4, #e0eeec);
}

.gallery-card-cover--locked {
    background: linear-gradient(135deg, #ececec, #d8d8d8);
    cursor: default;
}

.gallery-cover-icon {
    font-size: 2.2rem;
    opacity: 0.55;
    line-height: 1;
}

.gallery-card-body {
    padding: 12px 14px 14px;
}

.gallery-card-title {
    font-weight: 600;
    font-size: 0.92rem;
    margin-bottom: 8px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gallery-locked-label {
    color: #8a9aac;
    font-style: italic;
    font-weight: 500;
}

.gallery-card-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.82rem;
    color: #5b677a;
    margin-bottom: 10px;
    flex-wrap: wrap;
}

.gallery-member-link {
    display: flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    color: inherit;
}

.gallery-member-avatar {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.gallery-member-initials {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #d5eeea;
    color: #1b6d63;
    font-size: 0.65rem;
    font-weight: 700;
    flex-shrink: 0;
}

.gallery-photo-count {
    color: #8a9aac;
    font-size: 0.78rem;
}

.gallery-card-action {
    font-size: 0.8rem;
    padding: 5px 12px;
}

.gallery-pending-label {
    font-size: 0.8rem;
    color: #8a9aac;
    font-style: italic;
}

@media (max-width: 600px) {
    .gallery-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }
    .gallery-page-header {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* Nuit */
body.community-theme-night .gallery-page-sub,
body.community-theme-night .gallery-card-meta,
body.community-theme-night .gallery-photo-count,
body.community-theme-night .gallery-cta-copy span {
    color: #a9bebd;
}

body.community-theme-night .gallery-card {
    background: rgba(21, 36, 39, 0.92);
    border-color: rgba(101, 132, 136, 0.3);
}

body.community-theme-night .gallery-card-cover {
    background: rgba(30, 50, 54, 0.9);
}

body.community-theme-night .gallery-card-cover--empty {
    background: linear-gradient(135deg, rgba(30, 55, 58, 0.9), rgba(24, 44, 47, 0.9));
}

body.community-theme-night .gallery-card-cover--locked {
    background: linear-gradient(135deg, rgba(35, 45, 48, 0.9), rgba(28, 38, 40, 0.9));
}

body.community-theme-night .gallery-cta-banner {
    background: rgba(27, 60, 56, 0.55);
    border-color: rgba(39, 176, 152, 0.2);
}

body.community-theme-night .gallery-member-initials {
    background: rgba(44, 104, 97, 0.42);
    color: #d5f3ec;
}

body.community-theme-night .gallery-locked-label {
    color: #6a8a88;
}

.member-list-item-stack {
    align-items: flex-start;
    flex-direction: column;
}

body.community-theme-night .album-thumb-actions {
    background: rgba(20, 33, 36, 0.92);
    border-top-color: rgba(101, 132, 136, 0.35);
}

body.community-theme-night .album-cover-badge {
    background: rgba(44, 104, 97, 0.42);
    color: #d5f3ec;
}


body.community-theme-night .album-add-photo-toggle,
body.community-theme-night .album-settings-toggle {
    border-top-color: rgba(101, 132, 136, 0.35);
}

body.community-theme-night .album-description {
    color: #a9bebd;
}

body.community-theme-night .album-add-photo-toggle > summary,
body.community-theme-night .album-settings-toggle > summary {
    color: #f5a554;
}

body.community-theme-night .notification-item {
    background: rgba(33, 54, 58, 0.96);
}

body.community-theme-night .notification-item.is-unread {
    border-color: rgba(126, 216, 207, 0.28);
    background: rgba(27, 46, 49, 0.98);
}

body.community-theme-night .notification-item-badge {
    background: rgba(21, 36, 39, 0.92);
    color: #9fe5dd;
}

body.community-theme-night .notification-item-text {
    color: #f2f8f7;
}

body.community-theme-night .notification-item-meta {
    color: #a9bebd;
}
.classified-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.classified-form-actions,
.classified-actions,
.classified-tags,
.classified-filters {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.classified-filters {
    margin-bottom: 18px;
}

.classified-filters .admin-input {
    flex: 1 1 180px;
}

.classified-list,
.classifieds-list {
    display: grid;
    gap: 16px;
}

.classified-card {
    display: grid;
    grid-template-columns: minmax(170px, 220px) minmax(0, 1fr);
    gap: 0;
    overflow: hidden;
    border: 1px solid #eef2f7;
    border-radius: 20px;
    background: #fff;
}

.classified-card-no-image {
    grid-template-columns: 1fr;
}

.classified-card.is-closed {
    opacity: .74;
}

.classified-image {
    min-height: 100%;
    background: var(--bg-light);
}

.classified-image img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 220px;
    object-fit: cover;
}

.classified-body {
    padding: 18px;
}

.classified-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 10px;
}

.classified-head h3 {
    margin: 8px 0 0;
    color: var(--dark);
}

.classified-tags span {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 6px 10px;
    border-radius: 999px;
    background: #edf9f7;
    color: #26766c;
    font-size: .8rem;
    font-weight: 800;
}

.classified-price {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 7px 12px;
    border-radius: 999px;
    background: #fff3ec;
    color: #b44b2f;
    white-space: nowrap;
}

.classified-meta {
    margin: 0 0 12px;
    color: #5b677a;
    line-height: 1.55;
}

.classified-description {
    margin: 0 0 16px;
    color: var(--dark);
    line-height: 1.65;
}

body.community-theme-night .classified-card {
    background: #192a2ef5;
    border-color: #65848842;
}

body.community-theme-night .classified-head h3,
body.community-theme-night .classified-description {
    color: #f2f8f7;
}

body.community-theme-night .classified-meta {
    color: #a9bebd;
}

body.community-theme-night .classified-tags span {
    background: #254643;
    color: #c7f3ed;
}

body.community-theme-night .classified-price {
    background: #553026;
    color: #ffd8c8;
}

body.site-theme-night .classified-card {
    background: #192a2ef5;
    border-color: #65848842;
}

body.site-theme-night .classified-head h3,
body.site-theme-night .classified-description {
    color: #f2f8f7;
}

body.site-theme-night .classified-meta {
    color: #a9bebd;
}

body.site-theme-night .classified-tags span {
    background: #254643;
    color: #c7f3ed;
}

body.site-theme-night .classified-price {
    background: #553026;
    color: #ffd8c8;
}

body.site-theme-night .mini-action-secondary {
    background: rgba(31, 49, 53, 0.96);
    color: #eef6f5;
}

@media (max-width: 720px) {
    .classified-form-grid,
    .classified-card {
        grid-template-columns: 1fr;
    }

    .classified-head {
        flex-direction: column;
    }

    .classified-price {
        white-space: normal;
    }

    .classified-actions .inline-form,
    .classified-actions .report-form {
        width: 100%;
    }

    .classified-actions .mini-action,
    .classified-actions .report-select,
    .classified-form-actions .btn-search,
    .classified-form-actions .mini-action {
        width: 100%;
        justify-content: center;
    }
}
/* Caché sur desktop — visible uniquement via le media query mobile */
.mobile-bottom-nav { display: none; }

@media (max-width: 1024px) {
    .hero {
        padding: 64px 5% 48px;
    }

    .hero-text h1 {
        font-size: 2.85rem;
    }

    .hero-paths {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-link-grid,
    .home-member-grid,
    .blog-grid,
    .seo-hub-choice-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-community-section {
        grid-template-columns: 1fr;
    }

    .community-public-hero,
    .community-feature-grid {
        grid-template-columns: 1fr;
    }
}

/* ── Tablettes portrait & grands téléphones (≤768 px) ── */
@media (max-width: 768px) {

    /* Fiche lieu : passer en colonne une étape plus tôt */
    .camping-showcase,
    .camping-layout {
        grid-template-columns: 1fr;
    }

    .camping-showcase-media {
        min-height: 280px;
        max-height: 320px;
        position: relative;
        top: auto;
    }

    .camping-showcase-copy {
        padding: 26px 22px;
    }

    .camping-similar-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    /* Layout communauté : passer en colonne sur tablettes étroites */
    .community-layout {
        display: flex;
        flex-direction: column;
        align-items: stretch;
    }

    .community-main,
    .community-sidebar {
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    .community-main {
        order: 1;
    }

    .community-sidebar {
        order: 2;
    }

}


@media (max-width: 720px) {
    .site-footer-inner {
        grid-template-columns: 1fr;
    }

    .logo {
        width: 76px;
        height: 76px;
        padding: 0;
    }

    .logo-image {
        width: 100%;
        height: 100%;
        max-width: none;
    }

    /* Annuaire mobile : supprimer hero et stats */
    .directory-page {
        padding-top: 16px;
    }

    .directory-hero,
    .directory-hero-stats {
        display: none;
    }

    .directory-grid {
        grid-template-columns: 1fr;
    }

    /* Carte : masquer tout le header, garder juste les boutons + carte */
    .directory-map-head {
        display: none;
    }

    /* Boutons filtre carte : scroll horizontal */
    .directory-map-tools {
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .directory-map-tools::-webkit-scrollbar { display: none; }

    /* Filtres rapides : scroll horizontal (1 ligne propre) */
    .directory-theme-options {
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
        padding-bottom: 4px;
        gap: 8px;
    }

    .directory-theme-options::-webkit-scrollbar { display: none; }

    .directory-check,
    .directory-theme-pill {
        flex: 0 0 auto;
    }

    .directory-check span,
    .directory-theme-pill span {
        white-space: nowrap;
    }

    /* Carte : titre seul, compact */
    .directory-map-head {
        margin-bottom: 10px;
    }

    .directory-filters-card {
        padding: 18px;
    }

    .directory-filters {
        gap: 14px;
    }

    .directory-search-main,
    .directory-advanced-grid {
        grid-template-columns: 1fr;
    }

    .directory-submit-field {
        width: 100%;
    }

    .directory-submit-field .btn-search {
        width: 100%;
    }

    .directory-results-bar {
        align-items: flex-start;
    }

    .directory-map-head {
        flex-direction: column;
    }

    /* Carte pleine largeur sur mobile : retirer le cadre blanc */
    .directory-map-panel {
        background: none;
        border-radius: 0;
        box-shadow: none;
        padding: 0;
        margin: 0;
    }

    .directory-map-tools {
        padding: 0 4% 10px;
    }

    .directory-map {
        height: 360px;
        min-height: 300px;
        border-radius: 0;
    }

    .directory-results-count {
        width: 100%;
    }

    .directory-reset-link-inline {
        margin-left: 0;
    }

    .directory-grid .card-head {
        flex-direction: column;
    }

    .camping-showcase,
    .camping-layout {
        grid-template-columns: 1fr;
    }

    .camping-showcase-media {
        min-height: 280px;
    }

    .camping-showcase-copy {
        padding: 26px 22px;
    }

    .camping-similar-grid {
        grid-template-columns: 1fr;
    }

    .camping-facts-grid,
    .camping-detail-grid {
        grid-template-columns: 1fr;
    }

    .camping-photo-grid {
        grid-template-columns: 1fr;
    }

    .camping-section-head {
        flex-direction: column;
        align-items: flex-start;
    }

    .camping-action-bar-controls,
    .camping-rating-row {
        width: 100%;
        justify-content: flex-start;
    }

    .camping-action-bar-header {
        align-items: center;
    }

    .camping-rating-head {
        width: 100%;
        align-items: flex-start;
    }

    .camping-rating-row {
        flex-direction: column;
        align-items: stretch;
    }

    .camping-rating-panel-compact {
        flex-basis: 100%;
    }

    .camping-review-head {
        flex-direction: column;
    }

    .camping-review-side {
        text-align: left;
    }

    .hero {
        padding: 40px 5% 34px;
        min-height: auto;
        border-radius: 0 0 24px 24px;
    }

    .hero::before {
        background: linear-gradient(180deg, rgba(7, 22, 27, 0.84) 0%, rgba(11, 38, 45, 0.72) 58%, rgba(13, 45, 53, 0.64) 100%);
    }

    .hero-media img {
        object-position: center top;
    }

    body.home-page .site-header {
        padding-top: 14px;
    }

    body.home-page .site-nav {
        width: auto;
        padding: 10px 12px;
        border-radius: 20px;
    }

    body.home-page .hero {
        padding-top: 210px;
    }

    .hero-text h1 {
        font-size: 2.05rem;
        line-height: 1.08;
        margin-bottom: 18px;
    }

    .hero-kicker {
        margin-bottom: 14px;
    }

    .hero-subtitle {
        margin-bottom: 18px;
    }

    .search-container {
        padding: 10px;
    }

    .search-container input {
        min-width: 0;
        width: 100%;
    }

    .search-container .btn-search {
        width: 100%;
        min-height: 48px;
    }

    .hero-benefits {
        margin-bottom: 18px;
    }

    .hero-emoji {
        font-size: 96px;
    }

    .hero-actions {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
        margin-top: 16px;
    }

    .hero-actions .btn-search.btn-link {
        width: 100%;
        justify-content: center;
        text-align: center;
        padding: 15px 18px;
        font-size: 1rem;
        box-shadow: 0 14px 28px rgba(0, 0, 0, 0.2);
    }

    .hero-actions .hero-secondary-link {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    .hero-secondary-link-ghost {
        width: 100%;
        justify-content: center;
        min-height: 48px;
    }

    .hero-reassurance {
        width: 100%;
        text-align: center;
        font-size: 0.95rem;
    }

    .hero-paths {
        grid-template-columns: 1fr;
        gap: 10px;
        margin-top: 18px;
    }

    .hero-path-card {
        padding: 14px 16px;
    }

    .home-community-section {
        width: calc(100% - 28px);
        max-width: 640px;
        margin-top: -18px;
        padding: 22px;
        border-radius: 18px;
    }

    .home-community-copy h2 {
        font-size: 1.55rem;
    }

    .home-community-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .home-community-actions .btn-search,
    .home-community-actions .home-section-link {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    .home-community-grid {
        grid-template-columns: 1fr;
    }

    .home-community-item {
        min-height: auto;
    }

    .community-public-main {
        width: calc(100% - 28px);
        padding-top: 24px;
    }

    .community-public-hero,
    .community-public-cta {
        padding: 24px;
        border-radius: 20px;
    }

    .community-public-hero h1 {
        font-size: 2.25rem;
    }

    .community-public-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .community-public-actions .btn-search,
    .community-public-actions .home-section-link,
    .community-public-cta .btn-search {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    .community-public-side {
        min-height: auto;
    }

    .hero-community-card {
        margin-top: 18px;
        padding: 18px 18px 16px;
        border-radius: 20px;
    }

    .hero-community-card h2 {
        font-size: 1.35rem;
        margin: 12px 0 8px;
    }

    .hero-community-card p {
        font-size: 0.98rem;
        line-height: 1.55;
    }

    .hero-community-points {
        gap: 8px;
        margin-top: 14px;
    }

    .hero-community-points span {
        width: 100%;
        justify-content: center;
        padding: 11px 12px;
    }

    .hero-community-cta {
        padding: 14px;
    }

    .hero-signup-grid {
        grid-template-columns: 1fr;
    }

    .home-section-heading {
        flex-direction: column;
        align-items: flex-start;
    }

    .home-link-grid {
        grid-template-columns: 1fr;
    }

    .home-member-grid {
        grid-template-columns: 1fr;
    }

    .blog-grid {
        grid-template-columns: 1fr;
    }

    .seo-hub-facts,
    .seo-hub-choice-grid,
    .seo-hub-faq-list {
        grid-template-columns: 1fr;
    }

    .blog-hero,
    .article-card {
        padding: 0;
    }

    .blog-hero h1,
    .article-header h1 {
        font-size: 2.2rem;
    }

    .blog-hero {
        padding: 26px 22px;
    }

    .article-hero-visual,
    .article-hero-illustration {
        min-height: 260px;
    }

    .article-header-copy {
        margin: -34px 18px 0;
        padding: 22px 20px 22px;
        border-radius: 24px 24px 0 0;
    }

    .article-content {
        padding: 24px 22px 0;
    }

    .article-footer {
        padding: 18px 22px 26px;
    }

    .search-container {
        flex-direction: column;
    }

    .site-nav {
        width: 100%;
        justify-content: flex-start;
    }

    .nav-welcome {
        margin-left: 0;
    }

    .card-actions {
        flex-direction: column;
    }

    .card-action-group {
        justify-content: center;
    }

    .admin-panel {
        padding: 24px;
    }

    .manual-grid {
        grid-template-columns: 1fr;
    }

    .admin-relation-row {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .member-hero {
        padding: 28px 24px;
    }

    .community-layout {
        display: flex;
        flex-direction: column;
        align-items: stretch;
    }

    .community-main,
    .community-sidebar {
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    .community-main {
        order: 1;
    }

    .community-sidebar {
        order: 2;
    }

    .community-card,
    .community-hero {
        padding: 24px;
    }

    .onboarding-score {
        width: 100%;
        box-sizing: border-box;
    }

    .onboarding-step {
        grid-template-columns: auto minmax(0, 1fr);
        align-items: flex-start;
    }

    .onboarding-step-link,
    .onboarding-step-status {
        grid-column: 2;
        justify-self: flex-start;
    }

    .post-header,
    .member-list-item {
        align-items: flex-start;
        flex-direction: column;
    }

    .community-hero {
        align-items: flex-start;
    }

    .community-hero-actions {
        width: 100%;
    }

    .community-hero-actions .btn-search,
    .community-hero-actions .mini-action {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    .community-hero-stats {
        justify-content: flex-start;
    }

    .member-tabs {
        position: sticky;
        top: 0;
        z-index: 90;
        display: flex;
        flex-wrap: nowrap;
        gap: 8px;
        margin: -4px -4% 14px;
        padding: 8px 4%;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        scrollbar-width: none;
        background: rgba(248, 251, 250, 0.92);
        backdrop-filter: blur(14px);
        border-bottom: 1px solid rgba(42, 76, 78, 0.08);
    }

    .member-tabs::-webkit-scrollbar {
        display: none;
    }

    .member-tab {
        flex: 0 0 auto;
        min-height: 38px;
        padding: 9px 13px;
        border-radius: 999px;
        border: 1px solid rgba(42, 76, 78, 0.1);
        background: rgba(255, 255, 255, 0.82);
        box-shadow: none;
        color: #52636a;
        font-size: 0.82rem;
        line-height: 1;
        white-space: nowrap;
    }

    .member-tab.is-active {
        border-color: transparent;
        box-shadow: 0 8px 20px rgba(213, 91, 53, 0.18);
    }

    /* ── Barre de navigation mobile fixée en bas ── */
    .mobile-bottom-nav {
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        background: #fff;
        border-top: 1px solid #e8eff0;
        box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.08);
        z-index: 500;
        overflow-x: auto;
        scrollbar-width: none;
        padding-bottom: env(safe-area-inset-bottom, 0px);
        min-height: calc(58px + env(safe-area-inset-bottom, 0px));
        backdrop-filter: blur(14px);
    }

    .mobile-bottom-nav::-webkit-scrollbar { display: none; }

    .mbn-item {
        flex: 1 1 0;
        min-width: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 3px;
        padding: 7px 2px 9px;
        text-decoration: none;
        color: #9aa5b4;
        position: relative;
        transition: color 0.15s;
    }

    .mbn-item.is-active { color: var(--orange, #e67e22); }

    .mbn-icon  { width: 22px; height: 22px; flex-shrink: 0; }

    .mbn-label {
        font-size: 0.6rem;
        font-weight: 700;
        white-space: nowrap;
        letter-spacing: 0.01em;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 100%;
    }

    .mbn-badge {
        position: absolute;
        top: 4px;
        left: 50%;
        transform: translateX(4px);
        background: #e74c3c;
        color: #fff;
        border-radius: 999px;
        min-width: 16px;
        height: 16px;
        font-size: 0.6rem;
        font-weight: 700;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0 4px;
        border: 2px solid #fff;
    }

    /* Page communauté : padding réduit sur mobile */
    .community-page {
        padding-top: 12px;
        padding-left: 4%;
        padding-right: 4%;
        padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px));
    }

    /* Cards : padding et gap réduits */
    .community-card,
    .community-hero {
        padding: 16px;
        border-radius: 18px;
        box-shadow: 0 10px 28px rgba(0,0,0,0.07);
    }

    .community-main,
    .community-sidebar,
    .community-feed {
        gap: 12px;
    }

    .post-card {
        gap: 14px;
    }

    .section-heading {
        margin-bottom: 12px;
    }

    .section-heading h2,
    .section-heading h3 {
        font-size: 1.18rem;
        line-height: 1.18;
        margin-bottom: 5px;
    }

    .section-heading p {
        font-size: 0.9rem;
        line-height: 1.4;
    }

    .post-composer {
        gap: 8px;
    }

    .post-composer-header {
        margin-bottom: 0;
    }

    .post-composer-textarea {
        min-height: 78px;
        border-radius: 14px;
        font-size: 0.98rem;
    }

    .post-composer-prompt-wrap {
        padding: 8px 10px;
        border-radius: 12px;
        gap: 8px;
    }

    .post-composer-photo-zone {
        padding: 11px 12px;
        border-radius: 12px;
    }

    .post-composer-photo-icon {
        font-size: 1.25rem;
    }

    .post-composer-photo-text {
        font-size: 0.9rem;
    }

    .post-composer-submit {
        width: 100%;
        min-height: 44px;
        margin-left: 0;
        border-radius: 999px;
    }

    .post-header {
        align-items: flex-start;
        gap: 10px;
    }

    .post-avatar {
        width: 44px;
        height: 44px;
        min-width: 44px;
        font-size: 0.92rem;
    }

    .post-online-dot {
        width: 10px;
        height: 10px;
        bottom: 1px;
        right: 1px;
    }

    .post-meta {
        min-width: 0;
        gap: 2px;
    }

    .post-meta strong,
    .post-meta .profile-link {
        max-width: 100%;
        overflow-wrap: anywhere;
    }

    .post-meta span,
    .post-meta time {
        font-size: 0.82rem;
        line-height: 1.25;
    }

    .post-content {
        font-size: 0.98rem;
        line-height: 1.55;
    }

    .post-joined-banner {
        gap: 10px;
        padding: 12px;
        border-radius: 14px;
        align-items: flex-start;
    }

    .post-avatar-new-wrap {
        padding: 4px 0 0;
    }

    .post-avatar-new {
        width: min(68vw, 220px);
        height: min(68vw, 220px);
        min-width: 0;
        min-height: 0;
        border-width: 3px;
    }

    .post-image-wrapper {
        border-radius: 14px;
    }

    .post-image-grid .post-image {
        height: 150px;
        max-height: 150px;
    }

    .post-engagement {
        gap: 8px 10px;
    }

    .post-delete-btn {
        margin-left: 0;
    }

    .comments-block {
        padding-top: 14px;
    }

    .comments-block h4 {
        margin-bottom: 10px;
        font-size: 1rem;
    }

    .comment-list {
        gap: 8px;
        margin-bottom: 12px;
    }

    .comment-item {
        padding: 10px 12px;
        border-radius: 12px;
    }

    .comment-form > button[type="submit"] {
        width: 100%;
        min-height: 42px;
        justify-content: center;
    }

    /* Hero : masqué sur mobile (info redondante) */
    .community-hero {
        display: none;
    }

    /* Page profil : sidebar (infos membre) avant les posts */
    .community-layout--profile .community-sidebar {
        order: 1;
    }
    .community-layout--profile .community-main {
        order: 2;
    }

    /* Sidebar fil : masquer la fiche perso (redondante sur le feed, mais PAS sur /profil) */
    .community-layout:not(.community-layout--profile) .community-sidebar .profile-card,
    .community-sidebar .sidebar-feed-link {
        display: none;
    }

    .community-sidebar .member-list .member-list-item:nth-child(n+4) {
        display: none;
    }

    /* Formulaire recherche membres : 1 colonne sur mobile */
    .member-search-row {
        grid-template-columns: 1fr;
    }

    .member-search-btn {
        width: 100%;
    }

    /* Grille membres : 2 colonnes fixes */
    .member-cards-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .member-card {
        padding: 12px;
        border-radius: 16px;
        gap: 10px;
    }

    .member-card-avatar {
        width: 46px;
        height: 46px;
        min-width: 46px;
    }

    /* Messagerie : compose actions scrollable */
    .message-compose-actions {
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 4px;
    }

    body.community-theme-night .member-tabs {
        background: rgba(18, 35, 38, 0.92);
        border-bottom-color: rgba(117, 221, 199, 0.12);
    }

    body.community-theme-night .member-tab {
        background: rgba(255, 255, 255, 0.07);
        border-color: rgba(255, 255, 255, 0.08);
        color: #c8d8d5;
    }

    body.community-theme-night .member-tab.is-active {
        color: #fff;
    }

    body.community-theme-night .mobile-bottom-nav {
        background: rgba(20, 36, 39, 0.96);
        border-top-color: rgba(117, 221, 199, 0.12);
    }
}

@media (max-width: 460px) {
    .member-cards-grid {
        grid-template-columns: 1fr;
    }

    .post-image-grid .post-image {
        height: 132px;
        max-height: 132px;
    }
}