/*----------------------------------------------------------
    GENERAL
----------------------------------------------------------*/

label {
    display: block;
    width: 100%;
    font-weight: 700;
    padding-bottom: .625em;
    line-height: 1.2;
}


/*----------------------------------------------------------
    LABEL INFORMATION
----------------------------------------------------------*/

.label-info {
    display: inline-block;
    width: 1.25em;
    height: 1.25em;
    background-color: var(--color-grey-light);
    text-indent: -99999px;
    border-radius: 50%;
    margin-left: .5em;
}

.label-info:hover {
    background-color: var(--color-grey);
}


/* QUESTION */

.label-info.label-question {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6.336' height='11.617' viewBox='0 0 6.336 11.617'%3E%3Cpath id='Pfad_126' data-name='Pfad 126' d='M2.789-3.2A4.677,4.677,0,0,1,3-4.672a3.767,3.767,0,0,1,.8-1.2L4.82-6.922a2.368,2.368,0,0,0,.656-1.594A1.821,1.821,0,0,0,5.047-9.8a1.618,1.618,0,0,0-1.25-.465,1.881,1.881,0,0,0-1.281.422,1.426,1.426,0,0,0-.484,1.133H.586a2.632,2.632,0,0,1,.9-2.043A3.374,3.374,0,0,1,3.8-11.531a3.182,3.182,0,0,1,2.3.793,2.877,2.877,0,0,1,.824,2.176,3.935,3.935,0,0,1-1.266,2.7L4.8-5.023a2.63,2.63,0,0,0-.57,1.82ZM2.727-.727a.848.848,0,0,1,.215-.59.814.814,0,0,1,.637-.238.826.826,0,0,1,.641.238.84.84,0,0,1,.219.59.812.812,0,0,1-.219.582.842.842,0,0,1-.641.23.829.829,0,0,1-.637-.23A.82.82,0,0,1,2.727-.727Z' transform='translate(-0.586 11.531)' fill='%231a1a1a'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: center;
}


/*----------------------------------------------------------
    FORM GROUPS / ROWS
----------------------------------------------------------*/

.form-group:not(:first-child) {
    margin-top: 1.5em;
}

.form-group:not(.radio-group) .form-item:not(:first-child) {
    margin-top: 1.25em;
}

.form-group.radio-group .form-item:not(:nth-child(-n+2)) {
    margin-top: 1.25em;
}

.form-group.radio-group .form-item label {
    font-weight: inherit;
}

.form-row.column-50 {
    display: flex;
    flex-wrap: wrap;
}


/* LOGGED IN */

.logged-in .form-row {
    display: flex;
    grid-gap: var(--grid-gap);
    flex-wrap: wrap;
}

.logged-in .form-group .form-row .form-item+.form-item {
    margin-top: 0;
}

.logged-in .form-row:not(:first-child) {
    margin-top: 1.25em;
}

.logged-in h2+.form-group:not(:first-child) {
    margin-top: 0;
}


/* FORM GRID */

.logged-in .form-column.col-20 {
    max-width: 20%;
}

.logged-in .form-column.col-25 {
    max-width: 25%;
}

.logged-in .form-column.col-33 {
    max-width: 33%;
}

.logged-in .form-column.col-40 {
    max-width: 40%
}

.logged-in .form-column.col-50 {
    max-width: 50%
}

.logged-in .form-column.col-75 {
    max-width: 75%;
}

.logged-in .form-column.col-100 {
    max-width: 100%;
}

@media (max-width: 1280px) {
    .logged-in .form-column.col-lg-25 {
        min-width: 25%;
        max-width: 25%;
    }
    .logged-in .form-column.col-lg-33 {
        min-width: 33%;
        max-width: 33%;
    }
    .logged-in .form-column.col-lg-50 {
        min-width: 50%;
        max-width: 50%;
    }
    .logged-in .form-column.col-lg-75 {
        min-width: 75%;
        max-width: 75%;
    }
    .logged-in .form-column.col-lg-100 {
        min-width: 100%;
        max-width: 100%;
    }
}

@media (max-width: 1024px) {
    .logged-in .form-column.col-md-25 {
        min-width: 25%;
        max-width: 25%;
    }
    .logged-in .form-column.col-md-33 {
        min-width: 33%;
        max-width: 33%;
    }
    .logged-in .form-column.col-md-50 {
        min-width: 50%;
        max-width: 50%;
    }
    .logged-in .form-column.col-md-75 {
        min-width: 75%;
        max-width: 75%;
    }
    .logged-in .form-column.col-md-100 {
        min-width: 100%;
        max-width: 100%;
    }
}

@media (max-width: 768px) {
    .logged-in .form-column.col-sm-25 {
        min-width: 25%;
        max-width: 25%;
    }
    .logged-in .form-column.col-sm-33 {
        min-width: 33%;
        max-width: 33%;
    }
    .logged-in .form-column.col-sm-50 {
        min-width: 50%;
        max-width: 50%;
    }
    .logged-in .form-column.col-sm-75 {
        min-width: 75%;
        max-width: 75%;
    }
    .logged-in .form-column.col-sm-100 {
        min-width: 100%;
        max-width: 100%;
    }
}

