.elementor-1340 .elementor-element.elementor-element-3c236c1{--display:flex;--min-height:350px;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--margin-top:-80px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:100px;--padding-bottom:80px;--padding-left:0px;--padding-right:0px;}.elementor-1340 .elementor-element.elementor-element-3c236c1:not(.elementor-motion-effects-element-type-background), .elementor-1340 .elementor-element.elementor-element-3c236c1 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-9d7b85a );}.elementor-widget-heading .elementor-heading-title{color:var( --e-global-color-primary );}.elementor-1340 .elementor-element.elementor-element-7656a49{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:80px;--padding-bottom:80px;--padding-left:0px;--padding-right:0px;}.elementor-1340 .elementor-element.elementor-element-7656a49:not(.elementor-motion-effects-element-type-background), .elementor-1340 .elementor-element.elementor-element-7656a49 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-86045ce );}@media(max-width:1366px){.elementor-1340 .elementor-element.elementor-element-3c236c1{--min-height:300px;}}@media(max-width:767px){.elementor-1340 .elementor-element.elementor-element-3c236c1{--min-height:500px;--justify-content:center;--margin-top:-126px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:150px;--padding-bottom:45px;--padding-left:25px;--padding-right:25px;}.elementor-1340 .elementor-element.elementor-element-dfc7dee{text-align:center;}.elementor-1340 .elementor-element.elementor-element-7656a49{--gap:25px 25px;--row-gap:25px;--column-gap:25px;--padding-top:45px;--padding-bottom:45px;--padding-left:25px;--padding-right:25px;}}/* Start custom CSS for html, class: .elementor-element-ca1ec8b *//**********cannyworx Styles***************/
#currency-symbol-fmv {
    position: absolute;
    margin-top: -5px;
    margin-left: 15px;
    background-color: #F5F5F5;
}


.fmv {
    position: absolute;
    margin-top: 0px;
    margin-left: 27px !important;
    background-color: #F5F5F5;
}

tspan {
    fill: #fff !important;
}

.modal_tit{  
    margin-top: 0 !important;
    font-size: 28px !important;
    font-family: 'Metropolis' !important;    margin-bottom: 0;}
