.line:nth-child(odd) {
    background: #0001
}

.hoverable:hover {
    background: #0002;
}

.abs-right {
    position: absolute;
    right: 0;
}

.site-contact-card {
    height: 150px;
}

.table-container {
    overflow-y: auto; /* Scroll vertical */
    border: 1px solid #ccc;
    position: relative;
}

table {
    width: 100%;
    border-collapse: collapse;
}

thead {
    background-color: #f1f1f1;
    position: sticky;
    top: 0;
    z-index: 1; /* Pour s'assurer que l'en-tête reste au-dessus */
}

th, td {
    padding: 10px;
    text-align: left;
    border-bottom: 1px solid #ccc;
}

tbody tr:nth-child(even) {
    background-color: #e6e6e6;
}

.highlight {
    font-weight: bold;
}

.contact-trash {
    position: absolute;
    right: 0;
}

    .contact-trash:hover md-icon {
        color: var(--orange);
    }

.removing {
    background-color: #0002;
    color: #0005;
    fill: #0005;
}

    .removing :not(.md-button) > md-icon {
        fill: #0005;
    }

    .removing:hover {
        cursor: not-allowed;
    }

    .removing .contact-trash:hover md-icon {
        color: var(--green);
        fill: var(--green);
    }

.text-green {
    color: var(--green);
    fill: var(--green) !important;
}

    .text-green md-icon {
        fill: var(--green) !important;
    }

/*#region Notes*/
.drag-handle {
    cursor: grab; /* main ouverte */
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}

.note-item {
    position: relative;
    /*border-bottom: 1px solid #80808050;*/
}

    .note-item.dragging {
        /*display:none;*/
        opacity: 0.5;
    }

.note-placeholder {
    height: 40px; /* Hauteur de l'espace blanc pour indiquer la position */
    background-color: #f0f0f0;
    border: 2px dashed #cccccc;
}

/*#endregion*/

@media only screen and (min-width: 600px) {
    .site-contact-card {
        max-width: 300px;
    }
}