.dark > .gantt-container .gantt .grid-header {
    fill: #252525;
    stroke: #616161;
}

.dark > .gantt-container .gantt .grid-row {
    fill: #252525;
}

    .dark > .gantt-container .gantt .grid-row:nth-child(even) {
        fill: #3e3e3e;
    }

.dark > .gantt-container .gantt .row-line {
    stroke: #3e3e3e;
}

.dark > .gantt-container .gantt .tick {
    stroke: #616161;
}

.dark > .gantt-container .gantt .today-highlight {
    opacity: 0.2;
}

.dark > .gantt-container .gantt .arrow {
    stroke: #eee;
}

.dark > .gantt-container .gantt .bar {
    fill: #616161;
    stroke: none;
}

.dark > .gantt-container .gantt .bar-progress {
    fill: #8a8aff;
}

.dark > .gantt-container .gantt .bar-invalid {
    fill: transparent;
    stroke: #c6ccd2;
}

    .dark > .gantt-container .gantt .bar-invalid ~ .bar-label {
        fill: #ececec;
    }

.dark > .gantt-container .gantt .bar-label.big {
    fill: #ececec;
}

.dark > .gantt-container .gantt .bar-wrapper:hover .bar {
    fill: #6e6e6e;
}

.dark > .gantt-container .gantt .bar-wrapper:hover .bar-progress {
    fill: #a4a4ff;
}

.dark > .gantt-container .gantt .bar-wrapper.active .bar {
    fill: #6e6e6e;
}

.dark > .gantt-container .gantt .bar-wrapper.active .bar-progress {
    fill: #a4a4ff;
}

.dark > .gantt-container .gantt .upper-text {
    fill: #a2a2a2;
}

.dark > .gantt-container .gantt .lower-text {
    fill: #f7f7f7;
}

.dark > .gantt-container .popup-wrapper {
    background-color: #333;
}

    .dark > .gantt-container .popup-wrapper .title {
        border-color: #a4a4ff;
    }

    .dark > .gantt-container .popup-wrapper .pointer {
        border-top-color: #333;
    }

.gantt-container {
    line-height: 14.5px;
}

    .gantt-container .grid-header {
        background-color: #ffffff;
        position: sticky;
        top: 0;
        left: 0;
        z-index: 10;
    }

    .gantt-container .lower-text,
    .gantt-container .upper-text {
        text-anchor: middle;
        color: #111;
    }

    .gantt-container .upper-header {
        height: 40px;
    }

    .gantt-container .lower-header {
        height: 30px;
    }

    .gantt-container .lower-text {
        font-size: 14px;
        position: absolute;
        width: fit-content;
    }

    .gantt-container .upper-text {
        position: absolute;
        width: fit-content;
        font-weight: 500;
        font-size: 16px;
    }

    .gantt-container .current-upper {
        position: fixed;
    }

    .gantt-container .side-header {
        position: fixed;
        padding: 0 10px;
        margin-right: 10px;
        background: white;
        line-height: 20px;
        font-weight: 400;
    }

    .gantt-container .today-button,
    .gantt-container .viewmode-select {
        background: #F4F5F6;
        text-align: -webkit-center;
        text-align: center;
        height: 25px;
        border-radius: 8px;
        border: none;
        color: #111;
        padding: 4px 10px;
        border-radius: 8px;
        height: 25px;
    }

    .gantt-container .viewmode-select {
        outline: none !important;
        padding: 4px 8px;
        margin-right: 4px;
        -webkit-appearance: none;
        -moz-appearance: none;
        text-indent: 1px;
        text-overflow: "";
    }

    .gantt-container .date-highlight, .gantt-container .date-highlight-est {        
        border-radius: 12px;
        position: absolute;
        display: none;
    }
    .gantt-container .date-highlight {
        background-color: yellow;
    }
    .gantt-container .date-highlight-est {
        background-color: #FFFF93;
    }

    .gantt-container .current-highlight {
        position: absolute;
        background: #2c94ec;
        width: 1px;
    }

    .gantt-container .current-date-highlight {
        background: #2c94ec;
        color: #fff;
        padding: 4px 8px;
        border-radius: 200px;
    }

