app-invite-members {
    ion-header {
        ion-item {
            &.search {
                margin: var(--ion-margin-0);
                padding: var(--ion-padding-10) var(--ion-padding-15);

                ion-input {
                    height: inherit;

                    input {
                        padding: var(--ion-padding-10) !important;
                    }
                }

                ion-icon {
                    position: absolute;
                    color: #ccc;
                    right: 2px;
                    font-size: 22px;
                    z-index: 99;
                }
            }
        }
    }

    ion-content {
        ion-item {
            width: 100%;
            margin-bottom: 0;
            --min-height: inherit;
            padding: var(--ion-padding-15);

            ion-input {
                margin: var(--ion-margin-0);
                height: 30px;
                border-radius: 8px;

                input[type=text] {
                    padding: 8px !important;
                }
            }

            ion-icon {
                position: absolute;
                right: 10px;
                font-size: var(--ion-font-size-14);
            }
        }

        ion-list {
            padding: var(--ion-padding-0) !important;
            background: none !important;

            div {
                ion-checkbox {
                    margin: var(--ion-margin-0);
                    width: 100%;

                    &::part(container) {
                        border-radius: 5px;
                        --border-width: 1px;
                        padding: 2px;
                        width: 21px;
                        height: 21px;
                    }

                    &.ion-color-primary {
                        --ion-color-base: var(--ion-color-sangh) !important;
                    }

                    div {
                        background: var(--ion-background-content);
                        border-radius: 100%;
                        overflow: hidden;
                        display: flex;
                        margin-right: var(--ion-margin-10);

                    }

                    img {
                        width: 40px;
                        height: 40px;
                        margin: var(--ion-margin-0);
                        background: var(--ion-background-content);
                        border-radius: 100%;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        object-fit: cover;
                    }

                    ion-label {
                        display: flex;
                        align-items: center;

                        p {
                            text-overflow: ellipsis;
                            overflow: hidden;
                        }
                    }
                }
            }
        }
    }

    ion-footer {
        padding: var(--ion-padding-0) var(--ion-padding-15);
        background: var(--ion-background-content);

        ion-button {
            margin: 0;
        }
    }
}