.quote-lastquotedpricetext {
    color: green;
    font-weight: bold;
}

.quote-lastorderedpricetext {
    color: purple;
    font-weight: bold;
}

.quote-grid-container-scroll-layout {
    width: calc(100vw - 4rem);
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto 1fr auto;
}

.quote-grid-container {
    height: calc(100vh - 5.6rem);
    width: calc(100vw - 4rem);
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto 1fr auto;
}

@media all and (max-width: 767px) {
    .quote-grid-container {
        width: calc(100vw - 4rem);
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: max-content max-content max-content max-content;
    }
}

.quote-grid-header {
    grid-column: 1;
    grid-row: 1;
}

.quote-grid-header-container {
    display: inline-grid;
    grid-template-columns: max-content minmax(200px, auto) max-content max-content minmax(10px, auto) max-content max-content auto max-content auto 1fr;
    grid-template-rows: auto auto;
    grid-template-areas:
        'qh1-1 qh1-2 qh1-3 qh1-4 qh1-5 qh1-6 qh1-7 qh1-8 qh1-9 qh1-10 .'
        'qh2-1 qh2-2 qh2-3 qh2-4 qh1-5 qh2-6 qh2-7 qh2-8 qh2-9 qh2-10 .';
    column-gap: 5px;
    row-gap: 0px;
}

@media all and (max-width: 767px) {
    .quote-grid-header-container {
        display: grid;
        grid-template-columns: max-content auto auto;
        grid-template-rows: repeat(9, auto);
        grid-template-areas:
            'qh1-1 qh1-2 qh1-3'
            'qhaccordion qhaccordion qhaccordion'
            'qh2-1 qh2-2 qh2-3'
            'qh1-4 qh1-5 qh1-6'
            'qh2-4 qh2-5 qh2-6'
            'qh1-7 qh1-8 . '
            'qh2-7 qh2-8 . '
            'qh1-9 qh1-10 . '
            'qh2-9 qh2-10 . ';
        column-gap: 5px;
        row-gap: 0px;
    }
}

.quote-grid-header-container > div {
    margin-bottom: 2px;
}


.quote-grid-header-qhaccordion {
    grid-area: qhaccordion;
    align-self: center;
}

.quote-grid-header-qh1-1 {
    grid-area: qh1-1;
    align-self: center;
}

.quote-grid-header-qh1-2 {
    grid-area: qh1-2;
    align-self: center;
}

.quote-grid-header-qh1-3 {
    grid-area: qh1-3;
    align-self: center;
}

.quote-grid-header-qh1-4 {
    grid-area: qh1-4;
    align-self: center;
}

.quote-grid-header-qh1-5 {
    grid-area: qh1-5;
    margin-top: 2px;
}

.quote-grid-header-qh1-6 {
    grid-area: qh1-6;
    align-self: center;
}

.quote-grid-header-qh1-7 {
    grid-area: qh1-7;
    align-self: center;
}

.quote-grid-header-qh1-8 {
    grid-area: qh1-8;
    align-self: center;
}

.quote-grid-header-qh1-9 {
    grid-area: qh1-9;
    align-self: center;
}

.quote-grid-header-qh1-10 {
    grid-area: qh1-10;
    align-self: center;
}

.quote-grid-header-qh2-1 {
    grid-area: qh2-1;
    align-self: center;
}

.quote-grid-header-qh2-2 {
    grid-area: qh2-2;
    align-self: center;
}

.quote-grid-header-qh2-3 {
    grid-area: qh2-3;
    align-self: center;
}

.quote-grid-header-qh2-4 {
    grid-area: qh2-4;
    align-self: center;
}

.quote-grid-header-qh2-5 {
    grid-area: qh2-5;
    align-self: center;
}

.quote-grid-header-qh2-6 {
    grid-area: qh2-6;
    align-self: center;
}

.quote-grid-header-qh2-7 {
    grid-area: qh2-7;
    align-self: center;
}

.quote-grid-header-qh2-8 {
    grid-area: qh2-8;
    align-self: center;
}

.quote-grid-header-qh2-9 {
    grid-area: qh2-9;
    align-self: center;
}

.quote-grid-header-qh2-10 {
    grid-area: qh2-10;
    align-self: center;
}

.user-grid-container {
    display: inline-grid;
    grid-template-columns: max-content max-content max-content;
    grid-template-rows: auto;
    grid-template-areas:
        'username usertel usermail';
    column-gap: 5px;
    row-gap: 0px;
}

.user-grid-username {
    grid-area: username;
}

.user-grid-usertel {
    grid-area: usertel;
}

.user-grid-usermail {
    grid-area: usermail;
}


