/*!
 * moll-retest chart styles
 */

:root{
  --background-color:ghostwhite;
  --text-color:#15212d;
  --hover-color:#eeeffa;
  --brand-icon-color:#ff444f;

  /* tradingview-like palette (light) */
  --tv-bg:ghostwhite;
  --tv-pane:ghostwhite;
  --tv-text:#131722;
  --tv-icon:#131722;
  --tv-icon-active:#2962ff;
  --tv-border:#e0e3eb;
  --tv-sep:#e0e3eb;
  --tv-hover:#ecedf7;
  --tv-menu:ghostwhite;
  --tv-menu-hover:#ecedf7;
  --tv-accent:#2962ff;
  --tv-input:#ecedf7;
  --tv-muted:#787b86;
}

body.dark-theme{
  --background-color:#131722;
  --text-color:#fff;
  --hover-color:#282c38;
  --brand-icon-color:#fff;

  /* tradingview-like palette (dark) */
  --tv-bg:#131722;
  --tv-pane:#131722;
  --tv-text:#d1d4dc;
  --tv-icon:#b2b5be;
  --tv-icon-active:#2962ff;
  --tv-border:#2a2e39;
  --tv-sep:#2a2e39;
  --tv-hover:#2a2e39;
  --tv-menu:#1e222d;
  --tv-menu-hover:#2a2e39;
  --tv-accent:#2962ff;
  --tv-input:#2a2e39;
  --tv-muted:#787b86;
}

html{font-size:10px}

body{
  margin:0;
  font-family:"IBM Plex Sans",Arial,sans-serif;
  background:var(--background-color);
  overflow:hidden;
}

a{cursor:pointer!important;text-decoration:none}

