.sidebar-item a span{
    text-transform: uppercase !important;
    font-weight: bold !important;
}

.container-fluid{

    border-radius: 10px !important;
}

@media screen and (max-width: 767px) {
    #auth #auth-left {
        padding: 15px !important;
    }
}

.table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch; /* for smooth scrolling on iOS */
}

.UserCard{
    height: 600px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.EmpCard{
    height: 600px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.StockCard{
    height: 60vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.Filtration{
    height:auto;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.userCount{
    height: 478px !important;

}


.online-user{
    height: 500px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}


/* livewire */
.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* Dark semi-transparent background */
    z-index: 9999; /* Just below the spinner */
}

.spinner {
    border: 8px solid #f3f3f3; /* Light gray */
    border-top: 8px solid #435ebe; /* Blue */
    border-radius: 50%;
    width: 40px;
    height: 40px;
    animation: spin 1s linear infinite;
    position: fixed; /* Keeps it in a fixed position */
    top: 50%; /* Center vertically */
    left: 50%; /* Center horizontally */
    transform: translate(-50%, -50%); /* Adjust for size */
    z-index: 10000; /* Ensure it's above other content */
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}


/* Toast */


.notification-box {
    position: fixed;
    bottom: 20px;
    right: 20px;
  /*   background-color: #28a745; 
    color: white;
    padding: 10px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    z-index: 10; */
}

/* #dismiss-button {
    background: none;
    border: none;
    color: white;
    font-size: 18px;
    margin-left: 10px;
    cursor: pointer;
} */

.pointer{
    cursor: pointer !important;
}

.bg-infocustom{
    background-color: #71C2FF !important;
}

/* .card .card-body {
    padding: 10px !important;
} */


/* css responsive */


/* General Table Styles */
/* General Table Styles */
.table {
    width: 100%;
    margin: 0;
}

/* Table Cell Styles */
.table th, .table td {
    vertical-align: middle; /* Center content vertically */
    text-align: center; /* Center text horizontally */
}

/* Responsive Font Size for Medium Screens */
@media (max-width: 992px) {
    .table th, .table td {
        font-size: 10px; /* Smaller font size for medium screens */
        padding: 0.25rem; /* Less padding for compactness */
    }
}

/* Responsive Font Size for Small Screens */
@media (max-width: 768px) {
    .table th, .table td {
        font-size: 10px; /* Even smaller font size for small screens */
    }
}

/* Styles for Large Screens (992px and above) */
@media (min-width: 992px) {
    .table th, .table td {
        font-size: 13px; /* Default font size for large screens */
        padding: 10px; /* Standard padding for better readability */
    }
}
.table td {
    text-align: left !important; /* Aligns text to the left */
}
.table th {
    text-align: left !important; /* Aligns text to the left */
}



/* Adjust label size */
.form-body label {
    font-size: 14px; /* Change to your desired size */
}

/* Adjust input and select sizes */
.form-control,
.form-select {
    font-size: 14px; /* Change to your desired size */

}

/* Adjust button sizes */
.btn {
    font-size: 12px; /* Change to your desired size */
    padding: 0.375rem 0.75rem; /* Adjust padding */
}

/* Optional: Adjust margins */
.form-group {
    margin-bottom: 1rem; /* Change spacing between fields */
}




/* Camera Modal Styling */
.scanner-container {
    position: relative;
    width: 100%;
    height: 300px; 
    border-radius: 15px;
}

video {
    width: 100%;
    height: 100%;
    object-fit: cover; 
}


.scanner-line {
    position: absolute;
    top: 50%; 
    left: 0;
    width: 100%;
    height: 2px; 
    background-color: red;
    opacity: 0.8;
}


#close-scanner {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 10; 
}






.sidebar-wrapper .menu .sidebar-link {
    display: block;
    padding: 5px 1rem;
    font-size: 1rem;
    display: flex;
    align-items: center;
    border-radius: .5rem;
    transition: all .5s;
    text-decoration: none;
    color: #25396f;
}


.sidebar-wrapper .menu .sidebar-title {
    padding: 0 1rem;
    margin: 6px 0 1rem;
    font-size: 1rem;
    list-style: none;
    font-weight: 600;
    color: #25396f;
}

.sidebar-wrapper .sidebar-header {
    padding: 1rem 2rem 0rem;
    font-size: 2rem;
    font-weight: 700;
}
