body.layout--administration form {
    width: 100%;
    height: calc(100% - 1em - var(--layout-space));
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

body.layout--administration form .form-input-container {
    height: calc(100% - var(--btn-height) - var(--layout-padding-s));
    overflow-y: scroll;
    overflow-x: visible;
    width: calc(100% + var(--layout-padding) + 2px);
    padding-right: calc(var(--layout-padding) / 2 - 2px);
    padding-left: calc(var(--layout-padding) / 2);
    margin-left: calc(0px - (var(--layout-padding) / 2));
    margin-bottom: var(--layout-padding);
}

body.layout--administration form .form-section:not(:last-child) {
    margin-bottom: var(--layout-space);
    border-bottom: 1px solid var(--color-grey);
}

body.layout--administration form .form-section:first-child:last-child {
    margin-bottom: 0;
    border: none;
}

body.layout--administration form .row {
    flex-direction: row;
}

body.layout--administration form .form-field  {
    margin-bottom: var(--layout-space);
    width: 100%;
    justify-content: flex-end;
}

body.layout--administration form .form-section:last-child .row:last-child .form-field:last-child {
    margin-bottom: 0;
}

body.layout--administration form .form-field:not(:last-child) {
    margin-right: var(--layout-space);
}

body.layout--administration form .label-wrapper > *:not(label)  {
    color: var(--color-grey-medium);
    font-size: var(--font-size-text-s);
}

body.layout--administration form .form-field label {
    font-weight: 400;
    margin-bottom: var(--layout-space-s);
    font-size: var(--font-size-text-s);
}

body.layout--administration form .form-field.checkbox {
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
}

form .form-field.checkbox input[type="checkbox"] {
    flex: inherit !important;
    border-radius: 2px;
    border: 1px solid var(--color-grey);
    width: calc(var(--icon-size) / 1.5);
    height: calc(var(--icon-size) / 1.5);
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding: 0;
    background-size: auto;
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
}

form .form-field.checkbox input[type="checkbox"]:checked {
    background-color: var(--color-white);
    border: 1px solid var(--color-white);
    background-image: var(--icon-checkbox);
    filter: invert(1);
}

form .form-field.checkbox input[type="checkbox"] ~ label {
    margin: unset;
    margin-left: var(--layout-space-s);
}

body.layout--administration form .form-action-container button:not(:last-of-type) {
    margin-right: var(--layout-padding);
}

body.layout--administration .profile-container form .form-action-container {
    margin-bottom: var(--layout-space);
}

/* input */

body.layout--administration input:not([type="file"]),
body.layout--default input:not([type="file"]) {
    padding: 0 var(--layout-padding-s);
    height: var(--input-height-adnimistration);
    border-radius: var(--border-radius-small);
    transition: var(--transition);
    background-color: var(--color-grey-light);
    color: var(--color-black);
    border: none;
    font-size: var(--font-size-text-s);
    letter-spacing: var(--letter-spacing);
    font-family: 'Inter', sans-serif;
    font-weight: 400;
}

body.layout--administration input:focus-visible,
body.layout--default input:focus-visible {
    outline: 1px solid var(--color-grey);
}

body.layout--administration input::placeholder,
body.layout--default input::placeholder {
    color: var(--color-grey-medium);
}

body.layout--administration input:-webkit-autofill,
body.layout--administration input:-internal-autofill-selected {
    -webkit-box-shadow: 0 0 0px 1000px var(--color-grey-light) inset !important; 
    box-shadow: 0 0 0px 1000px var(--color-grey-light) inset !important;
    font-size: inherit !important;
}

body.layout--administration input:-moz-autofill {
    background-color: var(--color-grey-light) !important;
    color: var(--color-black) !important;
}

body.layout--administration form .form-field input[type="number"] {
    -moz-appearance: textfield;
}

body.layout--administration form .form-field input[type="number"]::-webkit-outer-spin-button,
body.layout--administration form .form-field input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

@container (max-width: 600px) {
    body.layout--administration form .form-input-container .row {
        flex-direction: column;
    }

    body.layout--administration form .form-input-container .row .form-field {
        margin-right: 0;
    }
}