/* ============================================================
SERVER: /home/markpnkr/public_html/assets/css/mv-global.css
VERSION: 3.0
DATE: 2026-03-16
MARKETVISTA AI — GLOBAL UI SYSTEM
============================================================ */


/* =========================================================
MARKETVISTA — COLLAPSIBLE SIDEBAR
========================================================= */

.startbar-nav ul li ul{
max-height:0;
overflow:hidden;
transition:max-height .25s ease;
padding-left:16px;
}

.startbar-nav ul li.mv-open > ul{
max-height:500px;
}

.mv-nav-arrow{
margin-left:auto;
font-size:14px;
opacity:.6;
transition:transform .2s ease;
}

.startbar-nav ul li.mv-open > a .mv-nav-arrow{
transform:rotate(90deg);
}

.mv-nav-parent{
cursor:pointer;
}

.startbar-nav ul li a{
transition:all .18s ease;
}

.startbar-nav ul li a:hover{
background:rgba(99,102,241,0.08);
transform:translateX(3px);
}



/* =========================================================
GLOBAL MARKET TICKER
========================================================= */

.mv-marketbar{
width:100%;
overflow:hidden;
position:relative;
z-index:20;
background:#0b1220;
color:#e5e7eb;
border-bottom:1px solid rgba(255,255,255,.06);
height:38px;
display:flex;
align-items:center;
padding-right:220px;
}

.mv-marketbar-inner{
display:flex;
align-items:center;
white-space:nowrap;
width:max-content;
animation:mvTickerScroll 90s linear infinite;
will-change:transform;
}

.mv-marketbar:hover .mv-marketbar-inner{
animation-play-state:paused;
}

.mv-market-item{
display:inline-flex;
align-items:center;
gap:8px;
padding:0 22px;
border-right:1px solid rgba(255,255,255,.08);
flex:0 0 auto;
height:24px;
}

.mv-market-symbol{
color:#3b82f6;
font-size:12px;
font-weight:700;
letter-spacing:.35px;
}

.mv-market-price{
font-size:12px;
font-weight:700;
font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
}

.mv-market-pos{
font-size:12px;
font-weight:700;
color:#22c55e;
text-shadow:0 0 6px rgba(34,197,94,.35);
}

.mv-market-neg{
font-size:12px;
font-weight:700;
color:#ef4444;
text-shadow:0 0 6px rgba(239,68,68,.35);
}

.mv-market-flat{
font-size:12px;
font-weight:700;
color:#94a3b8;
}

@keyframes mvTickerScroll{
0%{transform:translateX(0);}
100%{transform:translateX(-50%);}
}



/* =========================================================
VALUE COLOR SYSTEM
========================================================= */

.mv-pos{
color:#16a34a;
text-shadow:0 0 6px rgba(34,197,94,.25);
}

.mv-neg{
color:#dc2626;
text-shadow:0 0 6px rgba(239,68,68,.25);
}

.mv-neutral{
color:#64748b;
}



/* =========================================================
WATCHLIST
========================================================= */

.mv-wl-price{
font-weight:700;
}

.mv-wl-pos{
color:#16a34a;
}

.mv-wl-neg{
color:#dc2626;
}

.mv-wl-neutral{
color:#64748b;
}

.mv-wl-change{
font-size:12px;
font-weight:600;
margin-left:6px;
}

.mv-wl-loading{
text-align:center;
padding:20px;
color:#64748b;
font-size:13px;
}



/* =========================================================
MARKET CLOCK
========================================================= */

.mv-market-clock{
display:flex;
gap:25px;
align-items:center;
padding:6px 14px;
font-size:12px;
font-weight:600;
background:#FFFFFF;
border-bottom:1px solid rgba(0,0,0,0.06);
}

[data-bs-theme="dark"] .mv-market-clock{
background:#0f172a;
border-bottom:1px solid rgba(255,255,255,0.08);
}



/* =========================================================
THEME TOGGLE
========================================================= */

.mv-theme-toggle{
display:flex;
align-items:center;
justify-content:center;
width:36px;
height:32px;
font-size:16px;
background:transparent;
border-radius:8px;
border:1px solid rgba(255,255,255,.08);
cursor:pointer;
transition:all .18s ease;
}

.mv-theme-toggle:hover{
background:rgba(99,102,241,.08);
transform:translateY(-1px);
box-shadow:0 4px 10px rgba(0,0,0,.15);
}



/* =========================================================
HEADER STACK FIX
========================================================= */

.topbar{position:relative;z-index:10;}
.page-wrapper{padding-top:0;}
.page-content{padding-top:18px;}
.container-fluid{position:relative;}



/* =========================================================
TRADING HUB
========================================================= */

