table {
    width: 100%;
    border-collapse: collapse;
    background: #0f1117; /* optional dark background */
    border: 1px solid #2a2f3a;
    border-radius: 10px;
    overflow: hidden;
}

/* Header */
thead {
    background: #161a22;
}

thead th {
    padding: 12px;
    font-weight: 700;
    border-bottom: 1px solid #2a2f3a;
    color: #ffffff;
}

/* Body cells */
tbody td {
    padding: 12px;
    border-bottom: 1px solid #2a2f3a;
    color: #d6d6d6;
}

/* Row hover effect (nice UX boost) */
tbody tr:hover {
    background: #151a22;
}

/* Column alignment */
thead th:nth-child(1),
thead th:nth-child(2),
tbody td:nth-child(1),
tbody td:nth-child(2) {
    text-align: left;
}

thead th:nth-child(3),
thead th:nth-child(4),
tbody td:nth-child(3),
tbody td:nth-child(4) {
    text-align: center;
}

/* Timer styling */
.timer {
    font-weight: 600;
    color: #7dd3fc;
}

/* Button styling */
.btn {
    padding: 6px 12px;
    border-radius: 6px;
    border: 1px solid #2a2f3a;
    background: #1b2230;
    color: white;
    cursor: pointer;
}

.btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
.table-wrap {
    width: 100%;
    overflow-x: auto;
}

.table-wrap table {
    margin: 0 auto;
    width: 100%;
    max-width: 100%;
}
table {
    margin-left: auto;
    margin-right: auto;
}
.sub-content {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
}
/* VERIFIED BADGES */
/* VERIFIED BADGES - SMALLER VERSION */
.badge {
    padding: 2px 6px;
    border-radius: 5px;
    font-size: 11px;
    font-weight: 600;
    display: inline-block;
    line-height: 1.2;
}
.badge.verified {
    background: transparent;
    color: #86efac;
    border: 1px solid #14532d;
    font-weight: 500;
}

/* status types */
.verified { background: #14532d; color: #86efac; }
.monitor { background: #1e3a8a; color: #93c5fd; }
.unverified { background: #3f3f46; color: #d4d4d8; }
.rejected { background: #450a0a; color: #fca5a5; }

/* score styling */
.score {
    font-weight: 700;
    color: #fbbf24;
}

/* last tested */
.tested {
    color: #a1a1aa;
    font-size: 13px;
}
/* FORCE CONSISTENT COLUMN WIDTHS */
table {
    table-layout: fixed;
}

/* column widths */
thead th:nth-child(1),
tbody td:nth-child(1) {
    width: 18%;
}

thead th:nth-child(2),
tbody td:nth-child(2) {
    width: 12%;
}

thead th:nth-child(3),
tbody td:nth-child(3) {
    width: 12%;
    text-align: center;
}

thead th:nth-child(4),
tbody td:nth-child(4) {
    width: 10%;
    text-align: center;
}

thead th:nth-child(5),
tbody td:nth-child(5) {
    width: 18%;
    text-align: center;
}

thead th:nth-child(6),
tbody td:nth-child(6) {
    width: 12%;
    text-align: center;
}

thead th:nth-child(7),
tbody td:nth-child(7) {
    width: 18%;
    text-align: center;
}
.table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
/* Allow long faucet names to wrap properly */
tbody td:nth-child(1) {
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
    line-height: 1.3;
}
/* optional clamp style (clean UI look) */
.name-clamp {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
@media (max-width: 768px) {

    /* overall text size reduction */
    table {
        font-size: 8px;
    }

    thead th {
        font-size: 8px;
        padding: 8px 6px;
    }

    tbody td {
        font-size: 10px;
        padding: 8px 6px;
    }

    /* smaller badges */
    .badge {
        font-size: 8px;
        padding: 2px 5px;
    }

    /* smaller score */
    .score {
        font-size: 10px;
    }

    /* smaller timer */
    .timer {
        font-size: 9px;
    }

    /* smaller buttons */
    .btn {
        padding: 4px 8px;
        font-size: 9px;
    }

    /* faucet name emphasis but still compact */
    tbody td:nth-child(1) {
        font-size: 10px;
        font-weight: 600;
    }
}
@media (max-width: 768px) {

    /* Last Tested / Date column */
    tbody td:nth-child(5) {
        font-size: 8px;
        color: rgba(161, 161, 170, 0.7);
        line-height: 1.2;
    }
}
/* NEW status */
.new {
    background: #0f172a;
    color: #60a5fa;
    border: 1px solid #1d4ed8;
}

/* HOT status */
.hot {
    background: #3b0a0a;
    color: #f87171;
    border: 1px solid #dc2626;
}
.monitor {
    background: rgba(40, 158, 255, 0.12);
    color: rgba(40, 158, 255, 0.85);
    border: 1px solid rgba(40, 158, 255, 0.35);
}