styles_v2.css

html {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
*, *:before, *:after {
    -webkit-box-sizing: inherit;
    -moz-box-sizing: inherit;
    box-sizing: inherit;
}

/*! Tablesaw - v3.0.9 - 2018-12-07
* https://github.com/filamentgroup/tablesaw
* Copyright (c) 2018 Filament Group; Licensed MIT */
.tablesaw{width:100%;max-width:100%;empty-cells:show;border-collapse:collapse;border:0;padding:0}.tablesaw *{box-sizing:border-box}.tablesaw-stack td .tablesaw-cell-label,.tablesaw-stack th .tablesaw-cell-label{display:none}@media only all{.tablesaw-stack{clear:both}.tablesaw-stack td,.tablesaw-stack th{text-align:left;display:block}.tablesaw-stack tr{clear:both;display:table-row}.tablesaw-stack td .tablesaw-cell-label,.tablesaw-stack th .tablesaw-cell-label{display:inline-block;padding:0 .6em 0 0;width:30%}.tablesaw-stack th .tablesaw-cell-label-top,.tablesaw-stack td .tablesaw-cell-label-top{display:block;padding:.4em 0;margin:.4em 0}.tablesaw-cell-label{display:block}.tablesaw-stack tbody th.group{margin-top:-1px}.tablesaw-stack th.group b.tablesaw-cell-label{display:none!important}}
@media (max-width:47.9375em){
    .tablesaw-stack tbody tr{display:block;width:100%;
        border-bottom: 1px solid #000;}
    .tablesaw-stack thead td,.tablesaw-stack thead th{display:none}.tablesaw-stack tbody td,.tablesaw-stack tbody th{display:block;float:left;clear:left;width:100%}.tablesaw-cell-label{vertical-align:top}.tablesaw-cell-content{display:inline-block;max-width:67%}.tablesaw-stack .tablesaw-stack-block .tablesaw-cell-label,.tablesaw-stack .tablesaw-stack-block .tablesaw-cell-content{display:block;width:100%;max-width:100%;padding:0}.tablesaw-stack td:empty,.tablesaw-stack th:empty{display:none}}@media (min-width:48em){.tablesaw-stack tr{display:table-row}.tablesaw-stack td,.tablesaw-stack th,.tablesaw-stack thead td,.tablesaw-stack thead th{display:table-cell;margin:0}.tablesaw-stack td .tablesaw-cell-label,.tablesaw-stack th .tablesaw-cell-label{display:none!important}}



.table-container {
    position: relative;
    z-index: 0;
}

.icon {
    font-size: 20px;
}

.table-remove {
    color: #8c0001;
    cursor: pointer;
}

.table-remove:hover {
    color: #e80900;
}

.table-up, .table-down {
    color: #5755d9;
    cursor: pointer;
}

.table-up:hover, .table-down:hover {
    color: #2f2d6d;
}

.table-add {
    color: #227c2e;
    cursor: pointer;
}

.table-add:hover {
    color: #32b643;
}

/* Icons

Single-colored icons can be modified like so:
.icon-name {
  font-size: 32px;
  color: red;
}
*/
.icon {
    display: inline-block;
    width: 16px;
    height: 16px;
    stroke-width: 0;
    stroke: currentColor;
    fill: currentColor;
}

/* Buttons */
.table-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #fff;
    border: .05rem solid #5755d9;
    border-radius: .1rem;
    color: #5755d9;
    cursor: pointer;
    display: inline-block;
    font-size: 16px;
    line-height: 1.2rem;
    outline: none;
    padding: .25rem .4rem;
    text-align: center;
    text-decoration: none;
    transition: background .2s, border .2s, box-shadow .2s, color .2s;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    vertical-align: middle;
    white-space: nowrap;
    margin: 1em 0;
}

.table-button:focus {
    box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2);
}

.table-button:focus,
.table-button:hover {
    background: #f1f1fc;
    border-color: #4b48d6;
    text-decoration: none;
}

