/* ── Bati Estimator v3 — Public CSS ──────────────────────── */
:root { --c:#1D9E75; --ca:#0F6E56; --r:10px; }

/* ── Layout ───────────────────────────────────────────────── */
.bati-wrap { display:grid; grid-template-columns:280px 1fr; gap:0; min-height:480px; border:1.5px solid #e0e6e2; border-radius:var(--r); overflow:hidden; background:#fff; }
@media(max-width:680px){ .bati-wrap{ grid-template-columns:1fr; } }

/* ── Sidebar ──────────────────────────────────────────────── */
.bati-sidebar { background:#f5f7f6; border-right:1.5px solid #e0e6e2; display:flex; flex-direction:column; }
.bati-search-bar { padding:14px; border-bottom:1.5px solid #e0e6e2; display:flex; flex-direction:column; gap:8px; }
.bati-search, .bati-cat-filter { width:100%; padding:8px 12px; border:1.5px solid #d0d8d4; border-radius:8px; font-size:13px; background:#fff; box-sizing:border-box; }
.bati-search:focus, .bati-cat-filter:focus { outline:none; border-color:var(--c); }
.bati-guide-list { overflow-y:auto; flex:1; }

/* Guide cards */
.bati-guide-card { padding:12px 16px; cursor:pointer; border-bottom:1px solid #eaeeec; transition:background .12s; }
.bati-guide-card:hover { background:#eaf4ef; }
.bati-guide-card.is-active { background:#d5edde; border-left:3px solid var(--c); }
.bati-guide-card:last-child { border-bottom:none; }
.bati-card-title { margin:0 0 4px; font-size:13px; font-weight:600; color:#1a1a1a; line-height:1.3; }
.bati-badge { display:inline-block; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; padding:2px 7px; border-radius:4px; }
.bati-badge-installation { background:#e3eefe; color:#1a5fa8; }
.bati-badge-renovation    { background:#ede8ff; color:#4b35b0; }
.bati-badge-construction  { background:#fef3de; color:#854f00; }

/* ── Main panel ───────────────────────────────────────────── */
.bati-main { padding:28px; overflow-y:auto; }
.bati-empty-state { display:flex; flex-direction:column; align-items:center; justify-content:center; height:100%; min-height:360px; text-align:center; color:#aaa; gap:14px; }
.bati-empty-state svg { width:70px; height:70px; color:var(--c); }
.bati-empty-state p { font-size:15px; max-width:240px; line-height:1.5; }

/* ── Single guide layout ──────────────────────────────────── */
.bati-guide-title { font-size:20px; font-weight:700; color:#111; margin:0 0 20px; }
.bati-form { display:flex; flex-direction:column; gap:18px; }

/* Field */
.bati-field { display:flex; flex-direction:column; gap:7px; }
.bati-field-label { font-size:13px; font-weight:600; color:#333; }

/* Number */
.bati-num-wrap { display:flex; align-items:center; gap:8px; }
.bati-dec, .bati-inc { width:36px; height:36px; border:1.5px solid #cdd5d1; border-radius:8px; background:#f4f6f5; font-size:18px; cursor:pointer; display:flex; align-items:center; justify-content:center; user-select:none; transition:all .12s; line-height:1; }
.bati-dec:hover, .bati-inc:hover { background:var(--c); color:#fff; border-color:var(--c); }
input.bati-num-input { width:72px; text-align:center; border:1.5px solid #cdd5d1; border-radius:8px; padding:7px 6px; font-size:15px; font-weight:600; -moz-appearance:textfield; }
input.bati-num-input::-webkit-outer-spin-button,
input.bati-num-input::-webkit-inner-spin-button { -webkit-appearance:none; }
input.bati-num-input:focus { outline:none; border-color:var(--c); }

/* Select cards */
.bati-opts { display:flex; flex-wrap:wrap; gap:8px; }
.bati-opt-card { cursor:pointer; }
.bati-opt-card input[type=radio] { position:absolute; opacity:0; width:0; height:0; }
.bati-opt-card span { display:block; padding:8px 16px; border:2px solid #cdd5d1; border-radius:8px; font-size:13px; font-weight:500; transition:all .12s; background:#fff; white-space:nowrap; }
.bati-opt-card input:checked + span { border-color:var(--c); background:#dff2e9; color:var(--ca); }
.bati-opt-card:hover span { border-color:var(--c); }

/* Toggle */
.bati-toggle { display:flex; align-items:center; gap:10px; cursor:pointer; user-select:none; }
.bati-toggle input[type=checkbox] { position:absolute; opacity:0; width:0; height:0; }
.bati-track { position:relative; width:44px; height:24px; background:#ccc; border-radius:12px; transition:background .2s; flex-shrink:0; }
.bati-thumb { position:absolute; left:3px; top:3px; width:18px; height:18px; background:#fff; border-radius:50%; transition:transform .2s; box-shadow:0 1px 3px rgba(0,0,0,.2); }
.bati-toggle input:checked ~ .bati-track { background:var(--c); }
.bati-toggle input:checked ~ .bati-track .bati-thumb { transform:translateX(20px); }
.bati-toggle-lbl { font-size:14px; color:#333; }

/* ── Contact + CTA ────────────────────────────────────────── */
.bati-contact-zone { margin-top:8px; border-top:1.5px dashed #cde5d7; padding-top:18px; }
.bati-contact-lbl { font-size:13px; font-weight:600; color:#333; margin-bottom:8px; }
.bati-contact-row { display:flex; gap:10px; flex-wrap:wrap; }
.bati-contact-input { flex:1 1 180px; padding:11px 14px; border:1.5px solid #cdd5d1; border-radius:8px; font-size:14px; transition:border .14s; }
.bati-contact-input:focus { outline:none; border-color:var(--c); }
.bati-contact-input.is-valid { border-color:var(--c); }
.bati-contact-input.is-error { border-color:#e24b4a; }
.bati-err-msg { font-size:12px; color:#e24b4a; margin-top:5px; min-height:16px; }
.bati-cta { padding:11px 24px; background:var(--c); color:#fff; border:none; border-radius:8px; font-size:15px; font-weight:700; cursor:pointer; transition:background .14s; white-space:nowrap; flex-shrink:0; }
.bati-cta:hover { background:var(--ca); }
.bati-cta:disabled { opacity:.65; cursor:not-allowed; }
.bati-spinner { display:inline-block; width:14px; height:14px; border:2px solid rgba(255,255,255,.4); border-top-color:#fff; border-radius:50%; animation:bati-spin .6s linear infinite; vertical-align:middle; margin-right:4px; }
@keyframes bati-spin { to { transform:rotate(360deg); } }

/* ── Result box ───────────────────────────────────────────── */
.bati-result { display:none; margin-top:18px; background:linear-gradient(135deg,#e5f6ee,#cceddb); border:1.5px solid #8dd4b0; border-radius:var(--r); padding:22px; text-align:center; animation:bati-reveal .35s ease; }
@keyframes bati-reveal { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:none} }
.bati-result-lbl { font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.8px; color:var(--ca); margin-bottom:8px; }
.bati-result-range { font-size:28px; font-weight:800; color:var(--ca); letter-spacing:-1px; margin-bottom:8px; }
.bati-result-note { font-size:12px; color:#555; margin:0 0 14px; }
.bati-reset { padding:8px 18px; border:2px solid var(--c); background:transparent; color:var(--c); border-radius:8px; font-size:13px; font-weight:700; cursor:pointer; transition:all .14s; }
.bati-reset:hover { background:var(--c); color:#fff; }

/* ── Single widget (shortcode individuel) ─────────────────── */
.bati-single { max-width:660px; }
.bati-single .bati-guide-title { font-size:18px; }

/* ── Misc ─────────────────────────────────────────────────── */
.bati-hint { padding:16px; color:#aaa; font-size:13px; text-align:center; font-style:italic; }
.bati-err { color:#c00; font-style:italic; }
@keyframes bati-shake { 0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)} }
.bati-shake { animation:bati-shake .35s ease; }