@media (max-width: 556px) {
    .logged-in .form-column.col-xs-25 {
        min-width: 25%;
        max-width: 25%;
    }
    .logged-in .form-column.col-xs-33 {
        min-width: 33%;
        max-width: 33%;
    }
    .logged-in .form-column.col-xs-50 {
        min-width: 50%;
        max-width: 50%;
    }
    .logged-in .form-column.col-xs-75 {
        min-width: 75%;
        max-width: 75%;
    }
    .logged-in .form-column.col-xs-100 {
        min-width: 100%;
        max-width: 100%;
    }

    .logged-in .form-row {
        flex-direction: column;
    }
    .form-item.form-column.col-50 {
        max-width: 100%;
    }
}


/* BUTTON GROUP */

.form-group.btn-group {
    margin-top: 3.75em;
}

.form-group.btn-group .form-row {
    justify-content: space-between;
}

button+button {
    margin-left: 1em;
}

@media (max-width: 556px) {
    button+button {
        margin-left: 0;
        margin-top: 1em;
    }
}

/*----------------------------------------------------------
    FORM ITEMS
----------------------------------------------------------*/

.form-item {
    position: relative;
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
}

.form-row.column-50 .form-item {
    min-width: 50%;
}


/*----------------------------------------------------------
    INPUT, SELECT, TEXTAREA
----------------------------------------------------------*/

input,
select,
textarea {
    -webkit-appearance: none;
    appearance: none;
    border: 1px solid var(--color-grey);
    border-radius: var(--border-radius-inputs);
}

input[type=radio],
input[type=checkbox] {
    display: none;
}

input:not([type=checkbox]):not([type=radio]):hover,
select:hover,
textarea:hover {
    border-color: var(--color-grey);
    outline: 1px solid var(--color-grey);
}

input:not([type=checkbox]):not([type=radio]),
select,
textarea {
    min-height: 3.625em;
    width: 100%;
    padding: 1.25em;
    font-size: var(--font-size);
}

input:not([type=checkbox]):not([type=radio]):focus,
select:focus,
textarea:focus {
    border-color: var(--color-blue);
    outline: 1px solid var(--color-blue);
}

input[type=date] {
    font-family: 'Roboto';
}

input[readonly="readonly"],
input[readonly="true"] {
    color: var(--color-grey-medium);
    background-image: var(--icon-lock-locked);
    background-repeat: no-repeat;
    background-position: right 1em center;
    cursor: default;
}

input[readonly="true"]:not([type=checkbox]):not([type=radio]):hover,
input[readonly="readonly"]:not([type=checkbox]):not([type=radio]):hover,
input[readonly="true"]:not([type=checkbox]):not([type=radio]):focus,
input[readonly="readonly"]:not([type=checkbox]):not([type=radio]):focus {
    border: 1px solid var(--color-grey);
    outline: 0px solid var(--color-grey);
}

.form-row.payment-rate-row [readonly="readonly"],
.form-row.payment-rate-row input[readonly="true"] {
    background-image: none;
}

input:not([type=checkbox]):not([type=radio]).input-error,
textarea.input-error {
    border-color: var(--color-red);
    outline: 1px solid var(--color-red);
    background-color: #fbecec;
}

input:not([type=checkbox]):not([type=radio]).input-error:hover,
input:not([type=checkbox]):not([type=radio]).input-error:focus {
    border-color: var(--color-red);
    outline: 1px solid var(--color-red);
}

input[type=radio][disabled="true"] + label {
    background-image: var(--icon-lock-locked);
    background-repeat: no-repeat;
    background-position: center right 2em;
    background-size: .75em;
    cursor: default;
}

.form-row.reason-row textarea {
    border-radius: 0;
}

.form-row.reason-row:last-child textarea {
    border-radius: 0 0 var(--border-radius-inputs) var(--border-radius-inputs);
}

/* Read only in attachment */

.form-item.is-read-only.has-attachment:after {
    right: 3em;
}

.form-item.is-read-only.has-attachment [readonly="readonly"], .form-item.is-read-only.has-attachment input[readonly="true"] {
    padding-right: 6rem;
}

input#funds-project-main-grant-amount {
    text-align: right;
}


/* Validation - Error */

input.input-error:not([type=checkbox]):not([type=radio]):hover, select.input-error:hover, textarea.input-error:hover,
input.input-error:not([type=checkbox]):not([type=radio]):focus, select.input-error:focus, textarea.input-error:focus,
button.event-general-error,
textarea.input-error {
    border-color: var(--color-red);
    outline: 1px solid var(--color-red);
}

div.input-error-message,
select.input-error {
    color: var(--color-red);
}

.field-error-description {
    color: var(--color-red);
    list-style-type: none;
    margin: .4rem;
    padding: 0;
}


/* SELECT */

select {
    cursor: pointer;
    padding-right: 3em;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17.861' height='9.931' viewBox='0 0 17.861 9.931'%3E%3Cpath id='Pfad_1' data-name='Pfad 1' d='M-1180.831,346.174l7.516,7.516,7.516-7.516' transform='translate(1182.245 -344.759)' fill='none' stroke='%231a1a1a' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: right 1em center;
}

