/* Calculator Style */
.wdt-insurance-calc.premium-insurance-calc {
    container: wdt-calc-wrapper / inline-size;
}
.wdt-calc-inner {
    display: grid;
    grid-template-columns: 1fr .6fr;
    gap: 40px; 
    align-items: flex-end;
    color: var(--wdtHeadAltColor);
}
.wdt-calc-inner i:before {
    margin: 0;
}

.wdt-calc-left { display: grid;  }
.wdt-calc-left .wdt-calc-left-header-group { display: grid; grid-template-columns: 1fr 250px; gap: 20px; margin-bottom: 40px; align-items: end; }
.wdt-calc-left .wdt-calc-left-header-group h2 { margin-bottom: 18px; margin-top: 0; }
.wdt-calc-left .wdt-calc-left-header-group p { margin-bottom: 0px; margin-top: 0; }


.wdt-calc-left .wdt-calc-form {display: grid;grid-template-columns: repeat(3, 1fr);gap: 20px;padding: 20px;
    background-color: var(--wdtTertiaryColor);border-radius: var(--wdtRadius_2X); }

.wdt-light-bg .wdt-calc-left .wdt-calc-form { background-color: var(--wdtAccentTxtColor); padding: 0px; }

.wdt-calc-left .wdt-calc-form .wdt-fields-after-validation { position: relative;
    grid-row: 2; grid-column: 1/4; display: grid; gap: 20px; grid-template-columns: .5fr 1fr 1fr; }

.wdt-calc-badge-item {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 20px;
    align-items: center;
    padding: 20px;
    text-align: left;
    margin-top: 40px;
    background-color: rgba(var(--wdtBorderColorRgb), .2);
    border-radius: var(--wdtRadius_1X);
    }

.wdt-calc-badge-item .wdt-calc-badge-icon { align-self: flex-start;
    display: inline-flex; width: clamp(4.375rem, 3.125rem + 2.6042vw, 6.25rem);/* Min-70 & Max-100 */ 
    height: clamp(4.375rem, 3.125rem + 2.6042vw, 6.25rem);/* Min-70 & Max-100 */ background: rgba(var(--wdtPrimaryColorRgb), .1); 
    border-radius: var(--wdtRadius_1X); align-items: center; justify-content: center; font-size: 36px; }
.wdt-calc-badge-item .wdt-calc-badge-icon i { display: inline-flex; margin: 0; }
.wdt-calc-badge-item .wdt-calc-badge-icon i:before { margin: 0; }

.wdt-calc-left .wdt-calc-badge-item .wdt-calc-badge-icon { font-size: clamp(2.625rem, 2.3289rem + 1.1842vw, 3.75rem); /* Min-42 & Max-60 */ }
.wdt-calc-left .wdt-calc-badge-item .wdt-calc-badge-icon i:before { margin-right: -0.05em; }

.wdt-calc-badge-item .wdt-calc-badge-title { font-weight: var(--wdtFontWeight_Alt); line-height: var(--wdtLineHeight_Alt);
    font-size: clamp(1.25rem, 1.1842rem + 0.2632vw, 1.5rem); /* Min-20 & Max-24 */ color: var(--wdtHeadAltColor); margin-bottom: 8px; }
.wdt-calc-badge-item .wdt-calc-badge-description { font-weight: var(--wdtFontWeight_Base); line-height: var(--wdtLineHeight_Base);
    font-size: var(--wdtFontWeight_Base); color: var(--wdtBodyTxtColor); }
.wdt-calc-left .wdt-calc-badge-item .wdt-calc-badge-description { max-width: 550px; }

.wdt-calc-left .wdt-calc-form .wdt-fields-after-validation.active-lock { pointer-events: none; }

.wdt-calc-left .wdt-calc-form .wdt-fields-after-validation:before,
.wdt-calc-left .wdt-calc-form .wdt-fields-after-validation:after { content: ''; }

.wdt-calc-left .wdt-calc-form .wdt-fields-after-validation:before {
    content: '\e802';
    position: absolute;
    width: 100%;
    height: 100%;
    max-width: 45px;
    max-height: 45px;
    font-size: 29px;
    font-family: "gensure-addon-icon";
    z-index: 1;
    margin: auto;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(var(--wdtHeadAltColorRgb), .1);
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(10px);
    border-radius: var(--wdtRadius_1X);
    box-shadow: 0 0 20px 5px rgba(var(--wdtHeadAltColorRgb), .1);
}

.wdt-calc-left .wdt-calc-form .wdt-fields-after-validation:after {
    position: absolute;
    width: 101%;
    height: 101%;
    pointer-events: all;
    cursor: not-allowed;
    background-color: rgba(var(--wdtAccentTxtColorRgb), .025);
    backdrop-filter: blur(2px);
    top: -5px;
    bottom: -5px;
    left: -5px;
    right: -5px;
}

