/* =========================================
   iGrroww.in | Calculator Styles
   File: assets/css/calculator.css
========================================= */

/* Default State */
.calc-card {
    cursor: pointer;
}

.calc-card .check-icon {
    color: #cbd5e1; /* Gray Default */
    opacity: 0.3;
    transition: all 0.3s ease;
}

/* Checked State Magic */
.calc-option:checked + .calc-card {
    border-color: #00C16A;
    background: linear-gradient(135deg, #ffffff 0%, rgba(0, 193, 106, 0.05) 100%);
    box-shadow: 0 10px 25px -5px rgba(0, 193, 106, 0.15);
}

.calc-option:checked + .calc-card .check-icon {
    color: #00C16A;
    opacity: 1;
}

.calc-option:checked + .calc-card .calc-border-top {
    border-color: rgba(0, 193, 106, 0.2);
}

/* Modal Form Inputs */
.calc-input {
    background-color: #f8fafc; 
    border: 2px solid #e2e8f0;
    transition: all 0.3s ease;
}
.calc-input:focus {
    background-color: #ffffff; 
    border-color: #00C16A;
    box-shadow: 0 0 0 4px rgba(0, 193, 106, 0.1);
}

/* Scroll Animations */
.animate-on-scroll {
    will-change: transform, opacity;
}