/* ==========================================================================
   FORESIGHT DPDP READINESS BOT
   Uses the same brand tokens as the rest of the site. If foresight-suite's
   stylesheet is already loaded, these :root values are redundant but
   harmless (later-loaded values simply match); if this plugin is used on
   its own, these are the fallback source of truth.
   ========================================================================== */
:root{
  --fdb-navy-900:#081420; --fdb-navy-800:#0c1e30; --fdb-navy-700:#12293e;
  --fdb-teal:#006a7a; --fdb-teal-light:#12909f; --fdb-teal-pale:#e4f0f1;
  --fdb-cream:#f6f4ee; --fdb-ink:#101820; --fdb-ink-soft:#4b5560;
  --fdb-line:rgba(16,24,32,0.12);
  --fdb-risk-low:#0d7a4f; --fdb-risk-mid:#b8860b; --fdb-risk-high:#b23a48;
  --fdb-ease:cubic-bezier(.65,0,.35,1);
}

.flo-dpdp-widget,
.flo-dpdp-widget *{ box-sizing:border-box; }
.flo-dpdp-widget{
  font-family:'Inter',system-ui,sans-serif;
  position:fixed; right:24px; bottom:24px; z-index:99999;
}

/* ---- Floating Action Button ---- */
.flo-dpdp-fab{
  display:flex; align-items:center; gap:10px;
  background:var(--fdb-teal); color:#fff; border:none; border-radius:32px;
  padding:14px 20px 14px 16px; cursor:pointer;
  box-shadow:0 14px 34px rgba(0,106,122,.38);
  transition:background .25s var(--fdb-ease), transform .25s var(--fdb-ease), box-shadow .25s var(--fdb-ease);
}
.flo-dpdp-fab:hover{ background:var(--fdb-teal-light); transform:translateY(-2px); box-shadow:0 18px 40px rgba(0,106,122,.44); }
.flo-dpdp-fab-icon{ width:22px; height:22px; display:flex; }
.flo-dpdp-fab-icon svg{ width:100%; height:100%; }
.flo-dpdp-fab-icon--close{ display:none; }
.flo-dpdp-widget.is-open .flo-dpdp-fab-icon--open{ display:none; }
.flo-dpdp-widget.is-open .flo-dpdp-fab-icon--close{ display:flex; }
.flo-dpdp-fab-label{ font-size:13.5px; font-weight:600; letter-spacing:.01em; white-space:nowrap; }

/* ---- Panel ---- */
.flo-dpdp-panel{
  position:absolute; right:0; bottom:calc(100% + 16px);
  width:380px; max-width:calc(100vw - 32px);
  max-height:min(640px, 78vh);
  background:#fff; border-radius:12px; overflow:hidden;
  box-shadow:0 40px 80px -20px rgba(8,20,32,.45);
  display:flex; flex-direction:column;
  opacity:0; transform:translateY(16px) scale(.98); pointer-events:none;
  transition:opacity .3s var(--fdb-ease), transform .3s var(--fdb-ease);
}
.flo-dpdp-panel[hidden]{ display:flex; } /* keep transition-able; JS toggles opacity/pointer-events, not display */
.flo-dpdp-widget.is-open .flo-dpdp-panel{
  opacity:1; transform:translateY(0) scale(1); pointer-events:auto;
}

