/**
 * assets/css/dashboard.css
 * Styles for the “Credits & Transactions” dashboard endpoint
 */

/* Container spacing */
.cpm-account-credits {
    margin: 2rem 0;
}

    /* Balance styling */
    .cpm-account-credits .balance {
        font-size: 1.25rem;
        font-weight: bold;
        margin-bottom: 1.5rem;
    }

    /* Transactions table base */
    .cpm-account-credits table.cpm-transactions {
        width: 100%;
        border-collapse: collapse;
        margin-bottom: 1.5rem;
    }

    /* Table header & cells */
    .cpm-account-credits th,
    .cpm-account-credits td {
        padding: 0.75rem;
        border-bottom: 1px solid var(--color-border, #ddd);
        text-align: left;
    }

    /* Header row background and font */
    .cpm-account-credits th {
        background-color: rgba(var(--color-primary-r, 97,83,65), 0.05);
        font-weight: 600;
    }

/* Load More button */
#load-more-credits {
    display: inline-block;
    padding: 0.75rem 1.5rem;
    font-size: 1rem;
    text-align: center;
    background: var(--color-warning, #fbb13c);
    color: var(--color-dark, #372f25);
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.3s ease, opacity 0.3s ease;
    margin-top: 1rem;
}

    #load-more-credits:hover {
        opacity: 0.9;
    }

/* Mobile responsiveness: make table scrollable */
@media (max-width: 600px) {
    .cpm-account-credits table.cpm-transactions {
        display: block;
        overflow-x: auto;
    }
}