select[disabled="true"] {
    background-image: var(--icon-arrow-select), var(--icon-lock-locked);
    background-position: right 1em center, right 3em center;
    padding-right: 5em;
}


/* TEXTAREA */

textarea {
    min-height: 10em;
    padding-bottom: 2em;
    resize: none;
    font-family: inherit;
    line-height: inherit;
}

textarea.project-description {
    min-height: 24em;
}


/* CHARACTER COUNT */

.process-character-counting-wrapper {
    font-weight: 700;
    color: var(--color-green);
    font-size: .875em;
    position: absolute;
    bottom: .55em;
    right: 1em;
    width: calc(100% - 2em);
    text-align: right;
    background: #fff;
    padding: .25em 0;
}

.process-character-counting-wrapper.error {
    color: var(--color-red);
}

/* CK Editor Field */

textarea.process-ckeditor + .ck .ck-editor__editable {
    padding-bottom: 2rem;
}

textarea.input-error + .ck .ck-editor__editable:not(.ck-focused) {
    border-color: var(--color-red);
    outline: 1px solid var(--color-red);
}

/*----------------------------------------------------------
    CHECKBOXES & RADIOS
----------------------------------------------------------*/

.form-group.radio-group input[type=radio],
.form-group.checkbox-group input[type=checkbox] {
    display: none;
}

input[type=checkbox]+label,
input[type=radio]+label {
    position: relative;
    padding-left: 2.5em;
    margin: 0;
    cursor: pointer;
}

input[type=checkbox]+label:before,
input[type=radio]+label:before {
    display: inline-block;
    content: '';
    width: 1.5em;
    height: 1.5em;
    border: 1px solid var(--color-grey);
    position: absolute;
    left: 0;
    top: -.25em;
}

input[type=checkbox]:checked+label:before,
input[type=radio]:checked+label:before {
    border-color: var(--color-blue);
}

/* Validation - Error */

input[type=checkbox].input-error+label:before, input[type=radio].input-error+label:before {
    border-color: var(--color-red);
}

input[type=checkbox].input-error:checked+label:before {
    border-color: var(--color-blue);
}

/* CHECKBOXES */

input[type=checkbox]+label:before {
    border-radius: calc(var(--border-radius-inputs) / 1.5);
}

input[type=checkbox]:checked+label:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12.936' height='9' viewBox='0 0 12.936 9'%3E%3Cpath id='check2' d='M15.27,3.664a.562.562,0,0,1,0,.8L7.4,12.334a.562.562,0,0,1-.8,0L2.664,8.4a.563.563,0,0,1,.8-.8L7,11.141l7.475-7.476a.562.562,0,0,1,.8,0Z' transform='translate(-2.499 -3.499)' fill='%23fff'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: center;
    background-color: var(--color-blue);
}


/* RADIO */

input[type=radio]+label:before {
    border-radius: 50%;
}

input[type=radio]+label:after {
    display: inline-block;
    content: '';
    background-color: var(--color-blue);
    width: 1.25em;
    height: 1.25em;
    border-radius: 50%;
    position: absolute;
    left: 0.2em;
    top: -.1em;
    transform: scale(0);
    transition: all ease-in-out .2s;
}

input[type=radio]:checked+label:after {
    transform: scale(1);
}


/*----------------------------------------------------------
    BUTTONS
----------------------------------------------------------*/

.btn {
    -webkit-appearance: none;
    appearance: none;
    padding: 1.25em 2em;
    font-size: var(--font-size);
    border: 0;
    border-radius: var(--border-radius-btn);
    cursor: pointer;
    font-weight: 700;
    text-align: center;
    transition: all ease-in-out .2s;
    display: inline-block;
    text-decoration: none;
}


/* PRIMARY */

.btn.btn-primary {
    background-color: var(--color-grey-dark);
    color: #fff;
}

.btn.btn-primary:hover {
    background-color: var(--color-red);
}


/* SECONDARY */

.btn.btn-secondary {
    background-color: var(--color-grey-light);
    color: #000;
}

.btn.btn-secondary:hover {
    background-color: var(--color-grey);
}


/* SUCCESS */

.btn.btn-success {
    background-color: var(--color-green);
    color: #fff;
}

.btn.btn-success:hover {
    background-color: var(--color-green-medium);
}

.btn.btn-success:focus {
    background-color: var(--color-green-dark);
}

.logged-out .btn {
    width: 100%;
}

/* DELETE */

.btn.btn-delete {
    background-color: var(--color-red);
    color: #fff;
}

.btn.btn-delete:hover {
    background-color: var(--color-red-medium);
}

.btn.btn-delete:focus {
    background-color: var(--color-red-dark);
}


/* SMALL BUTTON */

.btn.btn-small {
    padding: .875em 1.25em;
}


/* BLUE FUNCTION BUTTONS */

.btn.btn-blue-light {
    background-color: var(--color-blue-light);
    color: var(--color-blue-medium);
}

.btn.btn-blue-light:hover {
    background-color: var(--color-blue-medium);
    color: #fff;
}

