/* =====================================================================
   e2mp questionnaire treatment — credit_rating, credit_score,
   financial_ranking, compliance (and any .w3l-news page whose form is a
   list of .form-check-inline radio questions). Purely additive: turns the
   flat question list into numbered cards with a sticky progress header.
   Scoped to .qz-app (added by e2mp-questionnaire.js) so nothing else moves.
   ===================================================================== */
.qz-app{ --qz-navy:#0d2447; --qz-teal:#0d7c86; --qz-gold:#f1b12b;
  --qz-line:#e7ebf4; --qz-muted:#6c7a96; --qz-card:#fff; }

/* sticky progress header */
.qz-progress{
  position:-webkit-sticky; position:sticky; top:88px; z-index:20;
  background:rgba(255,255,255,.94); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border:1px solid var(--qz-line); border-radius:14px;
  box-shadow:0 8px 26px rgba(28,42,74,.07);
  padding:13px 18px; margin:0 auto 20px; max-width:960px;
  display:flex; align-items:center; gap:16px; flex-wrap:wrap;
}
.qz-progress__text{ font-family:'Inter',sans-serif; font-size:13.5px; font-weight:700; color:var(--qz-navy); white-space:nowrap; }
.qz-progress__text span{ color:var(--qz-teal); }
.qz-progress__bar{ flex:1; min-width:160px; height:8px; background:#eef2f8; border-radius:999px; overflow:hidden; }
.qz-progress__fill{ height:100%; width:0; border-radius:999px;
  background:linear-gradient(90deg,var(--qz-teal),var(--qz-gold)); transition:width .35s ease; }

/* each question -> card */
.qz-app .qz-q{
  background:var(--qz-card); border:1px solid var(--qz-line); border-radius:14px;
  padding:18px 20px 16px 56px; margin:0 auto 14px; max-width:960px; position:relative;
  box-shadow:0 6px 20px rgba(28,42,74,.05); transition:border-color .18s, box-shadow .18s;
}
.qz-app .qz-q:hover{ border-color:#d7e2f0; box-shadow:0 10px 26px rgba(28,42,74,.09); }
.qz-app .qz-q.is-done{ border-color:rgba(13,124,134,.35); background:linear-gradient(0deg, rgba(13,124,134,.03), rgba(13,124,134,.03)), #fff; }
/* number badge */
.qz-app .qz-q::before{
  content:attr(data-qnum); position:absolute; left:16px; top:18px;
  width:28px; height:28px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:#eef2f8; color:var(--qz-muted); font-family:'Inter',sans-serif; font-weight:700; font-size:12.5px;
}
.qz-app .qz-q.is-done::before{ background:var(--qz-teal); color:#fff; content:"\2713"; }

/* question text */
.qz-app .qz-q > label,
.qz-app .qz-q label[name]{
  display:block; font-family:'Inter',sans-serif; font-weight:600 !important;
  color:var(--qz-navy) !important; font-size:14.5px !important; line-height:1.5; margin:0 0 12px !important;
}
/* answer options row */
.qz-app .qz-q .form-check-inline{
  display:inline-flex !important; align-items:center; gap:8px;
  margin:0 10px 8px 0 !important; padding:8px 14px; border:1px solid var(--qz-line);
  border-radius:999px; background:#fbfdff; cursor:pointer; transition:.16s;
}
.qz-app .qz-q .form-check-inline:hover{ border-color:var(--qz-teal); background:#f3fafb; }
.qz-app .qz-q .form-check-label{ margin:0 !important; font-size:13.5px !important; color:#28415b !important; cursor:pointer; font-weight:500; }
.qz-app .qz-q input[type=radio],.qz-app .qz-q input[type=checkbox]{ accent-color:var(--qz-teal); width:15px; height:15px; margin:0; cursor:pointer; }
/* free-text answers inside a question */
.qz-app .qz-q input[type=text],.qz-app .qz-q input[type=number],.qz-app .qz-q textarea,.qz-app .qz-q select{
  height:44px !important; padding:10px 13px !important; border:1px solid var(--qz-line) !important;
  border-radius:10px !important; background:#fbfdff !important; width:100% !important; max-width:520px;
  font-family:'Inter',sans-serif !important; font-size:14px !important; color:#17233c !important; }
.qz-app .qz-q textarea{ height:auto !important; min-height:88px !important; }
.qz-app .qz-q input:focus,.qz-app .qz-q textarea:focus,.qz-app .qz-q select:focus{
  border-color:var(--qz-teal) !important; background:#fff !important;
  box-shadow:0 0 0 3px rgba(13,124,134,.12) !important; outline:none !important; }

/* submit area */
.qz-app .text-center.mt-2,.qz-app .qz-submit{ max-width:960px; margin:18px auto 30px; text-align:center; }

@media (max-width:640px){
  .qz-app .qz-q{ padding:16px 14px 14px 50px; }
  .qz-progress{ top:76px; }
}
