/* reading-ux widget - общие стили. Скоуп rux- чтобы не задеть страницу. */
/* убрать старый плавающий TOC (.side-menu) на how-to - заменяется этим виджетом */
.side-menu{display:none !important;}
#rux-progress{
  position:fixed;top:0;left:0;height:3px;width:100%;
  background:#00a9f0;transform-origin:0 0;transform:scaleX(0);
  z-index:2000;transition:transform .08s linear;pointer-events:none;
}
.rux-list{list-style:none;margin:0;padding:0;}
.rux-item{margin:0;}
.rux-item a{
  display:block;padding:7px 10px;border-radius:6px;
  color:#3a3f47;text-decoration:none;font-size:14px;line-height:1.35;
  border-left:3px solid transparent;transition:background .12s,color .12s,border-color .12s;
}
.rux-item.rux-l3 a{padding-left:24px;font-size:13px;color:#5b6068;}
.rux-item a:hover{background:#f1f7fb;color:#00a9f0;}
.rux-item a.rux-active{color:#00a9f0;border-left-color:#00a9f0;background:#eaf6fe;font-weight:600;}
/* CTA: иконка+имя продукта, краткое описание, кнопка "иконка + Download" */
.rux-cta-wrap{margin-top:14px;padding-top:13px;border-top:1px solid #eef1f5;}
.rux-prod{display:flex;align-items:center;gap:9px;margin-bottom:9px;}
.rux-prod-icon{width:34px;height:34px;border-radius:7px;flex:0 0 auto;object-fit:contain;}
.rux-prod-name{font-size:15px;font-weight:700;color:#1d2330;line-height:1.22;}
.rux-cta-desc{font-size:12.5px;line-height:1.4;color:#5b6068;margin:0 0 10px;}
.rux-cta{
  display:flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 14px;border-radius:8px;
  background:#00a9f0;color:#fff !important;font-size:15px;font-weight:600;
  text-decoration:none;transition:background .12s;
}
.rux-cta svg{width:18px;height:18px;flex:0 0 auto;}
.rux-cta:hover{background:#0090cf;color:#fff;}

/* V1: sticky-сайдбар */
#rux-aside{
  position:fixed;top:96px;right:24px;width:280px;max-height:calc(100vh - 130px);
  overflow:auto;background:#fff;border:1px solid #e6e9ee;border-radius:12px;
  box-shadow:0 6px 24px rgba(20,30,50,.08);padding:16px;z-index:1500;
}
.rux-aside-head{
  display:flex;align-items:center;justify-content:space-between;gap:8px;cursor:pointer;
  font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  color:#8a909a;margin-bottom:10px;user-select:none;
}
.rux-aside-head .rux-chev{font-size:11px;transition:transform .2s;}
#rux-aside.rux-collapsed .rux-aside-head{margin-bottom:0;}
#rux-aside.rux-collapsed .rux-list,
#rux-aside.rux-collapsed .rux-cta-wrap{display:none;}
#rux-aside.rux-collapsed .rux-chev{transform:rotate(-90deg);}
#rux-fab{display:none;}
#rux-scrim{display:none;}
@media (max-width:1199px){
  /* на узких экранах сайдбар прячется, превращается в плавающую кнопку + оверлей */
  #rux-aside{
    right:0;top:0;width:86%;max-width:340px;height:100vh;max-height:100vh;border-radius:0;
    transform:translateX(105%);transition:transform .22s ease;box-shadow:-8px 0 30px rgba(20,30,50,.18);
  }
  #rux-aside.rux-open{transform:translateX(0);}
  #rux-fab{
    display:flex;align-items:center;justify-content:center;
    position:fixed;bottom:84px;right:20px;width:52px;height:52px;border:0;border-radius:50%;
    background:#00a9f0;color:#fff;font-size:22px;cursor:pointer;z-index:1499;
    box-shadow:0 6px 18px rgba(0,169,240,.45);
  }
  #rux-scrim{
    position:fixed;inset:0;background:rgba(15,20,30,.45);opacity:0;visibility:hidden;
    transition:opacity .2s;z-index:1498;
  }
  #rux-scrim.rux-show{display:block;opacity:1;visibility:visible;}
}