.btn.btn-blue-light:focus {
    background-color: var(--color-blue-dark);
    color: #fff;
}

.btn.has-icon {
    padding-left: 4em;
    padding-top: 1.5em;
    padding-bottom: 1.5em;
    background-position: left 1em center;
    background-repeat: no-repeat;
}

.btn.has-icon.icon-cal-single-outline {
    background-image: var(--icon-cal-single-outline-blue);
}

.btn.has-icon.icon-cal-single-outline:hover,
.btn.has-icon.icon-cal-single-outline:focus {
    background-image: var(--icon-cal-single-outline-white);
}

.btn.has-icon.icon-cal-series-outline {
    background-image: var(--icon-cal-series-outline-blue);
}

.btn.has-icon.icon-cal-series-outline:hover,
.btn.has-icon.icon-cal-series-outline:focus {
    background-image: var(--icon-cal-series-outline-white);
}

.btn.has-icon.icon-cal-single-outline-dark {
    background-image: var(--icon-cal-single-outline-dark);
}

.btn.has-icon.icon-cal-single-outline-dark:hover,
.btn.has-icon.icon-cal-single-outline-dark:focus {
    background-image: var(--icon-cal-single-outline-dark);
}

.btn.has-icon.icon-cal-series-outline-dark {
    background-image: var(--icon-cal-series-outline-dark);
}

.btn.btn-ghost {
    border: 1px solid #fff;
    color: #fff;
}

.btn.btn-ghost:hover {
    background-color: #fff;
}

.btn-dark.btn-ghost {
    border-color: #000;
    color: #000;
}

/* DELETE PROCESS BUTTON */

.btn-dark.btn-ghost.btn-delete-process {
    text-indent: -99999px;
    border-color: var(--color-grey);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32.66' height='32.66' viewBox='0 0 32.66 32.66'%3E%3Cpath id='delete' d='M124.83,49.934a3.266,3.266,0,0,1,3.266-3.266h9.8a3.266,3.266,0,0,1,3.266,3.266V53.2h6.532a1.633,1.633,0,0,1,0,3.266h-1.746L144.53,76.295a3.266,3.266,0,0,1-3.258,3.033H124.717a3.266,3.266,0,0,1-3.258-3.033l-1.416-19.829H118.3a1.633,1.633,0,0,1,0-3.266h6.532ZM128.1,53.2h9.8V49.934h-9.8Zm-4.778,3.266,1.4,19.6h16.555l1.4-19.6Z' fill='%23a9a9a9' transform='translate(-116.665 -46.668)'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 1.5em;
}

.btn-dark.btn-ghost.btn-delete-process:hover {
    border-color: var(--color-red);
    background-color: var(--color-red);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32.66' height='32.66' viewBox='0 0 32.66 32.66'%3E%3Cpath id='delete' d='M124.83,49.934a3.266,3.266,0,0,1,3.266-3.266h9.8a3.266,3.266,0,0,1,3.266,3.266V53.2h6.532a1.633,1.633,0,0,1,0,3.266h-1.746L144.53,76.295a3.266,3.266,0,0,1-3.258,3.033H124.717a3.266,3.266,0,0,1-3.258-3.033l-1.416-19.829H118.3a1.633,1.633,0,0,1,0-3.266h6.532ZM128.1,53.2h9.8V49.934h-9.8Zm-4.778,3.266,1.4,19.6h16.555l1.4-19.6Z' fill='%23fff' transform='translate(-116.665 -46.668)'/%3E%3C/svg%3E%0A");
    
}

@media (max-width: 556px) {
    .btn {
        width: 100%;
    }
}

/* Save process loading animation */

button.btn-delete-cache.is-loading,
button.btn-save-process.is-loading,
button.btn-delete-cache.is-successful,
button.btn-save-process.is-successful {
    color: transparent;
}

button.btn-delete-cache,
button.btn-save-process {
    position: relative;
}

