@import 'nav-frontend-core/less/_variabler.less';

.fileInput {
    &--withError {
        .attachmentButton {
            border: 2px dashed #ba3a26 !important;
        }
    }

    .attachmentButton {
        display: flex;
        height: 4rem;
        border: 2px dashed #c6c2bf;
        border-radius: 8px;
        justify-content: center;
        align-items: center;
        padding-left: 0;

        &__icon {
            display: inline-block;
            margin-right: 0.5rem;
        }

        &__label {
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            margin-left: 12px;
            font-weight: bold;
            margin-top: 0 !important;
            margin-bottom: 0 !important;
        }

        input {
            position: absolut;
            z-index: 0;
            width: 0;
            height: 0;
            overflow: hidden;
        }

        &:focus {
            outline: none;
            box-shadow: 0 0 0 3px @fokusFarge;
        }

        &:hover {
            border: 2px dashed #0067c5;
        }
    }
}