/**
 * COMPREHENSIVE COLOR OVERRIDE
 * 
 * This file ensures ZERO pink colors throughout the Construction Cost Estimator.
 * All colors are overridden with !important to take precedence over theme/plugin styles.
 * 
 * Brand Color: #1D1D63 (ONLY approved color)
 * All pink, magenta, and conflicting colors are completely removed.
 */

/* ====================================================
   ROOT COLOR VARIABLES - ABSOLUTE ENFORCEMENT
   ==================================================== */

:root {
    --ce-primary: #1D1D63 !important;
    --ce-primary-dark: #15154d !important;
    --ce-primary-darker: #11133f !important;
    --ce-primary-light: #4f4f99 !important;
    --ce-primary-lighter: #eaebfb !important;
    --ce-primary-muted: rgba(29, 29, 99, 0.65) !important;
    --ce-border: rgba(29, 29, 99, 0.18) !important;
    --ce-border-strong: rgba(29, 29, 99, 0.3) !important;
    --ce-bg: rgba(29, 29, 99, 0.05) !important;
    --ce-bg-soft: rgba(29, 29, 99, 0.08) !important;
    --ce-text: #1D1D63 !important;
    --ce-text-strong: #11133f !important;
}

/* ====================================================
   COMPREHENSIVE BUTTON STYLING OVERRIDE
   ==================================================== */

/* Calculate Estimate Button - ALL STATES */
.ce-calc-submit,
.ce-calculator--construction-cost-estimator .ce-calc-submit,
.ce-calculator--commercial .ce-calc-submit {
    background: #1D1D63 !important;
    color: #ffffff !important;
    border: 1px solid #1D1D63 !important;
    outline: none !important;
}

.ce-calc-submit:hover,
.ce-calculator--construction-cost-estimator .ce-calc-submit:hover,
.ce-calculator--commercial .ce-calc-submit:hover {
    background: #15154d !important;
    border-color: #15154d !important;
    color: #ffffff !important;
}

.ce-calc-submit:active,
.ce-calculator--construction-cost-estimator .ce-calc-submit:active,
.ce-calculator--commercial .ce-calc-submit:active {
    background: #11133f !important;
    border-color: #11133f !important;
    color: #ffffff !important;
}

.ce-calc-submit:focus,
.ce-calc-submit:focus-visible,
.ce-calculator--construction-cost-estimator .ce-calc-submit:focus,
.ce-calculator--commercial .ce-calc-submit:focus {
    outline: 2px solid #1D1D63 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 4px rgba(29, 29, 99, 0.25) !important;
    background: #15154d !important;
    border-color: #1D1D63 !important;
}

/* ====================================================
   PRINT REPORT BUTTON - ALL STATES
   ==================================================== */

.ce-print-report-btn {
    color: #11133f !important;
    background: rgba(29, 29, 99, 0.05) !important;
    border: 1px solid rgba(29, 29, 99, 0.18) !important;
}

.ce-print-report-btn:hover {
    background: rgba(29, 29, 99, 0.08) !important;
    border-color: rgba(29, 29, 99, 0.3) !important;
    color: #11133f !important;
}

.ce-print-report-btn:active {
    background: rgba(29, 29, 99, 0.12) !important;
    border-color: rgba(29, 29, 99, 0.4) !important;
    color: #11133f !important;
}

.ce-print-report-btn:focus,
.ce-print-report-btn:focus-visible {
    outline: 2px solid #1D1D63 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 4px rgba(29, 29, 99, 0.12) !important;
    border-color: #1D1D63 !important;
}

/* ====================================================
   REPORT TABS - ALL STATES (Active/Hover/Focus)
   ==================================================== */

.ce-report-tab-btn {
    color: rgba(29, 29, 99, 0.65) !important;
    border-bottom: 3px solid transparent !important;
    background: transparent !important;
}

.ce-report-tab-btn:hover {
    color: #11133f !important;
    border-bottom-color: rgba(29, 29, 99, 0.3) !important;
}

