@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Noto+Sans+Mono:wght@100;200;300;400;500;600;700;800;900&display=swap');

:root {
    --app-font-sans-serif: "Noto Sans", "Segoe UI", Roboto, "Helvetica Neue", "Liberation Sans", Arial, sans-serif;
    --app-font-monospace: "Noto Sans Mono", Consolas, "Liberation Mono", "Courier New", monospace;

    --app-body-font-family: var(--app-font-sans-serif);
    --app-body-font-size: 1rem;
    --app-body-font-weight: 400;
    --app-body-line-height: 1.5;


    --bs-border-radius: 0.375rem;
    --bs-border-radius-sm: 0.25rem;
    --bs-border-radius-lg: 0.5rem;
    --bs-border-radius-xl: 1rem;
    --bs-border-radius-xxl: 2rem;
    --bs-border-radius-2xl: var(--bs-border-radius-xxl);
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: var(--app-body-font-family);
    font-size: var(--app-body-font-size);
    font-weight: var(--app-body-font-weight);
    line-height: var(--app-body-line-height);
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* GENERICS */
a { cursor: pointer; }

.btn-outline-warning.remove-effects:hover, .btn-outline-warning.remove-effects:focus, .btn-outline-warning.remove-effects:focus-visible,
.btn-outline-warning.no-effects:hover, .btn-outline-warning.no-effects:focus, .btn-outline-warning.no-effects:focus-visible{
    color: #ffc107 !important;
    background-color: inherit !important;
    border-color: inherit !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.layout-page {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100vh !important;
}

.offcanvas-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1rem;
}

/* GROUP */
.group-container > .group + .group { margin-top: -1px; }
.group {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
}
.group > :not(:last-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.group > :not(:first-child) {
    margin-left: -1px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
.group > .group-item:not(.btn) {
    position: relative;
    flex: 1 1 auto;
    width: 1%;
    min-width: 0;
}
.group > .group-item:focus { z-index: 5 }

/* LOGIN CONTENT */
.login-content {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100vh;
    padding: 2rem 1rem;
}
.login-form-wrapper {
    max-width: 320px;
}
.form-floating>.form-control:not(:placeholder-shown)~label::after {
    background-color: transparent;
}

/* NAVIGATION BAR */
.navbar-top {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    min-height: 80px;
}
.navbar-top .navbar-container {
    display: flex !important;
    flex: 1 0 100%;
}
.navbar-top .navbar-logo {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
}
.navbar-top .navbar-logo > .navbar-brand img {
    font-size: .75rem;
    max-height: 48px;
}
.navbar-top .navbar-logo .logo-text {
    font-size: 1.0625rem;
    font-weight: 500;
    margin: 0;
}

/* OTHER */
@media (min-width: 768px) {
    .dataView-Img {
        max-height: 180px;
    }
}

.rounded-top-left {
    border-top-left-radius: var(--bs-border-radius) !important;
}
.rounded-top-right {
    border-top-right-radius: var(--bs-border-radius) !important;
}
.rounded-bottom-left {
    border-bottom-left-radius: var(--bs-border-radius) !important;
}
.rounded-bottom-right {
    border-top-right-radius: var(--bs-border-radius) !important;
}
.rounded-top-left-0 {
    border-top-left-radius: 0 !important;
}
.rounded-top-right-0 {
    border-top-right-radius: 0 !important;
}
.rounded-bottom-left-0 {
    border-bottom-left-radius: 0 !important;
}
.rounded-bottom-right-0 {
    border-bottom-right-radius: 0 !important;
}

/* MAIN CONTENT */
.main-content {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    padding: 2rem 0;
}

/* DATA VIEW */
.dataView-wrapper {
    /*display: flex;*/
    /*flex-wrap: wrap;*/
    width: 100%;
    overflow: auto;
}

.dataView-ListGroup {
    display: flex;
    /*flex-flow: column nowrap;*/
    flex-direction: column;
    flex-wrap: nowrap;
    width: 100%;
}
.dataView-ListGroup > .dataView-ListGroupItem.item-striped {
    box-shadow: inset 0 0 0 9999px rgba(255, 255, 255, .05);
}

.dataView-Filters, .dataView-CardGroup, .dataView-Pagination {
    display: flex;
    /*flex-flow: row wrap;*/
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    margin: 0;
    padding: 0;
}

.dataView-CardGroup {
    border-radius: .25rem;
}
.dataView-CardGroup > .dataView-CardItem {
    display: flex;
    width: 100%;
    border-radius: 0;
}
.dataView-CardGroup > .dataView-CardItem:first-child {
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
}
.dataView-CardGroup > .dataView-CardItem + .dataView-CardItem {
    /*border-top-width: 0;*/
    margin-top: -1px;
}
.dataView-CardGroup > .dataView-CardItem:last-child {
    border-bottom-left-radius: inherit;
    border-bottom-right-radius: inherit;
}
.dataView-CardGroup > .dataView-CardItem.item-striped {
    box-shadow: inset 0 0 0 9999px rgba(255, 255, 255, .05);
}

.dataView-Pagination {
    justify-content: center !important;
}

.pagination-nav, .pagination-select {
    display: flex;
    flex-wrap: wrap;
    padding-left: 0;
    margin-bottom: 0;
}

/* CART VIEW */
.cartView-Preview {
    width: 575px !important;
}

.cartView-ListGroup {
    display: flex;
    /*flex-flow: column nowrap;*/
    flex-direction: column;
    flex-wrap: nowrap;
    width: 100%;
    border-radius: 0;
}
.cartView-ListGroup > .cartView-ListGroupItem {
    border-right: 0;
    border-left: 0;
    padding: .75rem .5rem;
}

.cartView-CardGroup {
    display: flex;
    /*flex-flow: row wrap;*/
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    margin: 0;
    padding: 0;
    border-radius: 0;
}
.cartView-CardGroup > .cartView-CardItem {
    display: flex;
    width: 100%;
    border-left: 0;
    border-right: 0;
    border-radius: 0;
    padding: .75rem .5rem;
}
.cartView-CardGroup > .cartView-CardItem + .cartView-CardItem {
    /*border-top-width: 0;*/
    margin-top: -1px;
}

/* ORDER VIEW */
.orderView-wrapper {
    /*display: flex;*/
    /*flex-wrap: wrap;*/
    width: 100%;
    overflow: auto;
}
.orderView-CardItem {
    display: flex;
    width: 100%;
    margin-top: 1rem;
}
.orderView-CardItem:first-child {
    margin-top: 0;
}
/*.orderView-CardItem .orderView-OrderRow {
    padding: .5rem 0;
}*/
.orderView-CardItem .orderView-Summary > .orderView-SummaryRow + .orderView-SummaryRow {
    margin-top: -1px;
}

/* FOOTER */
.footer {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    margin: auto 0 0 !important;
    padding: 0;
}
.footer-content {
    padding: 2rem 0 1rem;
}
.footer-copyright {
    padding: 1rem 0;
}
.footer-content p, .footer-copyright p {
    margin: 0 0 .25rem;
}
.footer-copyright p {
    font-size: .875rem;
}

/* MEDIA */
@media (max-width: 359.98px) {
    .col-0-360 { flex: 1 0 0%; }
    .row-cols-0-360-auto > * {
        flex: 0 0 auto;
        width: auto;
    }
    .row-cols-0-360-1 > * {
        flex: 0 0 auto;
        width: 100%;
    }
    .row-cols-0-360-2 > * {
        flex: 0 0 auto;
        width: 50%;
    }
    .row-cols-0-360-3 > * {
        flex: 0 0 auto;
        width: 33.33333333%;
    }
    .row-cols-0-360-4 > * {
        flex: 0 0 auto;
        width: 25%;
    }
    .row-cols-0-360-5 > * {
        flex: 0 0 auto;
        width: 20%;
    }
    .row-cols-0-360-6 > * {
        flex: 0 0 auto;
        width: 16.66666667%;
    }
    .col-0-360-auto {
        flex: 0 0 auto;
        width: auto;
    }
    .col-0-360-1 {
        flex: 0 0 auto;
        width: 8.33333333%;
    }
    .col-0-360-2 {
        flex: 0 0 auto;
        width: 16.66666667%;
    }
    .col-0-360-3 {
        flex: 0 0 auto;
        width: 25%;
    }
    .col-0-360-4 {
        flex: 0 0 auto;
        width: 33.33333333%;
    }
    .col-0-360-5 {
        flex: 0 0 auto;
        width: 41.66666667%;
    }
    .col-0-360-6 {
        flex: 0 0 auto;
        width: 50%;
    }
    .col-0-360-7 {
        flex: 0 0 auto;
        width: 58.33333333%;
    }
    .col-0-360-8 {
        flex: 0 0 auto;
        width: 66.66666667%;
    }
    .col-0-360-9 {
        flex: 0 0 auto;
        width: 75%;
    }
    .col-0-360-10 {
        flex: 0 0 auto;
        width: 83.33333333%;
    }
    .col-0-360-11 {
        flex: 0 0 auto;
        width: 91.66666667%;
    }
    .col-0-360-12 {
        flex: 0 0 auto;
        width: 100%;
    }
    .w-0-360-25 { width: 25% !important; }
    .w-0-360-50 { width: 50% !important; }
    .w-0-360-75 { width: 75% !important; }
    .w-0-360-100 { width: 100% !important; }
    .w-auto { width: auto !important; }

    .order-0-360-first { order: -1 !important; }
    .order-0-360-0 { order: 0 !important; }
    .order-0-360-1 { order: 1 !important; }
    .order-0-360-2 { order: 2 !important; }
    .order-0-360-3 { order: 3 !important; }
    .order-0-360-4 { order: 4 !important; }
    .order-0-360-5 { order: 5 !important; }
    .order-0-360-last { order: 6 !important; }

    .m-0-360-0 { margin: 0 !important; }
    .m-0-360-1 { margin: 0.25rem !important; }
    .m-0-360-2 { margin: 0.5rem !important; }
    .m-0-360-3 { margin: 1rem !important; }
    .m-0-360-4 { margin: 1.5rem !important; }
    .m-0-360-5 { margin: 3rem !important; }
    .m-0-360-auto { margin: auto !important; }
    .mx-0-360-0 {
        margin-right: 0 !important;
        margin-left: 0 !important;
    }
    .mx-0-360-1 {
        margin-right: 0.25rem !important;
        margin-left: 0.25rem !important;
    }
    .mx-0-360-2 {
        margin-right: 0.5rem !important;
        margin-left: 0.5rem !important;
    }
    .mx-0-360-3 {
        margin-right: 1rem !important;
        margin-left: 1rem !important;
    }
    .mx-0-360-4 {
        margin-right: 1.5rem !important;
        margin-left: 1.5rem !important;
    }
    .mx-0-360-5 {
        margin-right: 3rem !important;
        margin-left: 3rem !important;
    }
    .mx-0-360-auto {
        margin-right: auto !important;
        margin-left: auto !important;
    }
    .my-0-360-0 {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }
    .my-0-360-1 {
        margin-top: 0.25rem !important;
        margin-bottom: 0.25rem !important;
    }
    .my-0-360-2 {
        margin-top: 0.5rem !important;
        margin-bottom: 0.5rem !important;
    }
    .my-0-360-3 {
        margin-top: 1rem !important;
        margin-bottom: 1rem !important;
    }
    .my-0-360-4 {
        margin-top: 1.5rem !important;
        margin-bottom: 1.5rem !important;
    }
    .my-0-360-5 {
        margin-top: 3rem !important;
        margin-bottom: 3rem !important;
    }
    .my-0-360-auto {
        margin-top: auto !important;
        margin-bottom: auto !important;
    }
    .mt-0-360-0 { margin-top: 0 !important; }
    .mt-0-360-1 { margin-top: 0.25rem !important; }
    .mt-0-360-2 { margin-top: 0.5rem !important; }
    .mt-0-360-3 { margin-top: 1rem !important; }
    .mt-0-360-4 { margin-top: 1.5rem !important; }
    .mt-0-360-5 { margin-top: 3rem !important; }
    .mt-0-360-auto { margin-top: auto !important; }
    .me-0-360-0 { margin-right: 0 !important; }
    .me-0-360-1 { margin-right: 0.25rem !important; }
    .me-0-360-2 { margin-right: 0.5rem !important; }
    .me-0-360-3 { margin-right: 1rem !important; }
    .me-0-360-4 { margin-right: 1.5rem !important; }
    .me-0-360-5 { margin-right: 3rem !important; }
    .me-0-360-auto { margin-right: auto !important; }
    .mb-0-360-0 { margin-bottom: 0 !important; }
    .mb-0-360-1 { margin-bottom: 0.25rem !important; }
    .mb-0-360-2 { margin-bottom: 0.5rem !important; }
    .mb-0-360-3 { margin-bottom: 1rem !important; }
    .mb-0-360-4 { margin-bottom: 1.5rem !important; }
    .mb-0-360-5 { margin-bottom: 3rem !important; }
    .mb-0-360-auto { margin-bottom: auto !important; }
    .ms-0-360-0 { margin-left: 0 !important; }
    .ms-0-360-1 { margin-left: 0.25rem !important; }
    .ms-0-360-2 { margin-left: 0.5rem !important; }
    .ms-0-360-3 { margin-left: 1rem !important; }
    .ms-0-360-4 { margin-left: 1.5rem !important; }
    .ms-0-360-5 { margin-left: 3rem !important; }
    .ms-0-360-auto { margin-left: auto !important; }

    .p-0-360-0 { padding: 0 !important; }
    .p-0-360-1 { padding: 0.25rem !important; }
    .p-0-360-2 { padding: 0.5rem !important; }
    .p-0-360-3 { padding: 1rem !important; }
    .p-0-360-4 { padding: 1.5rem !important; }
    .p-0-360-5 { padding: 3rem !important; }
    .px-0-360-0 {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
    .px-0-360-1 {
        padding-right: 0.25rem !important;
        padding-left: 0.25rem !important;
    }
    .px-0-360-2 {
        padding-right: 0.5rem !important;
        padding-left: 0.5rem !important;
    }
    .px-0-360-3 {
        padding-right: 1rem !important;
        padding-left: 1rem !important;
    }
    .px-0-360-4 {
        padding-right: 1.5rem !important;
        padding-left: 1.5rem !important;
    }
    .px-0-360-5 {
        padding-right: 3rem !important;
        padding-left: 3rem !important;
    }
    .py-0-360-0 {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
    .py-0-360-1 {
        padding-top: 0.25rem !important;
        padding-bottom: 0.25rem !important;
    }
    .py-0-360-2 {
        padding-top: 0.5rem !important;
        padding-bottom: 0.5rem !important;
    }
    .py-0-360-3 {
        padding-top: 1rem !important;
        padding-bottom: 1rem !important;
    }
    .py-0-360-4 {
        padding-top: 1.5rem !important;
        padding-bottom: 1.5rem !important;
    }
    .py-0-360-5 {
        padding-top: 3rem !important;
        padding-bottom: 3rem !important;
    }
    .pt-0-360-0 { padding-top: 0 !important; }
    .pt-0-360-1 { padding-top: 0.25rem !important; }
    .pt-0-360-2 { padding-top: 0.5rem !important; }
    .pt-0-360-3 { padding-top: 1rem !important; }
    .pt-0-360-4 { padding-top: 1.5rem !important; }
    .pt-0-360-5 { padding-top: 3rem !important; }
    .pe-0-360-0 { padding-right: 0 !important; }
    .pe-0-360-1 { padding-right: 0.25rem !important; }
    .pe-0-360-2 { padding-right: 0.5rem !important; }
    .pe-0-360-3 { padding-right: 1rem !important; }
    .pe-0-360-4 { padding-right: 1.5rem !important; }
    .pe-0-360-5 { padding-right: 3rem !important; }
    .pb-0-360-0 { padding-bottom: 0 !important; }
    .pb-0-360-1 { padding-bottom: 0.25rem !important; }
    .pb-0-360-2 { padding-bottom: 0.5rem !important; }
    .pb-0-360-3 { padding-bottom: 1rem !important; }
    .pb-0-360-4 { padding-bottom: 1.5rem !important; }
    .pb-0-360-5 { padding-bottom: 3rem !important; }
    .ps-0-360-0 { padding-left: 0 !important; }
    .ps-0-360-1 { padding-left: 0.25rem !important; }
    .ps-0-360-2 { padding-left: 0.5rem !important; }
    .ps-0-360-3 { padding-left: 1rem !important; }
    .ps-0-360-4 { padding-left: 1.5rem !important; }
    .ps-0-360-5 { padding-left: 3rem !important; }

}
@media (min-width: 768px) {
    .group-container > .group + .group { margin-top: 0; }
}
