/* Custom styles for the user tables */
.content-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    box-sizing: border-box;
    color: #d1d5db;
    font-family: 'Arial Narrow', sans-serif;
    flex-direction: column; /* Allow multiple sections to stack vertically */
}
.table-section {
    margin-bottom: 3rem; /* Increased space between tables */
}
table {
    width: 100%;
    min-width: 100%;
    border-collapse: collapse;
}
th, td {
    padding: 0.5rem 1rem;
    white-space: nowrap;
    font-size: 0.85rem;
}
thead {
   border-bottom: 1px solid #4b5563;
}
th {
    font-weight: normal;
    color: #9ca3af;
}

/* Column Alignment */
th:first-child, td:first-child { /* UAID */
    text-align: left;
    width: 30%;
}
th:nth-child(2), td:nth-child(2) { /* NAME */
    text-align: center;
    width: 40%;
}
th:nth-child(3), td:nth-child(3) { /* STATUS */
    text-align: right;
    width: 30%;
}

a {
    color: #d1d5db;
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}

.admin-link {
    color: var(--theme_accent) !important;
    font-weight: 600;
}

.admin-status {
    color: var(--theme_admin) !important;
    font-weight: 600;
}

.clique-link {
    color: var(--theme_golden) !important;
    font-weight: 600;
}

.clique-status {
    color: var(--theme_golden) !important;
    font-weight: 600;
}

.elite-link {
    color: var(--theme_elite) !important;
    font-weight: 600;
}

.elite-status {
    color: var(--theme_elite) !important;
    font-weight: 600;
}

/* Styles for override colors */
.blue-link {
    color: #60a5fa !important;
    font-weight: 600;
}

.blue-status {
    color: #60a5fa !important;
    font-weight: 600;
}


/* Styles for Admin Name Particle Effect */
.admin-name-container {
    position: relative;
    padding: 2px 5px;
    display: inline-block;
}

.admin-name-effect {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    z-index: -1;
    opacity: 0.6;
    object-fit: cover;
}

/* Styles for scrollable table */
.table-scroll-wrapper {
    position: relative; /* For pseudo-element positioning */
    max-height: 9.3rem; /* Calculated for header + 4 rows */
    overflow-y: auto;
}
.table-scroll-wrapper thead th {
    position: sticky;
    top: 0;
    z-index: 1; /* Ensures header stays above scrolling content */
    /* Fallback color in case the CSS var isn't defined */
    background-color: var(--theme_background, #111827);
}

/* Custom Scrollbar */
.table-scroll-wrapper::-webkit-scrollbar {
    width: 2px; /* Made the scrollbar skinnier */
}
.table-scroll-wrapper::-webkit-scrollbar-track {
    background: transparent;
}
.table-scroll-wrapper::-webkit-scrollbar-thumb {
    background: #4b5563;
    border-radius: 3px;
}

/* Hides top part of the scrollbar track to align with content */
.table-scroll-wrapper::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 2px; /* Must match scrollbar width */
    height: 2.1rem; /* Approximate height of the table header */
    z-index: 2; /* To cover the scrollbar track */
    background-color: var(--theme_background, #111827);
}

