:root {
    --lens-light-gray: #40454b;
    --lens-dark-gray: #373944;
    --lens-dark-brown: #663800;
    --lens-american-gray: #2b391e;
    --lens-polar-grey: #373944;
    --lens-polar-brown: #664000;
    --lens-polar-g15: #2b391e;
    --lens-polar-copper: #A64C19;
    --lens-yellow: #d1c51a;
    --lens-orange: #FFA500;
    --lens-pink: #be4650;
    --lens-green: #225922;
    --lens-green-ir: #496100;
    --lens-halo-night: #b2d11a;    
  }

.gform_variation_visible .gravity-forms-section-tabs-head-container {
    display: flex;
    font-size: 0px;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    gap: 0;
}
.gform_variation_visible .gravity-forms-section-tabs-head a,
.gform_variation_visible .gravity-forms-section-tabs-head a.current {
    font-size: 0px;
    height: 5px;
    background: #ffffff;
    padding: 0;
    position: relative;
}
.gform_variation_visible .gravity-forms-section-tabs-head a::before,
.gform_variation_visible .gravity-forms-section-tabs-head a.current::before {
    content:'';
    display: block;
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height: 5px;
    background: #ff5a00;
    padding: 0;
    transition: width 0.5s ease-in-out;
}
.gravity_forms_section_tabs_enabled_wrapper .gravity-forms-section-tabs-head a.current+a::before,
.gravity_forms_section_tabs_enabled_wrapper .gravity-forms-section-tabs-head a.current+a+a::before,
.gravity_forms_section_tabs_enabled_wrapper .gravity-forms-section-tabs-head a.current+a+a+a::before,
.gravity_forms_section_tabs_enabled_wrapper .gravity-forms-section-tabs-head a.current+a+a+a+a::before,
.gravity_forms_section_tabs_enabled_wrapper .gravity-forms-section-tabs-head a.current+a+a+a+a+a::before,
.gravity_forms_section_tabs_enabled_wrapper .gravity-forms-section-tabs-head a.current+a+a+a+a+a+a::before,
.gravity_forms_section_tabs_enabled_wrapper .gravity-forms-section-tabs-head a.current+a+a+a+a+a+a+a::before,
.gravity_forms_section_tabs_enabled_wrapper .gravity-forms-section-tabs-head a.current+a+a+a+a+a+a+a+a::before,
.gravity_forms_section_tabs_enabled_wrapper .gravity-forms-section-tabs-head a.current+a+a+a+a+a+a+a+a+a::before,
.gravity_forms_section_tabs_enabled_wrapper .gravity-forms-section-tabs-head a.current+a+a+a+a+a+a+a+a+a+a::before,
.gravity_forms_section_tabs_enabled_wrapper .gravity-forms-section-tabs-head a.current+a+a+a+a+a+a+a+a+a+a+a::before {
    width:0% !important;
}

.gform_variation_visible .gravity-forms-section-tabs-head-container {
    max-width: 100%;
}
form.cart .ginput_container_fileupload,
form.cart .gfield_description{    
    font-size: 12.5px;
}
.gform_variation_visible .gravity-forms-section-tabs-head {
    padding: 0;
}
.gsection_description {
    white-space-collapse: preserve;
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    text-align: center;
    font-size: 18px;
    color: #747474;
    margin-bottom: 25px;
}

.gform_variation_visible .gform-body.gform_body {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-content: flex-start;
    justify-content: center;
    align-items: flex-start;
    flex-direction: row;
    background: #00000052;
    z-index: 999;
}
.admin-bar.gform_variation_visible .gform-body.gform_body {
    top: 32px;
    height: calc(100% - 32px);
}
.gform_variation_visible .top_label {
    background: white;
    height: 100%;
    min-width: 40vw;
    padding: 100px 40px 0;
    overflow-y: auto;
    position: relative;
    max-width: 768px;
    width: 100%;
    padding-bottom: 82px;
}

.gform_variation_visible .gravity-forms-section-tabs-head {
    min-width: 40vw;
    margin: 0 auto;
    width: 100%;
    max-width: 768px;
}
.gform_variation_visible .gsection .gform_fields {
    padding-bottom: 0;
}

.gform_variation_visible .gsection .gsection_title {
    display: block;
    text-transform: uppercase;
    text-align: center;
}
form.cart .gfield--type-html:has(.text-right) {
    position: fixed;
    bottom: 0;
    width: 100%;
    right: 0;
    left: 0;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    max-width: 768px;
    min-width: 40vw;
    margin: 0 auto;
    z-index: 10;
}
form.cart .lens-color .next.gfield--type-html:has(.text-right) {
    /* width: 50%; */
    left: 50%;
    max-width: 384px;
    min-width: 20vw;
    margin-left: 0;
}
form.cart .lens-color .next .text-right {
    justify-content: flex-end;
}
form.cart .gfield--type-html:has(.close_gform_wrapper) {
    position: absolute;
    top: 25px;
    /* width: 100%; */
    right: 40px;
    /* left: 0; */
}

form.cart .text-right{
    width: 100%;
    display: flex;
    flex-direction: row;
    padding: 20px 40px;
    background: #fff;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
}
.gform_wrapper .gfield_html:not(.check) .text-right {
    padding-top: 20px;
}
form.cart .describe-frame .text-right {
    justify-content: flex-end;
}
form.cart .close_gform_wrapper  {
    position: initial;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    padding: 5px;
    background: #fff;
}

form.cart .gfield .gfield_radio,
form.cart .gfield .gfield_checkbox {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: space-between;
    gap: 25px;
    width: 100% !important;
    margin: 0;
}
form.cart .gfield .gfield_radio .gchoice,
form.cart .gfield .gfield_checkbox .gchoice {
    flex: 0 0 100%;
    max-width: 100%;
    padding: 10px 0;
    position: relative;
}
form.cart .gfield .gfield_radio .gchoice.disabled,
form.cart .gfield .gfield_checkbox .gchoice.disabled {
    display: none;
}
form.cart .gfield--type-section:not(.sun-protection):not(.transition):not(.specialty-tints):not(.mirror-coating) .gfield .gfield_radio .gchoice:hover,
form.cart .gfield--type-section:not(.sun-protection):not(.transition):not(.specialty-tints):not(.mirror-coating) .gfield .gfield_checkbox .gchoice:hover {
    border-top: 1px solid #b2b2b2;
    border-bottom: 1px solid #b2b2b2;
    margin: -1px 0;
}

form.cart .gfield--type-section .gfield_radio .gchoice div,
form.cart .gfield--type-section .gfield_checkbox .gchoice div {
    padding: 0;
}
form.cart .gfield--type-section .gfield_radio .gchoice label,
form.cart .gfield--type-section .gfield_checkbox .gchoice label {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: nowrap;
    align-items: center;
    font-family: "canada-type-gibson", "Helvetica Neue", Helvetica, Arial, sans-serif;
    padding: 0;
    border: 0;
    background: #fff;
    text-align: left;
    font-size: 21px;
    font-weight: 600;
}
form.cart .gfield .gfield_radio .gchoice label, form.cart .gfield .gfield_checkbox .gchoice label {
    padding: 10px 10px 10px 40px;
}

form.cart .lens-color.gfield .gfield_radio [data-value="Clear"] label::after {
    content: "Free" !important;
    font-family: "canada-type-gibson", "Helvetica Neue", Helvetica, Arial, sans-serif !important; 
}
form.cart .lens-color.gfield .gfield_radio [data-value="Clear with Blue Blocker"] label::after {
    display: none !important;
}
form.cart .lens-color.gfield .gfield_radio [data-value="Clear with Blue Blocker"] .ginput_price {
    display: block !important;
}

form.cart .gfield .gfield_radio .gchoice input+label, form.cart .gfield .gfield_checkbox .gchoice input+label {
    padding: 10px;
}
form.cart .gfield.lens-type .gfield_radio .gchoice label,
form.cart .gfield.lens-material .gfield_radio .gchoice label {
    align-items: flex-start;
}

