/* ===================================================================
   overrides.css — GenAI Trader (Dark) — CLEANED
   =================================================================== */

/* --- Theme vars & base colors ------------------------------------- */
.genai-dark{
  --panel-bg:#0f1115; --panel-2:#141821; --text:#e6e6e6; --muted:#9aa4b2; --accent:#f5c242;
  background:#0a0c10; color:var(--text);
}

/* --- Grid wrapper (wide trading-screen) ---------------------------- */
.genai-dark .shell{
  display:grid;
  grid-template-columns: 340px minmax(1100px,1fr) 420px; /* L / CENTER / R */
  gap:14px; padding:12px; width:100%;
  max-width:1920px; margin:12px auto; align-items:start;
}

/* --- Panels & type ------------------------------------------------- */
.genai-dark .panel{
  background:var(--panel-bg); border:1px solid #1c2130; border-radius:10px;
  overflow:hidden; box-shadow:0 6px 20px rgba(0,0,0,.35);
}
.genai-dark .panel h4{
  margin:0; padding:12px; border-bottom:1px solid #1c2130;
  color:#cbd5e1; font-weight:600; font-size:14px; letter-spacing:.3px;
}
.genai-dark .panel-body{ padding:12px; }
.genai-dark .stack{ display:flex; flex-direction:column; gap:12px; min-height:0; }
.genai-dark .row{ display:flex; gap:12px; }
.genai-dark .grow{ flex:1 1 0; min-width:0; }
.genai-dark .muted{ color:var(--muted); }

/* --- Chart areas --------------------------------------------------- */
.genai-dark .tv-wrap{ height:560px; background:var(--panel-2); border-radius:10px; overflow:hidden; }
.genai-dark .chart { height:360px; background:var(--panel-2); border-radius:10px; position:relative; }

/* Right column: Economic calendar panel ----------------------------- */
.genai-dark .econ-block .panel-body{ padding:0; }
.genai-dark #financialjuice-eco-widget-container{
  width:340px; min-height:600px; display:block;
}

/* Right column scroll height sized to the main charts */
.genai-dark .scanner-block{ max-height:calc(560px + 360px + 24px); overflow:auto; }

