.order-form-container{
    height: calc(100vh - 308px);
    overflow-y: auto;
    overflow-x: hidden;
}

.mat-button-toggle-checked.mat-button-toggle-appearance-standard{
    color: white !important;
}

.mat-button-toggle-checked{
    background-color: #2196F3 !important;
}

.order-type-container{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding-bottom: 22px;
    box-sizing: border-box;
}

.attached_container_horizontal{
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: stretch;
}

.attached_container_vertical{
    width: 100%;
    display: flex;
    flex-direction: column;
}

.attached_container_horizontal .attach-button{
    width: 160px;
    border-radius: 4px 0 0 4px;
}

.attached_container_vertical .attach-button{
    width: 100%;
    border-radius: 4px 4px 0 0;
}

.attach-button{
    padding: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

.attach_enabled{
    cursor: pointer;
}

.attach_enabled:hover{
    opacity: 0.9;
}

.attach-button mat-icon{
    transform: scale(1.5);
    margin: 8px 0;
}

.attach-button span{
    margin-top: 8px;
    text-align: center;
}

.attached_container_horizontal .attached-files-container{
    border-top-style: dashed;
    border-top-color: #3F51B5;
    border-radius: 0 4px 4px 0;
}

.attached_container_vertical .attached-files-container{
    border-left-style: dashed;
    border-left-color: #3F51B5;
    border-radius: 0 0 4px 4px;
}

.attached-files-container{
    box-sizing: border-box;
    width: 100%;
    border-right-style: dashed;
    border-right-color: #3F51B5;
    border-bottom-style: dashed;
    border-bottom-color: #3F51B5;
}

.attached_container_vertical .attached-files-container .no-attached-files{
    margin: 16px 0;
}

.no-attached-files{
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}

.attached_container_horizontal .attached-files-container div .attached-file{
    height: 33%;
}

.attached_container_vertical .attached-files-container div .attached-file{
    height: 40px;
}

.attached-file{
    width: 100%;
    padding: 4px 12px;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    justify-content: space-between;
}

.attached-file:hover{
    background-color: rgba(0, 0, 0, 0.05);
}

.attached-file .file-name{
    width: 45%;
}

.attached-file .file-size{
    width: 25%;
    text-align: center;
    font-weight: bold;
}

.attached-file .delete-file{
    width: 30%;
    text-align: right;
    cursor: pointer;
}

.attached_disabled{
    background-color: rgba(0, 0, 0, 0.12);
    color: rgba(0, 0, 0, 0.38);
}