form.cart .gfield.check .ginput_container em {
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-size: 19px;
    font-weight: normal;
    margin-top: 10px;
    /* margin-bottom: 20px; */
    min-height: auto;
}

/* form.cart #field_74_272.gfield .gfield_radio .gchoice label,
form.cart #field_74_372.gfield .gfield_radio .gchoice label, */
form.cart .lens-color.gfield .gfield_radio .gchoice label {
    text-transform: uppercase;
}
/* form.cart #field_74_272.gfield input:checked+label, */
form.cart .transition.gfield input:checked+label,
/* form.cart #field_74_372.gfield input:checked+label, */
form.cart .lens-color.gfield input:checked+label{
    color: #ff5a00;
}
form.cart .sun-protection em,
form.cart .transition em,
form.cart .specialty-tints em,
/* #field_74_372 em, */
form.cart .lens-color em {
    display: block;
    color: #747474;
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-style: normal;
    font-size: 19px;
    font-weight: 400;
    text-transform: none;
}
form.cart .sun-protection .gchoice[data-value="Basic"] *::before,
form.cart .sun-protection .gchoice[data-value="Polarized"] *::before,
form.cart .specialty-tints .gchoice[data-value="Safety Tints"] *::before,
form.cart .transition .gchoice[data-value="Transition"] *::before,
/* form.cart .transition .gchoice[data-value="Transitions Xtractive Polarized"] *::before, */
/* form.cart .transition .gchoice[data-value="Transitions Xtractive"] *::before, */
/* form.cart .transition .gchoice[data-value="Transition DriveWear"] *::before, */

/* #field_74_372 *::before, */
form.cart .lens-color *::before {
    display: none;
}

/* form.cart #field_74_372.gfield .gfield_radio .gchoice .ginput_price, */
form.cart .lens-color.gfield .gfield_radio .gchoice .ginput_price {
    display: none;
}
form.cart .sun-protection.gfield .gfield_radio .gchoice[data-value="Basic"] label::after,
form.cart .sun-protection.gfield .gfield_radio .gchoice[data-value="Polarized"] label::after,
form.cart .specialty-tints.gfield .gfield_radio .gchoice[data-value="Safety Tints"] label::after,
form.cart .transition.gfield .gfield_radio .gchoice[data-value="Transition"] label::after,
/* form.cart .transition.gfield .gfield_radio .gchoice[data-value="Transitions Xtractive Polarized"] label::after, */
/* form.cart .transition.gfield .gfield_radio .gchoice[data-value="Transitions Xtractive"] label::after, */
/* form.cart .transition.gfield .gfield_radio .gchoice[data-value="Transition DriveWear"] label::after, */
/* form.cart #field_74_372.gfield .gfield_radio .gchoice label::after, */
form.cart .lens-color.gfield .gfield:not(.color-icons) .gfield_radio .gchoice label::after {
    display: block;
    content: "\F285";
    font-family: bootstrap-icons;
    font-weight: 600;
}
form.cart .sun-protection.gfield [data-value] [data-bs-toggle="modal"],
form.cart .transition.gfield [data-value] [data-bs-toggle="modal"],
form.cart .specialty-tints.gfield [data-value] [data-bs-toggle="modal"],
form.cart .mirror-coating.gfield [data-value] [data-bs-toggle="modal"] {
    display: none !important;
}
form.cart .sun-protection.gfield [data-value] input:checked+[data-bs-toggle="modal"],
form.cart .transition.gfield [data-value] input:checked+[data-bs-toggle="modal"],
form.cart .specialty-tints.gfield [data-value] input:checked+[data-bs-toggle="modal"],
form.cart .mirror-coating.gfield [data-value] input:checked+[data-bs-toggle="modal"] {
    display: flex !important;

    right: unset;
    left: 1px; 
    top: 23px;
}

form.cart .sun-protection.gfield [data-value] input:checked+[data-bs-toggle="modal"]:hover,
form.cart .transition.gfield [data-value] input:checked+[data-bs-toggle="modal"]:hover,
form.cart .specialty-tints.gfield [data-value] input:checked+[data-bs-toggle="modal"]:hover,
form.cart .mirror-coating.gfield [data-value] input:checked+[data-bs-toggle="modal"]:hover {
    left: -2px;
    top: 20px;
}
.gfield.check.check-sm [data-value] label:before {
    content: '';
    width: 30px;
    height: 30px;
    display: block;
    margin: 0 auto 0.25rem;
    background-size: 100% 100%;
    border: 2px solid #4d4c4c;
    border-radius: 100%;
    transition: height 0.25s ease, width 0.25s ease;
}
form.cart .sun-protection.gfield input:checked+label::after,
form.cart .transition.gfield input:checked+label::after,
form.cart .specialty-tints.gfield input:checked+label::after,
/* form.cart #field_74_372.gfield input:checked+label::after, */
form.cart .lens-color.gfield input:checked+label::after {
    color: #ff5a00 ;
}
/* form.cart .lens-color.gfield .gfield_radio #label_74_277_0::after {
    content: "Free";
    font-family: "canada-type-gibson", "Helvetica Neue", Helvetica, Arial, sans-serif;
} */
form.cart legend.gfield_label,
form.cart label.gfield_label {
    display: none;
}
form.cart .lens-coatings .anti-reflect legend.gfield_label {
    display: block;
    margin: 0;
    padding: 35px 0 10px;
    border-top: 1px solid #b2b2b2;
    margin-top: 35px;
    font-family: "canada-type-gibson", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 29px;
    font-weight: 600;
    text-align: center;
}

form.cart .lens-coatings .gfield .gfield_radio,
form.cart .lens-coatings .gfield .gfield_checkbox {gap: 5px; /*padding-left: 20px;*/}

form.cart .lens-coatings .gfield .gfield_radio label,
form.cart .lens-coatings .gfield .gfield_checkbox label {
    font-size: 18px;
}

form.cart .lens-coatings .gfield .gfield_checkbox {
    position: relative;
}
form.cart .gfield .gfield_checkbox label div::before {
    content: '\F584';
    display: inline-block;
    margin-right: 10px;
    font-family: bootstrap-icons;
    font-weight: 600;
    position: relative;
    top: 2px;
}

form.cart .gfield .gfield_checkbox input:checked+a+label div:before {
    content:'\F26D';
}
form.cart .gfield .gfield_checkbox [data-bs-toggle="modal"] {
    top: 22px;
}
form.cart .gfield .gfield_checkbox [data-bs-toggle="modal"]:hover {
    top: 19px;
}
form.cart .gfield.check label img {
    display: none;
}
form.cart .gfield.check .ginput_container .ginput_price {
    position: relative;
    right: initial;
    bottom: initial;
    left: initial;
    padding: 0;
    font-size: 20px;
    line-height: 20px;
    font-weight: 600;
}
form.cart .gfield.check input:checked+label *, form.cart .gfield.check input:checked+a+label * {
    color: #ff7335;
    padding: 0;
}
form.cart .gfield.check input:checked+label em, form.cart .gfield.check input:checked+a+label em {
    color: #000;
    font-weight: normal
}
form.cart .gfield.check input:checked+label .ginput_price, form.cart .gfield.check input:checked+a+label .ginput_price {
    background: initial !important;
    /* color: #000; */
}

form.cart .sun-protection .gfield.check input:checked+label .ginput_price,
form.cart .sun-protection .gfield.check input:checked+a+label .ginput_price,
form.cart .transition .gfield.check input:checked+label .ginput_price,
form.cart .transition .gfield.check input:checked+a+label .ginput_price,
form.cart .specialty-tints .gfield.check input:checked+label .ginput_price,
form.cart .specialty-tints .gfield.check input:checked+a+label .ginput_price,
form.cart .mirror-coating .gfield.check input:checked+label .ginput_price,
form.cart .mirror-coating .gfield.check input:checked+a+label .ginput_price {
    color: #000;
} 
.gform_variation_visible form.cart .gsection .gsection_title {
    display: block;
    font-family: "canada-type-gibson", "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-transform: uppercase;
    text-align: center;
    font-size: 29px;
    font-weight: 600;
}
.gform_variation_visible form.cart .product_totals .gfield:not(:has(.formattedTotalPrice )) {
    display: none !important;
}
.gform_variation_visible .product_totals .gfield .ginput_total {font-weight: 600;}

