@charset "UTF-8";
/* CSS Document */

/* ==========================================
   Time Value Calculators - Custom Styling
   Bootstrap
   WCAG Accessible
========================================== */

#tvcMainCalculatorDivId.cTimeValue {
    max-width: 900px;
    margin: 2rem auto;
    font-family: inherit;
    color: #212529;
}


/* Calculator container */
.cTimeValue table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}


/* Main calculator card */
.cTimeValue > table,
.cTimeValue .tvcCalculatorTable {
    background: #ffffff;
    border: 1px solid #dee2e6;
    border-radius: 16px;
    padding: 2rem;
    box-shadow: 0 8px 24px rgba(0,0,0,.08);
}


/* Calculator headings */
.cTimeValue h1,
.cTimeValue h2,
.cTimeValue h3,
.cTimeValue .tvcTitle {
    color: #12304a;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 1rem;
}


/* Labels */
.cTimeValue label,
.cTimeValue td {
    font-size: 1rem;
    line-height: 1.5;
}


.cTimeValue label {
    font-weight: 600;
    color: #243746;
}


/* Input fields */
.cTimeValue input[type="text"],
.cTimeValue input[type="number"],
.cTimeValue select {
    width: 100%;
    min-height: 44px; /* WCAG touch target */
    padding: .65rem .85rem;

    border: 1px solid #6c757d;
    border-radius: 8px;

    background-color: #fff;
    color: #212529;

    font-size: 1rem;
    transition: border-color .2s ease, box-shadow .2s ease;
}


/* Accessible focus state */
.cTimeValue input:focus,
.cTimeValue select:focus {
    outline: 3px solid rgba(3,167,239,.35);
    border-color: #03a7ef;
    box-shadow: 0 0 0 .2rem rgba(3,167,239,.25);
}


/* Buttons */
.cTimeValue input[type="button"],
.cTimeValue input[type="submit"],
.cTimeValue button {

    min-height: 44px;

    padding: .7rem 1.5rem;

    border-radius: 999px;

    border: none;

    background-color: #03a7ef;

    color: #ffffff;

    font-weight: 700;

    font-size: 1rem;

    cursor: pointer;

    transition: all .2s ease;
}


.cTimeValue input[type="button"]:hover,
.cTimeValue input[type="submit"]:hover,
.cTimeValue button:hover {

    background-color: #027bb5;

}


.cTimeValue input[type="button"]:focus,
.cTimeValue input[type="submit"]:focus,
.cTimeValue button:focus {

    outline: 3px solid #212529;

    outline-offset: 2px;

}


/* Result / answer area */
.cTimeValue .tvcAnswer,
.cTimeValue .tvcResult {

    margin-top: 1.5rem;

    padding: 1.25rem;

    background: #f1f8fb;

    border-left: 5px solid #03a7ef;

    border-radius: 8px;

    font-size: 1.15rem;

    font-weight: 700;

}


/* Help / descriptions */
.cTimeValue .tvcDescription,
.cTimeValue small {

    color:#495057;

    font-size:.95rem;

}


/* Email + print icons */
#tvcMailToLinkId,
#tvcPrintThisLinkId {

    display:inline-flex;

    align-items:center;

    justify-content:center;

    width:44px;

    height:44px;

    border-radius:50%;

    margin-right:.5rem;

    background:#f1f3f5;

}


#tvcMailToLinkId:hover,
#tvcPrintThisLinkId:hover {

    background:#e9ecef;

}


#tvcMailToLinkId img,
#tvcPrintThisLinkId img {

    width:20px;

    height:20px;

}


/* Mobile */
@media (max-width:768px){

    #tvcMainCalculatorDivId.cTimeValue {

        margin:1rem;

    }


    .cTimeValue td {

        display:block;

        width:100%;

    }


    .cTimeValue input[type="button"],
    .cTimeValue input[type="submit"] {

        width:100%;

    }

}



/* Print cleanup */
@media print {

    #tvcMailToLinkId,
    #tvcPrintThisLinkId {

        display:none;

    }

}

/* From TCalc*/
#tvcMainCalculatorDivId caption{
    caption-side: top;
}

#txtLOANSTARTDATE,
#txtEXTRAPAYMENTDATE {
    font-size: 13.333px !important;
    font-family: "Poppins", sans-serif !important;
    font-weight: 800 !important;
    color: #243746 !important;
}