.loading-animation,
.process-saved {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.loading-animation svg {
    height: 100%;
}

button.btn-delete-cache.is-loading .loading-animation,
button.btn-save-process.is-loading .loading-animation,
button.btn-delete-cache.is-successful .process-saved,
button.btn-save-process.is-successful .process-saved {
    visibility: visible !important;
}

.process-saved {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12.936' height='9' viewBox='0 0 12.936 9'%3E%3Cpath id='check2' d='M15.27,3.664a.562.562,0,0,1,0,.8L7.4,12.334a.562.562,0,0,1-.8,0L2.664,8.4a.563.563,0,0,1,.8-.8L7,11.141l7.475-7.476a.562.562,0,0,1,.8,0Z' transform='translate(-2.499 -3.499)' fill='%23fff'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 1.75em;
}

/*----------------------------------------------------------
    UPLOAD
----------------------------------------------------------*/

.is-upload {
    background-color: var(--color-blue-light);
    padding: 1.75em 1.5em 1.75em 4em;
    color: var(--color-blue-medium);
    font-weight: 700;
    border-radius: var(--border-radius-btn);
    cursor: pointer;
    background-image: var(--icon-upload-outline-blue);
    background-repeat: no-repeat;
    background-position: left 1.25em center;
    transition: all ease-in-out .15s;
}

.is-upload:hover,
.is-upload:focus {
    background-image: var(--icon-upload-outline-white);
    color: #fff;
}

.is-upload:hover {
    background-color: var(--color-blue-medium);
}

.is-upload:focus {
    background-color: var(--color-blue-dark);
}

.is-upload.input-error {
    outline: 2px solid var(--color-red);
}

.is-upload.input-error:hover {
    outline: 2px solid var(--color-red);
}


/* UPLOAD LIST */

.file-upload-list {
    display: flex;
    flex-direction: column;
    grid-gap: 1em;
}

.file-upload-item {
    background-color: var(--color-grey-light);
    padding: 1.75em 1.5em 1.75em 4em;
    font-weight: 700;
    border-radius: var(--border-radius-btn);
    cursor: pointer;
    background-image: var(--icon-doc-outline-dark);
    background-repeat: no-repeat;
    background-position: left 1.25em center;
    transition: all ease-in-out .15s;
    position: relative;
}

.file-upload-item:hover {
    background-color: var(--color-grey);
}

.file-upload-item:last-child,
.file-upload-item:only-child {
    margin-bottom: 1em;
}

.file-upload-actions {
    position: absolute;
    left: calc(100% + 1em);
    top: 0;
    height: 100%;
    display: flex;
    align-items: center;
}

a.file-view {
    position: absolute;
    width: 2em;
    height: 2em;
    top: calc(50% - 1em);
    right: 2em;
    text-indent: -9999px;
    background-image: var(--icon-eye-outline);
    background-repeat: no-repeat;
    background-position: center;
}

a.file-view:hover {
    background-image: var(--icon-eye-filled);
}

a.file-view:focus {
    background-image: var(--icon-eye-active);
}

/* Upload notes */

.process-upload-notes-wrapper {
    color: var(--color-grey-medium);
    font-size: .875rem;
    margin-top: .5rem;
    padding-left: 1rem;
}

/*----------------------------------------------------------
    TABEL VIEW
----------------------------------------------------------*/

.form-group.table-view .form-row {
    grid-gap: 0;
    margin-top: 0;
    position: relative;
}

.form-item.grid-column.col-20 {
    flex: 20% 0 0;
}

.form-item.grid-column.col-25 {
    flex: 25% 0 0;
}

.form-item.grid-column.col-40 {
    flex: 40% 0 0;
}

.form-item.grid-column.col-75 {
    flex: 75% 0 0;
}

.form-group.table-view .form-row .form-item.is-label {
    border-width: 1px 0 1px 1px;
    border-color: var(--color-grey);
    border-style: solid;
    border-radius: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.form-group.table-view .form-row .form-item.is-label input {
    color: #000;
}

.form-group.table-view .form-row .form-item.is-label br {
    display: none;
}

span.funds-required-label {
    font-weight: 700;
}

span.funds-required-label,
span.funds-required-description {
    display: block;
    padding-left: 1em;
}

span.funds-required-description {
    font-size: .75em;
}

.form-group.table-view .form-row:first-child .form-item.is-label {
    border-radius: var(--border-radius-inputs) 0 0 0;
}

.form-group.table-view .form-row:last-child .form-item.is-label {
    border-radius: 0 0 0 var(--border-radius-inputs);
}

.form-group.table-view .form-row .form-item.is-label label {
    padding: 0 0 0 1em;
}

.form-group.table-view .form-row .form-item input {
    border-radius: 0;
}

.form-group.table-view .form-row:first-child .form-item input {
    border-radius: 0 var(--border-radius-inputs) 0 0;
}

.form-group.table-view .form-row:last-child .form-item input {
    border-radius: 0 0 var(--border-radius-inputs) 0;
}

.form-group.table-view .form-row+.form-row {
    margin-top: -1px;
}

.form-group.table-view .form-row .form-item:not(.is-label) input {
    text-align: right;
}

.form-group.table-view .form-item.is-label input {
    border: 0;
    padding-left: 0;
    border-radius: 0;
    font-weight: 700;
}

.form-group.table-view .form-row:only-child .form-item.is-label {
    border-radius: var(--border-radius-inputs) 0 0 var(--border-radius-inputs);
}

.form-group.table-view .form-row:only-child .form-item input {
    border-radius: 0 var(--border-radius-inputs) var(--border-radius-inputs) 0;
}

.form-group.table-view .form-row:last-child .form-item:only-child input {
    border-radius: 0 0 var(--border-radius-inputs) var(--border-radius-inputs);
}


/* 3 or 4 FORM ITEMS */

.form-group.table-view .form-row.three-items .form-item select,
.form-group.table-view .form-group.table-view .form-row.four-items .form-item select,
.form-group.table-view .form-group.table-view .form-row.five-items .form-item select {
    border-radius: 0;
}

.form-group.table-view .form-row.three-items:last-child .form-item:first-child input,
.form-group.table-view .form-row.three-items:last-child .form-item:first-child select,
.form-group.table-view .form-row.four-items:last-child .form-item:first-child input,
.form-group.table-view .form-row.four-items:last-child .form-item:first-child select {
    border-radius: 0 0 0 var(--border-radius-inputs);
}

.form-group.table-view .form-row.three-items .form-item:nth-child(2) input,
.form-group.table-view .form-row.three-items .form-item:nth-child(2) select,
.form-group.table-view .form-row.four-items .form-item:nth-child(n+3) input,
.form-group.table-view .form-row.four-items .form-item:nth-child(n+3) select,
.form-group.table-view .form-row.five-items .form-item:nth-child(n+4) input,
.form-group.table-view .form-row.five-items .form-item:nth-child(n+4) select {
    border-width: 1px 0;
    border-radius: 0 !important;
}

.form-group.table-view .form-row.three-items .form-item:nth-child(2) input:hover,
.form-group.table-view .form-row.three-items .form-item:nth-child(2) input:focus,
.form-group.table-view .form-row.three-items .form-item:nth-child(2) select:hover,
.form-group.table-view .form-row.three-items .form-item:nth-child(2) select:focus,
.form-group.table-view .form-row.four-items .form-item:nth-child(n+3) input:hover,
.form-group.table-view .form-row.four-items .form-item:nth-child(n+3) input:focus,
.form-group.table-view .form-row.four-items .form-item:nth-child(n+3) select:hover,
.form-group.table-view .form-row.four-items .form-item:nth-child(n+3) select:focus,
.form-group.table-view .form-row.five-items .form-item:nth-child(n+4) input:hover,
.form-group.table-view .form-row.five-items .form-item:nth-child(n+4) input:focus,
.form-group.table-view .form-row.five-items .form-item:nth-child(n+4) select:hover,
.form-group.table-view .form-row.five-items .form-item:nth-child(n+4) select:focus {
    border-width: 1px;
    padding-right: calc(1.25em - 1px);
}


/* ITEM INPUT ATTACHMENT */


.form-item.has-attachment input {
    padding-right: 4em;
}

.form-group.table-view .form-item input:hover,
.form-group.table-view .form-item input:focus,
.form-group.table-view .form-item select:hover,
.form-group.table-view .form-item select:focus {
    position: relative;
    z-index: 10;
}

.form-item.has-attachment:after {
    display: flex;
    align-items: center;
    content: '';
    position: absolute;
    right: 1em;
    bottom: 0;
    text-transform: uppercase;
    width: 2em;
    height: 100%;
    line-height: 1;
    z-index: 20;
    pointer-events: none;
    max-height: 3.8em;
}

.form-item.has-attachment.attachment-eur:after {
    content: 'EUR';
}

.overview-container .form-item.has-attachment {
    display: flex;
    justify-content: end;
    padding-right: 4em;
}


/* ROW ACTION BUTTONS */

.form-row-actions {
    position: absolute;
    left: calc(100% + 1em);
    display: flex;
    align-items: center;
    height: 100%;
}

.btn-action {
    width: 2.5em;
    height: 2.5em;
    -webkit-appearance: none;
    appearance: none;
    border: 0;
    text-indent: -9999px;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    cursor: pointer;
}

.btn-action.btn-add {
    background-image: var(--icon-plus-outline);
}

.btn-action.btn-add:hover {
    background-image: var(--icon-plus-filled);
}

.btn-action.btn-add:focus {
    background-image: var(--icon-plus-focus);
}

.btn-action.btn-remove {
    background-image: var(--icon-minus-outline);
    margin: 0;
}

.btn-action.btn-remove:hover {
    background-image: var(--icon-minus-filled);
}

.btn-action.btn-remove:focus {
    background-image: var(--icon-minus-focus);
}

.btn-action.btn-add:not(.hidden)+.btn-action.btn-remove {
    margin-left: 1em;
}


/* CONFIRM REMOVE */

.action-confirm.confirm-remove {
    margin-left: 1em;
    box-shadow: 0 5px 20px rgb(0 0 0 / 20%);
    padding: 1.5em;
    border-radius: var(--border-radius-btn);
    position: relative;
    background-color: #fff;
}

.action-confirm.confirm-remove:before {
    position: absolute;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10.057' height='23' viewBox='0 0 10.057 23'%3E%3Cpath id='Polygon_2' data-name='Polygon 2' d='M10.183,1.151a2,2,0,0,1,2.633,0l6.175,5.4a2,2,0,0,1-1.317,3.505H5.325A2,2,0,0,1,4.008,6.552Z' transform='translate(0 23) rotate(-90)' fill='%23fff'/%3E%3C/svg%3E%0A");
    display: block;
    content: '';
    width: .75em;
    height: 1.5em;
    left: -.5em;
    top: calc(50% - .75em);
    z-index: 1;
    background-repeat: no-repeat;
}

.action-confirm.confirm-remove button {
    white-space: nowrap;
}

button.btn.btn-warning {
    background-color: var(--color-grey-dark);
    color: #fff;
}

button.btn.btn-warning:hover {
    background-color: var(--color-red);
}

button.btn.btn-warning:focus {
    background-color: var(--color-red-medium);
}


/* TABLE VIEW WITH HEADER */

.form-row.is-header {
    background-color: var(--color-grey-light);
    border-color: var(--color-grey);
    border-width: 1px 1px 0 1px;
    border-style: solid;
    border-radius: var(--border-radius-inputs) var(--border-radius-inputs) 0 0;
    padding: .5em 0;
}

.form-row.is-header .form-item {
    padding: 0 1em;
}


/* TABLE DESCRIPTIOM */

.table-description {
    font-weight: 700;
    padding-left: 1em;
    margin-top: 1.5em;
}

.table-description+.form-group {
    margin-top: .5em;
}

.form-group+.table-description {
    margin-top: 2em;
}


/* DIFFERECE INDICATOR */

.difference-in-percent {
    position: absolute;
    top: .5em;
    right: 1.5em;
    font-size: .75em;
}

.form-item.is-difference input {
    background-color: transparent;
    background-image: none;
    z-index: 10;
    position: relative;
    color: #000;
}

.form-item.is-difference:before {
    display: block;
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    opacity: .2;
}

.form-item.is-difference.is-negative-amount:before {
    background-color: var(--color-red);
}

.form-item.is-difference.is-positive-amount:before {
    background-color: var(--color-green);
}

.form-item.is-difference.is-negative-amount .difference-in-percent {
    color: var(--color-red);
}

.form-item.is-difference.is-positive-amount .difference-in-percent {
    color: var(--color-green);
}


/* FUNDING CALCULATION */

.is-funding-calculation .form-group.table-view .form-row .form-item.grid-column.col-100 input {
    background-image: none;
    text-align: left;
    font-weight: 700;
}

.form-group.table-view .form-row .form-item.is-name input {
    text-align: left;
}

.form-group.table-view .form-row .form-item.is-name input,
.form-item.is-old-amount input,
.form-item.is-new-amount input {
    background-image: none;
    border-right: 1px solid transparent;
}

.form-item.is-new-amount input:hover {
    border-right: 1px solid var(--color-grey);
}

/*.is-funding-calculation .form-group.table-view .form-row:last-child .form-item input {
    border-radius: 0;
}*/

.is-funding-calculation .form-group.table-view .form-row:last-child .form-item:first-child input {
    border-radius: 0 0 0 var(--border-radius-inputs);
}

.is-funding-calculation .form-group.table-view .form-row:last-child .form-item:last-of-type input {
    border-radius: 0 0 var(--border-radius-inputs) 0;
}

.is-funding-calculation .form-group.table-view .form-row:only-child .form-item:last-of-type input {
    border-radius: 0 var(--border-radius-inputs) var(--border-radius-inputs) 0;
}

.is-funding-calculation .form-group.table-view .form-row:last-child .form-item:only-child input {
    border-radius: 0 0 var(--border-radius-inputs) var(--border-radius-inputs);
}


/* DATEPICKER */

.datetimepicker-dummy .datetimepicker-dummy-wrapper input.datetimepicker-dummy-input {
    border-radius: 0;
    padding-right: 4em;
}

.form-group.table-view.has-header .datetimepicker-dummy .datetimepicker-dummy-wrapper {
    border-radius: 0;
    border: 0;
}

.form-group.table-view.has-header .form-item+.form-item:not(:last-child) .datetimepicker-dummy .datetimepicker-dummy-wrapper input {
    border: 1px solid var(--color-grey);
    border-right: 1px solid transparent;
    border-radius: 0;
}

.form-group.table-view.has-header .form-item+.form-item:not(:last-child) .datetimepicker-dummy .datetimepicker-dummy-wrapper input:hover {
    border-right: 1px solid var(--color-grey);
    outline: 1px solid var(--color-grey);
}

.form-group.table-view.has-header .form-item:only-child .datetimepicker-dummy .datetimepicker-dummy-wrapper input {
    border: 1px solid var(--color-grey);
}

.form-group.table-view.has-header .form-item:only-child .datetimepicker-dummy .datetimepicker-dummy-wrapper input:hover {
    outline: 1px solid var(--color-grey);
}


/*----------------------------------------------------------
    RESULT TABLE
----------------------------------------------------------*/

.form-group.table-view[class*=result-table] {
    background-color: var(--color-blue-dark);
    font-size: 1.5em;
    border-radius: var(--border-radius-btn);
    padding: 1em 0;
    color: #fff;
    margin: 1.5em 0;
}

.form-group.table-view[class*=result-table] .form-item.is-label {
    border-radius: 0;
    border: 0;
}

.form-group.table-view[class*=result-table] .form-item.is-label label {
    font-weight: 400;
}

.form-group.table-view[class*=result-table] .form-item.has-attachment.attachment-eur:after {
    font-weight: 700;
}

.form-group.table-view[class*=result-table] .funding-result-value {
    text-align: right;
    padding-right: 4em;
    font-weight: 700;
}

.form-group.table-view[class*=result-table] > div:not(:last-child) {
    font-size: .75em;
}

.form-group.table-view[class*=result-table] > div + div {
    padding-top: .5em;
}

.form-group.table-view[class*=result-table] > div:last-child .form-item.is-label label {
    padding-left: .75em;
}

.form-group.table-view[class*=result-table] > div:last-child .funding-result-value {
    padding-right: 3em;
} 

.form-group.table-view[class*=result-table] > div:last-child .form-item.has-attachment.attachment-eur:after {
    right: .75em;
}

/* ^ is Summary */

.form-group.table-view.funding-summary-result-table > div:last-child {
    font-size: .75em;
}

.form-group.table-view.funding-summary-result-table > div:last-child .form-item.is-label label {
    padding-left: 1em;
}

.form-group.table-view.funding-summary-result-table > div:last-child .funding-result-value {
    padding-right: 4em;
}

.form-group.table-view.funding-summary-result-table > div:last-child .form-item.has-attachment.attachment-eur:after {
    right: 1em;
}

/* IS LABEL INPUT */

.form-group.table-view .form-row .form-item.is-label input {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding-left: 1em;
}

.form-group.table-view .form-row:last-child .form-item.is-label input {
    border-radius: 0 0 0 var(--border-radius-inputs);
}

.form-group.table-view .form-row .form-item.is-label input:hover {
    outline: 2px solid var(--color-grey);
}

.form-group.table-view .form-row .form-item.is-label input:focus {
    outline: 2px solid var(--color-blue);
}


/*----------------------------------------------------------
    MOBILE STYLES
----------------------------------------------------------*/

@media (max-width: 556px) {
    .form-group.table-view .form-row .form-item.is-label {
        border-width: 0;
    }
    
    .form-group.table-view .form-row .form-item.is-label label {
        padding: 0;
        margin-bottom: .5em;
    }
    
    .form-group.table-view .form-row:first-child .form-item input,
    .form-group.table-view .form-row .form-item input,
    .is-funding-calculation .form-group.table-view .form-row:last-child .form-item input,
    .is-funding-calculation .form-group.table-view .form-row:last-child .form-item:last-of-type input,
    .form-group.table-view .form-row.three-items:last-child .form-item:first-child input, 
    .form-group.table-view .form-row.three-items:last-child .form-item:first-child select, 
    .form-group.table-view .form-row.four-items:last-child .form-item:first-child input, 
    .form-group.table-view .form-row.four-items:last-child .form-item:first-child select,
    .form-group.table-view .form-row.three-items .form-item:nth-child(2) input, 
    .form-group.table-view .form-row.three-items .form-item:nth-child(2) select, 
    .form-group.table-view .form-row.four-items .form-item:nth-child(n+3) input, 
    .form-group.table-view .form-row.four-items .form-item:nth-child(n+3) select, 
    .form-group.table-view .form-row.five-items .form-item:nth-child(n+4) input, 
    .form-group.table-view .form-row.five-items .form-item:nth-child(n+4) select{
        border-radius: var(--border-radius-inputs) !important;
    }

    .form-group.table-view .form-row.three-items .form-item:nth-child(2) input, 
    .form-group.table-view .form-row.three-items .form-item:nth-child(2) select, 
    .form-group.table-view .form-row.four-items .form-item:nth-child(n+3) input, 
    .form-group.table-view .form-row.four-items .form-item:nth-child(n+3) select, 
    .form-group.table-view .form-row.five-items .form-item:nth-child(n+4) input, 
    .form-group.table-view .form-row.five-items .form-item:nth-child(n+4) select {
        border-width: 1px;
    }
    
    .form-group.table-view {
        display: flex;
        flex-direction: column;
        gap: var(--grid-gap);
    }
    
    
    .form-row.funding-new-description-wrapper.is-for-adding {
        padding-right: 4em;
    }
    
    .form-row-actions {
        left: calc(100% - 3em);
    }

    .form-row.is-header {
        display: none;
    }
    
    .form-group.table-view .form-row+.form-row {
        margin-top: 0;
    }
    
    .form-group.table-view .form-row.three-items {
        gap: var(--grid-gap);
        display: flex;
        flex-direction: column;
    }
    
    .table-description {
        padding-left: 0;
    }
    
    .form-group.table-view[class*=result-table] {
        padding: 1em;
    }
    
}


/*----------------------------------------------------------
    PROJECT EVENT BTN GROUP
----------------------------------------------------------*/

.btn-project-event-selection-wrapper {
    margin-bottom: 2rem;
}

.btn-project-event-selection-wrapper .form-item {
    display: flex;
    gap: 1em;
    flex: 1 1 0;
}

.btn-project-event-selection-wrapper .form-item button + button {
    margin: 0;
}

.btn-project-event-selection-wrapper .form-item button {
    flex: 1 1 0;
    text-align: left;
    width: 100%;
}

.btn-project-event-selection-wrapper .form-item button.is-active {
    background-color: var(--color-grey);
}


.btn.has-icon.icon-cal-online-outline-dark {
    background-image: var(--icon-cal-online-outline-dark);
}

.btn.has-icon.icon-gear-dark {
    background-image: var(--icon-gear-dark);
}

.form-group.btn-group.btn-project-event-selection-wrapper.group-help-container {
    margin-bottom: 1rem;
}

@media (max-width: 767px) {
    .btn-project-event-selection-wrapper .form-item {
        flex-wrap: wrap;
    }
    
    .btn-project-event-selection-wrapper .form-item button {
        width: 36%;
    }
}