.mb {
    display: flex;
    align-items: flex-start;
    flex-direction: row;
}

.mb_right {
    width: 80%; /* Reduce width of the pagination container */
    transition: all 0.2s ease;
}

.mb_right .pagination {
    margin-top: 0px;
    width: auto; /* Ensure pagination adjusts to content size */
    max-width: 300px; /* Limit the width of the pagination container */
}

.mb_right .form-container {
    margin-bottom: 0px;
}

.ntog {
    cursor: pointer;
    margin-bottom: 20px;
}

.mb div.trigger {
    width: 0px;
    overflow: hidden;
    transition: all 0.2s ease;
}

.mb div.trigger.open {
    width: auto;
    margin-right: 20px;
}

.cc_base {
    margin: 20px 0px;
    width: 100%; /* Full-width container */
    max-width: 800px; /* Optional: Limit maximum width */
    position: relative; /* Ensure pseudo-elements are positioned correctly */
}

/* Add streak line above and below the container */
.cc_base::before,
.cc_base::after {
    content: '';
    position: absolute;
    left: 0;
    width: 100%; /* Full width of the container */
    height: 3px; /* Height of the streak line */
    background-color: #A50034; /* Streak line color */
}

.cc_base::before {
    top: 0; /* Position at the top */
}

.cc_base::after {
    bottom: 0; /* Position at the bottom */
}

.cc_o {
    border: none; /* Removed borders from the main container */
}

.cc_t {
    cursor: pointer;
    padding: 10px 5px; /* Ensure enough padding for comfortable spacing */
    font-size: 13px;
    background-color: #f9f9f9; /* Subtle background color */
    transition: background-color 0.2s ease, color 0.2s ease;
    display: block; /* Ensure it spans the container */
    width: 100%; /* Full width to fit container */
    box-sizing: border-box; /* Include padding in the width calculation */
    white-space: nowrap; /* Prevent wrapping */
    overflow: hidden; /* Hide overflowing text */
    text-overflow: ellipsis; /* Add ellipsis for long text */
}

.cc_t:before {
    content: '';
    display: inline-block;
    width: 3px;
}

.cc_list label.container {
    background-color: #f2f2f2;
    display: flex;
    align-items: center;
    padding: 2px 15px; /* Adjusted padding for smaller height */
    font-size: 12px; /* Smaller font size for ops boxes */
    border-top: 1px solid #ddd; /* Optional border between items */
    position: relative; /* Ensure proper layout */
}

.cc_list label.container input[type="checkbox"] {
    margin: 0;
    margin-right: 10px; /* Add space between the checkbox and the text */
    position: relative; /* Ensure proper alignment */
    z-index: 1; /* Make sure it doesn't block the text */
}

.cc_list {
    overflow: hidden;
    max-height: 0px;
    transition: max-height 0.5s ease;
}

.cc_o.open .cc_list {
    max-height: 1000px; /* Adjusted for smooth opening */
}

.cc_o.open .cc_t:before {
    content: '';
    width: 15px;
}

.cc_o.open .cc_t {
    background-color: #A50034;
    color: white;
}
