/* VSA Pro - công cụ vẽ kiểu TradingView, nút về nến mới nhất */
.drawbar { overflow-y: auto; scrollbar-width: none; gap: 2px; }
.drawbar::-webkit-scrollbar { display: none; }
.drawbar .icon-btn { width: 34px; height: 32px; }
.dt-grp { position: relative; display: flex; align-items: center; }
.dt-more { position: absolute; right: -3px; bottom: 1px; border: 0; background: transparent; color: var(--faint); font-size: 11px; line-height: 1; padding: 2px; cursor: pointer; transform: rotate(45deg); }
.dt-more:hover { color: var(--accent); }
.dt-sep { width: 22px; height: 1px; background: var(--line); margin: 4px 0; flex: none; }
.dt-fly { position: fixed; z-index: 80; background: var(--tip-bg); border: 1px solid var(--line); border-radius: 8px; box-shadow: var(--shadow); padding: 4px; min-width: 250px; max-height: 80vh; overflow: auto; }
.dt-fly-h { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; padding: 6px 10px 4px; }
.dt-fly button { display: flex; align-items: center; gap: 10px; width: 100%; border: 0; background: transparent; color: var(--text); padding: 7px 10px; border-radius: 6px; cursor: pointer; text-align: left; font: inherit; }
.dt-fly button:hover { background: var(--hover); }
.dt-fly button.on { color: var(--accent); background: var(--active); }
.draw-cv { position: absolute; inset: 0; z-index: 4; pointer-events: none; }
.pane.main.drawing, .pane.main.drawing canvas { cursor: crosshair !important; }
.pane.main.draw-hover canvas { cursor: move !important; }
.pane.main.draw-handle canvas { cursor: pointer !important; }
.draw-props { position: absolute; top: 46px; left: 50%; transform: translateX(-50%); z-index: 9; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; justify-content: center;
  background: var(--tip-bg); border: 1px solid var(--line); border-radius: 8px; box-shadow: var(--shadow); padding: 4px 6px; max-width: calc(100% - 100px); font-size: 12px; }
.draw-props .dp-name { font-weight: 600; padding: 0 6px; white-space: nowrap; }
.draw-props .dp-colors { display: flex; gap: 3px; padding: 0 4px; }
.draw-props .dp-c { width: 16px; height: 16px; border-radius: 4px; border: 1px solid var(--line); cursor: pointer; padding: 0; }
.draw-props .dp-c.on { outline: 2px solid var(--accent); outline-offset: 1px; }
.draw-props select { height: 26px; background: var(--panel-2); color: var(--text); border: 1px solid var(--line); border-radius: 6px; font-size: 12px; }
.draw-props .dp-b, .draw-props .dp-i { height: 26px; min-width: 26px; padding: 0 7px; border: 1px solid var(--line); background: var(--panel-2); color: var(--text); border-radius: 6px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.draw-props .dp-b.on, .draw-props .dp-i.on { color: var(--accent); border-color: var(--accent); background: var(--active); }
.draw-props .dp-i:hover, .draw-props .dp-b:hover { border-color: var(--accent); }
/* nút mũi tên mờ về nến mới nhất (kiểu TradingView) */
.scroll-rt { position: absolute; right: 86px; bottom: 34px; z-index: 7; width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--line);
  background: color-mix(in srgb, var(--panel-2) 80%, transparent); color: var(--muted); display: flex; align-items: center; justify-content: center; cursor: pointer; opacity: .55; transition: opacity .15s; }
.scroll-rt:hover { opacity: 1; color: var(--accent); border-color: var(--accent); }
.scroll-rt svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.scroll-rt[hidden] { display: none; }
@media (max-width: 768px) {
  .cbody.show-draw .drawbar { display: flex; position: absolute; left: 0; top: 0; bottom: 0; z-index: 25; background: var(--panel); width: 44px; box-shadow: var(--shadow); }
  .cbody { position: relative; }
  .scroll-rt { right: 70px; bottom: 30px; }
  .draw-props { top: 40px; max-width: calc(100% - 16px); }
}
.pane.main.drawing .dash { pointer-events: none; opacity: .45; }
@media (max-width: 768px) { .ctool .btn.mobile-draw { display: inline-flex !important; } }