/* service.css — стили экрана «Сервис: метка → карточка машины → чек-лист → акт → готово».
   Все классы с префиксом .sv-, общие классы из style.css не переопределяются. */

.sv-root{min-width:0;overflow-wrap:anywhere}
.sv-lead{color:var(--muted);font-size:17px;line-height:1.4;margin:0 0 14px}
.sv-note{color:var(--muted);font-size:14px;line-height:1.4;margin:12px 0 0}
.sv-step{color:var(--muted);font-size:14px;font-weight:600;margin-bottom:8px;letter-spacing:.01em}
.sv-actions{margin-top:16px}
.sv-empty{padding:14px 0;font-size:15px}

/* ---------- Шаг 1: метка ---------- */
.sv-tagcard{text-align:center;padding:22px 16px 18px;border-style:dashed;border-color:#b9c7d6;background:linear-gradient(180deg,#fff 0,#f6f8fb 100%)}
.sv-tagpic{width:120px;height:120px;margin:0 auto 10px;color:var(--accent);display:grid;place-items:center}
.sv-nfc{width:120px;height:120px}
.sv-arc{opacity:.9}
.sv-tagname{font-weight:700;font-size:18px;letter-spacing:.02em}
.sv-tagsub{color:var(--muted);font-size:15px;line-height:1.4;margin:4px auto 16px;max-width:420px}
.sv-scanbtn{max-width:420px;margin:0 auto}
.sv-scanning .sv-arc1{animation:svpulse .8s ease-in-out infinite}
.sv-scanning .sv-arc2{animation:svpulse .8s ease-in-out .15s infinite}
.sv-scanning .sv-arc3{animation:svpulse .8s ease-in-out .3s infinite}
.sv-scanning{border-color:var(--accent);background:var(--accent-soft)}
@keyframes svpulse{0%,100%{opacity:.25}50%{opacity:1}}
.sv-spin{width:20px;height:20px;border-radius:50%;border:3px solid rgba(255,255,255,.35);border-top-color:#fff;animation:svspin .7s linear infinite;flex:none}
@keyframes svspin{to{transform:rotate(360deg)}}

/* ---------- Шаг 2: карточка машины ---------- */
.sv-mhead{display:flex;gap:14px;align-items:center;margin-bottom:10px}
.sv-mic{width:56px;height:56px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;flex:none}
.sv-mic svg{width:30px;height:30px}
.sv-mic.small{width:44px;height:44px}
.sv-mic.small svg{width:24px;height:24px}
.sv-mtitle{min-width:0}
.sv-mtitle .h1{margin:0;font-size:22px}
.sv-mcls{color:var(--muted);font-size:14px;font-weight:600;margin-bottom:2px}
.sv-kv dd a{text-decoration:none;font-weight:600}
.sv-kv dd{text-align:right}
/* Подпись слева не рвётся посередине слова («Ответственны / й») из-за overflow-wrap:anywhere на .sv-root */
.sv-kv dt{white-space:nowrap;flex:none}
.sv-check-info h2{margin-bottom:6px}
.sv-check-count{font-size:17px}
.sv-check-count b{font-size:20px}
.sv-check-sub{color:var(--muted);font-size:15px;line-height:1.4;margin-top:6px}
.sv-docs{display:flex;flex-direction:column;gap:8px}
.sv-doc{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;width:100%;min-height:56px;padding:8px 12px;border:1px solid var(--line);border-radius:var(--radius-s);background:var(--card);text-align:left;color:var(--text)}
.sv-doc-ic{width:40px;height:40px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;flex:none}
.sv-doc-ic svg{width:22px;height:22px}
.sv-doc-b{min-width:0;display:block}
.sv-doc-t{display:block;font-weight:600;line-height:1.3}
.sv-doc-s{display:block;color:var(--muted);font-size:14px}
.sv-doc-r{color:#9aa3aa;display:grid;place-items:center}
.sv-doc-r svg{width:20px;height:20px}
.sv-more{display:inline-flex;align-items:center;gap:4px;min-height:44px;margin-top:6px;text-decoration:none;font-weight:600}
.sv-more svg{width:18px;height:18px}

/* ---------- Шаг 3: чек-лист ---------- */
.sv-head-row{display:flex;gap:12px;align-items:center;margin-bottom:12px}
.sv-head-b{min-width:0}
.sv-head-b .h1{margin:0;font-size:22px}
.sv-head-s{color:var(--muted);font-size:15px}
.sv-progress{padding:12px 16px}
.sv-progress-t{font-size:16px;margin-bottom:8px}
.sv-progress-t b{font-size:18px}
.sv-bar{height:10px;border-radius:5px;background:#e6e9e6;overflow:hidden}
.sv-bar-in{height:100%;background:var(--accent);border-radius:5px;transition:width .25s ease-out}
.sv-progress.all .sv-bar-in{background:var(--green-dot)}
.sv-hint{color:var(--muted);font-size:15px;line-height:1.4;margin:0 0 10px;display:flex;gap:8px;align-items:flex-start}
.sv-items{display:flex;flex-direction:column;gap:10px}
.sv-item{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:12px 12px 10px;overflow-wrap:anywhere;transition:background .2s}
.sv-item.done{background:#f7faf7;border-color:#cfe4d6}
.sv-item.urgent{border-color:#e3a39b}
.sv-item-main{display:grid;grid-template-columns:56px minmax(0,1fr);gap:12px;align-items:start}
.sv-box{width:56px;height:56px;border-radius:14px;border:2px solid #b9c2c9;background:var(--card);color:transparent;display:grid;place-items:center;flex:none;padding:0}
.sv-box svg{width:32px;height:32px;stroke-width:2.6}
.sv-item.done .sv-box{background:var(--green-dot);border-color:var(--green-dot);color:#fff}
.sv-item-b{min-width:0;padding-top:4px}
.sv-item-t{font-weight:600;font-size:17px;line-height:1.3}
.sv-item.done .sv-item-t{color:var(--muted);font-weight:500}
.sv-item-n{color:var(--muted);font-weight:600}
.sv-item-h{color:var(--muted);font-size:15px;line-height:1.35;margin-top:3px}
.sv-item-marks{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.sv-photos{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.sv-photo{width:72px;height:54px;border-radius:8px;background:#e4e7e9;border:1px solid #d0d5d9;color:#6b747b;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:12px;line-height:1;flex:none}
.sv-photo svg{width:20px;height:20px}
.sv-item-btns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:10px}
.sv-mini{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:48px;padding:6px 6px;border-radius:10px;border:1.5px solid var(--line);background:var(--card);color:var(--muted);font-size:14px;font-weight:600;line-height:1.15;text-align:center;overflow-wrap:anywhere}
.sv-mini svg{width:18px;height:18px;flex:none}
.sv-mini.on-red{background:var(--red-soft);border-color:#e3a39b;color:var(--red)}
.sv-mini.on-yellow{background:var(--yellow-soft);border-color:#e0c37a;color:var(--yellow)}
@media (max-width:399px){
  .sv-item-btns{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sv-item-btns .sv-mini:last-child{grid-column:1 / -1}
}
.sv-finish[disabled]{background:#9aa3aa;border-color:#9aa3aa;color:#fff;opacity:1;cursor:not-allowed}

/* ---------- Шаг 4: акт ---------- */
.sv-act{padding:18px 16px;border-color:#c9cfd4;box-shadow:0 2px 10px rgba(20,30,40,.06)}
.sv-act-head{display:flex;gap:12px;align-items:center;padding-bottom:12px;margin-bottom:8px;border-bottom:2px solid var(--text)}
.sv-act-logo{width:44px;height:44px;border-radius:10px;background:var(--text);color:#fff;display:grid;place-items:center;flex:none}
.sv-act-logo svg{width:24px;height:24px}
.sv-act-title{font-weight:700;font-size:19px;line-height:1.2}
.sv-act-sub{color:var(--muted);font-size:14px}
.sv-act-h{font-size:16px;font-weight:700;margin:16px 0 6px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}
.sv-works li,.sv-remarks li,.sv-saved li{display:flex;gap:10px;align-items:flex-start;padding:7px 0;border-top:1px solid #eceeec;line-height:1.4}
.sv-works li:first-child,.sv-remarks li:first-child,.sv-saved li:first-child{border-top:0}
.sv-works svg{width:20px;height:20px;color:var(--green);flex:none;margin-top:2px}
.sv-remarks li .badge{flex:none;margin-top:1px}
.sv-remarks li.red span{color:var(--red)}
.sv-remarks li.yellow span{color:var(--yellow)}
.sv-noremarks{color:var(--green);font-weight:600}
.sv-act-photos{display:flex;gap:8px;align-items:center;color:var(--muted);margin-top:14px;font-size:15px}
.sv-act-photos svg{width:20px;height:20px;flex:none}
.sv-sign-wrap{position:relative;border:2px dashed #b9c2c9;border-radius:var(--radius-s);background:#fbfcfd;overflow:hidden}
.sv-sign-canvas{display:block;width:100%;height:140px;touch-action:none;cursor:crosshair}
.sv-sign-hint{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);text-align:center;color:#9aa3aa;font-size:15px;pointer-events:none}
.sv-sign-wrap.signed{border-color:var(--accent);border-style:solid}
.sv-sign-wrap.signed .sv-sign-hint{display:none}
.sv-sign-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:10px;flex-wrap:wrap}
.sv-signer{color:var(--muted);font-size:15px;min-width:0}
.sv-clear{flex:none;min-height:44px}

/* ---------- Шаг 5: готово ---------- */
.sv-done{text-align:center;padding:24px 16px}
.sv-done-ic{width:72px;height:72px;border-radius:50%;background:var(--green-dot);color:#fff;display:grid;place-items:center;margin:0 auto 12px;animation:svpop .35s ease-out}
.sv-done-ic svg{width:40px;height:40px;stroke-width:2.6}
@keyframes svpop{from{transform:scale(.6);opacity:0}to{transform:none;opacity:1}}
.sv-done .h1{margin:0 0 4px;font-size:22px}
.sv-done-s{color:var(--muted)}
.sv-saved svg{width:20px;height:20px;color:var(--accent);flex:none;margin-top:2px}
.sv-saved a{font-weight:600;text-decoration:none}

/* ---------- Планшет и шире ---------- */
@media (min-width:900px){
  .sv-root{max-width:720px;margin:0 auto}
  .sv-act{padding:26px 28px}
  .sv-done{padding:32px 24px}
}