.card {
    transition: box-shadow 0.2s ease;
}
.card:hover {
    box-shadow: 0 0 12px rgba(55, 90, 127, 0.3);
}

.js-plotly-plot .plotly .modebar {
    top: 4px !important;
    right: 4px !important;
}

.offcanvas {
    background-color: #303030 !important;
    color: #e0e0e0 !important;
}
.offcanvas-header .btn-close {
    filter: invert(1);
}

.dash-dropdown-value,
.dash-dropdown-value-item,
.dash-dropdown-trigger {
    color: #000 !important;
}

body {
    overflow-y: auto;
}

.dash-table-container .dash-spreadsheet-container {
    border-radius: 4px;
    overflow: hidden;
}

@media (max-width: 768px) {
    #sidebar {
        position: relative !important;
        height: auto !important;
        margin-bottom: 1rem;
    }
}