:root {
    --bg-primary: #0b0e11;
    --bg-secondary: #1e2329;
    --bg-tertiary: #2b3139;
    --bg-card: #181a20;
    --text-primary: #eaecef;
    --text-secondary: #848e9c;
    --text-muted: #5e6673;
    --accent: #3b82f6;
    --accent-hover: #2563eb;
    --green: #0ecb81;
    --red: #f6465d;
    --border: #2b3139;
    --sidebar-collapsed: 64px;
    --sidebar-expanded: 240px;
}
html[data-skin=material] .container-fluid,
html[data-skin=material] .content-page > .container-fluid {
    max-width: 100% !important;
    width: 100%;
}

/* Hide PACE sidenav — portal uses its own rail */
.portal-shell .sidenav-menu,
.portal-shell .sidenav-toggle-button,
.portal-shell .logo-topbar { display: none !important; }
.portal-shell .app-topbar,
.portal-shell .content-page {
    margin-inline-start: var(--sidebar-collapsed) !important;
}
.portal-shell.sidebar-open .app-topbar,
.portal-shell.sidebar-open .content-page,
body.sidebar-open .app-topbar,
body.sidebar-open .content-page {
    margin-inline-start: var(--sidebar-expanded) !important;
}

.portal-sidebar {
    position: fixed; top: 0; left: 0; bottom: 0;
    width: var(--sidebar-collapsed);
    background: var(--bg-secondary);
    border-right: 1px solid var(--border);
    display: flex; flex-direction: column;
    z-index: 1100;
    transition: width .25s ease;
    overflow: hidden;
}
.portal-sidebar.expanded { width: var(--sidebar-expanded); }

.sidebar-brand {
    padding: .7rem .5rem;
    border-bottom: 1px solid var(--border);
    display: flex; align-items: center; justify-content: center;
    min-height: 56px; overflow: hidden;
}
.sidebar-brand .brand-logo-sm {
    width: 32px; height: 32px; object-fit: contain; display: block; flex-shrink: 0;
}
.sidebar-brand .brand-logo-lg {
    display: none;
    max-width: 170px; max-height: 40px; width: auto; height: auto; object-fit: contain;
}
.portal-sidebar.expanded .sidebar-brand {
    justify-content: flex-start; padding: .75rem 1rem;
}
.portal-sidebar.expanded .brand-logo-sm { display: none; }
.portal-sidebar.expanded .brand-logo-lg { display: block; }

.sidebar-expand-btn {
    background: none; border: 1px solid var(--accent); color: var(--text-secondary);
    margin: .65rem .7rem; border-radius: 6px;
    padding: .45rem; cursor: pointer; font-size: .95rem;
    display: flex; align-items: center; justify-content: center;
    min-height: 36px; transition: color .15s, background .15s;
}
.sidebar-expand-btn:hover { color: var(--text-primary); background: rgba(59,130,246,.08); }
.sidebar-expand-btn .expand-label { opacity: 0; font-size: .8rem; margin-left: .5rem; transition: opacity .2s; white-space: nowrap; }
.portal-sidebar.expanded .sidebar-expand-btn { justify-content: flex-start; padding: .45rem .75rem; }
.portal-sidebar.expanded .sidebar-expand-btn .expand-label { opacity: 1; }

.sidebar-nav { flex: 1; overflow-y: auto; padding: .35rem 0; }
.nav-section {
    padding: .5rem 0 .25rem; font-size: .6rem;
    text-transform: uppercase; letter-spacing: .08em;
    color: var(--text-muted); font-weight: 600;
    text-align: center; white-space: nowrap;
    opacity: 0; height: 0; overflow: hidden;
    transition: opacity .2s, height .2s;
}
.portal-sidebar.expanded .nav-section {
    opacity: 1; height: auto; padding: .5rem 1.25rem .25rem; text-align: left;
}
.sidebar-nav a {
    display: flex; align-items: center; justify-content: center;
    padding: .7rem 0; color: var(--text-secondary);
    text-decoration: none; font-size: .875rem;
    font-weight: 500; transition: all .15s;
    position: relative; white-space: nowrap;
}
.portal-sidebar.expanded .sidebar-nav a {
    justify-content: flex-start;
    padding: .6rem 1.25rem; gap: .75rem;
}
.sidebar-nav a:hover { color: var(--text-primary); background: rgba(255,255,255,.04); }
.sidebar-nav a.active {
    color: var(--accent);
    background: rgba(59,130,246,.08);
    border-right: 2px solid var(--accent);
}
.sidebar-nav a i { width: 20px; text-align: center; font-size: 1rem; flex-shrink: 0; }
.sidebar-nav a .nav-label {
    opacity: 0; width: 0; overflow: hidden;
    transition: opacity .2s, width .2s;
}
.portal-sidebar.expanded .sidebar-nav a .nav-label {
    opacity: 1; width: auto;
}
.sidebar-nav a .nav-badge {
    opacity: 0; transition: opacity .2s; margin-left: auto;
}
.portal-sidebar.expanded .sidebar-nav a .nav-badge { opacity: 1; }