.table-button.fav{
    position: fixed;
    position: sticky;
    bottom: 2%;
}

/* Forms */
select,
textarea {
    font-family: inherit; /* 1 (changed) */
    font-size: inherit; /* 1 (changed) */
    line-height: inherit; /* 1 (changed) */
    margin: 0; /* 2 */
}

/** Remove the inheritance of text transform in Edge, Firefox, and IE. 1. Remove the inheritance of text transform in Firefox. */
button,
select {
    /* 1 */ text-transform: none;
}

.form-select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #fff;
    border: .05rem solid #bcc3ce;
    border-radius: .1rem;
    color: inherit;
    font-size: .8rem;
    height: 1.8rem;
    line-height: 1.2rem;
    outline: none;
    padding: .25rem .4rem;
    vertical-align: middle;
    width: 100%;
}

.form-select option{
    font-weight: normal;
}

.form-select:focus {
    border-color: #5755d9;
    box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2);
}

.form-select::-ms-expand {
    display: none;
}

.form-select.select-sm {
    font-size: .7rem;
    height: 1.4rem;
    padding: .05rem 1.1rem .05rem .3rem;
}

.form-select.select-lg {
    font-size: .9rem;
    height: 2rem;
    padding: .35rem 1.4rem .35rem .6rem;
}

.form-select[size],
.form-select[multiple] {
    height: auto;
    padding: .25rem .4rem;
}

.form-select[size] option,
.form-select[multiple] option {
    padding: .1rem .2rem;
}

.form-select:not([multiple]):not([size]) {
    background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%204%205'%3E%3Cpath%20fill='%23667189'%20d='M2%200L0%202h4zm0%205L0%203h4z'/%3E%3C/svg%3E") no-repeat right .35rem center/.4rem .5rem;
    padding-right: 1.2rem;
}

.table-input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #fff;
    background-image: none;
    border: 0;
    border-bottom: .05rem solid #bcc3ce;
    border-radius: 0;
    color: #3b4351;
    display: inline-block;
    max-width: 100%;
    outline: none;
    padding: .25rem .4rem;
    position: relative;
    transition: background .2s, border .2s, box-shadow .2s, color .2s;
}


/* Table styles */
.table-client{
    position: relative;
    display: inline-block;
}
.table-client .client-date{
    float: right;
}
.table-client .client-date input{
    border-bottom: 0;
    text-align: center;
}

table.table-editable {
    border-collapse: collapse;
    border-spacing: 0;
    text-align: left;
    width: 100%;
    font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
    font-size: 14px;
    table-layout:fixed;
}

table.table-editable td{
    vertical-align: top;
}

table.table-editable tr td{
    transition: background-color .5s ease-out;
    background-color: #fff;
}

table.table-editable tr.is-moving td{
    background-color: #FF5252;
}

.search-form{
    font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
    font-size: 14px;
}

.table-editable tbody tr:nth-of-type(odd) {
    background: #f7f8f9;
}

.table-editable tbody tr.active {
    background: #eef0f3;
}

.table-editable tbody tr:hover {
    background: #eef0f3;
}

.table-editable th small{
    font-weight: normal;
    font-size: 10px;
    display: block;
}

.table-editable td,
.table-editable th {
    border: 1px solid #dadee4;
    padding: .2rem;
}

@media (max-width:47.9375em) {
    .table-editable td,
    .table-editable th{
        border-bottom: 0;
    }
    .table-editable thead th{
        width: 100% !important;
    }

    .table-editable tbody tr {
        display: block;
        width: 100%;
        border-bottom: 3px solid #dadee4;
        margin-bottom: 10px;
        overflow: hidden;
    }
}

.table-editable th {
    border-bottom-width: .1rem;
}

.table-editable .row-hidden {
    display: none;
}

/* Actions buttons */
.actions-buttons{
    list-style: none;
    padding: 0;
    margin: 0;
    white-space: nowrap;
    position: relative;
}

