.employee-details-container {
    display: flex;
    // gap: 3.5rem;
    gap: calc(3.5rem + 2vw);

    .details {
        max-width: 985px;
        flex-grow: 1;

        .margin-class {
            margin-bottom: 5rem;
        }
    }

    .records {
        .user-form {
            margin-bottom: 20px !important;
        }
        max-width: 460px;
        flex-grow: 1;
            .records-section {
                margin-bottom: 3.8rem;
                .section-title {
                margin-bottom: 1.1rem;
            }
            .no-content {
                margin-top: 2rem;
                font-size: 1.4rem;
                color: #707070;
            }
        }

        .deltio-box {
            max-height: 100px;
        }
    }

    .margin-upload-box {
        margin-bottom: 25px;
    }

    .request-container {
        .rendered-date-time {
            // margin-left: -17px;
            input {
                padding-left: 40px !important;
            }
        }
        .request-title-container {
            display: flex;
            align-items: center;
            gap: 0.85rem;
            margin-bottom: 2.8rem;

            .request-title {
                font-size: 1.2rem;
                font-weight: bold;
                color: #040059;
            }
        }

        .request-details-container {
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 2.8rem;

            .request-operator {
                display: flex;
                align-items: center;
                gap: 0.6rem;

                p {
                    font-size: 1.6rem;
                    font-weight: lighter;
                    color: #707070;
                }
            }

            .request-status-container {
                margin: 0rem;
                min-width: 100px;
                text-align: center;
                padding: 1rem;
                border-radius: 1.5rem;
                color: white;
                font-size: 0.9rem;
            }

            
        }

        .request-dates-container {
            display: flex;
            align-items: center;
            margin-bottom: 0rem;
        }

        .net-support {
            justify-content: space-between;
        }

        .dpass {
            gap: 2rem;
        }

        .extra-margin-bottom {
            margin-bottom: 2.8rem;
        }
    }

    .scheduled-action-container {
        .rendered-date-time {
            input {
                padding-left: 40px !important;
            }
        }
        .scheduled-action-details-container {
            display: flex;
            align-items: flex-end;
            justify-content: space-between;
            margin-bottom: 0rem;

            .scheduled-action-dates-container {
                flex-grow: 1;

                .scheduled-action-title {
                    span {
                        white-space: nowrap;
                    }
                }
            }

            .scheduled-action-operator {
                display: flex;
                align-items: center;
                gap: 0.6rem;

                p {
                    font-size: 1.6rem;
                    font-weight: lighter;
                    color: #707070;
                    white-space: nowrap;
                }
            }
        }
    }

    .uploaders-container {
        .file-view {
            display: block;
        }
    }

    .pending {
        background-color: #1A73E8;
         min-width: 100px;
        margin: 0rem;
        text-align: center;
        padding: 1rem;
        border-radius: 1.5rem;
        color: white;
        font-size: 0.9rem;
    }

    .success {
        background-color: #61C765;
        min-width: 100px;
        margin: 0rem;
        text-align: center;
        padding: 1rem;
        border-radius: 1.5rem;
        color: white;
        font-size: 0.9rem;
    }

    .completed {
        background-color: #cccccc;
        min-width: 100px;
        margin: 0rem;
        text-align: center;
        padding: 1rem;
        border-radius: 1.5rem;
        color: white;
        font-size: 0.9rem;
    }

    .warning {
        background-color: #E3AC16;
        min-width: 100px;
        margin: 0rem;
        text-align: center;
        padding: 1rem;
        border-radius: 1.5rem;
        color: white;
        font-size: 0.9rem;
    }

    .cancelled {
        background-color: #404E4D;
        min-width: 100px;
        margin: 0rem;
        text-align: center;
        padding: 1rem;
        border-radius: 1.5rem;
        color: white;
        font-size: 0.9rem;
    }

    .critical {
        background-color: #EE6969;
        min-width: 100px;
        margin: 0rem;
        text-align: center;
        padding: 1rem;
        border-radius: 1.5rem;
        color: white;
        font-size: 0.9rem;
    }

    .error {
        background-color: #0C343D;
        min-width: 100px;
        margin: 0rem;
        min-width: 85px;
        text-align: center;
        padding: 1rem;
        border-radius: 1.5rem;
        color: white;
        font-size: 0.9rem;
    }

    .select-placeholder {
        font-size: 1.6rem;
        color: #707070;
        padding-left: 0rem;
    }

    .type-column {
        display: flex;
        flex-direction: column;
    }

    .disabled-link {
        pointer-events: none;
    }
}