﻿.custom-form-control {
    display: flex;
    flex-direction: column;
    gap: 0.5rem; /* Odstępy między checkboxami */
}

.custom-checkbox {
    display: flex;
    align-items: center;
    /* margin-bottom: 0.5rem; */ /* Odstępy między checkboxami */
    margin-top: 0.5rem; /* Odstępy między checkboxami */
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 14px;
}

    .custom-checkbox input[type="checkbox"] {
        appearance: none;
        background-color: #f3f3f0;
        border: 1px solid #646360;
        padding: 9px;
        display: inline-block;
        position: relative;
        border-radius: 3px;
        margin-right: 10px;
        margin-bottom: 10px;
        cursor: pointer;
        transition: background-color 0.3s, border-color 0.3s;
    }

        .custom-checkbox input[type="checkbox"]:hover {
            background-color: #babab3;
        }

        .custom-checkbox input[type="checkbox"]:checked {
            background-color: #dc3545;
            border-color: #dc3545;
        }

            .custom-checkbox input[type="checkbox"]:checked::after {
                content: '\2714';
                font-size: 16px;
                color: white;
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
            }

    .custom-checkbox label {
        cursor: pointer;
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        font-size: 14px;
        margin-right: 10px;
        margin-bottom: 10px;
        white-space: nowrap;
    }

.permission-group-container {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
    justify-content: flex-start;
    padding: 0.25rem 0;
}

.permission-checkbox {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.25rem 0.6rem;
    border-radius: 0.5rem;
    background-color: var(--neutral-layer-1);
    box-shadow: var(--elevation-shadow-card-rest);
}

    .permission-checkbox label {
        white-space: normal;
        word-break: break-word;
        max-width: 8rem; /* zapobiega zbyt długim nazwom */
        font-size: 0.85rem;
    }