/* Parliament Chart Styles */
.parliament-chart-container {
    margin: 2rem 0;
    padding: 1rem;
    border-radius: 0.5rem;
    background-color: #fafafa;
    border: 1px solid var(--bs-border-color);
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    position: relative;
    transition: background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.parliament-chart-container.theme-transition {
    transition: all 0.3s ease;
}

.parliament-chart {
    width: 100%;
    min-height: 300px;
    transition: opacity 0.2s ease;
}

/* Highcharts specific theme transitions */
.parliament-chart .highcharts-container {
    transition: background-color 0.3s ease;
}

.parliament-chart .highcharts-background {
    transition: fill 0.3s ease;
}

/* Light mode background - white */
[data-bs-theme="light"] .parliament-chart .highcharts-background {
    fill: #ffffff !important;
}

/* Dark mode background - keep theme default */
[data-bs-theme="dark"] .parliament-chart .highcharts-background {
    fill: #1f1836 !important;
}

/* Legend box styling */
[data-bs-theme="light"] .parliament-chart .highcharts-legend-box {
    fill: #ffffff !important;
    stroke: none !important;
    stroke-width: 0 !important;
}

[data-bs-theme="dark"] .parliament-chart .highcharts-legend-box {
    fill: transparent !important;
    stroke: none !important;
    stroke-width: 0 !important;
}

.parliament-chart .highcharts-title,
.parliament-chart .highcharts-subtitle {
    transition: fill 0.3s ease;
}

.parliament-chart .highcharts-legend .highcharts-legend-item text {
    transition: fill 0.3s ease;
}

/* Data labels styling for both themes */
.parliament-chart .highcharts-data-label {
    transition: fill 0.3s ease, stroke 0.3s ease;
}

/* Light mode data labels - NO stroke/outline */
[data-bs-theme="light"] .parliament-chart .highcharts-data-label {
    fill: #2F2B38 !important;
    stroke: none !important;
    stroke-width: 0 !important;
}

[data-bs-theme="light"] .parliament-chart .highcharts-data-label text {
    fill: #2F2B38 !important;
    stroke: none !important;
    stroke-width: 0 !important;
}

/* Dark mode data labels - NO outline, just bold white text */
[data-bs-theme="dark"] .parliament-chart .highcharts-data-label {
    fill: #ffffff !important;
    stroke: none !important;
    stroke-width: 0 !important;
}

[data-bs-theme="dark"] .parliament-chart .highcharts-data-label text {
    fill: #ffffff !important;
    stroke: none !important;
    stroke-width: 0 !important;
}

/* Remove any text outline in both modes */
.parliament-chart .highcharts-text-outline {
    stroke: none !important;
    stroke-width: 0 !important;
}

[data-bs-theme="light"] .parliament-chart .highcharts-text-outline {
    stroke: none !important;
    stroke-width: 0 !important;
}

[data-bs-theme="dark"] .parliament-chart .highcharts-text-outline {
    stroke: none !important;
    stroke-width: 0 !important;
}

/* Title and subtitle styling */
[data-bs-theme="light"] .parliament-chart .highcharts-title,
[data-bs-theme="light"] .parliament-chart .highcharts-subtitle {
    fill: #2F2B38 !important;
}

[data-bs-theme="dark"] .parliament-chart .highcharts-title,
[data-bs-theme="dark"] .parliament-chart .highcharts-subtitle {
    fill: #ffffff !important;
}

/* Legend items styling */
[data-bs-theme="light"] .parliament-chart .highcharts-legend-item text {
    fill: #2F2B38 !important;
}

[data-bs-theme="dark"] .parliament-chart .highcharts-legend-item text {
    fill: #ffffff !important;
}

/* Total labels styling */
.parliament-chart-totals {
    position: absolute;
    top: 2rem;
    left: 2rem;
    z-index: 1000;
    background-color: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.375rem;
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
    line-height: 1.4;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    min-width: 120px;
    transition: all 0.3s ease;
}

.parliament-chart-totals .total-label {
    display: block;
    margin-bottom: 0.25rem;
    color: var(--bs-body-color);
    font-weight: 500;
    transition: color 0.3s ease;
}

.parliament-chart-totals .total-label:last-child {
    margin-bottom: 0;
}

.parliament-chart-totals .total-value {
    font-weight: 600;
    color: var(--bs-primary);
    transition: color 0.3s ease;
}

.parliament-chart-totals .new-total-value {
    font-weight: 600;
    color: var(--bs-success);
    transition: color 0.3s ease;
}

/* Dark mode specific styles */
[data-bs-theme="dark"] .parliament-chart-container {
    background-color: var(--bs-dark);
    border-color: var(--bs-secondary);
    box-shadow: 0 0.125rem 0.25rem rgba(255, 255, 255, 0.075);
}

[data-bs-theme="dark"] .parliament-chart-totals {
    background-color: var(--bs-dark);
    border-color: var(--bs-secondary);
    box-shadow: 0 0.125rem 0.25rem rgba(255, 255, 255, 0.075);
}

/* Fullscreen total labels styling */
.parliament-chart-totals-fullscreen {
    position: absolute !important;
    top: 1rem !important;
    left: 1rem !important;
    z-index: 9999 !important;
    background-color: var(--bs-body-bg) !important;
    border: 1px solid var(--bs-border-color) !important;
    border-radius: 0.375rem !important;
    padding: 0.5rem 0.75rem !important;
    font-size: 0.875rem !important;
    line-height: 1.4 !important;
    min-width: 120px !important;
}

[data-bs-theme="dark"] .parliament-chart-totals-fullscreen {
    background-color: var(--bs-dark) !important;
    border-color: var(--bs-secondary) !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .parliament-chart-container {
        padding: 0.5rem;
        margin: 1rem 0;
    }
    
    .parliament-chart {
        min-height: 250px;
    }
    
    .parliament-chart-totals {
        top: 0.5rem;
        left: 0.5rem;
        font-size: 0.8rem;
        padding: 0.375rem 0.5rem;
        min-width: 100px;
    }
}

/* Loading state for charts */
.parliament-chart:empty::before {
    content: "Cargando gráfico...";
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: var(--bs-secondary);
    font-style: italic;
    transition: color 0.3s ease;
}

/* Theme switching animation */
.parliament-chart-container[data-theme-switching="true"] {
    opacity: 0.7;
    pointer-events: none;
}

.parliament-chart-container[data-theme-switching="true"] .parliament-chart {
    opacity: 0.5;
}

/* Accessibility improvements */
.parliament-chart-container:focus-within {
    outline: 2px solid var(--bs-primary);
    outline-offset: 2px;
}

/* Highcharts export menu styling */
.highcharts-contextmenu hr,
.highcharts-menu hr {
    border-color: #ccc !important;
    border-top: 1px solid #ccc !important;
    margin: 4px 0 !important;
    opacity: 1 !important;
}

/* Ensure menu separators are visible in both light and dark modes */
[data-bs-theme="light"] .highcharts-contextmenu hr,
[data-bs-theme="light"] .highcharts-menu hr {
    border-color: #ccc !important;
    border-top: 1px solid #ccc !important;
}

[data-bs-theme="dark"] .highcharts-contextmenu hr,
[data-bs-theme="dark"] .highcharts-menu hr {
    border-color: #ccc !important;
    border-top: 1px solid #ccc !important;
}

/* Print styles */
@media print {
    .parliament-chart-container {
        background-color: white !important;
        border: 1px solid #000 !important;
        box-shadow: none !important;
        page-break-inside: avoid;
    }
    
    .parliament-chart-totals {
        background-color: white !important;
        border: 1px solid #000 !important;
        box-shadow: none !important;
    }
    
    /* Force chart background to white in print - multiple selectors for robustness */
    .parliament-chart .highcharts-background,
    .parliament-chart .highcharts-plot-background,
    .parliament-chart svg .highcharts-background,
    .parliament-chart svg .highcharts-plot-background {
        fill: white !important;
        background-color: white !important;
    }
    
    /* Force chart container background */
    .parliament-chart .highcharts-container,
    .parliament-chart .highcharts-container svg {
        background-color: white !important;
    }
    
    /* Force legend box to white background with no stroke in print */
    .parliament-chart .highcharts-legend-box {
        fill: white !important;
        stroke: none !important;
        stroke-width: 0 !important;
        background-color: white !important;
    }
    
    /* Ensure all chart text is dark for print readability */
    .parliament-chart .highcharts-title,
    .parliament-chart .highcharts-subtitle,
    .parliament-chart .highcharts-legend-item text,
    .parliament-chart .highcharts-data-label,
    .parliament-chart .highcharts-data-label text {
        fill: #000 !important;
        stroke: none !important;
        stroke-width: 0 !important;
        color: #000 !important;
    }
    
    /* Override any theme-specific background colors in print */
    [data-bs-theme="light"] .parliament-chart .highcharts-background,
    [data-bs-theme="dark"] .parliament-chart .highcharts-background,
    [data-bs-theme="light"] .parliament-chart .highcharts-plot-background,
    [data-bs-theme="dark"] .parliament-chart .highcharts-plot-background {
        fill: white !important;
    }
    
    /* Override chart container backgrounds */
    [data-bs-theme="light"] .parliament-chart .highcharts-container,
    [data-bs-theme="dark"] .parliament-chart .highcharts-container {
        background-color: white !important;
    }
}

/* Additional print styles with maximum specificity */
@media print {
    /* Force white background using CSS variables and inline style overrides */
    .parliament-chart-container .parliament-chart .highcharts-container svg rect[fill]:not([fill="none"]) {
        fill: white !important;
    }
    
    /* Target background elements by their position */
    .parliament-chart-container .parliament-chart .highcharts-container svg rect:first-child {
        fill: white !important;
    }
    
    /* Override any gradient backgrounds */
    .parliament-chart-container .parliament-chart .highcharts-container svg rect[fill*="gradient"] {
        fill: white !important;
    }
    
    /* Target by class and ensure white background */
    .parliament-chart-container .parliament-chart .highcharts-container .highcharts-background[fill],
    .parliament-chart-container .parliament-chart .highcharts-container .highcharts-plot-background[fill] {
        fill: white !important;
    }
}

/* Print styles using CSS custom properties */
@media print {
    :root {
        --print-chart-bg: white !important;
        --print-text-color: black !important;
    }
    
    .parliament-chart-container {
        --bs-body-bg: white !important;
        --bs-body-color: black !important;
    }
}

/* Ultra-specific print styles to override any Highcharts inline styles */
@media print {
    /* Force white background using attribute selectors */
    .parliament-chart svg rect[fill="#f0f0f0"],
    .parliament-chart svg rect[fill="#1f1836"],
    .parliament-chart svg rect[fill*="gradient"],
    .parliament-chart svg .highcharts-background[fill*="#"],
    .parliament-chart svg .highcharts-plot-background[fill*="#"] {
        fill: white !important;
    }
    
    /* Force legend box styling */
    .parliament-chart svg .highcharts-legend-box[fill],
    .parliament-chart svg .highcharts-legend-box[stroke] {
        fill: white !important;
        stroke: none !important;
        stroke-width: 0 !important;
    }
    
    /* Override any background color attributes */
    .parliament-chart svg[style*="background"] {
        background-color: white !important;
    }
    
    /* Force all SVG backgrounds to white */
    .parliament-chart svg {
        background-color: white !important;
    }
    
    /* Override any gradient fills */
    .parliament-chart svg defs linearGradient stop {
        stop-color: white !important;
    }
}

/* Force chart elements to use proper print styles */
@media print {
    /* Target specific chart elements that might have inline styles */
    .parliament-chart .highcharts-container[style*="background"] {
        background-color: white !important;
        background-image: none !important;
    }
    
    /* Override any CSS custom properties that might be set by themes */
    .parliament-chart {
        --chart-background-color: white !important;
        --legend-background-color: white !important;
        --text-color: black !important;
    }
    
    /* Force theme overrides */
    [data-bs-theme="light"] .parliament-chart .highcharts-container,
    [data-bs-theme="dark"] .parliament-chart .highcharts-container {
        background-color: white !important;
    }
    
    /* Ensure gradients are overridden */
    [data-bs-theme="light"] .parliament-chart .highcharts-background,
    [data-bs-theme="dark"] .parliament-chart .highcharts-background {
        fill: white !important;
        background: white !important;
    }
}

/* Additional specificity for print media */
@media print {
    .parliament-chart-container .parliament-chart .highcharts-container svg {
        background-color: white !important;
    }
    
    .parliament-chart-container .parliament-chart .highcharts-container svg .highcharts-background {
        fill: white !important;
    }
    
    .parliament-chart-container .parliament-chart .highcharts-container svg .highcharts-legend-box {
        fill: white !important;
        stroke: none !important;
    }
}