.ce-report-tab-btn.ce-active {
    color: #1D1D63 !important;
    border-bottom-color: #1D1D63 !important;
    background: transparent !important;
}

.ce-report-tab-btn:focus,
.ce-report-tab-btn:focus-visible {
    outline: 2px solid #1D1D63 !important;
    outline-offset: -2px !important;
    box-shadow: 0 2px 0 rgba(29, 29, 99, 0.3) !important;
}

/* ====================================================
   ADVANCED OPTIONS / COLLAPSIBLE SECTIONS
   ==================================================== */

.ce-collapsible-toggle {
    background: rgba(29, 29, 99, 0.05) !important;
    border: 1px solid rgba(29, 29, 99, 0.18) !important;
    color: #11133f !important;
}

.ce-collapsible-toggle:hover {
    background: rgba(29, 29, 99, 0.06) !important;
    border-color: rgba(29, 29, 99, 0.3) !important;
    color: #11133f !important;
}

.ce-collapsible-toggle:active {
    background: rgba(29, 29, 99, 0.1) !important;
    border-color: rgba(29, 29, 99, 0.4) !important;
}

.ce-collapsible-toggle:focus,
.ce-collapsible-toggle:focus-visible {
    outline: 2px solid #1D1D63 !important;
    outline-offset: 2px !important;
    border-color: #1D1D63 !important;
    box-shadow: 0 0 0 4px rgba(29, 29, 99, 0.12) !important;
}

.ce-collapsible-icon::after {
    color: rgba(29, 29, 99, 0.65) !important;
}

/* ====================================================
   FORM INPUTS - ALL STATES
   ==================================================== */

.ce-field input,
.ce-field select {
    border-color: rgba(29, 29, 99, 0.18) !important;
    color: #11133f !important;
    background: #ffffff !important;
    outline: none !important;
}

.ce-field input:hover,
.ce-field select:hover {
    border-color: rgba(29, 29, 99, 0.3) !important;
}

.ce-field input:focus,
.ce-field input:focus-visible,
.ce-field select:focus,
.ce-field select:focus-visible {
    border-color: #1D1D63 !important;
    outline: 2px solid #1D1D63 !important;
    outline-offset: 0 !important;
    box-shadow: 0 0 0 4px rgba(29, 29, 99, 0.12) !important;
}

.ce-field--invalid input,
.ce-field--invalid select {
    border-color: rgba(29, 29, 99, 0.6) !important;
    box-shadow: 0 0 0 4px rgba(29, 29, 99, 0.12) !important;
}

/* Accent color for checkboxes and radio buttons */
.ce-checkbox input,
.ce-field input[type="checkbox"],
.ce-field input[type="radio"] {
    accent-color: #1D1D63 !important;
}

/* ====================================================
   SUMMARY CARDS & BADGES
   ==================================================== */

.ce-summary-card {
    border: 1px solid rgba(29, 29, 99, 0.18) !important;
    background: rgba(29, 29, 99, 0.05) !important;
}

.ce-summary-card:hover {
    border-color: rgba(29, 29, 99, 0.2) !important;
    box-shadow: 0 8px 24px rgba(29, 29, 99, 0.08) !important;
}

.ce-summary-card.ce-card--primary {
    background: linear-gradient(135deg, rgba(29, 29, 99, 0.05) 0%, rgba(29, 29, 99, 0.02) 100%) !important;
    border-color: rgba(29, 29, 99, 0.2) !important;
}

.ce-card-label {
    color: rgba(29, 29, 99, 0.65) !important;
}

.ce-card-value {
    color: #11133f !important;
}

/* ====================================================
   BADGES & FOCUS OUTLINES
   ==================================================== */

.ce-result-badge,
.ce-flooring-result .ce-result-badge {
    background: #1D1D63 !important;
    color: #ffffff !important;
}

[aria-checked="true"] .ce-flooring-card-icon {
    color: #ffffff !important;
}