.gform_variation_visible form.cart .gsection {
    padding: 0;
    overflow: initial;
    position: initial;
    background-color: initial;
    /* z-index: 1040; */
    height: 100%;
    
    position: relative;
    top: unset !important;
    }
.gravity_forms_section_tabs_enabled_wrapper .gsection .gform_fields:has(.image-modal) {
    min-height: calc(100% - 60px);
    position: relative;
}
.gsection .gform_fields:has(.image-modal)::after {
    content: "";
    display: block;
    /* background: red !important; */
    width: 100%;
    height: 180px
}
.gfield.check [data-bs-toggle="modal"] {
    border-radius: 50%;
    width: 20px;
    height: 20px;
    padding: 0 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    align-content: center;
    flex-direction: row;
    top: 17px;
    right: initial;
    left: 10px;
    background: #fff !important;
    border: 1px solid #b2b2b2;
    color: #b2b2b2 !important;
    font-weight: 600;
    transition: all 0.25s ease;
    line-height: 16px;
}
.gfield.check [data-bs-toggle="modal"]:hover {
    color: #fff !important;
    background: #b2b2b2 !important;
    height: 26px;
    width: 26px;
    left: 7px;
    top: 15px;
    text-decoration: none;
}
.gform_variation_visible form.cart .prescription .gform_fields select.form-control {
    border: none;
    /* border-bottom: 1px solid #b2b2b2; */
    padding: 10px;
}
	.gform_variation_visible form.cart .prescription .gform_fields select.form-control[data-out-of-range="true"] {
		border: 1px solid #ff7336;
		padding: 9px;
	}
.gform_variation_visible form.cart .prescription .gform_fields .ginput_container_select {
    position: relative;
}
.gform_variation_visible form.cart .prescription .gform_fields .ginput_container_select::after {
    content:'';
    display:block;
    position: absolute;
    top: 40%;
    right:10px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='https://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 13.1l-8-8 2.1-2.2 5.9 5.9 5.9-5.9 2.1 2.2z'/%3E%3C/svg%3E");
    height: 10px;
    width: 10px;
}
.gform_variation_visible form.cart .prescription .gform_fields input[type=number]{
    border: none;
    /* border-bottom: 1px solid #b2b2b2; */
    padding: 10px;
}
.gform_variation_visible form.cart .prescription .gform_fields,
#prescription-modal .modal-body.prescription {
    max-width: 680px;
    display: grid;
    grid-template-columns: 40px 1fr 1fr 1fr 1fr 1fr 40px;
	    grid-template-rows: repeat(9, auto);
    gap: 0;
    grid-auto-flow: row;
    grid-template-areas:
        "upload upload upload upload upload upload upload"
        "pres_title pres_title pres_title pres_title pres_title pres_title pres_title"
        "pad-l . sph-t cyl-t axis-t add-t pad-r"
        "pad-l od-r sph-r cyl-r axis-r add-r pad-r"
        "pad-l os-l sph-l cyl-l axis-l add-l pad-r"
	        "pad-l . alert alert alert alert pad-r"
        "pad-l pd-t pd pd-r pd-l get-pd pad-r"
			"pad-l . pd-alert pd-alert pd-alert pd-alert pad-r"
			". other segment segment . . ."        
			". . seg_alert seg_alert seg_alert seg_alert .";
    align-items: end;
}
#btn-get-my-pd {
    grid-area: get-pd;
    padding: 8px;
    	margin: 40px 0 0;
    justify-self: flex-end;
    line-height: 18px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
}
#btn-get-my-pd:hover {
    background: #fff;
    color: #ff7336;
}

.gform_variation_visible form.cart .prescription .gform_fields h4,
#prescription-modal .modal-body.prescription h4 {
    font-family: "canada-type-gibson", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 12.5px;
    text-transform:uppercase;
    margin:0;
    /* text-align: left; */
}
	
	.prescription .alert, .prescription .seg_alert {
		padding: 0;
		border: none;
		margin: 0;
	}
	.prescription .alert {
		grid-area: alert;
	}
	.prescription .pd-alert {
		grid-area: pd-alert;
	}
	.prescription .alert #alert {
		display: flex;
		flex-direction: column;
		flex-wrap: nowrap;
	}
	.prescription .alert #alert:has(*:not(:empty)) {
		/* margin-bottom: 20px; */
	}

	.prescription .seg_alert {
		grid-area: seg_alert;
	}
	
.pad-l { grid-area: pad-l; }
.pad-r { grid-area: pad-r; }

	.prescription-upload { grid-area: upload; }
	.prescription-upload-title { grid-area: pres_title;margin-bottom: 40px; }

	.prescription-upload-title:has(+* #alert > *:not(:empty)) {
		margin-bottom: 20px;
	}
		
	.sphere-title { grid-area: sph-t; }
	.cylinder-title { grid-area: cyl-t; }
	.axis-title { grid-area: axis-t; }
	.add-title { grid-area: add-t; }

	.od-right-title { grid-area: od-r; width: 100%;padding:0; text-align: left; }
	.od-right-sphere, #od-sphere { grid-area: sph-r; width: 100%;padding:0; }
	.od-right-cylinder, #od-cyl { grid-area: cyl-r; width: 100%;padding:0; }
	.od-right-axis, #od-axis { grid-area: axis-r; width: 100%;padding:0; }
	.add-right, #od-add { grid-area: add-r; width: 100%;padding:0; }

	.os-left-title { grid-area: os-l; width: 100%;padding:0; text-align: left; }
	.od-left-sphere, #os-sphere { grid-area: sph-l; width: 100%;padding:0; }
	.od-left-cylinder, #os-cyl { grid-area: cyl-l; width: 100%;padding:0; }
	.od-left-axis, #os-axis { grid-area: axis-l; width: 100%;padding:0; }
	.add-left, #os-add { grid-area: add-l; width: 100%;padding:0; }

	.pd-title { grid-area: pd-t; width: 100%;padding:0; }
	.pd-total, .pd-wrapper { grid-area: pd; width: 100%;padding:0; }
	.pd-r, .od-pd-wrapper { grid-area: pd-r; width: 100%;padding:0; }
	.pd-l, .os-pd-wrapper { grid-area: pd-l; width: 100%;padding:0; }

	.segment-title { grid-area: other;}

	.segment-height, #segHeight { grid-area: segment; }

#prescription-modal .modal-body.prescription .pres-grid {
    padding: 10px;
    min-height: 46px;
}

	form.cart .od-right-sphere,
	form.cart .od-right-cylinder,
	form.cart .od-right-axis,
	form.cart .add-right,
	form.cart .od-left-sphere,
	form.cart .od-left-cylinder,
	form.cart .od-left-axis,
	form.cart .add-left,

	form.cart .pd-total .ginput_container_select,
	form.cart .pd-r .ginput_container_select,
	form.cart .pd-l .ginput_container_select,
