/* ============================================================
   MASTER VORTEX — Dark Pool view (companion to darkpool.js).
   Tiles / tables / bars reuse options.css classes; only the
   view-specific pieces live here. Mirrors options.css tokens.
   ============================================================ */

.mv-dp-head{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  padding:12px 12px 0;
}
.mv-dp-title{font-size:11.5px; font-weight:400; letter-spacing:1.4px; color:var(--green);}
.mv-dp-asof{font-size:11.5px; font-weight:400; color:var(--dim); font-variant-numeric:tabular-nums;}

.mv-dp-buckets{display:flex; gap:8px; padding:8px 12px 2px; align-items:stretch;}
.mv-dp-bucket{flex:1 1 0; text-align:center; min-width:0;}
.mv-dp-bucket-bar-wrap{height:54px; display:flex; align-items:flex-end; justify-content:center;}
.mv-dp-bucket-bar{
  width:62%; background:rgba(30,227,8,.45); border:1px solid rgba(30,227,8,.35);
  border-bottom:none; border-radius:3px 3px 0 0; min-height:2px;
}
.mv-dp-bucket-v{font-size:11.5px; font-weight:400; color:#fff; margin-top:5px; font-variant-numeric:tabular-nums;}
.mv-dp-bucket-l{font-size:10px; font-weight:400; color:var(--dim); letter-spacing:.6px; margin-top:1px;}

.mv-dp-table th:first-child, .mv-dp-table td:first-child{text-align:left;}
.mv-dp-table tbody tr{cursor:default;}

.mv-dp-note{
  padding:12px; font-size:11px; font-weight:400; line-height:1.55; color:var(--dim);
}

/* ---- Phase 2: window selector + stock-flow label ---- */
.mv-dp-tf-label{font-size:10px; font-weight:400; letter-spacing:1.1px; color:var(--dim);}
.mv-dp-tf{
  background:#0a1524; color:#e8f2ff; border:1.5px solid #1c3350; border-radius:8px;
  font-size:12.5px; font-weight:400; font-family:inherit; padding:6px 8px; cursor:pointer;
  margin-left:4px;
}
.mv-dp-tf:focus{outline:none; border-color:rgba(30,227,8,.65);}
.mv-dp-chip-finra{color:#7cc7ff; border-color:rgba(124,199,255,.55);}
.mv-dp-kind{
  margin:10px 12px 0; padding:8px 10px; font-size:11.5px; font-weight:400; line-height:1.5;
  color:var(--dim); border:1px solid #1c3350; border-radius:8px; background:rgba(124,199,255,.05);
}
.mv-dp-kind b{color:#e8f2ff; font-weight:600;}

/* ---- Phase 2: FINRA weekly bars (dense = 2Y, labels off) ---- */
.mv-dp-weekbars .mv-dp-bucket{min-width:0;}

/* ---- Phase 2: calls vs puts panel (options chain volume) ---- */
.mv-dp-pc{
  margin:14px 12px 12px; padding:12px; border:1.5px solid rgba(124,199,255,.35);
  border-radius:10px; background:rgba(124,199,255,.04);
}
.mv-dp-pc-head{font-size:11.5px; font-weight:400; letter-spacing:1.4px; color:#7cc7ff;}
.mv-dp-pc-tag{
  font-size:9.5px; letter-spacing:1px; color:var(--d-yellow);
  border:1px solid rgba(255,216,77,.55); border-radius:20px; padding:3px 8px;
  margin-left:8px; white-space:nowrap; vertical-align:1px;
}
.mv-dp-pc-exp{font-size:12.5px; font-weight:400; color:var(--dim); margin-top:8px;}
.mv-dp-pc-exp b{color:#fff; font-size:14px;}
.mv-dp-pc-hint{font-size:11px;}
.mv-dp-pc .mv-opt-tiles{padding:10px 0 0;}
#mvPcTiles .mv-opt-tile:nth-child(1) .mv-opt-tile-v{color:var(--green);}
#mvPcTiles .mv-opt-tile:nth-child(2) .mv-opt-tile-v{color:#ff5f56;}
.mv-dp-pc-bar{
  display:flex; height:10px; border-radius:5px; overflow:hidden; margin-top:12px;
  background:rgba(255,255,255,.06);
}
.mv-dp-pc-calls{background:var(--green); transition:width .3s ease;}
.mv-dp-pc-puts{background:#ff5f56; transition:width .3s ease;}
.mv-dp-pc-all{font-size:11.5px; font-weight:400; color:var(--dim); margin-top:10px; font-variant-numeric:tabular-nums;}
.mv-dp-pc-note{font-size:11px; font-weight:400; line-height:1.55; color:var(--dim); margin-top:6px;}

/* ---- Workstream 2: calls-vs-puts timeframe mode + shared
   options-volume section (optvisual.js) ---- */
.mv-dp-pc-ctl{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:10px;}
.mv-dp-toggle{display:inline-flex; border:1.5px solid #1c3350; border-radius:8px; overflow:hidden;}
.mv-dp-toggle button{
  background:#0a1524; color:var(--dim); border:none; font:inherit;
  font-size:11px; letter-spacing:1px; padding:6px 10px; cursor:pointer;
}
.mv-dp-toggle button.active{background:rgba(30,227,8,.16); color:#fff;}
.mv-dp-sec2{font-size:10.5px; letter-spacing:1.2px; color:var(--dim); margin-top:12px;}
/* WS3 (2026-11-02): dark volume heat map by price level + dark volume flow */
.mv-dp-sub{color:var(--dim); font-size:10px; letter-spacing:.6px;}
.mv-dp-heat{display:flex; flex-direction:column; gap:3px; margin:4px 0 6px;}
.mv-dp-heatrow{display:flex; align-items:center; gap:8px; font-size:11px;}
.mv-dp-heatrow .p{flex:0 0 64px; color:var(--ink); font-variant-numeric:tabular-nums;}
.mv-dp-heatrow .bar{flex:1; height:12px; background:rgba(120,144,180,.12); border-radius:2px; overflow:hidden;}
.mv-dp-heatrow .bar i{display:block; height:100%; border-radius:2px;}
.mv-dp-heatrow .v{flex:0 0 52px; text-align:right; color:#cfe3ff; font-variant-numeric:tabular-nums;}
.mv-dp-heatrow .s{flex:0 0 44px; text-align:right; color:#ffb37a; font-variant-numeric:tabular-nums;}
.mv-dp-heatrow .t{flex:0 0 76px; text-align:right; color:var(--dim);}
.mv-dp-flow{display:flex; align-items:flex-end; gap:4px; min-height:88px; margin:4px 0; overflow-x:auto; padding-bottom:2px;}
.mv-dp-fcol{flex:1 0 36px; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:2px;}
.mv-dp-fcol i{display:block; width:70%; background:#ff7a18; border-radius:2px 2px 0 0;}
.mv-dp-fcol .fv{font-size:9.5px; color:#ffb37a; font-variant-numeric:tabular-nums; white-space:nowrap;}
.mv-dp-fcol .fl{font-size:9.5px; color:var(--dim); font-variant-numeric:tabular-nums; white-space:nowrap;}
#mvPcTf .mv-dp-buckets{padding-left:0; padding-right:0;}
.mv-dp-sec{
  font-size:11.5px; font-weight:400; letter-spacing:1.4px; color:var(--green);
  padding:16px 12px 0;
}
#mvDpOvMount .mv-opt-vctl{padding:0 12px;}
#mvDpOvMount .mv-opt-chartwrap{margin:0 12px;}
#mvDpOvMount .mv-opt-note{padding-left:12px; padding-right:12px;}
#mvDpOvMount .mv-opt-heatscroll{margin:0 12px;}
#mvDpOvMount .mv-opt-table{width:calc(100% - 24px); margin:0 12px;}