.mv-trading-hub{
max-width:1400px;
margin:0 auto;
padding:30px 20px 60px;
}



/* =========================================================
TERMINAL HERO
========================================================= */

.mv-terminal-hero{
text-align:center;
padding:40px 20px;
margin-bottom:26px;
border-radius:14px;
background:linear-gradient(
180deg,
rgba(59,130,246,.10),
rgba(59,130,246,.02)
);
border:1px solid rgba(59,130,246,.15);
}

.mv-terminal-title{
font-size:28px;
font-weight:700;
color:#2563eb;
margin-bottom:8px;
}

.mv-terminal-sub{
display:flex;
justify-content:center;
gap:12px;
font-size:12px;
color:#64748b;
flex-wrap:wrap;
}

.mv-terminal-sub span{
background:#f1f5f9;
padding:4px 10px;
border-radius:20px;
font-weight:600;
}



/* =========================================================
TRADING HEADER
========================================================= */

.mv-trading-header{
margin-top:10px;
margin-bottom:20px;
}

.mv-trading-header h1{
font-size:28px;
font-weight:800;
margin-bottom:6px;
}

.mv-trading-header p{
font-size:13px;
color:#64748b;
}



/* =========================================================
TRADING HUB SCROLL
========================================================= */

.mv-hub-scroll{
overflow:hidden;
width:100%;
}

#mvIndices{
display:flex;
gap:20px;
animation:mvHubScroll 15s linear infinite;
width:max-content;
}

@keyframes mvHubScroll{
0%{transform:translateX(0);}
100%{transform:translateX(-50%);}
}



/* =========================================================
MARKET CARD HEADER
========================================================= */

.mv-market-header{
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:6px;
}

.mv-market-symbol{
font-weight:700;
font-size:13px;
color:#2563eb;
}

.mv-market-name{
font-size:11px;
color:#64748b;
}

.mv-market-price{
font-size:22px;
font-weight:800;
font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
margin-top:4px;
}

.mv-market-change{
font-size:13px;
font-weight:700;
margin-top:2px;
}



/* =========================================================
TRADING MODE CARDS
========================================================= */

.mv-hub-link{
text-decoration:none;
color:inherit;
}

.mv-hub-card{
border-radius:16px;
padding:34px 26px;
background:#ffffff;
border:1px solid #e5e7eb;
transition:all .25s ease;
text-align:center;
height:100%;
display:flex;
flex-direction:column;
justify-content:center;
}

.mv-hub-card:hover{
transform:translateY(-6px);
box-shadow:0 14px 32px rgba(0,0,0,.08);
}

.mv-hub-icon{
font-size:32px;
margin-bottom:10px;
color:#2563eb;
}

.mv-hub-card h4{
font-size:18px;
font-weight:700;
margin-bottom:6px;
}

.mv-hub-card p{
font-size:13px;
color:#64748b;
margin-bottom:10px;
}

.mv-hub-status{
font-size:12px;
font-weight:700;
padding:5px 10px;
border-radius:20px;
display:inline-block;
}

.mv-status-live{
background:#dcfce7;
color:#16a34a;
}

.mv-status-paper{
background:#dbeafe;
color:#2563eb;
}

.mv-status-auto{
background:#f1f5f9;
color:#64748b;
}



/* =========================================================
UPCOMING MODULES
========================================================= */

.mv-coming-section{
text-align:center;
margin-top:30px;
}

.mv-coming-section h5{
margin-bottom:12px;
}

.mv-coming-items{
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:10px;
}

.mv-coming-items span{
font-size:12px;
background:#f1f5f9;
padding:6px 12px;
border-radius:20px;
font-weight:600;
color:#475569;
}



/* =========================================================
DARK MODE SUPPORT
========================================================= */

[data-bs-theme="dark"] .mv-hub-card{
background:#0f172a;
border:1px solid rgba(255,255,255,.08);
}

[data-bs-theme="dark"] .mv-terminal-sub span{
background:#1e293b;
color:#cbd5f5;
}

[data-bs-theme="dark"] .mv-coming-items span{
background:#1e293b;
color:#cbd5f5;
}
/* =========================================================
MARKETVISTA — FRONTEND SIDEBAR LOCK + USER PILL
========================================================= */

:root{
--bs-startbar-width:290px;
--bs-startbar-collapsed-width:102px;
}

