/* ==========================================================================
   THEME & PERFORMANCE STYLES (LIGHT & DARK MODE)
   ========================================================================== */

/* ==================== LIGHT MODE PERFORMANCE ==================== */

/* Oprește animațiile pe Low Perf */
html.perf-low *, html.low-perf *, body.perf-low *, body.low-perf * {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
}
html.perf-low .btn-quick-adjust, html.low-perf .btn-quick-adjust,
body.perf-low .btn-quick-adjust, body.low-perf .btn-quick-adjust {
    background: #f2f2f7 !important;
    border: 1px solid rgba(0, 0, 0, 0.12) !important;
}
/* Mod Mediu (Medium Perf) - Blur redus pentru toate cardurile pe Light */
html.perf-medium .main-card, body.perf-medium .main-card,
html.perf-medium .side-btn, body.perf-medium .side-btn,
html.perf-medium .card-sus-dreapta, body.perf-medium .card-sus-dreapta,
html.perf-medium .glass-card, body.perf-medium .glass-card,
html.perf-medium .modal-card, body.perf-medium .modal-card,
html.perf-medium .login-card, body.perf-medium .login-card,
html.perf-medium .wallet-banner, body.perf-medium .wallet-banner,
html.perf-medium .convert-banner, body.perf-medium .convert-banner,
html.perf-medium .chart-box, body.perf-medium .chart-box,
html.perf-medium .trade-controls, body.perf-medium .trade-controls,
html.perf-medium .investments-card-side, body.perf-medium .investments-card-side,
html.perf-medium .feature-box, body.perf-medium .feature-box,
html.perf-medium .admin-info-box, body.perf-medium .admin-info-box,
html.perf-medium .header, body.perf-medium .header,
html.perf-medium .table-container, body.perf-medium .table-container,
html.perf-medium .stat-badge, body.perf-medium .stat-badge,
html.perf-medium .category-card, body.perf-medium .category-card,
html.perf-medium .section, body.perf-medium .section,
html.perf-medium .warning-box, body.perf-medium .warning-box,
html.perf-medium .chat-container, body.perf-medium .chat-container,
html.perf-medium .message-box, body.perf-medium .message-box,
html.perf-medium .chat-input-area, body.perf-medium .chat-input-area {
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    background: rgba(255, 255, 255, 0.85) !important;
}

/* Mod Scăzut (Low Perf) - Fără blur, fundal solid opac pentru toate cardurile pe Light */
html.perf-low .main-card, html.perf-low .side-btn, html.perf-low .card-sus-dreapta, html.perf-low .glass-card, html.perf-low .modal-card, html.perf-low .login-card, html.perf-low .wallet-banner, html.perf-low .convert-banner, html.perf-low .chart-box, html.perf-low .trade-controls, html.perf-low .investments-card-side, html.perf-low .feature-box, html.perf-low .admin-info-box, html.perf-low .header, html.perf-low .table-container, html.perf-low .stat-badge, html.perf-low .category-card, html.perf-low .section, html.perf-low .warning-box, html.perf-low .chat-container, html.perf-low .chat-input-area,
html.low-perf .main-card, html.low-perf .side-btn, html.low-perf .card-sus-dreapta, html.low-perf .glass-card, html.low-perf .modal-card, html.low-perf .login-card, html.low-perf .wallet-banner, html.low-perf .convert-banner, html.low-perf .chart-box, html.low-perf .trade-controls, html.low-perf .investments-card-side, html.low-perf .feature-box, html.low-perf .admin-info-box, html.low-perf .header, html.low-perf .table-container, html.low-perf .stat-badge, html.low-perf .category-card, html.low-perf .section, html.low-perf .warning-box, html.low-perf .chat-container, html.low-perf .chat-input-area,
body.perf-low .main-card, body.perf-low .side-btn, body.perf-low .card-sus-dreapta, body.perf-low .glass-card, body.perf-low .modal-card, body.perf-low .login-card, body.perf-low .wallet-banner, body.perf-low .convert-banner, body.perf-low .chart-box, body.perf-low .trade-controls, body.perf-low .investments-card-side, body.perf-low .feature-box, body.perf-low .admin-info-box, body.perf-low .header, body.perf-low .table-container, body.perf-low .stat-badge, body.perf-low .category-card, body.perf-low .section, body.perf-low .warning-box, body.perf-low .chat-container, body.perf-low .chat-input-area,
body.low-perf .main-card, body.low-perf .side-btn, body.low-perf .card-sus-dreapta, body.low-perf .glass-card, body.low-perf .modal-card, body.low-perf .login-card, body.low-perf .wallet-banner, body.low-perf .convert-banner, body.low-perf .chart-box, body.low-perf .trade-controls, body.low-perf .investments-card-side, body.low-perf .feature-box, body.low-perf .admin-info-box, body.low-perf .header, body.low-perf .table-container, body.low-perf .stat-badge, body.low-perf .category-card, body.low-perf .section, body.low-perf .warning-box, body.low-perf .chat-container, body.low-perf .chat-input-area {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: #ffffff !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
}