.wdt-calc-left .wdt-calc-form .wdt-fields-after-validation:before,
.wdt-calc-left .wdt-calc-form .wdt-fields-after-validation:after { pointer-events: none; opacity: 0; visibility: hidden; }
.wdt-calc-left .wdt-calc-form .wdt-fields-after-validation.active-lock:before,
.wdt-calc-left .wdt-calc-form .wdt-fields-after-validation.active-lock:after { pointer-events: all; opacity: 1; visibility: visible; }

.wdt-calc-form .wdt-error-msg { color: #dc3232; font-size: calc( var(--wdtFontSize_Ext) - 2px); 
    transition: opacity 100ms ease-in-out; -webkit-transition: opacity 100ms ease-in-out; }

.wdt-calc-left .wdt-calc-form .wdt-fields-after-validation .wdt-field.coverage-field input[type="range" i]::-webkit-slider-thumb,
.wdt-calc-left .wdt-calc-form .wdt-fields-after-validation .wdt-field.coverage-field input::-moz-range-thumb {
    appearance: none; width: 15px; height: 15px; background: var(--wdtPrimaryColor); border-radius: var(--wdtRadius_Full); 
    margin: -4px; cursor: ew-resize; transform: translateX(4px); border: none; }

.wdt-calc-left .wdt-calc-form .wdt-fields-after-validation .wdt-field.coverage-field input::-moz-range-thumb { transform: translateX(0); }
.wdt-calc-left .wdt-calc-form .wdt-fields-after-validation .wdt-field.coverage-field input::-moz-range-track { height: 10px; border-radius: var(--wdtRadius_1X); }
.wdt-calc-left .wdt-calc-form .wdt-fields-after-validation .wdt-field.coverage-field input::-moz-range-progress { height: 10px; border-radius: var(--wdtRadius_1X); }

.wdt-calc-left .wdt-calc-form .wdt-fields-after-validation .wdt-field.coverage-value-display {
    display: flex; flex-flow: row wrap; justify-content: space-between; gap: 10px; }
.wdt-calc-left .wdt-calc-form .wdt-fields-after-validation .wdt-field.coverage-field { grid-row: 3; grid-column: 1/4; }

.result-val { margin-left: 4px; }

.wdt-calc-left .wdt-calc-form .wdt-fields-after-validation .wdt-field.coverage-field label,
.wdt-calc-left .wdt-calc-form .wdt-fields-after-validation .wdt-field.coverage-field .value-display { width: fit-content; }
.wdt-calc-left .wdt-calc-form .wdt-fields-after-validation .wdt-field.coverage-field input[type="range"]{ 
    height:10px; padding: 0; margin-top: 10px; margin-bottom: 10px; overflow: visible; }

.wdt-calc-left .wdt-calc-form .wdt-field { display: flex; flex-direction: column; gap: 8px; }
.wdt-calc-left .wdt-calc-form .wdt-field label { font-size: var(--wdtFontSize_Ext); font-weight: var(--wdtFontWeight_Ext); 
    color: var(--wdtHeadAltColor); letter-spacing: .02em; text-transform: capitalize; }



.wdt-calc-right {
    display: flex;
    padding: 30px;
    background-image: linear-gradient(180deg, rgba(var(--wdtPrimaryColorRgb), .15), rgba(var(--wdtPrimaryColorRgb), .05));
    border-radius: var(--wdtRadius_2X);
    height: fit-content;
    container: wdt-calc-rights / inline-size;
    }

.wdt-calc-right-wrapper { display: grid; gap: 30px; align-items: center;
    justify-content: center; text-align: center; width: 100%; grid-template-columns: 1fr; }

.wdt-calculation-wrapper { display: grid; row-gap: 15px; grid-template-columns: 1fr 0.7fr;
    align-items: center; justify-content: center; text-align: center; }

.wdt-calc-right h3 { margin: 0; width: 100%; text-align: left;
    font-size: clamp(1.375rem, 1.2434rem + 0.5263vw, 1.875rem); /* Min-22 & Max-30 */ }

.wdt-result { min-width: clamp(9.375rem, 7.7083rem + 3.4722vw, 11.875rem) /*190px - 150px*/; text-align: right; }
.wdt-result .amount {  font-size: clamp(1.375rem, 1.2434rem + 0.5263vw, 1.875rem); /* Min-22 & Max-30 */ 
    color: var(--wdtPrimaryColor); line-height: var(--wdtLineHeight_Ext); font-weight: var(--wdtFontWeight_Alt); }


.wdt-calc-calulated-result { width: 100%; display: block !important; padding: 25px; 
    background-color: var(--wdtAccentTxtColor); border-radius: var(--wdtRadius_1X);  }

.wdt-calc-calulated-life-result { display: grid; grid-template-columns: 1fr; gap: 0px; text-align: left;  }

