/*
Plugin Name: Interest Rate Calculator
Plugin URI: https://calculatorhubhq.com/calculators/interest-rate-calculator/
Description: Calculate with Confidence: The Ultimate Interest Rate Calculator
Version: 1.0
Author: Calculator Hub HQ
Author URI: https://calculatorhubhq.com/
*/
/* Container for the interest rate calculator form */
.formbox {
    margin: 30px 0 40px;
}

/* Heading styles for the interest rate calculator */
.formbox h3 {
    font-weight: bold;
    font-size: 25px;
    margin-bottom: 20px;
}

/* Label styles for form groups */
.form-group label {
    font-size: 13px;
    text-transform: uppercase;
    margin-bottom: 5px;
    font-weight: 500;
}

/* Dollar sign positioning */
.dollar-sign {
    position: relative;
}

.dollar-sign::before {
    content: "$";
    position: absolute;
    left: 5px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}

/* Form control styles */
.formbox .form-control {
    border: 1px solid #777;
    height: 50px;
    border-radius: 0px;
    color: #000;
    padding-left: 15px;
}

/* Button styles */
form .btn.btn-primary {
    width: 100%;
    height: 50px;
    text-transform: uppercase;
    border-radius: 0px;
    font-size: 20px;
    font-weight: 500;
    border: 0;
}

/* Result background styles */
.col-md-6.resultbg {
    box-shadow: 0 0 1px #1515151a, 0 2px 8px -1px #15151533;
    padding: 0px;
}

/* Result heading styles */
.resultbg h4 {
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: 20px;
    font-size: 24px;
    margin-bottom: 5px;
    background: #183d69;
    text-align: center;
    padding: 20px 10px;
    color: #fff;
}

/* Result content styles */
.resultcontent {
    padding: 20px;
    text-align: center;
}  .calxbic {	background: #eee;	padding: 15px;	margin-top: 10px;}.xyys {	display: block;	font-size: 35px;	font-weight: bold;	color: #1d3f6a;}.rlabel  {	margin-bottom:0;}  .resultbg h4 {	margin-bottom: 0;}

/* Result value styles */
.presult {
    font-size: 50px;
    display: block;
    color: #6ac8bd;
    font-weight: 600;
    line-height: 1.2;
}

/* Result label styles */
.rlabel {
    display: block;
    font-weight: 600;
    color: #000;
    font-size: 25px;
    margin-bottom: 30px;
}

/* Additional result heading styles */
.resultbg h5 {
    font-size: 20px;
    font-family: Poppins, sans-serif;
    font-weight: 400;
    margin-bottom: 0;
    color: #333;
    font-style: italic;
    text-align: center;
    margin-top: 60px;
}

/* interest rate calculator form box styles */
.mortage-calcul.formbox {
    width: 100%;
    max-width: 100%;
}

/* Input group append width */
.input-group-append.width-25 {
    width: 25%;
}

/* Input group input styles */
.input-group input {
    border: 0;
    height: 48px;
}

/* Input group text styles */
.input-group-text {
    padding: 0 10px;
    background: transparent;
    border: 0;
}

/* Input group styles */
.formbox .input-group {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    width: 100%;
}

/* Input group border-right styles */
.formbox .input-group .br-1 {
    border-right: 1px solid #777 !important;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

/* Form padding styles */
.col-md-6.form-padding {
    padding-right: 50px;
}

/* Dollar sign width in input group */
.input-group .dollar-sign {
    width: 75%;
}

/* Input group border and height styles */
.input-group {
    border: 1px solid #777;
    height: 50px;
    border-radius: 0px;
    color: #000;
}

/* Input group input important styles */
.input-group input {
    border: 0 !important;
    height: 48px !important;
}.input-group .form-control {	border: 0;	height: 48px;}.input-group-append.width-25 {	width: 25%;	border-left: 1px solid #777;}.input-group-append.width-25 input{		border-left: 1px solid #777!important;	}#resultcontent tr {	background: #1a3e69; color:#fff;margin-bottom: 20px;display: inline-table;width: 100%;}.xcv {		background: #6ac8bd;	width: 70%;}#resultcontent table th, #resultcontent table td {		border: 1px solid #eee;	padding: 15px;	}

/* Responsive styles for small screens */
@media only screen and (max-width: 600px) {
    .col-md-6.form-padding {
        padding-right: 15px;
    }

    #mortgageForm {
        margin-bottom: 20px;
    }
}