/* SmartGard FOV visualiser -- shared styles for the Hikvision product catalogue.
   Paired with sg-fov.js. Scoped under .sg-fov so nothing leaks into Divi. */
.sg-fov{font-family:Montserrat,system-ui,sans-serif;color:#1b1b1b;max-width:100%}
.sg-fov *{box-sizing:border-box}
.sg-fov svg{display:block;width:100%;height:auto}
.sg-fov__model{font-size:20px;font-weight:700;color:#000;margin:0 0 2px;line-height:1.3}
.sg-fov__sub{font-size:14px;color:#5a6472;margin:0 0 18px}
.sg-fov__controls{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-end;
  padding:14px 16px;background:#f4f7fb;border:1px solid #dbe5f1;border-radius:6px;margin-bottom:20px}
.sg-fov__lbl{display:block;font-size:11px;font-weight:600;letter-spacing:.07em;
  text-transform:uppercase;color:#5a6472;margin-bottom:6px}
.sg-fov__seg{display:inline-flex;border:1px solid #2558AB;border-radius:5px;overflow:hidden}
.sg-fov__seg button{appearance:none;border:0;background:#fff;color:#2558AB;font-family:inherit;
  font-size:14px;font-weight:600;padding:7px 15px;cursor:pointer;line-height:1.2}
.sg-fov__seg button+button{border-left:1px solid #2558AB}
.sg-fov__seg button[aria-pressed="true"]{background:#2558AB;color:#fff}
.sg-fov__slide{display:flex;align-items:center;gap:10px}
.sg-fov__slide input{width:150px;max-width:42vw;accent-color:#2558AB}
.sg-fov__slide output{font-size:14px;font-weight:600;color:#2558AB;min-width:46px}
.sg-fov__vt{font-size:13px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:#2558AB;margin:26px 0 2px}
.sg-fov__vn{font-size:13px;color:#5a6472;margin:0 0 8px}
.sg-fov__read{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.sg-fov__read>div{flex:1 1 160px;background:#f4f7fb;border-left:3px solid #2558AB;padding:9px 12px}
.sg-fov__read dt{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  color:#5a6472;margin:0 0 3px}
.sg-fov__read dd{margin:0;font-size:17px;font-weight:700;color:#000;line-height:1.3}
.sg-fov__read dd span{font-size:12px;font-weight:500;color:#5a6472}
.sg-fov__leg{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:16px}
.sg-fov__leg>div{display:flex;align-items:center;gap:8px;font-size:13px;color:#333}
.sg-fov__leg i{width:14px;height:14px;border-radius:3px;flex:0 0 auto}
.sg-fov__foot{margin-top:20px;font-size:12px;line-height:1.6;color:#6b7480;
  border-top:1px solid #e3e9f0;padding-top:12px}
.sg-fov__warn{color:#a8480f}
@media(max-width:640px){.sg-fov__controls{gap:14px}.sg-fov__model{font-size:17px}}
