/* nephodan styling za feather icons */
.feather {
    width: 24px;
    height: 24px;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    fill: none;

    display: flex;
    justify-content: center;
    align-items: center;
}

/* FEATHER ICONS */

.feather-chevron-down::before {
    content: "";
    display: inline-block;
    background-image: url("../img/icons/chevron-down.svg");
    background-repeat: no-repeat;
    height: 24px;
    width: 24px;
}

.feather-chevron-up::before {
    content: "";
    display: inline-block;
    background-image: url("../img/icons/chevron-up.svg");
    background-repeat: no-repeat;
    height: 24px;
    width: 24px;
}

.feather-map-pin::before {
    content: "";
    display: inline-block;
    background-image: url("../img/icons/map-pin.svg");
    background-repeat: no-repeat;
    background-size: contain;
    height: 24px;
    width: 24px;
}

.feather-edit::before {
    content: "";
    display: inline-block;
    background-image: url("../img/icons/edit.svg");
    background-repeat: no-repeat;
    height: 24px;
    width: 24px;
}

.feather-save::before {
    content: "";
    display: inline-block;
    background-image: url("../img/icons/save.svg");
    background-repeat: no-repeat;
    height: 24px;
    width: 24px;
}

.feather-trash-2::before {
    content: "";
    display: inline-block;
    background-image: url("../img/icons/trash-2.svg");
    background-repeat: no-repeat;
    height: 24px;
    width: 24px;
}

.feather-send::before {
    content: "";
    display: inline-block;
    background-image: url("../img/icons/send.svg");
    background-repeat: no-repeat;
    height: 24px;
    width: 24px;
}

.feather-x-square::before {
    content: "";
    display: inline-block;
    background-image: url("../img/icons/x-square.svg");
    background-repeat: no-repeat;
    height: 24px;
    width: 24px;
}

.feather-x::before {
    content: "";
    display: inline-block;
    background-image: url("../img/icons/x.svg");
    background-repeat: no-repeat;
    height: 24px;
    width: 24px;
}

.feather-x {
    position: absolute;
    right: 0;
    top: 0;
}

.feather-log-out::before {
    content: "";
    display: inline-block;
    /* -webkit-mask-image: url("../img/icons/log-out.svg"); */
    mask-image: url("../img/icons/log-out.svg");
    background-color: var(--color-neutral);
    background-repeat: no-repeat;
    height: 24px;
    width: 24px;
}

.feather-upload::before {
    content: "";
    display: inline-block;
    background-image: url("../img/icons/upload.svg");
    background-repeat: no-repeat;
    height: 24px;
    width: 24px;
}

.feather-lock::before {
    content: "";
    display: inline-block;
    background-image: url("../img/icons/lock.svg");
    background-repeat: no-repeat;
    height: 24px;
    width: 24px;
}

.feather-unlock::before {
    content: "";
    display: inline-block;
    background-image: url("../img/icons/unlock.svg");
    background-repeat: no-repeat;
    height: 24px;
    width: 24px;
}

.feather-info::before {
    content: "";
    display: inline-block;
    background-image: url("../img/icons/info.svg");
    background-repeat: no-repeat;
    height: 24px;
    width: 24px;
}

.feather-loader::before {
    content: "";
    display: inline-block;
    background-image: url("../img/icons/loader.svg");
    background-repeat: no-repeat;
    height: 24px;
    width: 24px;
    animation: spin 4s linear infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}