#TableID td {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   max-width: 100px; /* Set a maximum width for the tooltip */
}

#TableID td:hover {
   overflow: visible; /* Show the full content on hover */
   white-space: normal;
   z-index: 1; /* Ensure the tooltip is above other elements */
   position: relative;
   background-color: #fff; /* Background color of the tooltip */
   border: 1px solid #ccc; /* Border for the tooltip */
   padding: 5px; /* Padding for the tooltip */
}

#TableID {
   table-layout: fixed;
}

#TableID_paginate a.paginate_button {
   color: #ffffff !important; /* White text color for pagination buttons */
}
#TableID_paginate a.paginate_button.current {
   background-color: #ccc!important; /* Active button color */
   color: #000000 !important; /* Black text color for the current page number */
}
#TableID_paginate {
   float: left; /* Float the pagination buttons to the left */
   margin-top: 10px;
   /* display: none; */
}
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
   color: #f1f1f1 !important;
   background-color: #dc7e7e !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
   color: #f1f1f1 !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
   margin:  1px!important;
   padding: 0.4em 0.8em;
   cursor: pointer;
   border-radius: 0.25em;
   background-color: #b72d32 !important; /* Red button color */
   color: #ffffff !important; /* White text color */
   content: '\2190'!important; /* Unicode for left arrow */
   /* margin-right: 5px; */
}
 .dataTables_paginate .paginate_button.current {
   background-color: #ccc!important; /* Active button color */
   color: #ffffff !important; /* Text color for active button */
}

#TableID_info {
   float: right; /* Float the pagination information to the right */
   margin-left: 10px; /* Add some left margin for spacing */
   margin-top: 20px;
}

#TableID_length {
   float: right; /* Float the "Show entries" dropdown to the right */
   margin-left: 10px; /* Add some left margin for spacing */
   margin-top: 10px;
   display: none;
}


#TableID_filter {
   float: left; /* Float the search input to the left */
   margin-top:10px;
   

}
#TableID_filter input[type="search"] {
   margin-left: 5px; /* Add margin between search label and input box */
}

.detail {
   margin-bottom: 10px;
}
.fixed-card {
   position: sticky;
   top: 20px; /* Adjust this value to control the distance from the top */
}

.toast-container {
  position: fixed;
  top: 20px;
  right: 10px;
  z-index: 2000;
}

.toastError {
  background-color: #f7b2b3;
  border-radius: 2.5rem;
}

.toastSuccess {
  background-color: #92e8a5;
  border-radius: 2.5rem;
}

.toastAlign {
  padding: 10px;
}

.icon-circle {
    display: inline-block;
    width: 30px; 
    height: 30px;
    border-radius: 50%;
    text-align: center;
    line-height: 30px;
}
  
.success-circle {
    background-color: #28a745; 
    color: white; 
}
  
.error-circle {
    background-color: #dc3545; 
    color: white;
}

.close{
    padding: 5px;
    margin-top: 5px;
}

.card-container {
  display: flex;
  flex-direction: column;
  align-items: center;
}

 /* Define the active tab color */
 .nav-tabs .nav-link.active {
  color: #ffffff;
  background-color: #b72d32;
}

#tableNotPagging td {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   background-color: #fff;
   max-width: 100px; /* Set a maximum width for the tooltip */
}

#tableNotPagging td:hover {
   overflow: visible; /* Show the full content on hover */
   white-space: normal;
   z-index: 1; /* Ensure the tooltip is above other elements */
   position: relative;
   background-color: #fff; /* Background color of the tooltip */
   border: 1px solid #ccc; /* Border for the tooltip */
   padding: 5px; /* Padding for the tooltip */
}

#tableNotPagging {
   table-layout: fixed;
}

#tableNotPagging_info {
   float: right; /* Float the information text to the right */
   margin-left: 10px; /* Add some left margin for spacing */
   margin-top: 20px;
   display: none;
}

#tableNotPagging_filter {
   float: left; /* Float the search input to the left */
   margin-top: 10px;
}

#tableNotPagging_filter input[type="search"] {
   margin-left: 5px; /* Add margin between search label and input box */
}

td{
   border-style: ridge;
}
.table-common th {
   background-color: #f2f2f2;
}

/* General table styling */
.table-common td {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   background-color: #fff;
   max-width: 100px; /* Set a maximum width for the tooltip */
}

.table-common td:hover {
   overflow: visible; /* Show the full content on hover */
   white-space: normal;
   z-index: 1; /* Ensure the tooltip is above other elements */
   position: relative;
   background-color: #fff; /* Background color of the tooltip */
   border: 1px solid #ccc; /* Border for the tooltip */
   padding: 5px; /* Padding for the tooltip */
}

.table-common {
   table-layout: fixed;
}

/* Info section styling */
.table-common_info {
   float: right; /* Float the information text to the right */
   margin-left: 10px; /* Add some left margin for spacing */
   margin-top: 20px;
   display: none;
}

/* Filter section styling */
.table-common_filter {
   float: left; /* Float the search input to the left */
   margin-top: 10px;
}

.table-common_filter input[type="search"] {
   margin-left: 10px; /* Add margin between search label and input box */
}

.table-common_paginate a.paginate_button {
   color: #ffffff !important; /* White text color for pagination buttons */
   padding: "5px"
}
.table-common_paginate a.paginate_button.current {
   background-color: #ccc!important; /* Active button color */
   color: #000000 !important; /* Black text color for the current page number */
}
.table-common_paginate {
   float: left; /* Float the pagination buttons to the left */
   margin-top: 10px;
   /* display: none; */
}