/* ==========================================================================
   ZELYRO — thème partagé (beige / sauge, sobre et éditorial)
   Toutes les pages du frontend chargent ce fichier.
   Les couleurs, la typographie et les rayons se règlent dans :root.
   ========================================================================== */

/* Polices hébergées avec le site (aucune requête vers Google Fonts). */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url('vendor/fonts/inter-latin-wght-normal.woff2') format('woff2');
}
@font-face {
    font-family: 'Playfair Display';
    font-style: normal;
    font-weight: 400 900;
    font-display: swap;
    src: url('vendor/fonts/playfair-display-latin-wght-normal.woff2') format('woff2');
}
@font-face {
    font-family: 'Playfair Display';
    font-style: italic;
    font-weight: 400 900;
    font-display: swap;
    src: url('vendor/fonts/playfair-display-latin-wght-italic.woff2') format('woff2');
}

:root {
    --bg: #F6F2EA;
    --surface: #FFFDF9;
    --surface-2: #F1ECE1;
    --line: #E3DCCC;
    --line-strong: #D2C9B4;

    --ink: #1F2A24;
    --ink-2: #465149;
    --ink-3: #6A7168;

    --sage-50: #EEF2E8;
    --sage-100: #E1E8D9;
    --sage-300: #A9B9A2;
    --sage-600: #4F6353;
    --sage-700: #3F5245;

    --hot: #9A3F27;   --hot-bg: #F5E2DA;
    --warm: #7A5C14;  --warm-bg: #F3E9CF;
    --cold: #5E655C;  --cold-bg: #ECE8DE;

    --danger: #8E3A2A; --danger-bg: #F7E6E1; --danger-line: #EBCFC7;

    --radius: 12px;
    --radius-sm: 8px;
    --shadow-hover: 0 8px 24px rgba(31, 42, 36, 0.07);

    --serif: 'Playfair Display', Georgia, 'Times New Roman', serif;
    --logo-font: var(--serif);
    --sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* ---------- Base ---------- */
* { margin: 0; padding: 0; box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
    font-family: var(--sans);
    font-size: 15px;
    line-height: 1.5;
    color: var(--ink);
    background: var(--bg);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-variant-numeric: lining-nums;
}
a:focus-visible, button:focus-visible, .tab:focus-visible, .filter-button:focus-visible {
    outline: 2px solid var(--sage-600);
    outline-offset: 2px;
}
::selection { background: var(--sage-100); color: var(--ink); }

/* ---------- En-tête ---------- */
header {
    background: rgba(246, 242, 234, 0.92);
    -webkit-backdrop-filter: saturate(140%) blur(10px);
    backdrop-filter: saturate(140%) blur(10px);
    border-bottom: 1px solid var(--line);
    padding: 16px 0;
    position: sticky;
    top: 0;
    z-index: 1000;
}
.header-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
}
.logo {
    display: flex;
    align-items: center;
    gap: 11px;
    font-family: var(--logo-font);
    font-size: 23px;
    font-weight: 500;
    letter-spacing: 0.14em;
    color: var(--ink);
}
.logo::before {
    content: "";
    width: 10px;
    height: 10px;
    background: var(--sage-600);
    border-radius: 2px;
    transform: rotate(45deg);
    flex: none;
}
nav { display: flex; gap: 32px; align-items: center; }
nav a {
    position: relative;
    color: var(--ink-2);
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    padding: 6px 0;
    transition: color 0.2s ease;
    cursor: pointer;
}
nav a:hover { color: var(--ink); }
nav a.active { color: var(--ink); border-bottom: none; padding-bottom: 6px; }
nav a.active::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: -17px;
    height: 2px;
    background: var(--sage-600);
}
.user-info { display: flex; align-items: center; gap: 16px; }
.user-email { font-size: 13px; color: var(--ink-3); }
.logout-btn {
    background: transparent;
    color: var(--ink-2);
    border: 1px solid var(--line-strong);
    padding: 7px 14px;
    border-radius: var(--radius-sm);
    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.logout-btn:hover { background: var(--surface-2); color: var(--ink); border-color: var(--ink-3); }

/* ---------- Mise en page ---------- */
.container { max-width: 1200px; margin: 0 auto; padding: 48px 24px 72px; }
.titre-ligne {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 36px;
    gap: 20px;
    flex-wrap: wrap;
}
.page-title {
    font-family: var(--serif);
    font-weight: 500;
    font-size: 40px;
    line-height: 1.1;
    letter-spacing: -0.015em;
    color: var(--ink);
    margin-bottom: 10px;
}
.page-subtitle { color: var(--ink-2); font-size: 15px; line-height: 1.6; }
.container > .page-subtitle { margin-bottom: 36px; }
.back-link {
    display: inline-block;
    color: var(--ink-3);
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 18px;
    transition: color 0.2s ease;
}
.back-link:hover { color: var(--sage-700); }

.content-wrapper, .content-grid { display: grid; gap: 28px; align-items: start; }
@media (max-width: 900px) {
    .content-wrapper, .content-grid { grid-template-columns: 1fr !important; }
}

/* ---------- Boutons ---------- */
.btn, .edit-button {
    display: inline-block;
    background: var(--sage-600);
    color: #fff;
    border: 1px solid var(--sage-600);
    padding: 11px 22px;
    border-radius: var(--radius-sm);
    font-family: inherit;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.01em;
    cursor: pointer;
    white-space: nowrap;
    text-decoration: none;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
.btn:hover, .edit-button:hover { background: var(--sage-700); border-color: var(--sage-700); transform: translateY(-1px); box-shadow: var(--shadow-hover); }
.btn:active, .edit-button:active { transform: translateY(0); }
.btn:disabled { opacity: 0.5; cursor: default; }
@media (prefers-reduced-motion: reduce) {
    .btn, .edit-button { transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease; }
    .btn:hover, .edit-button:hover { transform: none; }
}
.btn.secondary {
    background: transparent;
    color: var(--ink);
    border: 1px solid var(--line-strong);
    margin-left: 10px;
}
.btn.secondary:hover { background: var(--surface-2); border-color: var(--ink-3); }
.edit-button { margin-top: 12px; padding: 10px 18px; }

/* ---------- Panneaux ---------- */
.panel {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 28px;
    margin-bottom: 28px;
}
.panel-header { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 8px; gap: 16px; }
.panel-title {
    font-family: var(--serif);
    font-size: 21px;
    font-weight: 500;
    letter-spacing: -0.005em;
    color: var(--ink);
    margin-bottom: 8px;
}
.panel-header .panel-title { margin-bottom: 0; }
.panel-count { font-size: 13px; color: var(--ink-3); white-space: nowrap; font-variant-numeric: tabular-nums; }
.panel-note { font-size: 13px; color: var(--ink-2); margin-bottom: 22px; line-height: 1.65; }
.mail-capture-etapes { margin: 16px 0 4px; padding-left: 20px; font-size: 13px; color: var(--ink-2); line-height: 1.7; }
.mail-capture-etapes li { margin-bottom: 6px; }
.mail-capture-etapes li::marker { color: var(--sage-600); font-weight: 600; }
.section-divider { border-top: 1px solid var(--line); margin: 26px 0 22px; }

/* ---------- Formulaires ---------- */
.form-row { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0 20px; }
@media (max-width: 800px) { .form-row { grid-template-columns: 1fr; } }
.form-group { margin-bottom: 20px; }
label {
    display: block;
    color: var(--ink-3);
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    margin-bottom: 8px;
}
.obligatoire { color: var(--hot); }
input, select, textarea {
    width: 100%;
    padding: 11px 13px;
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-sm);
    font-size: 14px;
    font-family: inherit;
    color: var(--ink);
    background: var(--surface);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
input::placeholder, textarea::placeholder { color: #9AA096; }
input:focus, select:focus, textarea:focus {
    outline: none;
    border-color: var(--sage-600);
    box-shadow: 0 0 0 3px rgba(79, 99, 83, 0.16);
}
textarea { resize: vertical; min-height: 90px; line-height: 1.6; }
.recherche { margin-bottom: 16px; }

/* ---------- Badges ---------- */
.lead-badge, .bien-type {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.01em;
}
.badge-hot { background: var(--hot-bg); color: var(--hot); }
.badge-warm { background: var(--warm-bg); color: var(--warm); }
.badge-cold { background: var(--cold-bg); color: var(--cold); }
.bien-type { background: var(--sage-100); color: var(--sage-700); margin-top: 12px; }

/* ---------- Cartes : prospects ---------- */
.leads-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; }
.lead-card, .bien-card, .match-card, .lead-item {
    background: var(--surface);
    border: 1px solid var(--line);
    border-left: 3px solid var(--sage-600);
    border-radius: var(--radius);
    transition: box-shadow 0.25s ease, border-color 0.25s ease;
}
.lead-card:hover, .bien-card:hover, .match-card:hover, .lead-item:hover {
    box-shadow: var(--shadow-hover);
    border-color: var(--line-strong);
    border-left-color: var(--sage-600);
}
.lead-card { padding: 22px; }
.lead-card.hot, .lead-item.hot { border-left-color: var(--hot); }
.lead-card.warm, .lead-item.warm { border-left-color: #B8902F; }
.lead-card.cold, .lead-item.cold { border-left-color: #A7AC9E; }
.lead-card.hot:hover, .lead-item.hot:hover { border-left-color: var(--hot); }
.lead-card.warm:hover, .lead-item.warm:hover { border-left-color: #B8902F; }
.lead-card.cold:hover, .lead-item.cold:hover { border-left-color: #A7AC9E; }

.lead-name {
    font-family: var(--serif);
    font-size: 20px;
    font-weight: 500;
    color: var(--ink);
    margin-bottom: 14px;
}
.lead-field { display: flex; margin-bottom: 9px; font-size: 14px; }
.lead-label { color: var(--ink-3); font-weight: 500; width: 84px; flex: none; }
.lead-value { color: var(--ink); flex: 1; word-break: break-word; }
.lead-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--line);
}
.lien-fiche { font-size: 13px; color: var(--sage-700); text-decoration: none; font-weight: 600; }
.lien-fiche:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Cartes : biens ---------- */
.biens-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 20px; }
.bien-card { padding: 22px; }
.bien-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 10px; }
.bien-titre { font-family: var(--serif); font-size: 19px; font-weight: 500; color: var(--ink); line-height: 1.25; }
.bien-prix { font-size: 15px; font-weight: 600; color: var(--sage-700); white-space: nowrap; font-variant-numeric: tabular-nums; }
.bien-adresse { font-size: 13px; color: var(--ink-3); margin-bottom: 14px; }
.bien-field { display: flex; margin-bottom: 8px; font-size: 14px; }
.bien-label { color: var(--ink-3); font-weight: 500; width: 90px; flex: none; }
.bien-value { color: var(--ink); flex: 1; }
.bien-details { font-size: 13px; color: var(--ink-2); }
.bien-desc { font-size: 13px; color: var(--ink-2); line-height: 1.65; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }

/* Liste défilante du dashboard */
.biens-liste { max-height: 520px; overflow-y: auto; padding-right: 8px; }
.biens-liste .bien-card { padding: 16px 18px; margin-bottom: 12px; border-left-width: 3px; }
.biens-liste .bien-titre { font-size: 16px; }

/* ---------- Tableau de bord ---------- */
.stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px; margin-bottom: 36px; }
.stat-card {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 26px 28px;
    text-align: left;
}
.stat-value {
    font-family: var(--serif);
    font-size: 48px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: -0.02em;
    color: var(--sage-700);
    margin-bottom: 12px;
    font-variant-numeric: lining-nums;
}
.stat-label { color: var(--ink-3); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.09em; }
.chart-wrapper { position: relative; height: 280px; }

/* ---------- Matching ---------- */
.filters {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 16px 20px;
    margin-bottom: 28px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.filter-button {
    padding: 8px 18px;
    border: 1px solid var(--line-strong);
    border-radius: 999px;
    cursor: pointer;
    background: transparent;
    font-family: inherit;
    font-weight: 500;
    font-size: 13px;
    color: var(--ink-2);
    transition: all 0.2s ease;
}
.filter-button:hover { border-color: var(--sage-600); color: var(--sage-700); }
.filter-button.active { background: var(--sage-600); color: #fff; border-color: var(--sage-600); }

.leads-panel { max-height: 640px; overflow-y: auto; }
.lead-item { padding: 20px; margin-bottom: 14px; cursor: pointer; }
.lead-item.selected { background: var(--sage-50); border-color: var(--sage-300); }
.lead-item .lead-badge { margin-top: 10px; }
.lead-item .lead-label { width: 90px; }
.lead-item .lead-value { word-break: break-all; }

.match-card { padding: 20px; margin-bottom: 14px; }
.match-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 12px; }
.match-title { font-family: var(--serif); font-size: 18px; font-weight: 500; color: var(--ink); margin-bottom: 4px; }
.match-address { font-size: 13px; color: var(--ink-3); }
.match-score {
    background: var(--sage-600);
    color: #fff;
    padding: 5px 13px;
    border-radius: 999px;
    font-weight: 600;
    font-size: 13px;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}
.match-field { font-size: 14px; color: var(--ink-2); margin-bottom: 6px; }
.match-price { font-size: 16px; font-weight: 600; color: var(--ink); margin-top: 10px; font-variant-numeric: tabular-nums; }

/* ---------- Fiche prospect / détails ---------- */
.detail-block { background: var(--surface-2); border-radius: var(--radius-sm); padding: 14px 16px; margin-bottom: 12px; }
.detail-label { color: var(--ink-3); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.09em; margin-bottom: 4px; }
.detail-value { color: var(--ink); font-weight: 500; font-size: 15px; }

.quality-box { border-radius: var(--radius-sm); padding: 22px; margin-bottom: 16px; text-align: center; }
.quality-hot { background: var(--hot-bg); }
.quality-warm { background: var(--warm-bg); }
.quality-cold { background: var(--cold-bg); }
.quality-label { font-family: var(--serif); font-size: 26px; font-weight: 500; margin-bottom: 6px; }
.quality-hot .quality-label { color: var(--hot); }
.quality-warm .quality-label { color: var(--warm); }
.quality-cold .quality-label { color: var(--cold); }
.quality-explain { font-size: 13px; color: var(--ink-2); line-height: 1.65; }

.info-box {
    background: var(--sage-50);
    border-left: 3px solid var(--sage-600);
    padding: 16px 18px;
    border-radius: var(--radius-sm);
    margin-bottom: 12px;
    font-size: 13px;
    color: var(--ink);
    line-height: 1.65;
}
.info-item { color: var(--ink); margin-bottom: 6px; font-size: 14px; }
.info-item:last-child { margin-bottom: 0; }

/* ---------- États ---------- */
.loading { text-align: center; padding: 56px 20px; color: var(--ink-3); }
.loader {
    display: inline-block;
    width: 32px;
    height: 32px;
    border: 3px solid var(--line);
    border-top-color: var(--sage-600);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
.error {
    background: var(--danger-bg);
    color: var(--danger);
    border: 1px solid var(--danger-line);
    padding: 16px 20px;
    border-radius: var(--radius-sm);
    font-size: 14px;
    text-align: center;
    margin-bottom: 28px;
}
.success {
    background: var(--sage-50);
    color: var(--sage-700);
    border: 1px solid var(--sage-100);
    padding: 14px 20px;
    border-radius: var(--radius-sm);
    font-size: 14px;
    margin-bottom: 24px;
}
.empty-state { text-align: center; padding: 44px 20px; color: var(--ink-3); font-size: 14px; line-height: 1.75; }

/* ---------- Connexion / inscription ---------- */
body.auth {
    position: relative;
    isolation: isolate;
    background: var(--bg);
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 24px;
}
body.auth::before {
    content: "";
    position: absolute; inset: 0; z-index: -1;
    background:
        radial-gradient(60% 50% at 15% 10%, #E1E9D6 0%, rgba(225, 233, 214, 0) 70%),
        radial-gradient(55% 55% at 90% 15%, #F0E6CC 0%, rgba(240, 230, 204, 0) 65%),
        radial-gradient(60% 55% at 85% 95%, #E6DCC3 0%, rgba(230, 220, 195, 0) 65%),
        radial-gradient(50% 45% at 5% 90%, #E2E8DA 0%, rgba(226, 232, 218, 0) 65%);
}
.auth-trust { margin-top: 22px; text-align: center; font-size: 12px; color: var(--ink-3); }
.auth-decor { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.auth-chip {
    position: absolute;
    display: inline-flex; align-items: center; gap: 9px;
    background: var(--surface); border: 1px solid var(--line-strong); border-radius: 999px;
    padding: 10px 18px 10px 13px; font-size: 12.5px; color: var(--ink); white-space: nowrap;
    box-shadow: 0 18px 34px -16px rgba(31, 42, 36, .32);
}
.auth-chip svg { width: 16px; height: 16px; color: var(--sage-600); flex: none; }
.auth-chip-score {
    display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 999px; flex: none;
    background: var(--sage-100); color: var(--sage-700); font-family: var(--serif); font-weight: 600; font-size: 12px;
}
.auth-chip-1 { top: 16%; left: 10%; }
.auth-chip-2 { bottom: 18%; right: 9%; }
@media (max-width: 760px) {
    .auth-decor { display: none; }
}
.auth-container {
    position: relative;
    z-index: 1;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 16px;
    box-shadow: 0 24px 60px -24px rgba(31, 42, 36, 0.18);
    width: 100%;
    max-width: 440px;
    padding: 44px 40px 40px;
}
.auth-header { text-align: center; margin-bottom: 32px; }
.auth-header h1 {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-family: var(--logo-font);
    font-weight: 500;
    color: var(--ink);
    font-size: 34px;
    letter-spacing: 0.14em;
    margin-bottom: 10px;
}
.auth-header h1 a { color: inherit; text-decoration: none; }
.auth-header h1::before {
    content: "";
    width: 11px;
    height: 11px;
    background: var(--sage-600);
    border-radius: 2px;
    transform: rotate(45deg);
    flex: none;
}
.auth-header p { font-family: var(--serif); font-style: italic; color: var(--ink-2); font-size: 15px; line-height: 1.5; }
.tabs { display: flex; gap: 0; margin-bottom: 28px; border-bottom: 1px solid var(--line); }
.tab {
    flex: 1;
    padding: 12px;
    text-align: center;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    color: var(--ink-3);
    font-size: 14px;
    font-weight: 500;
    transition: color 0.2s ease, border-color 0.2s ease;
}
.tab:hover { color: var(--ink); }
.tab.active { border-bottom-color: var(--sage-600); color: var(--ink); }
.auth-container button {
    width: 100%;
    padding: 13px;
    background: var(--sage-600);
    color: #fff;
    border: none;
    border-radius: var(--radius-sm);
    font-weight: 500;
    font-size: 14px;
    letter-spacing: 0.01em;
    font-family: inherit;
    cursor: pointer;
    margin-top: 10px;
    transition: background 0.2s ease;
}
.auth-container button:hover { background: var(--sage-700); }
.auth-container button:disabled { opacity: 0.55; cursor: default; }
.auth-container .error, .auth-container .success { text-align: left; margin-bottom: 20px; }

/* ---------- Mot de passe et compte ---------- */
.auth-link {
    display: block;
    text-align: right;
    margin: -6px 0 4px;
    font-size: 13px;
    color: var(--ink-3);
    text-decoration: none;
}
.auth-link:hover { color: var(--sage-700); text-decoration: underline; }
.auth-footer { text-align: center; margin-top: 24px; font-size: 13px; }
.auth-footer a { color: var(--ink-3); text-decoration: none; }
.auth-footer a:hover { color: var(--sage-700); text-decoration: underline; }
.auth-container .lead-text { font-size: 14px; color: var(--ink-2); line-height: 1.65; margin-bottom: 24px; }
.auth-container a.btn { display: block; text-align: center; text-decoration: none; margin-top: 10px; padding: 13px; }
.field-hint { font-size: 12px; color: var(--ink-3); margin-top: 6px; line-height: 1.5; }
.account-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: start; }
@media (max-width: 900px) { .account-grid { grid-template-columns: 1fr; } }
.info-list { display: grid; grid-template-columns: 110px 1fr; gap: 14px 16px; font-size: 14px; }
.info-list dt { color: var(--ink-3); }
.info-list dd { color: var(--ink); word-break: break-word; }
.panel form .btn { margin-top: 6px; }

/* ---------- Suivi des prospects ---------- */
.statut-badge {
    display: inline-block;
    padding: 3px 11px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    background: var(--surface-2);
    color: var(--ink-2);
    white-space: nowrap;
}
.statut-contacte { background: var(--sage-100); color: var(--sage-700); }
.statut-visite { background: #DCE8E4; color: #2F5D58; }
.statut-offre { background: #EADFC9; color: #6B4F12; }
.statut-signe { background: var(--sage-600); color: #fff; }
.statut-perdu { background: var(--cold-bg); color: var(--ink-3); text-decoration: line-through; }

/* Parcours d'un prospect : une pastille par étape, cliquable */
.pipeline { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
.etape {
    padding: 8px 13px;
    border: 1px solid var(--line-strong);
    border-radius: 999px;
    background: transparent;
    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    color: var(--ink-2);
    cursor: pointer;
    transition: all 0.2s ease;
}
.etape:hover { border-color: var(--sage-600); color: var(--sage-700); }
.etape.passee { background: var(--sage-50); border-color: var(--sage-300); color: var(--sage-700); }
.etape.active { background: var(--sage-600); border-color: var(--sage-600); color: #fff; }
.etape.active.perdu { background: var(--ink-3); border-color: var(--ink-3); }
.etape:disabled { opacity: 0.6; cursor: default; }

.btn.petit { padding: 8px 14px; font-size: 13px; }
.btn.danger { background: transparent; color: var(--danger); border-color: var(--danger-line); }
.btn.danger:hover { background: var(--danger-bg); border-color: var(--danger); }
.btn.danger.plein { background: var(--danger); color: #fff; border-color: var(--danger); }
.btn.danger.plein:hover { background: #7A3123; }
.btn-ligne { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.btn-ligne .btn.secondary { margin-left: 0; }

/* Relances */
.rappel { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.rappel:last-of-type { border-bottom: none; }
.rappel-case {
    flex: none;
    width: 22px; height: 22px;
    border: 1.5px solid var(--line-strong);
    border-radius: 6px;
    background: var(--surface);
    cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    color: #fff;
    font-size: 13px; line-height: 1;
    padding: 0;
}
.rappel-case:hover { border-color: var(--sage-600); }
.rappel.faite .rappel-case { background: var(--sage-600); border-color: var(--sage-600); }
.rappel-texte { flex: 1; min-width: 0; word-break: break-word; }
.rappel.faite .rappel-texte { text-decoration: line-through; color: var(--ink-3); }
.rappel-date { flex: none; font-size: 13px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.rappel.retard .rappel-date { color: var(--danger); font-weight: 600; }
.rappel-suppr { flex: none; background: none; border: none; color: var(--ink-3); cursor: pointer; font-size: 18px; line-height: 1; padding: 2px 6px; border-radius: 6px; }
.rappel-suppr:hover { color: var(--danger); background: var(--danger-bg); }
.rappel-ajout { display: grid; grid-template-columns: 150px 1fr auto; gap: 10px; margin-top: 16px; align-items: start; }
.rappel-ajout input { padding: 9px 12px; }
.raccourcis { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.raccourci {
    background: var(--surface-2); border: none; border-radius: 999px; padding: 4px 11px;
    font-family: inherit; font-size: 12px; color: var(--ink-2); cursor: pointer;
}
.raccourci:hover { background: var(--sage-100); color: var(--sage-700); }
@media (max-width: 560px) { .rappel-ajout { grid-template-columns: 1fr; } }

/* Historique */
.historique { margin-top: 22px; }
.hist-item { position: relative; padding: 0 0 18px 22px; border-left: 2px solid var(--line); margin-left: 5px; }
.hist-item:last-child { padding-bottom: 0; }
.hist-item::before {
    content: ""; position: absolute; left: -6px; top: 3px;
    width: 10px; height: 10px; border-radius: 50%;
    background: var(--sage-600); border: 2px solid var(--surface);
}
.hist-item.statut::before { background: var(--line-strong); }
.hist-date { font-size: 12px; color: var(--ink-3); margin-bottom: 3px; font-variant-numeric: tabular-nums; }
.hist-texte { font-size: 14px; line-height: 1.6; white-space: pre-wrap; word-break: break-word; }
.hist-item.statut .hist-texte { color: var(--ink-2); font-style: italic; }
.hist-item.activite::before { background: var(--sage-700); }
.hist-item.activite .hist-texte { color: var(--sage-700); font-weight: 600; }
.hist-suppr { background: none; border: none; color: var(--ink-3); font-size: 12px; cursor: pointer; margin-left: 10px; font-family: inherit; }
.hist-suppr:hover { color: var(--danger); text-decoration: underline; }

/* Raisons d'une correspondance */
.raisons { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.raison {
    font-size: 12px; line-height: 1.4; color: var(--sage-700); background: var(--sage-50);
    border: 1px solid var(--sage-100); padding: 3px 10px; border-radius: 999px;
}
.raison.neg { color: var(--danger); background: var(--danger-bg); border-color: var(--danger-line); }

/* Liste des prospects : étiquettes et relances */
.lead-tags { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 12px; }
.tag-relance { font-size: 12px; font-weight: 600; color: var(--sage-700); }
.tag-relance.retard { color: var(--danger); }

/* Tableau de bord : parcours, sources, à faire */
.barres { display: grid; gap: 12px; }
.barre-ligne { display: grid; grid-template-columns: 96px 1fr 34px; gap: 12px; align-items: center; font-size: 14px; }
.barre-nom { color: var(--ink-2); }
.barre-piste { height: 10px; background: var(--surface-2); border-radius: 999px; overflow: hidden; }
.barre-remplie { height: 100%; background: var(--sage-600); border-radius: 999px; min-width: 0; transition: width 0.4s ease; }
.barre-remplie.perdu { background: #B7B5AA; }
.barre-remplie.source { background: #CDBB98; }
.barre-nombre { text-align: right; font-variant-numeric: tabular-nums; color: var(--ink); font-weight: 600; }
.stat-note { font-size: 12px; color: var(--ink-3); margin-top: 10px; line-height: 1.5; }
.afaire-item { display: flex; gap: 12px; align-items: center; padding: 11px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.afaire-item:last-child { border-bottom: none; }
.afaire-item a { color: var(--ink); text-decoration: none; font-weight: 500; }
.afaire-item a:hover { color: var(--sage-700); text-decoration: underline; text-underline-offset: 3px; }
.afaire-quoi { flex: 1; min-width: 0; }
.afaire-quoi small { display: block; color: var(--ink-3); font-size: 12px; font-weight: 400; }
.chips-relances { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.chip { padding: 5px 12px; border-radius: 999px; background: var(--surface-2); font-size: 13px; color: var(--ink-2); }
.chip.retard { background: var(--danger-bg); color: var(--danger); font-weight: 600; }

/* Compte : alertes et formulaire de contact */
.copie-ligne { display: flex; gap: 10px; }
.copie-ligne input { font-size: 13px; color: var(--ink-2); background: var(--surface-2); }
.interrupteur { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; text-transform: none; letter-spacing: 0; font-size: 14px; font-weight: 400; color: var(--ink); margin-bottom: 0; }
.interrupteur input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--sage-600); flex: none; padding: 0; }

/* Propositions par e-mail */
.biens-choix { display: grid; gap: 10px; margin-bottom: 22px; }
.bien-choix { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); cursor: pointer; text-transform: none; letter-spacing: 0; font-size: 14px; font-weight: 400; color: var(--ink); margin-bottom: 0; }
.bien-choix:hover { border-color: var(--line-strong); }
.bien-choix.coche { background: var(--sage-50); border-color: var(--sage-300); }
.bien-choix input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--sage-600); flex: none; padding: 0; }
.bien-choix .bien-texte { flex: 1; min-width: 0; }
.bien-choix .bien-titre { font-weight: 600; word-break: break-word; }
.bien-choix .bien-detail { color: var(--ink-2); font-size: 13px; margin-top: 2px; word-break: break-word; }
.bien-choix .bien-score { font-variant-numeric: tabular-nums; font-weight: 600; color: var(--sage-700); white-space: nowrap; }
.mail-corps { min-height: 360px; line-height: 1.65; }
.mail-a { display: grid; grid-template-columns: 90px 1fr; gap: 6px 12px; font-size: 14px; margin-bottom: 22px; }
.mail-a dt { color: var(--ink-3); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.09em; padding-top: 3px; }
.mail-a dd { color: var(--ink); word-break: break-all; }
.lien-discret { background: none; border: none; padding: 0; color: var(--sage-700); font: inherit; font-size: 13px; text-decoration: underline; cursor: pointer; }
.pj-liste { display: grid; gap: 8px; margin-bottom: 10px; }
.pj-ligne { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); font-size: 14px; }
.pj-ligne .pj-nom { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.pj-ligne .pj-taille { color: var(--ink-3); font-size: 12px; white-space: nowrap; }
.pj-liste .pj-ajout { justify-self: start; cursor: pointer; text-transform: none; letter-spacing: 0; margin: 0; }
.pj-ajout.disabled { opacity: 0.5; pointer-events: none; }
.envoye-item { padding: 16px 18px; margin-bottom: 12px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); }
.envoye-item .envoye-sujet { color: var(--ink-2); font-size: 14px; margin-top: 2px; word-break: break-word; }
.envoye-item .envoye-date { color: var(--ink-3); font-size: 12px; margin-top: 6px; }

/* Administration et forfaits */
.admin-pile { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
.admin-pile > * { min-width: 0; }
.admin-pile .panel { margin-bottom: 0; }
.table-scroll { overflow-x: auto; }
.admin-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.admin-table th { text-align: left; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.09em; color: var(--ink-3); padding: 0 14px 10px 0; border-bottom: 1px solid var(--line); white-space: nowrap; }
.admin-table td { padding: 12px 14px 12px 0; border-bottom: 1px solid var(--line); vertical-align: middle; }
.admin-table tr:last-child td { border-bottom: none; }
.admin-table input[type=number] { width: 110px; padding: 8px 10px; }
.admin-table input[type=text] { padding: 8px 10px; }
.admin-table select { padding: 8px 10px; width: auto; }
.admin-sous-ligne td { padding: 0; background: var(--surface-2); border-bottom: 1px solid var(--line); }
.admin-table-imbriquee { margin: 4px 20px 4px 34px; width: calc(100% - 54px); }
.admin-table-imbriquee th, .admin-table-imbriquee td { padding: 8px 12px 8px 0; }
.cellule-nom small { display: block; color: var(--ink-3); font-size: 12px; word-break: break-all; }
.usage { min-width: 104px; font-size: 13px; font-variant-numeric: tabular-nums; }
.usage-piste { height: 5px; background: var(--surface-2); border-radius: 3px; margin-top: 5px; overflow: hidden; }
.usage-barre { height: 100%; background: var(--sage-600); border-radius: 3px; }
.usage-barre.proche { background: #B8902F; }
.usage-barre.plein { background: var(--danger); }
.pastille { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; background: var(--sage-50); color: var(--sage-700); white-space: nowrap; }
.pastille.off { background: var(--danger-bg); color: var(--danger); }
.pastille.admin { background: var(--surface-2); color: var(--ink-2); }
.inviter-ligne { display: grid; grid-template-columns: 1fr 180px 1fr auto; gap: 12px; align-items: end; }
.cle-creee { background: var(--sage-50); border-left: 3px solid var(--sage-600); border-radius: var(--radius-sm); padding: 16px 18px; margin-bottom: 20px; }
.cle-creee-titre { font-size: 13px; font-weight: 600; color: var(--sage-700); margin-bottom: 10px; }
.cle-valeur, .cle-masquee { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; letter-spacing: 0.06em; }
.cle-valeur { font-size: 18px !important; color: var(--ink) !important; background: var(--surface) !important; }
.cle-masquee { font-size: 13px; color: var(--ink-2); white-space: nowrap; }
.cle-alerte { color: var(--danger); }
.lien-bouton { background: none; border: none; padding: 0; font: inherit; color: var(--sage-700); text-decoration: underline; cursor: pointer; }
.gris { color: var(--ink-3); }
.petit-texte { font-size: 12px; }
@media (max-width: 900px) { .inviter-ligne { grid-template-columns: 1fr 1fr; } .inviter-ligne .btn { grid-column: 1 / -1; } }
@media (max-width: 560px) { .inviter-ligne { grid-template-columns: 1fr; } }
.forfait-ligne { margin-bottom: 18px; }
.forfait-libelle { display: flex; justify-content: space-between; gap: 12px; font-size: 14px; }
.forfait-chiffres { color: var(--ink-2); font-variant-numeric: tabular-nums; }

/* ---------- Petits écrans ---------- */
@media (max-width: 760px) {
    header { padding: 12px 0; }
    .header-content { flex-wrap: wrap; gap: 10px 16px; padding: 0 16px; }
    nav { order: 3; width: 100%; gap: 22px; overflow-x: auto; }
    nav a { padding: 6px 0 9px; white-space: nowrap; }
    nav a.active::after { bottom: 0; }
    .user-email { display: none; }
    .container { padding: 32px 16px 56px; }
    .page-title { font-size: 32px; }
    .panel { padding: 22px 20px; }
    .auth-container { padding: 34px 24px 30px; }
}

/* ---------- Échelle de score en 5 paliers ----------
   Se superpose aux trois niveaux historiques (chaud / tiède / froid), qui
   restent ceux décrits dans les CGU. Le palier ne dépend que du score /100 :
   90+ vert fluo « go go go », 80-89 vert, 65-79 jaune, 45-64 orange, moins de 45 gris. */
:root {
    --go: #39FF14;       --go-ink: #063B0B;   --go-glow: rgba(57, 255, 20, 0.55);
    --vert: #1F8A3B;     --vert-bg: #DDF1E1;
    --jaune: #8A6A00;    --jaune-bg: #FBF0B8;  --jaune-bord: #E2B91A;
    --orange: #A24A12;   --orange-bg: #FADDC3; --orange-bord: #E27A2C;
    --gris: #5E655C;     --gris-bg: #ECE8DE;   --gris-bord: #A7AC9E;
    --proprio: #1B4F8A;  --proprio-bg: #DCEBFA; --proprio-bord: #3B82D6;
}

/* Pastilles (page prospects et tâches) */
.lead-badge.p-go, .badge.p-go { background: var(--go); color: var(--go-ink); font-weight: 800; box-shadow: 0 0 0 1px rgba(6, 59, 11, 0.25), 0 0 14px var(--go-glow); }
.lead-badge.p-vert, .badge.p-vert { background: var(--vert-bg); color: var(--vert); }
.lead-badge.p-jaune, .badge.p-jaune { background: var(--jaune-bg); color: var(--jaune); }
.lead-badge.p-orange, .badge.p-orange { background: var(--orange-bg); color: var(--orange); }
.lead-badge.p-gris, .badge.p-gris { background: var(--gris-bg); color: var(--gris); }

/* Cartes prospects */
.lead-card.p-vert, .lead-card.p-vert:hover, .lead-item.p-vert, .lead-item.p-vert:hover { border-left-color: var(--vert); border-left-width: 4px; }
.lead-card.p-jaune, .lead-card.p-jaune:hover, .lead-item.p-jaune, .lead-item.p-jaune:hover { border-left-color: var(--jaune-bord); }
.lead-card.p-orange, .lead-card.p-orange:hover, .lead-item.p-orange, .lead-item.p-orange:hover { border-left-color: var(--orange-bord); }
.lead-card.p-gris, .lead-card.p-gris:hover, .lead-item.p-gris, .lead-item.p-gris:hover { border-left-color: var(--gris-bord); }
.lead-card.p-go, .lead-card.p-go:hover {
    border-left: 6px solid var(--go);
    border-color: rgba(57, 255, 20, 0.7);
    border-left-color: var(--go);
    background: linear-gradient(90deg, rgba(57, 255, 20, 0.13), var(--surface) 38%);
    box-shadow: 0 0 0 1px rgba(57, 255, 20, 0.45), 0 0 26px rgba(57, 255, 20, 0.38);
}
.lead-card.p-go { animation: zelyro-go 2.4s ease-in-out infinite; }
@keyframes zelyro-go {
    0%, 100% { box-shadow: 0 0 0 1px rgba(57, 255, 20, 0.45), 0 0 14px rgba(57, 255, 20, 0.25); }
    50% { box-shadow: 0 0 0 1px rgba(57, 255, 20, 0.8), 0 0 30px rgba(57, 255, 20, 0.55); }
}
.pastille-go {
    display: inline-flex; align-items: center; gap: 7px;
    background: var(--go); color: var(--go-ink);
    font-size: 12px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase;
    padding: 4px 11px; border-radius: 999px; margin-bottom: 10px;
}
.pastille-go::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--go-ink); animation: zelyro-point 1.2s ease-in-out infinite; }
@keyframes zelyro-point { 0%, 100% { opacity: 1; } 50% { opacity: 0.25; } }

/* Fiche prospect : encadré du score */
.quality-box.p-go { background: var(--go); box-shadow: 0 0 0 1px rgba(6, 59, 11, 0.3), 0 0 28px var(--go-glow); }
.quality-box.p-go .quality-label, .quality-box.p-go .quality-explain { color: var(--go-ink); }
.quality-box.p-go .quality-explain { font-weight: 600; }
.quality-box.p-vert { background: var(--vert-bg); }
.quality-box.p-vert .quality-label { color: var(--vert); }
.quality-box.p-jaune { background: var(--jaune-bg); }
.quality-box.p-jaune .quality-label { color: var(--jaune); }
.quality-box.p-orange { background: var(--orange-bg); }
.quality-box.p-orange .quality-label { color: var(--orange); }
.quality-box.p-gris { background: var(--gris-bg); }
.quality-box.p-gris .quality-label { color: var(--gris); }
.quality-go-appel { display: inline-block; margin-top: 10px; font-size: 12px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; background: var(--go-ink); color: var(--go); padding: 4px 12px; border-radius: 999px; }

/* Déjà propriétaire : bleu, distinct de l'échelle de score */
.bandeau-proprio {
    display: flex; align-items: center; gap: 8px;
    background: var(--proprio-bg); color: var(--proprio);
    border: 1px solid var(--proprio-bord); border-radius: var(--radius-sm);
    font-size: 13px; font-weight: 700; padding: 7px 12px; margin: -6px 0 14px;
}
.chip-proprio {
    display: inline-block; background: var(--proprio-bg); color: var(--proprio);
    border: 1px solid var(--proprio-bord); border-radius: 999px;
    font-size: 12px; font-weight: 700; padding: 3px 10px;
}
.encadre-proprio {
    background: var(--proprio-bg); border: 1px solid var(--proprio-bord); border-left: 5px solid var(--proprio-bord);
    border-radius: var(--radius-sm); padding: 14px 16px; margin-bottom: 16px; color: var(--proprio); font-size: 13px; line-height: 1.6;
}
.encadre-proprio strong { display: block; font-size: 14px; margin-bottom: 4px; }

@media (prefers-reduced-motion: reduce) {
    .lead-card.p-go, .pastille-go::before { animation: none; }
}


/* ---------- Leads : filtre et tri par catégorie ---------- */
.barre-tri {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    margin: -12px 0 24px;
}
.barre-tri label { display: flex; flex-direction: column; gap: 6px; flex: 1 1 240px; max-width: 360px; }
.barre-tri label span { font-size: 12px; font-weight: 600; color: var(--ink-2); letter-spacing: 0.02em; }
.barre-tri select { width: 100%; }


/* ---------- Estimation indicative du bien d'un prospect propriétaire (usage interne) ---------- */
.bloc-estimation { background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 18px 18px 16px; margin: 4px 0 22px; }
.estim-titre { font-family: var(--serif); font-size: 20px; font-weight: 500; color: var(--ink); }
.estim-aide { font-size: 13px; color: var(--ink-2); line-height: 1.6; margin: 4px 0 14px; }
.estim-rappel { font-size: 12px; color: var(--ink-3); margin-left: 8px; }
.estim-erreur { margin-top: 12px; background: var(--surface); border: 1px solid var(--line-strong); border-left: 4px solid #A24A12; border-radius: var(--radius-sm); padding: 10px 14px; font-size: 13px; color: var(--ink); line-height: 1.55; }
.estim-resultat { margin-top: 16px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 16px 18px; }
.estim-etiquette { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); }
.estim-fourchette { font-family: var(--serif); font-size: 30px; font-weight: 500; color: var(--ink); margin: 4px 0 2px; line-height: 1.2; }
.estim-fourchette span { font-size: 18px; font-style: italic; color: var(--ink-3); margin: 0 4px; }
.estim-mediane { font-size: 14px; color: var(--ink-2); }
.estim-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; margin-top: 10px; font-size: 12px; color: var(--ink-3); }
.estim-confiance { display: inline-block; border-radius: 999px; padding: 3px 10px; font-weight: 700; border: 1px solid var(--line-strong); color: var(--ink-2); background: var(--surface-2); }
.estim-confiance.estim-bonne { background: #DDF1E1; border-color: #B8E2C2; color: #1F6B33; }
.estim-confiance.estim-moyenne { background: #FBF0B8; border-color: #E2B91A; color: #6F5500; }
.estim-confiance.estim-faible { background: #FADDC3; border-color: #E27A2C; color: #8A3C0C; }
.estim-avertissements { margin: 12px 0 0 18px; font-size: 12px; color: var(--ink-3); line-height: 1.6; }
.estim-details { margin-top: 12px; font-size: 13px; }
.estim-details summary { cursor: pointer; color: var(--sage-600); font-weight: 600; }
.estim-table-wrap { overflow-x: auto; margin-top: 8px; }
.estim-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.estim-table th { text-align: left; font-weight: 700; color: var(--ink-3); border-bottom: 1px solid var(--line); padding: 6px 8px 6px 0; white-space: nowrap; }
.estim-table td { padding: 6px 8px 6px 0; border-bottom: 1px solid var(--line); color: var(--ink); white-space: nowrap; }
.estim-source { margin-top: 12px; font-size: 11px; color: var(--ink-3); line-height: 1.5; }
.estim-adresse { margin-top: 8px; font-size: 12px; color: var(--ink-3); }

/* ===== Performance énergétique (DPE / GES) et photos des biens ===== */
.ener-ligne { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 4px 0 8px; }
.ener { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; color: var(--ink-2, #3b4640); }
.ener b { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; border-radius: 4px; font-size: 13px; padding: 0 4px; color: #1b1b1b; }
.ener-dpe-A b { background: #319834; color: #fff; }
.ener-dpe-B b { background: #33cc31; }
.ener-dpe-C b { background: #cbfc34; }
.ener-dpe-D b { background: #fbfe06; }
.ener-dpe-E b { background: #fccc05; }
.ener-dpe-F b { background: #fc9935; }
.ener-dpe-G b { background: #fb0107; color: #fff; }
.ener-ges-A b { background: #f2eff4; box-shadow: inset 0 0 0 1px #cfc6d8; }
.ener-ges-B b { background: #dfc1f7; }
.ener-ges-C b { background: #d6a5f6; }
.ener-ges-D b { background: #cb87f6; }
.ener-ges-E b { background: #b25fe0; color: #fff; }
.ener-ges-F b { background: #8e3fc0; color: #fff; }
.ener-ges-G b { background: #5e2590; color: #fff; }
.ener-alerte { font-size: 12px; color: #9a5b00; }

.bien-photo { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 8px; display: block; margin-bottom: 10px; background: var(--surface-2, #efe9dc); }
.bien-photo-vide { display: flex; align-items: center; justify-content: center; color: var(--ink-3, #8a928c); font-size: 12px; }
.bien-photo-nb { position: relative; }
.photos-grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 10px; margin: 8px 0 6px; }
.photo-tuile { position: relative; border-radius: 8px; overflow: hidden; border: 1px solid var(--line, #E3DCCC); background: var(--surface-2, #efe9dc); aspect-ratio: 4 / 3; }
.photo-tuile img { width: 100%; height: 100%; object-fit: cover; display: block; }
.photo-tuile .photo-actions { position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: space-between; gap: 4px; padding: 4px; background: linear-gradient(transparent, rgba(0,0,0,.55)); }
.photo-tuile button { border: 0; background: rgba(255,255,255,.92); border-radius: 6px; font-size: 11px; padding: 3px 7px; cursor: pointer; font-family: inherit; color: #222; }
.photo-tuile .photo-principale { position: absolute; top: 5px; left: 5px; background: var(--sage-600, #4F6353); color: #fff; font-size: 10px; font-weight: 600; padding: 2px 7px; border-radius: 999px; }
.photo-ajout { margin-top: 4px; }
.photo-tuile .photo-actions span { white-space: nowrap; font-size: 10px; }

/* Défilement des photos (carrousel.js) : pages Biens, Matching et Propositions */
.carrousel { position: relative; width: 100%; aspect-ratio: 16 / 10; border-radius: 8px; overflow: hidden; margin-bottom: 10px; background: var(--surface-2, #efe9dc); }
.carrousel.carrousel-large { aspect-ratio: 16 / 9; }
.carrousel-piste { display: flex; height: 100%; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
.carrousel-piste::-webkit-scrollbar { display: none; }
.carrousel-piste:focus-visible { outline: 2px solid var(--sage-600, #4F6353); outline-offset: -2px; }
.carrousel-vue { flex: 0 0 100%; height: 100%; scroll-snap-align: start; scroll-snap-stop: always; display: flex; align-items: center; justify-content: center; color: var(--ink-3, #8a928c); font-size: 12px; }
.carrousel-vue img { width: 100%; height: 100%; object-fit: cover; display: block; user-select: none; -webkit-user-drag: none; }
.carrousel-fleche { position: absolute; top: 50%; transform: translateY(-50%); width: 30px; height: 30px; padding: 0 0 3px; border: 0; border-radius: 50%; background: rgba(255,255,255,.92); color: #1F2A24; font-size: 22px; line-height: 1; cursor: pointer; box-shadow: 0 1px 5px rgba(0,0,0,.28); display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity .15s; font-family: inherit; }
.carrousel-fleche.gauche { left: 8px; }
.carrousel-fleche.droite { right: 8px; }
.carrousel:hover .carrousel-fleche, .carrousel:focus-within .carrousel-fleche { opacity: 1; }
@media (hover: none) { .carrousel-fleche { opacity: .9; } }
.carrousel-compteur { position: absolute; right: 8px; bottom: 8px; background: rgba(0,0,0,.55); color: #fff; font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 999px; pointer-events: none; }
.photos-mail { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; margin: 4px 0 10px; }
.photos-mail .carrousel { margin-bottom: 4px; }
.photos-mail-titre { font-size: 12px; color: var(--ink-3, #6A7168); line-height: 1.35; }

/* Prospects des pages Propositions et Matching : mêmes paliers que la page Prospects */
.lead-item.p-go, .lead-item.p-go:hover { border-left: 6px solid var(--go); border-left-color: var(--go); box-shadow: 0 0 0 1px rgba(57, 255, 20, 0.45), 0 0 18px rgba(57, 255, 20, 0.3); }
.lead-item.p-go:not(.selected) { background: linear-gradient(90deg, rgba(57, 255, 20, 0.10), var(--surface) 38%); }
.lead-item.p-vert.selected, .lead-item.p-jaune.selected, .lead-item.p-orange.selected, .lead-item.p-gris.selected { background: var(--sage-50); }
.lead-item .lead-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-top: 10px; }
.lead-item .lead-footer .lead-badge { margin-top: 0; }