.pvtUi {
    color: #2a3f5f;
    font-family: Verdana;
    border-collapse: collapse;
}

.pvtUi select {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -ms-user-select: none;
}

.pvtUi td.pvtOutput {
    vertical-align: top;
}

table.pvtTable {
    font-size: 8pt;
    text-align: left;
    border-collapse: collapse;
    margin-top: .1875rem;
    margin-left: .1875rem;
    font-family: Verdana;
}

table.pvtTable thead tr th,
table.pvtTable tbody tr th {
    background-color: #ebf0f8;
    border: .0625rem solid #c8d4e3;
    font-size: 8pt;
    padding: .3125rem;
}

table.pvtTable .pvtTotalLabel {
    text-align: right;
}

table.pvtTable tbody tr td {
    color: #2a3f5f;
    padding: .3125rem;
    background-color: #fff;
    border: .0625rem solid #c8d4e3;
    vertical-align: top;
    text-align: right;
}

.pvtTotal,
.pvtGrandTotal {
    font-weight: bold;
}

.pvtRowOrder,
.pvtColOrder {
    cursor: pointer;
    width: .9375rem;
    margin-left: .3125rem;
    display: inline-block;
    user-select: none;
    text-decoration: none !important;
    -webkit-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -ms-user-select: none;
}

.pvtAxisContainer,
.pvtVals {
    border: .0625rem solid #a2b1c6;
    background: #f2f5fa;
    padding: .3125rem;
    min-width: 1.25rem;
    min-height: 1.25rem;
}

.pvtRenderers {
    padding-left: .3125rem;
    user-select: none;
}

.pvtDropdown {
    display: inline-block;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -ms-user-select: none;
    margin: .1875rem;
}

.pvtDropdownIcon {
    float: right;
    color: #a2b1c6;
}

.pvtDropdownCurrent {
    text-align: left;
    border: .0625rem solid #a2b1c6;
    border-radius: .25rem;
    display: inline-block;
    position: relative;
    width: 13.125rem;
    box-sizing: border-box;
    background: white;
}

.pvtDropdownCurrentOpen {
    border-radius: .25rem .25rem 0 0;
}

.pvtDropdownMenu {
    background: white;
    position: absolute;
    width: 100%;
    margin-top: -0.0625rem;
    border-radius: 0 0 .25rem .25rem;
    border: .0625rem solid #a2b1c6;
    border-top: .0625rem solid #dfe8f3;
    box-sizing: border-box;
}

.pvtDropdownValue {
    padding: .125rem .3125rem;
    font-size: .75rem;
    text-align: left;
}

.pvtDropdownActiveValue {
    background: #ebf0f8;
}

.pvtVals {
    text-align: center;
    white-space: nowrap;
    vertical-align: top;
    padding-bottom: .75rem;
}

.pvtRows {
    height: 100%;
}

.pvtAxisContainer li {
    padding: .5rem .375rem;
    list-style-type: none;
    cursor: move;
}

.pvtAxisContainer li.pvtPlaceholder {
    -webkit-border-radius: .3125rem;
    padding: .1875rem .9375rem;
    -moz-border-radius: .3125rem;
    border-radius: .3125rem;
    border: .0625rem dashed #a2b1c6;
}

.pvtAxisContainer li.pvtPlaceholder span.pvtAttr {
    display: none;
}

.pvtAxisContainer li span.pvtAttr {
    -webkit-text-size-adjust: 100%;
    background: #f3f6fa;
    border: .0625rem solid #c8d4e3;
    padding: .125rem .3125rem;
    white-space: nowrap;
    -webkit-border-radius: .3125rem;
    -moz-border-radius: .3125rem;
    border-radius: .3125rem;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -ms-user-select: none;
}

.pvtTriangle {
    cursor: pointer;
    color: #506784;
}

.pvtHorizList li {
    display: inline-block;
}

.pvtVertList {
    vertical-align: top;
}

.pvtFilteredAttribute {
    font-style: italic;
}

.sortable-chosen .pvtFilterBox {
    display: none !important;
}

.pvtCloseX {
    position: absolute;
    right: .3125rem;
    top: .3125rem;
    font-size: 1.125rem;
    cursor: pointer;
    text-decoration: none !important;
}

.pvtDragHandle {
    position: absolute;
    left: .3125rem;
    top: .3125rem;
    font-size: 1.125rem;
    cursor: move;
    color: #a2b1c6;
}

.pvtButton {
    color: #506784;
    border-radius: .3125rem;
    padding: .1875rem .375rem;
    background: #f2f5fa;
    border: .0625rem solid;
    border-color: #c8d4e3;
    font-size: .875rem;
    margin: .1875rem;
    transition: 0.34s all cubic-bezier(0.19, 1, 0.22, 1);
    text-decoration: none !important;
}

.pvtButton:hover {
    background: #e2e8f0;
    border-color: #a2b1c6;
}

.pvtButton:active {
    background: #d1dae6;
}

.pvtFilterBox input {
    border: .0625rem solid #c8d4e3;
    border-radius: .3125rem;
    color: #506784;
    padding: 0 .1875rem;
    font-size: .875rem;
}

.pvtFilterBox input:focus {
    border-color: #119dff;
    outline: none;
}