#prescription-modal .modal-body.prescription .pres-grid {
    border-top: 1px solid #b2b2b2;
    border-left: 1px solid #b2b2b2;
}
	/* form.cart .os-left-title, */
	form.cart .od-left-sphere,
	form.cart .od-left-cylinder,
	form.cart .od-left-axis,
	form.cart .add-left,

	form.cart .pd-total .ginput_container_select,
	form.cart .pd-r .ginput_container_select,
	form.cart .pd-l .ginput_container_select,
    #prescription-modal .modal-body.prescription .pres-grid-b { border-bottom: 1px solid #b2b2b2; }

	form.cart .pd-title,
	#prescription-modal .modal-body.prescription .pd-title { margin-bottom: 40px; text-align: left; }

    #segHeight { border: 1px solid #b2b2b2}

	form.cart .pd-total label,
	form.cart .pd-r label,
	form.cart .pd-l label {
        display: block;
        font-size:12.5px;
        padding: 0;
        font-family: "canada-type-gibson", "Helvetica Neue", Helvetica, Arial, sans-serif;
        font-weight: 600;
        color: #000;
        text-align: center;
    }

    #prescription-modal .modal-body.prescription .sphere-title,
    #prescription-modal .modal-body.prescription .cylinder-title,
    #prescription-modal .modal-body.prescription .axis-title,
    #prescription-modal .modal-body.prescription .add-title,
	form.cart .sphere-title,
	form.cart .cylinder-title,
	form.cart .axis-title,
	form.cart .add-title { margin-bottom: 10px; text-align: center }

	form.cart .pd-total,
	form.cart .pd-r,
	form.cart .pd-l,
    #prescription-modal .modal-body.prescription .pd-wrapper,
    #prescription-modal .modal-body.prescription .od-pd-wrapper,
	#prescription-modal .modal-body.prescription .os-pd-wrapper { margin: 40px 0 0; }
	
	.segment-title, .segment-height, #segHeight {margin-top: 40px;}
    
	form.cart .segment-height .ginput_container_select {
        border: 1px solid #b2b2b2;
    }

	form.cart .od-left-axis,
	form.cart .od-right-axis,
	form.cart .pd-l .ginput_container_select,
    #prescription-modal .modal-body.prescription #os-axis,
    #prescription-modal .modal-body.prescription #od-axis,
    #prescription-modal .modal-body.prescription #os-pd { border-right: 1px solid #b2b2b2; }

	form.cart .add-right,
	form.cart .add-left,
	#prescription-modal .modal-body.prescription #od-add,
	#prescription-modal .modal-body.prescription #os-add { border-right: 1px solid #b2b2b2; border-left: none; }

/* Color Options */

form.cart .polarized-color-icons,
form.cart .color-icons,
form.cart .transition-icons,
form.cart .safety-color-icons,
form.cart .mirror-color-icons {
    display: flex;
    align-content: space-between;
    flex-direction: row;
    padding: 20px 0 0 30px;
    justify-content: flex-start;
    margin-top: 10px;
}

form.cart .polarized-color-icons,
form.cart .polarized.transition-icons,
form.cart .xtractive.transition-icons,
form.cart .drivewear.transition-icons {
    border-top: 1px solid #b2b2b2;
}


form.cart .sun-protection .color-title,
form.cart .transition .color-title,
form.cart .specialty-tints .color-title,
form.cart .mirror-coating .color-title {
    display: inline-block;
    font-family: "canada-type-gibson", "Helvetica Neue", Helvetica, Arial, sans-serif;
    padding: 0;
    border: 0;
    text-align: left;
    font-size: 20px;
    line-height: 24px;
    font-weight: 600;
    margin: 0;
    text-transform: uppercase;
    color: #000;
    margin-right: 10px;
}

form.cart .sun-protection .gfield_description,
form.cart .transition .gfield_description,
form.cart .specialty-tints .gfield_description,
form.cart .mirror-coating .gfield_description {
    color: #747474;
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-style: normal;
    font-size: 15px;
    font-weight: 400;
    text-transform: none;
    font-size: 0;
}

form.cart .gfield.color-icons .gfield_radio,
form.cart .gfield.polarized-color-icons .gfield_radio,
form.cart .gfield.safety-color-icons .gfield_radio,
form.cart .gfield.mirror-color-icons .gfield_radio,
form.cart .gfield.transition-icons .gfield_radio {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: auto !important;
    gap: 0;
    min-height: 60px;
}
form.cart .gfield.color-icons .gchoice,
form.cart .gfield.polarized-color-icons .gchoice,
form.cart .gfield.safety-color-icons .gchoice,
form.cart .gfield.mirror-color-icons .gchoice,
form.cart .gfield.transition-icons .gchoice {
    flex: 0 0 auto;
    width: auto;
    position: initial;
    padding: 0;
    transition: margin 0.15s ease-in-out, height 0.15s ease-in-out, width 0.15s ease-in-out;
}
form.cart .gfield.color-icons .gchoice label,
form.cart .gfield.polarized-color-icons .gchoice label,
form.cart .gfield.safety-color-icons .gchoice label,
form.cart .gfield.safety-color-icons .gchoice input+label,
form.cart .gfield.mirror-color-icons .gchoice label,
form.cart .gfield.mirror-color-icons .gchoice input+label,
form.cart .gfield.transition-icons .gchoice label {
    flex: 0 0 auto;
    width: auto;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    align-items: center;
    justify-content: flex-start;
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-size: 12.5px;
    width: 40px;
    position: initial;
    font-weight: 400;
    padding: 0;
}

form.cart .gfield.transition-icons .gchoice label .ginput_price,
form.cart .gfield.color-icons .gchoice label .ginput_price,
form.cart .gfield.polarized-color-icons .gchoice label .ginput_price,
form.cart .gfield.mirror-color-icons .gchoice label .ginput_price,
form.cart .gfield.safety-color-icons .gchoice label .ginput_price {
    display:none;
}
form.cart .gfield.color-icons [data-value]:hover label,
form.cart .gfield.polarized-color-icons [data-value]:hover label,
form.cart .gfield.safety-color-icons [data-value]:hover label,
form.cart .gfield.mirror-color-icons [data-value]:hover label,
form.cart .gfield.transition-icons [data-value]:hover label {
    transition: margin 0.15s ease-in-out, height 0.15s ease-in-out, width 0.15s ease-in-out;
}
form.cart .gfield.color-icons [data-value]:hover label::before,
form.cart .gfield.polarized-color-icons [data-value]:hover label::before,
form.cart .gfield.safety-color-icons [data-value]:hover label::before,
form.cart .gfield.mirror-color-icons [data-value]:hover label::before,
form.cart .gfield.transition-icons [data-value]:hover label::before {
    width: 35px;
    height: 35px;
}
form.cart .gfield.color-icons [data-value]:hover,
form.cart .gfield.polarized-color-icons [data-value]:hover,
form.cart .gfield.safety-color-icons [data-value]:hover,
form.cart .gfield.mirror-color-icons [data-value]:hover,
form.cart .gfield.transition-icons [data-value]:hover {
    margin-top: -2.5px;
    margin-bottom: -2.5px
    
}
form.cart .gfield.transition-icons .ginput_container .gchoice input+a+label .ginput_price,
form.cart .gfield.color-icons .ginput_container .gchoice input+a+label .ginput_price,
form.cart .gfield.polarized-color-icons .ginput_container .gchoice input+a+label .ginput_price,
form.cart .gfield.safety-color-icons .ginput_container .gchoice input+a+label .ginput_price,
form.cart .gfield.mirror-color-icons .ginput_container .gchoice input+a+label .ginput_price,
form.cart .gfield.transition-icons .ginput_container .gchoice input+label .ginput_price,
form.cart .gfield.color-icons .ginput_container .gchoice input+label .ginput_price,
form.cart .gfield.polarized-color-icons .ginput_container .gchoice input+label .ginput_price,
form.cart .gfield.mirror-color-icons .ginput_container .gchoice input+label .ginput_price,
form.cart .gfield.safety-color-icons .ginput_container .gchoice input+label .ginput_price {
    position: absolute;
    right: 0;
    top: 23px;
    font-family: "canada-type-gibson", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 600;
}

form.cart .gfield.color-icons .ginput_container .gchoice input:checked+a+label .ginput_price,
form.cart .gfield.polarized-color-icons .ginput_container .gchoice input:checked+a+label .ginput_price,
form.cart .gfield.safety-color-icons .ginput_container .gchoice input:checked+a+label .ginput_price,
form.cart .gfield.mirror-color-icons .ginput_container .gchoice input:checked+a+label .ginput_price,
form.cart .gfield.transition-icons .ginput_container .gchoice input:checked+a+label .ginput_price,
form.cart .gfield.color-icons .ginput_container .gchoice input:checked+label .ginput_price,
form.cart .gfield.polarized-color-icons .ginput_container .gchoice input:checked+label .ginput_price,
form.cart .gfield.safety-color-icons .ginput_container .gchoice input:checked+label .ginput_price,
form.cart .gfield.mirror-color-icons .ginput_container .gchoice input:checked+label .ginput_price,
form.cart .gfield.transition-icons .ginput_container .gchoice input:checked+label .ginput_price {
    display: block;
}

