/* Смета на бота. Пара к assets/smeta.js */
.smeta{margin-top:30px}
.sm-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:26px;align-items:stretch}
.sm-col{display:flex;flex-direction:column}
.sm-out{margin-top:auto}
.sm-lbl{font-family:'Golos Text',system-ui,sans-serif;font-size:13px;letter-spacing:.09em;text-transform:uppercase;
  color:var(--muted);margin-bottom:12px}
.sm-types{display:flex;flex-direction:column;gap:8px}
.sm-type{display:flex;align-items:center;gap:14px;width:100%;text-align:left;
  background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:13px 16px;color:var(--text);
  transition:border-color .18s ease,background .18s ease}
.sm-type:hover{border-color:var(--blue)}
.sm-type.on{border-color:var(--blue);background:var(--surface2)}
.sm-type i{flex:0 0 34px;height:34px;display:grid;place-items:center;border:1px solid var(--line);
  border-radius:9px;color:var(--blue)}
.sm-type.on i{border-color:var(--blue)}
.sm-type i svg{width:19px;height:19px}
.sm-type span{flex:1;min-width:0}
.sm-type b{display:block;font-size:15px;font-weight:600;line-height:1.25}
.sm-type em{display:block;font-style:normal;font-size:13px;color:var(--muted);line-height:1.4;margin-top:2px}
.sm-type u{text-decoration:none;font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--amber);white-space:nowrap}
.sm-addons{display:block;min-height:40px}
.sm-chip{background:var(--surface);border:1px solid var(--line);border-radius:99px;padding:8px 14px;
  font-size:13px;color:var(--muted)}
.sm-chip:hover{border-color:var(--blue);color:var(--text)}
.sm-chip.on{background:var(--blue-deep);border-color:var(--blue-deep);color:#fff}
.sm-chip.on:before{content:"\2713\00a0"}
.sm-hint{color:var(--muted);font-size:13px}
.sm-out{margin-top:22px;background:var(--surface2);border:1px solid var(--line);border-radius:14px;padding:22px}
.sm-pick{font-size:13px;color:var(--muted)}
.sm-price{font-family:'JetBrains Mono',monospace;font-size:clamp(1.7rem,3vw,2.3rem);font-weight:400;
  color:var(--blue);line-height:1.15;margin-top:4px}
.sm-term{font-family:'Golos Text',system-ui,sans-serif;font-size:13px;color:var(--muted);margin-top:6px}
.sm-inc{font-size:13px;color:var(--text);margin-top:14px;padding-top:14px;border-top:1px solid var(--line);line-height:1.5}
.sm-cta{margin-top:18px;width:100%;justify-content:center;text-align:center}
.sm-note{font-size:13px;color:var(--muted);margin-top:12px;line-height:1.5}
@media(max-width:900px){
  .sm-grid{grid-template-columns:1fr;gap:22px}
  .sm-out{position:sticky;bottom:10px;box-shadow:0 8px 26px rgba(0,0,0,.45)}
}
.sm-chip.sm-own{border-style:dashed}
.sm-chip.sm-own.on{background:transparent;border-color:var(--blue);border-style:dashed;color:var(--blue)}
.sm-ownnote{display:block;margin-top:6px;color:var(--muted)}

/* Телефон: три экрана вместо колонки. Десктоп ничего из этого не видит. */
.smeta .sm-nav,.smeta .sm-next{display:none}
@media(max-width:900px){
  .smeta .sm-nav{display:flex;align-items:center;gap:10px;margin-bottom:14px}
  .smeta .sm-back{background:none;border:0;color:var(--blue);font-size:20px;line-height:1;padding:0 2px}
  .smeta .sm-title{font-size:15px;font-weight:600}
  .smeta .sm-count{margin-left:auto;font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--muted)}
  .smeta .sm-next{display:block;width:100%;margin-top:18px;background:var(--blue);color:#0A1420;
    border:0;border-radius:10px;padding:13px;font-size:15px;font-weight:600}
  .smeta .sm-next[disabled]{opacity:.4}
  .smeta .sm-lbl{display:none}
  .smeta.sm-phone.sm-s1 .sm-p2{display:none}
  .smeta.sm-phone.sm-s2 .sm-p1,.smeta.sm-phone.sm-s2 .sm-out{display:none}
  .smeta.sm-phone.sm-s3 .sm-p1,.smeta.sm-phone.sm-s3 .sm-addons{display:none}
  .smeta.sm-phone .sm-out{margin-top:0;position:static;box-shadow:none}
  .sm-grid{gap:0}
}

/* Тумблеры дополнений */
.sm-tog{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;
  background:none;border:0;border-bottom:1px solid var(--line);padding:11px 2px;text-align:left;color:var(--muted)}
.sm-tog span{font-size:13px;line-height:1.35}
.sm-tog.on{color:var(--text)}
.sm-tog i{width:36px;height:20px;border-radius:99px;background:#2c3d51;position:relative;flex:none;
  transition:background .18s ease}
.sm-tog.on i{background:var(--blue)}
.sm-tog i:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;
  background:#fff;transition:left .18s ease}
.sm-tog.on i:after{left:18px}
.sm-tog.sm-own span{border-bottom:1px dashed var(--line);padding-bottom:1px}
.sm-tog:last-child{border-bottom:0}

