:root {
  --crm-fieldset-border: 0;
}

fieldset fieldset {
  --crm-fieldset-padding: 0
}
.crm-container fieldset:not(.collapsed, .crm-inactive-dashlet-fieldset) {
  padding-left: 0;
}


/* multi column fieldsets - can be specified for all fieldset in a container
or explicitly (used for custom blocks) */
.nook-multi-column-fieldsets fieldset:not([af-fieldset]),
.nook-multi-column-fieldset {
    container-type: inline-size;
    container-name: multicolumn;
    display: flex!important;
    flex-flow: row wrap;
    justify-content: flex-start;
    gap: 0 3rem;
}
.nook-multi-column-fieldsets fieldset:not([af-fieldset]) > *,
.nook-multi-column-fieldset > * {
    flex: 0 0 100%;
}

/* widths chosen to maintain a min width of 20rem (240px) */
@container multicolumn (width > 43rem) {
    .nook-multi-column-fieldsets fieldset:not([af-fieldset]) > *,
    .nook-multi-column-fieldset > * {
        flex-basis: calc(50% - 1.5rem);
    }
}
@container multicolumn (width > 66rem) {
    .nook-multi-column-fieldsets fieldset:not([af-fieldset]) > *,
    .nook-multi-column-fieldset > * {
        flex-basis: calc(33.3333% - 2rem);
    }
}

@container multicolumn (width > 89rem) {
    .nook-multi-column-fieldsets fieldset:not([af-fieldset]) > *,
    .nook-multi-column-fieldset > * {
        flex-basis: calc(25% - 2.25rem);
    }
}



.nook-labels-above .nook-read-only-input,
.nook-labels-above .nook-input,
.nook-labels-above af-field {
    display: grid;
    grid-template-areas:
      'icon label help'
      'input input input';
    grid-auto-columns: auto 2fr fit-content(40%);
    grid-auto-rows: auto 1fr;
    padding-bottom: 1rem;
    gap: 0.75rem 0;
}

.nook-labels-above af-field .crm-i {
    grid-area: icon;
    margin-right: 0.5rem;
}

.nook-labels-above label {
    grid-area: label;
}

.nook-labels-above .crm-af-field-help-pre {
    grid-area: help;
    font-style: italic;
    line-height: normal;
    margin-bottom: 0 !important;
    text-align: right;
}

.nook-labels-above :is(.nook-input,.nook-read-only-input) :is(input,select,table,textarea),
.nook-labels-above .crm-af-field {
    grid-area: input;
    width: 100%;
}
.nook-labels-above .crm-af-field > :is(input,select,ul,textarea) {
    width: 100%;
}

.nook-labels-above .nook-read-only-input table {
    --crm-font-size: var(--crm-input-font-size);
    --crm-table-header-bg: var(--nook-grey-dark);
    --crm-c-primary-text: var(--crm-c-text);
    margin: 0;
    display: table !important; /* fix for { display: contents } applied on smaller screens */
}

.nook-labels-above .crm-af-field .form-control {
    min-width: 100%;
}

.nook-help-text {
    --crm-font-size: 0.875rem;
    font-weight: 500;
}