.quote-grid-creditlimit-container {
    display: grid;
    grid-template-columns: max-content 70px 70px 30px 180px;
    grid-template-rows: auto auto auto auto auto auto auto auto auto 20px;
    grid-template-areas: 
        'clcustomerlabel clcustomer clcustomer . .' 
        'clpaymenttermslabel clpaymentterms clpaymentterms . .' 
        'claccountonholdlabel claccountonhold . . .' 
        'cllimitlabel cllimit . . ageing' 
        'claddlimitlabel claddlimit . . ageing' 
        'cltotallimitlabel cltotallimit cltotallimit . ageing' 
        'cloutstandingbalancelabel . cloutstandingbalance clarrow ageing' 
        'clinvoicesoutstandinglabel . clinvoicesoutstanding . ageing' 
        'clavailablelabel . clavailable . ageing' 
        '. . . . .';
    column-gap: 5px;
    row-gap: 10px;
}

@media all and (max-width: 767px) {
    .quote-grid-creditlimit-container {
        display: grid;
        grid-template-columns: max-content max-content;
        grid-template-rows: repeat(10, auto) 20px;
        grid-template-areas:
            'clcustomerlabel clcustomer'
            'clpaymenttermslabel clpaymentterms'
            'claccountonholdlabel claccountonhold'
            'cllimitlabel cllimit'
            'claddlimitlabel claddlimit'
            'cltotallimitlabel cltotallimit'
            'cloutstandingbalancelabel cloutstandingbalance'
            'clinvoicesoutstandinglabel clinvoicesoutstanding'
            'clavailablelabel clavailable'
            'ageing ageing'
            '. .';
        column-gap: 5px;
        row-gap: 10px;
    }
}

.quote-grid-creditlimit-clcustomerlabel {
    grid-area: clcustomerlabel;
    align-self: center;
}

.quote-grid-creditlimit-clcustomer {
    grid-area: clcustomer;
    align-self: center;
}

.quote-grid-creditlimit-clpaymenttermslabel {
    grid-area: clpaymenttermslabel;
    align-self: center;
}

.quote-grid-creditlimit-clpaymentterms {
    grid-area: clpaymentterms;
    align-self: center;
}

.quote-grid-creditlimit-claccountonholdlabel {
    grid-area: claccountonholdlabel;
    align-self: center;
}

.quote-grid-creditlimit-claccountonhold {
    grid-area: claccountonhold;
    align-self: center;
}

.quote-grid-creditlimit-cllimitlabel {
    grid-area: cllimitlabel;
    align-self: center;
}

.quote-grid-creditlimit-cllimit {
    grid-area: cllimit;
    align-self: center;
}

.quote-grid-creditlimit-claddlimitlabel {
    grid-area: claddlimitlabel;
    align-self: center;
}

.quote-grid-creditlimit-claddlimit {
    grid-area: claddlimit;
    align-self: center;
}

.quote-grid-creditlimit-cltotallimitlabel {
    grid-area: cltotallimitlabel;
    align-self: center;
}

.quote-grid-creditlimit-cltotallimit {
    grid-area: cltotallimit;
    align-self: center;
}

.quote-grid-creditlimit-cloutstandingbalancelabel {
    grid-area: cloutstandingbalancelabel;
    align-self: center;
}

.quote-grid-creditlimit-cloutstandingbalance {
    grid-area: cloutstandingbalance;
    align-self: center;
}

.quote-grid-creditlimit-clarrow {
    grid-area: clarrow;
    align-self: center;
    justify-self: center;
}

.quote-grid-creditlimit-clinvoicesoutstandinglabel {
    grid-area: clinvoicesoutstandinglabel;
    align-self: center;
}

.quote-grid-creditlimit-clinvoicesoutstanding {
    grid-area: clinvoicesoutstanding;
    align-self: center;
}

.quote-grid-creditlimit-clavailablelabel {
    grid-area: clavailablelabel;
    align-self: center;
}

.quote-grid-creditlimit-clavailable {
    grid-area: clavailable;
    align-self: center;
}

.quote-grid-creditlimit-ageing {
    grid-area: ageing;
    align-self: center;
}

.quote-grid-creditlimit-clclose {
    grid-area: clclose;
    align-self: center;
    justify-self: center;
}


.quote-grid-tab {
    grid-column: 1;
    grid-row: 2;
}

.quote-grid-tab-container {
    display: grid;
    grid-template-columns: auto 1fr auto;
    grid-template-rows: auto;
}

.quote-grid-tab-middle {
    grid-column: 1 / span 3;
    grid-row: 1;
    align-self: center;
    justify-self: center;
}

.quote-grid-tab-left {
    grid-column: 1;
    grid-row: 1;
    align-self: center;
}