/* ====================================================
   FOCUS OUTLINES & FOCUS-VISIBLE STATES
   ==================================================== */

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 2px solid #1D1D63 !important;
    outline-offset: 2px !important;
}

.ce-calculator button:focus-visible {
    outline: 2px solid #1D1D63 !important;
}

/* ====================================================
   LINKS & ANCHORS
   ==================================================== */

.ce-calculator a,
.ce-calculator a:visited,
.ce-calculator a:link {
    color: #1D1D63 !important;
}

.ce-calculator a:hover,
.ce-calculator a:active {
    color: #15154d !important;
}

.ce-calculator a:focus,
.ce-calculator a:focus-visible {
    outline: 2px solid #1D1D63 !important;
    outline-offset: 2px !important;
}

/* ====================================================
   CHART LEGEND & ELEMENTS
   ==================================================== */

.ce-chart-container canvas {
    filter: none !important;
}

/* Override Chart.js default colors */
.chartjs-render-monitor {
    filter: none !important;
}

/* ====================================================
   FLOORING CALCULATOR SPECIFIC
   ==================================================== */

.ce-flooring-card {
    border-color: rgba(29, 29, 99, 0.18) !important;
    background: #ffffff !important;
    color: #11133f !important;
}

.ce-flooring-card:hover {
    border-color: rgba(29, 29, 99, 0.2) !important;
    box-shadow: 0 12px 30px rgba(29, 29, 99, 0.06) !important;
}

.ce-flooring-card[aria-checked="true"] {
    border-color: rgba(255, 255, 255, 0.16) !important;
    background: #1D1D63 !important;
    box-shadow: 0 22px 50px rgba(29, 29, 99, 0.14) !important;
    color: #ffffff !important;
}

.ce-flooring-card:focus-visible {
    outline: 2px solid #1D1D63 !important;
    outline-offset: 2px !important;
}

.ce-flooring-card-icon {
    background: rgba(29, 29, 99, 0.05) !important;
    color: #1D1D63 !important;
}

.ce-flooring-card-name {
    color: #11133f !important;
}

.ce-flooring-card-price {
    color: #1D1D63 !important;
}

.ce-flooring-card-description {
    color: rgba(29, 29, 99, 0.65) !important;
}

.ce-flooring-card[aria-checked="true"] .ce-flooring-card-name,
.ce-flooring-card[aria-checked="true"] .ce-flooring-card-price,
.ce-flooring-card[aria-checked="true"] .ce-flooring-card-description {
    color: #f8fafc !important;
}

/* ====================================================
   SLIDER STYLING
   ==================================================== */

.ce-slider {
    background: rgba(29, 29, 99, 0.05) !important;
}

.ce-slider:hover {
    box-shadow: 0 0 0 4px rgba(29, 29, 99, 0.1) !important;
}

.ce-slider:focus {
    box-shadow: 0 0 0 4px rgba(29, 29, 99, 0.15) !important;
}

.ce-slider:focus-visible {
    outline: 2px solid #1D1D63 !important;
    outline-offset: 4px !important;
}

.ce-slider::-webkit-slider-thumb {
    background: #1D1D63 !important;
    box-shadow: 0 10px 28px rgba(29, 29, 99, 0.18) !important;
}

.ce-slider::-moz-range-thumb {
    background: #1D1D63 !important;
    box-shadow: 0 10px 28px rgba(29, 29, 99, 0.18) !important;
    border: none !important;
}

.ce-slider-badge {
    background: #1D1D63 !important;
    color: #ffffff !important;
    box-shadow: 0 20px 42px rgba(29, 29, 99, 0.16) !important;
}

/* ====================================================
   CTA BUTTON
   ==================================================== */

