/* SIP calculator  */
.cal-border{border-bottom:2px solid #f1f1f1;}
.calculator input::placeholder{color:#767e8d!important;font-size:15px;}
.border-invest{border-top:2px solid #f1f1f1;border-bottom: 2px solid #f1f1f1;padding: 20px 0px;}
.border-rh{border-right:2px solid #f1f1f1;}
.amt-text p{font-size:13px;color:#767e8d;}
.wrapper{padding:60px 0;text-align: left;}
.calculator{background:#fff;border-radius:16px;padding:32px;box-shadow:0 20px 50px rgba(0,0,0,0.08);} 
.heading{font-size:18px;font-weight:600;padding-bottom: 20px;color:#161616;}
.calculator .label{font-size:16px;color:#161616;padding-bottom:10px;font-weight:600;}
.input-box{font-size: 15px;width:120px;border:1px solid #e5e7eb;border-radius:8px;padding:6px;text-align:center;font-weight: 600;color:#494f5a;background-color: #f3f5f7;}
/* .form-range{height:4px;background:#EF9309!important;} */
.form-range::-webkit-slider-thumb{background:#fff;width:20px;height:20px;border-radius:50%;box-shadow: 0 0 4px #5a5656;margin-top:-7px;}
/* .form-range::-webkit-slider-runnable-track{background:#f1f1f1;height:4px;} */
.summary-title{font-size:16px;color:#161616;font-weight:600;line-height: 1.8em;}
.summary-value{font-size:17px;font-weight:600;color:#E0A101;}
.green{color:#16a34a;}
.chart-wrapper{position:relative;width:260px;margin:auto;}
.center-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;}
.center-text small{font-size:18px;color:#fff;}
.center-text strong{font-size:18px;color:#fff;}
.chart-text strong {font-size: 18px;color:#000;}
.chart-text small {font-size: 18px;color:#000;}
.btn-invest{background:#16a34a;color:#fff;border:none;border-radius:10px;padding:12px 28px;font-weight:600;}
.toggle{border:1px solid #e5e7eb;border-radius:10px;overflow:hidden;}
.toggle span{padding:10px 14px;font-size:15px;color:#fff;cursor:pointer;background-color: #0f1729;}
.toggle .active{background:#d9a520;color:#fff;font-weight:500;}

.form-range {-webkit-appearance: none;appearance: none;height: 6px;background: transparent;margin:12px 0px;}
.form-range::-webkit-slider-runnable-track {height: 6px;border-radius: 50px;background: linear-gradient(to right,  #d9a520 0%,#d9a520 var(--range-progress),#e5e7eb var(--range-progress),#e5e7eb 100%);}
.form-range::-moz-range-track {background: #e5e7eb;height: 6px;border-radius: 50px;}
.form-range::-moz-range-progress {background: #d9a520;height: 6px;border-radius: 50px;}
.form-range::-webkit-slider-thumb{ -webkit-appearance:none; appearance:none; width:24px; height:24px; border-radius:50%; background:#fff; border:4px solid #d9a520; margin-top:-8px; box-shadow:0 4px 10px rgba(0,0,0,0.2); transition:0.3s;}
.form-range:hover::-webkit-slider-thumb{ transform:scale(1.1);}
.form-range::-moz-range-thumb{ width:24px; height:24px; border:none; border-radius:50%; background:#d9a520; box-shadow:0 4px 10px rgba(0,0,0,0.2);}


/* retirement calcultor css */
.retire-calcultor .grid {display:grid;grid-template-columns:1fr 1fr;gap:25px;}
.retire-calcultor  label {font-size:15px;padding:14px 0px 5px 0px;;color:#161616;font-weight: 600;}
.retire-calcultor .container{background: #fff;text-align: left;border-radius: 16px;padding: 32px;box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08);}
.retire-calcultor input {width:100%;padding:10px;margin:6px 0 14px;border-radius:8px;border:1px solid #ddd;font-size:14px;transition:0.2s;color: #494f5a;font-weight: 600;}
.retire-calcultor input:focus {border-color:#d4a017;outline:none;}
.retire-calcultor .highlight1 {background:#ecfdf5;border:1px solid #10b981;font-weight:600;color:#1e293b;}
.retire-calcultor .hint {font-size:12px;color:#767e8d;margin-top:-10px;margin-bottom:10px;}
.retire-calcultor button {margin-top:10px;width:100%;padding:14px;border:none;border-radius:10px;background:#d4a017;color:#fff;font-size:15px;font-weight:600;cursor:pointer;}
.retire-calcultor button:hover {background:#0f1729;}
.result {margin-top: 25px;/*display: grid;*/grid-template-columns: 1fr 1fr;gap: 20px;}
.dark-box {margin-top:15px; background: #0f172a;border: 1px solid #1e293b;border-radius: 14px;padding: 18px;color: #e5e7eb;transition: 0.25s;}
.dark-box .title img{width: 20px;margin-right:8px;}
.dark-box:hover {border-color: #d4a017;transform: translateY(-3px);}
.dark-box .title {font-size: 15px;color: #fff;margin-bottom: 8px;}
.dark-box .value {font-size: 22px;font-weight: 600;color: #ffffff;}
.dark-box .sub {font-size: 12px;color: #bbb7b7;margin-top: 6px;}
.ret-mar{margin-top:21px;}

/* highlight main result */
.dark-box:first-child {grid-column: span 2;background: #0f1729;border-bottom: 3px solid #d4a017;}

@media(max-width:768px){
  .calculator{padding:32px 20px;}
  .note-color{padding-left:0px!important;}
  .chart-note{padding-left:0px!important;}
  .border-rh{border-right: none;}
 .retire-calcultor   .result {
    grid-template-columns: 1fr;
  }
}
@media(max-width:768px){
  .retire-calcultor  .grid { grid-template-columns:1fr; }
  .retire-calcultor  .result { grid-template-columns:1fr; }
}

.chartWrapper {position: relative;width: 100%;height: 450px}
.chartWrapper canvas {position: absolute;top: 0;left: 0;width: 100% !important;height: 100% !important;}
#dummyChart {z-index: 2;}
#retirementChart {z-index: 1;}
@media(min-width:1500px) and (max-width:1930px)
{
  .ret-mar{margin-top:0px!important;}
  .rt-res{margin-top:21px!important;}
}

.chart-note {font-size: 17px;color: rgb(0, 0, 0);font-weight: 600;padding: 20px 20px 5px;text-align: left;line-height: 1.5em;}
.note-color {color: rgb(22, 163, 74);font-size: 17px;font-weight: 600;padding-left: 20px;text-align: left;    line-height: 1.5em;}
.chart-marriage {position: relative;width: 100%;height: 450px}
.chart-marriage canvas{position: absolute;top: 0;left: 0;width: 100% !important;height: 100% !important;}
.marriage-section{margin-top: 25px;}

.warn-note {color: rgb(209, 17, 17);font-size: 17px;font-weight: 600;padding-top: 20px;text-align: left;line-height: 1.5em;}
.chart-return {position: relative;width: 100%;height: 350px}
.chart-return canvas{position: absolute;top: 0;left: 0;width: 100% !important;height: 100% !important;}

.form-calculator  label {font-size:15px;padding-top: 14px;color:#161616;}
.form-calculator input {width:100%;padding:10px;margin:6px 0 14px;border-radius:8px;border:1px solid #ddd;font-size:14px;transition:0.2s;text-align: left;background: transparent;}
.form-calculator input:focus {border-color:#d4a017;outline:none;}
.form-calculator button {margin-top:10px;width:100%;padding:14px;border:none;border-radius:10px;background:#d4a017;color:#fff;font-size:15px;font-weight:600;cursor:pointer;}
.form-calculator button:hover {background:#0f1729;}
.form-calculator select {width:100%;padding:10px;margin:6px 0 14px;border-radius:8px;border:1px solid #ddd;font-size:15px;transition:0.2s;text-align: left;}
.form-calculator select:focus {border-color:#d4a017;outline:none;}

.calculator .btn-primary{margin-bottom: 12px;background: #0f1729!important;border: 1px solid #0f1729!important;padding:8px 12px;width:auto;}