.content-table {
    border-collapse: collapse;
    table-layout: auto;
    background-color: rgba(0, 0, 0, 0.3);
    color: #cceeff;
    box-shadow: 0 0 8px rgba(0, 255, 255, 0.2);

    display: block;
    width: auto;


}

.content-table tr{

}

.content-table th,
.content-table td {
    border: 1px solid rgba(100, 200, 255, 0.4);

    text-align: left;
    padding:6px;
}

.content-table th {
    background-color: rgba(0, 20, 40, 0.6);
    font-weight: bold;
    color: #80dfff;
}

.content-table tr:nth-child(even) {
    background-color: rgba(0, 20, 40, 0.2);
}

.content-table tr:hover {
    background-color: rgba(100, 255, 255, 0.1);
    border-color: #00ffff;
}

/********************************/


     /* remove the UL side padding */
 .ui-menu.ui-autocomplete {
     padding-left: 0 !important;
     padding-right: 0 !important;
 }

/* control the row padding itself */
.ui-menu.ui-autocomplete .ui-menu-item-wrapper {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
}
/**********************************************************************************************************************/
.counter-wrapper {
    display: flex;
    align-items: center;
    gap: 6px;

    justify-content: center; /* centers contents */
    margin: 0 auto;          /* centers the wrapper */
}


.counter-digits {
    display: flex;
    gap: 2px; /* <-- requested spacing */
}

.counter-digit {
    width: 23px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgb(108, 193, 230);
    box-sizing: border-box;
    border-radius: 6px;
}