.quote-grid-tab-right {
    grid-column: 3;
    grid-row: 1;
    align-self: center;
}

.quote-grid-contents {
    grid-column: 1;
    grid-row: 3;
    overflow: hidden;
}

.quote-grid-footer {
    grid-column: 1;
    grid-row: 4;
    align-self: center;
}

.quote-tabquote-grid-container-scroll-layout {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto auto auto auto;
    grid-template-areas:
        'qcommands qrequiredparts'
        'qfilterbar qfilterbar'
        'qsupplieritems qsupplieritems'
        'qtotals qtotals';
    height: 100%;
}

.quote-tabquote-grid-container-scroll-layout-alt {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    grid-template-areas:
        'qfilterbar qfilterbar'
        'qsupplieritems qsupplieritems'
        'qtotals qtotals';
    height: 100%;
}


.quote-tabquote-grid-container {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: minmax(0, 4fr) auto minmax(0, 6fr) auto;
    grid-template-areas: 
        'qcommands qrequiredparts' 
        'qfilterbar qfilterbar' 
        'qsupplieritems qsupplieritems' 
        'qtotals qtotals';
    height: 100%;
}

.quote-tabquote-grid-container-alt {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows:  auto minmax(0, 1fr) auto;
    grid-template-areas:
        'qfilterbar qfilterbar'
        'qsupplieritems qsupplieritems'
        'qtotals qtotals';
    height: 100%;
}


@media all and (max-width: 767px) {
    .quote-tabquote-grid-container {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: repeat(9, auto);
        grid-template-areas:
            'qcommandsaccordion'
            'qcommands'
            'qrequiredpartsaccordion'
            'qrequiredparts'
            'qfilterbaraccordion'
            'qfilterbar'
            'qsupplieritemsaccordion'
            'qsupplieritems'
            'qtotals';
        height: 100%;
    }
}

@media all and (max-width: 767px) {
    .quote-tabquote-grid-container-alt {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: repeat(5, auto);
        grid-template-areas:
            'qfilterbaraccordion'
            'qfilterbar'
            'qsupplieritemsaccordion'
            'qsupplieritems'
            'qtotals';
        height: 100%;
    }
}

@media all and (max-width: 767px) {
    .quote-tabquote-grid-container-scroll-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: repeat(9, auto);
        grid-template-areas:
            'qcommandsaccordion'
            'qcommands'
            'qrequiredpartsaccordion'
            'qrequiredparts'
            'qfilterbaraccordion'
            'qfilterbar'
            'qsupplieritemsaccordion'
            'qsupplieritems'
            'qtotals';
        height: 100%;
    }
}

@media all and (max-width: 767px) {
    .quote-tabquote-grid-container-scroll-layout-alt {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: repeat(5, auto);
        grid-template-areas:
            'qfilterbaraccordion'
            'qfilterbar'
            'qsupplieritemsaccordion'
            'qsupplieritems'
            'qtotals';
        height: 100%;
    }
}

.quote-tabquote-grid-commandsaccordion {
    grid-area: qcommandsaccordion;
}

.quote-tabquote-grid-requiredpartsaccordion {
    grid-area: qrequiredpartsaccordion;
}

.quote-tabquote-grid-filterbaraccordion {
    grid-area: qfilterbaraccordion;
}

.quote-tabquote-grid-supplieritemsaccordion {
    grid-area: qsupplieritemsaccordion;
}

.quote-tabquote-grid-requiredparts {
    grid-area: qrequiredparts;
}

.quote-tabquote-grid-commands {
    grid-area: qcommands;
    overflow-y: auto;
}

.quote-tabquote-grid-filterbar {
    grid-area: qfilterbar;
}

.quote-tabquote-grid-supplieritems {
    grid-area: qsupplieritems;
}

.quote-tabquote-grid-totals {
    grid-area: qtotals;
}

.quote-actions-grid-container {
    display: grid;
    grid-template-columns: max-content;
    grid-template-rows: repeat(6, max-content);
    align-self: center;
}

.quote-tabbuyout-grid-container {
    display: grid;
    grid-template-columns: auto auto 1fr;
    grid-template-rows: 3fr auto 5fr;
    grid-template-areas:
        'boselectsupplier bosupplierinfo bouniqueparts'
        'boselectsupplier bosupplierinfocommands bouniquepartscommands'
        'bolines bolines bolines';
    height: 100%;
    row-gap: 1rem;
    column-gap: 1rem;
}