.flo-dpdp-header{
  display:flex; align-items:center; gap:12px;
  background:var(--fdb-navy-900); color:#fff; padding:18px 16px;
  flex-shrink:0;
}
.flo-dpdp-header-icon{
  width:38px; height:38px; border-radius:50%; background:rgba(111,214,224,.14);
  border:1px solid rgba(111,214,224,.35); display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.flo-dpdp-header-icon svg{ width:18px; height:18px; stroke:#6fd6e0; }
.flo-dpdp-header-text{ display:flex; flex-direction:column; gap:2px; flex:1; min-width:0; }
.flo-dpdp-header-text strong{ font-family:'Fraunces',serif; font-weight:500; font-size:15.5px; line-height:1.2; }
.flo-dpdp-header-text span{ font-size:11.5px; color:#9fb0b7; }
.flo-dpdp-close{
  width:30px; height:30px; border-radius:50%; border:1px solid rgba(255,255,255,.2); background:transparent;
  color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; flex-shrink:0;
  transition:background .2s;
}
.flo-dpdp-close svg{ width:13px; height:13px; }
.flo-dpdp-close:hover{ background:rgba(255,255,255,.12); }

.flo-dpdp-progress{ height:3px; background:var(--fdb-teal-pale); flex-shrink:0; }
.flo-dpdp-progress-bar{ height:100%; width:0%; background:var(--fdb-teal); transition:width .4s var(--fdb-ease); }

.flo-dpdp-body{
  padding:22px 20px 24px; overflow-y:auto; background:var(--fdb-cream); flex:1;
}

/* ---- Intro / question / results "cards" ---- */
.flo-dpdp-msg{
  font-size:13.5px; color:var(--fdb-ink-soft); line-height:1.6; margin-bottom:16px;
}
.flo-dpdp-msg strong{ color:var(--fdb-ink); }

.flo-dpdp-qnum{
  font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; font-weight:700; color:var(--fdb-teal); margin-bottom:10px;
}
.flo-dpdp-question{
  font-family:'Fraunces',serif; font-weight:400; font-size:17px; line-height:1.4; color:var(--fdb-ink); margin-bottom:18px;
}
.flo-dpdp-options{ display:flex; flex-direction:column; gap:10px; }
.flo-dpdp-option{
  text-align:left; width:100%; background:#fff; border:1px solid var(--fdb-line); border-radius:8px;
  padding:13px 16px; font-family:inherit; font-size:13.5px; font-weight:600; color:var(--fdb-ink);
  cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:10px;
  transition:border-color .2s, background .2s, color .2s;
}
.flo-dpdp-option:hover{ border-color:var(--fdb-teal); background:var(--fdb-teal-pale); color:var(--fdb-teal); }
.flo-dpdp-option svg{ width:14px; height:14px; flex-shrink:0; opacity:0; transition:opacity .2s; }
.flo-dpdp-option:hover svg{ opacity:1; }

.flo-dpdp-start-btn,
.flo-dpdp-submit-btn{
  width:100%; background:var(--fdb-teal); color:#fff; border:none; border-radius:8px;
  padding:14px 18px; font-family:inherit; font-size:13.5px; font-weight:700; letter-spacing:.02em;
  cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px;
  transition:background .2s;
}
.flo-dpdp-start-btn:hover,
.flo-dpdp-submit-btn:hover{ background:var(--fdb-teal-light); }
.flo-dpdp-start-btn svg,
.flo-dpdp-submit-btn svg{ width:14px; height:14px; }

.flo-dpdp-back{
  margin-top:14px; background:none; border:none; color:var(--fdb-ink-soft); font-size:12px; font-weight:600;
  cursor:pointer; padding:4px 0;
}
.flo-dpdp-back:hover{ color:var(--fdb-teal); }

/* ---- Results screen ---- */
.flo-dpdp-result{ text-align:center; }
.flo-dpdp-score-ring{
  width:112px; height:112px; margin:0 auto 18px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; position:relative;
}
.flo-dpdp-score-ring svg{ position:absolute; inset:0; width:100%; height:100%; transform:rotate(-90deg); }
.flo-dpdp-score-ring-track{ fill:none; stroke:var(--fdb-teal-pale); stroke-width:8; }
.flo-dpdp-score-ring-fill{ fill:none; stroke-width:8; stroke-linecap:round; transition:stroke-dashoffset 1s var(--fdb-ease); }
.flo-dpdp-score-num{ font-family:'Fraunces',serif; font-size:28px; color:var(--fdb-ink); position:relative; z-index:1; }
.flo-dpdp-score-num span{ font-size:14px; }

.flo-dpdp-tier{
  display:inline-block; font-size:11px; letter-spacing:.1em; text-transform:uppercase; font-weight:700;
  padding:6px 14px; border-radius:20px; margin-bottom:14px;
}
.flo-dpdp-tier.tier-low{ background:rgba(13,122,79,.12); color:var(--fdb-risk-low); }
.flo-dpdp-tier.tier-mid{ background:rgba(184,134,11,.12); color:var(--fdb-risk-mid); }
.flo-dpdp-tier.tier-high{ background:rgba(178,58,72,.12); color:var(--fdb-risk-high); }

.flo-dpdp-result-copy{ font-size:13.5px; color:var(--fdb-ink-soft); line-height:1.7; margin-bottom:22px; text-align:left; }

.flo-dpdp-form{ text-align:left; display:flex; flex-direction:column; gap:12px; margin-bottom:6px; }
.flo-dpdp-form label{ font-size:11.5px; font-weight:600; color:var(--fdb-ink); margin-bottom:5px; display:block; }
.flo-dpdp-form input{
  width:100%; border:1px solid var(--fdb-line); border-radius:6px; padding:11px 13px;
  font-family:inherit; font-size:13.5px; background:#fff; color:var(--fdb-ink);
  transition:border-color .2s;
}
.flo-dpdp-form input:focus{ outline:none; border-color:var(--fdb-teal); }
.flo-dpdp-form-note{ font-size:11px; color:#8b98a0; margin-top:10px; line-height:1.5; text-align:left; }
.flo-dpdp-form-status{ font-size:12.5px; margin-top:10px; text-align:left; }
.flo-dpdp-form-status.is-error{ color:var(--fdb-risk-high); }
.flo-dpdp-form-status.is-success{ color:var(--fdb-risk-low); }

.flo-dpdp-restart{
  margin-top:14px; background:none; border:none; color:var(--fdb-ink-soft); font-size:12px; font-weight:600;
  text-decoration:underline; cursor:pointer;
}
.flo-dpdp-restart:hover{ color:var(--fdb-teal); }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:480px){
  .flo-dpdp-widget{ right:16px; bottom:16px; }
  .flo-dpdp-fab-label{ display:none; } /* icon-only FAB on phones to save space */
  .flo-dpdp-fab{ padding:14px; border-radius:50%; }
  .flo-dpdp-panel{
    position:fixed; left:12px; right:12px; bottom:88px;
    width:auto; max-width:none; max-height:min(72vh, 560px);
  }
}
@media (max-width:360px){
  .flo-dpdp-panel{ bottom:80px; max-height:68vh; }
  .flo-dpdp-body{ padding:18px 16px 20px; }
  .flo-dpdp-question{ font-size:15.5px; }
}