@import '../../../styleConstants.scss';

.installation-scheduling-dates-container {
    padding-bottom: 1rem;

    .confirmation-dates-buttons {
        float: right;

        .install-btn-accept {
            color: $production-status-color;
        }

        .install-btn-decline {
            color: $canceled-status-color;
        }

        .install-btn-remove {
            color: $warm-grey;
        }
    }

    .installation-button {
        width: 5rem;
        margin-left: 1rem;
        height: 2rem;
        font-size: $font-size-small;
        cursor: pointer;
        background-color: $whiteColor;
        font-weight: $font-weight;
    }

    .dates-info-btn {
        margin-left: 1rem;
        cursor: pointer;
        float: right;
    }

    .dates-info-popover {
        max-width: 50rem;
    }

    .status-icon-installation-dates {
        padding-right: 3px;
    }

    .installation-date-proposed {
        cursor: default;
    }
}

.installation-scheduling-dates-container:hover {
    background-color: $hoverColor;
}

.dates-info-popover {
    .react-datepicker {
        font-family: $ProximaNova-font;
        border: none;
        border-radius: unset;
    }
}

#installation-scheduler-container {
    .document-link {
        cursor: pointer;
        word-wrap: break-word;
        font-size: $font-size-small;
        display: inline;
    }

    .set-installation-dates {
        background: $whiteColor;
    }

    .check-installation-dates {
        cursor: pointer;
        color: $blueColor;
        font-weight: $font-weight;
    }

    .subtitle {
        padding-right: 0.5rem;
        display: inline-block;
    }

    .install-date-text {
        display: inline-block;
        padding-right: 0.5rem;
    }
}

.subtitle {
    padding-top: 0.5rem;
}

.order-package-row {
    padding: 0.5rem;
}

.package-installation-row {
    padding: 0.5rem;
}

.scheduled-date-btn {
    margin-left: 0.7rem;
    cursor: pointer;
    float: right;
}

.scheduled-date-popover {
    max-width: 50rem;
}