form.cart .gfield.color-icons .gchoice label div,
form.cart .gfield.polarized-color-icons .gchoice label div,
form.cart .gfield.safety-color-icons .gchoice label div,
form.cart .gfield.mirror-color-icons .gchoice label div,
form.cart .gfield.transition-icons .gchoice label div {
    /* position:absolute; */
    /* bottom: -16px; */
    white-space: nowrap;
    /* left: 50%; */
    /* transform: translateX(-50%); */
    opacity: 0;
    transition: opacity 0.25s ease;
    color:#262626;
    margin-top: 5px;
}
form.cart .gfield.transition-icons .gchoice input:checked+a+label div,
form.cart .gfield.color-icons .gchoice input:checked+a+label div,
form.cart .gfield.polarized-color-icons .gchoice input:checked+a+label div,
form.cart .gfield.safety-color-icons .gchoice input:checked+a+label div,
form.cart .gfield.mirror-color-icons .gchoice input:checked+a+label div,
form.cart .gfield.transition-icons .gchoice input:checked+label div,
form.cart .gfield.color-icons .gchoice input:checked+label div,
form.cart .gfield.polarized-color-icons .gchoice input:checked+label div,
form.cart .gfield.mirror-color-icons .gchoice input:checked+label div,
form.cart .gfield.safety-color-icons .gchoice input:checked+label div {
    color: #262626;
}

form.cart .gfield.transition-icons .gchoice input:checked+a+label div,
form.cart .gfield.color-icons .gchoice input:checked+a+label div,
form.cart .gfield.polarized-color-icons .gchoice input:checked+a+label div,
form.cart .gfield.safety-color-icons .gchoice input:checked+a+label div,
form.cart .gfield.mirror-color-icons .gchoice input:checked+a+label div,
form.cart .gfield.transition-icons .gchoice input:checked+label div,
form.cart .gfield.color-icons .gchoice input:checked+label div,
form.cart .gfield.polarized-color-icons .gchoice input:checked+label div,
form.cart .gfield.mirror-color-icons .gchoice input:checked+label div,
form.cart .gfield.safety-color-icons .gchoice input:checked+label div{
    opacity:1;
    z-index: 1;
}
form.cart .gfield.check.check-sm.transition-icons [data-value] input+a+label::before,
form.cart .gfield.check.check-sm.color-icons [data-value] input+a+label::before,
form.cart .gfield.check.check-sm.polarized-color-icons [data-value] input+a+label::before,
form.cart .gfield.check.check-sm.safety-color-icons [data-value] input+a+label::before,
form.cart .gfield.check.check-sm.mirror-color-icons [data-value] input+a+label::before,
form.cart .gfield.check.check-sm.safety-color-icons [data-value] input+label::before {
    border: none;
    /* transition: box-shadow 0.15s ease-in-out, width 0.15s ease-in-out, height 0.15s ease-in-out; */
    /* box-shadow: 0 0 0 0 #b2b2b2; */
    box-shadow: inset -3px -3px 8px rgb(0 0 0 / 40%), inset 4px 4px 5px rgb(255 255 255 / 50%);
}
form.cart .gfield.check.check-sm.transition-icons [data-value] input:checked+a+label::before,
form.cart .gfield.check.check-sm.color-icons [data-value] input:checked+a+label::before,
form.cart .gfield.check.check-sm.polarized-color-icons [data-value] input:checked+a+label::before,
form.cart .gfield.check.check-sm.safety-color-icons [data-value] input:checked+a+label::before,
form.cart .gfield.check.check-sm.mirror-color-icons [data-value] input:checked+a+label::before,
form.cart .gfield.check.check-sm.safety-color-icons [data-value] input:checked+label::before {
    border: 1px solid #b2b2b2;    
    /* border: 2px solid #fff; */
    /* box-shadow: 0 0 5px 1px #b2b2b2; */
    outline: 1px solid #000;
    /* box-shadow: 0 0 5px 1px #b2b2b2; */
}
.transition .transition-icons .ginput_container.ginput_container_radio::before,
.sun-protection .color-icons .ginput_container.ginput_container_radio::before,
.sun-protection .polarized-color-icons .ginput_container.ginput_container_radio::before,
.sun-protection .mirror-color-icons .ginput_container.ginput_container_radio::before,
.specialty-tints .safety-color-icons .ginput_container.ginput_container_radio::before  {
    /* content: 'Select Tint Color: '; */
    font-family: "canada-type-gibson", "Helvetica Neue", Helvetica, Arial, sans-serif;
    /* display: inline-flex; */
    font-size: 18px;
    text-transform: uppercase;
    font-weight: 600;
    margin-top: 3px;
}
a#btn-get-my-pd {
    /* display: none; */
}
.sun-protection .ginput_container.ginput_container_radio,
.transition .transition-icons .ginput_container.ginput_container_radio,
.specialty-tints .ginput_container.ginput_container_radio,
.mirror-coating .ginput_container.ginput_container_radio {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    align-items: flex-start;
    gap: 20px;
    /* margin-left: 30px; */
    /* justify-content: space-between; */
}
.lens-color-title {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: nowrap;
    /* align-items: center; */
    font-family: "canada-type-gibson", "Helvetica Neue", Helvetica, Arial, sans-serif;
    padding: 0;
    border: 0;
    background: #fff;
    text-align: left;
    font-size: 21px;
    font-weight: 600;
    padding: 10px 0;
}

/* End Color options */

	/* input#choice_92_272_0.gfield input:checked+label {
  margin-bottom: 20px;
	} */

.sumaWrapper {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: 40px 0;
}
.sumaFields {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: flex-start;
    justify-content: space-between;
    align-items: flex-start;
}
.sumaFields+.sumaFields {
    margin-top: 15px;
}
.sumaWrapper hr {
    margin: 0;
    color: #747474;
    height: 2px;
}
.sumaFields h4,
.sumaFields .costLO {
    font-family: "canada-type-gibson", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 21px;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 10px;
}
#sumaTotal {text-transform: capitalize;}
.sumaFields h5 {
    color: #747474;
    font-size: 16px;
    line-height: 20px;
    font-weight: 400;
    display: flex;
    flex-direction: column;
    margin: 0;
}
label > * {
    cursor: pointer;
}

.gform_variation_visible form.cart .product_totals {
    background: transparent !important;
    padding: 0;
    bottom: 0px;
    /* height: 20px; */
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: flex-start;
    border: none;
    margin: 0;
    overflow: unset;
}

.gform_variation_visible form.cart .product_totals .gfield {
    margin: -78px 0 0;
    /* position: absolute; */
    width: auto;
    display: flex !important;
    flex-direction: row;
    justify-content: flex-start;
    align-items: baseline;
    /* font-family: "canada-type-gibson", "Helvetica Neue", Helvetica, Arial, sans-serif; */
    /* font-weight: 600; */
    border: none;
    padding: 0;
}

.gform_variation_visible form.cart .product_totals legend.gfield_label {
    display: block;
    color: #000;
    font-size: 21px;
    line-height: 21px;
    text-transform: uppercase;
    margin-right: 10px;
}

