@import url("https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Roboto:wght@300;400;500&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:wght@300;400;500&display=swap");

.toast {
    width: auto !important;
    min-width: 450px !important;
    min-height: 100px !important;
    font-size: 20px !important;
    border-radius: 10px !important;
}

.toast .toast-message {
    margin-top: 18px !important;
}

/* Responsive styles for smaller screens */
@media (max-width: 480px) {
    .toast {
        min-width: 300px !important;
        min-height: 80px !important;
        font-size: 16px !important;
        border-radius: 8px !important;
    }

    .toast .toast-message {
        margin-top: 15px !important;
    }
}


.float-left {
    float: left !important;
}

.float-right {
    float: right !important;
}

.float-none {
    float: none !important;
}
/* Racks Styles */

.bgc-0 {
    background-color: #004883 !important;
}

.bgc-1 {
    background-color: #4caf50 !important;
}

.bgc-2 {
    background-color: #e93232 !important;
}

.bgc-3 {
    background-color: purple !important;
}

.bgc-4 {
    background-color: blue !important;
}

.bgc-5 {
    background-color: blueviolet !important;
}

.bgc-6 {
    background-color: orangered !important;
}

.bgc-7 {
    background-color: rgb(4, 113, 177) !important;
}

.bgc-8 {
    background-color: rgb(91, 4, 161) !important;
}

.bgc-9 {
    background-color: rgb(5, 122, 103) !important;
}

.bgc-10 {
    background-color: rgb(85, 2, 47) !important;
}

.bgc-11 {
    background-color: #ff6f61 !important; /* Coral */
}

.bgc-12 {
    background-color: #6a5acd !important; /* Slate Blue */
}

.bgc-13 {
    background-color: #20b2aa !important; /* Light Sea Green */
}

.bgc-14 {
    background-color: #ff6347 !important; /* Tomato */
}

.bgc-15 {
    background-color: #daa520 !important; /* Goldenrod */
}

.bgc-16 {
    background-color: #8b0000 !important; /* Dark Red */
}

.bgc-17 {
    background-color: #ff8c00 !important; /* Dark Orange */
}

.bgc-18 {
    background-color: #00ced1 !important; /* Dark Turquoise */
}

.bgc-19 {
    background-color: #9400d3 !important; /* Dark Violet */
}

.bgc-20 {
    background-color: #ff1493 !important; /* Deep Pink */
}

.bgc-21 {
    background-color: #00bfff !important; /* Deep Sky Blue */
}

.bgc-22 {
    background-color: #adff2f !important; /* Green Yellow */
}

.bgc-23 {
    background-color: #4b0082 !important; /* Indigo */
}

.bgc-24 {
    background-color: #f0e68c !important; /* Khaki */
}

.bgc-25 {
    background-color: #e6e6fa !important; /* Lavender */
}

.bgc-26 {
    background-color: #7cfc00 !important; /* Lawn Green */
}

.bgc-27 {
    background-color: #fffacd !important; /* Lemon Chiffon */
}

.bgc-28 {
    background-color: #add8e6 !important; /* Light Blue */
}

.bgc-29 {
    background-color: #f08080 !important; /* Light Coral */
}

.bgc-30 {
    background-color: #e0ffff !important; /* Light Cyan */
}

.bgc-31 {
    background-color: #fafad2 !important; /* Light Goldenrod Yellow */
}

.bgc-32 {
    background-color: #90ee90 !important; /* Light Green */
}

.bgc-33 {
    background-color: #d3d3d3 !important; /* Light Grey */
}

.bgc-34 {
    background-color: #ffb6c1 !important; /* Light Pink */
}

.bgc-35 {
    background-color: #ffa07a !important; /* Light Salmon */
}

.bgc-36 {
    background-color: #20b2aa !important; /* Light Sea Green */
}

.bgc-37 {
    background-color: #87cefa !important; /* Light Sky Blue */
}

.bgc-38 {
    background-color: #778899 !important; /* Light Slate Gray */
}

.bgc-39 {
    background-color: #b0c4de !important; /* Light Steel Blue */
}

.bgc-40 {
    background-color: #ffffe0 !important; /* Light Yellow */
}


.brand-image {
    transition: all 0.3s ease;
}

body.sidebar-collapse #logo img.brand-image {
    max-width: 50px !important;
    max-height: 50px !important;
    opacity: 1;
    align-self: center !important;
}

select[readonly].select2-hidden-accessible + .select2-container {
    pointer-events: none;
    touch-action: none;
    opacity:0.6;
    cursor:no-drop;
}