/* ============================================================
   LOCINVEST — STYLES GLOBAUX
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Sora:wght@300;400;500;600;700;800&display=swap');

:root {
  --bg:       #f7f6f2;
  --white:    #ffffff;
  --green:    #3d9970;
  --green-dk: #2e7555;
  --green-lt: #eaf5ef;
  --green-md: #c5e8d5;
  --ink:      #1a1a1a;
  --ink2:     #4a4a4a;
  --muted:    #9a9a9a;
  --border:   #e8e5de;
  --danger:   #e53e3e;
  --warning:  #f6ad55;
  --radius:   14px;
  --radius-sm:8px;
  --shadow:   0 4px 20px rgba(0,0,0,.07);
  --shadow-md:0 8px 32px rgba(0,0,0,.1);
  --shadow-lg:0 20px 60px rgba(0,0,0,.12);
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }

body {
  font-family:'Sora',sans-serif;
  background:var(--bg);
  color:var(--ink);
  overflow-x:hidden;
  min-height:100vh;
}

/* ── NAVBAR ── */
.navbar {
  position:fixed; top:0; left:0; right:0; z-index:500;
  display:flex; justify-content:space-between; align-items:center;
  padding:1rem 5vw;
  background:rgba(247,246,242,.92);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--border);
}
.navbar-logo { font-size:1.3rem; font-weight:800; color:var(--ink); text-decoration:none; letter-spacing:-.03em; }
.navbar-logo span { color:var(--green); }
.navbar-links { display:flex; gap:1.8rem; align-items:center; }
.navbar-links a { font-size:.84rem; font-weight:500; color:var(--ink2); text-decoration:none; transition:color .2s; }
.navbar-links a:hover { color:var(--green); }
.navbar-links a.active { color:var(--green); }