@media (min-width:1200px){
body[data-sidebar-size="collapsed"] .startbar,
body[data-sidebar-size="collapsed"] .startbar:hover{
width:var(--bs-startbar-collapsed-width) !important;
}

body[data-sidebar-size="collapsed"] .page-wrapper .page-content{
margin-left:var(--bs-startbar-collapsed-width) !important;
}

body[data-sidebar-size="collapsed"] .topbar{
width:calc(100% - var(--bs-startbar-collapsed-width)) !important;
}

body[data-sidebar-size="collapsed"] .startbar .brand{
width:var(--bs-startbar-collapsed-width) !important;
}

body[data-sidebar-size="collapsed"] .startbar .brand .logo{
display:flex !important;
align-items:center;
justify-content:center;
}

body[data-sidebar-size="collapsed"] .startbar .brand .logo .logo-lg{
width:0 !important;
max-width:0 !important;
overflow:hidden;
opacity:0;
margin-left:0 !important;
}

body[data-sidebar-size="collapsed"] .startbar .brand .logo .logo-sm{
display:inline-block !important;
}

body[data-sidebar-size="collapsed"] .startbar .startbar-menu .startbar-collapse{
padding-left:0 !important;
padding-right:0 !important;
}

body[data-sidebar-size="collapsed"] .startbar .startbar-menu .navbar-nav .menu-label{
text-align:center !important;
padding:0 0 10px !important;
font-weight:800 !important;
}

body[data-sidebar-size="collapsed"] .startbar .startbar-menu .navbar-nav .menu-label .label-show,
body[data-sidebar-size="collapsed"] .startbar .startbar-menu .navbar-nav .menu-label span{
display:none !important;
}

body[data-sidebar-size="collapsed"] .startbar .startbar-menu .navbar-nav .menu-label small{
display:inline-block !important;
}

body[data-sidebar-size="collapsed"] .startbar .startbar-menu .navbar-nav .nav-item .nav-link,
body[data-sidebar-size="collapsed"] .startbar:hover .startbar-menu .navbar-nav .nav-item .nav-link{
justify-content:center !important;
width:76px;
min-height:62px;
padding:8px 0 !important;
margin:0 auto 12px !important;
border-radius:20px !important;
transform:none !important;
}

body[data-sidebar-size="collapsed"] .startbar .startbar-menu .navbar-nav .nav-item .nav-link .mv-sidebar-link-text,
body[data-sidebar-size="collapsed"] .startbar:hover .startbar-menu .navbar-nav .nav-item .nav-link .mv-sidebar-link-text{
display:none !important;
}

body[data-sidebar-size="collapsed"] .startbar .startbar-menu .navbar-nav .nav-item .nav-link[data-bs-toggle="collapse"]:after,
body[data-sidebar-size="collapsed"] .startbar .startbar-menu .navbar-nav .nav-item .nav-link[data-bs-toggle="true"]:after,
body[data-sidebar-size="collapsed"] .startbar:hover .startbar-menu .navbar-nav .nav-item .nav-link[data-bs-toggle="collapse"]:after,
body[data-sidebar-size="collapsed"] .startbar:hover .startbar-menu .navbar-nav .nav-item .nav-link[data-bs-toggle="true"]:after{
display:none !important;
}

body[data-sidebar-size="collapsed"] .startbar .startbar-menu .navbar-nav .nav-item .nav-link .menu-icon,
body[data-sidebar-size="collapsed"] .startbar:hover .startbar-menu .navbar-nav .nav-item .nav-link .menu-icon{
width:42px !important;
height:42px !important;
flex:0 0 42px !important;
font-size:24px !important;
margin-right:0 !important;
}

body[data-sidebar-size="collapsed"] .startbar .startbar-menu .navbar-nav .nav-item .collapse{
display:none !important;
}

body[data-sidebar-size="collapsed"] .startbar .mv-side-user,
body[data-sidebar-size="collapsed"] .startbar:hover .mv-side-user{
width:auto;
margin:10px auto 18px !important;
padding:12px 0 0 !important;
text-align:center;
border-top:1px solid rgba(148,163,184,.28);
background:transparent;
box-shadow:none;
}

body[data-sidebar-size="collapsed"] .startbar .mv-side-user-label,
body[data-sidebar-size="collapsed"] .startbar .mv-side-user-name,
body[data-sidebar-size="collapsed"] .startbar .mv-role-pill-full,
body[data-sidebar-size="collapsed"] .startbar:hover .mv-side-user-label,
body[data-sidebar-size="collapsed"] .startbar:hover .mv-side-user-name,
body[data-sidebar-size="collapsed"] .startbar:hover .mv-role-pill-full{
display:none !important;
}

body[data-sidebar-size="collapsed"] .startbar .mv-role-pill-short,
body[data-sidebar-size="collapsed"] .startbar:hover .mv-role-pill-short{
display:inline !important;
}

body[data-sidebar-size="collapsed"] .startbar .mv-side-user-role,
body[data-sidebar-size="collapsed"] .startbar:hover .mv-side-user-role{
min-width:52px;
padding:0 12px !important;
margin:0 auto;
}
}