.panel {display: flex;justify-content: space-between;gap: 40px;}
.left-panel {flex: 1;background-color: #f5f5f5;padding: 30px;border-radius: 10px;}
.right-panel {width: 48%;background-color: #0C224A;border-radius: 10px;padding: 30px;    display: flex;
    flex-direction: column;
    justify-content: center;}
.currency-option {background: none !important;padding: 10px 26px !important;font-size: 16px;cursor: pointer;
    color: #D1D1D1 !important;transition: color 0.3s, border-bottom 0.3s !important;border: 1px solid #D1D1D1 !important;
    border-radius: 6px !important;}
.currency-option input {display: none;}
.currency-option:hover {    color: #E75935 !important;border: 1px solid #E75935;box-shadow: 8px 8px 16px rgba(231, 89, 53, 0.15);}
.currency-option input:checked + span {color: #E75935 !important;}
.lc_currency{margin-bottom:20px;}
.con_cal_box {display: flex;flex-direction: column;align-items: flex-start !important;}
.over_label {position: absolute;margin-top: -2px;margin-left: 16px;background-color: #F5F5F5;font-size: 14px;}
.con_cal_box input {width: 100% !important;padding: 15px !important;margin-top: 5px !important;font-size: 14px !important;box-sizing: border-box !important;border: 1px solid #BCBCBC !important;border-radius: 5px !important;background: no-repeat !important;}
.final-total {display: flex;justify-content: space-between;align-items: center;color: white;    gap: 25px;}
.subcard-QualifiedOptions {background-color:  #6EA4D4;color: #fff;padding: 10px 35px 25px 20px;border-radius: 8px;width: 40%;}			
.subcard-liquidityTotal {background-color: #6EA4D4;color: #fff;padding: 10px 20px 20px;border-radius: 8px;}			
.subcard {padding: 20px;border-radius: 8px;text-align: left;}			
.chart-container {margin-bottom: 20px;background-color: rgb(255 255 255 / 0%);border-radius: 8px;}			
			
#willingness-label {
    font-size: 14px;
    line-height: 20px;
}			
#edit-willingness {
   color: #6EA4D4;
    font-weight: 600;
    text-decoration: underline;
}

#willingness-percentage-display {
    font-weight: 600;
    color: #e85936;
}



.section-title { margin-bottom: 15px !important;
    margin-top: 0 !important;
    font-size: 28px !important;
    font-family: 'Metropolis' !important;}
.input-group {margin-bottom: 20px;}
.input-field,
.slider {width: 100%;border: 1px solid #D9D9D9;border-radius: 4px;font-size: 16px;outline: none;transition: border-color 0.3s;}


.input-field:focus,
.slider:focus {border-color: brown;}

#discount-on-FMV:focus {
    outline: none;
}





.input-field-short {width: 50% !important;padding: 15px !important;margin-top: 5px !important;font-size: 14px !important;box-sizing: border-box !important;border: 1px solid #BCBCBC !important;border-radius: 5px !important;background: no-repeat !important;}
.slider-container {display: flex;align-items: center;}
.output-value {margin-left: 10px;font-weight: 600;font-size: 16px;white-space: nowrap;}
.percentage-sign {margin-left: 5px;font-weight: 600;font-size: 16px;color: #555;}
.input-with-label {display: flex;align-items: center;}
.hidden {display: none;}

.subcard-text {font-size: 14px;    margin: 0;}

.subcard-value {font-size: 24px; font-weight: 700;margin-top:5px;}

.cursor-pointer {cursor: pointer;}

.click-to-change {color: #007BFF;cursor: pointer;}
/* Add these styles to your existing CSS */
.edit-link {color: #007BFF;text-decoration: underline;cursor: pointer;}

.edit-link:hover {color: #0056b3;}

#willingness-input-container input {padding: 6px;border-radius: 4px;border: 1px solid #ccc;font-size: 14px;}

.save-btn {background-color: #007BFF;color: white;border: none;padding: 6px 12px;border-radius: 4px;cursor: pointer;}

.save-btn:hover {background-color: #0056b3;}
.modal {display: none; position: fixed; z-index: 1; left: 0;top: 0;width: 100%;height: 100%;
    overflow: auto; background-color: rgba(0, 0, 0, 0.4); }

.modal-content {    background-color: #F5F5F5;
    margin: 15% auto;
    padding: 20px;
    /* border: 1px solid #888; */
    width: 500px;
    border-radius: 8px;
    position: relative;}

/* Close Icon Button on the Top Right */
.close {color: #aaa;font-size: 28px;font-weight: bold;position: absolute; right: 10px;top: 10px;cursor: pointer;}

.close:hover,
.close:focus {color: black;text-decoration: none;cursor: pointer;}

/* Container for buttons to position them at the bottom with space between */
.modal-footer {display: flex;justify-content: space-between;margin-top: 20px; }


.closebtn {
    background-color: #d9534f;
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 4px;
    cursor: pointer;
    flex: 1; /* Allows the button to grow and align properly */
    margin-right: 10px; /* Adds space between the buttons */
}

.closebtn:hover {
    background-color: #c9302c;
}

/* Confirm Button on the Bottom Right */
.modal-btn {
    padding: 10px 20px;
    background-color: #4CAF50;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    flex: 1; /* Allows the button to grow and align properly */
    margin-left: 10px; /* Adds space between the buttons */
}

.modal-btn:hover {
    background-color: #45a049;
}

.modal-input {
    width: 100% !important;
    padding: 15px !important;
    margin-top: 5px !important;
    font-size: 14px !important;
    box-sizing: border-box !important;
    border: 1px solid #BCBCBC !important;
    border-radius: 5px !important;
    background: no-repeat !important;
}

/* Header Text Styling */
.modal h4 {
    color: #A1A5B7; 
    font-size: 14px; 
    font-weight: 500;font-family: 'Metropolis' !important;
}



.input-group {
    /*display: flex;*/
    align-items: center; /* Aligns items vertically centered */
}

.input-label {
    margin-right: 10px; font-size:14px;
}

.input-field {
    /* You can add additional styling if needed */
}


.currency-container {
    display: flex;
    gap: 10px; /* Space between the currency options */
}

/*.currency-option {
    display: flex;
    align-items: center;
    padding: 10px 20px;
    border: 1px solid #ccc;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}



.currency-option span {
    margin-left: 5px;
}

*/


@media (max-width: 600px){


.panel {
    display: flex;
    justify-content: space-between;
    gap: 30px;
    flex-direction: column;
}

.right-panel {
    width: 100%;
    padding: 14px;
}

.left-panel {
    padding: 20px;
    border-radius: 10px;
}

.input-field-short {
    width: 95% !important;
}

.final-total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: white;
    gap: 10px;
}

.subcard {
    padding: 12px;
    border-radius: 8px;
    text-align: left;
}

.subcard-QualifiedOptions {
    background-color: #6EA4D4;
    color: #fff;
    width: 40%;
}
.subcard-text {
    font-size: 10px;
    margin: 0;
}

.chart-container {
    margin-bottom: 10px;}

#willingness-label {
    font-size: 14px;
    line-height: 20px;
}


}/* End custom CSS */