.quote-tabbuyout-grid-container-scroll-layout {
    display: grid;
    grid-template-columns: auto auto 1fr;
    grid-template-rows: auto auto auto;
    grid-template-areas:
        'boselectsupplier bosupplierinfo bouniqueparts'
        'boselectsupplier bosupplierinfocommands bouniquepartscommands'
        'bolines bolines bolines';
    height: 100%;
    row-gap: 1rem;
    column-gap: 1rem;
}


@media all and (max-width: 767px) {
    .quote-tabbuyout-grid-container {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: repeat(11, auto);
        grid-template-areas:
            'boselectsupplieraccordion'
            'boselectsupplier'
            'bosupplierinfoaccordion'
            'bosupplierinfo'
            'bosupplierinfocommandsaccordion'
            'bosupplierinfocommands'
            'bouniquepartsaccordion'
            'bouniqueparts'
            'bouniquepartscommands'
            'bolinesaccordion'
            'bolines';
        row-gap: 0px;
        height: 100%;
    }

    .quote-tabbuyout-grid-container-scroll-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: repeat(11, auto);
        grid-template-areas:
            'boselectsupplieraccordion'
            'boselectsupplier'
            'bosupplierinfoaccordion'
            'bosupplierinfo'
            'bosupplierinfocommandsaccordion'
            'bosupplierinfocommands'
            'bouniquepartsaccordion'
            'bouniqueparts'
            'bouniquepartscommands'
            'bolinesaccordion'
            'bolines';
        row-gap: 0px;
        height: 100%;
    }
}

.quote-tabbuyout-grid-selectsupplieraccordion {
    grid-area: boselectsupplieraccordion;
}

.quote-tabbuyout-grid-supplierinfoaccordion {
    grid-area: bosupplierinfoaccordion;
}

.quote-tabbuyout-grid-supplierinfocommandsaccordion {
    grid-area: bosupplierinfocommandsaccordion;
}

.quote-tabbuyout-grid-uniquepartsaccordion {
    grid-area: bouniquepartsaccordion;
}

.quote-tabbuyout-grid-linesaccordion {
    grid-area: bolinesaccordion;
}

.quote-tabbuyout-grid-selectsupplier {
    grid-area: boselectsupplier;
    overflow: hidden;
}

.quote-tabbuyout-grid-supplierinfo {
    grid-area: bosupplierinfo;
}

.quote-tabbuyout-grid-supplierinfocommands {
    grid-area: bosupplierinfocommands;
}

.quote-tabbuyout-grid-uniqueparts {
    grid-area: bouniqueparts;
    overflow: hidden;
}

.quote-tabbuyout-grid-uniquepartscommands {
    grid-area: bouniquepartscommands;
}

.quote-tabbuyout-grid-lines {
    grid-area: bolines;
    overflow: hidden;
}

.quote-boselectsupplier-grid-container {
    display: grid;
    height: 100%;
    grid-template-columns: max-content 1fr max-content;
    grid-template-rows: auto 1fr;
    grid-template-areas:
        'boaddsupplierlabel boaddsupplier boaddsuppliercommand'
        'bocurrentsupplier bocurrentsupplier bocurrentsupplier';
    column-gap: 5px;
    grid-row-gap: 5px;
}

.quote-boselectsupplier-grid-boaddsupplierlabel {
    grid-area: boaddsupplierlabel;
    align-self: center;
}

.quote-boselectsupplier-grid-boaddsupplier {
    grid-area: boaddsupplier;
    align-self: center;
}

.quote-boselectsupplier-grid-boaddsuppliercommand {
    grid-area: boaddsuppliercommand;
    align-self: center;
}

.quote-boselectsupplier-grid-bocurrentsupplier {
    grid-area: bocurrentsupplier;
    overflow: auto;
}


.quote-bosupplierinfo-grid-container {
    display: grid;
    grid-template-columns: auto auto auto auto auto;
    grid-template-rows: auto auto auto auto auto auto auto;
    grid-template-areas: 
        'bosupplierlabel bosupplier bosupplier bosupplier bosuppliercommand' 
        'bocurrencylabel bocurrency boroelabel boroe .' 
        'bocurrentroelabel bocurrentroe bocurrentroedatelabel bocurrentroedate bochangeroe' 
        'bocommentslabel bocomments bocomments bocomments bocomments' 
        '. bocomments bocomments bocomments bocomments' 
        'bodelivertolabel bodeliverto bodeliverto bodeliverto bodeliverto';
    column-gap: 5px;
    grid-row-gap: 5px;
}

.quote-bosupplierinfo-grid-container-compact {
    display: grid;
    grid-template-columns: auto auto auto auto auto;
    grid-template-rows: auto auto auto;
    grid-template-areas:
        'bosupplierlabel bosupplier bosupplier bosupplier bosuppliercommand'
        'bocurrencylabel bocurrency boroelabel boroe .'
        'bodelivertolabel bodeliverto bodeliverto bodeliverto bodeliverto';
    column-gap: 5px;
    grid-row-gap: 5px;
}