/* Toolbar & buttons ------------------------------------------------- */
.genai-dark .toolbar{ display:flex; gap:8px; align-items:center; padding:8px 0 0; }
.genai-dark .toolbar input,
.genai-dark .toolbar select{ background:#0c0f14; color:#e6e6e6; border:1px solid #1c2130; border-radius:8px; padding:6px 8px; }
.genai-dark .toolbar button{ background:var(--accent); color:#111; border:none; padding:6px 10px; border-radius:8px; cursor:pointer; font-weight:600; }
.genai-dark .toolbar button:hover{ filter:brightness(1.05); }

/* Tabs for bottom workspace (Scanner / Portfolio) ------------------- */
.genai-dark .genai-tabbar{ display:flex; gap:8px; align-items:center; }
.genai-dark .genai-tabbar .tab{
  background:#0c0f14; color:#cbd5e1; border:1px solid #1c2130; border-radius:8px; padding:6px 10px; cursor:pointer;
}
.genai-dark .genai-tabbar .tab.active{ background:var(--accent); color:#111; border-color:transparent; }
.genai-dark .genai-tabpane{ display:none; }
.genai-dark .genai-tabpane.active{ display:block; }

/* Tables ------------------------------------------------------------ */
.genai-dark table#scannerTable,
.genai-dark table#portfolioTable{ width:100%; border-collapse:collapse; }
.genai-dark table#scannerTable th,
.genai-dark table#scannerTable td,
.genai-dark table#portfolioTable th,
.genai-dark table#portfolioTable td{ border-bottom:1px solid #1c2130; padding:6px 8px; font-size:12px; }
.genai-dark table tr:hover td{ background:#0c1016; }

/* AI summary / live trades ----------------------------------------- */
.genai-dark #aiSummary{ white-space:pre-wrap; min-height:260px; font-size:13px; background:#0c0f14; border:1px solid #1c2130; border-radius:8px; padding:10px; }
/* Tighten spacing inside AI Summary (bullets version) */
.genai-dark #aiSummary ul{ margin:0; padding-left:16px; list-style:disc; }
.genai-dark #aiSummary li{ margin-bottom:4px; line-height:1.35; }
.genai-dark #aiSummary details.ai-full{ margin-top:8px; }

.genai-dark #liveTrades{ background:#0c0f14; border:1px solid #1c2130; border-radius:8px; padding:10px; font-size:12px; color:#9dd59d; }

/* Safety ------------------------------------------------------------ */
.genai-dark, .genai-dark *{ box-sizing:border-box; }
.genai-dark{ overflow-x:hidden; }
.genai-dark iframe,
.genai-dark canvas,
.genai-dark .tv-widget,
.genai-dark .tradingview-widget-container{ width:100%; max-width:100%; }
body .genai-dark, body .genai-dark .shell{ transform:none !important; zoom:1 !important; }

/* Responsive -------------------------------------------------------- */
@media (max-width:1200px){
  .genai-dark .shell{ grid-template-columns:1fr; gap:12px; }
  .genai-dark .scanner-block{ max-height:none; }
  .genai-dark #financialjuice-eco-widget-container{ width:100%; min-height:420px; }
}

/* WebKit scrollbars for scanner ------------------------------------ */
.genai-dark .scanner-block::-webkit-scrollbar{ height:8px; width:8px; }
.genai-dark .scanner-block::-webkit-scrollbar-thumb{ background:#2a3243; border-radius:8px; }
.genai-dark .scanner-block::-webkit-scrollbar-track{ background:#0c0f14; }

/* ===================================================================
   PAGE-SCOPED RULES — ONLY for /trading-dashboard-dark/ (ID 889)
   =================================================================== */
body:is(.page-id-889, .postid-889, .elementor-page-889) .site,
body:is(.page-id-889, .postid-889, .elementor-page-889) .site-content,
body:is(.page-id-889, .postid-889, .elementor-page-889) .content-area,
body:is(.page-id-889, .postid-889, .elementor-page-889) .entry-content,
body:is(.page-id-889, .postid-889, .elementor-page-889) .container,
body:is(.page-id-889, .postid-889, .elementor-page-889) .ast-container,
body:is(.page-id-889, .postid-889, .elementor-page-889) .elementor-section-wrap{
  max-width:100% !important; width:100% !important; padding-left:0 !important; padding-right:0 !important; margin:0 !important;
}

body:is(.page-id-889, .postid-889, .elementor-page-889) header.site-header,
body:is(.page-id-889, .postid-889, .elementor-page-889) .ast-breadcrumbs-wrapper,
body:is(.page-id-889, .postid-889, .elementor-page-889) footer.site-footer{
  margin:0 !important; padding:0 !important; background:#0a0c10 !important; box-shadow:none !important; border:0 !important;
}
body:is(.page-id-889, .postid-889, .elementor-page-889) .ast-builder-grid-row-container{ padding:0 !important; }

/* Paint full viewport black */
body:is(.page-id-889, .postid-889, .elementor-page-889) .genai-dark::before{
  content:""; position:fixed; inset:0; background:#0a0c10; z-index:-1;
}

/* Elementor boxed + normal containers: full-width & left aligned */
body:is(.page-id-889, .postid-889, .elementor-page-889)
  .elementor-section.elementor-section-boxed > .elementor-container,
body:is(.page-id-889, .postid-889, .elementor-page-889)
  .elementor-section > .elementor-container{
  max-width:100% !important; width:100% !important; padding:0 !important; justify-content:flex-start !important;
}
body:is(.page-id-889, .postid-889, .elementor-page-889) .elementor-widget-shortcode{
  width:100% !important; margin:0 !important; padding:0 !important; display:flex !important; justify-content:flex-start !important;
}
body:is(.page-id-889, .postid-889, .elementor-page-889) .elementor-column .elementor-widget-wrap{ align-items:stretch !important; }

/* Keep column lock explicit for this page + full-bleed on zoom/ultra-wide */
body:is(.page-id-889, .postid-889, .elementor-page-889) .genai-dark .shell{
  grid-template-columns: 340px minmax(1100px,1fr) 420px;
  max-width:none !important;              /* ⬅ full width at any zoom */
  width:100vw !important;                 /* ⬅ span the viewport */
  margin-left:0 !important;
  margin-right:0 !important;
}

/* === Make bottom Workspace span full width ======================== */
body:is(.page-id-889, .postid-889, .elementor-page-889)
.genai-dark .shell > .panel.bottom{
  grid-column:1 / -1 !important;
  align-self:stretch;
}

/* Fallback if the .bottom class isn't present */
body:is(.page-id-889, .postid-889, .elementor-page-889)
.genai-dark .shell > section.panel:has(#portfolioTable){
  grid-column:1 / -1 !important;
}

/* Ultra-wide tuning (more breathing room + matching heights) */
@media (min-width:1921px){
  body:is(.page-id-889, .postid-889, .elementor-page-889) .genai-dark .shell{
    grid-template-columns: 360px minmax(1200px, 1fr) 440px; /* L / CENTER / R */
  }
  body:is(.page-id-889, .postid-889, .elementor-page-889) .genai-dark .tv-wrap{ height:640px; }
  body:is(.page-id-889, .postid-889, .elementor-page-889) .genai-dark .chart{ height:420px; }
  body:is(.page-id-889, .postid-889, .elementor-page-889) .genai-dark .scanner-block{ max-height:calc(640px + 420px + 24px); }
}

/* === Responsive safety: revert Elementor absolute on small screens === */
@media (max-width:1200px){
  body:is(.page-id-889, .postid-889, .elementor-page-889) .elementor-widget-shortcode{
    position: static !important;
    left:auto !important; right:auto !important; top:auto !important;
    width:100% !important;
  }
}

/* ===================================================================
   NEW — Onboarding Tour + How It Works Modal + Bullet Lists
   =================================================================== */

/* Modal overlay (ensure visible) */
.genai-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.6);
  z-index: 9998;
  display: flex;               /* was none; keeping visible so JS doesn't fight CSS */
  align-items:center;
  justify-content:center;
  padding:16px;
}

/* Modal box */
.genai-modal {
  position: relative;
  background: var(--panel-bg, #fff);
  color: var(--text, #111);
  padding: 20px;
  border-radius: 10px;
  max-width: 720px;
  width: 100%;
  z-index: 9999;
  display: block;              /* was none; ensure visible */
  box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}

/* Modal close button */
.genai-modal .close-btn {
  background: var(--accent, #007bff);
  color: #111;
  border: none;
  padding: 6px 12px;
  border-radius: 6px;
  cursor: pointer;
  font-weight: 600;
  float: right;
}
.genai-modal .close-btn:hover { filter: brightness(1.1); }

/* Onboarding tour tip */
.genai-tour-tip {
  position: absolute;
  background: var(--panel-bg, #fff);
  color: var(--text, #111);
  border: 1px solid #1c2130;
  border-radius: 8px;
  padding: 10px 14px;
  max-width: 280px;
  z-index: 9999;
  font-size: 13px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.25);
}
.genai-tour-tip .tour-btn {
  margin-top: 10px;
  display: inline-block;
  background: var(--accent, #007bff);
  color: #111;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.genai-tour-tip .tour-btn:hover { filter: brightness(1.1); }

/* Bullet list formatting for AI summary */
#aiSummary ul {
  margin: 0;
  padding-left: 16px; /* tighter */
  list-style: disc;
}
#aiSummary li {
  margin-bottom: 4px; /* tighter */
  line-height: 1.35;
}

/* --- TradingView Ticker Widget Override ---------------------------- */
.genai-dark .tradingview-widget-container {
  background: var(--panel-bg) !important; /* Forces the widget to use your panel's dark background */
}