:root {
    /* --space-s : 10px;
    --space-l : 20px;
    --bs-card-color: #222 !important;     */
}


.ui-dialog * {
    font-family: sans-serif !important;
    p, h1,h2, h3, h4 { color: #222 !important;}


    [data-drupal-selector="layout-paragraphs-layout-options"] {
        summary {
                padding: 10px;
                background: #eee;                
                margin-bottom: 20px;
                border-radius: 8px;
        }
        .so-horizontal-tabs__wrapper {
            display: flex !important;
        }
    }
    

}
.card-body {
    
    color: #222 !important;
}


.ui-dialog.lpb-dialog.ui-widget.ui-widget-content.ui-front {
    width: 100% !important;
    max-width: 1320px;


    .grid, .grid.horizontal-tabs-pane>div {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
        gap: 10px;      
        h3 {
            display: flex; align-items: center;font-size: large;
        }        
        label {
            font-size: 0.9rem;
        }   
    }

    .grid21 {
        display: grid;
        grid-template-columns: 2fr 1fr;
        gap: 10px;
    }

    .grid4-1 {
        display: grid;
        grid-template-columns: 4fr 1fr;
        gap: 10px;
    }

    .flex {
        display: flex;        
        gap: 40px;

    }

    /* sekcja - 3 kolumny  */
    [data-drupal-selector="edit-layout-paragraphs-config-layout-column-ratio-3-column-ratio"] > .fieldset-wrapper{
        display: flex   ;
    }

    /* pole media */
    .media-library-selection .media-library-item.media-library-item--grid {    
        width: 80%;
        width: calc(80% - 1rem);
        max-width: 400px;
    }
    

    /* iconbox */
    
        .ui-menu {
            background-color: #b1b1b1;
        }
    
    .lpb-component-list__search {
        display: none;
    }

    .lpb-component-list__group>div>div {
        width: 100%;
        background: #eee;
        padding: 5px 10px;
        margin: 5px;
        border: 1px dotted;
        transition: all 0.3s ease;

        a {
            font-size: 1.2rem;
            margin: 0.3rem 0;
            text-decoration: none;
            color: #000 !important;
        }
    }

    .lpb-component-list__group--content {
        width: 100%;
        max-width: 1000px;
        margin-inline: auto;
        margin-top: 20px;
        margin-bottom: 20px;
        border-top: 1px solid #b1b1b1;
        padding-top: 20px;
        display: grid !important;
        grid-template-columns: repeat(3, 1fr);
        grid-gap: 10px;
    }

}

#drupal-modal {
    padding: 0;
    #media-library-wrapper {
        /* display: grid !important;
        grid-template-columns: 1fr 5fr; */
        width: 100%;

        .js-media-library-menu {
            background-color: #eee;
            padding: 10px 0;
            width: 230px;
            ul {
                width: 100%;

                li {
                    --bs-nav-pills-border-radius: 0;
                }

                a {
                    text-decoration: none;
                }
            }
        }

        ul.js-media-library-menu {
            list-style-type: none;
            padding: 10px;
            border-right: 1px solid #eee;

            li {
                padding: 10px;
                border-bottom: 1px solid #eee;
            }

            li a.active {
                font-weight: 700;
            }
        }
    }

    #media-library-content {
        padding: 20px;
        width: 100%;

        /* podpis pod medium  */
        .media-library-views-form__rows .media-library-item__name {
            font-size: 12px;
            line-height: 14px;
        }

    }
}






/* --------------------------------------------------------------------  */
.group-flex>.fieldset__wrapper {
    display: flex;
}

.group-flex.flex12>.fieldset__wrapper>fieldset {
    width: 100%
}

.group-flex.flex12>.fieldset__wrapper>fieldset>.fieldset__wrapper>fieldset>.fieldset__wrapper>div {
    width: 33%
}

.media-library-widget .fieldset__wrapper {
    flex-direction: column
}

.field--name-field-kategoria {
    min-width: 300px;
}

.layout-node-form .media-library-selection .media-library-item--grid {
    width: 50% !important
}

.layout-node-form #field_obraz-media-library-wrapper {
    margin-right: 20px
}

.layout-node-form .ck .drupal-media {
    max-width: 1000px;
    width: 100%
}

.layout-node-form iframe {
    max-width: 1000px;
    width: 100%;
    height: 550px
}

.field-group-html-element.m-0>.fieldset {
    margin: 0
} 

.grid11 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.grid56 {
    display: grid;
    grid-template-columns: 5fr 6fr;
    gap: 20px;
}

.grid322 {
    display: grid;
    grid-template-columns: 3fr 2fr 2fr;
    gap: 10px;
}

.flex {
    display: flex;
    gap: 20px
}