.quote-bosupplierinfo-grid-bosupplierlabel {
    grid-area: bosupplierlabel;
    align-self: center;
}

.quote-bosupplierinfo-grid-bosupplier {
    grid-area: bosupplier;
    align-self: center;
}

.quote-bosupplierinfo-grid-bosuppliercommand {
    grid-area: bosuppliercommand;
    align-self: center;
}

.quote-bosupplierinfo-grid-bocurrencylabel {
    grid-area: bocurrencylabel;
    align-self: center;
}

.quote-bosupplierinfo-grid-bocurrency {
    grid-area: bocurrency;
    align-self: center;
}

.quote-bosupplierinfo-grid-boroelabel {
    grid-area: boroelabel;
    align-self: center;
}

.quote-bosupplierinfo-grid-boroe {
    grid-area: boroe;
    align-self: center;
}

.quote-bosupplierinfo-grid-bocurrentroelabel {
    grid-area: bocurrentroelabel;
    align-self: center;
}

.quote-bosupplierinfo-grid-bocurrentroe {
    grid-area: bocurrentroe;
    align-self: center;
}

.quote-bosupplierinfo-grid-bocurrentroedatelabel {
    grid-area: bocurrentroedatelabel;
    align-self: center;
}

.quote-bosupplierinfo-grid-bocurrentroedate {
    grid-area: bocurrentroedate;
    align-self: center;
}

.quote-bosupplierinfo-grid-bochangeroe {
    grid-area: bochangeroe;
    align-self: center;
}

.quote-bosupplierinfo-grid-bocommentslabel {
    grid-area: bocommentslabel;
    align-self: center;
}

.quote-bosupplierinfo-grid-bocomments {
    grid-area: bocomments;
    align-self: center;
}

.quote-bosupplierinfo-grid-bodelivertolabel {
    grid-area: bodelivertolabel;
    align-self: center;
}

.quote-bosupplierinfo-grid-bodeliverto {
    grid-area: bodeliverto;
    align-self: center;
}

.quote-taborder-grid-container {
    display: grid;
    grid-template-columns: 4fr 6fr;
    grid-template-rows: auto auto auto minmax(0, 1fr) auto ;
    grid-template-areas: 
        'ordercustomerdetails ordershippingdetails' 
        'orderdelinstructions orderdelinstructions'
        'orderinternaldelinstructions ordercustomerdelinstructions' 
        'orderitems orderitems' 
        'ordercommands ordercommands';
    height: 100%;
}

.quote-taborder-grid-container-scroll-layout {
    display: grid;
    grid-template-columns: 4fr 6fr;
    grid-template-rows: auto auto auto auto auto;
    grid-template-areas:
        'ordercustomerdetails ordershippingdetails'
        'orderdelinstructions orderdelinstructions'
        'orderinternaldelinstructions ordercustomerdelinstructions'
        'orderitems orderitems'
        'ordercommands ordercommands';
    height: 100%;
}

@media all and (max-width: 767px) {
    .quote-taborder-grid-container {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-rows: repeat(12, auto);
        grid-template-areas:
            'ordercustomerdetailsaccordion'
            'ordercustomerdetails'
            'ordershippingdetailsaccordion'
            'ordershippingdetails'
            'orderdelinstructionsaccordion'
            'orderdelinstructions'
            'orderinternaldelinstructions'
            'orderinternaldelinstructions'
            'ordercustomerdelinstructions'
            'orderitemsaccordion'
            'orderitems'
            'ordercommands';
        height: 100%;
    }
}

.quote-taborder-grid-customerdetailsaccordion {
    grid-area: ordercustomerdetailsaccordion;
}

.quote-taborder-grid-shippingdetailsaccordion {
    grid-area: ordershippingdetailsaccordion;
}

.quote-taborder-grid-delinstructionsaccordion {
    grid-area: orderdelinstructionsaccordion;
}

.quote-taborder-grid-itemsaccordion {
    grid-area: orderitemsaccordion;
}

.quote-taborder-grid-customerdetails {
    grid-area: ordercustomerdetails;
}

.quote-taborder-grid-shippingdetails {
    grid-area: ordershippingdetails;
}

.quote-taborder-grid-delinstructions {
    grid-area: orderdelinstructions;
}

.quote-taborder-grid-internaldelinstructions {
    grid-area: orderinternaldelinstructions;
}

.quote-taborder-grid-customerdelinstructions {
    grid-area: ordercustomerdelinstructions;
}

.quote-taborder-grid-items {
    grid-area: orderitems;
}

