/* ══ RequestWizard.css — Модалка створення заявки (усі кроки, ПК і телефон).
   Правити тут; сторінка підключає чанк через site_css() у шаблоні. ══ */

.wz { position:fixed; inset:0; z-index:95; background:rgba(20,24,28,.55);
      display:flex; align-items:flex-start; justify-content:center;
      padding:56px 16px; overflow-y:auto; }
.wz[hidden] { display:none; }
.wz-box { position:relative; width:100%; max-width:560px; background:#fff;
          border-radius:6px; padding:20px 44px 30px;
          box-shadow:0 18px 50px rgba(0,0,0,.3); }
.wz-head { display:flex; align-items:center; gap:16px; margin-bottom:26px; }
.wz-arw { flex:0 0 auto; border:0; background:none; cursor:pointer;
    color:var(--link); padding:4px; line-height:0; }
.wz-arw[hidden] { display:none; }
.wz-arw svg { width:24px; height:24px; }
.wz-arw:hover { opacity:.75; }
.wz-prog { flex:1; display:flex; gap:5px; }
.wz-prog i { flex:1; height:5px; border-radius:3px; background:var(--line-2); }
.wz-prog i.on { background:var(--green); }
.wz-step h3 { font-family:'Poppins',sans-serif; font-size:17px; line-height:1.4; font-weight:700;
              color:#414141; text-align:center; margin-bottom:20px; }
.wz-step textarea, .wz-step input[type=text], .wz-step input[type=tel],
.wz-step input[type=email] { width:100%; border:1px solid var(--line); border-radius:4px;
    font-family:inherit; font-size:15px; color:var(--ink);
    padding:12px 14px; margin-bottom:12px; }
.wz-step textarea:focus, .wz-step input:focus, .wz-city:focus-within { outline:none; border-color:var(--green); }
.wz-city { display:flex; align-items:center; gap:10px; border:1px solid var(--line);
           border-radius:4px; padding:0 14px; margin-bottom:12px;
           color:var(--muted); }
.wz-city svg { flex:0 0 18px; width:18px; height:18px; }
.wz-city select { flex:1; border:0; outline:0; background:none;
                  font-family:inherit; font-size:15px; color:var(--ink);
                  height:46px; cursor:pointer; }
.wz-chips { display:flex; flex-direction:column; gap:10px; margin-bottom:6px; }
.wz-chips button { border:1px solid var(--line); background:#fff; cursor:pointer;
                   border-radius:4px; padding:13px 16px; font-family:inherit;
                   font-size:15px; color:var(--ink); text-align:left; }
.wz-chips button:hover { border-color:var(--green); color:var(--green); }
.wz-next { display:block; margin:8px auto 0; border:0; cursor:pointer;
           background:var(--green); color:#fff; font-family:inherit;
           font-size:15px; font-weight:700; padding:12px 34px;
           border-radius:4px; }
.wz-next:hover { background:var(--green-d); }
.wz-next:disabled { opacity:.6; cursor:default; }
.wz-skip { display:block; margin:14px auto 0; border:0; background:none;
           cursor:pointer; color:var(--link); font-family:inherit;
           font-size:14px; }
.wz-skip:hover { text-decoration:underline; }
.wz-err { color:var(--red); font-size:13px; margin:2px 0 8px; }
.wz-legal { font-size:12px; color:#8A8A8A; text-align:center; margin-top:14px; }
.wz-legal a { color:var(--link); }
.wz-done { text-align:center; padding:8px 0 4px; }
.wz-done svg { width:56px; height:56px; color:var(--green); margin-bottom:14px; }
.wz-done p { font-size:14px; line-height:22px; color:#676767;
             max-width:360px; margin:0 auto 6px; }
@media (max-width:600px) {
  .wz { padding:18px 10px; }
  .wz-box { padding:18px 20px 24px; }
}
.wz-prog { display:block; flex:1; height:8px; border-radius:5px;
           background:var(--line-2); margin:8px auto 26px; max-width:600px;
           overflow:hidden; }
.wz-prog i { display:block; height:100%; width:8%; border-radius:5px;
             background:var(--green); transition:width .45s ease; }
.wz-opts { display:flex; flex-direction:column; gap:12px; margin-bottom:6px; }
.wz-opt { display:flex; align-items:center; gap:16px; text-align:left;
          border:1px solid #ebebeb; border-radius:8px; background:#fff;
          padding:17px 18px; cursor:pointer; font-family:inherit;
          font-size:16px; color:#2E3238; }
.wz-opt:hover { border-color:#cfd4d9; }
.wz-opt.on { background:#F6F6F6; }
.wz-opt i { flex:0 0 22px; width:22px; height:22px; border:2px solid #C7CCD1;
            background:#fff; position:relative; }
.wz-opt i.rb { border-radius:50%; }
.wz-opt i.cb { border-radius:4px; }
.wz-opt.on i { border-color:var(--green); }
.wz-opt.on i.rb::after { content:''; position:absolute; inset:3px;
            border-radius:50%; background:var(--green); }
.wz-opt.on i.cb::after { content:''; position:absolute; left:5px; top:1px;
            width:6px; height:11px; border:solid var(--green);
            border-width:0 2.5px 2.5px 0; transform:rotate(42deg); }
.wz-foot { display:flex; justify-content:flex-end; gap:14px; margin-top:22px; }
.wz-foot .wz-back { border:1px solid var(--link); background:#fff;
    color:var(--link); font-family:inherit; font-size:14px; font-weight:700;
    letter-spacing:.4px; text-transform:uppercase; padding:14px 26px;
    border-radius:4px; cursor:pointer; margin:0; }
.wz-foot .wz-next { margin:0; text-transform:uppercase; letter-spacing:.4px;
    font-size:14px; padding:14px 30px; }
.wz-foot .wz-next:disabled { background:#F0F1F2; color:#A9AEB4; }
.wz-hint { font-size:15px; line-height:22px; color:#414141; margin:6px 0 12px; }
.wz-photos { display:flex; gap:10px; align-items:flex-start; margin-bottom:4px; }
.wz-photo-add { flex:0 0 96px; height:96px; border:1px dashed var(--line);
    border-radius:6px; background:#FAFAFA; cursor:pointer;
    display:flex; flex-direction:column; align-items:center;
    justify-content:center; gap:6px; color:#8A8A8A; }
.wz-photo-add svg { width:26px; height:26px; }
.wz-photo-add span { font-size:12px; text-align:center; line-height:1.3; }
.wz-thumbs { display:flex; flex-wrap:wrap; gap:8px; }
.wz-thumbs img { width:64px; height:64px; object-fit:cover; border-radius:6px;
    border:1px solid var(--line); }
.wz-via { display:flex; justify-content:center; gap:56px; margin:6px 0 24px; }
.wz-via-b { border:0; background:none; cursor:pointer; font-family:inherit;
    text-align:center; color:#2E3238; }
.wz-via-ic { display:flex; align-items:center; justify-content:center;
    width:104px; height:104px; margin:0 auto 12px; border-radius:50%;
    border:1px solid #55606B; color:#2E3238; transition:all .15s; }
.wz-via-ic svg { width:44px; height:44px; }
.wz-via-b b { display:block; font-size:15px; line-height:20px; }
.wz-via-b small { display:block; font-size:13px; font-weight:700;
    margin-top:3px; color:#2E3238; }
.wz-via-b.on .wz-via-ic { background:var(--green-l); border-color:var(--green);
    color:var(--green); }
.wz-via-b.on b { color:var(--green-d); }
.wz-match { display:flex; justify-content:center; gap:44px; padding:26px 0 12px; }
.wz-mc { text-align:center; opacity:0; transform:translateY(8px); }
.wz-match.go .wz-mc { animation:wzin .5s ease forwards; }
.wz-match.go .wz-mc:nth-child(2) { animation-delay:.45s; }
.wz-match.go .wz-mc:nth-child(3) { animation-delay:.9s; }
.wz-ma { display:flex; align-items:center; justify-content:center;
    width:64px; height:64px; margin:0 auto 10px; border-radius:50%;
    color:#fff; font-size:22px; font-weight:700; }
.wz-mc em { display:block; font-style:normal; color:var(--star);
    letter-spacing:2px; margin-bottom:10px; }
.wz-mc em i { font-style:normal; color:var(--line); }
.wz-mc u { display:block; width:86px; height:8px; border-radius:4px;
    background:var(--line-2); margin:0 auto 6px; text-decoration:none; }
.wz-mc u.w2 { width:60px; }
@media (max-width:600px) {
  .wz-via { gap:26px; }
  .wz-via-ic { width:84px; height:84px; }
  .wz-match { gap:20px; }
  .wz-foot { justify-content:space-between; }
  .wz-foot .wz-back, .wz-foot .wz-next { padding:13px 18px; }
}
.wz-step-quit { text-align:center; padding-top:14px; }
.wz-step-quit h3 { font-family:'Poppins',sans-serif; font-size:19px;
    font-weight:700; line-height:29px; color:#414141;
    max-width:470px; margin:0 auto 22px; }
.wz-quit-p { font-size:16px; line-height:26px; color:#676767;
    max-width:430px; margin:0 auto 40px; }
.wz-quit-btns { display:flex; flex-direction:column; align-items:center;
    gap:12px; }
.wz-quit-btns .wz-next { display:block; width:100%; max-width:340px;
    margin:0; text-transform:uppercase; letter-spacing:.4px;
    font-size:14px; padding:15px 20px; }
.wz-quit-del { display:block; width:100%; max-width:340px; margin:0;
    border:1px solid var(--link); background:#fff; color:var(--link);
    font-family:inherit; font-size:14px; font-weight:700;
    letter-spacing:.4px; text-transform:uppercase; padding:14px 20px;
    border-radius:4px; cursor:pointer; }
.wz-quit-del:hover { background:#F4F8FC; }
.wz-ddbox { position:relative; cursor:pointer; user-select:none; }
.wz-ddval { flex:1; font-size:15px; color:#A0A0A0; line-height:46px; }
.wz-ddbox.set .wz-ddval { color:var(--ink); }
.wz-ddchev { flex:0 0 16px; width:16px; height:16px; color:#414141; }
.wz-dd { position:absolute; left:-1px; right:-1px; top:100%; z-index:60;
    list-style:none; margin:0; padding:6px 0; max-height:300px;
    overflow:auto; background:#fff; border:1px solid var(--line);
    border-radius:0 0 4px 4px; box-shadow:0 12px 30px rgba(0,0,0,.14); }
.wz-dd li { padding:13px 18px; font-size:16px; color:#414141; }
.wz-dd li:hover { background:#F6F6F6; }
.wz-code-p { color:#676767; font-size:16px; margin:0 0 18px; }
.wz-code { display:block; width:100%; max-width:452px; height:48px; border:1px solid #EBEBEB;
           border-radius:4px; font:inherit; font-size:24px; letter-spacing:14px;
           text-align:center; color:#414141; outline:none; }
.wz-code:focus { border-color:var(--green); }
.wz-again { display:block; margin:14px 0 0; background:none; border:0; color:#0071BC;
            font:inherit; font-size:14px; cursor:pointer; padding:0; }
@media (max-width:900px) {
  .wz { padding:0; background:#fff; align-items:stretch;
          overflow-y:auto; }
  .wz-box { max-width:none; width:100%; min-height:100%;
              border-radius:0; box-shadow:none;
              padding:70px 15px 15px; }
  .wz-head { position:fixed; top:0; left:0; right:0; z-index:10;
               gap:0; margin:0; background:#fff;
               padding:28px 15px 15px 50px; }
  .wz-arw { position:fixed; top:24px; left:11px; z-index:11;
              padding:4px; }
  .wz-prog { margin:0; }
  .wz-step { padding:0 0 80px; }
  .wz-step h3 { font-size:14px; line-height:24px; margin-bottom:15px; }
  .wz-foot { position:fixed; bottom:0; left:15px; right:15px;
               z-index:9; margin:0; padding:0 2px 10px;
               background:#fff; }
  .wz-foot .wz-back, .wz-foot .wz-next { flex:1; padding:13px 10px; }
  .wz-step-quit .wz-quit-btns { position:static; }
}