html.perf-low .message-wrapper.other .message-box, 
html.low-perf .message-wrapper.other .message-box,
body.perf-low .message-wrapper.other .message-box, 
body.low-perf .message-wrapper.other .message-box {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: #f0f0f5 !important;
}

/* Dropdown solid pe Low Perf (Light Mode) */
html.perf-low .card-sus-dreapta, 
html.low-perf .card-sus-dreapta,
body.perf-low .card-sus-dreapta, 
body.low-perf .card-sus-dreapta {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: #ffffff !important;
    border: 1px solid rgba(0, 0, 0, 0.12) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15) !important;
}

/* ==================== DARK MODE AUTOMAT ==================== */
@media (prefers-color-scheme: dark) {
    :root { color-scheme: dark; }
    
    body { 
        color: #f5f5f7 !important; 
        background-color: #000000 !important; 
    }
    
    #investmentsList p, 
    #investmentsList div[style*="color: rgba(29,29,31"] {
        color: rgba(245, 245, 247, 0.75) !important;
    }

    /* Etichete & Text de Căutare Formular */
    label, .input-label, .search-label, .field-label {
        color: rgba(245, 245, 247, 0.75) !important;
    }

    .main-subtitle, .feature-desc, .card-subtitle { 
        color: rgba(245, 245, 247, 0.75) !important; 
    }
    .card-sus-dreapta a, .side-btn, .action-btn-secondary { 
        color: #f5f5f7 !important; 
    }
    .card-sus-dreapta a:hover, 
    .card-sus-dreapta button:hover {
        background: rgba(255, 255, 255, 0.15) !important;
    }

    .card-sus-dreapta a, 
    .card-sus-dreapta button {
        transition: background-color 0.2s ease, transform 0.3s ease !important;
    }

    /* Ridică butonul la hover cu 2px */
    html:not(.perf-low):not(.low-perf) .card-sus-dreapta a:hover, 
    html:not(.perf-low):not(.low-perf) .card-sus-dreapta button:hover {
        transform: translateY(-2px);
    }
    
    /* Stil pentru .stat-box identic cu butonul de ajustare/blocare (.btn-quick-adjust) */
    .stat-box,
    html.perf-low .stat-box,
    html.low-perf .stat-box,
    body.perf-low .stat-box,
    body.low-perf .stat-box {
        background: rgba(255, 255, 255, 0.1) !important;
        border: 1px solid rgba(255, 255, 255, 0.15) !important;
    }
    
    .inner-card-box {
        background: rgba(255, 255, 255, 0.06) !important;
        border-color: rgba(255, 255, 255, 0.12) !important;
    }

    .inner-divider {
        border-top-color: rgba(255, 255, 255, 0.1) !important;
    }

    .stat-badge {
        background: rgba(32, 32, 38, 0.85) !important;
        color: #f5f5f7 !important;
        border-color: rgba(255, 255, 255, 0.15) !important;
    }

    .cat-badge {
        background: rgba(255, 255, 255, 0.12) !important;
        color: #f5f5f7 !important;
    }
    
    /* Carduri principale & Navigație */
    .main-card {
        background: linear-gradient(135deg, rgba(30, 30, 36, 0.65) 0%, rgba(18, 18, 22, 0.45) 100%) !important;
        border-color: rgba(255, 255, 255, 0.14) !important;
        box-shadow: 0 15px 35px -8px rgba(0, 0, 0, 0.4) !important;
    }

    .side-btn, .feature-box, .badge-tag, .action-btn-secondary {
        background: rgba(32, 32, 38, 0.55) !important;
        border-color: rgba(255, 255, 255, 0.12) !important;
    }
    .card-sus-dreapta { 
    display: flex !important;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    position: fixed; 
    top: 52px; 
    right: 14px; 
    padding: 8px; 
    background: var(--card-bg, rgba(255, 255, 255, 0.65)) !important; 
    backdrop-filter: blur(var(--blur-val, 30px)) saturate(200%); 
    -webkit-backdrop-filter: blur(var(--blur-val, 30px)) saturate(200%); 
    border-radius: 16px; 
    border: 1px solid var(--card-border, rgba(255, 255, 255, 0.85)); 
    box-shadow: var(--shadow-color, 0 12px 32px -8px rgba(0, 0, 0, 0.12)), var(--glass-inset-glow, inset 0 1px 1px rgba(255, 255, 255, 0.8));
    z-index: 1000; 
    flex-direction: column; 
    gap: 6px; 
    min-width: 150px;
}

