﻿* {
    font-family: ProximaNova-Regular, sans-serif;
    color: #646464;
}

#dry-eye-tool-container {
    margin: 100px auto 100px;
    width: 60%;
}

#dry-eye-tool-container .custom-input-v2{
   text-indent: 15px;
}

#dry-eye-tool-container .display-flex.align-center.justify-center .custom-checkbox-button-v2_label::before,
#dry-eye-tool-container .display-flex.align-center.justify-center .custom-checkbox-button-v2_label::after {
    top:-7px !important;
}

.hide {
    display: none !important;
}

.custom-dropdown-v2_list-option a:hover {
    cursor: pointer !important;
}

#dry-eye-tool_patient-symptoms-input {
    height: 100%;
    resize: none !important;
}

.custom-radio-button-v2_label {
    margin-left: 0px !important;
    font-size: 14px;
}

.custom-radio-button-v2_label::before,
.custom-radio-button-v2_label::after {
    top: 20px !important;
    left: 0 !important;
    right: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important; 
}

.dry-eye-tool_step3-container {
    min-height: 45px;
}

.dry-eye-tool_chckbx-container {
    min-height: 45px;
    border: 1px solid #d8d8d8;
    border-radius: 8px;
    margin: 0 -5px 0;
}

.dry-eye-tool_title-dot-separator {
    border-bottom: 1px dashed #D8D8D8;
    margin-bottom: 13px;
}

#dry-eye-tool_table-fix-container {
    position: relative;
    height: 528px;
    max-width: 1000px;
    overflow: hidden;
    margin: 0 auto;
}

#dry-eye-tool_table-container {
    max-width: 1000px;
    height: auto;
    display: -webkit-inline-box;
    position: absolute;
}

.dry-eye-tool_treatment-table_column-container {
    width: 250px;
    height: auto;
    float: left;
}

.dry-eye-tool_treatment-table_header {
    height: 48px;
    background: #d8d8d8;
    border-right: 2px solid white;
}

.dry-eye-tool_treatment-table_item {
    height: 48px;
    background: white;
    border-right: 2px solid #d8d8d8;
    position: relative;
    padding-left: 10px;
    text-align: left;
}

.dry-eye-tool_treatment-table_item-not-offered {
    background: #f1f0f0  !important;
}

.dry-eye-tool_treatment-table_last-item {
    border-right: 2px solid white !important;
}


.dry-eye-tool_treatment-table_item span {
    margin-right: 19px;
}

.dry-eye-tool_treatment-table_item .custom-tooltip-v2.custom-tooltip-v2-gold {
    background: none;
    right: 10px;
    position: relative;
}

.dry-eye-tool_treatment-table_item .custom-tooltip-v2.custom-tooltip-v2-gold .fa-exclamation-triangle{
    top: 0px;
    position: absolute;
}

.dry-eye-tool_treatment-table-item-trash {
    position: absolute;
    right: 5px;
    cursor: pointer;
    display: none;
}

.dry-eye-tool_treatment-table_item:hover a.trash-active {
    display: block !important;
}

.red-color {
    color: #c22424 !important;
}

.button-simple-black {
    text-decoration: none !important;
    display: inline-block;
    padding: 0.375rem 1.25rem;
    line-height: 1.5;
    color: #646464 !important;
    cursor: pointer;
}

.circle-button {
    display: inline-block;
    cursor: pointer !important;
}

.secondary-color {
    color: #159F83 !important;
}

#dry-eye-tool_table-arrows {
    position: absolute;
    bottom: -40px;
    left: 0;
    right: 0;
    width: 100%;
}

#dry-eye-tool_table-details {
    position: absolute;
    bottom: -70px;
    left: 0;
    right: 0;
    width: 100%;
}

.letter_office-logo {
    width: 296px;
    height: 150px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.letter_primary-diagnosis,
.letter_secondary-diagnosis,
.letter_tertiary-diagnosis,
.letter_recommended-treatments,
.letter_patient-symptoms {
    width: 100%;
    margin-left: 30px;
    text-align: justify;
}

#dry-eye-tool_print-letter .letter_primary-diagnosis,
#dry-eye-tool_print-letter .letter_secondary-diagnosis,
#dry-eye-tool_print-letter .letter_tertiary-diagnosis,
#dry-eye-tool_print-letter .letter_recommended-treatments,
#dry-eye-tool_print-letter .letter_patient-symptoms {
    margin-right: 20px;
}

#dry-eye-tool_letters-container .generic-slider-button-v2 {
    margin: 0 8rem !important;
}

#dry-eye-tool_letters-container .generic-slider-button-v2:before, 
#dry-eye-tool_letters-container .generic-slider-button-v2:after {
    width: 10rem !important;
}

#dry-eye-tool_letters-container .generic-slider-button-v2:before {
    content: 'Patient Education' !important;
    left: -10rem !important;
}

#dry-eye-tool_letters-container .generic-slider-button-v2:after {
    content: 'Referral Letter' !important;
    right: -9rem !important;
}

#dry-eye-tool_letters-container textarea{
    text-indent: 0px !important;
    resize: none;
    height: 80px;
 }

 #dry-eye-tool_print-letter {
    position: absolute;
    width: 1600px;
    top: 0px;
    left: -5000px;
 }

 #dry-eye-tool_print-letter textarea{
    display: none !important
 }
 
 #dry-eye-tool_print-letter span.to-print.hide {
     display: block !important;
 }

.custom-html-ellipsis-container span {
    color: white !important;
}

.custom-html-ellipsis-container {
    z-index: 1;
}

/*Responsive*/
@media only screen and (max-width: 1366px) {
    #dry-eye-tool-container {
        width: 75%;
    }
}

@media only screen and (max-width: 1024px) {
    #dry-eye-tool-container {
        width: 90%;
    }

    #dry-eye-tool_table-container {
        display: contents;
    }

    #dry-eye-tool_table-fix-container {
        height: auto;
    }
}

@media only screen and (max-width: 844px) {
    .dry-eye-tool_chckbx-container .custom-radio-button-v2_label {
        height: 40px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        width: -webkit-fill-available;
    }

    #dry-eye-tool_letters-container span.font-size-25 {
        font-size: 20px;
    }

    #dry-eye-tool_configured .col-sm-3,
    #dry-eye-tool_configured .col-sm-1 {
        -ms-flex: 0 0 16.666667%;
        flex: 0 0 16.666667%;
        max-width: 16.666667%;
    }
}

@media only screen and (max-width: 768px) {
    #dry-eye-tool_letters-container span.font-size-25 {
        font-size: 18px;
    }
}

@media only screen and (max-width: 667px) {
    #dry-eye-tool_letters-container span.font-size-25 {
        font-size: 15px;
    }
}

@media only screen and (max-width: 414px) {
    #dry-eye-tool_configured,
    #dry-eye-tool_treatment-container,
    #dry-eye-tool_letters-container {
        display: none !important;
    }

    #dry-eye-tool_small-device-container {
        display: block !important;
    }

    #dry-eye-tool_configure-btn {
        margin: 20px 0px;
    }
}