.portal-sidebar:not(.expanded) .sidebar-nav a:hover::after {
    content: attr(data-tooltip);
    position: absolute; left: 100%; top: 50%; transform: translateY(-50%);
    background: var(--bg-tertiary); color: var(--text-primary);
    padding: .35rem .65rem; border-radius: 4px; font-size: .75rem;
    white-space: nowrap; z-index: 200; margin-left: 8px;
    pointer-events: none; box-shadow: 0 2px 8px rgba(0,0,0,.3);
}

.sidebar-footer { padding: .5rem; border-top: 1px solid var(--border); }
.portal-sidebar.expanded .sidebar-footer { padding: 1rem 1.25rem; }
.sidebar-footer .user-info {
    display: flex; align-items: center; justify-content: center;
    gap: 0; margin-bottom: .5rem;
}
.portal-sidebar.expanded .sidebar-footer .user-info {
    justify-content: flex-start; gap: .75rem;
}
.sidebar-footer .user-details { opacity: 0; width: 0; overflow: hidden; transition: opacity .2s; }
.portal-sidebar.expanded .sidebar-footer .user-details { opacity: 1; width: auto; }
.user-avatar {
    width: 36px; height: 36px; border-radius: 50%;
    background: var(--bg-tertiary); display: flex;
    align-items: center; justify-content: center;
    color: var(--accent); font-weight: 600; font-size: .8rem;
    flex-shrink: 0;
}
.user-name { font-size: .85rem; font-weight: 600; color: var(--text-primary); }
.user-email { font-size: .7rem; color: var(--text-secondary); }
.sidebar-footer .logout-text { opacity: 0; width: 0; overflow: hidden; transition: opacity .2s; }
.portal-sidebar.expanded .sidebar-footer .logout-text { opacity: 1; width: auto; }

.portal-shell .app-topbar .topbar-menu {
    padding-inline: 1.25rem !important;
    min-height: 64px;
}
.portal-shell .app-topbar .h5 {
    padding-inline-start: .35rem;
}
.portal-shell .content-page {
    padding: 1rem 1.5rem 1.5rem !important;
}
.portal-main { margin-left: 0; min-height: auto; width: 100%; }
.portal-topbar { display: none; }
.portal-content { padding: .5rem 0 1rem; width: 100%; }

.sidebar-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 1090; }
.mobile-toggle { display: none; background: none; border: none; color: var(--text-primary); font-size: 1.2rem; cursor: pointer; }
@media (max-width: 768px) {
    .portal-sidebar { transform: translateX(-100%); width: var(--sidebar-expanded) !important; }
    .portal-sidebar.mobile-show { transform: translateX(0); }
    .portal-sidebar.mobile-show ~ .sidebar-overlay { display: block; }
    .portal-shell .app-topbar,
    .portal-shell .content-page,
    .portal-shell.sidebar-open .app-topbar,
    .portal-shell.sidebar-open .content-page { margin-inline-start: 0 !important; }
    .mobile-toggle { display: inline-block !important; }
}