/* FRONTEND SIDEBAR BRAND + ICON ALIGNMENT */
.startbar .mv-sidebar-icon-box{width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 42px;border-radius:15px;background:rgba(59,130,246,.09);border:1px solid rgba(59,130,246,.18);color:#2563eb;box-shadow:inset 0 1px 0 rgba(255,255,255,.45);}
.startbar .mv-sidebar-icon-box i{font-size:1.15rem;line-height:1;display:inline-flex;}
.startbar .mv-sidebar-brand-title{color:#0f172a;}
@media (min-width:1200px){body[data-sidebar-size="collapsed"] .startbar .mv-sidebar-icon-box, body[data-sidebar-size="collapsed"] .startbar:hover .mv-sidebar-icon-box{width:42px!important;height:42px!important;flex:0 0 42px!important;} body[data-sidebar-size="collapsed"] .startbar .mv-sidebar-icon-box i, body[data-sidebar-size="collapsed"] .startbar:hover .mv-sidebar-icon-box i{font-size:1.15rem!important;}}


/* =========================================================
GLOBAL CONTENT WIDTH HOTFIX
========================================================= */

html,
body{
max-width:100%;
overflow-x:hidden;
}

.page-wrapper,
.page-wrapper .page-content,
.page-content,
.container-fluid,
.container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm,
.row{
max-width:100%;
min-width:0;
box-sizing:border-box;
}

.page-wrapper,
.page-content,
.container-fluid{
overflow-x:clip;
}

.topbar,
.mv-shared-header-shell,
.mv-marketbar,
.mv-marketbar-inner{
max-width:100%;
}

.mv-marketbar{
overflow:hidden;
padding-right:0;
}

.startbar,
.page-wrapper{
box-sizing:border-box;
}


/* =========================================================
STICKY / FIXED HEADER RESTORE — 2026-03-29
========================================================= */
.topbar{
position:fixed !important;
top:0 !important;
left:0 !important;
right:0 !important;
z-index:1090 !important;
}
.page-wrapper{padding-top:0 !important;}
.page-content{padding-top:0 !important;}
@media (max-width:1199.98px){
.topbar{width:100% !important;margin-left:0 !important;}
}


/* =========================================================
HEADER/SIDEBAR OVERLAP OVERRIDE — 2026-03-30
========================================================= */
.topbar{
position:static !important;
left:auto !important;
right:auto !important;
width:auto !important;
height:0 !important;
min-height:0 !important;
padding:0 !important;
background:transparent !important;
box-shadow:none !important;
}

/* =========================================================
WATCHLIST UX UPGRADE
========================================================= */

.mv-watchlist-status{
display:flex;
align-items:center;
gap:8px;
padding:10px 12px;
border-radius:12px;
font-size:13px;
font-weight:600;
margin-bottom:12px;
border:1px solid transparent;
}

.mv-watchlist-status.is-info{
color:#1d4ed8;
background:rgba(59,130,246,.10);
border-color:rgba(59,130,246,.18);
}

.mv-watchlist-status.is-success{
color:#166534;
background:rgba(34,197,94,.10);
border-color:rgba(34,197,94,.18);
}

.mv-watchlist-status.is-warning{
color:#9a3412;
background:rgba(251,146,60,.12);
border-color:rgba(251,146,60,.20);
}

.mv-watchlist-status.is-danger{
color:#b91c1c;
background:rgba(239,68,68,.10);
border-color:rgba(239,68,68,.18);
}

.mv-watchlist-sync-ok{ color:#166534; }
.mv-watchlist-sync-warn{ color:#b45309; }
.mv-watchlist-sync-busy{ color:#1d4ed8; }
.mv-watchlist-sync-idle{ color:#64748b; }

.mv-watchlist-row-flash{
animation:mvWatchlistFlash 1.4s ease;
}

@keyframes mvWatchlistFlash{
0%{ background:rgba(59,130,246,.12); }
100%{ background:transparent; }
}

[data-bs-theme="dark"] .mv-watchlist-status.is-info{
color:#bfdbfe;
background:rgba(59,130,246,.16);
border-color:rgba(96,165,250,.24);
}

[data-bs-theme="dark"] .mv-watchlist-status.is-success{
color:#bbf7d0;
background:rgba(34,197,94,.16);
border-color:rgba(74,222,128,.24);
}

[data-bs-theme="dark"] .mv-watchlist-status.is-warning{
color:#fed7aa;
background:rgba(251,146,60,.16);
border-color:rgba(251,191,36,.24);
}

[data-bs-theme="dark"] .mv-watchlist-status.is-danger{
color:#fecaca;
background:rgba(239,68,68,.16);
border-color:rgba(248,113,113,.24);
}