/* ── BOUTONS ── */
.btn { display:inline-flex; align-items:center; gap:.5rem; padding:.75rem 1.6rem; border-radius:50px; font-family:'Sora',sans-serif; font-size:.88rem; font-weight:600; cursor:pointer; text-decoration:none; border:none; transition:all .2s; white-space:nowrap; }
.btn-primary { background:var(--green); color:#fff; box-shadow:0 4px 14px rgba(61,153,112,.25); }
.btn-primary:hover { background:var(--green-dk); transform:translateY(-1px); }
.btn-ghost { background:transparent; color:var(--ink); border:1.5px solid var(--border); }
.btn-ghost:hover { border-color:var(--green); color:var(--green); transform:translateY(-1px); }
.btn-danger { background:var(--danger); color:#fff; }
.btn-danger:hover { background:#c53030; }
.btn-sm { padding:.5rem 1.1rem; font-size:.78rem; }
.btn-full { width:100%; justify-content:center; }

/* ── INPUTS ── */
.input-group { display:flex; flex-direction:column; gap:.4rem; margin-bottom:1.2rem; }
.input-group label { font-size:.8rem; font-weight:600; color:var(--ink2); }
.input-field {
  background:var(--white); border:1.5px solid var(--border);
  padding:.75rem 1rem; border-radius:var(--radius-sm);
  font-family:'Sora',sans-serif; font-size:.88rem; color:var(--ink);
  outline:none; transition:border-color .2s;
  width:100%;
}
.input-field:focus { border-color:var(--green); }
.input-field::placeholder { color:var(--muted); }
select.input-field { cursor:pointer; }
textarea.input-field { resize:vertical; min-height:100px; }

/* ── CARDS ── */
.card {
  background:var(--white); border:1.5px solid var(--border);
  border-radius:var(--radius); overflow:hidden;
  transition:box-shadow .25s, transform .2s, border-color .2s;
}
.card:hover { box-shadow:var(--shadow-md); transform:translateY(-2px); border-color:var(--green-md); }

/* ── BADGE / TAG ── */
.badge { display:inline-flex; align-items:center; gap:.4rem; padding:.3rem .8rem; border-radius:50px; font-size:.7rem; font-weight:600; letter-spacing:.04em; }
.badge-green { background:var(--green-lt); color:var(--green); border:1px solid var(--green-md); }
.badge-gray  { background:#f0f0f0; color:var(--muted); }
.badge-red   { background:#fff5f5; color:var(--danger); border:1px solid #fed7d7; }
.badge-orange{ background:#fffaf0; color:#c05621; border:1px solid #fbd38d; }

/* ── DPE ── */
.dpe-badge {
  display:inline-flex; align-items:center; justify-content:center;
  width:28px; height:28px; border-radius:4px;
  color:#fff; font-size:.75rem; font-weight:800;
}

/* ── SECTION TAG ── */
.stag { display:inline-flex; align-items:center; gap:.4rem; background:var(--green-lt); color:var(--green); font-size:.7rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; padding:.3rem .9rem; border-radius:50px; border:1px solid var(--green-md); margin-bottom:1rem; }

/* ── HEADINGS ── */
h1 { font-size:clamp(2rem,4vw,3.5rem); font-weight:800; letter-spacing:-.04em; line-height:1.1; }
h2 { font-size:clamp(1.6rem,3vw,2.4rem); font-weight:800; letter-spacing:-.035em; line-height:1.15; }
h3 { font-size:1.2rem; font-weight:700; letter-spacing:-.02em; }
h4 { font-size:1rem; font-weight:700; }
.accent { color:var(--green); }

/* ── PAGE WRAPPER ── */
.page-wrap { max-width:1280px; margin:0 auto; padding:6rem 5vw 4rem; }
.page-wrap-sm { max-width:600px; margin:0 auto; padding:6rem 5vw 4rem; }
.page-wrap-md { max-width:900px; margin:0 auto; padding:6rem 5vw 4rem; }

/* ── ANNONCE CARD ── */
.ann-card { cursor:pointer; }
.ann-card-img { height:150px; display:flex; align-items:flex-end; padding:1rem; gap:.6rem; }
.ann-card-body { padding:1.3rem; }
.ann-card-title { font-size:.98rem; font-weight:700; margin-bottom:.2rem; letter-spacing:-.02em; }
.ann-card-loc { font-size:.73rem; color:var(--muted); margin-bottom:.9rem; }
.ann-card-price { font-size:1.25rem; font-weight:800; letter-spacing:-.03em; margin-bottom:.9rem; }
.ann-card-data { display:grid; grid-template-columns:1fr 1fr; gap:.5rem .8rem; padding-top:.9rem; border-top:1px solid var(--border); }
.dv { font-size:.9rem; font-weight:700; color:var(--green); }
.dk { font-size:.62rem; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; }
.cyield { margin-left:auto; background:var(--green); color:#fff; font-size:.78rem; font-weight:700; padding:.25rem .7rem; border-radius:50px; }
.ctag { background:#fff; color:var(--green); font-size:.64rem; font-weight:700; padding:.22rem .65rem; border-radius:50px; }
.cmarchand { background:var(--ink); color:#fff; font-size:.64rem; font-weight:700; padding:.22rem .65rem; border-radius:50px; }

/* ── GRID ANNONCES ── */
.ann-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(310px,1fr)); gap:1.5rem; }

/* ── MASQUE CONTACT ── */
.contact-mask {
  position:relative; display:inline-block;
}
.contact-mask-blur {
  filter:blur(5px); user-select:none; pointer-events:none;
  font-size:.88rem; color:var(--ink2);
}
.contact-mask-overlay {
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:rgba(247,246,242,.85); border-radius:6px;
  font-size:.75rem; font-weight:600; color:var(--green); cursor:pointer;
  border:1px solid var(--green-md); padding:.3rem .7rem; text-align:center;
}

/* ── STATS ROW ── */
.stats-row { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:1rem; }
.stat-box { background:var(--white); border:1.5px solid var(--border); border-radius:var(--radius-sm); padding:1.5rem; text-align:center; }
.stat-box .n { font-size:2rem; font-weight:800; color:var(--green); letter-spacing:-.03em; }
.stat-box .l { font-size:.72rem; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; margin-top:.2rem; }

/* ── TABLE ── */
.table-wrap { overflow-x:auto; border-radius:var(--radius-sm); border:1px solid var(--border); }
table { width:100%; border-collapse:collapse; background:var(--white); }
th { padding:.9rem 1.1rem; text-align:left; font-size:.72rem; font-weight:600; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); border-bottom:1px solid var(--border); background:var(--bg); }
td { padding:.9rem 1.1rem; font-size:.84rem; color:var(--ink2); border-bottom:1px solid var(--border); }
tr:last-child td { border-bottom:none; }
tr:hover td { background:var(--green-lt); }

/* ── FORM CARD ── */
.form-card { background:var(--white); border:1.5px solid var(--border); border-radius:var(--radius); padding:2.5rem; }
.form-section { margin-bottom:2rem; padding-bottom:2rem; border-bottom:1px solid var(--border); }
.form-section:last-child { border-bottom:none; margin-bottom:0; padding-bottom:0; }
.form-section-title { font-size:.85rem; font-weight:700; color:var(--ink); text-transform:uppercase; letter-spacing:.08em; margin-bottom:1.2rem; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }

/* ── MODAL ── */
.modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:999; display:flex; align-items:center; justify-content:center; padding:1rem; opacity:0; visibility:hidden; transition:all .25s; }
.modal-overlay.open { opacity:1; visibility:visible; }
.modal { background:var(--white); border-radius:var(--radius); padding:2.5rem; max-width:480px; width:100%; box-shadow:var(--shadow-lg); transform:translateY(20px); transition:transform .25s; }
.modal-overlay.open .modal { transform:translateY(0); }
.modal-title { font-size:1.2rem; font-weight:800; margin-bottom:.5rem; }
.modal-sub { font-size:.85rem; color:var(--muted); margin-bottom:2rem; }
.modal-close { position:absolute; top:1rem; right:1rem; background:none; border:none; cursor:pointer; font-size:1.3rem; color:var(--muted); }

/* ── TOAST ── */
.toast { position:fixed; bottom:2rem; right:2rem; z-index:9999; background:var(--ink); color:#fff; padding:.9rem 1.5rem; border-radius:50px; font-size:.85rem; font-weight:500; box-shadow:var(--shadow-lg); transform:translateY(100px); opacity:0; transition:all .3s; }
.toast.show { transform:translateY(0); opacity:1; }
.toast.success { background:var(--green); }
.toast.error { background:var(--danger); }

/* ── NAV SESSION ── */
.nav-session { display:flex; align-items:center; gap:1rem; }
.nav-avatar { width:34px; height:34px; border-radius:50%; background:var(--green); color:#fff; font-size:.8rem; font-weight:700; display:flex; align-items:center; justify-content:center; cursor:pointer; }

/* ── EMPTY STATE ── */
.empty-state { text-align:center; padding:5rem 2rem; color:var(--muted); }
.empty-state .icon { font-size:3rem; margin-bottom:1rem; }
.empty-state p { font-size:.9rem; }

/* ── PAGINATION ── */
.pagination { display:flex; gap:.5rem; justify-content:center; margin-top:2.5rem; }
.page-btn { width:36px; height:36px; border-radius:50%; border:1.5px solid var(--border); background:var(--white); font-family:'Sora',sans-serif; font-size:.82rem; cursor:pointer; transition:all .2s; display:flex; align-items:center; justify-content:center; }
.page-btn.active { background:var(--green); border-color:var(--green); color:#fff; }
.page-btn:hover:not(.active) { border-color:var(--green); color:var(--green); }

/* ── SIDEBAR LAYOUT ── */
.layout-sidebar { display:grid; grid-template-columns:260px 1fr; gap:2rem; align-items:start; }
.sidebar { background:var(--white); border:1.5px solid var(--border); border-radius:var(--radius); padding:1.5rem; position:sticky; top:5.5rem; }
.sidebar-item { display:flex; align-items:center; gap:.8rem; padding:.75rem .9rem; border-radius:var(--radius-sm); font-size:.86rem; font-weight:500; color:var(--ink2); text-decoration:none; cursor:pointer; transition:all .2s; margin-bottom:.25rem; }
.sidebar-item:hover { background:var(--green-lt); color:var(--green); }
.sidebar-item.active { background:var(--green-lt); color:var(--green); font-weight:600; }
.sidebar-item .icon { font-size:1rem; }

/* ── REVEAL ANIMATION ── */
.reveal { opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in { opacity:1; transform:translateY(0); }
.d1{transition-delay:.1s} .d2{transition-delay:.2s} .d3{transition-delay:.3s}

@keyframes fadeUp { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }
@keyframes spin { to{transform:rotate(360deg)} }

.spinner { width:20px; height:20px; border:2px solid rgba(255,255,255,.3); border-top-color:#fff; border-radius:50%; animation:spin .7s linear infinite; }

/* ── RESPONSIVE ── */
@media(max-width:900px) {
  .layout-sidebar { grid-template-columns:1fr; }
  .sidebar { position:static; }
  .form-row { grid-template-columns:1fr; }
  .navbar-links { display:none; }
  .ann-grid { grid-template-columns:1fr; }
}
