/* Credit line repay form - "other amount" (user_cabinet/repay_custom_amount, repay_custom_amount_summary) */

/* own full width row - payment-choices fits only 2 columns */
.custom-amount-choices {margin-top:0;}
.custom-amount-choices .payment-col {width:100%;}

/* - [amount] + */
.custom-amount-wrap {display:inline-flex;align-items:center;vertical-align:middle;}
.custom-amount-btn {display:inline-block;width:28px;height:28px;line-height:26px;text-align:center;font-size:18px;color:#656565;border:1px solid #ccc;background:#fff;user-select:none;transition:border-color .2s, color .2s;}
.custom-amount-btn:hover {border-color:#f86706;color:#f86706;}
#custom_amount {width:80px;height:28px;margin:0 4px;padding:0 6px;text-align:right;border:1px solid #ccc;transition:border-color .2s, box-shadow .2s;}
#custom_amount.out-of-range {border-color:#e2001a;box-shadow:0 0 0 2px rgba(226,0,26,.15);}

/* slider - shown only when "other amount" is chosen */
.custom-amount-choices .custom-amount-slider-row > td {padding:0;} /* beats .payment-choices table td */
.custom-amount-slider-wrap {padding:5px 15px 15px;}
.custom-amount-slider-wrap.is-hidden {display:none;}
#custom_amount_slider {top:5px;width:auto;margin:0 12px;}
#custom_amount_slider .ui-slider-handle {width:25px;height:25px;margin-left:-12.5px;top:-8px;border:1px solid #b3b3b3;outline:none;cursor:grab;}
#custom_amount_slider .ui-slider-handle:hover {border-color:#f86706;}
#custom_amount_slider .ui-slider-handle.ui-state-active {cursor:grabbing;}
.custom-amount-limits {margin-top:25px;font-size:14px;color:#666;}
.custom-amount-limits .limit-min {float:left;}
.custom-amount-limits .limit-max {float:right;}

/* several open bills: threshold ticks on the track + "1 payment: X" links */
#custom_amount_slider .custom-amount-tick {position:absolute;top:-4px;bottom:-4px;width:2px;margin-left:-1px;background:#f86706;pointer-events:none;}
.custom-amount-thresholds {clear:both;padding-top:10px;font-size:14px;}
.custom-amount-threshold {display:inline-block;margin:5px 8px 0 0;padding:3px 8px;border:1px solid #ccc;color:#656565;text-decoration:none;transition:border-color .2s, color .2s;}
.custom-amount-threshold:hover, .custom-amount-threshold.is-active {border-color:#f86706;color:#f86706;}

/* form breakdown and repay page: part above minimum payment - principal repayment */
.custom-amount-extra td {color:#f86706;font-weight:500;}