/* Simple Chart Fix - Clean solution for label and baseline issues */

/* Bar charts specific styling */
.mud-chart-bar rect {
    /* Ensure bars start from baseline */
    transform-origin: bottom;
}

/* Prevent negative values in all chart types */
.mud-chart-serie {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

/* Line and area charts - prevent going below baseline */
.mud-chart-line path,
.mud-chart-area path {
    clip-path: inset(-10px -10px 0 -10px);
}

/* Ensure X-axis labels are visible and properly positioned */
.mud-chart-xaxis text {
    font-size: 10px !important;
    fill: #666 !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Add padding to chart container for rotated labels */
.mud-chart {
    padding-bottom: 60px !important;
}

/* Ensure SVG doesn't cut off rotated labels */
.mud-chart svg {
    overflow: visible !important;
    margin-bottom: 40px !important;
}

/* Rotate labels for all charts to prevent overlap */
.mud-chart-xaxis text {
    transform-origin: center !important;
    transform: rotate(-45deg) !important;
    text-anchor: end !important;
}

/* For specific chart types with many labels, keep rotation */
.daily-chart .mud-chart-xaxis text,
.hourly-chart .mud-chart-xaxis text {
    transform: rotate(-45deg) !important;
    text-anchor: end !important;
}

/* Monthly charts also use rotation for consistency */
.monthly-chart .mud-chart-xaxis text {
    transform: rotate(-45deg) !important;
    text-anchor: end !important;
}

/* With rotation, we can show more labels without overlap */
.mud-chart-xaxis text {
    display: block !important;
}

/* For daily charts with 30+ labels, show every 3rd label */
.daily-chart .mud-chart-xaxis text {
    display: none;
}

.daily-chart .mud-chart-xaxis text:first-child,
.daily-chart .mud-chart-xaxis text:last-child,
.daily-chart .mud-chart-xaxis text:nth-child(3n) {
    display: block !important;
}

/* For charts with many data points (>20), show every other label */
.enhanced-chart-container .mud-chart-xaxis text:nth-child(2n+1) {
    display: block !important;
}

/* Ensure chart content doesn't overlap with labels */
.enhanced-chart-container {
    padding-bottom: 20px !important;
}

/* Reset any previous fixes that might be causing issues */
.mud-chart-serie,
.mud-chart-line,
.mud-chart-bar,
.mud-chart-area,
.mud-chart path,
.mud-chart line,
.mud-chart rect {
    clip-path: none !important;
}

.mud-chart-xaxis {
    position: static !important;
    height: auto !important;
    background: none !important;
    z-index: auto !important;
    padding-top: 0 !important;
    transform: none !important;
    margin-top: 0 !important;
}