.foxis-logo {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    margin-left:10px;
}

.foxis-label {
    font-size: 32px;
    font-weight: bold;
    cursor:pointer;
    padding-right:10px;
}

.fox-content-panel-header {
    display: grid;
    grid-template-columns: 1fr 2fr;
    margin-bottom: 20px;
}

.fox-content-panel-buttons {
    display: flex;
    flex-direction: row;
    justify-content: end;
    align-items:center;
    flex-wrap:wrap;
    gap: 10px;
}

.fox-content-panel-buttons i {
    font-size: 24px !important;
}

.fox-main-title {
    display: flex;
    flex-direction: row;
    text-transform: uppercase;
    font-size: 28px;
    font-weight: bold;
    align-items: center;
    gap: 10px;
    margin-left:20px;
    white-space: nowrap;
}

.fox-main-title i {
    font-size: 36px !important;
}

.fox-content-section{
    margin:10px 10px 30px 10px;
}

.fox-content-section-title {
    width:100%;
    border-bottom: 1px solid rgba(0,0,0,0.08);
    margin-bottom:10px;
}

.fox-button {
    min-width: 150px !important;
    /*width: 150px;
    max-height: 40px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;*/
}

.fox-button-location {
    min-width: 150px !important;
    margin-bottom:2px !important;
}

.fox-splitbutton {
    min-width: 150px;
}

.fox-splitbutton button:first-child {
    width: 100%;
}

.fox-button-panel {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
}

.fox-button i{
    margin-right:4px;
}

.fox-icon-button{
    width:36px !important;
    height:36px !important;
}

.fox-icon-button i {
    font-size: 22px !important;
}

.fox-tab-item{
}

.fox-dashboard-panel {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    column-gap:80px;
    padding: 0rem 2rem;
}

.fox-dashboard-section {
    display: flex;
    flex-direction: column;
    justify-content: start;
    gap: 10px;
}

.fox-dashboard-section-title {
    display: flex;
    flex-direction: row;
    text-transform: uppercase;
    font-size: 28px;
    font-weight: bold;
    align-items: center;
    border-bottom: 2px solid rgba(0,0,0,0.08);
}

.fox-dashboard-section i {
    font-size: 28px !important;
}

.fox-dashboard-item a {
    display: flex;
    flex-direction: row;
    text-transform: uppercase;
    font-size: 18px;
    font-weight: bold;
    align-items: center;
    gap: 20px;
    transition: font-size 0.1s;
    padding:4px;
    border-radius:6px;
}

.fox-dashboard-item a:hover {
    text-decoration: none;
    background-color: white;
}

.fox-time-picker {
    display: flex;
    flex-direction: row;
    text-transform: uppercase;
    font-size: 18px;
    font-weight: bold;
    align-items: center;
}

.fox-time-picker i {
    font-size: 1.5em !important;
    margin-right:10px;
}

.fox-time-picker-numeric{
    width:54px;
}

.fox-time-picker-numeric input {
    font-size: 16px !important;
}

.fox-time-picker-symbol {
    padding-left: 6px;
    padding-right: 6px;
}

.fox-time-sheet-picker {
    display: flex;
    flex-direction: row;
    text-transform: uppercase;
    align-items: center;
    margin-top: 20px;
    margin-bottom: 20px;
}

.fox-time-sheet-picker-block {
    display: flex;
    flex-direction: row;
    text-transform: uppercase;
    align-items: center;
    margin-right: 40px;
    font-weight: bold;
}

.fox-time-sheet-title{
    padding-right:10px;
}

.fox-time-sheet-picker-total {
    font-size: 20px;
    padding: 10px 20px;
    border-radius:6px;
}

.fox-form-button-panel {
    display: flex;
    flex-direction: row;
    justify-content: end;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top:20px;
}

.fox-filter-button-panel {
    display: flex;
    flex-direction: row;
    /*justify-content: space-between;*/
    align-items: center;
    flex-wrap: wrap;
}

.fox-filter-button-panel .fox-button {
    min-width:100px !important;
}

.fox-filter-command-panel {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    padding-top: 1rem;
}

.fox-filter-button-panel .fox-button {
    border-radius:4px 20px 20px 4px;
}

.fox-color-badge {
    padding: 8px !important;
    border-radius: 4px !important;
    color: white !important;
}

.fox-filter-panel {
    margin-bottom: 10px;
    border: 1px solid #dadfe2;
}

.fox-filter-title {
    margin-bottom: 10px;
    font-size:12px;
    text-transform:uppercase;
    font-weight:bolder;
}

.fox-filter-row {
    display: table-row;
    flex-direction: row;
    align-items: center;
}

.fox-filter-header-row {
    display: flex;
    flex-direction: row;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
    padding-bottom: 1rem;
}

.fox-filter-row-block {
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-wrap: nowrap;
    padding: 0.25rem 0rem;
}

.fox-filter-component{
    display: table-cell;
    padding: 0rem 0.5rem 0rem 0rem;
}

.fox-filter-command-panel button{
    margin-left: 0.25rem;
}

.fox-filter-dropdown{
/*    width:300px;*/
}

.fox-filter-type-select {
    display: table-cell;
    padding: 0.25rem 1.5rem 0.25rem 0rem;
}

.fox-filter-input {
    width: 600px;
}

.fox-filter-date {
    width: 270px;
}

.fox-tooltip-text {
    white-space: pre-line;
}