.quote-taborder-grid-totals {
    grid-area: ordertotals;
}

.quote-taborder-grid-commands {
    grid-area: ordercommands;
}

.quote-tabordercustomerdetails-grid-container {
    display: grid;
    grid-template-columns: max-content 1fr;
    grid-template-rows: max-content max-content;
    grid-template-areas:
        'ocdcustomerordernolabel ocdcustomerorderno'
        'ocddeldatelabel ocddeldate';
    row-gap: 5px;
    column-gap: 1rem;
    height: 100%;
    align-items:center;
}

.quote-tabordercustomerdetails-grid-ocdintnolabel {
    grid-area: ocdintnolabel;
}

.quote-tabordercustomerdetails-grid-ocdintno {
    grid-area: ocdintno;
}

.quote-tabordercustomerdetails-grid-ocdcustomerlabel {
    grid-area: ocdcustomerlabel;
}

.quote-tabordercustomerdetails-grid-ocdcontactlabel {
    grid-area: ocdcontactlabel;
}

.quote-tabordercustomerdetails-grid-ocdcontact {
    grid-area: ocdcontact;
}

.quote-tabordercustomerdetails-grid-ocdcustomerordernolabel {
    grid-area: ocdcustomerordernolabel;
}

.quote-tabordercustomerdetails-grid-ocdcustomerorderno {
    grid-area: ocdcustomerorderno;
}

.quote-tabordercustomerdetails-grid-ocddeldatelabel {
    grid-area: ocddeldatelabel;
}

.quote-tabordercustomerdetails-grid-ocddeldate {
    grid-area: ocddeldate;
}

.quote-tabordershippingdetails-grid-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    grid-template-areas: 'ordershipaddress ordershipinfo';
    row-gap: 5px;
    column-gap: 1rem;
    height: 100%;
}

@media all and (max-width: 767px) {
    .quote-tabordershippingdetails-grid-container {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: repeat(2, auto);
        grid-template-areas:
            'ordershipaddress'
            'ordershipinfo';
        height: 100%;
    }
}

.quote-tabordershippingdetails-grid-ordershipaddress {
    grid-area: ordershipaddress;
}

.quote-tabordershippingdetails-grid-ordershipinfo {
    grid-area: ordershipinfo;
}

.quote-ordershipaddressnav-grid-container {
    display: grid;
    grid-template-columns: max-content 1fr;
    grid-template-rows: auto auto auto auto auto;
    grid-template-areas: 
        'oshnavdeladdresslabel oshnavdeladdress1' 
        'oshnavdeladdressgetcommand oshnavdeladdress2' 
        '. oshnavdeladdress3' 
        '. oshnavdeladdress4' 
        '. oshnavdeladdress5';
    row-gap: 5px;
    column-gap: 1rem;
}

.quote-ordershipaddressnav-grid-oshnavdeladdresslabel {
    grid-area: oshnavdeladdresslabel;
}

.quote-ordershipaddressnav-grid-oshnavdeladdressgetcommand {
    grid-area: oshnavdeladdressgetcommand;
}

.quote-ordershipaddressnav-grid-oshnavdeladdress1 {
    grid-area: oshnavdeladdress1;
}

.quote-ordershipaddressnav-grid-oshnavdeladdress2 {
    grid-area: oshnavdeladdress2;
}

.quote-ordershipaddressnav-grid-oshnavdeladdress3 {
    grid-area: oshnavdeladdress3;
}

.quote-ordershipaddressnav-grid-oshnavdeladdress4 {
    grid-area: oshnavdeladdress4;
}

.quote-ordershipaddressnav-grid-oshnavdeladdress5 {
    grid-area: oshnavdeladdress5;
}

.quote-ordershipaddresstms-grid-container {
    display: grid;
    grid-template-columns: max-content 1fr;
    grid-template-rows: auto auto auto auto auto;
    grid-template-areas: 
        'oshtmsdeladdresslabel oshtmsdeladdress ' 
        'oshtmsdeladdressgetcommand oshtmsdeladdress ' 
        '. oshtmsdeladdress' 
        '. oshtmsdeladdress' 
        '. oshtmsdeladdress ';
    row-gap: 5px;
    column-gap: 1rem;
}

.quote-ordershipaddresstms-grid-oshtmsdeladdresslabel {
    grid-area: oshtmsdeladdresslabel;
}

.quote-ordershipaddresstms-grid-oshtmsdeladdressgetcommand {
    grid-area: oshtmsdeladdressgetcommand;
}

.quote-ordershipaddresstms-grid-oshtmsdeladdress {
    grid-area: oshtmsdeladdress;
}

