/* Lightened green background */
.bg-success-light {
  background-color: rgba(40, 167, 69, 0.2) !important; /* 40% opacity */
  padding: 0.5rem; /* Add some padding for better appearance */
  border-radius: 0.5rem; /* Rounded corners */
}

/* Lightened yellow background */
.bg-warning-light {
  background-color: rgba(255, 193, 7, 0.3) !important; /* 40% opacity */
  padding: 0.5rem; /* Add some padding for better appearance */
  border-radius: 0.5rem; /* Rounded corners */
}

/* Very light blue background */
.bg-info-very-light {
  background-color: rgba(173, 216, 230, 0.4); /* Light blue with 40% opacity */
  padding: 0.5rem;
  border-radius: 0.5rem;
}

/* Light grey background */
.bg-light-grey {
  background-color: rgba(211, 211, 211, 0.4); /* Light grey with 40% opacity */
  padding: 0.5rem;
  border-radius: 0.5rem;
}

/* Light pink background */
.bg-pink-light {
  background-color: rgba(255, 182, 193, 0.4); /* Light pink with 40% opacity */
  padding: 0.5rem;
  border-radius: 0.5rem;
}

/* Very light yellow background */
.bg-warning-very-light {
  background-color: rgba(255, 255, 224, 0.4); /* Very light yellow with 40% opacity */
  padding: 0.5rem;
  border-radius: 0.5rem;
}

/* Alternative light grey - slightly darker */
.bg-light-grey-alt{
  background-color: rgba(220, 220, 220, 0.4);
  padding: 0.5rem;
  border-radius: 0.5rem;
}

/* Alternative very light blue - slightly more blue */
.bg-info-very-light-alt{
  background-color: rgba(173, 216, 230, 0.3);
  padding: 0.5rem;
  border-radius: 0.5rem;
}

/* Very light purple background */
.bg-purple-very-light {
  background-color: rgba(200, 160, 220, 0.4); /* Light purple with 40% opacity */
  padding: 0.5rem; /* Consistent with other light bg classes */
  border-radius: 0.5rem; /* Consistent with other light bg classes */
}

/* Optional: If .bg-warning-light (yellowish) isn't orange enough, you could add: */

.bg-orange-very-light {
  background-color: rgba(255, 165, 0, 0.3); /* Light orange with 30% opacity */
  padding: 0.5rem;
  border-radius: 0.5rem;
}

/* New class for the pop-out border */
.cell-highlight-border {
  border: 2px solid #333333 !important; /* A distinct border, e.g., dark grey */
  /* Consider box-sizing if it affects layout, though Bootstrap usually handles this. */
}


.new-menu {
    border: 3px solid #ddd;  /* Fine, subtle border */
    border-radius: 5px;
    padding: 15px;
    margin-bottom: 15px;
}

.menu-label {
    font-weight: bold;
    margin-bottom: 10px;
    border-bottom: 1px solid #eee;
    padding-bottom: 5px;
}
/* Thicker vertical border after the 5th column */
.table td:nth-child(5),
.table th:nth-child(5) {
    border-right: 2px solid #000;  /* Adjust thickness and color as needed */
}

/* Custom header styling for only the table with the custom-header class */
.custom-header th {
    border: 2px solid #007bff;
    background-color: #e9ecef;
    font-weight: bold;
}
/* Ensure borders collapse so they line up nicely */
.table {
    border-collapse: collapse;
}

/* Left edge of the first column */
.table th:first-child,
.table td:first-child {
    border-left: 2px solid #007bff !important;
}

/* Right edge of the last column */
.table th:last-child,
.table td:last-child {
    border-right: 2px solid #007bff !important;
}

/* Bottom border on the last row of table cells */
.table tbody tr:last-child td {
    border-bottom: 2px solid #007bff !important;
}

/* (Optional) Top border on header cells for a fully enclosed look */
.table thead th {
    border-top: 2px solid #007bff !important;
}

.table thead th {
    text-align: center;
    vertical-align: middle;
}

/* custom.css */

/* ... (your existing CSS rules, including .bg-success-light, .bg-info-very-light etc.) ... */

/*
   Overrides for Bootstrap striped table cells within specifically colored rows.
   These rules target the <td> elements inside a <tr> that has one of your color classes.
*/

tr.bg-success-light > td {
  background-color: rgba(40, 167, 69, 0.2) !important; /* Your defined success light color */
  box-shadow: none !important; /* Crucial to remove/override Bootstrap's striping shadow */
}

tr.bg-info-very-light > td {
  background-color: rgba(173, 216, 230, 0.4) !important; /* Your defined info very light color */
  box-shadow: none !important;
}

tr.bg-warning-light > td {
  background-color: rgba(255, 193, 7, 0.3) !important; /* Your defined warning light color */
  box-shadow: none !important;
}

tr.bg-purple-very-light > td {
  background-color: rgba(200, 160, 220, 0.4) !important; /* Your defined purple very light color */
  box-shadow: none !important;
}