Buenas tardes tengo problemas con la manera en que se ve mi contenido de la tabla html. El código

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

     /*
                             Please consider that the JS part isn't production ready at all, I just code it to show the concept of merging filters and titles together !
                             */
                            $(document).ready(function () {
                                $('.filterable .btn-filter').click(function () {
                                    var $panel = $(this).parents('.filterable'),
                                            $filters = $panel.find('.filters input'),
                                            $tbody = $panel.find('.table tbody');
                                    if ($filters.prop('disabled') == true) {
                                        $filters.prop('disabled', false);
                                        $filters.first().focus();
                                    } else {
                                        $filters.val('').prop('disabled', true);
                                        $tbody.find('.no-result').remove();
                                        $tbody.find('tr').show();
                                    }
                                });

                                $('.filterable .filters input').keyup(function (e) {
                                    /* Ignore tab key */
                                    var code = e.keyCode || e.which;
                                    if (code == '9')
                                        return;
                                    /* Useful DOM data and selectors */
                                    var $input = $(this),
                                            inputContent = $input.val().toLowerCase(),
                                            $panel = $input.parents('.filterable'),
                                            column = $panel.find('.filters th').index($input.parents('th')),
                                            $table = $panel.find('.table'),
                                            $rows = $table.find('tbody tr');
                                    /* Dirtiest filter function ever ;) */
                                    var $filteredRows = $rows.filter(function () {
                                        var value = $(this).find('td').eq(column).text().toLowerCase();
                                        return value.indexOf(inputContent) === -1;
                                    });
                                    /* Clean previous no-result if exist */
                                    $table.find('tbody .no-result').remove();
                                    /* Show all rows, hide filtered ones (never do that outside of a demo ! xD) */
                                    $rows.show();
                                    $filteredRows.hide();
                                    /* Prepend no-result row if all rows are filtered */
                                    if ($filteredRows.length === $rows.length) {
                                        $table.find('tbody').prepend($('<tr class="no-result text-center"><td colspan="' + $table.find('.filters th').length + '">No result found</td></tr>'));
                                    }
                                });
                            });
                            


<!-- language: lang-css -->

    .fixed_header{
        width: 100%;
        table-layout: fixed;
        
    }

    .fixed_header tbody{
      display:block;
      width: 100%;
      overflow: auto;
      height: 200px;
    }

    .fixed_header thead tr {
       display: block;
    }

    .fixed_header th, .fixed_header td {
     
      width: 200px;
    }

     .filterable {
                                margin-top: 15px;
    							
    							
                            }
                            .filterable .panel-heading .pull-right {
                                margin-top: -20px;
    							
                            }
                            .filterable .filters input[disabled] {
                                background-color: transparent;
                                border: none;
                                cursor: auto;
                                box-shadow: none;
                                padding: 0;
                                height: auto;
    														
    							
                            }
                            .filterable .filters input[disabled]::-webkit-input-placeholder {
                                color: #333;
    							font-size: 100%;			
    							
                            }
                            .filterable .filters input[disabled]::-moz-placeholder {
                                color: #333;
                            }
                            .filterable .filters input[disabled]:-ms-input-placeholder {
                                color: #333;
                            }

<!-- language: lang-html -->

     <div class="panel filterable panel-primary">
                        <div class="panel-heading">
                        <button class="btn btn-primary btn-filter" style="margin-right:10px"><span class="glyphicon glyphicon-search"></span> Buscar</button>
                        
                        </div>
                        <table class="table fixed_header" style="height: 50px;">
      <thead>
        <tr class="filters">
    								  			
    											
    											<th><input type="text" class="form-control text-center" style="padding-left: -50px" placeholder="Fecha Turno" disabled></th>
    											<th><input type="text" class="form-control text-center" placeholder="Hs Turno" disabled></th>
    											<th><input type="text" class="form-control text-center" placeholder="Prestador" disabled></th>
    											<th><input type="text" class="form-control text-center" placeholder="Afiliado" disabled></th>
    											<th><input type="text" class="form-control text-center" placeholder="Cancelado?" disabled></th>
    											<th><input type="text" class="form-control text-center" placeholder="#" disabled></th>
    													 
                                            </tr>
      </thead>
      <tbody>
        
          <tr class="text-center">
            
            <td>12-03-2020</td>
            <td>15:30</td>
    		<td>Carlos Sanchez</td>
    		<td>Franco Fernandez</td>
    		<td>NO</td>
            
    		<td><a>Cancelar</a></td>
    		
    		
          </tr>
        
      </tbody>
    </table>
    </div>

<!-- end snippet -->

 que tengo es el siguiente, yo quisiera que abarque todo el ancho del panel-primary.