/* Styling for adding a new block */
#layout-builder-modal {
    font-family: var(--bs-body-font-family);
}

#layout-builder-modal .details-wrapper {
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 15px;
}

#layout-builder-modal .details-wrapper > .layout-builder-browser-block-item {
    background-color: rgba(255,255,255,.1);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 10px;
    min-height: 150px;
    text-align: center;
    color: white;
}
#layout-builder-modal .details-wrapper > .layout-builder-browser-block-item img {
    width: 150px;
    margin-bottom: 1em;
    display: block;
}

/* Styling for displaying section breakpoints */
#layout-builder-modal .blb_breakpoint_cols .form-radios>div {
    margin-bottom: 10px;
}

#layout-builder-modal .blb_breakpoint_cols .form-radios>div>input {
    display: none;
}

#layout-builder-modal .blb_breakpoint_cols .form-radios>div>label {
    display: flex;
}

#layout-builder-modal .blb_breakpoint_cols .form-radios>div>label .blb_breakpoint_col {
    margin: 0 10px;
    padding: 5px;
}
.details-wrapper#layout-builder-modal .blb_breakpoint_cols .form-radios>div {
    margin-bottom: 10px;
}

#layout-builder-modal .blb_breakpoint_cols .form-radios>div>input {
    display: none;
}

#layout-builder-modal .blb_breakpoint_cols .form-radios>div>label {
    display: flex;
}

#layout-builder-modal .blb_breakpoint_cols .form-radios>div>label .blb_breakpoint_col {
    margin: 0 10px;
    padding: 5px;
}

/* Styling of fieldsets */
#layout-builder-modal fieldset.form-item {
    border: 1px solid #ccced1;
    border-radius: 2px;
    padding: 1em;
}
#layout-builder-modal fieldset legend {
    display: inline;
    width: auto;
    float: none;
}

/* General model content padding */
#layout-builder-modal .bs_tab-pane {
    padding: 1em;
}

/* Collapsible bar (summary) */
#layout-builder-modal summary.bg-light {
    --bs-light-rgb: 90, 90, 90;
}

/* Checkboxes in modal */
#layout-builder-modal .form-check .form-check-input {
  margin-left: 0;
}

#layout-builder-modal {
    --ck-color-base-background: rgba(255,255,255,.9);
}