/* ========================================
   Database Tables - Modern Styling
   ======================================== */

/* ===== Section Headers ===== */

.h2-database-aletheia,
.h2-database-list {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 1.1em;
    font-weight: 600;
    color: var(--color-text);
    margin: 24px 0 8px;
    padding: 0;
}

.h2-database-list {
    margin-top: 32px;
}

/* ===== Base Table ===== */

#databases-table.databases-table,
#database-aletheia-table.database-aletheia-table {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    max-width: 860px;
    margin: 8px auto 0;
    background-color: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

/* ===== Header ===== */

#databases-table.databases-table th,
#database-aletheia-table.database-aletheia-table th {
    background: var(--color-th-bg);
    font-size: 0.78em;
    font-weight: 600;
    color: var(--color-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 12px 16px;
    text-align: left;
    border-bottom: 2px solid var(--color-border);
    border-right: none;
    border-left: none;
    border-top: none;
}

#databases-table.databases-table th:last-child,
#database-aletheia-table.database-aletheia-table th:last-child {
    text-align: center;
}

/* ===== Cells ===== */

#databases-table.databases-table td,
#database-aletheia-table.database-aletheia-table td {
    padding: 12px 16px;
    font-size: 0.92em;
    color: var(--color-text);
    border-bottom: 1px solid var(--color-border-light);
    border-right: none;
    border-left: none;
    border-top: none;
    text-align: left;
    vertical-align: middle;
}

#databases-table.databases-table tr:last-child td,
#database-aletheia-table.database-aletheia-table tr:last-child td {
    border-bottom: none;
}

/* ===== Hover ===== */

#databases-table.databases-table tbody tr:hover,
#database-aletheia-table.database-aletheia-table tbody tr:hover {
    background-color: var(--color-surface-hover);
    transition: background-color 0.15s ease;
}

/* ===== Column Widths (Web/App) ===== */

#databases-table.databases-table th:nth-child(1) {
    width: 35%;
}

#databases-table.databases-table th:nth-child(2) {
    width: 40%;
}

#databases-table.databases-table th:nth-child(3) {
    width: 10%;
    text-align: center;
}

#databases-table.databases-table th:nth-child(4) {
    width: 15%;
    text-align: center;
}

#databases-table.databases-table td:nth-child(3) {
    text-align: center;
}

#databases-table.databases-table td:nth-child(4) {
    text-align: center;
}

/* ===== Active Database Icon ===== */

#databases-table.databases-table td:nth-child(3) i.fa-check-circle {
    font-size: 1.15em;
}

/* ===== Details Button inside table ===== */

.details-button {
    font-size: 0.82em !important;
    padding: 6px 16px !important;
    border-radius: 6px !important;
    font-weight: 500;
    margin: 0 !important;
    background: var(--color-primary);
    color: #fff;
    border: none;
    cursor: pointer;
    transition: background 0.2s, box-shadow 0.2s;
    box-shadow: 0 1px 3px var(--color-primary-shadow);
}

.details-button:hover {
    background: var(--color-primary-hover) !important;
    box-shadow: 0 2px 6px var(--color-primary-shadow-hover);
}

/* ===== Column Widths (Aletheia) ===== */

#database-aletheia-table.database-aletheia-table th:nth-child(1) {
    width: 40%;
}

#database-aletheia-table.database-aletheia-table th:nth-child(2) {
    width: 40%;
}

#database-aletheia-table.database-aletheia-table th:nth-child(3) {
    width: 20%;
    text-align: center;
}

#database-aletheia-table.database-aletheia-table td:last-child {
    text-align: center;
}

/* ===== Database Name Cell ===== */

#databases-table.databases-table td:nth-child(2) {
    font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
    font-size: 0.85em;
    color: var(--color-text-secondary);
}