.gform_variation_visible form.cart .product_totals .gform_fields {
    margin: 0 auto;
    max-width: 50%;
    min-width: 40vw;
    /* height: 10px; */
    padding: 0 40px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    justify-content: center;
    align-items: center;
		overflow: unset;
}
.gform_variation_visible form.cart .product_totals .gfield label,
.gform_variation_visible form.cart .product_totals .gfield p.price {
    display: inline-block;
    color: #1b1b1b;
    text-transform: uppercase;
    font-size: 18px;
    margin-right: 5px;
    display: flex;
    gap: 10px;
    font-weight: 400;
    font-size: 18px !important;
}
.gform_variation_visible form.cart .product_totals .gfield .formattedTotalPrice.ginput_total {
    font-family: "canada-type-gibson", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

a.btn.my-prescription {
    font-size: 14px;
    text-decoration: underline;
    color: #747474;
    padding: 0;
    border: 0;
}
a.btn.my-prescription:hover {
    color: #000;
}

/* Modal */
.modal-dialog {
    min-width: 40vw;
}
.modal-content {
    gap: 0;
    box-shadow: 0px 0px 5px 0px rgba(21, 21, 21, 0.004);
}
.image-modal {
    width: 100%;
    height: 240px;
    max-height: 20vh;
    min-height: 160px;
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
}

.gfield [data-value="Light Gray"] label:before {
    background: var(--lens-light-gray);
    opacity: 0.35;
}
.gfield [data-value="Dark Gray"] label:before {
    background: var(--lens-dark-gray);
    opacity: 0.85;
}
.gfield [data-value="Dark Brown"] label:before {
    background: var(--lens-dark-brown);
    opacity: 0.8;
}
.gfield [data-value="American Gray G-15"] label:before {
    background: var(--lens-american-gray);
    opacity: 0.8;
}
.gfield [data-value="Polarized G15"] label:before {
    background: var(--lens-polar-g15);
    opacity: 0.8;
}
.gfield [data-value="Polarized Copper"] label:before {
    background: var(--lens-polar-copper);
    opacity: 0.8;
}
.gfield [data-value="yellow"] label:before {
    background: var(--lens-yellow);
    opacity: 0.55;
}
.gfield [data-value="orange"] label:before {
    background: var(--lens-orange);
    opacity: 0.55;
}
.gfield [data-value="Light Pink"] label:before {
    background: var(--lens-pink);
    opacity: 0.45;
}
.gfield [data-value="Green IR"] label:before {
    background: var(--lens-green-ir);
    opacity: 0.85;
}
.gfield [data-value="Green IR Shade 3.0"] label:before {
    background: var(--lens-green-ir);
    opacity: 0.8;
}
.gfield [data-value="Halo Night"] label:before {
    background: var(--lens-halo-night);
    opacity: 0.35;
}

.gfield [data-value="Transition Graphite Green"] label:before {
    background: linear-gradient(
        to right,
        #e8f2ed 50%,   /* light Graphite Green */
        #1c3227 50%    /* fully activated Graphite Green */
    );
    opacity: 0.8;
}

.gfield [data-value="Transition Amber"] label:before {
    background: linear-gradient(
        to right,
        #f5eadd 50%,   /* light Amber */
        #6a2901 50%
    );
    opacity: 0.8;
}

.gfield [data-value="Transition Amethyst"] label:before {
    background: linear-gradient(
        to right,
        #ece9f0 50%,   /* light Amethyst */
        #2f1e31 50%
    );
    opacity: 0.8;
}

.gfield [data-value="Transition Emerald"] label:before {
    background: linear-gradient(
        to right,
        #e2f6ea 50%,   /* light Emerald */
        #015433 50%
    );
    opacity: 0.8;
}

.gfield [data-value="Transition Sapphire"] label:before {
    background: linear-gradient(
        to right,
        #e7edf3 50%,   /* light Sapphire */
        #183448 50%
    );
    opacity: 0.8;
}

.gfield [data-value="Transition Ruby"] label:before {
    background: linear-gradient(
        to right,
        #f3e5ea 50%,   /* light Ruby */
        #441429 50%
    );
    opacity: 0.8;
}



.lens-color-image {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    width: calc(100% - 80px);
    margin: 0 auto;
    height: 100%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(/wp-content/uploads/2024/10/Lens-default2.png);
}
.lens-color-image svg {
    height: 100%;
    width: auto;
}
.lens-color-image .lens-overlay {
    mix-blend-mode: multiply;
    opacity: 0.85;
    stroke: #00000045;
    stroke-width: 0.25;
    fill: #ffffff;
    transition: fill 0.6s ease-in-out, opacity 0.6s ease-in-out;
  }

.lens-color-image[data-value="Polarized Gray 3"] .lens-overlay {
    fill: #555555;
    opacity: 0.85;
    fill: var(--lens-polar-grey);
}
.lens-color-image[data-value="Polarized Brown 3"] .lens-overlay {
    fill: #6B4B36;
    opacity: 0.85;
    fill: var(--lens-polar-brown);
}
.lens-color-image[data-value="Polarized G15"] .lens-overlay {
    fill: #6B4B36;
    opacity: 0.85;
    fill: var(--lens-polar-g15);
}
.lens-color-image[data-value="Polarized Copper"] .lens-overlay {
    fill: #6B4B36;
    opacity: 0.85;
    fill: var(--lens-polar-copper);
}
.lens-color-image[data-value="Light Gray"] .lens-overlay {
    fill: #D3D3D3;
    opacity: 0.4;
    fill: var(--lens-light-gray);
    opacity: 0.25;
}
.lens-color-image[data-value="Dark Gray"] .lens-overlay {
    fill: #4A4A4A;
    opacity: 0.8;
    fill: var(--lens-dark-gray);
}
.lens-color-image[data-value="American Gray G-15"] .lens-overlay {
    fill: #4B585E;
    opacity: 0.85;
    fill: var(--lens-american-gray);
    opacity: 0.76;
}
.lens-color-image[data-value="Dark Brown"] .lens-overlay {
    fill: #7B3E2B;
    opacity: 0.8;
    fill: var(--lens-dark-brown);
    opacity: 0.75;
}
.lens-color-image[data-value="Dark Green"] .lens-overlay {
    fill: var(--lens-green);
    opacity: 0.85;
}
.lens-color-image[data-value=Orange] .lens-overlay {
    fill: var(--lens-orange);
    opacity: 0.5;
}
.lens-color-image[data-value=Yellow] .lens-overlay {
    fill: #FFFF99;
    opacity: 0.4;
    fill: var(--lens-yellow);
    opacity: 0.45;
}
.lens-color-image[data-value="Light Pink"] .lens-overlay {
    fill: #FFC0CB;
    opacity: 0.4;
    fill: var(--lens-pink);
    opacity: 0.30;
}
.lens-color-image[data-value="Green IR"] .lens-overlay {
    fill: var(--lens-green-ir);
    opacity: 0.85;
}
.lens-color-image[data-value="Green IR Shade 3.0"] .lens-overlay {
    fill: var(--lens-green-ir);
    opacity: 0.8;
}
.lens-color-image[data-value="Halo Night"] .lens-overlay {
    fill: var(--lens-halo-night);
    opacity: 0.3;
}

.lens-color-image[data-value=DriveWear] .lens-overlay {
    animation: drivewear 6s ease-in-out 0.65s infinite alternate;
}
.lens-color-image[data-value="Transition Xtractive Gray"] .lens-overlay {
    animation: xtractiveGray 6s ease-in-out 0.65s infinite alternate;
}
.lens-color-image[data-value="Transition Xtractive Brown"] .lens-overlay {
    animation: xtractiveBrown 6s ease-in-out 0.65s infinite alternate;
}
.lens-color-image[data-value="Transitions Xtractive Polarized"] .lens-overlay {
    animation: transitionXtractivePolarized 6s ease-in-out 0.65s infinite alternate;
}
.lens-color-image[data-value="Transition Brown"] .lens-overlay {
    animation: transitionBrown 6s ease-in-out 0.65s infinite alternate;
}
.lens-color-image[data-value="Transition Gray"] .lens-overlay {
    animation: transitionGray 6s ease-in-out 0.65s infinite alternate;
}

.lens-color-image[data-value="Transition Graphite Green"] .lens-overlay {
    animation: transitionGraphiteGreen 6s ease-in-out 0.65s infinite alternate;
}
.lens-color-image[data-value="Transition Amethyst"] .lens-overlay {
    animation: transitionAmethyst 6s ease-in-out 0.65s infinite alternate;
}
.lens-color-image[data-value="Transition Amber"] .lens-overlay {
    animation: transitionAmber 6s ease-in-out 0.65s infinite alternate;
}
.lens-color-image[data-value="Transition Sapphire"] .lens-overlay {
    animation: transitionSapphire 6s ease-in-out 0.65s infinite alternate;
}
.lens-color-image[data-value="Transition Emerald"] .lens-overlay {
    animation: transitionEmerald 6s ease-in-out 0.65s infinite alternate;
}
.lens-color-image[data-value="Transition Ruby"] .lens-overlay {
    animation: transitionRuby 6s ease-in-out 0.65s infinite alternate;
}

.lens-color-image[data-value="PhotoGray Extra"] .lens-overlay {
    animation: transitionGray 6s ease-in-out 0.65s infinite alternate;
}
.lens-color-image[data-value="PhotoBrown Extra"] .lens-overlay {
    animation: transitionBrown 6s ease-in-out 0.65s infinite alternate;
}
  
  @keyframes transitionGray {
    0% {
      fill: #E6E6E6;
      opacity: 0.3;
    }
    50% {
      fill: #999999;
      opacity: 0.6;
    }
    100% {
      fill: #4F4F4F;
      opacity: 0.9;
    }
  }
  
  @keyframes transitionBrown {
    0% {
      fill: #F5E1C8;
      opacity: 0.3;
    }
    50% {
      fill: #C1886B;
      opacity: 0.6;
    }
    100% {
      fill: #8B5E3C;
      opacity: 0.85;
    }
  }

  @keyframes transitionGraphiteGreen {
    0% {
        fill: #f3f7f3;
        opacity: 0.3;
    }
    50% {
        fill: #527a5f;
        opacity: 0.6;
    }
    100% {
        fill: #1c3227;
        opacity: 0.85;
    }
}
@keyframes transitionAmethyst {
    0% {
        fill: #f8f7fb;
        opacity: 0.3;
    }
    50% {
        fill: #877396;
        opacity: 0.6;
    }
    100% {
        fill: #2f1e31;
        opacity: 0.85;
    }
}
@keyframes transitionAmber {
    0% {
        fill: #fcf4e6;
        opacity: 0.3;
    }
    50% {
        fill: #bc8548;
        opacity: 0.6;
    }
    100% {
        fill: #6a2901;
        opacity: 0.85;
    }
}
@keyframes transitionSapphire {
    0% {
        fill: #f3f7fa;
        opacity: 0.3;
    }
    50% {
        fill: #6b8bb3;
        opacity: 0.6;
    }
    100% {
        fill: #183448;
        opacity: 0.85;
    }
}
@keyframes transitionEmerald {
    0% {
        fill: #f2f9f5;
        opacity: 0.3;
    }
    50% {
        fill: #34a76c;
        opacity: 0.6;
    }
    100% {
        fill: #015433;
        opacity: 0.85;
    }
}
@keyframes transitionRuby {
    0% {
        fill: #f9f6f7;
        opacity: 0.3;
    }
    50% {
        fill: #a15471;
        opacity: 0.6;
    }
    100% {
        fill: #441429;
        opacity: 0.85;
    }
}

  @keyframes xtractiveGray {
    0% {
      fill: #CCCCCC;
      opacity: 0.2;
    }
    50% {
      fill: #707070;
      opacity: 0.6;
    }
    100% {
      fill: #2A2A2A;
      opacity: 0.9;
    }
  }
  
  @keyframes xtractiveBrown {
    0% {
      fill: #EFE3D0;
      opacity: 0.2;
    }
    50% {
      fill: #AF8063;
      opacity: 0.6;
    }
    100% {
      fill: #7F5D40;
      opacity: 0.9;
    }
  }
  
  @keyframes drivewear {
    0% {
      fill: #A1A36B;
      opacity: 0.63;
    }
    50% {
      fill: #A64C19;
      opacity: 0.75;
    }
    100% {
      fill: #5E2B16;
      opacity: 0.85;
    }
  }
  @keyframes transitionXtractivePolarized {
    0% {
        fill: #ffffff; /* Clear */
        opacity: 0.5;
    }
    25% {
        fill: #d7d8d7; /* Low light state */
        opacity: 0.63;
    }
    50% {
        fill: #737d82; /* Daylight state */
        opacity: 0.85;
    }
    75% {
        fill: #404a4e; /* Bright light state */
        opacity: 0.9;
    }
    100% {
        fill: #303c43; /* Full polarized */
        opacity: 0.95;
    }
}

[data-value="Blue Mirror Coating"] label::before {
    background: linear-gradient(0deg, #4760ff 0%, #0dccff 100%);
    background: linear-gradient(45deg, #00d4ff, #00a6ff, #006bff, #003d99);

}
[data-value="Red Mirror Coating"] label::before {
    background: linear-gradient(0deg, #d80801 0%, #d57508 100%);
    background: linear-gradient(45deg, #ff9c00, #ff4c00, #ff1a3e, #d40026);
}
[data-value="Green Mirror Coating"] label::before {
    background: linear-gradient(0deg, #17ce24 0%, #2bcebc 100%);
    background: linear-gradient(45deg, #00a74a, #00b48c, #0094a3, #007f72);
}
[data-value="Silver Mirror Coating"] label::before {
    background: linear-gradient(0deg, #949494 0%, #f6f6f6 100%);
    background: linear-gradient(45deg, #e6e6e6, #c0c0c0, #f0f0f0, #a0a0a0);

}
[data-value="Gold Mirror Coating"] label::before {
    background: linear-gradient(0deg, #d68723 0%, #ffe578 100%);
    background: linear-gradient(45deg, #ffd700, #ffe066, #f9b800, #b38700);

}

.lens-color-image[data-value="Blue Mirror Coating"] .lens-overlay {
    fill: url(#blueMirrorGradient);
    opacity: 0.85;
}

.lens-color-image[data-value="Red Mirror Coating"] .lens-overlay {
    fill: url(#redMirrorGradient);
    opacity: 0.85;
}

.lens-color-image[data-value="Green Mirror Coating"] .lens-overlay {
    fill: url(#greenMirrorGradient);
    opacity: 0.85;
}

.lens-color-image[data-value="Silver Mirror Coating"] .lens-overlay {
    fill: url(#silverMirrorGradient);
    opacity: 0.85;
}

.lens-color-image[data-value="Gold Mirror Coating"] .lens-overlay {
    fill: url(#goldMirrorGradient);
    opacity: 0.85;
}
@media (max-width: 782px) {
    .gform_variation_visible .offcanvas.show {
        display: none;
    }

    .gform_variation_visible #google-merchantwidget-iframe-wrapper {
        display: none;
    }

    .modal-backdrop.fade.show {
        display: none;
    }
    .gform_variation_visible #launcher {
        display: none;
    }
	.gform_variation_visible .top_label {
        padding: 65px 15px 82px;
        padding: 65px 0px 15px;
        max-width: 100vw;
        
        height: 100%;
        overflow: unset;
    }
    .gform_variation_visible .content a.btn:not(:empty) {
        padding: 12px 18px 10px;
    }
    .gform_variation_visible form.cart .prescription .gform_fields, #prescription-modal .modal-body.prescription {
        grid-template-columns: 0 1fr 1fr 1fr 1fr 1fr 0;
    }
    form.cart .gfield--type-html:has(.close_gform_wrapper) {
        right: 15px;
    }
    .gform_variation_visible form.cart .product_totals .gform_fields {
        min-width: 100%;
        /* padding-left: 85px; */
        padding: 0 20px;
    }
    
    .gform_variation_visible form.cart .product_totals .gfield {
        margin-top: -78px;
        /* flex-direction: column; */
    }
    .gform_variation_visible form.cart .product_totals legend.gfield_label {
        /* display: none; */
        font-size:16px;
    }
    form.cart .lens-coatings .gfield .gfield_radio label, form.cart .lens-coatings .gfield .gfield_checkbox label {
        font-size: 16px;
    }
    .gform_variation_visible .product_totals .gfield .ginput_total {
        font-size: 16px;
    }
    .image-modal {
        bottom: 20px;
        height: 200px;
    }
    form.cart .text-right {
        padding: 20px 15px;
        justify-content: space-between;
    }
    form.cart .describe-frame .text-right {
        justify-content: flex-end;
    }
    form.cart .gfield--type-html:has(.text-right) {
        border-top: 1px solid;
        position: fixed;
    }
    .gform_variation_visible form.cart .gsection {
        padding: 0 15px 82px;
        overflow-y: auto;
        overflow-x: hidden;
    }
    .gform_variation_visible form.cart .gsection .gsection_title {
        font-size: 24px;
    }
    .gsection_description {
        font-size: 16px;
    }
    form.cart .polarized-color-icons::after,
    form.cart .color-icons::after,
    form.cart .transition-icons::after,
    form.cart .safety-color-icons::after,
    form.cart .mirror-color-icons::after {
        display: block;
        content:'';
        width: 70px;
        height: 10px;
        display: none;
    }
    form.cart .sun-protection .gfield_description,
    form.cart .transition .gfield_description,
    form.cart .specialty-tints .gfield_description,
    form.cart .mirror-coating .gfield_description {
        flex: 0 1;
    }
    form.cart .gfield.color-icons .gchoice label div,
    form.cart .gfield.polarized-color-icons .gchoice label div,
    form.cart .gfield.safety-color-icons .gchoice label div,
    form.cart .gfield.mirror-color-icons .gchoice label div,
    form.cart .gfield.transition-icons .gchoice label div {
        height: 0px;
        transition: height 0.25s ease;
    }
    form.cart .gfield.transition-icons .gchoice input:checked+a+label div,
    form.cart .gfield.color-icons .gchoice input:checked+a+label div,
    form.cart .gfield.polarized-color-icons .gchoice input:checked+a+label div,
    form.cart .gfield.safety-color-icons .gchoice input:checked+a+label div,
    form.cart .gfield.mirror-color-icons .gchoice input:checked+a+label div,
    form.cart .gfield.transition-icons .gchoice input:checked+label div,
    form.cart .gfield.color-icons .gchoice input:checked+label div,
    form.cart .gfield.polarized-color-icons .gchoice input:checked+label div,
    form.cart .gfield.mirror-color-icons .gchoice input:checked+label div,
    form.cart .gfield.safety-color-icons .gchoice input:checked+label div {
        /* font-size: 14px; */
        position: absolute;
        bottom: 0;
        bottom: 25px;
        left: 25px;
    }
    
    form.cart .polarized-color-icons,
    form.cart .color-icons, form.cart .transition-icons,
    form.cart .safety-color-icons,
    form.cart .mirror-color-icons {
        padding: 20px 0 0 25px;
        flex-direction: column;
    }
    form.cart .gfield.color-icons .gchoice label div,
    form.cart .gfield.polarized-color-icons .gchoice label div,
    form.cart .gfield.safety-color-icons .gchoice label div,
    form.cart .gfield.mirror-color-icons .gchoice label div,
    form.cart .gfield.transition-icons .gchoice label div {
        margin-top: 0px;
    }
    form.cart .gfield .gfield_radio, form.cart .gfield .gfield_checkbox {
        gap: 0;
    }
    form.cart .gfield .gfield_radio .gchoice label, form.cart .gfield .gfield_checkbox .gchoice label,
    form.cart .gfield.check .ginput_container .ginput_price,
    .sumaFields h4, .sumaFields .costLO {
        font-size: 18px;
        gap: 10px;
    }

    .lens-color-image {
        width: calc(100% - 40px);
    }
    form.cart .gfield.check .ginput_container em,
    form.cart .sun-protection em, form.cart .transition em, form.cart .specialty-tints em,
    /* #field_74_372 em, */
    form.cart .lens-color em {
        font-size: 16px;
    }
    li.lens-color-title *:not(em) {
        margin-right: 70px;
    }
    form.cart .gfield--type-section:not(.sun-protection):not(.transition):not(.specialty-tints):not(.mirror-coating) .gfield .gfield_radio .gchoice:not(:last-child),
    form.cart .gfield--type-section:not(.sun-protection):not(.transition):not(.specialty-tints):not(.mirror-coating) .gfield .gfield_checkbox .gchoice:not(:last-child),
    form.cart .gfield--type-section:not(.sun-protection):not(.transition):not(.specialty-tints):not(.mirror-coating) .gfield .gfield_radio .gchoice:hover,
    form.cart .gfield--type-section:hover:not(.sun-protection):not(.transition):not(.specialty-tints):not(.mirror-coating) .gfield .gfield_checkbox .gchoice:hover {
        border-top: none;
        border-bottom: 1px solid #b2b2b2;
        margin: -1px 0;
        gap:0;
    }
    form.cart .gfield.color-icons .gfield_radio,
    form.cart .gfield.polarized-color-icons .gfield_radio,
    form.cart .gfield.safety-color-icons .gfield_radio,
    form.cart .gfield.transition-icons .gfield_radio {
        /* width: 70% !important; */
        justify-content: flex-end;
        transition: height 0.25s ease;
        min-height: 0px;
    }
    form.cart .gfield.color-icons .gfield_radio:has(input:checked),
    form.cart .gfield.polarized-color-icons .gfield_radio:has(input:checked),
    form.cart .gfield.safety-color-icons .gfield_radio:has(input:checked),
    form.cart .gfield.transition-icons .gfield_radio:has(input:checked) {
        min-height: 70px;
    }


    form.cart .gfield.color-icons .gchoice label,
    form.cart .gfield.polarized-color-icons .gchoice label,
    form.cart .gfield.safety-color-icons .gchoice label,
    form.cart .gfield.safety-color-icons .gchoice input+label,
    form.cart .gfield.mirror-color-icons .gchoice label,
    form.cart .gfield.mirror-color-icons .gchoice input+label,
    form.cart .gfield.transition-icons .gchoice label {
        /* width: 37px; */
    }

    form.cart .gfield.lens-coatings .anti-reflect legend.gfield_label {
        border: none;
        margin: 0;
        font-size: 24px;
    }
    .sumaWrapper {
        gap: 20px 0;
    }
}

.gform_wrapper .gsection .gform_button +#gform_ajax_spinner_92 {
    position: absolute;
    right: calc(0px + 96px);
}
[data-value="Frame Only"],
[data-value="Plano"] {
    display: none;
	}
option[data-out-of-range] {
    color: #333333;
    background: #FFE5E5;
}
.prescription-upload .gform_drop_instructions {
    display: none;
}

.prescription-upload {
    position: relative;
}

.prescription-upload button.gform_button_select_files {
    background: #ff7336;
    border: none;
    border-right: 1px solid #000;
    padding: 12px;
}
.prescription-upload .ginput_preview_list {
    position: absolute;
    top: 0;
    left: 130px;
    width: calc(100% - 130px);
}

.prescription-upload .ginput_preview_list .ginput_preview {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    height: 50px;
    align-items: center;
}

.prescription-upload .ginput_preview_list .gfield_fileupload_filename {
    flex: 1 1 auto;
}
.prescription-upload .ginput_preview_list .gfield_fileupload_filesize {
    display: none;
}
.prescription-upload .gform_drop_area {
    position: relative;
    border: 1px solid;
}

.prescription-upload button.gform_delete_file {
    height: 100%;
    border: 1px solid;
    width: 50px;
    background: #ff7336;
}

.prescription-upload button.gform_delete_file .dashicons-trash {
     color: #fff;
 }
.prescription-upload .gfield_validation_message {
    display: none;
}
.prescription .hidden {
    display: none;
}
.prescription-upload input[aria-hidden="true"] {
    pointer-events: none;
}
