html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
  background: var(--bg-gradient, var(--bg-primary));
  color: var(--text-primary);
  transition: background-color var(--transition-speed, 0.25s) ease, color var(--transition-speed, 0.25s) ease, background-image var(--transition-speed, 0.25s) ease;
}

/* Base Theme Elements */
.card, .panel, .surface, .modal-content, .dropdown-menu {
  background: var(--bg-surface-gradient, var(--bg-secondary));
  border: 1px solid var(--border-color);
  box-shadow: var(--shadow-sm);
  transition: transform var(--transition-speed, 0.25s) cubic-bezier(0.4, 0, 0.2, 1), box-shadow var(--transition-speed, 0.25s) cubic-bezier(0.4, 0, 0.2, 1), background-color var(--transition-speed, 0.25s) ease;
}

.card:hover, .panel:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md, var(--shadow-glow));
}

.nav-tabs .nav-link, .nav-pills .nav-link, .dropdown-item {
  transition: all var(--transition-speed, 0.25s) cubic-bezier(0.4, 0, 0.2, 1);
  color: var(--text-secondary);
}

.nav-tabs .nav-link:hover, .nav-pills .nav-link:hover, .dropdown-item:hover {
  background-color: var(--bg-tertiary);
  color: var(--text-primary);
  border-radius: var(--radius-sm, 0.25rem);
}

.badge {
  box-shadow: var(--shadow-sm);
  backdrop-filter: blur(4px);
  transition: transform var(--transition-speed, 0.25s) cubic-bezier(0.4, 0, 0.2, 1), box-shadow var(--transition-speed, 0.25s) cubic-bezier(0.4, 0, 0.2, 1);
}

.badge:hover {
  transform: scale(1.05);
  box-shadow: var(--shadow-md);
}

.btn {
  transition: all var(--transition-speed, 0.25s) cubic-bezier(0.4, 0, 0.2, 1);
}

.btn:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-sm);
}

