.stock-notif-form-wrapper{
    position: absolute;
    top: 0;
    margin-left: -15px !important;
    visibility: hidden;
    padding: 2px;
    opacity: 0;
    transition: all 350ms ease;
    width: 100%;
    height: 100%;
    z-index:999;
    background-color: rgba(6, 73, 102, 0.8)
;
}

.stock-notif-form-wrapper form{
    display: flex;
    flex-direction: column;
    gap: 15px;
    align-items: center;
    justify-content: space-evenly;
    max-width: 100%;
    flex: 1 0;
}

.stock-notif-error-notif-div{
    font-size:clamp(0.8rem, 2vw + 3px, 14px) !important ;
    text-align: center;
    color: red;
}

.notify-inputs-wrapper{
    display: flex;
    flex-direction: column;
    gap: 5px;
    align-items: center;
}

.stock-notif-wrapper p{
    font-size: 0.8rem;
    font-weight: bolder;
    text-align: center;
}

.stock-notif-form-wrapper .inputs::placeholder{
    opacity: 0.6;
    font-size:clamp(0.8rem, 2vw + 3px, 14px) !important ;
}

.inputs.invalid{
    outline:2px solid red !important;
}

.inputs.valid{
    outline:2px solid green !important;
}

.stock-notif-wrapper .inputs{
    max-width: 100%;
    padding: 1px 1px;
    font-size:clamp(0.6rem, 2vw + 3px, 14px) !important;
}

.stock-notif-wrapper button{
    position: relative;
    background-color: #ffff;
    border: solid 2px rgba(6, 73, 102, 1) ;
    color: rgba(6, 73, 102, 1);
    font-size:clamp(0.6rem, 2vw + 3px, 14px) !important;
    padding: 15px;
    font-size: 0.6rem;
    cursor: pointer;
}

.stock-notif-form-wrapper.showForm{
    visibility: visible;
    display: flex;
    flex-direction: column;
    opacity: 1;
}

.company-addition input[name='company-name']{
    display:none
}

.company-addition input[name='company-number1'], .company-addition input[name='company-number2']{
    text-align: center;
    padding: 0;
    margin: 0 5px;
    color:red;
    width:2ch !important;
}

input[name='company-result']{
    text-align: center;
    padding: 0;
    margin: 0 5px;
    width: 4ch;
}