.nav-link {
    display: block;
    padding: 0.75rem 1.25rem;
    color: #cbd5e1;
    font-size: 0.9rem;
    text-decoration: none;
}

.nav-link:hover {
    background-color: #1e293b;
    color: #fff;
}

.nav-link.active {
    background-color: #4338ca;
    color: #fff;
    font-weight: 600;
}

/* Kis margó felül/alul, hogy a görgethető tartalom natív scrollbar-ja sose érjen hozzá a
   modal lekerekített sarkaihoz (különben a scrollbar "lesarkosítaná" a sarkokat). */
.modal-scroll {
    margin: 0.75rem 0;
    flex: 1 1 auto;
    min-height: 0;
}

.cf-table th {
    text-align: left;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #64748b;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid #e2e8f0;
}

.cf-table td {
    padding: 0.6rem 0.75rem;
    border-bottom: 1px solid #f1f5f9;
    font-size: 0.9rem;
}

.cf-table tr.inactive {
    opacity: 0.5;
}

.cf-badge {
    display: inline-block;
    border-radius: 9999px;
    padding: 0.1rem 0.6rem;
    font-size: 0.75rem;
    font-weight: 600;
}

.cf-badge.active { background: #dcfce7; color: #166534; }
.cf-badge.inactive { background: #f1f5f9; color: #64748b; }

/* Akció-oszlop: egységes ikongombok sora, minden töréspontnál. */
.cf-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.25rem;
}

/* Táblázat -> kártya nézet kis képernyőn, hogy ne kelljen vízszintesen görgetni. */
@media (max-width: 767px) {
    .cf-table thead { display: none; }
    .cf-table, .cf-table tbody, .cf-table tr { display: block; width: 100%; }
    .cf-table tr {
        margin-bottom: 0.75rem;
        border: 1px solid #e2e8f0;
        border-radius: 0.75rem;
        padding: 0.5rem 0.85rem;
        background: #fff;
    }
    .cf-table tbody tr:last-child { margin-bottom: 0; }
    .cf-table tr.inactive { background: #fafafa; }
    .cf-table td {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 0.75rem;
        padding: 0.5rem 0;
        border-bottom: 1px solid #f1f5f9;
        text-align: right;
    }
    .cf-table td:last-child { border-bottom: none; }
    .cf-table td[data-label]::before {
        content: attr(data-label);
        font-size: 0.7rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.03em;
        color: #94a3b8;
        text-align: left;
        flex-shrink: 0;
    }
    .cf-table td .cf-td-value {
        min-width: 0;
        overflow-wrap: anywhere;
    }
    .cf-table td.cf-actions {
        justify-content: flex-start;
        gap: 0.5rem;
        padding-top: 0.75rem;
    }

    /* Legalább 16px, hogy iOS Safari ne zoomoljon rá fókuszáláskor. */
    input, select, textarea {
        font-size: 16px;
    }
}