/* ClimaFlora onboarding v1 — first-use guided tour and contextual coach marks. */
:root{
  --cf-onboarding-z:2147482000;
  --cf-onboarding-green:#1f6a3d;
  --cf-onboarding-green-dark:#164e2d;
  --cf-onboarding-soft:#eef6ef;
  --cf-onboarding-line:#d9e6dc;
  --cf-onboarding-ink:#183126;
  --cf-onboarding-muted:#64756c;
}

/* Relaunch entry in the public navigation. */
:where(body[data-cf-page="index"]) .public-nav .onboarding-nav-help{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:7px 11px;
  border:1px solid #cfdcd2;
  border-radius:999px;
  background:#fff;
  color:#315b42;
  font:inherit;
  font-weight:700;
  cursor:pointer;
  white-space:nowrap;
}
:where(body[data-cf-page="index"]) .public-nav .onboarding-nav-help:hover{background:var(--cf-onboarding-soft);border-color:#a9c2af}
:where(body[data-cf-page="index"]) .public-nav .onboarding-nav-help:focus-visible{outline:3px solid rgba(52,126,78,.24);outline-offset:2px}

.cf-onboarding-root{position:fixed;inset:0;z-index:var(--cf-onboarding-z);pointer-events:none;font-family:inherit}
.cf-onboarding-root[hidden]{display:none!important}
.cf-onboarding-root *{box-sizing:border-box}

/* Four blockers form an actual click-through spotlight hole. */
.cf-onboarding-blocker{position:fixed;background:rgba(8,19,13,.62);pointer-events:auto;transition:top .16s ease,left .16s ease,width .16s ease,height .16s ease,opacity .16s ease}
.cf-onboarding-blocker.is-hidden{opacity:0;pointer-events:none}
.cf-onboarding-highlight{position:fixed;border:2px solid rgba(228,247,232,.98);border-radius:16px;box-shadow:0 0 0 4px rgba(92,159,111,.24),0 12px 42px rgba(8,31,16,.20);pointer-events:none;transition:top .16s ease,left .16s ease,width .16s ease,height .16s ease,opacity .16s ease}
.cf-onboarding-highlight.is-hidden{opacity:0}

.cf-onboarding-card{
  position:fixed;
  width:min(420px,calc(100vw - 28px));
  max-height:min(74vh,620px);
  overflow:auto;
  padding:20px;
  border:1px solid var(--cf-onboarding-line);
  border-radius:18px;
  background:#fff;
  color:var(--cf-onboarding-ink);
  box-shadow:0 24px 70px rgba(6,29,15,.30);
  pointer-events:auto;
}
.cf-onboarding-card.is-modal{left:50%;top:50%;width:min(560px,calc(100vw - 28px));transform:translate(-50%,-50%);padding:26px}
.cf-onboarding-card::before{content:"";position:absolute;width:14px;height:14px;background:#fff;border-left:1px solid var(--cf-onboarding-line);border-top:1px solid var(--cf-onboarding-line);transform:rotate(45deg)}
.cf-onboarding-card.is-modal::before,.cf-onboarding-card[data-placement="center"]::before{display:none}
.cf-onboarding-card[data-placement="below"]::before{top:-8px;left:34px}
.cf-onboarding-card[data-placement="above"]::before{bottom:-8px;left:34px;transform:rotate(225deg)}
.cf-onboarding-card[data-placement="right"]::before{left:-8px;top:34px;transform:rotate(-45deg)}
.cf-onboarding-card[data-placement="left"]::before{right:-8px;top:34px;transform:rotate(135deg)}

.cf-onboarding-kicker{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:7px;padding-right:42px;color:#4f6d5c;font-size:.78rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.cf-onboarding-count{flex:0 0 auto;padding:4px 8px;border-radius:999px;background:#edf4ef;color:#42604d;font-size:.72rem;letter-spacing:0;text-transform:none}
.cf-onboarding-card h2{margin:0 0 10px;color:#173d28;font-size:1.35rem;line-height:1.22}
.cf-onboarding-card p{margin:0 0 10px;color:#41584b;font-size:.98rem;line-height:1.55}
.cf-onboarding-card p:last-of-type{margin-bottom:0}
.cf-onboarding-card ul{margin:10px 0 0;padding-left:20px;color:#41584b}
.cf-onboarding-card li{margin:5px 0;line-height:1.45}
.cf-onboarding-card strong{color:#1c432e}
.cf-onboarding-note{margin-top:12px!important;padding:10px 12px;border:1px solid #dce9df;border-radius:10px;background:#f5f9f6;color:#365341!important;font-size:.9rem!important}
.cf-onboarding-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:18px;padding-top:15px;border-top:1px solid #edf1ee}
.cf-onboarding-actions-left,.cf-onboarding-actions-right{display:flex;align-items:center;gap:8px}
.cf-onboarding-actions-left{flex-wrap:wrap}
.cf-onboarding-guide{text-decoration:none;white-space:nowrap}
.cf-onboarding-btn{min-height:40px;padding:8px 13px;border:1px solid #cfddd3;border-radius:10px;background:#fff;color:#31533f;font:inherit;font-size:.9rem;font-weight:750;cursor:pointer}
.cf-onboarding-btn:hover{background:#f4f8f5}
.cf-onboarding-btn.primary{border-color:var(--cf-onboarding-green);background:var(--cf-onboarding-green);color:#fff}
.cf-onboarding-btn.primary:hover{background:var(--cf-onboarding-green-dark)}
.cf-onboarding-btn.link{border-color:transparent;background:transparent;color:#6d7d73;font-weight:650}
.cf-onboarding-btn:focus-visible{outline:3px solid rgba(52,126,78,.24);outline-offset:2px}
.cf-onboarding-btn[disabled]{opacity:.45;cursor:not-allowed}
.cf-onboarding-close{position:absolute;right:14px;top:12px;width:36px;height:36px;padding:0;border:0;border-radius:999px;background:#eff4f0;color:#355341;font:inherit;font-size:24px;line-height:1;cursor:pointer}
.cf-onboarding-close:hover{background:#e4ede6}

/* Temporary pulse left on the real search CTA after finishing the first tour. */
.cf-onboarding-ready-pulse{animation:cf-onboarding-pulse 1.05s ease 2}
@keyframes cf-onboarding-pulse{0%,100%{box-shadow:0 0 0 0 rgba(39,120,67,0)}50%{box-shadow:0 0 0 8px rgba(39,120,67,.20)}}

/* Lightweight contextual microtip (no dimmed background). */
.cf-onboarding-microtip{
  position:fixed;
  z-index:calc(var(--cf-onboarding-z) + 10);
  width:min(310px,calc(100vw - 24px));
  padding:13px 14px 12px;
  border:1px solid #cfe0d3;
  border-radius:13px;
  background:#fff;
  color:#294738;
  box-shadow:0 16px 42px rgba(8,31,16,.22);
  font-size:.88rem;
  line-height:1.45;
}
.cf-onboarding-microtip strong{display:block;margin-bottom:4px;color:#183f2a;font-size:.93rem}
.cf-onboarding-microtip p{margin:0 0 8px}
.cf-onboarding-microtip button{border:0;background:transparent;color:#24613a;font:inherit;font-weight:800;cursor:pointer;padding:2px 0}
.cf-onboarding-microtip::before{content:"";position:absolute;width:12px;height:12px;background:#fff;border-left:1px solid #cfe0d3;border-top:1px solid #cfe0d3;transform:rotate(45deg)}
.cf-onboarding-microtip[data-placement="below"]::before{top:-7px;left:28px}
.cf-onboarding-microtip[data-placement="above"]::before{bottom:-7px;left:28px;transform:rotate(225deg)}
.cf-onboarding-microtip[data-placement="right"]::before{left:-7px;top:24px;transform:rotate(-45deg)}
.cf-onboarding-microtip[data-placement="left"]::before{right:-7px;top:24px;transform:rotate(135deg)}

@media (prefers-reduced-motion:reduce){
  .cf-onboarding-blocker,.cf-onboarding-highlight{transition:none}
  .cf-onboarding-ready-pulse{animation:none}
}

@media (max-width:760px){
  :where(body[data-cf-page="index"]) .public-nav .onboarding-nav-help{width:100%;justify-content:flex-start;border-radius:8px;padding:10px 12px}
  .cf-onboarding-card:not(.is-modal){
    left:10px!important;
    right:10px!important;
    bottom:10px!important;
    top:auto!important;
    width:auto!important;
    max-height:min(48vh,430px);
    border-radius:16px;
    padding:17px;
  }
  .cf-onboarding-card:not(.is-modal)::before{display:none}
  .cf-onboarding-card.is-modal{width:calc(100vw - 20px);max-height:84vh;padding:22px 18px}
  .cf-onboarding-card h2{font-size:1.18rem}
  .cf-onboarding-card p{font-size:.93rem;line-height:1.48}
  .cf-onboarding-actions{align-items:stretch;flex-direction:column-reverse}
  .cf-onboarding-actions-left,.cf-onboarding-actions-right{width:100%}
  .cf-onboarding-actions-right{justify-content:flex-end}
  .cf-onboarding-actions-left .cf-onboarding-btn.link{padding-left:0}
  .cf-onboarding-actions-right .cf-onboarding-btn{flex:1}
  .cf-onboarding-microtip{left:10px!important;right:10px!important;bottom:10px!important;top:auto!important;width:auto!important}
  .cf-onboarding-microtip::before{display:none}
}