.quote-ordershipinfo-grid-container {
    display: grid;
    grid-template-columns: max-content auto 1fr;
    grid-template-rows: auto auto auto auto auto;
    grid-template-areas:
        'oshishipperlabel oshishipper oshishipper'
        'oshiaccountnolabel oshiaccountno oshiaccountno'
        '. oshishipcommand .'
        '. . .'
        '. . .';
    row-gap: 5px;
    column-gap: 1rem;
}

.quote-ordershipinfo-grid-oshishipperlabel {
    grid-area: oshishipperlabel;
}

.quote-ordershipinfo-grid-oshishipper {
    grid-area: oshishipper;
}

.quote-ordershipinfo-grid-oshiaccountnolabel {
    grid-area: oshiaccountnolabel;
}

.quote-ordershipinfo-grid-oshiaccountno {
    grid-area: oshiaccountno;
}

.quote-ordershipinfo-grid-oshishipcommand {
    grid-area: oshishipcommand;
}

.quote-tabordercommands-grid-container {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto minmax(0, 1fr);
    grid-template-areas:
        'ordercommandstotals ordercommandscommands';
    height: 100%;
    align-items:center
}

.quote-tabordercommands-grid-totals {
    grid-area: ordercommandstotals;
}

.quote-tabordercommands-grid-commands {
    grid-area: ordercommandscommands;
}


.quote-partimport-grid-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    grid-template-areas: 'pidelimiterlabel pidelimiter' 'pimessage pimessage' 'piinput piinput' 'picommand picommand';
    row-gap: 5px;
    column-gap: 1rem;
    height: 100%;
}


.quote-partimport-grid-pidelimiterlabel {
    grid-area: pidelimiterlabel;
}

.quote-partimport-grid-pidelimiter {
    grid-area: pidelimiter;
}

.quote-partimport-grid-pimessage {
    grid-area: pimessage;
}

.quote-partimport-grid-piinput {
    grid-area: piinput;
}

.quote-partimport-grid-picommand {
    grid-area: picommand;
}


.quote-partimportandadd-grid-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: max-content minmax(0, 1fr);
    grid-template-areas:
        'piheading piheading'
        'piaddimport piaddadd';
    height: 100%;
}


@media all and (max-width: 767px) {
    .quote-partimportandadd-grid-container {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: max-content minmax(200px, 1fr) minmax(200px, 1fr);
        grid-template-areas:
            'piheading'
            'piaddimport'
            'piaddadd';
        overflow-y: auto;
    }
}

.quote-partimportandadd-grid-piheading {
    grid-area: piheading;
}

.quote-partimportandadd-grid-piaddimport {
    grid-area: piaddimport;
}

.quote-partimportandadd-grid-piaddadd {
    grid-area: piaddadd;
}

.quote-complete-grid-container {
    display: grid;
    grid-template-columns: max-content 1fr;
    grid-template-rows: auto 1fr auto;
    grid-template-areas:
        'qcsteps qcstepinfo'
        '. qcstepinfo ' 
        '. . ';
    row-gap: 5px;
    column-gap: 1rem;
    height: 100%;
}

@media all and (max-width: 767px) {
    .quote-complete-grid-container {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto 1fr auto;
        grid-template-areas:
            'qcsteps'
            'qcstepinfo '
            '. ';
        row-gap: 5px;
        column-gap: 1rem;
        height: 100%;
    }
}

.quote-complete-grid-qcsteps {
    grid-area: qcsteps;
}

.quote-complete-grid-qcstepinfo {
    grid-area: qcstepinfo;
    overflow: auto;
}



.quote-approvalheading-grid-container {
    display: grid;
    grid-template-columns: max-content max-content 5px max-content max-content 1fr;
    grid-template-rows: auto;
    grid-template-areas: 
        'qahcustomerlabel qahcustomer . qahuserlabel qahuser .';
    row-gap: 5px;
    column-gap: 1rem;
}

@media all and (max-width: 767px) {
    .quote-approvalheading-grid-container {
        display: grid;
        grid-template-columns: max-content max-content 1fr
        grid-template-rows: auto auto;
        grid-template-areas: 
            'qahcustomerlabel qahcustomer .' 
            'qahuserlabel qahuser .';
        row-gap: 5px;
        column-gap: 1rem;
    }
}


.quote-approvalheading-grid-containeralt {
    display: grid;
    grid-template-columns: max-content max-content 5px max-content max-content 5px max-content max-content 1fr;
    grid-template-rows: auto;
    grid-template-areas: 'qahsqnolabel qahsqno . qahcustomerlabel qahcustomer . qahuserlabel qahuser .';
    row-gap: 5px;
    column-gap: 1rem;
}