/* ============ header ============ */
.header{background-color:var(--background-color)}
.header *{box-sizing:border-box;margin:0;padding:0}
.header-brand-container{
  align-items:center;
  display:flex;
  justify-content:space-between;
  padding:1.6rem .8rem 1.6rem 1.6rem;
}
.brand-logo{display:flex;place-items:center}
.brand-logo input[type=checkbox]{display:none}
.header-nav{align-items:center;display:flex;gap:.8rem}
.nav-button{
  background-color:#ff444f;
  border:0;
  border-radius:1.6rem;
  font-weight:700;
  white-space:nowrap;
}
.button-signup{color:#fff;cursor:pointer;font-size:1.4rem;line-height:2rem}
.button-signup a{display:inline-block;font-family:"IBM Plex Sans";padding:1.2rem 1.6rem;color:#fff}
.button-signup:hover{background-color:#e12e3a}
.button-signup:active{opacity:1}
.theme-toggle{align-items:center;border-radius:.8rem;cursor:pointer;display:flex;height:4.4rem;margin-right:0}
.theme-toggle:hover{background-color:var(--hover-color);border-radius:.8rem}
.theme-toggle-dark-icon,.theme-toggle-light-icon{height:3.2rem}
.theme-toggle-light-icon{display:none}
body.dark-theme .theme-toggle-dark-icon{display:none}
body.dark-theme .theme-toggle-light-icon{display:block}
.theme-toggle-dark-icon{filter:invert(var(--icon-invert,0))}
body.dark-theme img.theme-toggle-light-icon{filter:invert(1) opacity(.75)}
body:not(.dark-theme) img.theme-toggle-dark-icon{opacity:.72}

/* ============ chart container ============ */
.chart-container{
  height:calc(100vh - 7.6rem);
  padding:0!important;
  width:100%;
  background:var(--tv-bg);
  display:flex;
  flex-direction:column;
  user-select:none;
  position:relative;
}
.chart-container:fullscreen{height:100vh}

/* ============ top toolbar ============ */
.tv-topbar{
  height:3.8rem;
  min-height:3.8rem;
  background:var(--tv-bg);
  border-bottom:1px solid var(--tv-border);
  display:flex;
  align-items:center;
  padding:0 .6rem;
  gap:.2rem;
  position:relative;
  z-index:30;
}
.tv-group{display:flex;align-items:center;gap:.2rem}
.tv-sep{width:1px;height:2.2rem;background:var(--tv-sep);margin:0 .5rem}
.tv-topbar-right{margin-left:auto;display:flex;align-items:center;gap:.2rem}

.tv-btn{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  background:transparent;
  border:none;
  border-radius:.4rem;
  color:var(--tv-text);
  font-family:"IBM Plex Sans",Arial,sans-serif;
  font-size:1.3rem;
  font-weight:500;
  padding:.5rem .7rem;
  cursor:pointer;
  height:3.2rem;
  white-space:nowrap;
}
.tv-btn:hover{background:var(--tv-hover)}
.tv-btn:disabled{opacity:.35;cursor:default}
.tv-btn:disabled:hover{background:transparent}
.tv-btn.tv-icon{padding:.5rem;width:3.2rem;justify-content:center}
.tv-btn.active{background:var(--tv-hover);color:var(--tv-icon-active)}
.tv-btn.active .tv-ic{color:var(--tv-icon-active)}
.tv-ic{width:2rem;height:2rem;color:var(--tv-icon);flex:none}
.tv-btn:hover .tv-ic{color:var(--tv-text)}
.tv-btn.active .tv-ic,.tv-btn.active{color:var(--tv-icon-active)}
.tv-caret{width:1.2rem;height:1.2rem}
.tv-symbol-btn{font-weight:700;font-size:1.4rem}
.tv-fav{min-width:3rem;justify-content:center}
.tv-fav.on{color:var(--tv-icon-active);font-weight:700}
.tv-tz{font-size:1.2rem}

/* ============ body layout ============ */
.tv-body{flex:1;display:flex;min-height:0}

/* left toolbar */
.tv-leftbar{
  width:4.9rem;
  min-width:4.9rem;
  background:var(--tv-bg);
  border-right:1px solid var(--tv-border);
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:.4rem 0;
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-width:none;
}
.tv-leftbar::-webkit-scrollbar{display:none}
.tv-lb-group{display:flex;flex-direction:column;gap:.2rem}
.tv-lb-sep{width:2.4rem;height:1px;background:var(--tv-sep);margin:.6rem 0}
.tv-leftbar .tv-btn{width:3.8rem;height:3.8rem;border-radius:.6rem}
.tv-leftbar .tv-btn .tv-ic{width:2.4rem;height:2.4rem}
.tv-leftbar .tv-btn.active{background:var(--tv-hover)}

/* pane */
.tv-panes{flex:1;display:flex;min-width:0;min-height:0}
.tv-panes.col{flex-direction:column}
.tv-panes.col .tv-pane-b{border-left:none;border-top:1px solid var(--tv-border)}
.tv-pane{flex:1;position:relative;min-width:0;background:var(--tv-pane)}
.lwc-chart{position:absolute;inset:0}

/* second timeframe pane */
.tv-pane-b{
  display:none;
  flex:1;min-width:0;
  flex-direction:column;
  border-left:1px solid var(--tv-border);
  background:var(--tv-pane);
}
.tv-pane-b.open{display:flex}
.tv-pane-b-head{
  display:flex;align-items:center;gap:.8rem;
  padding:.4rem .8rem;
  border-bottom:1px solid var(--tv-border);
}
.tv-pane-b-sym{font-size:1.2rem;font-weight:600;color:var(--tv-text)}
.tv-pane-b-tf{
  background:var(--tv-input);
  color:var(--tv-text);
  border:none;border-radius:.4rem;
  font-family:inherit;font-size:1.2rem;
  padding:.3rem .5rem;cursor:pointer;outline:none;
}
.tv-pane-b-head .tv-btn{margin-left:auto;width:2.6rem;height:2.6rem}
.tv-pane-b-body{flex:1;position:relative;min-height:0}
#draw-layer{position:absolute;inset:0;pointer-events:none;z-index:5}
.tv-pane-b-draw{position:absolute;inset:0;pointer-events:none;z-index:5}

/* legend overlay */
.tv-legend{
  position:absolute;
  top:.6rem;
  left:.8rem;
  z-index:6;
  font-size:1.2rem;
  color:var(--tv-text);
  pointer-events:none;
  display:flex;
  flex-direction:column;
  gap:.2rem;
}
.tv-legend-row{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.tv-legend-symbol{font-weight:700;font-size:1.3rem}
.tv-legend-tf{color:var(--tv-muted)}
.tv-legend-ohlc{font-variant-numeric:tabular-nums;color:var(--tv-muted)}
.tv-legend-ohlc b{color:var(--tv-text);font-weight:500}
.tv-legend-ind .tv-ind{
  pointer-events:auto;
  display:inline-flex;align-items:center;gap:.5rem;
  padding:0 .4rem;border-radius:.3rem;
}
.tv-legend-ind .tv-ind:hover{background:var(--tv-hover)}
.tv-legend-ind .tv-ind-name{color:var(--tv-muted)}
.tv-legend-ind .tv-ind-x{cursor:pointer;color:var(--tv-muted);font-weight:700}
.tv-legend-ind .tv-ind-x:hover{color:var(--tv-text)}

/* bottom-right controls */
.tv-bottombar{
  position:absolute;
  right:.4rem;
  bottom:.4rem;
  z-index:6;
  display:flex;
  align-items:center;
  gap:.2rem;
}
.tv-bottombar .tv-btn{height:2.8rem;padding:.3rem .5rem}
.tv-bottombar .tv-btn.tv-icon{width:2.8rem}
.tv-bottombar .tv-ic{width:1.8rem;height:1.8rem}
.tv-bottombar .tv-btn{background:var(--tv-bg);opacity:.85}
.tv-bottombar .tv-btn:hover{opacity:1}

/* ============ dropdowns / popovers ============ */
.tv-pop{
  position:absolute;
  top:4.4rem;
  z-index:100;
  background:var(--tv-menu);
  border:1px solid var(--tv-border);
  border-radius:.6rem;
  box-shadow:0 .4rem 1.6rem rgba(0,0,0,.35);
  min-width:20rem;
  display:none;
  overflow:hidden;
}
.tv-pop.open{display:block}
.tv-pop-head{padding:.8rem;border-bottom:1px solid var(--tv-border)}
.tv-pop-head input{
  width:100%;
  box-sizing:border-box;
  background:var(--tv-input);
  border:none;
  border-radius:.4rem;
  color:var(--tv-text);
  font-family:inherit;
  font-size:1.3rem;
  padding:.8rem 1rem;
  outline:none;
}
.tv-pop-list{max-height:32rem;overflow-y:auto;padding:.4rem 0}
.tv-item{
  display:flex;
  align-items:center;
  gap:.8rem;
  padding:.8rem 1.2rem;
  cursor:pointer;
  font-size:1.3rem;
  color:var(--tv-text);
}
.tv-item:hover{background:var(--tv-menu-hover)}
.tv-item .tv-ic{width:1.8rem;height:1.8rem}
.tv-item.disabled{opacity:.4;cursor:default}
.tv-item.disabled:hover{background:transparent}
.tv-item .tv-item-sub{color:var(--tv-muted);font-size:1.1rem;margin-left:auto}
.tv-item.on{color:var(--tv-icon-active);font-weight:600}
.tv-item-head{padding:.6rem 1.2rem .2rem;font-size:1.1rem;color:var(--tv-muted);text-transform:uppercase;letter-spacing:.05em}

/* ============ modals ============ */
.tv-modal-wrap{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.45);
  z-index:200;
  display:none;
  align-items:flex-start;
  justify-content:center;
}
.tv-modal-wrap.open{display:flex}
.tv-modal{
  margin-top:10vh;
  width:38rem;
  max-height:60vh;
  background:var(--tv-menu);
  border:1px solid var(--tv-border);
  border-radius:.8rem;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
.tv-modal-head{
  display:flex;align-items:center;gap:.6rem;
  padding:1rem;border-bottom:1px solid var(--tv-border);
}
.tv-modal-head input{
  flex:1;background:var(--tv-input);border:none;border-radius:.4rem;
  color:var(--tv-text);font-family:inherit;font-size:1.3rem;
  padding:.8rem 1rem;outline:none;
}
.tv-modal-title{font-size:1.5rem;font-weight:700;color:var(--tv-text);flex:1}
.tv-modal-list{overflow-y:auto;padding:.4rem 0}
.tv-modal-active{display:none;flex-wrap:wrap;align-items:center;gap:.6rem;padding:.8rem 1.2rem;border-bottom:1px solid var(--tv-border)}
.tv-modal-active.open{display:flex}
.tv-modal-active .tv-ind{display:inline-flex;align-items:center;gap:.3rem;background:var(--tv-hover);border-radius:.4rem;padding:.2rem .6rem;font-size:1.1rem}
.tv-modal-active .tv-ind-x{cursor:pointer;color:var(--tv-muted);font-weight:700}
.tv-modal-active .tv-ind-x:hover{color:var(--tv-text)}
.tv-ind-e{cursor:pointer;color:var(--tv-muted);font-weight:700}
.tv-ind-e:hover{color:var(--tv-text)}
.tv-modal-active .tv-ind-clear{margin-left:auto;font-size:1.1rem}
.tv-ind-pane{font-style:normal;color:var(--tv-muted);opacity:.6;margin-left:.2rem}
.tv-modal-body{padding:1.2rem;display:flex;flex-direction:column;gap:1rem}
.tv-modal-params{display:none;flex-direction:column;min-height:0}
.tv-modal-params.open{display:flex}
.tv-modal-params .tv-modal-title{padding:1.2rem 1.2rem 0}
.tv-modal-actions{display:flex;justify-content:flex-end;gap:.8rem;padding:0 1.2rem 1.2rem}
.tv-btn-accent{background:var(--tv-icon-active);color:#fff}
.tv-btn-accent:hover{background:var(--tv-icon-active);filter:brightness(1.1);color:#fff}
.tv-ind-badge{font-weight:700;font-size:1.1rem;margin-left:.4rem}
.tv-field{display:flex;align-items:center;justify-content:space-between;color:var(--tv-text);font-size:1.3rem}
.tv-field input[type=color]{width:4rem;height:2.4rem;border:none;background:none;cursor:pointer;padding:0}
.tv-field input[type=checkbox]{width:1.6rem;height:1.6rem;accent-color:var(--tv-accent)}
.tv-field input[type=number]{width:7rem;background:var(--tv-input);color:var(--tv-text);border:none;border-radius:.4rem;font-family:inherit;font-size:1.3rem;padding:.4rem .6rem;outline:none}
.tv-field select{background:var(--tv-input);color:var(--tv-text);border:none;border-radius:.4rem;font-family:inherit;font-size:1.3rem;padding:.4rem .6rem;outline:none;cursor:pointer;max-width:14rem}
.tv-pane-b-inds{display:flex;align-items:center;gap:.8rem;font-size:1.1rem;overflow:hidden;white-space:nowrap}
.tv-pane-b-inds .tv-ind{display:inline-flex;align-items:center;gap:.3rem;color:var(--tv-muted)}
.tv-pane-b-inds .tv-ind-x{cursor:pointer;opacity:.6}
.tv-pane-b-inds .tv-ind-x:hover{opacity:1;color:var(--tv-text)}

/* replay controls */
.tv-replay{
  position:absolute;
  top:.8rem;
  left:50%;
  transform:translateX(-50%);
  z-index:20;
  display:none;
  align-items:center;
  gap:.2rem;
  background:var(--tv-menu);
  border:1px solid var(--tv-border);
  border-radius:.8rem;
  padding:.3rem .6rem;
  box-shadow:0 .4rem 1.6rem rgba(0,0,0,.25);
}
.tv-replay.open{display:flex}
.tv-replay-tag{
  font-size:1.1rem;
  font-weight:700;
  letter-spacing:.08em;
  color:var(--tv-icon-active);
  padding:0 .6rem;
}
.tv-replay select{
  background:var(--tv-input);
  color:var(--tv-text);
  border:none;
  border-radius:.4rem;
  font-family:inherit;
  font-size:1.2rem;
  padding:.4rem .6rem;
  margin:0 .4rem;
  cursor:pointer;
  outline:none;
}
.tv-hint{
  position:absolute;
  top:.8rem;
  left:50%;
  transform:translateX(-50%);
  z-index:19;
  display:none;
  background:var(--tv-menu);
  border:1px solid var(--tv-border);
  border-radius:.6rem;
  color:var(--tv-text);
  font-size:1.3rem;
  padding:.8rem 1.4rem;
  box-shadow:0 .4rem 1.6rem rgba(0,0,0,.25);
  pointer-events:none;
}
.tv-hint.open{display:block}

/* paper trading panel */
.tv-trade{
  position:absolute;
  top:.8rem;
  right:.8rem;
  z-index:20;
  display:none;
  flex-direction:column;
  gap:.8rem;
  width:24rem;
  background:var(--tv-menu);
  border:1px solid var(--tv-border);
  border-radius:.8rem;
  padding:1rem;
  box-shadow:0 .4rem 1.6rem rgba(0,0,0,.25);
}
.tv-trade.open{display:flex}
.tv-trade-head{display:flex;align-items:center;font-size:1.4rem;font-weight:700;color:var(--tv-text)}
.tv-trade-head .tv-btn{margin-left:auto;width:2.6rem;height:2.6rem}
.tv-trade-btns{display:flex;gap:.8rem}
.tv-trade-btns .tv-btn{flex:1;font-weight:700}
.tv-trade-buy{background:#089981;color:#fff}
.tv-trade-buy:hover{background:#0aa88e}
.tv-trade-sell{background:#f23645;color:#fff}
.tv-trade-sell:hover{background:#ff4d5a}
.tv-trade input.err{outline:1px solid #f23645}
.tv-pos-e,.tv-pend-e{cursor:pointer;color:var(--tv-muted);font-size:1.1rem}
.tv-pos-e:hover,.tv-pend-e:hover{color:var(--tv-text)}
.tv-pos-edit,.tv-pend-edit{
  display:flex;align-items:center;gap:.4rem;padding:.4rem .6rem;border-radius:.4rem;
  border:1px solid var(--tv-accent);font-size:1.2rem;color:var(--tv-muted)}
.tv-pos-edit input,.tv-pend-edit input{
  width:0;flex:1;min-width:0;background:var(--tv-input);color:var(--tv-text);border:none;
  border-radius:.4rem;font-family:inherit;font-size:1.2rem;padding:.3rem .5rem;outline:none}
.tv-pos-edit b,.tv-pend-edit b{font-weight:700}
.tv-edit-ok,.tv-edit-no{cursor:pointer;font-weight:700}
.tv-edit-ok{color:#089981}
.tv-edit-no{color:#f23645}
.tv-trade-pend{display:flex;flex-direction:column;gap:.4rem}
.tv-trade-pend:empty{display:none}
.tv-pend{
  display:flex;align-items:center;gap:.6rem;padding:.4rem .6rem;border-radius:.4rem;
  border:1px dashed var(--tv-border);color:var(--tv-muted);font-size:1.2rem;font-variant-numeric:tabular-nums}
.tv-pend-side{font-weight:700}
.tv-pend-side.long{color:#089981}
.tv-pend-side.short{color:#f23645}
.tv-pend-x{margin-left:auto;cursor:pointer;color:var(--tv-muted);font-weight:700}
.tv-pend-x:hover{color:var(--tv-text)}
.tv-trade-hist{display:flex;flex-direction:column;gap:.3rem;max-height:12rem;overflow-y:auto}
.tv-trade-hist:empty{display:none}
.tv-hist{
  display:flex;gap:.5rem;padding:.3rem .6rem;border-radius:.4rem;background:var(--tv-input);
  color:var(--tv-muted);font-size:1.1rem;font-variant-numeric:tabular-nums}
.tv-hist .tv-pos-side{font-size:1.1rem}
.tv-hist-pnl{margin-left:auto;font-weight:700}
.tv-hist-pnl.up{color:#089981}
.tv-hist-pnl.dn{color:#f23645}
.tv-hist-head{font-size:1.1rem;color:var(--tv-muted);font-weight:700;letter-spacing:.05em;text-transform:uppercase}
.tv-trade-grid{display:flex;gap:.8rem}
.tv-trade-grid .tv-field{flex:1;flex-direction:column;align-items:flex-start;gap:.3rem}
.tv-trade-grid .tv-field input{width:100%}
.tv-pos-sl{color:var(--tv-muted);font-size:1.1rem}
.tv-trade-pos{display:flex;flex-direction:column;gap:.4rem;max-height:20rem;overflow-y:auto}
.tv-trade-pos:empty{display:none}
.tv-pos{
  display:flex;align-items:center;gap:.6rem;font-size:1.2rem;
  background:var(--tv-hover);border-radius:.4rem;padding:.4rem .8rem;color:var(--tv-text);
}
.tv-pos-side{font-weight:700}
.tv-pos-side.long{color:#089981}
.tv-pos-side.short{color:#f23645}
.tv-pos-pnl{margin-left:auto;font-weight:700;font-variant-numeric:tabular-nums}
.tv-pos-pnl.up{color:#089981}
.tv-pos-pnl.dn{color:#f23645}
.tv-pos-x{cursor:pointer;color:var(--tv-muted);font-weight:700}
.tv-pos-x:hover{color:var(--tv-text)}
.tv-trade-acct{
  display:grid;grid-template-columns:1fr 1fr;gap:.2rem .8rem;font-size:1.1rem;
  color:var(--tv-muted);border-top:1px solid var(--tv-border);padding-top:.6rem}
.tv-trade-acct b{color:var(--tv-text);font-weight:600;font-variant-numeric:tabular-nums}
.tv-trade-acct .neg{color:#f23645}
.tv-trade-msg{font-size:1.1rem;color:#f23645;padding-top:.3rem;min-height:0}
.tv-trade-msg:empty{display:none}
.tv-trade-real{font-size:1.1rem;color:var(--tv-muted);padding-top:.3rem}
.tv-trade-real:empty{display:none}
.tv-trade-real b{font-variant-numeric:tabular-nums}
.tv-trade-real b.up{color:#089981}
.tv-trade-real b.dn{color:#f23645}

/* cursor modes */
.tv-pane.cursor-cross #lwc-chart{cursor:crosshair}
.tv-pane.cursor-arrow #lwc-chart{cursor:default}
.tv-pane.cursor-dot #lwc-chart{cursor:none}
.tv-pane.drawing #lwc-chart{cursor:crosshair}
.tv-pane.hover-drawing #lwc-chart{cursor:move}

@media screen and (max-width:600px){
  .brand-logo__line,.brand-logo__trading{display:none}
  .brand-link-desktop{display:none;height:100%}
}