.card-sus-dreapta.show {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    animation: iosEntrance 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.card-sus-dreapta.closing {
    display: flex !important;
    visibility: visible;
    opacity: 0;
    pointer-events: none;
    animation: iosExit 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

    .feature-box:hover, .side-btn:hover { 
        background: rgba(48, 48, 56, 0.75) !important; 
    }

    /* Componente Specifice Bursă */
    .wallet-banner, .convert-banner, .chart-box, .trade-controls, .investments-card-side {
        background: rgba(32, 32, 40, 0.55) !important;
        border-color: rgba(255, 255, 255, 0.12) !important;
    }

    .wallet-label, .stock-name, #statusIndicator {
        color: rgba(245, 245, 247, 0.65) !important;
    }

    #portfolioValueDisplay {
        color: #f5f5f7 !important;
    }

    /* Input-uri, Căutare & Placeholders */
    .search-box, .trade-input {
        background: rgba(255, 255, 255, 0.08) !important;
        border-color: rgba(255, 255, 255, 0.15) !important;
        color: #f5f5f7 !important;
    }

    .search-box:focus, .trade-input:focus {
        background: rgba(255, 255, 255, 0.15) !important;
        border-color: #0a84ff !important;
    }

    input::placeholder, 
    .search-box::placeholder, 
    .trade-input::placeholder, 
    .custom-input::placeholder {
        color: rgba(245, 245, 247, 0.45) !important;
    }

    /* Lista Acțiuni & Carduri Investiții */
    .stock-item, .stoc-item,.investment-card {
        background: rgba(255, 255, 255, 0.06) !important;
        border-color: rgba(255, 255, 255, 0.1) !important;
        color: #f5f5f7 !important;
    }

    .card-sus-dreapta a, 
    .side-btn, 
    .action-btn-secondary, 
    .badge-tag { 
        color: #f5f5f7 !important; 
    }

    h1, h2, h3, h4, 
    .main-title, 
    .selected-title, 
    .investments-title, 
    .stock-symbol {
        color: #f5f5f7 !important;
    }

    .stock-item:hover, .stock-item.active .stoc-item:hover, .stoc-item.active {
        background: rgba(255, 255, 255, 0.18) !important;
        border-color: rgba(10, 132, 255, 0.5) !important;
    }

    /* ==================== Q&A DARK MODE ==================== */
    .category-card {
        background: linear-gradient(135deg, rgba(30, 30, 36, 0.75) 0%, rgba(18, 18, 22, 0.55) 100%) !important;
        border-color: rgba(255, 255, 255, 0.12) !important;
        box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5) !important;
    }

    .category-header {
        border-bottom-color: rgba(255, 255, 255, 0.1) !important;
    }

    .category-icon {
        background: rgba(255, 255, 255, 0.1) !important;
        border-color: rgba(255, 255, 255, 0.15) !important;
    }

    .category-title {
        color: #f5f5f7 !important;
    }

    .qa-item {
        background: rgba(255, 255, 255, 0.06) !important;
        border-color: rgba(255, 255, 255, 0.1) !important;
    }

    .qa-item:hover {
        background: rgba(255, 255, 255, 0.12) !important;
    }

    .qa-question {
        color: #f5f5f7 !important;
    }

    .qa-answer {
        color: rgba(245, 245, 247, 0.78) !important;
    }

    .side-btn-bug {
        color: #ff453a !important;
        background: rgba(25, 25, 30, 0.85) !important;
        border: 1px solid rgba(255, 69, 58, 0.4) !important;
        backdrop-filter: blur(10px) !important;
        -webkit-backdrop-filter: blur(10px) !important;
    }

    .side-btn-bug:hover {
        background: rgba(35, 35, 42, 0.95) !important;
        border-color: rgba(255, 69, 58, 0.7) !important;
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4) !important;
    }

    /* ==================== TERMENI & CONDIȚII DARK MODE ==================== */
    .section {
        background: rgba(255, 255, 255, 0.06) !important;
        border-color: rgba(255, 255, 255, 0.1) !important;
    }

    .section:hover {
        background: rgba(255, 255, 255, 0.12) !important;
    }

    .section h2 {
        color: #0a84ff !important;
    }

    .section p, .section ul li {
        color: rgba(245, 245, 247, 0.85) !important;
    }

    .section ul li::before {
        color: #0a84ff !important;
    }

    .warning-box {
        background: rgba(255, 69, 58, 0.12) !important;
        border-color: rgba(255, 69, 58, 0.3) !important;
    }

    .warning-box:hover {
        background: rgba(255, 69, 58, 0.18) !important;
    }

    .warning-box h3 {
        color: #ff453a !important;
    }

    .warning-box p {
        color: rgba(255, 69, 58, 0.95) !important;
    }

    .meta-info, .copyright-text {
        color: rgba(245, 245, 247, 0.6) !important;
    }

    .header, .footer {
        border-color: rgba(255, 255, 255, 0.1) !important;
    }

    .action-btn-primary {
        background: #0a84ff !important;
    }

    .action-btn-primary:hover {
        background: #409cff !important;
    }

    /* ==================== LOGIN DARK MODE ==================== */
    .login-card {
        background: linear-gradient(135deg, rgba(30, 30, 36, 0.75) 0%, rgba(18, 18, 22, 0.55) 100%) !important;
        border-color: rgba(255, 255, 255, 0.12) !important;
        box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5) !important;
    }

    .login-title, .input-label, .remember-text {
        color: #f5f5f7 !important;
    }

    .login-subtitle {
        color: rgba(245, 245, 247, 0.75) !important;
    }

    .custom-input {
        background: rgba(255, 255, 255, 0.08) !important;
        border-color: rgba(255, 255, 255, 0.15) !important;
        color: #f5f5f7 !important;
    }

    .custom-input:focus {
        background: rgba(255, 255, 255, 0.14) !important;
        border-color: #0a84ff !important;
        box-shadow: 0 0 0 4px rgba(10, 132, 255, 0.25) !important;
        color: #ffffff !important;
    }

    input:-webkit-autofill,
    input:-webkit-autofill:hover,
    input:-webkit-autofill:focus,
    input:-webkit-autofill:active {
        -webkit-text-fill-color: #f5f5f7 !important;
        -webkit-box-shadow: 0 0 0px 1000px #22222a inset !important;
        transition: background-color 5000s ease-in-out 0s;
    }

    .create-account-btn {
        background: rgba(255, 255, 255, 0.1) !important;
        border-color: rgba(255, 255, 255, 0.15) !important;
        color: #f5f5f7 !important;
    }

    .create-account-btn:hover {
        background: rgba(255, 255, 255, 0.2) !important;
    }

    .checkbox-box {
        background: rgba(255, 255, 255, 0.12) !important;
        border-color: rgba(255, 255, 255, 0.2) !important;
    }

    .custom-checkbox-input:checked + .checkbox-box {
        background: #0071e3 !important;
        border-color: #0071e3 !important;
    }

    .toggle-password {
        color: #0a84ff !important;
    }

    /* ==================== PANOU ADMIN DARK MODE ==================== */
    .glass-card {
        background: linear-gradient(135deg, rgba(30, 30, 36, 0.75) 0%, rgba(18, 18, 22, 0.55) 100%) !important;
        border-color: rgba(255, 255, 255, 0.12) !important;
        box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5) !important;
    }

    .glass-card p, .card-subtitle, .admin-subtext, .balance-title {
        color: rgba(245, 245, 247, 0.75) !important;
    }

    .card-title, .balance-amount {
        color: #f5f5f7 !important;
    }

    .card-sus-dreapta a, .card-sus-dreapta button {
        color: #f5f5f7 !important;
    }

    .action-btn {
        background: rgba(255, 255, 255, 0.1) !important;
        border-color: rgba(255, 255, 255, 0.15) !important;
        color: #f5f5f7 !important;
    }

    .action-btn:hover {
        background: rgba(255, 255, 255, 0.2) !important;
    }

    .admin-info-box {
        background: rgba(255, 255, 255, 0.08) !important;
        border-color: rgba(255, 255, 255, 0.12) !important;
        color: #f5f5f7 !important;
    }

    /* ==================== PANOU PROFESOR & MODALE DARK MODE ==================== */
    .stat-box {
        background: rgba(255, 255, 255, 0.08) !important;
        border-color: rgba(255, 255, 255, 0.12) !important;
    }

    .stat-label {
        color: rgba(245, 245, 247, 0.65) !important;
    }

    .btn-quick-adjust {
        background: rgba(255, 255, 255, 0.1) !important;
        border-color: rgba(255, 255, 255, 0.15) !important;
    }

    .btn-quick-adjust:hover {
        background: rgba(255, 255, 255, 0.2) !important;
    }

    .modal-card {
        background: linear-gradient(135deg, rgba(30, 30, 36, 0.92) 0%, rgba(18, 18, 22, 0.85) 100%) !important;
        border-color: rgba(255, 255, 255, 0.15) !important;
    }

    .modal-title {
        color: #f5f5f7 !important;
    }

    .modal-message, .modal-card p {
        color: rgba(245, 245, 247, 0.75) !important;
    }

    .modal-btn.cancel-btn {
        background: rgba(255, 255, 255, 0.12) !important;
        color: #f5f5f7 !important;
    }

    /* ==================== LOGS DARK MODE ==================== */
    .header, .table-container {
        background: linear-gradient(135deg, rgba(30, 30, 36, 0.75) 0%, rgba(18, 18, 22, 0.55) 100%) !important;
        border: 1px solid rgba(255, 255, 255, 0.12) !important;
        color: #f5f5f7 !important;
    }

    .header h2 {
        color: #f5f5f7 !important;
    }

    th {
        background: rgba(40, 40, 48, 0.8) !important;
        color: #f5f5f7 !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.14) !important;
    }

    td {
        border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
        color: #f5f5f7 !important;
    }

    .ua-text {
        color: rgba(245, 245, 247, 0.6) !important;
    }

    .stat-badge {
        background: rgba(32, 32, 38, 0.75) !important;
    }

    .badge-green {
        color: #30d158 !important;
        border-color: #30d158 !important;
    }

    .badge-yellow {
        color: #ffd60a !important;
        border-color: #ffd60a !important;
    }

    .badge-red {
        color: #ff453a !important;
        border-color: #ff453a !important;
    }

    tr.risk-green { background-color: rgba(48, 209, 88, 0.12) !important; }
    tr.risk-yellow { background-color: rgba(255, 214, 10, 0.15) !important; }
    tr.risk-red { background-color: rgba(255, 69, 58, 0.22) !important; }

    /* ==================== DARK MODE PERFORMANCE ==================== */
    html.perf-medium .main-card, body.perf-medium .main-card,
    html.perf-medium .side-btn, body.perf-medium .side-btn,
    html.perf-medium .card-sus-dreapta, body.perf-medium .card-sus-dreapta,
    html.perf-medium .wallet-banner, body.perf-medium .wallet-banner,
    html.perf-medium .convert-banner, body.perf-medium .convert-banner,
    html.perf-medium .chart-box, body.perf-medium .chart-box,
    html.perf-medium .trade-controls, body.perf-medium .trade-controls,
    html.perf-medium .investments-card-side, body.perf-medium .investments-card-side,
    html.perf-medium .feature-box, body.perf-medium .feature-box,
    html.perf-medium .admin-info-box, body.perf-medium .admin-info-box,
    html.perf-medium .glass-card, body.perf-medium .glass-card,
    html.perf-medium .modal-card, body.perf-medium .modal-card,
    html.perf-medium .inner-card-box, body.perf-medium .inner-card-box,
    html.perf-medium .login-card, body.perf-medium .login-card,
    html.perf-medium .header, body.perf-medium .header,
    html.perf-medium .table-container, body.perf-medium .table-container,
    html.perf-medium .stat-badge, body.perf-medium .stat-badge,
    html.perf-medium .category-card, body.perf-medium .category-card,
    html.perf-medium .section, body.perf-medium .section,
    html.perf-medium .warning-box, body.perf-medium .warning-box,
    html.perf-medium .chat-container, body.perf-medium .chat-container,
    html.perf-medium .message-box, body.perf-medium .message-box,
    html.perf-medium .chat-input-area, body.perf-medium .chat-input-area {
        backdrop-filter: blur(8px) !important;
        -webkit-backdrop-filter: blur(8px) !important;
        background: rgba(28, 28, 34, 0.85) !important;
    }

    html.perf-low .main-card, html.perf-low .side-btn, html.perf-low .card-sus-dreapta, 
    html.perf-low .wallet-banner, html.perf-low .convert-banner, html.perf-low .chart-box, 
    html.perf-low .trade-controls, html.perf-low .investments-card-side, 
    html.perf-low .inner-card-box, 
    body.perf-low .inner-card-box, 
    html.low-perf .inner-card-box, 
    body.low-perf .inner-card-box,
    html.perf-low .feature-box, html.perf-low .admin-info-box,
    html.perf-low .glass-card, html.perf-low .modal-card, html.perf-low .login-card, html.perf-low .header, 
    html.perf-low .table-container, html.perf-low .stat-badge, html.perf-low .category-card,
    html.perf-low .section, html.perf-low .warning-box, html.perf-low .chat-container, html.perf-low .chat-input-area,
    html.low-perf .main-card, html.low-perf .side-btn, html.low-perf .card-sus-dreapta, 
    html.low-perf .wallet-banner, html.low-perf .convert-banner, html.low-perf .chart-box,
    html.low-perf .trade-controls, html.low-perf .investments-card-side,
    html.low-perf .feature-box, html.low-perf .admin-info-box,
    html.low-perf .glass-card, html.low-perf .modal-card, html.low-perf .login-card, html.low-perf .header, 
    html.low-perf .table-container, html.low-perf .stat-badge, html.low-perf .category-card,
    html.low-perf .section, html.low-perf .warning-box, html.low-perf .chat-container, html.low-perf .chat-input-area,
    body.perf-low .main-card, body.perf-low .side-btn, body.perf-low .card-sus-dreapta,
    body.perf-low .wallet-banner, body.perf-low .convert-banner, body.perf-low .chart-box,
    body.perf-low .trade-controls, body.perf-low .investments-card-side,
    body.perf-low .feature-box, body.perf-low .admin-info-box,
    body.perf-low .glass-card, body.perf-low .modal-card, body.perf-low .login-card,
    body.perf-low .header, body.perf-low .table-container, body.perf-low .stat-badge, body.perf-low .category-card,
    body.perf-low .section, body.perf-low .warning-box, body.perf-low .chat-container, body.perf-low .chat-input-area,
    body.low-perf .main-card, body.low-perf .side-btn, body.low-perf .card-sus-dreapta,
    body.low-perf .wallet-banner, body.low-perf .convert-banner, body.low-perf .chart-box,
    body.low-perf .trade-controls, body.low-perf .investments-card-side,
    body.low-perf .feature-box, body.low-perf .admin-info-box,
    body.low-perf .header, body.low-perf .table-container, body.low-perf .stat-badge, body.low-perf .category-card,
    body.low-perf .section, body.low-perf .warning-box, body.low-perf .chat-container, body.low-perf .chat-input-area {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: rgba(20, 20, 24, 0.95) !important;
        border-color: rgba(255, 255, 255, 0.1) !important;
    }

    html.perf-low .message-wrapper.other .message-box, 
    html.low-perf .message-wrapper.other .message-box,
    body.perf-low .message-wrapper.other .message-box, 
    body.low-perf .message-wrapper.other .message-box {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: #1c1c24 !important;
    }
    
    #preloader { background: #0a0a0c; }
    .spinner {
        border-color: rgba(10, 132, 255, 0.15);
        border-top-color: #0a84ff;
        border-right-color: rgba(10, 132, 255, 0.85);
        box-shadow: 0 0 14px rgba(10, 132, 255, 0.2);
    }

    html.perf-low .custom-input, html.low-perf .custom-input,
    body.perf-low .custom-input, body.low-perf .custom-input {
        transition: none !important;
    }

    .stat-box,
    .btn-quick-adjust,
    html.perf-low .stat-box, html.perf-low .btn-quick-adjust,
    html.low-perf .stat-box, html.low-perf .btn-quick-adjust,
    body.perf-low .stat-box, body.perf-low .btn-quick-adjust,
    body.low-perf .stat-box, body.low-perf .btn-quick-adjust {
        background: rgba(255, 255, 255, 0.08) !important;
        border: 1px solid rgba(255, 255, 255, 0.12) !important;
    }
    .btn-quick-adjust { color: #0a84ff !important; }
    .btn-quick-adjust.vip { color: #bf5af2 !important; }
    .btn-quick-adjust.minus { color: #ff453a !important; }

    /* Efect de hover pe Dark Mode (doar când nu e pe Low Perf) */
    html:not(.perf-low):not(.low-perf) .btn-quick-adjust:hover {
        background: rgba(255, 255, 255, 0.15) !important;
    }

    /* Dropdown solid pe Low Perf (Dark Mode) */
    html.perf-low .card-sus-dreapta, 
    html.low-perf .card-sus-dreapta,
    body.perf-low .card-sus-dreapta, 
    body.low-perf .card-sus-dreapta {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: #1c1c22 !important;
        border: 1px solid rgba(255, 255, 255, 0.15) !important;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5) !important;
    }
}

/* ==========================================================================
   IMPLEMENTARE ADĂUGATĂ: HAMBURGER & MENIU DROPDOWN (LIGHT & DARK + 3 MODURI PERFORMANȚĂ)
   ========================================================================== */

/* 1. STILURI BAZĂ (LIGHT MODE - HIGH PERF) */
.hamburger-btn {
    position: fixed;
    top: 14px;
    right: 14px;
    z-index: 1001;
    width: 32px;
    height: 32px;
    padding: 0;
    background: var(--card-bg, rgba(255, 255, 255, 0.65)) !important;
    backdrop-filter: blur(var(--blur-val, 25px)) saturate(200%);
    -webkit-backdrop-filter: blur(var(--blur-val, 25px)) saturate(200%);
    border: 1px solid var(--card-border, rgba(255, 255, 255, 0.85));
    border-radius: 10px;
    box-shadow: var(--shadow-color, 0 12px 32px -8px rgba(0, 0, 0, 0.12)), var(--glass-inset-glow, inset 0 1px 1px rgba(255, 255, 255, 0.8));
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
    overflow: visible !important;
}

.hamburger-btn:hover {
    transform: scale(1.06);
    background: rgba(255, 255, 255, 0.75) !important;
}

.hamburger-btn span {
    width: 16px;
    height: 2px;
    background-color: var(--text-color, #1d1d1f);
    border-radius: 2px;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    transform-origin: center;
}

.hamburger-btn.active span:nth-child(1) {
    transform: translateY(6px) rotate(45deg);
}

.hamburger-btn.active span:nth-child(2) {
    opacity: 0;
    transform: scaleX(0);
}

.hamburger-btn.active span:nth-child(3) {
    transform: translateY(-6px) rotate(-45deg);
}

/* Bulina roșie pe colțul hamburger-ului */
.hamburger-btn .notification-dot {
    position: absolute !important;
    top: -4px !important;
    right: -4px !important;
    width: 12px !important;
    height: 12px !important;
    background-color: #ff3b30 !important;
    border-radius: 50% !important;
    border: none !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    display: none;
    z-index: 20;
}

.card-sus-dreapta { 
    display: none;
    position: fixed; 
    top: 52px; 
    right: 14px; 
    padding: 8px; 
    background: var(--card-bg, rgba(255, 255, 255, 0.65)) !important; 
    backdrop-filter: blur(var(--blur-val, 30px)) saturate(200%); 
    -webkit-backdrop-filter: blur(var(--blur-val, 30px)) saturate(200%); 
    border-radius: 16px; 
    border: 1px solid var(--card-border, rgba(255, 255, 255, 0.85)); 
    box-shadow: var(--shadow-color, 0 12px 32px -8px rgba(0, 0, 0, 0.12)), var(--glass-inset-glow, inset 0 1px 1px rgba(255, 255, 255, 0.8));
    z-index: 1000; 
    flex-direction: column; 
    gap: 6px; 
    min-width: 150px;
}

.card-sus-dreapta.show {
    display: flex;
    animation: iosEntrance 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.card-sus-dreapta a, .card-sus-dreapta button { 
    color: var(--top-nav-text, #1d1d1f) !important; 
    text-decoration: none; 
    font-size: 13px; 
    font-weight: 600; 
    padding: 8px 12px; 
    border-radius: 10px; 
    border: none; 
    background: transparent; 
    cursor: pointer; 
    transition: background-color 0.2s ease, transform 0.3s ease; 
    white-space: nowrap; 
    text-align: left;
    width: 100%;
}

.card-sus-dreapta a:hover, .card-sus-dreapta button:hover { 
    background: var(--top-nav-border, rgba(0, 0, 0, 0.08)); 
}

/* Caseta de notificări în dropdown */
.menu-notifications-card {
    padding: 8px;
    background: rgba(255, 255, 255, 0.6);
    border: 1px solid rgba(0, 0, 0, 0.04);
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.menu-notif-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
    font-weight: 700;
    color: #1d1d1f;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    padding-bottom: 3px;
}

.notif-badge-count {
    background-color: #ff3b30;
    color: white;
    font-size: 10px;
    font-weight: 700;
    padding: 1px 5px;
    border-radius: 8px;
}

.menu-notif-list {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.menu-notif-item {
    display: block;
    padding: 5px 6px;
    border-radius: 6px;
    font-size: 11px;
    color: #1d1d1f;
    text-decoration: none;
    background: rgba(255, 255, 255, 0.8);
    transition: background 0.15s ease;
}

.menu-notif-item:hover {
    background: rgba(0, 122, 255, 0.12);
}

.menu-notif-empty {
    font-size: 11px;
    color: rgba(29, 29, 31, 0.6);
    text-align: center;
    padding: 4px 0;
}

.menu-notif-time {
    display: block;
    font-size: 9.5px;
    color: rgba(29, 29, 31, 0.5);
    margin-top: 1px;
}

/* 2. MODURI PERFORMANȚĂ PE LIGHT MODE */
html.perf-medium .hamburger-btn, body.perf-medium .hamburger-btn {
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    background: rgba(255, 255, 255, 0.85) !important;
}

html.perf-low .hamburger-btn, html.low-perf .hamburger-btn,
body.perf-low .hamburger-btn, body.low-perf .hamburger-btn {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: #ffffff !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
}

/* 3. STILURI DARK MODE & MODURI PERFORMANȚĂ DARK MODE */
@media (prefers-color-scheme: dark) {
    .hamburger-btn {
        background: rgba(30, 30, 36, 0.65) !important;
        border-color: rgba(255, 255, 255, 0.18) !important;
        box-shadow: 0 16px 36px -8px rgba(0, 0, 0, 0.5), inset 0 1px 1px rgba(255, 255, 255, 0.15) !important;
    }
    
    .hamburger-btn:hover {
        background: rgba(45, 45, 55, 0.8) !important;
    }

    .hamburger-btn span {
        background-color: #f5f5f7 !important;
    }

    .card-sus-dreapta {
        background: rgba(30, 30, 36, 0.65) !important;
        border-color: rgba(255, 255, 255, 0.18) !important;
        box-shadow: 0 16px 36px -8px rgba(0, 0, 0, 0.5), inset 0 1px 1px rgba(255, 255, 255, 0.15) !important;
    }

    .card-sus-dreapta a, .card-sus-dreapta button {
        color: #f5f5f7 !important;
    }

    .card-sus-dreapta a:hover, .card-sus-dreapta button:hover {
        background: rgba(255, 255, 255, 0.15) !important;
    }

    /* Adaptare Dark Mode pentru cardul de notificări */
    .menu-notifications-card {
        background: rgba(255, 255, 255, 0.05);
        border-color: rgba(255, 255, 255, 0.08);
    }
    .menu-notif-header { color: #f5f5f7; border-bottom-color: rgba(255, 255, 255, 0.1); }
    .menu-notif-item {
        background: rgba(255, 255, 255, 0.08);
        color: #f5f5f7;
    }
    .menu-notif-item:hover { background: rgba(10, 132, 255, 0.25); }
    .menu-notif-empty, .menu-notif-time { color: rgba(245, 245, 247, 0.5); }

    html.perf-medium .hamburger-btn, body.perf-medium .hamburger-btn {
        backdrop-filter: blur(8px) !important;
        -webkit-backdrop-filter: blur(8px) !important;
        background: rgba(28, 28, 34, 0.85) !important;
    }

    html.perf-low .hamburger-btn, html.low-perf .hamburger-btn,
    body.perf-low .hamburger-btn, body.low-perf .hamburger-btn {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: rgba(20, 20, 24, 0.95) !important;
        border-color: rgba(255, 255, 255, 0.1) !important;
    }
}

/* ==================== ANIMAȚII MENIU DROPDOWN (GLOBAL) ==================== */
@keyframes iosEntrance {
    0% { opacity: 0; transform: translate3d(0, -10px, 0) scale(0.95); }
    100% { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}

@keyframes iosExit {
    0% { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
    100% { opacity: 0; transform: translate3d(0, -10px, 0) scale(0.95); }
}

.card-sus-dreapta.show {
    display: flex;
    animation: iosEntrance 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.card-sus-dreapta.closing {
    display: flex !important;
    animation: iosExit 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}