/* Markowitz node model view (components/libraries/complex_nodes/markowitz.py, model_interface) - mkv-.
   Same tokens as pages_style.css: panels rgba(0,0,0,0.6), chips rgba(255,255,255,0.06), radius 10px,
   text #e8e8e8, muted #9fb3c8, headings #cfefff, accent #f0a030. */

.mkv { padding: 2px 4px 4px; }

/* date bar: step buttons + "Rebalancing i of n" + date + what is selected */
.mkv-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 2px 0; }
.mkv .mkv-step { padding: 2px 10px; font-size: .8rem; line-height: 1.4; }
.mkv-when { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-left: 4px; }
.mkv-when-n { color: #9fb3c8; font-size: .7rem; text-transform: uppercase; letter-spacing: .6px; }
.mkv-when-d { color: #cfefff; font-weight: 600; font-size: 1rem; }

/* rebalancing slider */
.mkv-slider { padding: 8px 8px 20px; }
.mkv-slider .rc-slider-rail { background: rgba(255,255,255,0.10); height: 4px; }
.mkv-slider .rc-slider-track { background: #f0a030; height: 4px; }
.mkv-slider .rc-slider-dot { background: #141a21; border-color: rgba(255,255,255,0.22); width: 7px; height: 7px; bottom: -2px; }
.mkv-slider .rc-slider-handle { border: 2px solid #f0a030; background: #141a21; width: 16px; height: 16px; margin-top: -6px;
  box-shadow: 0 0 8px rgba(240,160,48,0.45); opacity: 1; }
.mkv-slider .rc-slider-handle:hover, .mkv-slider .rc-slider-handle:active, .mkv-slider .rc-slider-handle-dragging {
  border-color: #f5c06a !important; box-shadow: 0 0 10px rgba(240,160,48,0.7) !important; }
.mkv-slider .rc-slider-mark-text { color: #6f8295; font-size: .68rem; }
.mkv-slider .rc-slider-mark-text-active { color: #9fb3c8; }

.mkv .pk-kpis { margin-top: 2px; }

/* frontier | allocation */
.mkv-top { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: start; margin-top: 2px; }
@media (max-width: 1150px) { .mkv-top { grid-template-columns: 1fr; } }
.mkv-top > .rp-cell, .mkv-sec { background: rgba(255,255,255,0.025); border: 1px solid rgba(255,255,255,0.05);
  border-radius: 10px; padding: 8px 10px; }
.mkv-sec { margin-top: 10px; }
.mkv-alloc .dp-sec-t { margin-top: 4px; }

/* trades (folded) */
.mkv-trades { margin-top: 10px; border: 1px solid rgba(255,255,255,0.07); border-radius: 10px; background: rgba(0,0,0,0.25); }
.mkv-trades > summary { cursor: pointer; list-style: none; padding: 9px 12px; display: flex; align-items: baseline; gap: 10px; }
.mkv-trades > summary::-webkit-details-marker { display: none; }
.mkv-trades > summary::before { content: '\25B8'; color: #f0a030; display: inline-block; transition: transform .15s; }
.mkv-trades[open] > summary::before { transform: rotate(90deg); }
.mkv-trades > summary:hover .mkv-sum-t { color: #f5d6a3; }
.mkv-sum-t { color: #cfefff; font-weight: 600; font-size: .88rem; }
.mkv-sum-s { color: #9fb3c8; font-size: .72rem; }
.mkv-trades > :not(summary) { margin-left: 12px; margin-right: 12px; }
.mkv-trades > :last-child { margin-bottom: 12px; }
.mkv-dl { display: flex; justify-content: flex-end; }
.mkv-dl .fa { color: #f0a030; }
.mkv-legend { margin: 0 0 6px; }