/* Custom styles for Stanks financial app - Dark Mode */

/* Dark mode base styling */
:root {
    --bs-dark: #212529;
    --bs-dark-rgb: 33, 37, 41;
    --financial-dark-bg: #1a1d23;
    --financial-card-bg: #2d3748;
    --financial-border: #4a5568;
}

body[data-bs-theme="dark"] {
    background-color: var(--financial-dark-bg) !important;
    color: #e2e8f0 !important;
}

/* Navigation enhancements */
.navbar-brand {
    font-size: 1.5rem;
    letter-spacing: -0.5px;
}

.navbar-nav .nav-link {
    font-weight: 500;
    padding: 0.5rem 1rem !important;
    transition: all 0.2s ease;
    color: #e2e8f0 !important;
}

.navbar-nav .nav-link:hover {
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 0.375rem;
    color: #ffffff !important;
}

.navbar-nav .nav-link i {
    margin-right: 0.5rem;
    width: 1rem;
    text-align: center;
}

/* Dark mode card styling */
.card {
    background-color: var(--financial-card-bg) !important;
    border: 1px solid var(--financial-border) !important;
    color: #e2e8f0 !important;
}

.card-header {
    background-color: rgba(0, 0, 0, 0.2) !important;
    border-bottom: 1px solid var(--financial-border) !important;
    color: #ffffff !important;
}

/* Dark mode table styling */
.table-dark {
    --bs-table-bg: var(--financial-card-bg);
    --bs-table-border-color: var(--financial-border);
    color: #e2e8f0;
}

.table {
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--financial-border);
    color: #e2e8f0;
}

.table > :not(caption) > * > * {
    border-bottom-color: var(--financial-border);
}

/* Preserve existing spacing utilities */
.cell-space-left {
    padding-left: 3rem !important;
}

.cell-space-left-sm {
    padding-left: 1rem !important;
}

/* Financial app specific styles - Enhanced for dark mode */
.profit {
    color: #68d391 !important; /* Brighter green for dark mode */
}

.loss {
    color: #fc8181 !important; /* Softer red for dark mode */
}

.neutral {
    color: #a0aec0 !important; /* Better gray for dark mode */
}

/* Card enhancements for financial data - Dark mode */
.card-financial {
    border-left: 4px solid #4299e1;
    background-color: var(--financial-card-bg) !important;
}

.card-profit {
    border-left: 4px solid #68d391;
    background-color: rgba(104, 211, 145, 0.1) !important;
}

.card-loss {
    border-left: 4px solid #fc8181;
    background-color: rgba(252, 129, 129, 0.1) !important;
}

/* Table enhancements - Dark mode */
.table-financial {
    font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;
    background-color: var(--financial-card-bg) !important;
}

.table-financial td {
    font-size: 0.875rem;
    border-color: var(--financial-border) !important;
}

/* Chart container styling - Dark mode */
.chart-container {
    background: var(--financial-card-bg);
    border: 1px solid var(--financial-border);
    border-radius: 0.375rem;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.3);
    padding: 1rem;
    margin-bottom: 1rem;
}

/* Button styling for dark mode */
.btn-outline-primary {
    border-color: #4299e1;
    color: #4299e1;
}

.btn-outline-primary:hover {
    background-color: #4299e1;
    border-color: #4299e1;
}

.btn-outline-success {
    border-color: #68d391;
    color: #68d391;
}

.btn-outline-success:hover {
    background-color: #68d391;
    border-color: #68d391;
    color: #1a202c;
}

.btn-outline-info {
    border-color: #63b3ed;
    color: #63b3ed;
}

.btn-outline-info:hover {
    background-color: #63b3ed;
    border-color: #63b3ed;
    color: #1a202c;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .table-financial {
        font-size: 0.75rem;
    }
    
    .card {
        margin-bottom: 1rem;
    }
}

/* Financial app specific styles */
.profit {
    color: #198754 !important; /* Bootstrap success green */
}

.loss {
    color: #dc3545 !important; /* Bootstrap danger red */
}

.neutral {
    color: #6c757d !important; /* Bootstrap secondary gray */
}

/* Card enhancements for financial data */
.card-financial {
    border-left: 4px solid #0d6efd;
}

.card-profit {
    border-left: 4px solid #198754;
}

.card-loss {
    border-left: 4px solid #dc3545;
}

/* Table enhancements */
.table-financial {
    font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;
}

.table-financial td {
    font-size: 0.875rem;
}

/* Chart container styling */
.chart-container {
    background: white;
    border-radius: 0.375rem;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    padding: 1rem;
    margin-bottom: 1rem;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .table-financial {
        font-size: 0.75rem;
    }
    
    .card {
        margin-bottom: 1rem;
    }
}

.text-success {
    color: #40c057 !important;
}

.text-danger {
    color: #ff2222 !important;
}