/* ===== Back To Top + Scroll Progress (AEC) ===== */
#backToTop{
  position: fixed;
  right: 24px;
  bottom: 34px;
  width: 52px;
  height: 52px;
  border-radius: 999px;
  border: none;

  background: rgba(210, 218, 225, 0.50);
  backdrop-filter: blur(12px) saturate(140%);
  -webkit-backdrop-filter: blur(12px) saturate(140%);

  outline: 1px solid rgba(0,0,0,0.08);
  box-shadow: none !important;
  cursor: pointer;
  display: none;               /* JS sẽ bật */
  align-items: center;
  justify-content: center;
  z-index: 99999;

  color: rgba(0,0,0,0.78);
  padding: 0;
}

/* icon nằm trên */
#backToTop .arrow-icon{
  position: relative;
  z-index: 5;
}

/* vòng progress */
#backToTop .scroll-ring{
  position: absolute;
  inset: -2px;
  width: 56px;
  height: 56px;
  transform: rotate(-90deg);
  z-index: 2;
}

#backToTop .ring-bg{
  fill: none;
  stroke: rgba(0,0,0,0.08);
  stroke-width: 1;
}

#backToTop .ring-progress{
  fill: none;
  stroke: rgba(28,117,189,0.95);
  stroke-width: 1;
  stroke-linecap: round;

  stroke-dasharray: 151;
  stroke-dashoffset: 151;

  transition: stroke-dashoffset 0.12s linear;
}

/* hover */
#backToTop:hover{
  background: rgba(210, 218, 225, 0.62);
  box-shadow: none !important;
}

/* hover vòng */
#backToTop:hover .ring-progress{
  stroke: rgba(28,117,189,1);
}