/* Доп. услуги — отдельная группа под тумблерами фич продукта: свой заголовок,
   верхняя граница отделяет от списка выше. На телефоне не прячем (в отличие
   от .sm-lbl) — это не заголовок шага, а подпись внутри уже открытого шага. */
.sm-subhdr{font-family:'Golos Text',system-ui,sans-serif;font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted);margin-top:16px;padding-top:14px;
  border-top:1px solid var(--line)}

/* Модуль должен выглядеть одинаково и на сайте, и в мини-аппе. На сайте синюю
   кнопку красит общий .btn-primary, в мини-аппе его нет — держим свой запас. */
.smeta .sm-cta{display:block;background:var(--blue);color:#0A1420;border-radius:10px;
  padding:13px 18px;font-weight:600;font-size:15px;text-decoration:none;border:0}
/* В мини-аппе .sm-cta — не ссылка наружу, а кнопка: шлёт смету Илье и
   открывает разговор в соседнем табе. У <button> свой системный шрифт и
   свой курсор — возвращаем общие, всё остальное уже описано выше. */
.smeta button.sm-cta{font-family:inherit;cursor:pointer}
.smeta .sm-cta:hover{text-decoration:none;box-shadow:0 6px 24px rgba(94,181,247,.35)}

/* Пустое состояние сметы: ни прочерка, ни активной кнопки. */
.smeta.sm-empty .sm-price,.smeta.sm-empty .sm-term{display:none}
.smeta.sm-empty .sm-inc{border-top:0;padding-top:4px;color:var(--muted)}
.smeta.sm-empty .sm-cta{opacity:.4;pointer-events:none}

/* ── Месячная часть цены ──────────────────────────────────────────────────
   Отдельным блоком под сроком, визуально тише разовой цифры: разовая — то,
   что решает человек сегодня, месячная — то, что он проверит потом. */
.sm-mo{margin-top:12px;padding-top:12px;border-top:1px dashed var(--line);
       font-size:14px;color:var(--text);line-height:1.45}
.sm-mo:empty{display:none;border-top:0;padding-top:0;margin-top:0}
.sm-mo b{font-family:'JetBrains Mono',monospace;font-weight:400}
.sm-mo em{display:block;font-style:normal;font-size:12.5px;color:var(--muted);margin-top:3px}
.sm-min{display:flex;align-items:center;justify-content:space-between;gap:12px;
        margin-top:10px;font-size:12.5px;color:var(--muted)}
.sm-min input{width:96px;padding:7px 9px;border:1px solid var(--line);border-radius:8px;
              background:var(--surface);color:var(--text);
              font-family:'JetBrains Mono',monospace;font-size:13px;text-align:right}
.sm-min input:focus{outline:2px solid var(--accent);outline-offset:1px}
.smeta.sm-empty .sm-mo,.smeta.sm-empty .sm-min{display:none}

/* ── Форма заявки под ценой ───────────────────────────────────────────────
   Пара к .sm-lead в smeta.js. Форма живёт в трёх разных хозяйских страницах
   (index.html, calc.html, вкладка «Смета» в vitrina.html), поэтому она не
   может занять классы .a-* формы аудита — те объявлены только внутри
   vitrina.html и за её пределами не существуют. Размеры, радиусы и цвета
   взяты оттуда один в один, через те же переменные, что и остальной виджет;
   зелёная и янтарная рамки — те же rgba, что у .a-ok/.a-err. */
.sm-lead{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.sm-lead-h{font-size:14px;color:var(--text);margin:0 0 16px;line-height:1.45}
.sm-lead-row{display:block;margin-bottom:14px}
.sm-lead-row span{display:block;font-size:13px;color:var(--muted);margin:0 0 7px}
.sm-lead-row input,.sm-lead-row textarea{width:100%;background:var(--surface);
  border:1px solid var(--line);border-radius:10px;color:var(--text);padding:12px 14px;
  font-size:14px;font-family:inherit}
.sm-lead-row input:focus,.sm-lead-row textarea:focus{outline:none;border-color:var(--blue)}
.sm-lead-row textarea{resize:vertical;min-height:76px}
.sm-lead-row input::placeholder,.sm-lead-row textarea::placeholder{color:var(--muted);opacity:.7}
.sm-lead-btn{width:100%;border:0;border-radius:10px;padding:13px;font-size:15px;font-weight:600;
  background:var(--blue);color:#0A1420;font-family:inherit;cursor:pointer}
.sm-lead-btn[disabled]{opacity:.5;cursor:default}
.sm-lead-small{font-size:12.5px;color:var(--muted);margin-top:13px;line-height:1.4}
.sm-lead-ok,.sm-lead-err{margin-top:14px;padding:12px 14px;border-radius:10px;font-size:13px;
  color:var(--text);display:none;line-height:1.4}
.sm-lead-ok{border:1px solid rgba(83,215,105,.5)}
.sm-lead-err{border:1px solid rgba(245,183,89,.5)}
.sm-lead-err a{color:var(--blue)}
/* Пока ничего не выбрано, отправлять нечего — форма прячется вместе с ценой. */
.smeta.sm-empty .sm-lead{display:none}
