/* Nút Lên đầu trang. Biến --bsk-len-dau-* do PHP in vào style của nút (BSK_LenDau_Nut::style).
   z-index 9989: dưới nút Nghe bài viết (9990) — hai nút cùng góc thì nút nghe được ưu tiên. */
/* Lá chắn chống theme/kit Elementor: họ đặt padding/font/bo góc/nền cho mọi <button>
   với độ ưu tiên (0,1,1), cao hơn một class — trên site thật nút phình thành viên
   dài, mất icon. Thuộc tính hình hài đặt !important và đọc từ biến; kiểu/cỡ chỉ đổi biến. */
.bsk-len-dau { --bsk-len-dau-w: var(--bsk-len-dau-co, 48px); --bsk-len-dau-pad: 0; --bsk-len-dau-bo: 50%;
  position: fixed; z-index: 9989; box-sizing: border-box !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important;
  width: var(--bsk-len-dau-w) !important; height: var(--bsk-len-dau-co, 48px) !important; min-width: 0 !important; min-height: 0 !important;
  padding: var(--bsk-len-dau-pad) !important; margin: 0 !important; border: 0 !important; border-radius: var(--bsk-len-dau-bo) !important;
  background: var(--bsk-len-dau-mau, #0f766e) !important; background-image: none !important; color: var(--bsk-len-dau-mau-chu, #fff) !important;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif !important; font-size: 14px !important; font-weight: 600 !important; line-height: 1 !important;
  letter-spacing: normal !important; text-transform: none !important; text-decoration: none !important; text-shadow: none !important; cursor: pointer;
  box-shadow: 0 4px 14px rgba(0,0,0,.2); opacity: 0; transition: opacity .25s ease, transform .25s ease, filter .15s ease; }
.bsk-len-dau[hidden] { display: none !important; }
.bsk-len-dau--duoi-phai { bottom: var(--bsk-len-dau-doc, 24px); right: var(--bsk-len-dau-ngang, 20px); }
.bsk-len-dau--duoi-trai { bottom: var(--bsk-len-dau-doc, 24px); left: var(--bsk-len-dau-ngang, 20px); }
.bsk-len-dau--tren-phai { top: var(--bsk-len-dau-doc, 24px); right: var(--bsk-len-dau-ngang, 20px); }
.bsk-len-dau--tren-trai { top: var(--bsk-len-dau-doc, 24px); left: var(--bsk-len-dau-ngang, 20px); }

.bsk-len-dau:hover { filter: brightness(1.1); }
/* Viền vàng tương phản với mọi màu nền người dùng chọn — outline ăn theo màu nút thì mất hút trên nền cùng tông. */
.bsk-len-dau:focus-visible { outline: 3px solid #ffbf47; outline-offset: 2px; }

.bsk-len-dau__svg { display: block !important; width: 50%; height: 50%; flex: none; fill: currentColor !important; }
.bsk-len-dau__emoji { font-size: calc(var(--bsk-len-dau-co, 48px) * .45); line-height: 1; }
.bsk-len-dau__anh { width: 55%; height: 55%; object-fit: contain; display: block; }
/* Nhãn nằm trong aria-label rồi; chữ nhìn thấy chỉ ở kiểu viên. */
.bsk-len-dau__nhan { display: none; white-space: nowrap; }

/* Kiểu: tron = mặc định ở trên; vuong = bo góc nhẹ; vien = viên thuốc có chữ. */
.bsk-len-dau--kieu-vuong { --bsk-len-dau-bo: 10px; }
.bsk-len-dau--kieu-vien { --bsk-len-dau-w: auto; --bsk-len-dau-bo: 999px; --bsk-len-dau-pad: 0 18px 0 14px; }
.bsk-len-dau--kieu-vien .bsk-len-dau__nhan { display: inline; }
.bsk-len-dau--kieu-vien .bsk-len-dau__svg { width: 1.3em; height: 1.3em; }
.bsk-len-dau--kieu-vien .bsk-len-dau__anh { width: 1.4em; height: 1.4em; }
.bsk-len-dau--kieu-vien .bsk-len-dau__emoji { font-size: 1.2em; }
.bsk-len-dau--co-nho { font-size: 13px !important; }
.bsk-len-dau--co-lon { font-size: 16px !important; }

/* Hiệu ứng xuất hiện: JS bỏ hidden rồi thêm --hien ở khung sau để transition chạy. */
.bsk-len-dau--hien { opacity: 1; }
.bsk-len-dau--hieu-ung-truot { transform: translateY(16px); }
.bsk-len-dau--hieu-ung-truot.bsk-len-dau--hien { transform: none; }
.bsk-len-dau--hieu-ung-khong { transition: none; }
@media (prefers-reduced-motion: reduce) { .bsk-len-dau { transition: none; transform: none; } }

/* Vòng tiến độ: SVG phủ kín nút, vẽ nét viền theo % cuộn (JS ghi stroke-dasharray). */
.bsk-len-dau__vong { position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; }
.bsk-len-dau__vong-nen { stroke: var(--bsk-len-dau-mau-chu, #fff); opacity: .25; }
.bsk-len-dau__vong-tien { stroke: var(--bsk-len-dau-mau-chu, #fff); }
/* Vòng bám theo hình tròn — kiểu vuông/viên thì vòng lệch hình, nên chỉ vẽ ở kiểu tròn. */
.bsk-len-dau--kieu-vuong .bsk-len-dau__vong, .bsk-len-dau--kieu-vien .bsk-len-dau__vong { display: none; }

@media (max-width: 600px) {
  .bsk-len-dau--an-mobile { display: none !important; }
}