.gantt {
    user-select: none;
    -webkit-user-select: none;
    position: absolute;
}

    .gantt .grid-background {
        fill: none;
    }

    .gantt .grid-row {
        fill: #ffffff;
    }

    .gantt .row-line {
        stroke: #ebeff2;
    }

    .gantt .tick {
        stroke: #EBEEF0;
        stroke-width: 0.4;
    }

        .gantt .tick.thick {
            stroke: #e0e0e0;
            stroke-width: 0.7;
        }

    .gantt .holiday-highlight {
        fill: #F9FAFA;
    }

    .gantt .arrow {
        fill: none;
        stroke: #9FA9B1;
        stroke-width: 1;
    }

    .gantt .bar-wrapper .bar {
        fill: #fff;
        stroke: #fff;
        stroke-width: 0;
        transition: stroke-width 0.3s ease;
    }

    .gantt .bar-progress {
        fill: #EBEEF0;
    }

    .gantt .bar-expected-progress {
        fill: #c4c4e9;
    }

    .gantt .bar-invalid {
        fill: transparent;
        stroke: #fff;
        stroke-width: 1;
        stroke-dasharray: 5;
    }

        .gantt .bar-invalid ~ .bar-label {
            fill: #fff;
        }

    .gantt .bar-label {
        fill: #111;
        dominant-baseline: central;
        font-family: Helvetica;
        font-size: 13px;
        font-weight: 400;
    }

        .gantt .bar-label.big {
            fill: #111;
            text-anchor: start;
        }

.bar {
    fill: #2c94ec !important; /*²`ÂÅ*/
}

.bar-est {
    fill: #94c4f4 !important; /*²LÂÅ*/
}

/*.gantt .bar-wrapper.important .bar-progress {
  fill: #2c94ec;
}*/
.gantt .bar-wrapper.important .bar-label {
    fill: #fff;
}

.gantt .bar-wrapper.important .handle {
    fill: #94c4f4;
}

    .gantt .bar-wrapper.important .handle.progress {
        fill: #fff;
    }

.gantt .handle {
    fill: #dcdce4;
    cursor: ew-resize;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease;
}

    .gantt .handle.progress {
        fill: #666;
    }

.gantt .bar-wrapper {
    cursor: pointer;
    outline: none;
}

    .gantt .bar-wrapper.active .handle {
        visibility: visible;
        opacity: 1;
    }

    .gantt .bar-wrapper .bar {
        -webkit-filter: drop-shadow(3px 3px 2px rgba(0, 0, 0, 0.7));
        filter: drop-shadow(0 0 2px rgba(17, 43, 66, 0.16));
        border-radius: 3px;
    }

    .gantt .bar-wrapper:hover .bar {
        transition: transform 0.3s ease;
    }

    .gantt .bar-wrapper:hover .date-highlight {
        display: block;
    }

.gantt .hide {
    display: none;
}

.gantt-container {
    position: relative;
    overflow: auto;
    font-size: 12px;
    height: 100%;
}

    .gantt-container .popup-wrapper {
        position: absolute;
        top: 0;
        left: 0;
        background: #171B1F;
        padding: 10px;
        border-radius: 5px;
        width: max-content;
    }

        .gantt-container .popup-wrapper.hidden {
            opacity: 0 !important;
        }

        .gantt-container .popup-wrapper .title {
            margin-bottom: 5px;
            text-align: -webkit-center;
            text-align: center;
            color: #fff;
        }

        .gantt-container .popup-wrapper .subtitle {
            color: #98A1A9 ;
        }

        .gantt-container .popup-wrapper .pointer {
            position: absolute;
            height: 5px;
            margin: 0 0 0 -5px;
            border: 5px solid transparent;
            border-bottom-color: rgba(0, 0, 0, 0.8);
        }

.handle.progress, .bar-progress {
    display: none; /*ÁôÂöi«×±ø*/
}