@media all and (max-width: 767px) {
    .quote-approvalheading-grid-containeralt {
        display: grid;
        grid-template-columns: max-content max-content 1fr 
	grid-template-rows: auto auto;
        grid-template-areas: 
            'qahsqnolabel qahsqno . ' 
            'qahcustomerlabel qahcustomer .'  
            'qahuserlabel qahuser .';
        row-gap: 5px;
        column-gap: 1rem;
        overflow-x: auto;
    }
}

.quote-approvalheading-grid-qahsqnolabel {
    grid-area: qahsqnolabel;
}

.quote-approvalheading-grid-qahsqno {
    grid-area: qahsqno;
}

.quote-approvalheading-grid-qahcustomerlabel {
    grid-area: qahcustomerlabel;
    align-self: center;
}

.quote-approvalheading-grid-qahcustomer {
    grid-area: qahcustomer;
    align-self: center;
}

.quote-approvalheading-grid-qahuserlabel {
    grid-area: qahuserlabel;
    align-self: center;
}

.quote-approvalheading-grid-qahuser {
    grid-area: qahuser;
    align-self: center;
}

.quote-approval-grid-container {
    display: grid;
    grid-template-columns: max-content max-content max-content max-content max-content max-content 1fr;
    grid-template-rows: auto auto auto auto auto;
    grid-template-areas: 
        'qatype qatype qatype qatype qatype qatype .' 
        'qatypedetails qatypedetails qatypedetails qatypedetails qatypedetails qatypedetails qatypedetails ' 
        'qastatuslabel qastatus . qaactionlabel qaaction qaaction .' 
        'qareasonlabel qareason qareasoninfo qauserreasonlabel qauserreason qauserreasoninfo .' 
        'qaapproverslabel qaapprovers . qasubapproverslabel qasubapprovers . .';
    row-gap: 5px;
    column-gap: 1rem;
}

@media all and (max-width: 1023px) {
    .quote-approval-grid-container {
        display: grid;
        grid-template-columns: max-content max-content max-content max-content 1fr;
        grid-template-rows: repeat(8, auto);
        grid-template-areas:
            'qatype qatype qatype qatype .'
            'qatypedetails qatypedetails qatypedetails qatypedetails qatypedetails '
            'qastatuslabel qastatus qastatus qastatus .'
            'qaactionlabel qaaction qaaction qaaction .'
            'qareasonlabel qareason qareasoninfo . .'
            'qauserreasonlabel qauserreason qauserreasoninfo . .'
            'qaapproverslabel qaapprovers qaapprovers qaapprovers qaapprovers'
            'qasubapproverslabel qasubapprovers qasubapprovers qasubapprovers qasubapprovers';
        row-gap: 5px;
        column-gap: 1rem;
    }
}

.quote-approval-grid-qatype {
    grid-area: qatype;
    align-self: center;
}

.quote-approval-grid-qatypedetails {
    grid-area: qatypedetails;
}

.quote-approval-grid-qastatuslabel {
    grid-area: qastatuslabel;
    align-self: center;
}

.quote-approval-grid-qastatus {
    grid-area: qastatus;
    align-self: center;
}

.quote-approval-grid-qaactionlabel {
    grid-area: qaactionlabel;
    align-self: center;
}

.quote-approval-grid-qaaction {
    grid-area: qaaction;
    align-self: center;
}

.quote-approval-grid-qareasonlabel {
    grid-area: qareasonlabel;
    align-self: center;
}

.quote-approval-grid-qareason {
    grid-area: qareason;
    align-self: center;
}

.quote-approval-grid-qareasoninfo {
    grid-area: qareasoninfo;
    align-self: center;
}

.quote-approval-grid-qauserreasonlabel {
    grid-area: qauserreasonlabel;
    align-self: center;
}

.quote-approval-grid-qauserreason {
    grid-area: qauserreason;
    align-self: center;
}

.quote-approval-grid-qauserreasoninfo {
    grid-area: qauserreasoninfo;
    align-self: center;
}
.quote-approval-grid-qaapproverslabel {
    grid-area: qaapproverslabel;
}

.quote-approval-grid-qaapprovers {
    grid-area: qaapprovers;
}

.quote-approval-grid-qasubapproverslabel {
    grid-area: qasubapproverslabel;
}

.quote-approval-grid-qasubapprovers {
    grid-area: qasubapprovers;
}


.quote-notification-popup {
    z-index: 9990;
    background-color: rgba(245, 245, 245, 0);
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: calc((calc(100vh - 5.6rem) + 80px) * 0.4 / -2);
    margin-left: calc(320px / -2);
    width: 320px;
    height: calc((calc(100vh - 5.6rem) + 80px) * 0.4);
}