/* Custom styles for the EASIWise Calculator */
.easiwise-calculator-container {
    max-width: 900px; /* Adjust max width as needed */
}

/* --- FIXES & REFINEMENTS --- */

/* Fix 1 (Revised): Force vertical alignment in input groups */
/* This rule targets both the input field and the text addon ("kW")
   and applies identical vertical padding to ensure they render at the same height. */
.easiwise-calculator-container .input-group .form-control,
.easiwise-calculator-container .input-group .input-group-text {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
}

/* Fix 2: Add more vertical padding to the main calculator title */
.easiwise-calculator-container .card-header {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
}

/* Fix 3a: Force the "Your Estimated Savings" header text to be white */
.easiwise-calculator-container #resultsCard .card-header.bg-success {
    color: #ffffff;
}

/* Fix 3b: Improve vertical alignment and padding for the summary badges */
.easiwise-calculator-container .list-group-item .badge {
    padding-top: .6em;
    padding-bottom: .6em;
    display: inline-flex;
    align-items: center;
}


/* --- BASE STYLES --- */

/* Ensure the results card is hidden initially */
#resultsCard.d-none {
    display: none !important;
}