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

.process-nav {


    .process-menu {
        text-align: center;
    }

    .process-nav-div {
        display: inline-block;
        margin-left: 1rem;
        cursor: pointer;
        font-weight: $font-weight;
        color: $blueColor;
    }

    .selected-nav {
        border-bottom: $blueColor 3px solid;
        color: $title-color;
    }

    .process-nav-div:hover {
        border-bottom: $blueColor 3px solid;
    }

    .status-layer{
        display: inline-block;
        vertical-align: middle;
        border-radius: 3px;
        color: $whiteColor;
        padding: 0.2rem 1rem;
        font-size: $font-size-xsmal;
        margin-left: 0.7rem;
        font-weight: $font-weight;
    }

    .schedule-active {
        cursor: pointer;
        background-color: $whiteColor;
        color: $darkGreyColor;
        opacity: 0.8;
        border: 0.1rem $border-grey solid;
        display: inline-block;
        border-radius: $box-radius;
        font-weight: $font-weight;
    }

    .schedule-inactive {
        cursor: no-drop;
        background-color: $whiteColor;
        color: $darkGreyColor;
        opacity: 0.4;
        border: 0.1rem $border-grey solid;
        display: inline-block;
        border-radius: $box-radius;
        font-weight: $font-weight;
    }

    @media all and (max-width: 576px) {

         .process-menu {
             text-align: left;
         }
         .process-nav-div {
             margin-left: 0;
             margin-right: 1rem;
         }
     }
}
