/* =========================
   FORM CARD WRAPPER
========================= */
.wpsf-form-wrapper {
    background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%) !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 18px !important;
    padding: 26px !important;
    box-shadow: 0 14px 40px rgba(0,0,0,0.06) !important;
    margin-bottom: 15px;
}

/* =========================
   FORM GROUP SPACING
========================= */
.wpsolarflow-clean-theme .form-group {
    margin-bottom: 16px !important;
}

/* =========================
   LABELS (CLEAN + PREMIUM)
========================= */
.wpsolarflow-clean-theme .form-group label {
    display: block !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 1.2px !important;
    text-transform: uppercase !important;
    margin-bottom: 6px !important;
}

/* =========================
   INPUTS + SELECTS
========================= */
.wpsolarflow-clean-theme .form-group input,
.wpsolarflow-clean-theme .form-group select {
    width: 100% !important;
    padding: 14px 14px !important;
    font-size: 15px !important;
    border-radius: 12px !important;
    border: 1px solid #e5e7eb !important;
    background: #ffffff !important;
   
    box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
    transition: all 0.2s ease !important;
}

/* extra safety override */
.wpsolarflow-clean-theme input,
.wpsolarflow-clean-theme select {
    border: 1px solid #e5e7eb !important;
}

/* =========================
   FOCUS STATE (IMPORTANT UX)
========================= */
.wpsolarflow-clean-theme .form-group input:focus,
.wpsolarflow-clean-theme .form-group select:focus {
    outline: none !important;
    border-color: #10b981 !important;
    box-shadow: 0 0 0 4px rgba(16,185,129,0.12) !important;
}

/* =========================
   PLACEHOLDER STYLE
========================= */
.wpsolarflow-clean-theme .form-group input::placeholder {
    color: #9ca3af !important;
}

/* =========================
   GRID SYSTEM (REPLACES INLINE STYLE)
========================= */
.wpsf-grid-2 {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 14px !important;
}

/* =========================
   STATE + ZIP CONTROL
========================= */
#wpsf-state {
    width: 100% !important;
    max-width: 220px !important;
}

#wpsf-zip {
    width: 100% !important;
}

/* ZIP spans full width for cleaner layout */
#wpsf-zip {
    grid-column: 1 / -1 !important;
}

/* =========================
   GRID RESPONSIVE
========================= */
@media (max-width: 640px) {
    .wpsf-grid-2 {
        grid-template-columns: 1fr !important;
    }

    #wpsf-state {
        max-width: 100% !important;
    }

    #wpsf-zip {
        grid-column: auto !important;
    }
}

/* =========================
   AUTOFILL FIX (CHROME)
========================= */
.wpsolarflow-clean-theme input:-webkit-autofill {
    box-shadow: 0 0 0 1000px #ffffff inset !important;
    -webkit-text-fill-color: #111827 !important;
}

/* =========================
   EXTRA POLISH (OPTIONAL)
========================= */
.wpsf-form-wrapper:hover {
    box-shadow: 0 16px 50px rgba(0,0,0,0.08) !important;
    transition: all 0.2s ease !important;
}

.wpsf-chart-wrap {
    width: 100%;
    max-width: 100%;
    position: relative;
}

.wpsf-chart-wrap canvas {
    width: 100% !important;
    height: auto !important;
}

/* =========================================
   COMPACT SOLAR FOOTER
========================================= */

.sfp-footer {
    margin-top: 24px;
    padding: 18px 20px;

    background: #ffffff;

    border: 1px solid #e5e7eb;
    border-radius: 14px;

    box-shadow: 0 4px 18px rgba(15, 23, 42, 0.04);
}

/* =========================================
   DISCLAIMER WRAPPER
========================================= */

.sfp-footer-disclaimer {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* =========================================
   DISCLAIMER ITEM
========================================= */

.sfp-disclaimer-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;

    font-size: 13px;
    line-height: 1.55;
  
}

/* =========================================
   ICONS
========================================= */

.sfp-disclaimer-icon {
    font-size: 16px;
    line-height: 1.2;
    flex-shrink: 0;
    margin-top: 1px;
}

/* =========================================
   TEXT
========================================= */

.sfp-disclaimer-text strong {
    color: #0f172a;
    font-weight: 600;
}

/* =========================================
   COPYRIGHT
========================================= */

.sfp-footer-copyright {
    margin-top: 14px;
    padding-top: 12px;

    border-top: 1px solid #edf2f7;

    text-align: center;

    font-size: 12px;
    color: #64748b;
}

/* =========================================
   MOBILE
========================================= */

@media (max-width: 768px) {

    .sfp-footer {
        padding: 16px;
    }

    .sfp-disclaimer-item {
        font-size: 12px;
        line-height: 1.5;
    }

    .sfp-disclaimer-icon {
        font-size: 15px;
    }

    .sfp-footer-copyright {
        font-size: 11px;
    }
}

#wpsf-success-restart-btn {
	margin: 25px !important;
	padding: 10px 25px;
	color: #fff;
}


table {
	background-color: #fff;
	border-radius: 10px !important;
}
#wpsfSavingsChart {
	background-color: #fff;
	border-radius: 10px;
	border-color: #cbc2c2;
	border-width: 1px;
	border-style: solid;
}
#wpsf-state {
	font-size: 1.6em;
	color: rebeccapurple;
	font-weight: 600;
}
#wpsf-monthly-bill {
	font-size: 1.6em !important;
}

.wpsf-currency-input {
    position: relative;
    padding-left: 45px !important;
    max-width: 180px;  
}

.wpsf-currency-symbol {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 20px;
    font-weight: 700;
    color: #555;
    z-index: 2;
    pointer-events: none;
    line-height: 1;
}

.wpsf-currency-input input {
    padding-left: 38px !important;
}

/* Chrome, Edge, Safari */
#wpsf-monthly-bill::-webkit-outer-spin-button,
#wpsf-monthly-bill::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
#wpsf-monthly-bill {
    -moz-appearance: textfield;
}