:root {
    --bs-table-bg-type : #c9c9c9bf ;
    --bs-app-header-height : 90px;
}

.card .card-body {
    padding: var(--bs-card-spacer-y) var(--bs-card-spacer-x)!important;
}
.table > :not(caption) > * > * {
    padding: 0.3rem;
}

.table-container{
    min-height: 300px;
}
 .custom-text {
    text-align: center;
    font-weight: bold;
  }


  .salary-display {
    background-color: #ca4230;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.salary-display i {
    font-size: 1.5rem;
}

.salary-display span {
    font-size: 1rem;
}

.salary-display .fw-bold {
    font-size: 1.2rem;
}

.selected-event {
    background-color: #f74d0a !important; /* Highlight color */
    border-color: #21011a !important; /* Border color */
    border-radius: 5px;
    
    border-style: solid;
    border-width: 5px;
}
  

.htmx-indicator{
    opacity:0;
    display: none;
    transition: opacity 700ms ease-in;
}
.htmx-request .htmx-indicator{
    opacity:1;
    display: block;
}
.htmx-request.htmx-indicator{
    display: block;
    opacity:1;
}




.menu-link:hover {
    color: #5d78ff; /* Your brand color */
    /* background-color: #2c7bcb; */
    text-decoration: none;
}
.menu-item.here > .menu-link {
    color: #ffffff;
    background-color: #5d78ff; /* Your brand color */
}

.select-all-container {
    margin-bottom: 10px; /* Space between "Select All" and other checkboxes */
    margin-left: -15px; /* Adjust this value to move "Select All" to the left */
    display: block; /* Makes "Select All" appear as a block element */
}

.permissions-container {
    display: flex;
    flex-wrap: wrap;
}

.permissions-container label {
    margin-right: 10px; /* Adjust spacing between permission checkboxes */
    margin-bottom: 5px;  /* Adjust vertical spacing */
}

.color-container {
    background: linear-gradient(135deg, #118ab2, #073b4c);
    padding: 15px 20px;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
    color: #fff;
}

.total-container {
    background: linear-gradient(135deg, #0ad1c8, #14919b);
    padding: 15px 20px;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
    color: #fff;
}

.total-text {
    font-size: 1.5rem;
    font-weight: bold;
    display: flex;
    align-items: center;
    margin: 0;
}

.icon {
    font-size: 2rem;
    margin-right: 10px;
    color: #ffdd57;
}

.total-amount {
    font-size: 1.8rem;
    font-weight: bold;
}




.page-item {
    cursor:pointer;
    color: #000000;
}
.page-link {
    color: #000000;
}



.bg-success {
    background-color: #28a745 !important;
    color: white !important;
}

.bg-danger {
    background-color: #dc3545 !important;
    color: white !important;
}

.bg-warning {
    background-color: #ffc107 !important;
    color: black !important;
}

.bg-info {
    background-color: #17a2b8 !important;
    color: white !important;
}




.status-active {
    background-color: #0ead69; /* Custom green */
    color: white; /* Adjust text color if needed */
}

.status-pending {
    background-color: #ff9f1c; /* Custom yellow */
    color: #212529; /* Adjust text color for readability */
}

.status-suspended {
    background-color: #bf4342; /* Custom red */
    color: white;
}

.status-completed {
    background-color: #577399; /* Custom blue */
    color: white;
}

.no-overflow-x .table-responsive {
    overflow-x: unset!important;
}

.vertical-align-middle {
    vertical-align: middle;
}

@media (min-width: 992px) {
  .aside-enabled.aside-fixed.header-fixed .header {
    left: 0 !important;
  }

}

.nav-item .nav-link.active i, .nav-item .nav-link:hover i{
    color: inherit !important;
}