.wdt-calc-btn-wrapper { width: 100%; text-align: center; }
.wdt-calc-btn-wrapper button { width: 100%; }

.wdt-life-result-label {
    font-size: 18px; font-weight: var(--wdtFontWeight_Alt); color: var(--wdtHeadAltColor); display: grid; 
    grid-template-columns: auto 1fr; align-items: center; gap: 15px; }
.wdt-life-result-label > i { align-self: start;
    width: 50px; height: 50px; font-size: 150%; background-color: rgba(var(--wdtSecondaryColorRgb), .07); 
    display: inline-flex; justify-content: center; align-items: center; border-radius: var(--wdtRadius_Full); }
.wdt-life-result-label > i:before { margin: 0; }
/* .wdt-life-result-value { width: 100% ;} */

.wdt-life-result-item { display: flex; align-items: baseline; justify-content: space-between; padding: 20px 0; }
.wdt-life-result-item:first-child { padding-top: 0; }
.wdt-life-result-item:last-child { padding-bottom: 0; }
.wdt-life-result-item:not(:last-child) { border-bottom: 1px solid var(--wdtBorderColor); }

.wdt-success-msg { color: green; }

.wdt-calc-right .wdt-calc-badge-item .wdt-calc-badge-title{ font-size: var(--wdtFontSize_Base); }
.wdt-calc-right .wdt-calc-badge-item {margin-top: 0;background-color: #c4f8c7;}
.wdt-calc-right .wdt-calc-badge-item .wdt-calc-badge-icon { background-color: #007400; color: var(--wdtAccentTxtColor); width: 60px; height: 60px; }


.wdt-calc-result-description-wrapper { display: inline-flex; align-items: baseline; justify-content: center; text-align: left; gap: .5em; }
.wdt-calc-result-description-wrapper p { margin: 0; }
.wdt-calc-result-description-wrapper i { font-size: var(--wdtFontSize_H6); top: 2px; position: relative; }

@container wdt-calc-rights (width < 365px) {
    .wdt-calculation-wrapper { grid-template-columns: 1fr; text-align: center; }
    .wdt-life-result-item { flex-direction: column; gap: 5px; }
    .wdt-calc-right h3 { text-align: center; }
    .wdt-result { text-align: center; }
    .wdt-calc-btn-wrapper, .wdt-calc-calulated-result { grid-column: auto; }
    .wdt-calc-calulated-life-result{ text-align: center; }
    .wdt-life-result-label{ width: 100%; grid-template-columns: 1fr; justify-items: center; }
    .wdt-life-result-value{ width: 100%; }
    .wdt-calc-btn-wrapper{ display: flex; }
    .wdt-calc-btn-wrapper .wdt-calc-btn { margin:10px auto 0; }
}
@container wdt-calc-wrapper (width < 600px) {
    .wdt-calc-left .wdt-calc-form{grid-template-columns: repeat(1, 1fr); }
    .wdt-calc-inner .wdt-calc-left{ position: relative; top:0; }
    .wdt-calc-left .wdt-calc-left-header-group { grid-template-columns: 1fr; }
    .wdt-calc-left .wdt-calc-left-header-group .wdt-calc-media-group{ display: none; }
    .wdt-calc-left .wdt-calc-form .wdt-fields-after-validation .wdt-field.coverage-field { grid-row: auto; grid-column: 1; }
    .wdt-calc-left .wdt-calc-form .wdt-fields-after-validation { position: relative; grid-row: auto; grid-column: 1; grid-template-columns: 1fr; }
    .wdt-calc-right { padding: 25px 20px; }
}
@container wdt-calc-wrapper (width < 1101px) {
    .wdt-calc-inner{ align-items: flex-start; }
    .wdt-calc-inner .wdt-calc-left{ position: sticky; top:0; }
    .wdt-calc-right { padding: 25px 20px; }
}

@media (max-width: 1024px) {
    .wdt-calc-inner { grid-template-columns: 1fr; }
    .wdt-calc-inner .wdt-calc-left{ position: relative; top:0; }
}
@media (max-width: 479px) {
    .wdt-calc-left .wdt-calc-left-header-group { grid-template-columns: 1fr; }
    .wdt-calc-left .wdt-calc-left-header-group .wdt-calc-media-group { display: none; }
    .wdt-calc-right { padding: 20px; }
    .wdt-calc-calulated-life-result{ text-align: center; }
    .wdt-life-result-label{ width: 100%; grid-template-columns: 1fr; justify-items: center; }
    .wdt-calc-badge-item { grid-template-columns: 1fr; }
    .wdt-life-result-value{ width: 100%; }
    .wdt-calc-btn-wrapper{ display: flex; }
    .wdt-calc-btn-wrapper .wdt-calc-btn{ margin: 10px auto 0; }
}