﻿#horizon-menu {
    position: absolute;
    width: 100%;
    top: 70px;
    left: 0;
    z-index: 11;
}

#horizon-menu > nav {
    position: fixed;
    width: 100%;
    background: #f4f6f9;
}

section.section-introduction {
    margin-top: 5em;
}

#horizon-menu .navbar-light .navbar-nav .nav-link {
    color: rgba(0,0,0,.5) !important;
}

#horizon-menu.hdr-nav-bar .navbar .navbar-nav > li + li{
    border-left: 1px solid #fff;
}

#horizon-menu.hdr-nav-bar .navbar .navbar-nav > li.active > a {
    border-color: #398bf7;
    color: #398bf7 !important;
    background-color: transparent;
}

#horizon-menu.hdr-nav-bar .navbar .navbar-nav > li > a {
    padding: 25px 5px;
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
    border-bottom: 2px solid transparent;
}

.add-border{
    box-shadow: 1px 0 0 0 #ddd,
        0 1px 0 0 #ddd,
        1px 2px 0 0 #ddd,
        1px 0 0 0 #ddd inset,
        0 1px 0 0 #ddd inset;
}

.patient-img {
    width: auto;
    height: 130px;
    text-align: center;
    margin-top: 1em;
}

.patient-img img{
    width: auto;
    height: 100%;
}

#medication-tbl_filter{
    display: none;
}

.btn.btn-dropbox.active {
    color: #007ee5;
    background: #fff;
    border: 1px solid #007ee5;
    pointer-events: none;
}

.btn.btn-opd {
    background: #68a8e9;
    color: #fff;
}

    .btn.btn-opd.active {
        color: #68a8e9;
        background: #fff;
        border: 1px solid #68a8e9;
        pointer-events: none;
    }

.btn.btn-ipd {
    background: #7fd7f9;
    color: #fff;
}

    .btn.btn-ipd.active {
        color: #7fd7f9;
        background: #fff;
        border: 1px solid #7fd7f9;
        pointer-events: none;
    }

#search-patient .form-group{
    height: 35px;
}

    #search-patient .form-group .form-control {
        min-height: 35px;
    }

/*----------------------  DATATABLE DEFAULT STYLE ----------------------*/
#table-view-section .pagination .page-item {
    border: none;
}

#table-view-section .page-item .page-link {
    padding: .5rem .75rem;
    color: #007bff;
    background-color: #fff;
    border: 1px solid #dee2e6;
}

#table-view-section .page-item.active .page-link {
    color: #fff;
    background-color: #007bff;
    border-color: #007bff;
    -webkit-box-shadow: none;
}

#table-view-section .pagination .page-item.disabled .page-link {
    color: #868e96;
}

/*---------------------- MINE CHART ----------------------*/
.mine-chart {
    width: 100%;
    position: relative;
    overflow: hidden;
    margin: 2em 0;
}

.mine-ct-xaxis {
    width: 100%;
    height: auto;
    display: flex;
}

.yaxis-tile-scale {
    width: 80%;
    margin-left: 10%;
}

    .yaxis-tile-scale > ul {
        margin-bottom: 0;
        padding-inline-start: 15px;
        padding-inline-end: 15px;
        width: 100%;
        display: flex;
    }

        .yaxis-tile-scale > ul > li {
            list-style: none;
            text-align: center;
        }

.yaxis-column {
    float: left;
    position: relative;
    display: flex;
    align-items: center;
}

    .yaxis-column.line-label {
        width: 10%;
    }

    .yaxis-column.line-progress {
        width: 80%;
        padding: 0 20px;
    }

.progress-chart-group {
    background: #E1ECF4;
    padding: 1.5rem 0;
    width: 100%;
    position: relative;
    display: none;
}

    .progress-chart-group > .inner-line {
        position: relative;
        background: #68a8e9;
        border: 1.5px solid #0c8eeb;
        height: 20px;
        width: 0;
        border-radius: 2px;
    }

        .progress-chart-group > .inner-line:hover{
            transition: 0.5s all ease;
            cursor:pointer;
            opacity:0.6;
        }

            .progress-chart-group > .inner-line:hover > div {
                color: #000;
            }

            .progress-chart-group > .inner-line > div {
                position: absolute;
                display: table;
                bottom: 20px;
            }

            .progress-chart-group > .inner-line > div:nth-of-type(2):before {
                content: '';
                position: absolute;
                z-index: 11;
                width: 1.25em;
                height: 1.25em;
                top: 25px;
                left: -0.625rem;
                transform: rotateZ(45deg);
                background: #68a8e9;
                border: 1.5px solid #0c8eeb;
                border-bottom: 0;
                border-right: 0;
            }

    .progress-chart-group .label-hoving {
        display: none;
        background: #def4ff;
        z-index: 12;
        position: absolute;
        padding: 5px;
        border: 1.5px solid #8bd8f5;
        border-radius: 2px;
    }

    .progress-chart-group .layer-line {
        position: absolute;
        top: 14px;
        height: 40px;
        border-left: 1px dotted #65b9e0;
    }

        .progress-chart-group .layer-line:after {
            content: '';
            width: 7px;
            height: 7px;
            background: #2382b9;
            border-radius: 50%;
            position: absolute;
            top: calc(50% - 3.5px);
            left: -4.5px;
        }

p.progress-stack-unit {
    height: 100%;
    margin-bottom: 0;
    background: #7fd7f9;
}

.xaxis-tile {
    margin-bottom: 20px;
}