.pvtFilterBox {
    z-index: 100;
    width: 18.75rem;
    border: .0625rem solid #506784;
    background-color: #fff;
    position: absolute;
    text-align: center;
    user-select: none;
    min-height: 6.25rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -ms-user-select: none;
}

.pvtFilterBox h4 {
    margin: .9375rem;
}

.pvtFilterBox p {
    margin: .625rem auto;
}

.pvtFilterBox button {
    color: #2a3f5f;
}

.pvtFilterBox input[type='text'] {
    width: 14.375rem;
    color: #2a3f5f;
    margin-bottom: .3125rem;
}

.pvtCheckContainer {
    text-align: left;
    font-size: .875rem;
    white-space: nowrap;
    overflow-y: scroll;
    width: 100%;
    max-height: 30vh;
    border-top: .0625rem solid #dfe8f3;
}

.pvtCheckContainer p {
    margin: 0;
    margin-bottom: .0625rem;
    padding: .1875rem;
    cursor: default;
}

.pvtCheckContainer p.selected {
    background: #ebf0f8;
}

.pvtOnly {
    display: none;
    width: 2.1875rem;
    float: left;
    font-size: .75rem;
    padding-left: .3125rem;
    cursor: pointer;
}

.pvtOnlySpacer {
    display: block;
    width: 2.1875rem;
    float: left;
}

.pvtCheckContainer p:hover .pvtOnly {
    display: block;
}

.pvtCheckContainer p:hover .pvtOnlySpacer {
    display: none;
}

.pvtRendererArea {
    padding: .3125rem;
}

/* LAYOUT CUSTOMS */
.pivot-table-control-filters-container .content-container,
.pivot-table-attributes-container .content-container {
    display: flex;
    flex-direction: column;
    background: #FFFFFF;
    border: .0625rem solid #E1E4EA;
    border-radius: .5rem;
    padding: 2rem;
    margin-bottom: .5rem;
}

.header-container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 1rem;
}

.left-content .title {
    margin: 0;
    padding: 0;
    font-weight: 600;
    line-height: 2rem;
    font-size: 1.25rem;
    color: #23282E;
}

.left-content .description {
    font-weight: 400;
    line-height: 1.5rem;
    font-size: .875rem;
    color: #64718B;
}

.save-table {
    border: none;
    background: none;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 1rem;
    gap: .5rem;
}

.save-table img {
    width: 1.5rem;
    height: 1.5rem;
}

.save-table span {
    display: inline;
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.75rem;
    color: #2B363C;
}

.border-top {
    border-top: 1px solid #E1E4EA;
}

.grid-4 {
    grid-template-columns: repeat(4, 1fr);
}

.grid-3 {
    grid-template-columns: repeat(3, 1fr);
}

.grid-1 {
    grid-template-columns: repeat(1, 1fr);
}

.group-attributes-container {
    display: grid;
    margin-top: .5rem;
    gap: 1rem;
}

.group-attributes-container .businessAttributesCellToPick,
.group-attributes-container .regionalAttributesCellToPick,
.group-attributes-container .transversalAttributesCellToPick {
    display: flex;
    flex-direction: column;
    gap: .625rem;
    background: #F7F8FA;
    border: 1px solid #E1E4EA;
    border-radius: .5rem;
    padding: .75rem .75rem 1.75rem .75rem;
}

.group-attributes-container>*:first-child {
    grid-column: span 2;
}

.group-attributes-container .businessAttributesCellToPick .group-label,
.group-attributes-container .regionalAttributesCellToPick .group-label,
.group-attributes-container .transversalAttributesCellToPick .group-label {
    font-weight: 500;
    font-size: .875rem;
    line-height: 1.5rem;
    color: #2B363C;
}

@media (max-width: 768px) {
    .group-attributes-container {
        margin-top: .25rem;
        display: flex;
        flex-direction: column;
    }

    .group-attributes-container .businessAttributesCellToPick,
    .group-attributes-container .regionalAttributesCellToPick,
    .group-attributes-container .transversalAttributesCellToPick {
        padding: .75rem;
    }
}

.howtobuildtable-modal h2 {
    font-weight: 600;
}

.pivot-table-attributes-tooltip {
    margin-top: 2rem;
    margin-bottom: .75rem;
    width: fit-content;
}

.pivot-table-attributes-tooltip .more-info-tooltip {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: .5rem;
    width: fit-content;
    height: 3.75rem;
    padding: 0rem 1rem;
    border-radius: .25rem;
    border: .125rem solid #2B363C;
}

.pivot-table-attributes-tooltip .more-info-tooltip .info-icon {
    width: 1.5rem !important;
    height: 1.5rem !important;
}

.pivot-table-attributes-tooltip .more-info-tooltip .caption-info {
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.75rem;
    color: #2B363C;
}

.modal-popup-container-pivot {
    width: 784px;
    height: 534px;
    border-radius: .5rem;
    background: #FFFFFF;
    border: .0625rem solid #E1E4EA;
    padding: 2rem;
    padding-bottom: 16px;
}

.modal-popup-container-pivot .modal-popup-logo {
    display: none;
}

.modal-popup-container-pivot .modal-popup-header {
    padding-top: 0.25rem;
}

.modal-popup-container-pivot .modal-popup-header img {
    display: none;
}