.actions-buttons > li {
    display: inline-block;
    vertical-align: middle;
}

.actions-buttons > li span{
    padding: .3em;
}

.actions-arrows > span{
    display: block;
    margin: 1em 0;
}

.actions-select{
    float: left;
}

.rows-select{

}

@media (max-width:47.9375em) {
    .tablesaw-cell-content{
        width: 67%;
    }
    .actions-buttons{
        width: 100%;
    }
    .actions-buttons > li > span{
        padding: .5em 1em;
        margin: 0;
    }
    .actions-arrows > span{
        display: inline-block;
    }
}

/* Helpers */
.is-disabled{
    filter:alpha(opacity=44); /* IE */
    -moz-opacity:0.44; /* Mozilla */
    opacity: 0.44;
    filter:alpha(opacity=44);
}
.is-disabled td{
    background-color: #ededed;
}
.is-disabled td:hover{
    background-color: #ededed;
}

.is-hidden{
    display: none !important;
}

.is-invisible{
    visibility: hidden;
}

.form-input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #fff;
    background-image: none;
    border: .05rem solid #bcc3ce;
    border-radius: .1rem;
    color: #3b4351;
    display: block;
    font-size: .8rem;
    height: 1.8rem;
    line-height: 1.2rem;
    max-width: 100%;
    outline: none;
    padding: .25rem .4rem;
    position: relative;
    transition: background .2s, border .2s, box-shadow .2s, color .2s;
    width: 100%;
}

.form-input:focus {
    border-color: #5755d9;
    box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2);
}

.form-input:-ms-input-placeholder {
    color: #bcc3ce;
}

.form-input::-ms-input-placeholder {
    color: #bcc3ce;
}

.form-input::placeholder {
    color: #bcc3ce;
}

.form-input.input-sm {
    font-size: .7rem;
    height: 1.4rem;
    padding: .05rem .3rem;
}

.form-input.input-lg {
    font-size: .9rem;
    height: 2rem;
    padding: .35rem .6rem;
}

.form-input.input-inline {
    display: inline-block;
    vertical-align: middle;
    width: auto;
}

.form-input[type="file"] {
    height: auto;
}

textarea.form-input,
textarea.form-input.input-lg,
textarea.form-input.input-sm {
    height: auto;
}

.form-input-hint {
    color: #bcc3ce;
    font-size: .7rem;
    margin-top: .2rem;
}

.has-success .form-input-hint,
.is-success + .form-input-hint {
    color: #32b643;
}

.has-error .form-input-hint,
.is-error + .form-input-hint {
    color: #e85600;
}

.form-checkbox{
    display: block;
    line-height: 1.2rem;
    margin: .2rem 0;
    min-height: 1.4rem;
    position: relative;
}




fieldset{
    margin-bottom: 1rem;
    border: 0;
    padding: 0;
}
.search-form{
    max-width: 400px;
    z-index: 1;
    position: relative;
}

.filter-list > .multiselect,
.filter-list > div,
.filter-list > select{
    float: left;
    width: 33%;
    position: relative;
    font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
}

.filter-list > div:not(:first-child){
    margin-left: .5%;
}

.filter-list > div label{
    font-weight: normal;
}

@media (max-width:47.9375em) {
    .filter-list > div .form-select,
    .filter-list > div {
        font-size: .7rem;
    }
}

.select-box {
    position: relative;
}

.select-overlay{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.select-box select {
    width: 100%;
    pointer-events: none;
}

.dietary-checkboxes {
    border: 1px #dadada solid;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
}

.dietary-checkboxes label {
    display: block;
}

.dietary-checkboxes label:hover {
    background-color: #4b48d6;
    color: #fff;
}

.js-table{
    opacity: .2;
    pointer-events: none;
    transition: opacity .5s ease;
}
.js-table.is-loaded{
    opacity: 1;
    pointer-events: auto;
}

.table-with-filters td{
    white-space: pre-line;
}