.ce-cta-button {
    background: linear-gradient(135deg, #1D1D63 0%, #32326c 100%) !important;
    color: #ffffff !important;
    border: 1px solid rgba(29, 29, 99, 0.3) !important;
    box-shadow: 0 14px 32px rgba(29, 29, 99, 0.16) !important;
}

.ce-cta-button:hover {
    box-shadow: 0 16px 38px rgba(29, 29, 99, 0.18) !important;
    color: #ffffff !important;
}

.ce-cta-button:active {
    color: #ffffff !important;
}

.ce-cta-button:focus-visible {
    outline: 2px solid #1D1D63 !important;
    outline-offset: 2px !important;
}

/* ====================================================
   TEXT & LABEL COLORS
   ==================================================== */

.ce-result-label,
.ce-card-label {
    color: rgba(29, 29, 99, 0.65) !important;
}

.ce-result-value,
.ce-result-total-value,
.ce-card-value {
    color: #11133f !important;
}

.ce-result-subtitle,
.ce-result-footnote {
    color: rgba(29, 29, 99, 0.65) !important;
}

/* ====================================================
   BORDERS & DIVIDERS
   ==================================================== */

.ce-calc-result {
    border: 1px solid rgba(29, 29, 99, 0.18) !important;
}

.ce-calculator--construction-cost-estimator .ce-calc-result {
    border-left: 4px solid rgba(29, 29, 99, 0.85) !important;
}

.ce-calculator--commercial .ce-calc-result {
    border-left: 4px solid rgba(29, 29, 99, 0.9) !important;
}

.ce-report-header {
    border-bottom: 1px solid rgba(29, 29, 99, 0.18) !important;
}

.ce-report-tabs-nav {
    border-bottom: 2px solid rgba(29, 29, 99, 0.18) !important;
}

.ce-chart-container {
    border: 1px solid rgba(29, 29, 99, 0.18) !important;
}

.ce-materials-table {
    border: 1px solid rgba(29, 29, 99, 0.18) !important;
}

.ce-materials-table thead {
    background: rgba(29, 29, 99, 0.05) !important;
    border-bottom: 2px solid rgba(29, 29, 99, 0.18) !important;
}

/* ====================================================
   REQUIREMENT ITEMS
   ==================================================== */

.ce-requirement-item {
    border-left: 4px solid #1D1D63 !important;
    border: 1px solid rgba(29, 29, 99, 0.18) !important;
}

/* ====================================================
   SUSTAINABILITY ITEMS
   ==================================================== */

.ce-sustainability-item {
    border-top: 4px solid #1D1D63 !important;
    border: 1px solid rgba(29, 29, 99, 0.18) !important;
}

.ce-sustainability-value {
    color: #1D1D63 !important;
}

/* ====================================================
   BREAKDOWN CARDS
   ==================================================== */

.ce-breakdown-card {
    border: 1px solid rgba(29, 29, 99, 0.18) !important;
    background: #ffffff !important;
}

.ce-breakdown-card:hover {
    border-color: rgba(29, 29, 99, 0.25) !important;
    box-shadow: 0 4px 12px rgba(29, 29, 99, 0.05) !important;
}

.ce-amount {
    color: #1D1D63 !important;
}

/* ====================================================
   LABOR CARDS
   ==================================================== */

.ce-labor-card {
    background: rgba(29, 29, 99, 0.05) !important;
    border: 1px solid rgba(29, 29, 99, 0.18) !important;
}

.ce-labor-card h5 {
    color: #11133f !important;
}

.ce-labor-card p {
    color: rgba(29, 29, 99, 0.65) !important;
}

.ce-labor-card .ce-value {
    color: #1D1D63 !important;
}

/* ====================================================
   ANALYSIS CARDS
   ==================================================== */

.ce-analysis-card {
    background: rgba(29, 29, 99, 0.05) !important;
    border: 1px solid rgba(29, 29, 99, 0.18) !important;
}

.ce-analysis-card h5 {
    color: #11133f !important;
}

.ce-analysis-label {
    color: rgba(29, 29, 99, 0.65) !important;
}

.ce-analysis-value {
    color: #11133f !important;
}

.ce-analysis-percentage {
    color: rgba(29, 29, 99, 0.65) !important;
}

.ce-analysis-row {
    border-bottom: 1px solid rgba(29, 29, 99, 0.18) !important;
}

/* ====================================================
   ALERT BOX STYLING
   ==================================================== */

.ce-calc-alert {
    background: #1D1D63 !important;
    border: 1px solid #1D1D63 !important;
    color: #ffffff !important;
}

.ce-calc-alert--error {
    background: #1D1D63 !important;
    border: 1px solid #1D1D63 !important;
    color: #ffffff !important;
}

/* ====================================================
   RESET BUTTON
   ==================================================== */

.ce-calc-reset {
    background: rgba(29, 29, 99, 0.08) !important;
    color: #11133f !important;
    border: 1px solid rgba(29, 29, 99, 0.18) !important;
}

.ce-calc-reset:hover {
    background: rgba(29, 29, 99, 0.12) !important;
    color: #11133f !important;
}

.ce-calc-reset:focus,
.ce-calc-reset:focus-visible {
    outline: 2px solid #1D1D63 !important;
    outline-offset: 2px !important;
    border-color: #1D1D63 !important;
}

/* ====================================================
   HEADLINE & ICON COLORS
   ==================================================== */

.ce-headline-icon {
    background: #1D1D63 !important;
}

.ce-headline-icon__inner {
    color: #ffffff !important;
}

/* ====================================================
   REMOVE ALL PINK/MAGENTA/CONFLICTING COLORS
   ==================================================== */

/* Block any hardcoded pink colors */
*:not(.wp-block-button):not(.wp-block-button__link) {
    --color-pink: #1D1D63 !important;
    --color-magenta: #1D1D63 !important;
    --accent-color: #1D1D63 !important;
}

/* Override Bootstrap colors if present */
.ce-calculator .btn-primary,
.ce-calculator button.btn-primary {
    background-color: #1D1D63 !important;
    border-color: #1D1D63 !important;
    color: #ffffff !important;
}

.ce-calculator .btn-primary:hover,
.ce-calculator button.btn-primary:hover {
    background-color: #15154d !important;
    border-color: #15154d !important;
}

.ce-calculator .btn-primary:focus,
.ce-calculator button.btn-primary:focus {
    background-color: #15154d !important;
    border-color: #1D1D63 !important;
    box-shadow: 0 0 0 3px rgba(29, 29, 99, 0.25) !important;
}

/* Override form-control focus */
.ce-calculator .form-control:focus {
    border-color: #1D1D63 !important;
    box-shadow: 0 0 0 0.2rem rgba(29, 29, 99, 0.25) !important;
}

/* ====================================================
   PRINT STYLES
   ==================================================== */

@media print {
    .ce-calculator {
        border: 1px solid rgba(29, 29, 99, 0.18) !important;
    }

    .ce-print-report-btn {
        display: none !important;
    }

    .ce-calc-result {
        color: #11133f !important;
        background: #ffffff !important;
        border-color: rgba(29, 29, 99, 0.18) !important;
    }
}

/* ====================================================
   FINAL OVERRIDE - CATCH-ALL RULES
   ==================================================== */

/* Ensure NO magenta/pink appears anywhere */
.ce-calculator [style*="pink"],
.ce-calculator [style*="magenta"],
.ce-calculator [style*="#e91e63"],
.ce-calculator [style*="#ff69b4"],
.ce-calculator [style*="#ff1493"],
.ce-calculator [style*="#ec4899"],
.ce-calculator [style*="rgb(233"],
.ce-calculator [style*="rgb(255, 105"],
.ce-calculator [style*="rgb(255, 20"] {
    color: #1D1D63 !important !important;
    background-color: inherit !important;
    border-color: rgba(29, 29, 99, 0.18) !important;
}

/* Override any theme color variables that might exist */
.ce-calculator {
    --wp-admin-theme-color: #1D1D63 !important;
    --wp-admin-theme-color--rgb: 29, 29, 99 !important;
}

/* Ensure all pseudo-elements use brand color */
.ce-calculator ::before,
.ce-calculator ::after {
    color: inherit !important;
    background-color: inherit !important;
    border-color: inherit !important;
}
