.title {
    background: var(--gray-3);
    padding: .2em;
    color: white;
}

#main_content,
#menu {
    height: calc(100vh - 6rem);
    overflow-y: scroll;
}

/* 左區塊 */
#menu {
    width: 16em;
    background: var(--gray-1);
}

/* 右區塊 */
#content {
    position: relative;
    display: flex;
    height: 100%;
    flex: 1 1 calc(100vw - 17em);
    flex-direction: column;
}

.input-group {
    width: fit-content;
}

.product_desc {
    font-size: 1.1em;
    font-weight: bold;
    color: #6456B7;
}

#sortedset_table {
    position: relative;
    flex: 1 1 100%;
    width: calc(100vw - 18em);
}

#sortedset_table::-webkit-scrollbar {
    width: 0.4em;
    height: 1.2em;
}

#sortedset_table .table-tool .table-tool-th {
    background: var(--title-bg);
    border-color: var(--title-bg);
    white-space: nowrap;
}

#sortedset_table .column-date {
    font-size: 0.8em;
}

#sortedset_table .table-tool-tr > .table-tool-th:first-child,
.stn_order .table-tool-tr > .table-tool-th:nth-child(2),
.pre_accu .table-tool-tr > .table-tool-th:nth-child(2) {
    position: sticky;
    top: 0px;
    left: 0px;
    box-shadow: 3px 1px 9px #999393;
    z-index: 5;
}

#sortedset_table .table-tool-tr > .table-tool-td:first-child,
.stn_order .table-tool-tr > .table-tool-td:nth-child(2),
.pre_accu .table-tool-tr > .table-tool-td:nth-child(2) {
    position: sticky;
    left: 0px;
    background-color: #fafafa;
    box-shadow: 3px 1px 9px #999393;
}

.stn_order .table-tool-tr > div:nth-child(2),
.pre_accu .table-tool-tr > div:nth-child(2) {
    left: 50px !important;
    white-space: nowrap;
}

.loading-msg {
    position: absolute;
    display: flex;
    top: 0;
    opacity: 0.5;
    z-index: 99;
}

.stn_order .table-tool-th:nth-child(4), .stn_order .table-tool-td:nth-child(4) {
    box-shadow: -3px 0 0 black;
}

.stn_order .table-tool-th:nth-child(7), .stn_order .table-tool-td:nth-child(7) {
    box-shadow: -3px 0 0 black;
}

.stn_order .table-tool-th:nth-child(10), .stn_order .table-tool-td:nth-child(10) {
    box-shadow: -3px 0 0 black;
}

.stn_order .table-tool-th:nth-child(13), .stn_order .table-tool-td:nth-child(13) {
    box-shadow: -3px 0 0 black;
}

.stn_order .table-tool-th:nth-child(16), .stn_order .table-tool-td:nth-child(16) {
    box-shadow: -3px 0 0 black;
}

.stn_order .table-tool-th:nth-child(19), .stn_order .table-tool-td:nth-child(19) {
    box-shadow: -3px 0 0 black;
}

.stn_order .table-tool-th:nth-child(22), .stn_order .table-tool-td:nth-child(22) {
    box-shadow: -3px 0 0 black;
}

.stn_order .table-tool-th:nth-child(25), .stn_order .table-tool-td:nth-child(25) {
    box-shadow: -3px 0 0 black;
}


.table-tool .table-tool-td {
    vertical-align: middle;
}

.pre_accu .table-tool-th:nth-child(2) {
    width: 20em;
}


@media (max-width: 767.98px) {
    #main_content,
    #menu,
    #content {
        height: calc(100vh - 7.7rem);
    }

    #sortedset_table {
        width: calc(100vw - 3em);
    }

    footer {
        margin-top: 3em;
    }
}