/* Stile generale per la tabella */
#servicesTable {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
    font-size: 16px;
    text-align: left;
    background-color: #f9f9f9;
    border: 1px solid #ddd;
}

/* Intestazione della tabella */
#servicesTable thead tr {
    background-color: #4CAF50;
    color: white;
    text-align: left;
    font-weight: bold;
}

/* Celle della tabella */
#servicesTable th, #servicesTable td {
    padding: 12px 15px;
    border: 1px solid #ddd;
}

/* Riga alternata */
#servicesTable tbody tr:nth-child(even) {
    background-color: #f2f2f2;
}

/* Effetto hover sulle righe */
#servicesTable tbody tr:hover {
    background-color: #f1f1f1;
    cursor: pointer;
}

/* Stile pulsante Salva */
#servicesTable .saveDate {
    background-color: #4CAF50;
    color: white;
    border: none;
    padding: 8px 12px;
    cursor: pointer;
    border-radius: 4px;
    font-size: 14px;
}

#servicesTable .saveDate:hover {
    background-color: #45a049;
}

/* Stile input data */
#servicesTable .expireDate {
    border: 1px solid #ccc;
    padding: 5px;
    border-radius: 4px;
    font-size: 14px;
    width: 150px;
}


#activateServiceBtn, .set90Days, #toggle-user-status, #send-message-user, #update-user-to-free{
    background-color: #007bff; /* Blu brillante */
    color: white; /* Testo bianco */
    border: none; /* Rimuove il bordo */
    padding: 10px 20px; /* Spaziatura interna */
    font-size: 16px; /* Dimensione del testo */
    border-radius: 5px; /* Angoli arrotondati */
    cursor: pointer; /* Cambia il cursore in una mano */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Effetto ombra */
    transition: background-color 0.3s ease; /* Transizione fluida */
}

#activateServiceBtn:hover, .set90Days:hover, #toggle-user-status:hover , #send-message-user:hover, #update-user-to-free:hover {
    background-color: #0056b3; /* Blu più scuro quando si passa sopra */
}

#activateServiceBtn:active, .set90Days:active, #toggle-user-status:active, #send-message-user:active, #update-user-to-free:active  {
    background-color: #004080; /* Ancora più scuro quando è premuto */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); /* Riduce l'ombra */
}


/* Stile generale della tabella */
.custom-user-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
    font-family: Arial, sans-serif;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
}

/* Stile dell'intestazione */
.custom-user-table th {
    background: #0073aa;
    color: white;
    text-align: left;
    padding: 12px;
    font-size: 14px;
}

/* Stile delle celle */
.custom-user-table td {
    padding: 10px;
    border-bottom: 1px solid #ddd;
    font-size: 14px;
}

/* Alternanza colori righe */
.custom-user-table tr:nth-child(even) {
    background: #f9f9f9;
}

/* Hover sulle righe */
.custom-user-table tr:hover {
    background: #f1f1f1;
}

/* Stile per il pulsante "Modifica" */
.custom-user-table .button {
    display: inline-block;
    background: #28a745;
    color: white;
    padding: 6px 12px;
    text-decoration: none;
    border-radius: 5px;
    font-size: 13px;
    transition: background 0.3s;
}

.custom-user-table button:hover {
    background: #218838;
}

/* Stile per il campo di ricerca e attivazione/disattivazione utente */
.custom-search-form {
    margin-bottom: 10px;
}

.custom-search-form input {
    padding: 8px;
    width: 200px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 14px;
}

.custom-search-form button {
    padding: 8px 12px;
    background: #0073aa;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 14px;
}

.custom-search-form  button:hover {
    background: #005f8d;
}

/* Stile per la paginazione */
#pagination {
    text-align: center;
    margin-top: 20px;
}

#pagination button {
    background-color: #0073aa; /* Blu WordPress */
    color: white;
    border: none;
    padding: 8px 12px;
    margin: 5px;
    cursor: pointer;
    border-radius: 5px;
    font-size: 14px;
    transition: background-color 0.3s;
}

#pagination button:hover {
    background-color: #005a87; /* Blu più scuro */
}

#pagination button.active {
    background-color: #00456a; /* Blu ancora più scuro */
    font-weight: bold;
    cursor: default;
}

.custom-user-table td {
    white-space: nowrap; /* Impedisce il ritorno a capo */
    overflow: hidden;
    text-overflow: ellipsis; /* Mostra i tre puntini se il testo è troppo lungo */
    max-width: 200px; /* Imposta una larghezza massima per evitare colonne troppo larghe */
}

#showAllRecords {
    background-color: #0073aa; /* Blu WordPress */
    color: white;
    border: none;
    padding: 8px 16px;
    margin: 10px 0;
    cursor: pointer;
    border-radius: 5px;
    font-size: 14px;
    transition: background-color 0.3s ease;
    display: block; /* Per farlo occupare tutta la larghezza disponibile */
    text-align: center;
}

#showAllRecords:hover {
    background-color: #005a87; /* Blu più scuro */
}