.modal-popup-container-pivot .modal-popup-header h2 {
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 2rem;
    text-align: left;
    color: #23282E;
}

.modal-popup-container-pivot .modal-popup-content {
    display: flex;
    flex-direction: row;
    gap: 2rem;
    margin-top: 2.875rem;
    justify-content: space-between;
    padding: 0px 2.875rem;
    min-height: 23.5rem;
}


.modal-popup-container-pivot .modal-close {
    position: absolute;
    top: 1rem;
    right: 1rem;
    background: none;
    border: none;
    cursor: pointer;
}

.modal-popup-container-pivot .modal-close img {
    width: 2rem;
    height: 2rem;
    padding: .3125rem;
    display: block;
}

.modal-popup-container-pivot .modal-popup-content .modal-popup-container-image {
    display: flex;
    width: 100%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.modal-popup-container-pivot .modal-popup-content .modal-popup-container-image img {
    width: inherit;
    height: 23.5rem;
    border-radius: .25rem;
    object-fit: cover;
}


.modal-popup-container-pivot .modal-popup-content .modal-popup-container-image span {
    align-items: center;
    display: flex;
    justify-content: center;
    width: 100%;
    font-family: inherit;
    font-size: .875rem;
    font-weight: 500;
    line-height: 1.5rem;
    text-align: center;
    color: #64718b;
    padding-top: 1rem;
}

.modal-popup-container-pivot .modal-popup-content .modal-popup-container-text-image {
    display: flex;
    flex-direction: row;
    gap: 2rem;
    width: 100%;
}

.modal-popup-container-pivot .modal-popup-content .modal-popup-container-text-image .modal-popup-text {
    max-height: 22.8125rem;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    flex: 1;
}

.modal-popup-container-pivot .modal-popup-content .modal-popup-container-text-image .modal-popup-text h3 {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 2rem;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #2B363C
}

.modal-popup-container-pivot .modal-popup-content .modal-popup-container-text-image .modal-popup-text p {
    font-size: 16px;
    font-weight: 400;
    line-height: 28px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #2B363C
}

.modal-popup-container-pivot .modal-popup-content .modal-popup-container-text-image .modal-popup-image {
    width: 17.625rem;
    height: 23.5rem;
    display: flex;
    border-radius: .25rem;
}

.modal-popup-container-pivot .modal-popup-content .modal-popup-container-text-image .modal-popup-image img {
    width: inherit;
    height: inherit;
    border-radius: .25rem;
    object-fit: contain;
    object-position: top;
}

.modal-popup-container-pivot .modal-popup-content .modal-popup-container-text {
    display: flex;
}

.modal-popup-container-pivot .modal-popup-content .modal-popup-container-text .modal-popup-text {
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    max-height: 22.8125rem;
    width: 100%;
    gap: 1rem;
}

.modal-popup-container-pivot .modal-popup-content .modal-popup-container-text .modal-popup-text h3 {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 2rem;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #2B363C
}

.modal-popup-container-pivot .modal-popup-content .modal-popup-container-text .modal-popup-text p {
    font-size: 16px;
    font-weight: 400;
    line-height: 28px;
    text-align: left;
    text-underline-position: from-font;
    text-decoration-skip-ink: none;
    color: #2B363C
}

.modal-popup-container-pivot .modal-popup-content .modal-popup-container-video {
    display: flex;
    width: 100%;
    height: 100%;
}

.modal-popup-container-pivot .modal-popup-content .modal-popup-container-video .modal-popup-video {
    width: 100%;
    height: 100%;
    display: flex;
    border-radius: .25rem;
}

.modal-popup-container-pivot .modal-popup-content .modal-popup-container-video .modal-popup-video video {
    width: inherit;
    height: inherit;
    border-radius: .25rem;
}

.modal-popup-text::-webkit-scrollbar {
    width: 8px;
}

.modal-popup-text::-webkit-scrollbar-thumb {
    background-color: #aaa;
    border-radius: 4px;
}

.modal-popup-text::-webkit-scrollbar-thumb:hover {
    background-color: #aaa;
}

.modal-popup-text::-webkit-scrollbar-track {
    background-color: #f1f1f1;
}



.pivot-table-attributes-container .content-container .pvtAxisContainer {
    all: unset;
    /* margin-top: 1.5rem; */
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1rem;
}

.pivot-table-attributes-container .content-container .pvtAxisContainer li {
    padding: 0;
    margin: 0;
}

.pivot-table-attributes-container .content-container .pvtAxisContainer li .pvtAttr {
    all: unset;
    padding: 0;
    margin: 0;
    font-weight: 500;
    font-size: .875rem;
    line-height: 1.5rem;
    color: #2B363C;
    height: 2rem;
    padding: .25rem .75rem;
    border-radius: .5rem;
    border: .0625rem solid #9CA6B8;
}

.pivot-table-attributes-container .content-container .pvtAxisContainer li .non-draggable {
    all: unset;
    padding: 0;
    margin: 0;
    font-weight: 500;
    font-size: .875rem;
    line-height: 1.5rem;
    /* color: #2B363C; */
    /* height: 2rem; */
    padding: .25rem .75rem;
    border-radius: .5rem;
    /* border: .0625rem solid #9CA6B8; */
    /* cursor: pointer; */
    border: .0625rem solid #E1E4EA;
    color: #64718B;
    cursor: default;
}

.pivot-table-attributes-container .content-container .pvtAxisContainer li .pvtAttr .pvtTriangle {
    display: none;
}

.pivot-table-attributes-container .content-container .pvtAxisContainer li .attribute-checked {
    border: .0625rem solid #FBCB3C;
    background: #FFF2CC;
}

.pivot-table-attributes-container .content-container .pvtAxisContainer li .cursor-not-allowed {
    cursor: not-allowed;
}

.attribute-inative {
    border: .0625rem solid #E1E4EA;
    color: #64718B;
    cursor: not-allowed;
}

.pivot-table-control-filters-container .content-container .filter-header-tab h6 {
    margin: 0;
    padding: 0;
    font-weight: 400;
    font-size: .875rem;
    line-height: 1.5rem;
    color: #2B363C;
    /* font-family: 'Noto Sans'; */
}

.pivot-table-control-filters-container .content-container .filter-header-tab {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    /* align-items: center; */
}

.pivot-table-control-filters-container .content-container .filter-header-tab button {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #2B363C;
    border: none;
    background: none;

    -moz-transition: all .5s linear;
    -webkit-transition: all .5s linear;
    transition: all .5s linear;
}

.pivot-table-control-filters-container .content-container .filter-header-tab .rotate-180 {
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.pivot-table-control-filters-container .content-container .instrutions {
    margin: 0;
    padding: 0;
    font-weight: 400;
    font-size: .875rem;
    line-height: 1.5rem;
    color: #64718B;
    margin-top: .25rem;
    /* font-family: 'Noto Sans'; */
}

.pivot-table-control-filters-container .content-container .filters-grid {
    margin-top: 1rem;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 1rem;
}

.pivot-table-control-filters-container .content-container .filters-grid .filter-item {
    background: #F7F8FA;
    padding: .75rem;
    border: .0625rem solid #9CA6B8;
    display: flex;
    flex-direction: column;
    gap: .625rem;
    border-radius: .5rem;
}

.pivot-table-control-filters-container .content-container .filters-grid .filter-item .header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.pivot-table-control-filters-container .content-container .filters-grid .filter-item .header span {
    font-weight: 500;
    font-size: .875rem;
    line-height: 1.5rem;
    color: #2B363C;
}

.pivot-table-control-filters-container .content-container .filters-grid .filter-item .header svg {
    width: 1.125rem;
    height: 1.125rem;
    cursor: pointer;
}

.pivot-table-control-filters-container .content-container .filters-grid .filter-item .filter-item-trigger-container {
    position: relative;
}

.pivot-table-control-filters-container .content-container .filters-grid .filter-item .filter-item-trigger-container .filter-item-trigger {
    background: white;
    border: .0625rem solid #E1E4EA;
    height: 2.75rem;
    border-radius: .5rem;
    outline: none;
    outline-color: unset;
    outline-width: 0;
    padding-left: 1rem;
    padding-right: 1rem;
    font-weight: 1.75rem;
    font-weight: 400;
    font-size: 1rem;
    color: #2B363C;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.pivot-table-control-filters-container .content-container .filters-grid .filter-item .filter-item-trigger-container .filter-item-trigger div {
    display: flex;
    flex-direction: row;
    width: 100%;
}

.pivot-table-control-filters-container .content-container .filters-grid .filter-item .filter-item-trigger-container .filter-item-trigger div .label {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: calc(100% - 60px);
    /* Account for arrow icon */
    word-break: break-word;
}

.pivot-table-control-filters-container .content-container .filters-grid .filter-item .filter-item-trigger-container .filter-item-trigger div span {
    background: #FFE699;
    padding: .25rem .75rem;
    color: #64718B;
    font-weight: 600;
    border-radius: 4rem;
    font-size: .75rem;
    margin-left: .5rem;
}

.pivot-table-control-filters-container .content-container .filters-grid .filter-item .filter-item-trigger-container .filter-item-options-container {
    display: flex;
    flex-direction: column;
    color: #2B363C;
    position: absolute;
    width: 100%;
    border: .0625rem solid #E1E4EA;
    background-color: #ffffff;
    box-shadow: 0rem .5rem 1rem 0rem rgba(0, 0, 0, 0.2);
    min-width: 7.5rem;
    z-index: 1;
    margin-top: .5rem;
    border-radius: .5rem;
    text-align: left;
    max-height: 25rem;
    overflow: auto;
}

.pivot-table-control-filters-container .content-container .filters-grid .filter-item .filter-item-trigger-container .filter-item-options-container .input-search {
    border: 1px solid #E1E4EA;
    line-height: 1.5rem;
    font-size: .875rem;
    color: #64718B;
    padding: 0 1rem;
    margin: 1rem;
    border-radius: .5rem;
    outline: none;
    min-height: 50px;
    height: 50px;
}

.pivot-table-control-filters-container .content-container .filters-grid .filter-item .filter-item-trigger-container .filter-item-options-container .filter-item-option {
    border: none;
    background: none;
    width: 100%;
    color: #2B363C;
    padding: .75rem 1rem;
    text-decoration: none;
    display: flex;
    flex-direction: row;
    gap: 1rem;
    text-align: left;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5rem;
}

.pivot-table-control-filters-container .content-container .filters-grid .filter-item .filter-item-trigger-container .filter-item-options-container .filter-item-option:hover {
    background-color: #E1E4EA;
}

.pivot-table-control-filters-container .content-container .filters-grid .filter-item .filter-item-trigger-container .filter-item-options-container .filter-item-option .filter-item-option-checkbox {
    border: .125rem solid #2B363C;
    border-radius: .25rem;
    width: 1.5rem;
    height: 1.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.pivot-table-control-filters-container .content-container .filters-grid .filter-item .filter-item-trigger-container .filter-item-options-container .filter-item-option .filter-item-option-label {
    display: flex;
    flex: 1;
}

.pivot-table-control-filters-container .content-container .filters-grid .filter-item .filter-item-trigger-container .filter-item-options-container .filter-item-option .checked {
    background: #23282E;
    pointer-events: none;
}

.pivot-table-control-filters-container .content-container .filters-grid .filter-item select {
    height: 2.75rem;
    background-color: white !important;
    /* background: white !important; */
    border: .0625rem solid #E1E4EA;
    border-radius: .5rem;
    outline: none;
    outline-color: unset;
    outline-width: 0;
    padding-left: 1rem;
    padding-right: 1rem;
    font-weight: 1.75rem;
    font-weight: 400;
    font-size: 1rem;
    color: #2B363C;

    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik01LjI5Mjg5IDguMjkyODlDNS42ODM0MiA3LjkwMjM3IDYuMzE2NTggNy45MDIzNyA2LjcwNzExIDguMjkyODlMMTIgMTMuNTg1OEwxNy4yOTI5IDguMjkyODlDMTcuNjgzNCA3LjkwMjM3IDE4LjMxNjYgNy45MDIzNyAxOC43MDcxIDguMjkyODlDMTkuMDk3NiA4LjY4MzQyIDE5LjA5NzYgOS4zMTY1OCAxOC43MDcxIDkuNzA3MTFMMTIuNzA3MSAxNS43MDcxQzEyLjMxNjYgMTYuMDk3NiAxMS42ODM0IDE2LjA5NzYgMTEuMjkyOSAxNS43MDcxTDUuMjkyODkgOS43MDcxMUM0LjkwMjM3IDkuMzE2NTggNC45MDIzNyA4LjY4MzQyIDUuMjkyODkgOC4yOTI4OVoiIGZpbGw9IiM2NDcxOEIiLz4KPC9zdmc+Cg==) no-repeat 95% 50%;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
}

.pivot-table-control-filters-container .content-container .filters-grid .filter-item .configure-filter-button {
    display: none;
    background: none;
    border: none;
    width: 100%;
    color: #64718B;
    font-weight: 500;
    font-size: .75rem;
    line-height: 1.5rem;
    text-align: left;
}

.pivot-table-control-table-container {
    display: grid;
    gap: .5rem;
    grid-template-columns: 19rem auto auto auto auto;
}

.pivot-table-control-table-container .right-column {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

.pivot-table-control-table-container .left-column,
.pivot-table-control-table-container .right-column .right-column-container {
    flex-direction: column;
    background: #FFFFFF;
    border: .0625rem solid #E1E4EA;
    border-radius: .5rem;
    padding: 2rem;
    text-align: left;
}

.pivot-table-control-table-container .desktop-only,
.pivot-table-control-table-container .right-column .desktop-only {
    display: flex;
}

.pivot-table-control-table-container .mobile-only,
.pivot-table-control-table-container .right-column .mobile-only {
    display: none;
}

/* .pivot-table-control-table-container .right-column .right-column-container:first-child {
    margin-bottom: .5rem;
} */
.pivot-table-control-table-container .right-column .right-column-container:last-child {
    padding: 0;
}

.pivot-table-control-table-container .right-column .right-column-container .pvtOutput .pvtTable {
    width: 100%;
    margin: 0;
    border: none;
    background: none;
    word-break: keep-all;
    overflow-wrap: unset;
}

.pivot-table-control-table-container .right-column .right-column-container .pvtOutput .pvtTable thead tr th,
.pivot-table-control-table-container .right-column .right-column-container .pvtOutput .pvtTable tbody tr th {
    background: none;
    word-break: keep-all;
    overflow-wrap: unset;
}

.pivot-table-control-table-container .right-column .right-column-container .pvtOutput .pvtTable tbody tr th,
.pivot-table-control-table-container .right-column .right-column-container .pvtOutput .pvtTable tbody tr td,
.pivot-table-control-table-container .right-column .right-column-container .pvtOutput .pvtTable thead tr th {
    border-bottom: .0625rem solid #E1E4EA;
    border-right: .0625rem solid #E1E4EA;
    color: #2B363C;
    text-align: center;
    vertical-align: middle;
    font-size: .875rem;
    line-height: 1.5rem;
    font-family: 'Noto Sans', sans-serif;
    word-break: keep-all;
    overflow-wrap: unset;
    padding: .5rem;
    white-space: nowrap;
}

.pivot-table-control-table-container .right-column .right-column-container .pvtOutput .pvtTable tbody tr td {
    text-align: right;
    font-weight: 500;
}

.pivot-table-control-table-container .right-column .right-column-container .pvtOutput .pvtTable tbody tr th {
    text-align: left;
}

.pivot-table-control-table-container .right-column .right-column-container .pvtOutput .pvtTable thead tr .pvtAxisLabel {
    /* font-weight: 500; */
    font-size: .875rem;
    line-height: 1.5rem;
    /* padding: 1.5rem 2rem 1.125rem 2rem; */
    font-family: 'Noto Sans', sans-serif;
    word-break: keep-all;
    overflow-wrap: unset;
}

.pivot-table-control-table-container .right-column .right-column-container .pvtOutput .pvtTable tbody tr th {
    /* font-weight: 600; */
    font-size: .875rem;
    line-height: 1.5rem;
    /* padding: 1.625rem 2rem; */
    font-family: 'Noto Sans', sans-serif;
    word-break: keep-all;
    overflow-wrap: unset;
}

.pivot-table-control-table-container .right-column .right-column-container .pvtOutput .pvtTable tbody tr th,
.pivot-table-control-table-container .right-column .right-column-container .pvtOutput .pvtTable thead tr th {
    border-top: none;
    overflow-wrap: break-word;
}

.pivot-table-control-table-container .right-column .right-column-container .pvtOutput .pvtTable tbody tr:last-child th,
.pivot-table-control-table-container .right-column .right-column-container .pvtOutput .pvtTable tbody tr:last-child td {
    border-bottom: none;
    overflow-wrap: break-word;
    font-weight: 400;
}

.pivot-table-control-table-container .right-column .right-column-container .pvtOutput .pvtTable tbody tr th:first-child,
.pivot-table-control-table-container .right-column .right-column-container .pvtOutput .pvtTable thead tr th:first-child {
    border-left: none;
    overflow-wrap: break-word;
}

.pivot-table-control-table-container .right-column .right-column-container .pvtOutput .pvtTable tbody tr .pvtGrandTotal,
.pivot-table-control-table-container .right-column .right-column-container .pvtOutput .pvtTable tbody tr .pvtTotal,
.pivot-table-control-table-container .right-column .right-column-container .pvtOutput .pvtTable tbody tr th:last-child,
.pivot-table-control-table-container .right-column .right-column-container .pvtOutput .pvtTable thead tr th:last-child {
    border-right: none;
}

.pivot-table-control-table-container .right-column {
    grid-column: 2 / -1;
}

.pivot-table-control-table-container .right-column .pvtAxisContainer,
.pivot-table-control-table-container .left-column .pvtAxisContainer {
    width: 100%;
    border: none;
    background: none;
    margin: 0;
    padding: 0;
}

.pivot-table-control-table-container .left-column.desktop-only .pvtAxisContainer li {
    margin-bottom: 1rem;
}

.pivot-table-control-table-container .right-column .pvtAxisContainer li,
.pivot-table-control-table-container .left-column .pvtAxisContainer li {
    margin: 0;
    padding: 0;
    /* margin-top: 1rem; */
}

.pivot-table-control-table-container .right-column div .instrutions,
.pivot-table-control-table-container .left-column .instrutions {
    margin: 0;
    color: #64718B;
    font-weight: 400;
    font-size: .875rem;
    line-height: 1.5rem;
    margin-top: .25rem;
}

.pivot-table-control-table-container .right-column div h6,
.pivot-table-control-table-container .left-column h6 {
    margin: 0;
    color: #2B363C;
    font-weight: 400;
    font-size: .875rem;
    line-height: 1.5rem;
}

.pivot-table-control-table-container .right-column .pvtAxisContainer .pvtAttr,
.pivot-table-control-table-container .left-column .pvtAxisContainer .pvtAttr {
    border: none;
    background: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: fit-content;
    gap: .5rem;
    color: #23282E;
    font-weight: 500;
    font-size: .875rem;
    line-height: 1.5rem;
    border: .0625rem solid #FBCB3C;
    background: #FFF2CC;
    border-radius: .5rem;
    padding: .25rem .75rem;
}

.pivot-table-control-table-container .left-column .pvtAxisContainer .pvtAttr {
    white-space: break-spaces;
    word-wrap: break-word;
}

.pivot-table-control-table-container .right-column .pvtAxisContainer .pvtAttr .pvtTriangle,
.pivot-table-control-table-container .left-column .pvtAxisContainer .pvtAttr .pvtTriangle {
    width: fit-content;
    height: 1.125rem;
    display: flex;
}

.pivot-table-control-table-container .left-column .pvtAxisContainer {
    margin-top: 1rem;
}

.pivot-table-control-table-container .right-column .pvtAxisContainer {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 1rem;
}

.pivot-table-control-table-container .right-column .right-column-container .pvtOutput {
    /* max-width: 74.7344rem; */
    overflow-x: auto;
}

.pvtUi {
    width: 100%;
    text-align: left;
}

.table-dropdown {
    position: relative;
}

.table-dropdown .table-dropbtn:hover {
    background-color: #E1E4EA;
}

.table-dropdown .table-dropbtn {
    background-color: #ffffff;
    padding: .625rem 1.25rem;
    cursor: pointer;
    border-radius: .3125rem;
    font-size: 1rem;
    padding: 1rem;
    gap: .5rem;
    color: #2B363C;
    border-radius: .5rem;
}

.table-dropdown .table-dropdown-content {
    color: #2B363C;
    position: absolute;
    width: 100%;
    border: .0625rem solid #E1E4EA;
    background-color: #ffffff;
    box-shadow: 0rem .5rem 1rem 0rem rgba(0, 0, 0, 0.2);
    z-index: 1;
    margin-top: .5rem;
    border-radius: .5rem;
    text-align: left;
    min-width: max-content;
}

.table-dropdown .table-dropdown-content button {
    border: none;
    background: none;
    width: 100%;
    color: #2B363C;
    padding: .75rem 1rem;
    text-decoration: none;
    display: flex;
    flex-direction: row;
    gap: .5rem;
    text-align: left;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5rem;
}

.table-dropdown .table-dropdown-content button img {
    width: 24px;
    height: 24px;
}

.table-dropdown .table-dropdown-content button:hover {
    background-color: #E1E4EA;
}

.next-slick-arrow,
.prev-slick-arrow {
    color: #000000;
    font-size: 2.8125rem;
    cursor: pointer;

}

.rotate-180 {
    transform: rotate(180deg);
}


.slick-dots {
    position: relative;
    bottom: 0rem;
}

.slide-class {
    margin-left: auto;
    margin-right: auto;
    height: 100%;
    width: 100%;
}

.slick-next {
    right: 1.25rem;
    width: 1.5rem;
    height: 1.5rem;
    z-index: 1;
}

.slick-next::before {
    content: "" !important;
}

.slick-prev {
    left: 1.25rem;
    width: 1.5rem;
    height: 1.5rem;
    z-index: 1;
}

.slick-prev:before {
    content: "" !important;
}

.ms-Modal-scrollableContent {
    overflow: hidden;
    display: flex;
    flex-direction: column;
}


@media (max-width: 48rem) {
    .table-dropdown .table-dropbtn span {
        display: none;
    }

    .pivot-table-control-table-container {
        display: flex;
        flex-direction: column;
    }

    .pivot-table-control-table-container .desktop-only,
    .pivot-table-control-table-container .right-column .desktop-only {
        display: none;
    }

    .pivot-table-control-table-container .mobile-only,
    .pivot-table-control-table-container .right-column .mobile-only {
        display: flex;
    }

    .pivot-table-control-filters-container .content-container .filters-grid {
        grid-template-columns: 1fr;
    }

    .pivot-table-control-table-container .left-column .pvtAxisContainer,
    .pivot-table-control-table-container .right-column .pvtAxisContainer {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 1rem;
    }

    .pivot-table-control-table-container .left-column .pvtAxisContainer li,
    .pivot-table-control-table-container .right-column .pvtAxisContainer li {
        margin-top: 0;
    }

    .pivot-table-control-table-container .mobile-only h6,
    .pivot-table-control-table-container .right-column .mobile-only h6 {
        /* margin-bottom: 1rem; */
        margin-bottom: 0;
    }


    .modal-popup-root {
        background: white;
        background-color: white;
        inset: none;
    }

    .modal-popup-root .ms-Overlay,
    .ms-Overlay--dark {
        display: none;
    }

    .modal-popup-container-pivot {
        display: flex;
        width: 100%;
        height: 100dvh;
        margin: 0;
        box-shadow: none;
        padding: 1.125rem 0 1.5rem 0;
        position: relative;
        max-width: 100%;
        max-height: 100%;
        border: none;
    }

    .modal-popup-container-pivot * {
        margin: 0;
        padding: 0;
    }

    .modal-popup-container-pivot button {
        border: none;
        background: none;
        outline: none;
        font-family: "Noto Sans", sans-serif;
    }

    .modal-popup-container-pivot .modal-popup-header {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        height: 4.75rem;
        padding: 0 2rem;
        z-index: 10;
        background: white;
        margin: 0;
    }

    .modal-popup-container-pivot .modal-popup-header img {
        width: 7.6875rem;
        height: 2.25rem;
        display: block;
    }

    .modal-popup-container-pivot .modal-popup-header button {
        width: 2.75rem;
        height: 3.75rem;
        position: unset;
    }

    .modal-popup-container-pivot .modal-popup-header button img {
        width: 1.5rem;
        height: 1.5rem;
        padding: 0;
    }


    .modal-popup-container-pivot .modal-popup-body {
        margin-top: 4.75rem;
        margin-bottom: 6.75rem;
        display: flex;
        flex-direction: column;
        margin-right: 2rem;
        margin-left: 2rem;
    }

    .modal-popup-container-pivot .modal-popup-body h2 {
        font-size: 1rem;
        font-weight: 600;
        line-height: 28px;
        text-align: left;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
    }

    .howtobuildtable-modal .modal-popup-container-pivot .modal-popup-body h2 {
        font-size: 1.25rem;
    }

    .modal-popup-container-pivot .modal-popup-body p {
        font-size: 14px;
        font-weight: 400;
        line-height: 24px;
        text-align: left;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
        color: #23282E;
        margin-bottom: 0px;
    }

    .modal-popup-text {
        overflow-y: auto;
        max-height: 100%;
        display: flex;
        flex-direction: column;
        gap: 1rem;
    }

    /* .modal-popup-container-pivot .modal-popup-logo {
        display: flex;
        width: 7.6875rem;
        height: 2.25rem;
        justify-items: center;
        justify-content: center;
        top: 20px;
        position: absolute;
    }

    .modal-popup-container-pivot .modal-popup-logo .modal-close {
        display: none;
    }


    .modal-popup-container-pivot .modal-popup-header {
        display: flex;
        position: relative;
        padding: 0px;
        height: fit-content;
    }

    .modal-popup-container-pivot .modal-popup-header h2 {
        font-size: 1rem;
        font-weight: 600;
        line-height: 1.75rem;
        text-align: left;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
    } */

    .next-slick-arrow,
    .prev-slick-arrow {
        position: absolute;
        top: -50%;
        z-index: 10;
        padding: 1.875rem 1.875rem 1.875rem 0px;
    }


    .next-slick-arrow {
        right: -2.5rem;
        top: -80%;
    }

    .prev-slick-arrow {
        left: -2.5rem;
    }

    .modal-popup-container-pivot .modal-popup-body .modal-popup-content {
        display: flex !important;
        height: auto;
        width: 100%;
        padding: 0px;
        max-height: calc(100dvh - 13rem);
        overflow-y: scroll;
        margin-top: 32px;
    }

    .modal-popup-container-pivot .modal-popup-body .modal-popup-content .modal-popup-container-text-image {
        display: flex;
        flex-direction: column;
        gap: 2rem;
        width: 100%;
    }

    .modal-popup-container-pivot .modal-popup-body .modal-popup-content .modal-popup-container-text-image .modal-popup-image {
        width: 100%;
        height: auto;
    }

    .modal-popup-container-pivot .modal-popup-body .modal-popup-content .modal-popup-container-video .modal-popup-video {
        width: 100%;
        height: auto
    }

    .slick-dots {
        bottom: 2rem;
        position: fixed;
        right: 0;
        left: 0;
    }


    .ms-Modal-scrollableContent {
        margin-top: 3rem;

    }

    .slider-container .slick-list {
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        touch-action: pan-x;
    }

    .modal-popup-container-pivot .modal-popup-content .modal-popup-container-text-image .modal-popup-text {
        max-height: 100%;
        overflow-y: unset;
    }

    .modal-popup-container-pivot .modal-popup-content .modal-popup-container-text .modal-popup-text {
        max-height: 100%;
        overflow-y: unset;
    }

    .modal-popup-container-pivot .modal-popup-content .modal-popup-container-image {
        max-height: calc(100dvh - 13rem);
        overflow-y: scroll;
    }

    .modal-popup-container-pivot .modal-popup-content .modal-popup-container-video {
        max-height: calc(100dvh - 13rem);
        overflow-y: scroll;
    }
}



@media (max-width: 26.5625rem) {
    .pivot-table-control-filters-container .content-container .filters-grid {
        grid-template-columns: 1fr;
    }

    /* LAYOUT CUSTOMS */
    .pivot-table-control-table-container .left-column,
    .pivot-table-control-table-container .right-column .right-column-container,
    .pivot-table-control-filters-container .content-container,
    .pivot-table-attributes-container .content-container {
        padding: 1rem;
    }

    .pivot-table-attributes-container .table-dropdown .table-dropdown-content {
        right: 0;
    }

        .pivot-table-control-filters-container .content-container .filters-grid .filter-item .filter-item-trigger-container .filter-item-trigger div .label {
            white-space: unset;
            overflow: hidden;
            text-overflow: ellipsis;
            max-width: calc(100% - 60px);
            /* Account for arrow icon */
            word-break: break-word;display: -webkit-box;
                -webkit-line-clamp: 1;
                -webkit-box-orient: vertical;
                height: fit-content;
                line-clamp: 1;
                text-overflow: ellipsis;
                overflow: hidden;
        }
}


.pivot-table-control-table-container.remove-last-row-from-table .right-column .right-column-container .pvtOutput .pvtTable tbody tr:last-child {
    display: none;
}

.pivot-table-control-table-container.remove-last-col-from-table .right-column .right-column-container .pvtOutput .pvtTable thead tr:first-child th:last-child,
.pivot-table-control-table-container.remove-last-col-from-table .right-column .right-column-container .pvtOutput .pvtTable tbody tr td:last-child {
    display: none;
}

.pivot-table-control-table-container .right-column .right-column-container .no-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.pivot-table-control-table-container .right-column .right-column-container .no-content .no-data {
    margin-top: .5rem;
    color: #64718b;
    font-weight: 400;
    font-size: .875rem;
    line-height: 1.5rem;
}

table.pvtTable .pvtColLabel {
    text-align: center;
    max-width: 150px;
    word-break: break-word;
    white-space: normal !important;
    min-width: 150px;
}

table.pvtTable .pvtVal,
table.pvtTable .pvtTotal {
    max-width: 200px !important;
    word-break: break-word !important;
    white-space: normal !important;
}

/* ADD TABLE SCROLLABLE WITH HEADER FIXED */
/* .pvtOutput {
    position: relative;
    overflow: hidden; 
    display: block;
    max-height: 600px;
    overflow-y: auto;
}

.pvtOutput table {
    width: 100%;
    border-collapse: collapse;
}

.pvtOutput table thead {
    position: sticky;
    top: 0;
    z-index: 1;
    background-color: #fff;
}

.pvtOutput table thead tr, 
.pvtOutput table tbody tr {
    display: table;
    width: 100%;
    table-layout: fixed;
} */