/* Layout Centering and Symmetry Fixes */

/* Center the entire app container */
.app-container {
    margin: 0 auto !important;
    width: 100%;
}

/* Ensure main-content uses balanced and symmetric columns */
.main-content {
    margin: 0 auto !important;
    width: 100%;
    padding: 20px;
    display: flex !important;
    justify-content: space-between;
    gap: 20px;
}

.left-panel,
.right-panel {
    width: 325px !important;
    flex-shrink: 0;
}

.center-panel {
    flex-grow: 1;
    min-width: 0;
    /* Allow shrinking */
}

/* Ensure proper chart container sizing */
.chart-container {
    min-width: 0;
    /* Allow flexbox to shrink */
}

.chart-placeholder {
    min-width: 0;
    /* Allow flexbox to shrink */
}