.dark-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; }
.dark-card .card-header {
    background: transparent; border-bottom: 1px solid var(--border);
    padding: .75rem 1rem; font-size: .85rem; font-weight: 600;
}
.dark-card .card-body { padding: 1rem; }
.dark-table { color: var(--text-primary); margin: 0; }
.dark-table thead th {
    background: var(--bg-secondary); border-bottom: 1px solid var(--border);
    color: var(--text-secondary); font-size: .75rem; font-weight: 600;
    text-transform: uppercase; letter-spacing: .05em;
    padding: .6rem 1rem; white-space: nowrap;
}
.dark-table tbody td {
    border-bottom: 1px solid var(--border);
    padding: .65rem 1rem; font-size: .85rem; vertical-align: middle;
}
.dark-table tbody tr:hover { background: rgba(255,255,255,.02); }
.badge-long, .badge-buy { background: rgba(14,203,129,.15); color: var(--green); font-weight: 600; }
.badge-short, .badge-sell { background: rgba(246,70,93,.15); color: var(--red); font-weight: 600; }
.badge-pending { background: rgba(251,191,36,.15); color: #fbbf24; }
.badge-approved { background: rgba(14,203,129,.15); color: var(--green); }
.badge-rejected { background: rgba(246,70,93,.15); color: var(--red); }
.text-profit { color: var(--green) !important; }
.text-loss { color: var(--red) !important; }
.btn-buy { background: var(--green); color: #fff; border: none; font-weight: 600; }
.btn-buy:hover { background: #0ba36b; color: #fff; }
.btn-sell { background: var(--red); color: #fff; border: none; font-weight: 600; }
.btn-sell:hover { background: #d4394d; color: #fff; }
.btn-accent { background: var(--accent); color: #fff; border: none; font-weight: 600; }
.btn-accent:hover { background: var(--accent-hover); color: #fff; }
.btn-outline-dark-custom {
    border: 1px solid var(--border); color: var(--text-secondary);
    background: transparent; font-size: .8rem;
}
.btn-outline-dark-custom:hover { background: var(--bg-tertiary); color: var(--text-primary); }
.btn-outline-dark-custom.active { background: var(--accent); color: #fff; border-color: var(--accent); }
.stat-card {
    background: var(--bg-card); border: 1px solid var(--border);
    border-radius: 8px; padding: 1rem 1.25rem;
}
.stat-card .stat-label { font-size: .75rem; color: var(--text-secondary); margin-bottom: .25rem; }
.stat-card .stat-value { font-size: 1.25rem; font-weight: 700; }
.stat-card .stat-change { font-size: .8rem; margin-top: .15rem; }
.portal-content .form-control,
.portal-content .form-select,
.portal-content input[type="number"],
.portal-content input[type="text"],
.portal-content input[type="email"],
.portal-content input[type="password"],
.portal-content textarea,
.portal-content select {
    background: var(--bg-primary) !important; border-color: var(--border) !important;
    color: var(--text-primary) !important;
}
.portal-content .form-control:focus,
.portal-content .form-select:focus,
.portal-content input:focus,
.portal-content textarea:focus,
.portal-content select:focus {
    background: var(--bg-primary) !important; border-color: var(--accent) !important;
    color: var(--text-primary) !important;
    box-shadow: 0 0 0 2px rgba(59,130,246,.15) !important;
}
.portal-content .form-control::placeholder,
.portal-content input::placeholder,
.portal-content textarea::placeholder { color: var(--text-muted) !important; }
.portal-content .form-label { color: var(--text-secondary); font-size: .8rem; font-weight: 500; }
.portal-content .card { background: var(--bg-card); border-color: var(--border); color: var(--text-primary); }
.portal-content .card-header { background: var(--bg-secondary); border-color: var(--border); color: var(--text-primary); }
.portal-content .card-body { color: var(--text-primary); }
.portal-content .table { color: var(--text-primary); --bs-table-bg: transparent; }
.portal-content .table > :not(caption) > * > * { background: transparent; border-color: var(--border); color: var(--text-primary); }
.portal-content a { color: var(--accent); }
.portal-content a:hover { color: var(--accent-hover); }
.portal-content .text-muted { color: var(--text-secondary) !important; }
.alert-success { background: rgba(14,203,129,.12); border-color: rgba(14,203,129,.3); color: var(--green); }
.alert-danger { background: rgba(246,70,93,.12); border-color: rgba(246,70,93,.3); color: var(--red); }
.alert-warning { background: rgba(251,191,36,.12); border-color: rgba(251,191,36,.3); color: #fbbf24; }
.badge.bg-success { background: rgba(14,203,129,.2) !important; color: var(--green); }
.badge.bg-warning { background: rgba(251,191,36,.2) !important; color: #fbbf24; }
.badge.bg-danger { background: rgba(246,70,93,.2) !important; color: var(--red); }
.badge.bg-info { background: rgba(59,130,246,.2) !important; color: var(--accent); }
.badge.bg-secondary { background: var(--bg-tertiary) !important; color: var(--text-secondary); }
.border-bottom { border-color: var(--border) !important; }
[data-bs-theme="dark"] .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }
.logo-img-header { max-height: 40px; width: auto; }
.logo-img-sidebar { max-height: 48px; width: auto; }
.btn-passkey {
    background: transparent;
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 8px;
    padding: .75rem;
    font-weight: 600;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    color: inherit;
    cursor: pointer;
}
.btn-passkey:hover:not(:disabled) {
    border-color: var(--accent, #3b82f6);
    color: var(--accent, #3b82f6);
}
.btn-passkey:disabled { opacity: .55; cursor: wait; }
.login-divider {
    display: flex; align-items: center; gap: 1rem;
    margin: 1.25rem 0; color: #6c757d; font-size: .75rem;
}
.login-divider::before, .login-divider::after {
    content: ''; flex: 1; height: 1px; background: var(--bs-border-color, #dee2e6);
}

.portal-chat { font-family: inherit; }
.portal-chat__fab {
    position: fixed; right: 22px; bottom: 22px; z-index: 1040;
    width: 56px; height: 56px; border-radius: 50%;
    border: 0; cursor: pointer;
    background: var(--accent); color: #fff;
    box-shadow: 0 10px 28px rgba(37,99,235,.4);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.25rem;
}
.portal-chat__fab:hover { background: var(--accent-hover); }
.portal-chat__badge {
    position: absolute; top: -2px; right: -2px;
    min-width: 18px; height: 18px; padding: 0 5px;
    border-radius: 999px; background: var(--red); color: #fff;
    font-size: .65rem; font-weight: 700; line-height: 18px;
}
.portal-chat__panel {
    position: fixed; right: 22px; bottom: 88px; z-index: 1040;
    width: min(360px, calc(100vw - 24px));
    height: min(480px, calc(100vh - 120px));
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 16px;
    box-shadow: 0 18px 50px rgba(0,0,0,.45);
    display: flex; flex-direction: column; overflow: hidden;
}
.portal-chat__panel[hidden],
.portal-chat__badge[hidden],
.portal-chat__inbox[hidden],
.portal-chat__thread[hidden],
.portal-chat__close[hidden] { display: none !important; }
.portal-chat__head {
    display: flex; align-items: center; justify-content: space-between;
    padding: .85rem 1rem;
    background: var(--bg-secondary);
    border-bottom: 1px solid var(--border);
}
.portal-chat__kicker {
    font-size: .68rem; text-transform: uppercase; letter-spacing: .08em;
    color: var(--text-secondary); margin-bottom: .1rem;
}
.portal-chat__title { font-weight: 650; color: var(--text-primary); }
.portal-chat__close {
    background: none; border: 0; color: var(--text-secondary);
    font-size: 1.5rem; line-height: 1; cursor: pointer;
}
.portal-chat__body {
    flex: 1; overflow-y: auto; padding: .9rem;
    display: flex; flex-direction: column; gap: .65rem;
}
.portal-chat__empty {
    margin: auto; text-align: center; color: var(--text-secondary);
    font-size: .85rem; padding: 1rem;
}
.portal-chat__msg { max-width: 85%; }
.portal-chat__msg.is-mine { align-self: flex-end; }
.portal-chat__bubble {
    padding: .55rem .75rem; border-radius: 12px;
    background: var(--bg-tertiary); color: var(--text-primary);
    font-size: .88rem; white-space: pre-wrap; word-break: break-word;
}
.portal-chat__msg.is-mine .portal-chat__bubble {
    background: var(--accent); color: #fff;
}
.portal-chat__meta {
    font-size: .68rem; color: var(--text-muted); margin-top: .2rem;
}
.portal-chat__msg.is-mine .portal-chat__meta { text-align: right; }
.portal-chat__form {
    display: flex; gap: .5rem; padding: .7rem;
    border-top: 1px solid var(--border); background: var(--bg-secondary);
}
.portal-chat__input {
    flex: 1; border: 1px solid var(--border); border-radius: 10px;
    background: var(--bg-primary); color: var(--text-primary);
    padding: .55rem .75rem; font-size: .9rem;
}
.portal-chat__input:focus { outline: none; border-color: var(--accent); }
.portal-chat__send {
    width: 40px; border: 0; border-radius: 10px;
    background: var(--accent); color: #fff; cursor: pointer;
}
.portal-chat__send:disabled, .portal-chat__input:disabled { opacity: .5; cursor: not-allowed; }

.portal-chat__inbox, .portal-chat__thread {
    flex: 1; min-height: 0; display: flex; flex-direction: column; overflow: hidden;
}
.portal-chat__inbox { overflow-y: auto; }
.portal-chat__row {
    display: block; width: 100%; text-align: start; background: none;
    border: 0; border-bottom: 1px solid var(--border);
    padding: .85rem 1rem; cursor: pointer; color: inherit;
}
.portal-chat__row:hover { background: rgba(59,130,246,.08); }
.portal-chat__row.is-unread { background: rgba(59,130,246,.12); }
.portal-chat__row-top { display: flex; justify-content: space-between; gap: .5rem; color: var(--text-primary); }
.portal-chat__row-unread {
    background: var(--accent); color: #fff; border-radius: 999px;
    min-width: 18px; padding: 0 6px; font-size: .7rem; line-height: 18px; text-align: center;
}
.portal-chat__row-preview {
    color: var(--text-secondary); font-size: .8rem;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: .2rem;
}