.container {
    display: flex;
    margin-right: unset;
    margin-left: unset !important;
}

.panel-color {
    background-color: #edf2f6;
    border-width: 1px;
    border-style: solid;
    border-color: #d0cdcd;
    border-radius: 5px;
    width: 400px;
}

.border-red {
    border-width: 1px;
    border-color: red;
    border-style: solid;
}

.border-blue {
    border-width: 1px;
    border-color: #0033ff;
    border-style: solid;
}

.border-green {
    border-width: 1px;
    border-color: #40ff00;
    border-style: solid;
}

.flex-center {
    justify-content: center;
    align-items: center;
}

.flex-container {
    display: flex;
}

.flex-item {
    flex: 1;
}

.flex-row {
    display: flex;
    flex-direction: row;
}

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

.menu-title {
    color: dodgerblue;
    font-family: "Public Sans", sans-serif;
    font-size: 20px;
    font-style: italic;
    font-weight: 900;
    line-height: normal;
    letter-spacing: 0.12px;
    text-align: center;
    width: 100%;
}

.background-banner {
    background-color: lightgray;
    /*background: url('/images/login_background.jpg') no-repeat center center;*/
    /*-webkit-background-size: cover;*/
    /*-moz-background-size: cover;*/
    /*-o-background-size: cover;*/
    /*background-size: cover;*/
    /*text-align: center;*/
    /*padding: 50px 0;*/
    /*color: white;*/
}

.horizontal-scroll-container {
    width: 100%;
    overflow-x: auto;
    white-space: nowrap; /* Prevent wrapping */
}

.page-title {
    font-size: 28px;
    color: dodgerblue;
    text-align: center;
    text-transform: uppercase;
    font-weight: 800;
    text-space: -0.13;
    top: -80px;


}

.horizontal-scroll-content {
    display: inline-block;
}

/* Add this CSS to your existing CSS files or create a new one */
.content {
    margin-left: 0px; /* Adjust this value based on your sidebar width */
    transition: margin-center 0.3s ease; /* Add smooth transition effect */
}

/* Add this class to the content div when the sidebar is active */
.content-shifted {
    margin-left: 250px; /* Shift content back to the original position */
}


#sidebar {
    width: 250px; /* Adjust as needed */
    /* Other sidebar styles */
}

#main-content {
    flex-grow: 1;
    /* Other main content styles */

}

/* Styles to shift the main content area when the sidebar is active */
#main-content.shifted {
    margin-left: 50px; /* Adjust based on the width of your sidebar */
    transition: margin-left 0.3s ease; /* Add transition for smooth effect */
}

.button-save-cancel-width {
    width: 125px;
}

.status {
    min-width: 100px;
    max-width: 100px;
    text-align: center;
    padding-left: 1px;
    padding-right: 1px;
    font-size: 14px;
    font-weight: 600;
}

.yes {
    background-color: green;
    color: white;
    max-width: 100px;
}

.no {
    background-color: #dae0e3;
    color: white;
    max-width: 100px;
}

.update {
    background-color: #1b86bb;
    color: white;
    max-width: 100px;
}

.create {
    background-color: #b4a63c;
    color: white;
    max-width: 150px;
}

.fixed-header {
    width: auto;
    table-layout: fixed;
    border-collapse: collapse;
}

/* Make table header sticky */
.fixed-header thead {
    display: table;
    width: 100%;
    position: sticky;
    top: 0;
}

/* Improve table appearance */
.fixed-header th {
    background-color: #333;
    color: white;
}

.overflow-container {
    max-height: 500px;
    overflow-y: auto;
    width: auto;
    display: block
}

.selectVendor {
    width: 30px;
}

.table-padding td, .table-padding th {
    padding-left: 0.75rem; /* Adjust the left padding value as needed */
    padding-right: 0.75rem; /* Adjust the right padding value as needed */
}