@use "./functions.scss" as *;
@use "sass:map";
@use "sass:list";

[data-div-type="element"] {
  &[data-element-type="volumePricing"] {
    // width: var(--_lt-wh);
    // height: var(--_lt-ht);
    // margin: var(--_lt-mn);
    // padding: var(--_lt-pg);
    // width: var(--_ctm-lt-wh, var(--_tst-lt-wh));
    // width: var(--_sf-nw-wh, var(--_tst-lt-wh));
    // margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
    // height: var(--_ctm-lt-ht, var(--_tst-lt-ht));
    // height: ;
    // aspect-ratio: 1 / var(--_sf-aspect-ratio);
    // --_aspect-ratio: calc(
    //   1 * (var(--_ctm-lt-ht, var(--_tst-lt-ht)) / var(--_ctm-lt-wh, var(--_tst-lt-wh)))
    // );

    width: var(
      --_sf-el-wh-st-mx,
      calc(
        1% * var(--_ctm-mob-ele-nw-wh-vl, var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl)))
      )
    );
    margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));

    --_aspect-ratio: calc(
      1 *
        (
          var(--_ctm-mob-lt-ht, var(--_ctm-tab-lt-ht, var(--_ctm-lt-ht))) /
            var(--_ctm-mob-lt-wh, var(--_ctm-tab-lt-wh, var(--_ctm-lt-wh)))
        )
    );
    & > .wrapper {
      width: 100%;
      // height: 100%;
    }
    &[data-show-shadow="false"] {
      --_show-shadow: none;
    }
    &[data-overflow-items="Wrap"] {
      .horizontal {
        flex-wrap: wrap;
      }
    }
    &[data-overflow-items="Scroll"] {
      .horizontal {
        width: 100%;
        overflow-x: auto;
        .item {
          width: 100%;
          flex-shrink: 0;
        }
      }
      .vertical {
        overflow-y: auto;
        max-height: 30%;
      }
    }
    .text-element {
      color: #333;
      font-size: 12px;
      font-style: normal;
      font-weight: 400;
      line-height: 18px;
      margin-bottom: 6px;
    }

    .uom__selector {
      width: 100%;
      // height: var(--_ctm-mob-lt-ht, var(--_ctm-tab-lt-ht, var(--_ctm-lt-ht)));
      .uom__container {
        padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
        // border: 1px solid rgba(75, 69, 70, 1);
        // border-radius: 20px;
        .stack {
          display: flex;
          flex-direction: column;
          .static {
            color: var(
              --_ctm-mob-dn-um-te-se-cr,
              var(--_ctm-tab-dn-um-te-se-cr, var(--_ctm-dn-um-te-se-cr))
            );
            font-family: var(
              --_ctm-mob-dn-um-te-se-ft-fy,
              var(--_ctm-tab-dn-um-te-se-ft-fy, var(--_ctm-dn-um-te-se-ft-fy))
            );
            text-transform: var(
              --_ctm-mob-dn-um-te-se-tt-tm,
              var(--_ctm-tab-dn-um-te-se-tt-tm, var(--_ctm-dn-um-te-se-tt-tm))
            );
            word-wrap: var(
              --_ctm-mob-dn-um-te-se-wd-wp,
              var(--_ctm-tab-dn-um-te-se-wd-wp, var(--_ctm-dn-um-te-se-wd-wp))
            );
            word-break: var(
              --_ctm-mob-dn-um-te-se-wd-bk,
              var(--_ctm-tab-dn-um-te-se-wd-bk, var(--_ctm-dn-um-te-se-wd-bk))
            );
            font-size: var(
              --_ctm-mob-dn-um-te-se-ft-se,
              var(--_ctm-tab-dn-um-te-se-ft-se, var(--_ctm-dn-um-te-se-ft-se))
            );
            font-weight: var(
              --_ctm-mob-dn-um-te-se-ft-wt,
              var(--_ctm-tab-dn-um-te-se-ft-wt, var(--_ctm-dn-um-te-se-ft-wt))
            );
            font-style: var(
              --_ctm-mob-dn-um-te-se-ft-se-ic,
              var(--_ctm-tab-dn-um-te-se-ft-se-ic, var(--_ctm-dn-um-te-se-ft-se-ic))
            );
            text-align: var(
              --_ctm-mob-dn-um-te-se-tt-an,
              var(--_ctm-tab-dn-um-te-se-tt-an, var(--_ctm-dn-um-te-se-tt-an))
            );
            letter-spacing: var(
              --_ctm-mob-dn-um-te-se-lr-sg,
              var(--_ctm-tab-dn-um-te-se-lr-sg, var(--_ctm-dn-um-te-se-lr-sg))
            );
            line-height: var(
              --_ctm-mob-dn-um-te-se-le-ht,
              var(--_ctm-tab-dn-um-te-se-le-ht, var(--_ctm-dn-um-te-se-le-ht))
            );
            text-decoration: var(
              --_ctm-mob-dn-um-te-se-ue,
              var(--_ctm-tab-dn-um-te-se-ue, var(--_ctm-dn-um-te-se-ue))
            );
          }

          .item {
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            gap: 4px;
            padding: var(
                --_ctm-mob-dn-im-se-dt-se-vl-pg,
                var(--_ctm-tab-dn-im-se-dt-se-vl-pg, var(--_ctm-dn-im-se-dt-se-vl-pg))
              )
              var(
                --_ctm-mob-dn-im-se-dt-se-hl-pg,
                var(--_ctm-tab-dn-im-se-dt-se-hl-pg, var(--_ctm-dn-im-se-dt-se-hl-pg))
              );
            cursor: pointer;
            background-color: var(
              --_ctm-mob-dn-im-se-dt-se-bd-cr,
              var(--_ctm-tab-dn-im-se-dt-se-bd-cr, var(--_ctm-dn-im-se-dt-se-bd-cr))
            );

            border-color: var(
              --_show-border-im-se,
              var(
                --_ctm-mob-dn-im-se-dt-se-br-cr,
                var(--_ctm-tab-dn-im-se-dt-se-br-cr, var(--_ctm-dn-im-se-dt-se-br-cr))
              )
            );
            border-style: var(
              --_show-border-im-se,
              var(
                --_ctm-mob-dn-im-se-dt-se-br-se,
                var(--_ctm-tab-dn-im-se-dt-se-br-se, var(--_ctm-dn-im-se-dt-se-br-se))
              )
            );
            border-width: var(
              --_show-border-im-se,
              var(
                --_ctm-mob-dn-im-se-dt-se-br-wh,
                var(--_ctm-tab-dn-im-se-dt-se-br-wh, var(--_ctm-dn-im-se-dt-se-br-wh))
              )
            );
            border-radius: var(
              --_ctm-mob-dn-im-se-dt-se-br-rs,
              var(--_ctm-tab-dn-im-se-dt-se-br-rs, var(--_ctm-dn-im-se-dt-se-br-rs))
            );

            box-shadow: var(
              --_show-shadow-im-se,
              var(
                  --_ctm-mob-dn-im-se-dt-se-sw-ae,
                  var(--_ctm-tab-dn-im-se-dt-se-sw-ae, var(--_ctm-dn-im-se-dt-se-sw-ae))
                )
                var(
                  --_ctm-mob-dn-im-se-dt-se-sw-br,
                  var(--_ctm-tab-dn-im-se-dt-se-sw-br, var(--_ctm-dn-im-se-dt-se-sw-br))
                )
                var(
                  --_ctm-mob-dn-im-se-dt-se-sw-sd,
                  var(--_ctm-tab-dn-im-se-dt-se-sw-sd, var(--_ctm-dn-im-se-dt-se-sw-sd))
                )
                var(
                  --_ctm-mob-dn-im-se-dt-se-sw-cr,
                  var(--_ctm-tab-dn-im-se-dt-se-sw-cr, var(--_ctm-dn-im-se-dt-se-sw-cr))
                )
            );
          }
          .active {
            display: flex;

            align-items: var(
              --_ctm-mob-dn-im-se-sd-se-ct-at,
              var(--_ctm-tab-dn-im-se-sd-se-ct-at, var(--_ctm-dn-im-se-sd-se-ct-at))
            );

            justify-content: center;
            flex-direction: column;
            gap: 4px;

            padding: var(
                --_ctm-mob-dn-im-se-sd-se-vl-pg,
                var(--_ctm-tab-dn-im-se-sd-se-vl-pg, var(--_ctm-dn-im-se-sd-se-vl-pg))
              )
              var(
                --_ctm-mob-dn-im-se-sd-se-hl-pg,
                var(--_ctm-tab-dn-im-se-sd-se-hl-pg, var(--_ctm-dn-im-se-sd-se-hl-pg))
              );

            cursor: pointer;

            background-color: var(
              --_ctm-mob-dn-im-se-sd-se-bd-cr,
              var(--_ctm-tab-dn-im-se-sd-se-bd-cr, var(--_ctm-dn-im-se-sd-se-bd-cr))
            );

            border-color: var(
              --_show-border-im-se,
              var(
                --_ctm-mob-dn-im-se-sd-se-br-cr,
                var(--_ctm-tab-dn-im-se-sd-se-br-cr, var(--_ctm-dn-im-se-sd-se-br-cr))
              )
            );

            border-style: var(
              --_show-border-im-se,
              var(
                --_ctm-mob-dn-im-se-sd-se-br-se,
                var(--_ctm-tab-dn-im-se-sd-se-br-se, var(--_ctm-dn-im-se-sd-se-br-se))
              )
            );

            border-width: var(
              --_show-border-im-se,
              var(
                --_ctm-mob-dn-im-se-sd-se-br-wh,
                var(--_ctm-tab-dn-im-se-sd-se-br-wh, var(--_ctm-dn-im-se-sd-se-br-wh))
              )
            );

            border-radius: var(
              --_ctm-mob-dn-im-se-sd-se-br-rs,
              var(--_ctm-tab-dn-im-se-sd-se-br-rs, var(--_ctm-dn-im-se-sd-se-br-rs))
            );

            box-shadow: var(
              --_show-shadow-im-se,
              var(
                  --_ctm-mob-dn-im-se-sd-se-sw-ae,
                  var(--_ctm-tab-dn-im-se-sd-se-sw-ae, var(--_ctm-dn-im-se-sd-se-sw-ae))
                )
                var(
                  --_ctm-mob-dn-im-se-sd-se-sw-br,
                  var(--_ctm-tab-dn-im-se-sd-se-sw-br, var(--_ctm-dn-im-se-sd-se-sw-br))
                )
                var(
                  --_ctm-mob-dn-im-se-sd-se-sw-sd,
                  var(--_ctm-tab-dn-im-se-sd-se-sw-sd, var(--_ctm-dn-im-se-sd-se-sw-sd))
                )
                var(
                  --_ctm-mob-dn-im-se-sd-se-sw-cr,
                  var(--_ctm-tab-dn-im-se-sd-se-sw-cr, var(--_ctm-dn-im-se-sd-se-sw-cr))
                )
            );

            .each {
              color: var(
                --_ctm-mob-dn-um-se-cr,
                var(--_ctm-tab-dn-um-se-cr, var(--_ctm-dn-um-se-cr))
              );
              font-family: var(
                --_ctm-mob-dn-um-se-ft-fy,
                var(--_ctm-tab-dn-um-se-ft-fy, var(--_ctm-dn-um-se-ft-fy))
              );
              text-transform: var(
                --_ctm-mob-dn-um-se-tt-tm,
                var(--_ctm-tab-dn-um-se-tt-tm, var(--_ctm-dn-um-se-tt-tm))
              );
              word-wrap: var(
                --_ctm-mob-dn-um-se-wd-wp,
                var(--_ctm-tab-dn-um-se-wd-wp, var(--_ctm-dn-um-se-wd-wp))
              );
              word-break: var(
                --_ctm-mob-dn-um-se-wd-bk,
                var(--_ctm-tab-dn-um-se-wd-bk, var(--_ctm-dn-um-se-wd-bk))
              );
              font-size: var(
                --_ctm-mob-dn-um-se-ft-se,
                var(--_ctm-tab-dn-um-se-ft-se, var(--_ctm-dn-um-se-ft-se))
              );
              font-weight: var(
                --_ctm-mob-dn-um-se-ft-wt,
                var(--_ctm-tab-dn-um-se-ft-wt, var(--_ctm-dn-um-se-ft-wt))
              );
              font-style: var(
                --_ctm-mob-dn-um-se-ft-se-ic,
                var(--_ctm-tab-dn-um-se-ft-se-ic, var(--_ctm-dn-um-se-ft-se-ic))
              );
              text-align: var(
                --_ctm-mob-dn-um-se-tt-an,
                var(--_ctm-tab-dn-um-se-tt-an, var(--_ctm-dn-um-se-tt-an))
              );
              letter-spacing: var(
                --_ctm-mob-dn-um-se-lr-sg,
                var(--_ctm-tab-dn-um-se-lr-sg, var(--_ctm-dn-um-se-lr-sg))
              );
              line-height: var(
                --_ctm-mob-dn-um-se-le-ht,
                var(--_ctm-tab-dn-um-se-le-ht, var(--_ctm-dn-um-se-le-ht))
              );
              text-decoration: var(
                --_ctm-mob-dn-um-se-ue,
                var(--_ctm-tab-dn-um-se-ue, var(--_ctm-dn-um-se-ue))
              );
            }

            .price {
              color: var(
                --_ctm-mob-dn-pt-pe-cr,
                var(--_ctm-tab-dn-pt-pe-cr, var(--_ctm-dn-pt-pe-cr))
              );
              font-family: var(
                --_ctm-mob-dn-pt-pe-ft-fy,
                var(--_ctm-tab-dn-pt-pe-ft-fy, var(--_ctm-dn-pt-pe-ft-fy))
              );
              text-transform: var(
                --_ctm-mob-dn-pt-pe-tt-tm,
                var(--_ctm-tab-dn-pt-pe-tt-tm, var(--_ctm-dn-pt-pe-tt-tm))
              );
              word-wrap: var(
                --_ctm-mob-dn-pt-pe-wd-wp,
                var(--_ctm-tab-dn-pt-pe-wd-wp, var(--_ctm-dn-pt-pe-wd-wp))
              );
              word-break: var(
                --_ctm-mob-dn-pt-pe-wd-bk,
                var(--_ctm-tab-dn-pt-pe-wd-bk, var(--_ctm-dn-pt-pe-wd-bk))
              );
              font-size: var(
                --_ctm-mob-dn-pt-pe-ft-se,
                var(--_ctm-tab-dn-pt-pe-ft-se, var(--_ctm-dn-pt-pe-ft-se))
              );
              font-weight: var(
                --_ctm-mob-dn-pt-pe-ft-wt,
                var(--_ctm-tab-dn-pt-pe-ft-wt, var(--_ctm-dn-pt-pe-ft-wt))
              );
              font-style: var(
                --_ctm-mob-dn-pt-pe-ft-se-ic,
                var(--_ctm-tab-dn-pt-pe-ft-se-ic, var(--_ctm-dn-pt-pe-ft-se-ic))
              );
              text-align: var(
                --_ctm-mob-dn-pt-pe-tt-an,
                var(--_ctm-tab-dn-pt-pe-tt-an, var(--_ctm-dn-pt-pe-tt-an))
              );
              letter-spacing: var(
                --_ctm-mob-dn-pt-pe-lr-sg,
                var(--_ctm-tab-dn-pt-pe-lr-sg, var(--_ctm-dn-pt-pe-lr-sg))
              );
              line-height: var(
                --_ctm-mob-dn-pt-pe-le-ht,
                var(--_ctm-tab-dn-pt-pe-le-ht, var(--_ctm-dn-pt-pe-le-ht))
              );
              text-decoration: var(
                --_ctm-mob-dn-pt-pe-ue,
                var(--_ctm-tab-dn-pt-pe-ue, var(--_ctm-dn-pt-pe-ue))
              );
            }
            .off__price {
              font-size: 12px;
              display: flex;
              justify-content: space-around;
              gap: 10px;
              align-items: center;
              .saving__amount {
                color: var(--_ctm-mob-dn-ss-cr, var(--_ctm-tab-dn-ss-cr, var(--_ctm-dn-ss-cr)));
                font-family: var(
                  --_ctm-mob-dn-ss-ft-fy,
                  var(--_ctm-tab-dn-ss-ft-fy, var(--_ctm-dn-ss-ft-fy))
                );
                text-transform: var(
                  --_ctm-mob-dn-ss-tt-tm,
                  var(--_ctm-tab-dn-ss-tt-tm, var(--_ctm-dn-ss-tt-tm))
                );
                word-wrap: var(
                  --_ctm-mob-dn-ss-wd-wp,
                  var(--_ctm-tab-dn-ss-wd-wp, var(--_ctm-dn-ss-wd-wp))
                );
                word-break: var(
                  --_ctm-mob-dn-ss-wd-bk,
                  var(--_ctm-tab-dn-ss-wd-bk, var(--_ctm-dn-ss-wd-bk))
                );
                font-size: var(
                  --_ctm-mob-dn-ss-ft-se,
                  var(--_ctm-tab-dn-ss-ft-se, var(--_ctm-dn-ss-ft-se))
                );
                font-weight: var(
                  --_ctm-mob-dn-ss-ft-wt,
                  var(--_ctm-tab-dn-ss-ft-wt, var(--_ctm-dn-ss-ft-wt))
                );
                font-style: var(
                  --_ctm-mob-dn-ss-ft-se-ic,
                  var(--_ctm-tab-dn-ss-ft-se-ic, var(--_ctm-dn-ss-ft-se-ic))
                );
                text-align: var(
                  --_ctm-mob-dn-ss-tt-an,
                  var(--_ctm-tab-dn-ss-tt-an, var(--_ctm-dn-ss-tt-an))
                );
                letter-spacing: var(
                  --_ctm-mob-dn-ss-lr-sg,
                  var(--_ctm-tab-dn-ss-lr-sg, var(--_ctm-dn-ss-lr-sg))
                );
                line-height: var(
                  --_ctm-mob-dn-ss-le-ht,
                  var(--_ctm-tab-dn-ss-le-ht, var(--_ctm-dn-ss-le-ht))
                );
                text-decoration: var(
                  --_ctm-mob-dn-ss-ue,
                  var(--_ctm-tab-dn-ss-ue, var(--_ctm-dn-ss-ue))
                );
              }

              .actual__price {
                color: var(
                  --_ctm-mob-dn-al-pe-cr,
                  var(--_ctm-tab-dn-al-pe-cr, var(--_ctm-dn-al-pe-cr))
                );
                font-family: var(
                  --_ctm-mob-dn-al-pe-ft-fy,
                  var(--_ctm-tab-dn-al-pe-ft-fy, var(--_ctm-dn-al-pe-ft-fy))
                );
                text-transform: var(
                  --_ctm-mob-dn-al-pe-tt-tm,
                  var(--_ctm-tab-dn-al-pe-tt-tm, var(--_ctm-dn-al-pe-tt-tm))
                );
                word-wrap: var(
                  --_ctm-mob-dn-al-pe-wd-wp,
                  var(--_ctm-tab-dn-al-pe-wd-wp, var(--_ctm-dn-al-pe-wd-wp))
                );
                word-break: var(
                  --_ctm-mob-dn-al-pe-wd-bk,
                  var(--_ctm-tab-dn-al-pe-wd-bk, var(--_ctm-dn-al-pe-wd-bk))
                );
                font-size: var(
                  --_ctm-mob-dn-al-pe-ft-se,
                  var(--_ctm-tab-dn-al-pe-ft-se, var(--_ctm-dn-al-pe-ft-se))
                );
                font-weight: var(
                  --_ctm-mob-dn-al-pe-ft-wt,
                  var(--_ctm-tab-dn-al-pe-ft-wt, var(--_ctm-dn-al-pe-ft-wt))
                );
                font-style: var(
                  --_ctm-mob-dn-al-pe-ft-se-ic,
                  var(--_ctm-tab-dn-al-pe-ft-se-ic, var(--_ctm-dn-al-pe-ft-se-ic))
                );
                text-align: var(
                  --_ctm-mob-dn-al-pe-tt-an,
                  var(--_ctm-tab-dn-al-pe-tt-an, var(--_ctm-dn-al-pe-tt-an))
                );
                letter-spacing: var(
                  --_ctm-mob-dn-al-pe-lr-sg,
                  var(--_ctm-tab-dn-al-pe-lr-sg, var(--_ctm-dn-al-pe-lr-sg))
                );
                line-height: var(
                  --_ctm-mob-dn-al-pe-le-ht,
                  var(--_ctm-tab-dn-al-pe-le-ht, var(--_ctm-dn-al-pe-le-ht))
                );
                text-decoration: var(
                  --_ctm-mob-dn-al-pe-ue,
                  var(--_ctm-tab-dn-al-pe-ue, var(--_ctm-dn-al-pe-ue))
                );
              }
            }
            .units {
              color: var(
                --_ctm-mob-dn-pe-pr-ut-cr,
                var(--_ctm-tab-dn-pe-pr-ut-cr, var(--_ctm-dn-pe-pr-ut-cr))
              );
              font-family: var(
                --_ctm-mob-dn-pe-pr-ut-ft-fy,
                var(--_ctm-tab-dn-pe-pr-ut-ft-fy, var(--_ctm-dn-pe-pr-ut-ft-fy))
              );
              text-transform: var(
                --_ctm-mob-dn-pe-pr-ut-tt-tm,
                var(--_ctm-tab-dn-pe-pr-ut-tt-tm, var(--_ctm-dn-pe-pr-ut-tt-tm))
              );
              word-wrap: var(
                --_ctm-mob-dn-pe-pr-ut-wd-wp,
                var(--_ctm-tab-dn-pe-pr-ut-wd-wp, var(--_ctm-dn-pe-pr-ut-wd-wp))
              );
              word-break: var(
                --_ctm-mob-dn-pe-pr-ut-wd-bk,
                var(--_ctm-tab-dn-pe-pr-ut-wd-bk, var(--_ctm-dn-pe-pr-ut-wd-bk))
              );
              font-size: var(
                --_ctm-mob-dn-pe-pr-ut-ft-se,
                var(--_ctm-tab-dn-pe-pr-ut-ft-se, var(--_ctm-dn-pe-pr-ut-ft-se))
              );
              font-weight: var(
                --_ctm-mob-dn-pe-pr-ut-ft-wt,
                var(--_ctm-tab-dn-pe-pr-ut-ft-wt, var(--_ctm-dn-pe-pr-ut-ft-wt))
              );
              font-style: var(
                --_ctm-mob-dn-pe-pr-ut-ft-se-ic,
                var(--_ctm-tab-dn-pe-pr-ut-ft-se-ic, var(--_ctm-dn-pe-pr-ut-ft-se-ic))
              );
              text-align: var(
                --_ctm-mob-dn-pe-pr-ut-tt-an,
                var(--_ctm-tab-dn-pe-pr-ut-tt-an, var(--_ctm-dn-pe-pr-ut-tt-an))
              );
              letter-spacing: var(
                --_ctm-mob-dn-pe-pr-ut-lr-sg,
                var(--_ctm-tab-dn-pe-pr-ut-lr-sg, var(--_ctm-dn-pe-pr-ut-lr-sg))
              );
              line-height: var(
                --_ctm-mob-dn-pe-pr-ut-le-ht,
                var(--_ctm-tab-dn-pe-pr-ut-le-ht, var(--_ctm-dn-pe-pr-ut-le-ht))
              );
              text-decoration: var(
                --_ctm-mob-dn-pe-pr-ut-ue,
                var(--_ctm-tab-dn-pe-pr-ut-ue, var(--_ctm-dn-pe-pr-ut-ue))
              );
            }
          }

          .each {
            color: var(
              --_ctm-mob-dn-um-se-cr,
              var(--_ctm-tab-dn-um-se-cr, var(--_ctm-dn-um-se-cr))
            );
            font-family: var(
              --_ctm-mob-dn-um-se-ft-fy,
              var(--_ctm-tab-dn-um-se-ft-fy, var(--_ctm-dn-um-se-ft-fy))
            );
            text-transform: var(
              --_ctm-mob-dn-um-se-tt-tm,
              var(--_ctm-tab-dn-um-se-tt-tm, var(--_ctm-dn-um-se-tt-tm))
            );
            word-wrap: var(
              --_ctm-mob-dn-um-se-wd-wp,
              var(--_ctm-tab-dn-um-se-wd-wp, var(--_ctm-dn-um-se-wd-wp))
            );
            word-break: var(
              --_ctm-mob-dn-um-se-wd-bk,
              var(--_ctm-tab-dn-um-se-wd-bk, var(--_ctm-dn-um-se-wd-bk))
            );
            font-size: var(
              --_ctm-mob-dn-um-se-ft-se,
              var(--_ctm-tab-dn-um-se-ft-se, var(--_ctm-dn-um-se-ft-se))
            );
            font-weight: var(
              --_ctm-mob-dn-um-se-ft-wt,
              var(--_ctm-tab-dn-um-se-ft-wt, var(--_ctm-dn-um-se-ft-wt))
            );
            font-style: var(
              --_ctm-mob-dn-um-se-ft-se-ic,
              var(--_ctm-tab-dn-um-se-ft-se-ic, var(--_ctm-dn-um-se-ft-se-ic))
            );
            text-align: var(
              --_ctm-mob-dn-um-se-tt-an,
              var(--_ctm-tab-dn-um-se-tt-an, var(--_ctm-dn-um-se-tt-an))
            );
            letter-spacing: var(
              --_ctm-mob-dn-um-se-lr-sg,
              var(--_ctm-tab-dn-um-se-lr-sg, var(--_ctm-dn-um-se-lr-sg))
            );
            line-height: var(
              --_ctm-mob-dn-um-se-le-ht,
              var(--_ctm-tab-dn-um-se-le-ht, var(--_ctm-dn-um-se-le-ht))
            );
            text-decoration: var(
              --_ctm-mob-dn-um-se-ue,
              var(--_ctm-tab-dn-um-se-ue, var(--_ctm-dn-um-se-ue))
            );
          }

          .price {
            color: var(
              --_ctm-mob-dn-pt-pe-cr,
              var(--_ctm-tab-dn-pt-pe-cr, var(--_ctm-dn-pt-pe-cr))
            );
            font-family: var(
              --_ctm-mob-dn-pt-pe-ft-fy,
              var(--_ctm-tab-dn-pt-pe-ft-fy, var(--_ctm-dn-pt-pe-ft-fy))
            );
            text-transform: var(
              --_ctm-mob-dn-pt-pe-tt-tm,
              var(--_ctm-tab-dn-pt-pe-tt-tm, var(--_ctm-dn-pt-pe-tt-tm))
            );
            word-wrap: var(
              --_ctm-mob-dn-pt-pe-wd-wp,
              var(--_ctm-tab-dn-pt-pe-wd-wp, var(--_ctm-dn-pt-pe-wd-wp))
            );
            word-break: var(
              --_ctm-mob-dn-pt-pe-wd-bk,
              var(--_ctm-tab-dn-pt-pe-wd-bk, var(--_ctm-dn-pt-pe-wd-bk))
            );
            font-size: var(
              --_ctm-mob-dn-pt-pe-ft-se,
              var(--_ctm-tab-dn-pt-pe-ft-se, var(--_ctm-dn-pt-pe-ft-se))
            );
            font-weight: var(
              --_ctm-mob-dn-pt-pe-ft-wt,
              var(--_ctm-tab-dn-pt-pe-ft-wt, var(--_ctm-dn-pt-pe-ft-wt))
            );
            font-style: var(
              --_ctm-mob-dn-pt-pe-ft-se-ic,
              var(--_ctm-tab-dn-pt-pe-ft-se-ic, var(--_ctm-dn-pt-pe-ft-se-ic))
            );
            text-align: var(
              --_ctm-mob-dn-pt-pe-tt-an,
              var(--_ctm-tab-dn-pt-pe-tt-an, var(--_ctm-dn-pt-pe-tt-an))
            );
            letter-spacing: var(
              --_ctm-mob-dn-pt-pe-lr-sg,
              var(--_ctm-tab-dn-pt-pe-lr-sg, var(--_ctm-dn-pt-pe-lr-sg))
            );
            line-height: var(
              --_ctm-mob-dn-pt-pe-le-ht,
              var(--_ctm-tab-dn-pt-pe-le-ht, var(--_ctm-dn-pt-pe-le-ht))
            );
            text-decoration: var(
              --_ctm-mob-dn-pt-pe-ue,
              var(--_ctm-tab-dn-pt-pe-ue, var(--_ctm-dn-pt-pe-ue))
            );
          }
          .actual__price {
            color: var(
              --_ctm-mob-dn-al-pe-cr,
              var(--_ctm-tab-dn-al-pe-cr, var(--_ctm-dn-al-pe-cr))
            );
            font-family: var(
              --_ctm-mob-dn-al-pe-ft-fy,
              var(--_ctm-tab-dn-al-pe-ft-fy, var(--_ctm-dn-al-pe-ft-fy))
            );
            text-transform: var(
              --_ctm-mob-dn-al-pe-tt-tm,
              var(--_ctm-tab-dn-al-pe-tt-tm, var(--_ctm-dn-al-pe-tt-tm))
            );
            word-wrap: var(
              --_ctm-mob-dn-al-pe-wd-wp,
              var(--_ctm-tab-dn-al-pe-wd-wp, var(--_ctm-dn-al-pe-wd-wp))
            );
            word-break: var(
              --_ctm-mob-dn-al-pe-wd-bk,
              var(--_ctm-tab-dn-al-pe-wd-bk, var(--_ctm-dn-al-pe-wd-bk))
            );
            font-size: var(
              --_ctm-mob-dn-al-pe-ft-se,
              var(--_ctm-tab-dn-al-pe-ft-se, var(--_ctm-dn-al-pe-ft-se))
            );
            font-weight: var(
              --_ctm-mob-dn-al-pe-ft-wt,
              var(--_ctm-tab-dn-al-pe-ft-wt, var(--_ctm-dn-al-pe-ft-wt))
            );
            font-style: var(
              --_ctm-mob-dn-al-pe-ft-se-ic,
              var(--_ctm-tab-dn-al-pe-ft-se-ic, var(--_ctm-dn-al-pe-ft-se-ic))
            );
            text-align: var(
              --_ctm-mob-dn-al-pe-tt-an,
              var(--_ctm-tab-dn-al-pe-tt-an, var(--_ctm-dn-al-pe-tt-an))
            );
            letter-spacing: var(
              --_ctm-mob-dn-al-pe-lr-sg,
              var(--_ctm-tab-dn-al-pe-lr-sg, var(--_ctm-dn-al-pe-lr-sg))
            );
            line-height: var(
              --_ctm-mob-dn-al-pe-le-ht,
              var(--_ctm-tab-dn-al-pe-le-ht, var(--_ctm-dn-al-pe-le-ht))
            );
            text-decoration: var(
              --_ctm-mob-dn-al-pe-ue,
              var(--_ctm-tab-dn-al-pe-ue, var(--_ctm-dn-al-pe-ue))
            );
          }
          .saving__amount {
            color: var(--_ctm-mob-dn-ss-cr, var(--_ctm-tab-dn-ss-cr, var(--_ctm-dn-ss-cr)));
            font-family: var(
              --_ctm-mob-dn-ss-ft-fy,
              var(--_ctm-tab-dn-ss-ft-fy, var(--_ctm-dn-ss-ft-fy))
            );
            text-transform: var(
              --_ctm-mob-dn-ss-tt-tm,
              var(--_ctm-tab-dn-ss-tt-tm, var(--_ctm-dn-ss-tt-tm))
            );
            word-wrap: var(
              --_ctm-mob-dn-ss-wd-wp,
              var(--_ctm-tab-dn-ss-wd-wp, var(--_ctm-dn-ss-wd-wp))
            );
            word-break: var(
              --_ctm-mob-dn-ss-wd-bk,
              var(--_ctm-tab-dn-ss-wd-bk, var(--_ctm-dn-ss-wd-bk))
            );
            font-size: var(
              --_ctm-mob-dn-ss-ft-se,
              var(--_ctm-tab-dn-ss-ft-se, var(--_ctm-dn-ss-ft-se))
            );
            font-weight: var(
              --_ctm-mob-dn-ss-ft-wt,
              var(--_ctm-tab-dn-ss-ft-wt, var(--_ctm-dn-ss-ft-wt))
            );
            font-style: var(
              --_ctm-mob-dn-ss-ft-se-ic,
              var(--_ctm-tab-dn-ss-ft-se-ic, var(--_ctm-dn-ss-ft-se-ic))
            );
            text-align: var(
              --_ctm-mob-dn-ss-tt-an,
              var(--_ctm-tab-dn-ss-tt-an, var(--_ctm-dn-ss-tt-an))
            );
            letter-spacing: var(
              --_ctm-mob-dn-ss-lr-sg,
              var(--_ctm-tab-dn-ss-lr-sg, var(--_ctm-dn-ss-lr-sg))
            );
            line-height: var(
              --_ctm-mob-dn-ss-le-ht,
              var(--_ctm-tab-dn-ss-le-ht, var(--_ctm-dn-ss-le-ht))
            );
            text-decoration: var(
              --_ctm-mob-dn-ss-ue,
              var(--_ctm-tab-dn-ss-ue, var(--_ctm-dn-ss-ue))
            );
          }
          .off__price {
            font-size: 12px;
            display: flex;
            justify-content: space-around;
            gap: 10px;
            align-items: center;
          }

          .units {
            color: var(
              --_ctm-mob-dn-pe-pr-ut-cr,
              var(--_ctm-tab-dn-pe-pr-ut-cr, var(--_ctm-dn-pe-pr-ut-cr))
            );
            font-family: var(
              --_ctm-mob-dn-pe-pr-ut-ft-fy,
              var(--_ctm-tab-dn-pe-pr-ut-ft-fy, var(--_ctm-dn-pe-pr-ut-ft-fy))
            );
            text-transform: var(
              --_ctm-mob-dn-pe-pr-ut-tt-tm,
              var(--_ctm-tab-dn-pe-pr-ut-tt-tm, var(--_ctm-dn-pe-pr-ut-tt-tm))
            );
            word-wrap: var(
              --_ctm-mob-dn-pe-pr-ut-wd-wp,
              var(--_ctm-tab-dn-pe-pr-ut-wd-wp, var(--_ctm-dn-pe-pr-ut-wd-wp))
            );
            word-break: var(
              --_ctm-mob-dn-pe-pr-ut-wd-bk,
              var(--_ctm-tab-dn-pe-pr-ut-wd-bk, var(--_ctm-dn-pe-pr-ut-wd-bk))
            );
            font-size: var(
              --_ctm-mob-dn-pe-pr-ut-ft-se,
              var(--_ctm-tab-dn-pe-pr-ut-ft-se, var(--_ctm-dn-pe-pr-ut-ft-se))
            );
            font-weight: var(
              --_ctm-mob-dn-pe-pr-ut-ft-wt,
              var(--_ctm-tab-dn-pe-pr-ut-ft-wt, var(--_ctm-dn-pe-pr-ut-ft-wt))
            );
            font-style: var(
              --_ctm-mob-dn-pe-pr-ut-ft-se-ic,
              var(--_ctm-tab-dn-pe-pr-ut-ft-se-ic, var(--_ctm-dn-pe-pr-ut-ft-se-ic))
            );
            text-align: var(
              --_ctm-mob-dn-pe-pr-ut-tt-an,
              var(--_ctm-tab-dn-pe-pr-ut-tt-an, var(--_ctm-dn-pe-pr-ut-tt-an))
            );
            letter-spacing: var(
              --_ctm-mob-dn-pe-pr-ut-lr-sg,
              var(--_ctm-tab-dn-pe-pr-ut-lr-sg, var(--_ctm-dn-pe-pr-ut-lr-sg))
            );
            line-height: var(
              --_ctm-mob-dn-pe-pr-ut-le-ht,
              var(--_ctm-tab-dn-pe-pr-ut-le-ht, var(--_ctm-dn-pe-pr-ut-le-ht))
            );
            text-decoration: var(
              --_ctm-mob-dn-pe-pr-ut-ue,
              var(--_ctm-tab-dn-pe-pr-ut-ue, var(--_ctm-dn-pe-pr-ut-ue))
            );
          }
        }
      }

      .table__common_parent {
        // width: var(--_sf-nw-wh, var(--_tst-lt-wh));
        width: 100%;

        // aspect-ratio: 1 / var(--_sf-aspect-ratio);
        // --_aspect-ratio: calc(
        //   1 * (var(--_ctm-lt-ht, var(--_tst-lt-ht)) / var(--_ctm-lt-wh, var(--_tst-lt-wh)))
        // );

        .pagination:hover {
          --_sf-bd-cr: var(--_ctm-dn-pn-hr-se-bd-cr, var(--_tst-dn-pn-hr-se-bd-cr));
        }

        .pagination .active:hover {
          cursor: pointer;
          --_sf-hr-fc: var(--_ctm-dn-pn-hr-se-cr, var(--_tst-dn-pn-hr-se-cr));
          --_sf-hr-ff: var(--_ctm-dn-pn-hr-se-ft-fy, var(--_tst-dn-pn-hr-se-ft-fy));
          --_sf-hr-tt-tm: var(--_ctm-dn-pn-hr-se-tt-tm, var(--_tst-dn-pn-hr-se-tt-tm));
          --_sf-hr-wd-wp: var(--_ctm-dn-pn-hr-se-wd-wp, var(--_tst-dn-pn-hr-se-wd-wp));
          --_sf-hr-wd-bk: var(--_ctm-dn-pn-hr-se-wd-bk, var(--_tst-dn-pn-hr-se-wd-bk));
          --_sf-hr-fs: var(--_ctm-dn-pn-hr-se-ft-se, var(--_tst-dn-pn-hr-se-ft-se));
          --_sf-hr-td: var(--_ctm-dn-pn-hr-se-tt-ue, var(--_tst-dn-hr-tt-ue));
          --_sf-hr-fw: var(--_ctm-dn-pn-hr-se-ft-wt, var(--_tst-dn-pn-hr-se-ft-wt));
          --_sf-hr-ft: var(--_ctm-dn-pn-hr-se-ft-se-ic, var(--_tst-dn-pn-hr-se-ft-se-ic));
          --_sf-hr-ta: var(--_ctm-dn-pn-hr-se-tt-an, var(--_tst-dn-pn-hr-se-tt-an));
          --_sf-hr-ls: var(--_ctm-dn-pn-hr-se-lr-sg, var(--_tst-dn-pn-hr-se-lr-sg));
          --_sf-hr-lh: var(--_ctm-dn-pn-hr-se-le-ht, var(--_tst-dn-pn-hr-se-le-ht));
        }
        &[data-widget-shadow="false"] {
          .table__wrapper {
            --_show-shadow: none;
          }
        }
        &[data-widget-border="true"] {
          .table__wrapper {
            border-color: var(
              --_ctm-mob-dn-te-wt-br-cr,
              var(--_ctm-tab-dn-te-wt-br-cr, var(--_ctm-dn-te-wt-br-cr))
            );
            border-style: var(
              --_ctm-mob-dn-te-wt-br-se,
              var(--_ctm-tab-dn-te-wt-br-se, var(--_ctm-dn-te-wt-br-se))
            );
            border-width: var(
              --_ctm-mob-dn-te-wt-br-wh,
              var(--_ctm-tab-dn-te-wt-br-wh, var(--_ctm-dn-te-wt-br-wh))
            );
          }
        }
        &[data-table-shadow="false"] {
          .table__container {
            --_show-table-shadow: none;
          }
        }
        &[data-table-border="true"] {
          .table__container {
            border-color: var(
              --_ctm-mob-dn-te-br-cr,
              var(--_ctm-tab-dn-te-br-cr, var(--_ctm-dn-te-br-cr))
            );
            border-style: var(
              --_ctm-mob-dn-te-br-se,
              var(--_ctm-tab-dn-te-br-se, var(--_ctm-dn-te-br-se))
            );
            border-width: var(
              --_ctm-mob-dn-te-br-wh,
              var(--_ctm-tab-dn-te-br-wh, var(--_ctm-dn-te-br-wh))
            );
          }
        }

        &[data-header-divider="true"] {
          thead tr th {
            border-bottom: 1px solid
              var(
                --_ctm-mob-dn-rw-ad-hr-ds-hr-dr,
                var(--_ctm-tab-dn-rw-ad-hr-ds-hr-dr, var(--_ctm-dn-rw-ad-hr-ds-hr-dr))
              );
          }
        }
        &[data-row-divider="true"] {
          tbody tr {
            border-bottom: 1px solid
              var(
                --_ctm-mob-dn-rw-ad-hr-ds-rw-dr,
                var(--_ctm-tab-dn-rw-ad-hr-ds-rw-dr, var(--_ctm-dn-rw-ad-hr-ds-rw-dr))
              );
          }
        }
        &[data-column-divider="true"] {
          tbody tr td,
          thead tr th {
            border-right: 1px solid
              var(
                --_ctm-mob-dn-rw-ad-hr-ds-cn-dr,
                var(--_ctm-tab-dn-rw-ad-hr-ds-cn-dr, var(--_ctm-dn-rw-ad-hr-ds-cn-dr))
              );
          }

          tbody tr td:last-child,
          thead tr th:last-child {
            border-right: none;
          }
        }
        &[data-show-more-rows="onScroll"] {
          .table__container {
            overflow-y: scroll;
            height: var(
              --_ctm-mob-lt-te-ht,
              var(--_ctm-tab-lt-te-ht, var(--_ctm-lt-te-ht))
            ) !important;

            &::-webkit-scrollbar {
              width: var(
                --_ctm-mob-dn-sl-br-sl-br-wh,
                var(--_ctm-tab-dn-sl-br-sl-br-wh, var(--_ctm-dn-sl-br-sl-br-wh))
              );
            }

            &::-webkit-scrollbar-track {
              background-color: var(--_base-white);
            }

            &::-webkit-scrollbar-thumb {
              background-color: var(
                --_ctm-mob-dn-sl-br-sl-br-cr,
                var(--_ctm-tab-dn-sl-br-sl-br-cr, var(--_ctm-dn-sl-br-sl-br-cr))
              );
            }

            // // Scrollbar thumb when hovered
            // &::-webkit-scrollbar-thumb:hover {
            //   background-color: #555; // Darker color when hovering over the thumb
            // }

            // // For Firefox, using scrollbar-width and scrollbar-color
            // scrollbar-width: thin; // Thin scrollbar
            // scrollbar-color: #888 #f1f1f1; // Thumb and track colors
          }
        }

        &[data-alternative-row-colors="true"] {
          tbody .tbody__row__divider:nth-child(odd) {
            background-color: #f76b6b;
          }
        }

        .table__wrapper {
          padding: var(
            --_ctm-mob-lt-pg,
            var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg, var(--_tst-lt-pg)))
          );

          background-color: var(
            --_ctm-mob-dn-te-wt-bd-cr,
            var(--_ctm-tab-dn-te-wt-bd-cr, var(--_ctm-dn-te-wt-bd-cr, var(--_tst-dn-te-wt-bd-cr)))
          );

          border-radius: var(
            --_ctm-mob-dn-te-wt-br-rs,
            var(--_ctm-tab-dn-te-wt-br-rs, var(--_ctm-dn-te-wt-br-rs, var(--_tst-dn-te-wt-br-rs)))
          );

          box-shadow: var(
            --_show-shadow,
            var(
                --_ctm-mob-dn-te-wt-sw-ae,
                var(--_ctm-tab-dn-te-wt-sw-ae, var(--_ctm-dn-te-wt-sw-ae))
              )
              var(
                --_ctm-mob-dn-te-wt-sw-br,
                var(--_ctm-tab-dn-te-wt-sw-br, var(--_ctm-dn-te-wt-sw-br))
              )
              var(
                --_ctm-mob-dn-te-wt-sw-sd,
                var(--_ctm-tab-dn-te-wt-sw-sd, var(--_ctm-dn-te-wt-sw-sd))
              )
              var(
                --_ctm-mob-dn-te-wt-sw-cr,
                var(--_ctm-tab-dn-te-wt-sw-cr, var(--_ctm-dn-te-wt-sw-cr))
              )
          );

          width: 100%;

          .table__container {
            background-color: var(
              --_ctm-mob-dn-te-bd-cr,
              var(--_ctm-tab-dn-te-bd-cr, var(--_ctm-dn-te-bd-cr))
            );

            border-radius: var(
              --_ctm-mob-dn-te-br-rs,
              var(--_ctm-tab-dn-te-br-rs, var(--_ctm-dn-te-br-rs))
            );

            box-shadow: var(
              --_show-table-shadow,
              var(--_ctm-mob-dn-te-sw-ae, var(--_ctm-tab-dn-te-sw-ae, var(--_ctm-dn-te-sw-ae)))
                var(--_ctm-mob-dn-te-sw-br, var(--_ctm-tab-dn-te-sw-br, var(--_ctm-dn-te-sw-br)))
                var(--_ctm-mob-dn-te-sw-sd, var(--_ctm-tab-dn-te-sw-sd, var(--_ctm-dn-te-sw-sd)))
                var(--_ctm-mob-dn-te-sw-cr, var(--_ctm-tab-dn-te-sw-cr, var(--_ctm-dn-te-sw-cr)))
            );
          }

          h3 {
            text-align: center;
            width: 100%;
            margin-bottom: 10px;
          }
          table {
            border-collapse: collapse;
            // border: none;
            width: 100%;
            // height: 100%;
            text-align: var(--_ctm-mob-lt-ct-at, var(--_ctm-tab-lt-ct-at, var(--_ctm-lt-ct-at)));

            th,
            td {
              border: none;
            }
            thead {
              background-color: var(
                --_ctm-mob-dn-te-hr-bd-cr,
                var(--_ctm-tab-dn-te-hr-bd-cr, var(--_ctm-dn-te-hr-bd-cr))
              );

              .thead__row__divider {
                height: var(--_ctm-mob-lt-hr-ht, var(--_ctm-tab-lt-hr-ht, var(--_ctm-lt-hr-ht)));

                .th__col__divider {
                  padding: var(
                    --_ctm-mob-lt-hr-cl-pg,
                    var(--_ctm-tab-lt-hr-cl-pg, var(--_ctm-lt-hr-cl-pg))
                  );

                  color: var(
                    --_ctm-mob-dn-hr-tt-cr,
                    var(--_ctm-tab-dn-hr-tt-cr, var(--_ctm-dn-hr-tt-cr))
                  );

                  font-family: var(
                    --_ctm-mob-dn-hr-tt-ft-fy,
                    var(--_ctm-tab-dn-hr-tt-ft-fy, var(--_ctm-dn-hr-tt-ft-fy))
                  );
                  text-transform: var(
                    --_ctm-mob-dn-hr-tt-tt-tm,
                    var(--_ctm-tab-dn-hr-tt-tt-tm, var(--_ctm-dn-hr-tt-tt-tm))
                  );
                  word-wrap: var(
                    --_ctm-mob-dn-hr-tt-wd-wp,
                    var(--_ctm-tab-dn-hr-tt-wd-wp, var(--_ctm-dn-hr-tt-wd-wp))
                  );
                  word-break: var(
                    --_ctm-mob-dn-hr-tt-wd-bk,
                    var(--_ctm-tab-dn-hr-tt-wd-bk, var(--_ctm-dn-hr-tt-wd-bk))
                  );

                  font-size: var(
                    --_ctm-mob-dn-hr-tt-ft-se,
                    var(--_ctm-tab-dn-hr-tt-ft-se, var(--_ctm-dn-hr-tt-ft-se))
                  );

                  font-weight: var(
                    --_ctm-mob-dn-hr-tt-ft-wt,
                    var(--_ctm-tab-dn-hr-tt-ft-wt, var(--_ctm-dn-hr-tt-ft-wt))
                  );

                  text-decoration: var(
                    --_ctm-mob-dn-hr-tt-ue,
                    var(--_ctm-tab-dn-hr-tt-ue, var(--_ctm-dn-hr-tt-ue))
                  );

                  font-style: var(
                    --_ctm-mob-dn-hr-tt-ft-se-ic,
                    var(--_ctm-tab-dn-hr-tt-ft-se-ic, var(--_ctm-dn-hr-tt-ft-se-ic))
                  );

                  text-align: var(
                    --_ctm-mob-dn-hr-tt-tt-an,
                    var(--_ctm-tab-dn-hr-tt-tt-an, var(--_ctm-dn-hr-tt-tt-an))
                  );

                  letter-spacing: var(
                    --_ctm-mob-dn-hr-tt-lr-sg,
                    var(--_ctm-tab-dn-hr-tt-lr-sg, var(--_ctm-dn-hr-tt-lr-sg))
                  );

                  line-height: var(
                    --_ctm-mob-dn-hr-tt-le-ht,
                    var(--_ctm-tab-dn-hr-tt-le-ht, var(--_ctm-dn-hr-tt-le-ht))
                  );
                }
              }
            }
            tbody {
              .tbody__row__divider {
                background-color: var(
                  --_ctm-mob-dn-te-rw-bd-cr,
                  var(--_ctm-tab-dn-te-rw-bd-cr, var(--_ctm-dn-te-rw-bd-cr))
                );

                height: var(--_ctm-mob-lt-rw-ht, var(--_ctm-tab-lt-rw-ht, var(--_ctm-lt-rw-ht)));

                .td__col__divider {
                  padding: var(
                    --_ctm-mob-lt-rw-cl-pg,
                    var(--_ctm-tab-lt-rw-cl-pg, var(--_ctm-lt-rw-cl-pg))
                  );

                  color: var(
                    --_sf-hr-fc,
                    var(
                      --_ctm-mob-dn-rw-tt-cr,
                      var(--_ctm-tab-dn-rw-tt-cr, var(--_ctm-dn-rw-tt-cr))
                    )
                  );

                  font-family: var(
                    --_sf-hr-ff,
                    var(
                      --_ctm-mob-dn-rw-tt-ft-fy,
                      var(--_ctm-tab-dn-rw-tt-ft-fy, var(--_ctm-dn-rw-tt-ft-fy))
                    )
                  );
                  text-transform: var(
                    --_sf-hr-tt-tm,
                    var(
                      --_ctm-mob-dn-rw-tt-tt-tm,
                      var(--_ctm-tab-dn-rw-tt-tt-tm, var(--_ctm-dn-rw-tt-tt-tm))
                    )
                  );
                  word-wrap: var(
                    --_sf-hr-wd-wp,
                    var(
                      --_ctm-mob-dn-rw-tt-wd-wp,
                      var(--_ctm-tab-dn-rw-tt-wd-wp, var(--_ctm-dn-rw-tt-wd-wp))
                    )
                  );
                  word-break: var(
                    --_sf-hr-wd-bk,
                    var(
                      --_ctm-mob-dn-rw-tt-wd-bk,
                      var(--_ctm-tab-dn-rw-tt-wd-bk, var(--_ctm-dn-rw-tt-wd-bk))
                    )
                  );

                  font-size: var(
                    --_sf-hr-fs,
                    var(
                      --_ctm-mob-dn-rw-tt-ft-se,
                      var(--_ctm-tab-dn-rw-tt-ft-se, var(--_ctm-dn-rw-tt-ft-se))
                    )
                  );

                  text-decoration: var(
                    --_ctm-mob-dn-rw-tt-ue,
                    var(--_ctm-tab-dn-rw-tt-ue, var(--_ctm-dn-rw-tt-ue))
                  );

                  font-weight: var(
                    --_sf-hr-fw,
                    var(
                      --_ctm-mob-dn-rw-tt-ft-wt,
                      var(--_ctm-tab-dn-rw-tt-ft-wt, var(--_ctm-dn-rw-tt-ft-wt))
                    )
                  );

                  font-style: var(
                    --_sf-hr-ft,
                    var(
                      --_ctm-mob-dn-rw-tt-ft-se-ic,
                      var(--_ctm-tab-dn-rw-tt-ft-se-ic, var(--_ctm-dn-rw-tt-ft-se-ic))
                    )
                  );

                  text-align: var(
                    --_sf-hr-ta,
                    var(
                      --_ctm-mob-dn-rw-tt-tt-an,
                      var(--_ctm-tab-dn-rw-tt-tt-an, var(--_ctm-dn-rw-tt-tt-an))
                    )
                  );

                  letter-spacing: var(
                    --_sf-hr-ls,
                    var(
                      --_ctm-mob-dn-rw-tt-lr-sg,
                      var(--_ctm-tab-dn-rw-tt-lr-sg, var(--_ctm-dn-rw-tt-lr-sg))
                    )
                  );

                  line-height: var(
                    --_sf-hr-lh,
                    var(
                      --_ctm-mob-dn-rw-tt-le-ht,
                      var(--_ctm-tab-dn-rw-tt-le-ht, var(--_ctm-dn-rw-tt-le-ht))
                    )
                  );
                }
              }
            }
          }

          .pagination {
            display: var(--_d-flex);
            align-items: var(--_align-center);
            justify-content: var(
              --_ctm-mob-lt-pn-at,
              var(--_ctm-tab-lt-pn-at, var(--_ctm-lt-pn-at))
            );
            margin-top: 10px;
            background-color: var(
              --_sf-bd-cr,
              var(
                --_ctm-mob-dn-pn-dt-se-bd-cr,
                var(--_ctm-tab-dn-pn-dt-se-bd-cr, var(--_ctm-dn-pn-dt-se-bd-cr))
              )
            );
            &.pagination__center {
              justify-content: var(justify-center);
            }

            button {
              svg {
                width: var(--_width-18);
                height: var(--_height-18);
                path {
                  stroke: var(--_gray-500);
                  // stroke: var(--_ctm-dn-pn-in-c1, var(--_tst-dn-pn-in-c1));
  // Overrides the stroke-width presentation attribute baked into the icon markup.
  stroke-width: prepareMediaVariable(--_ctm-dn-pn-se-wh, 1.25);
                }
              }
            }
            span {
              float: left;
              padding: var(--_pd-8) var(--_pd-16);
              text-decoration: none;
              span {
                // color: var(--_sf-hr-fc, var(--_ctm-dn-pn-bn-cr, var(--_tst-dn-pn-bn-cr)));
                // font-size: var(--_sf-hr-fs, var(--_ctm-dn-pn-ft-se, var(--_tst-dn-pn-ft-se)));
                // font-family: var(--_sf-hr-ff, var(--_ctm-dn-pn-ft-fy, var(--_tst-dn-pn-ft-fy))),

                // font-weight: var(--_sf-hr-fw, var(--_ctm-dn-pn-ft-wt, var(--_tst-dn-pn-ft-wt)));
                // font-style: var(--_sf-hr-ft, var(--_ctm-dn-pn-ft-se-ic, var(--_tst-dn-pn-ft-se-ic)));
                // text-align: var(--_sf-hr-ta, var(--_ctm-dn-pn-tt-an, var(--_tst-dn-pn-tt-an)));
                // letter-spacing: var(--_sf-hr-ls, var(--_ctm-dn-pn-lr-sg, var(--_tst-dn-pn-lr-sg)));
                // line-height: var(--_sf-hr-lh, var(--_ctm-dn-pn-le-ht, var(--_tst-dn-pn-le-ht)));
              }
              &.active:hover {
                &hover {
                  --_sf-hr-fc: var(--_ctm-dn-pn-hr-se-cr, var(--_tst-dn-pn-hr-se-cr));
                  --_sf-hr-ff: var(--_ctm-dn-pn-hr-se-ft-fy, var(--_tst-dn-pn-hr-se-ft-fy));
                  --_sf-hr-tt-tm: var(--_ctm-dn-pn-hr-se-tt-tm, var(--_tst-dn-pn-hr-se-tt-tm));
                  --_sf-hr-wd-wp: var(--_ctm-dn-pn-hr-se-wd-wp, var(--_tst-dn-pn-hr-se-wd-wp));
                  --_sf-hr-wd-bk: var(--_ctm-dn-pn-hr-se-wd-bk, var(--_tst-dn-pn-hr-se-wd-bk));
                  --_sf-hr-fs: var(--_ctm-dn-pn-hr-se-ft-se, var(--_tst-dn-pn-hr-se-ft-se));
                  --_sf-hr-fw: var(--_ctm-dn-pn-hr-se-ft-wt, var(--_tst-dn-pn-hr-se-ft-wt));
                  --_sf-hr-ft: var(--_ctm-dn-pn-hr-se-ft-se-ic, var(--_tst-dn-pn-hr-se-ft-se-ic));
                  --_sf-hr-ta: var(--_ctm-dn-pn-hr-se-tt-an, var(--_tst-dn-pn-hr-se-tt-an));
                  --_sf-hr-ls: var(--_ctm-dn-pn-hr-se-lr-sg, var(--_tst-dn-pn-hr-se-lr-sg));
                  --_sf-hr-lh: var(--_ctm-dn-pn-hr-se-le-ht, var(--_tst-dn-pn-hr-se-le-ht));
                }
              }
              &.active {
                color: var(
                  --_sf-hr-fc,
                  var(
                    --_ctm-mob-dn-pn-dt-se-cr,
                    var(--_ctm-tab-dn-pn-dt-se-cr, var(--_ctm-dn-pn-dt-se-cr))
                  )
                );

                font-family: var(
                  --_sf-hr-ff,
                  var(
                    --_ctm-mob-dn-pn-dt-se-ft-fy,
                    var(--_ctm-tab-dn-pn-dt-se-ft-fy, var(--_ctm-dn-pn-dt-se-ft-fy))
                  )
                );
                text-transform: var(
                  --_sf-hr-tt-tm,
                  var(
                    --_ctm-mob-dn-pn-dt-se-tt-tm,
                    var(--_ctm-tab-dn-pn-dt-se-tt-tm, var(--_ctm-dn-pn-dt-se-tt-tm))
                  )
                );
                word-wrap: var(
                  --_sf-hr-wd-wp,
                  var(
                    --_ctm-mob-dn-pn-dt-se-wd-wp,
                    var(--_ctm-tab-dn-pn-dt-se-wd-wp, var(--_ctm-dn-pn-dt-se-wd-wp))
                  )
                );
                word-break: var(
                  --_sf-hr-wd-bk,
                  var(
                    --_ctm-mob-dn-pn-dt-se-wd-bk,
                    var(--_ctm-tab-dn-pn-dt-se-wd-bk, var(--_ctm-dn-pn-dt-se-wd-bk))
                  )
                );

                font-size: var(
                  --_sf-hr-fs,
                  var(
                    --_ctm-mob-dn-pn-dt-se-ft-se,
                    var(--_ctm-tab-dn-pn-dt-se-ft-se, var(--_ctm-dn-pn-dt-se-ft-se))
                  )
                );

                text-decoration: var(
                  --_sf-hr-td,
                  var(
                    --_ctm-mob-dn-pn-dt-se-ue,
                    var(--_ctm-tab-dn-pn-dt-se-ue, var(--_ctm-dn-pn-dt-se-ue))
                  )
                );

                font-weight: var(
                  --_sf-hr-fw,
                  var(
                    --_ctm-mob-dn-pn-dt-se-ft-wt,
                    var(--_ctm-tab-dn-pn-dt-se-ft-wt, var(--_ctm-dn-pn-dt-se-ft-wt))
                  )
                );

                font-style: var(
                  --_sf-hr-ft,
                  var(
                    --_ctm-mob-dn-pn-dt-se-ft-se-ic,
                    var(--_ctm-tab-dn-pn-dt-se-ft-se-ic, var(--_ctm-dn-pn-dt-se-ft-se-ic))
                  )
                );

                text-align: var(
                  --_sf-hr-ta,
                  var(
                    --_ctm-mob-dn-pn-dt-se-tt-an,
                    var(--_ctm-tab-dn-pn-dt-se-tt-an, var(--_ctm-dn-pn-dt-se-tt-an))
                  )
                );

                letter-spacing: var(
                  --_sf-hr-ls,
                  var(
                    --_ctm-mob-dn-pn-dt-se-lr-sg,
                    var(--_ctm-tab-dn-pn-dt-se-lr-sg, var(--_ctm-dn-pn-dt-se-lr-sg))
                  )
                );

                line-height: var(
                  --_sf-hr-lh,
                  var(
                    --_ctm-mob-dn-pn-dt-se-le-ht,
                    var(--_ctm-tab-dn-pn-dt-se-le-ht, var(--_ctm-dn-pn-dt-se-le-ht))
                  )
                );
              }
            }
            .pagination__arrows {
              color: var(
                --_sf-hr-fc,
                var(--_ctm-mob-dn-pn-in-c1, var(--_ctm-tab-dn-pn-in-c1, var(--_ctm-dn-pn-in-c1)))
              );

              font-size: var(
                --_sf-hr-fs,
                var(--_ctm-mob-dn-pn-in-se, var(--_ctm-tab-dn-pn-in-se, var(--_ctm-dn-pn-in-se)))
              );
            }
          }
        }
      }
    }
  }
}