@media only screen and (max-width: 768px) {
    .fox-content-panel-header {
        display: flex;
        flex-direction: column;
        margin-bottom: 20px;
    }

    .fox-content-panel-buttons {
        justify-content: start;
    }

    .fox-main-title {
        margin-bottom: 20px;
        white-space:normal;
    }

    .fox-dashboard-panel {
        display: flex;
        flex-direction: column;
        gap: 80px;
    }

    .fox-dashboard-section {
        gap: 20px;
    }

    .fox-dashboard-item a {
        display: flex;
        flex-direction: column;
        text-transform: uppercase;
        font-size: 18px;
        font-weight: bold;
        align-items: center;
        gap: 20px;
        transition: font-size 0.1s;
        padding: 50px 10px;
        border-radius: 6px;
        background-color: white;
        box-shadow: 0px 3px 4px rgba(0, 0, 0, 0.14);
    }

    .fox-dashboard-section i {
        font-size: 64px !important;
    }

    .fox-filter-button-panel {
        display: flex;
        flex-direction: column;
        justify-content: start;
        align-items: normal;
        flex-wrap: wrap;
        gap: 10px;
        width: 100%
    }

    .fox-filter-header-row {
        display: flex;
        flex-direction: column;
        gap: 10px;
        align-items: start;
        flex-wrap: wrap;
    }

    .fox-data-filter-header {
        padding: 0px !important;
    }

    .fox-filter-button-panel .fox-button {
        border-radius: 20px 20px 20px 20px;
        width: 100%;
    }

    .fox-filter-row-block {
        display: flex;
        flex-direction: row;
        align-items: center;
        flex-wrap: nowrap;
        width: 100%;
        overflow: hidden;
    }

    .fox-filter-row {
        display:flex !important;
        flex-direction: column;
        align-items: start;
        overflow: hidden;
        padding-top: 5px;
        padding-bottom: 5px;
        border-top: 1px solid rgba(0,0,0,0.08);
        margin-top: 5px;
    }

    .fox-filter-dropdown {
        width: 300px !important;
    }

    .fox-filter-type-select {
        width: 168px;
    }

    .fox-filter-input {
        width: 300px !important;
    }

    .fox-filter-date {
        width: 270px !important;
    }

    .fox-form-button-panel {
        display: flex;
        flex-direction: column;
        align-items: normal;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 20px;
    }

    .mobile-panel {
        margin-top: -1rem !important;
    }

    .rz-steps ul {
        display: grid;
    }

    .fox-filter-command-panel button {
        margin-left: 0.25rem;
        margin-bottom:0.25rem;
    }

    .rz-sidebar-toggle {
        margin-left:30px !important;
    }

    ul.rz-profile-menu{
        margin-right:10px;
    }

    .fox-packaging-select .rz-selectbutton {
        display: contents !important;
    }

    .fox-filter-component {
        padding: 0.5rem 0.5rem;
    }
}

.col-xl, .col-xl-auto, .col-xl-12, .col-xl-11, .col-xl-10, .col-xl-9, .col-xl-8, .col-xl-7, .col-xl-6,
.col-xl-5, .col-xl-4, .col-xl-3, .col-xl-2, .col-xl-1, .col-lg, .col-lg-auto, .col-lg-12, .col-lg-11,
.col-lg-10, .col-lg-9, .col-lg-8, .col-lg-7, .col-lg-6, .col-lg-5, .col-lg-4, .col-lg-3, .col-lg-2,
.col-lg-1, .col-md, .col-md-auto, .col-md-12, .col-md-11, .col-md-10, .col-md-9, .col-md-8, .col-md-7,
.col-md-6, .col-md-5, .col-md-4, .col-md-3, .col-md-2, .col-md-1, .col-sm, .col-sm-auto, .col-sm-12,
.col-sm-11, .col-sm-10, .col-sm-9, .col-sm-8, .col-sm-7, .col-sm-6, .col-sm-5, .col-sm-4, .col-sm-3,
.col-sm-2, .col-sm-1, .col, .col-auto, .col-12, .col-11, .col-10, .col-9, .col-8, .col-7, .col-6,
.col-5, .col-4, .col-3, .col-2, .col-1 {
    padding-left: 0.25rem !important;
    padding-right: 0.25rem !important;
}

.row {
    margin-left: -0.25rem !important;
    margin-right: -0.25rem !important;
}

.rz-tabview-panel {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
}

.rz-splitbutton .rz-button:not(.rz-splitbutton-menubutton) {
    min-width: 120px !important;
}

.fox-data-filter-header {
    font-size: 16px;
    padding: 10px 10px 10px 0px;
    text-transform: uppercase;
    font-weight: bold;
    white-space: nowrap;
    display: flex;
    flex-direction: row;
}

.rz-alert-md {
    padding: 0.5rem 1rem !important;
}

.fox-third-level {
    background-color: deepskyblue !important;
}

.fox-simple-table td{
    vertical-align:middle;
    height: 52px;
}

.foxalert .rz-dialog-titlebar {
    background-color: #f9777f;
}

.foxalert .rz-dialog-title {
    color: #fff;
}

.foxalert .rz-dialog-alert-message {
    font-size: 1.5rem;
}

.fox-issue-button {
    font-weight: bold !important;
    font-size: 1.2rem !important;
}

.fox-issue-button i{
    padding-right: 1rem;
}

.fox-packaging-select .rz-selectbutton{
    display: block !important;
}