.form-control, .form-select {
  background-color: var(--input-bg, #0f172a) !important;
  color: var(--input-text, #f8fafc) !important;
  border-color: var(--border-subtle, rgba(255,255,255,0.1)) !important;
  transition: border-color var(--transition-speed, 0.25s) ease, box-shadow var(--transition-speed, 0.25s) ease, background-color var(--transition-speed, 0.25s) ease;
}

.form-control:focus, .form-select:focus {
  background-color: var(--input-bg, #0f172a) !important;
  color: var(--input-text, #f8fafc) !important;
  border-color: var(--color-primary, #00d2ff) !important;
  box-shadow: 0 0 0 0.25rem rgba(0, 210, 255, 0.25) !important;
}

/* Bot Pages Switch Colors */
#strategy-spa-container .form-check-input:checked {
    background-color: #198754 !important;
    border-color: #198754 !important;
}
#strategy-spa-container .form-check-input:not(:checked) {
    background-color: #fd7e14 !important;
    border-color: #fd7e14 !important;
}
/* UI Agent Contrast Fix */
[data-theme='dark'] { --text-secondary: #CCCCCC !important; --text-tertiary: #B0B0B0 !important; }

/* Global Page Transition */
#global-page-transition { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(2, 6, 23, 0.95); backdrop-filter: blur(25px); z-index: 99999; display: flex; justify-content: center; align-items: center; opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0.3s ease; }
#global-page-transition.active { opacity: 1; visibility: visible; }
.transition-spinner-container { position: relative; width: 120px; height: 120px; display: flex; justify-content: center; align-items: center; }
.transition-logo { width: 60px; height: auto; animation: pulse-glow 2s infinite ease-in-out; position: absolute; z-index: 2; }
.transition-ring { position: absolute; width: 100%; height: 100%; border-radius: 50%; border: 3px solid transparent; border-top-color: #0ea5e9; border-bottom-color: #2563eb; animation: spin-ring 1.5s linear infinite; z-index: 1; }
@keyframes spin-ring { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
@keyframes pulse-glow { 0%, 100% { transform: scale(1); filter: drop-shadow(0 0 10px rgba(14, 165, 233, 0.4)); opacity: 0.8; } 50% { transform: scale(1.1); filter: drop-shadow(0 0 25px rgba(14, 165, 233, 0.8)); opacity: 1; } }

/* Bot Specific Animations */
#bot-transition-overlay { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(2, 6, 23, 0.95); backdrop-filter: blur(25px); z-index: 99999; display: flex; justify-content: center; align-items: center; opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0.3s ease; flex-direction: column; }
#bot-transition-overlay.active { opacity: 1; visibility: visible; }
.anim-text { color: #0ea5e9; margin-top: 20px; font-family: 'JetBrains Mono', monospace; font-size: 1.2rem; letter-spacing: 2px; text-transform: uppercase; animation: pulse-glow 2s infinite; }
/* Flow Anim */
.anim-flow { display: flex; align-items: center; gap: 10px; }
.anim-flow .node { width: 20px; height: 20px; border-radius: 50%; background: #0ea5e9; box-shadow: 0 0 15px #0ea5e9; animation: node-pulse 1.5s infinite alternate; }
.anim-flow .edge { width: 40px; height: 4px; background: rgba(14, 165, 233, 0.3); position: relative; overflow: hidden; }
.anim-flow .edge::after { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: #0ea5e9; animation: edge-flow 1.5s infinite linear; }
@keyframes node-pulse { 0% { transform: scale(0.8); opacity: 0.5; } 100% { transform: scale(1.2); opacity: 1; } }
@keyframes edge-flow { 0% { left: -100%; } 100% { left: 100%; } }
/* Range Anim */
.anim-range { position: relative; width: 80px; height: 100px; }
.range-line { width: 100%; height: 4px; background: #fbbf24; position: absolute; box-shadow: 0 0 10px #fbbf24; }
.range-line.top { top: 0; }
.range-line.bottom { bottom: 0; }
.range-ball { width: 20px; height: 20px; background: #10b981; border-radius: 50%; position: absolute; left: 30px; animation: range-bounce 1s infinite alternate ease-in-out; box-shadow: 0 0 15px #10b981; }
@keyframes range-bounce { 0% { top: 10px; } 100% { top: 70px; } }
/* Trend Anim */
.anim-trend { position: relative; width: 100px; height: 100px; overflow: hidden; }
.trend-line { width: 100%; height: 4px; background: #ef4444; position: absolute; top: 30px; box-shadow: 0 0 15px #ef4444; }
.trend-arrow { width: 0; height: 0; border-left: 15px solid transparent; border-right: 15px solid transparent; border-bottom: 25px solid #10b981; position: absolute; bottom: 0; left: 35px; filter: drop-shadow(0 0 10px #10b981); animation: trend-break 1.5s infinite ease-in; }
@keyframes trend-break { 0% { bottom: -30px; opacity: 0; } 50% { bottom: 10px; opacity: 1; } 100% { bottom: 60px; opacity: 0; transform: scale(1.5); filter: drop-shadow(0 0 20px #10b981); } }

/* Clean Anim Text */
.anim-text { color: #0ea5e9; margin-top: 20px; font-family: 'JetBrains Mono', monospace; font-size: 1.2rem; letter-spacing: 2px; text-transform: uppercase; animation: pulse-text-glow 2s infinite; text-shadow: 0 0 10px rgba(14, 165, 233, 0.5); }
@keyframes pulse-text-glow { 0%, 100% { opacity: 0.7; } 50% { opacity: 1; text-shadow: 0 0 20px rgba(14, 165, 233, 1); } }
.pure-spinner { width: 50px; height: 50px; border: 3px solid rgba(14, 165, 233, 0.2); border-radius: 50%; border-top-color: #0ea5e9; animation: spin 1s ease-in-out infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* Global Theme Contrast Fixes */
[data-theme='dark'] .text-muted { color: #94a3b8 !important; opacity: 1 !important; }
[data-theme='dark'] .text-white-50 { color: #cbd5e1 !important; opacity: 1 !important; }
[data-theme='dark'] p { color: #cbd5e1; }
[data-theme='dark'] .form-control { background-color: #0f172a !important; color: #f8fafc !important; border-color: #334155 !important; }
[data-theme='dark'] .form-select { background-color: #0f172a !important; color: #f8fafc !important; border-color: #334155 !important; }
[data-theme='dark'] label { color: #e2e8f0 !important; font-weight: 500; }

[data-theme='light'] .text-muted,
[data-theme='light'] .text-secondary,
[data-theme='light'] .text-white-50,
[data-theme='light'] .theme-text-muted {
    color: var(--text-muted, #6c757d) !important;
    opacity: 1 !important;
}

[data-theme='light'] p,
[data-theme='light'] label {
    color: var(--text-body, var(--text-primary, #3b424a));
}

[data-theme='light'] .btn-close-theme,
[data-theme='light'] .btn-close-white {
    filter: none !important;
}

[data-theme='dark'] .btn-close-theme {
    filter: invert(1) grayscale(100%) brightness(200%);
}

.code-surface {
    background-color: var(--input-bg) !important;
    color: var(--input-text) !important;
    border: 1px solid var(--border-subtle) !important;
}

.code-surface code,
.code-surface pre {
    color: inherit !important;
}

.border-white-05 {
    border-color: var(--border-subtle) !important;
}

.bg-white-02 {
    background-color: var(--surface-muted) !important;
}

.theme-text-strong-20 {
    color: var(--text-muted) !important;
    opacity: 0.55;
}

/* --- MASSIVE PREMIUM UX/UI OVERHAUL (APPLIED GLOBALLY) --- */

/* 1. Custom Webkit Scrollbar for Premium Feel */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: rgba(15, 23, 42, 0.5); }
::-webkit-scrollbar-thumb { background: rgba(148, 163, 184, 0.3); border-radius: 4px; transition: background 0.3s; }
::-webkit-scrollbar-thumb:hover { background: rgba(148, 163, 184, 0.6); }

/* 2. Glassmorphism & Advanced Cards (Affects 90+ pages) */
[data-theme='dark'] .modal-content {
    background: #1e293b !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
    border-radius: 12px !important;
}
[data-theme='dark'] .card, [data-theme='dark'] .borsa-card, [data-theme='dark'] .glass-panel {
    background: linear-gradient(145deg, rgba(30, 41, 59, 0.4), rgba(15, 23, 42, 0.6)) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important;
    border-radius: 12px !important;
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.3s ease, border-color 0.3s ease !important;
}
[data-theme='dark'] .card:hover, [data-theme='dark'] .borsa-card:hover {
    transform: translateY(-5px) !important;
    border-color: rgba(2, 132, 199, 0.3) !important;
    box-shadow: 0 12px 30px rgba(2, 132, 199, 0.15) !important;
}

[data-theme='light'] .modal-content {
    background: var(--surface-card, #ffffff) !important;
    color: var(--text-body, #3b424a) !important;
    border: 1px solid var(--border-subtle, rgba(26, 29, 32, 0.1)) !important;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.12) !important;
    border-radius: 12px !important;
}

[data-theme='light'] .card,
[data-theme='light'] .borsa-card,
[data-theme='light'] .glass-panel {
    background: var(--surface-card, #ffffff) !important;
    color: var(--text-body, #3b424a) !important;
    border: 1px solid var(--border-subtle, rgba(26, 29, 32, 0.1)) !important;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08) !important;
    border-radius: 12px !important;
}

/* 3. Global Button Glow Effects */
.btn { transition: all 0.3s ease !important; border-radius: 8px !important; }
.btn-primary { background: linear-gradient(135deg, #0284c7, #38bdf8) !important; border: none !important; }
.btn-primary:hover { box-shadow: 0 4px 20px rgba(2, 132, 199, 0.4) !important; transform: translateY(-2px) !important; }
.btn-success { background: linear-gradient(135deg, #059669, #10b981) !important; border: none !important; }
.btn-success:hover { box-shadow: 0 4px 20px rgba(16, 185, 129, 0.4) !important; transform: translateY(-2px) !important; }
.btn-danger { background: linear-gradient(135deg, #e11d48, #f43f5e) !important; border: none !important; }
.btn-danger:hover { box-shadow: 0 4px 20px rgba(225, 29, 72, 0.4) !important; transform: translateY(-2px) !important; }

/* 4. Table UI Enhancements (Positions, SmartTrade) */
.table { 
    --bs-table-bg: transparent !important;
    --bs-table-color: var(--theme-text, #cbd5e1) !important;
    color: var(--theme-text, #cbd5e1) !important; 
    background-color: transparent !important;
}
.table > :not(caption) > * > * {
    background-color: transparent !important;
    color: var(--theme-text, #cbd5e1) !important;
}
.table tbody tr { transition: background 0.2s ease, transform 0.2s ease; border-bottom: 1px solid var(--border-subtle); background-color: transparent !important; }
.table tbody tr:hover { background-color: var(--surface-muted) !important; transform: scale(1.005); }
.table td, .table th { padding: 1rem 0.75rem !important; vertical-align: middle !important; border-color: transparent !important; background-color: transparent !important; color: var(--theme-text, #cbd5e1) !important; }
.table thead th { background-color: var(--surface-card) !important; color: var(--theme-text-muted, var(--text-subtle)) !important; font-weight: 600 !important; text-transform: uppercase; font-size: 0.75rem; letter-spacing: 0.5px; border-bottom: 1px solid var(--border-subtle) !important; }

/* 5. Inputs and Forms (Settings, Login, Builders) */
[data-theme='dark'] .form-control, [data-theme='dark'] .form-select {
    background: rgba(15, 23, 42, 0.5) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 8px !important;
    color: #f8fafc !important;
    padding: 0.75rem 1rem !important;
    transition: all 0.3s ease !important;
}
[data-theme='dark'] .form-control:focus, [data-theme='dark'] .form-select:focus {
    background: rgba(15, 23, 42, 0.8) !important;
    border-color: #38bdf8 !important;
    box-shadow: 0 0 0 4px rgba(56, 189, 248, 0.15) !important;
}

[data-theme='light'] .form-control,
[data-theme='light'] .form-select {
    background: var(--input-bg, #ffffff) !important;
    border: 1px solid var(--border-subtle, rgba(26, 29, 32, 0.14)) !important;
    border-radius: 8px !important;
    color: var(--input-text, #1a1d20) !important;
    padding: 0.75rem 1rem !important;
}

[data-theme='light'] .form-control:focus,
[data-theme='light'] .form-select:focus {
    background: #ffffff !important;
    border-color: var(--theme-color, #4f46e5) !important;
    box-shadow: 0 0 0 4px rgba(var(--theme-color-rgb, 79, 70, 229), 0.14) !important;
}

[data-theme='light'] .form-control::placeholder {
    color: var(--input-placeholder, #8b95a1) !important;
    opacity: 1;
}

/* 6. Typography & Text Hierarchy Fixes */
[data-theme='dark'] .text-muted, [data-theme='dark'] .text-secondary { color: #94a3b8 !important; }
h1, h2, h3, h4, h5, h6 { font-weight: 700 !important; letter-spacing: -0.5px; }

/* 7. Modal Enhancements */
.modal-backdrop { background-color: rgba(2, 6, 23, 0.85) !important; backdrop-filter: blur(4px); }
[data-theme='dark'] .modal-header { border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important; }
[data-theme='dark'] .modal-footer { border-top: 1px solid rgba(255, 255, 255, 0.05) !important; }
[data-theme='light'] .modal-header { border-bottom: 1px solid var(--border-subtle, rgba(26, 29, 32, 0.1)) !important; }
[data-theme='light'] .modal-footer { border-top: 1px solid var(--border-subtle, rgba(26, 29, 32, 0.1)) !important; }


/* Fix SweetAlert z-index behind modals */
.swal2-container { z-index: 106000 !important; }