/* CSS Vars */
:root {
  --advancedPriceTableBg:            #f8f7fa; /* --brandColorMist @ 20% opacity converted to a color */
  --advancedPriceTableColor:         var(--color-primary-900);
  --advancedPriceTableHeadingBg:     var(--color-primary-700);
  --advancedPriceTableInactiveTabBg: var(--color-primary-200);
  --advancedPriceTableDisabledTabBg: var(--advancedPriceTableBg);
  --advancedPriceTableHeadingColor:  var(--color-light);
  --advancedPriceTableInactiveHeadingColor: var(--advancedPriceTableColor);
}

.advanced-price {
  clear: both;
  --tab-padding: clamp(0.5em, 1.5vw, 0.75em) clamp(0.75em, 1.5vw, 1.125em);
}

.advanced-price .ui-tabs-nav li {
  border: none !important;
  background: none;
}

.advanced-price table {
  background: var(--advancedPriceTableBg);
  color: var(--advancedPriceTableColor);

  --table-padding-vertical: clamp(0.4rem, 1.5vw, 0.5rem);
  --_table-padding-vertical: var(--table-padding-vertical);
  --table-padding-horizontal: clamp(0.375rem, 1.5vw, 0.75rem);

  --table-border: 1px solid var(--_table-border-color);
  border-radius: 0;

  font-size: clamp(90%, 3.5vw, 1em);
}

@media (width < 550px){
  .advanced-price table {
    letter-spacing: -.05em;
  }
}

@media (width > 550px) {
  .uc-quantity-pricing-table th:first-child, .uc-quantity-pricing-table td:first-child {
    width: 12.5em;
  }
}

.advanced-price table td,
.advanced-price table th {
  border: none;
}
.advanced-price table tbody {
  --table-padding-vertical: var(--_table-padding-vertical);
}

.advanced-price table tbody td       { border-top: var(--_table-inner-border); }
.advanced-price table th:last-child  { border-top-right-radius: var(--_table-radius);border-right: 0; }
.advanced-price table th:first-child { border-top-left-radius: 0 !important; border-left: 0; }

.advanced-price thead th,
.advanced-price thead th.colHover:not(:first-child),
.advanced-price thead th.colSelected:not(:first-child){
  background-color: var(--advancedPriceTableHeadingBg);
  color: var(--advancedPriceTableHeadingColor, var(--color-fg));
  font-weight: 600;
  font-size: 100%;
}
.advanced-price thead th:first-child {
  text-transform: uppercase;
  font-size: 0.875em;
}

.advanced-price th:not(:first-child),
.advanced-price td:not(:first-child) {
  text-align: center;
}

.uc-quantity-pricing-table .row-title {
  letter-spacing: -1px;
}

.production_times-link {
  display: block;
  margin: 0 0 0 15px;
  border-radius: var(--radius);
  border: 1px double var(--advancedPriceTableHeadingBg);
  background: var(--advancedPriceTableBg);
  color: var(--advancedPriceTableColor);
  font-weight: 600;
  font-style: italic;
  font-size: 90%;
  text-align: center;
  float: right;
  padding: 6px 8px;
  line-height: 1.25;
  text-decoration: none !important;
}

.forallpromos-price-display .ui-tabs .ui-tabs-nav li a {
  --_tab-radius: var(--tab-radius, var(--radius, 0));
  border-top-left-radius: var(--_tab-radius);
  border-top-right-radius: var(--_tab-radius);
  font-weight: 600;
  line-height: 1.2em;
  padding: var(--tab-padding);
  background: var(--advancedPriceTableInactiveTabBg);
  color: var(--advancedPriceTableInactiveHeadingColor, var(--color-primary-500));
}

.forallpromos-price-display .ui-tabs .ui-tabs-nav li,
.forallpromos-price-display .ui-tabs .ui-tabs-nav li a {
  flex-direction: row;
  flex: unset;
}

.forallpromos-price-display .ui-tabs .suffix {
  font-weight: normal;
}

.forallpromos-price-display .ui-tabs .ui-tabs-nav li a:hover,
.forallpromos-price-display .ui-tabs .ui-tabs-nav li.ui-tabs-selected a {
  background: var(--advancedPriceTableHeadingBg);
  color: var(--advancedPriceTableHeadingColor, var(--color-fg));
}

.forallpromos-price-display .ui-tabs-nav .ui-state-disabled {
  opacity: unset;
  filter: none;
}

.forallpromos-price-display .ui-tabs .ui-tabs-nav li.ui-state-disabled a,
.forallpromos-price-display .ui-tabs .ui-tabs-nav li.ui-state-disabled a:hover {
  background: var(--advancedPriceTableDisabledTabBg);
  pointer-events: none;
  color: var(--color-primary-300);
}

.forallpromos-price-display .sell-price-row {
  color: var(--advancedPriceTableColor, var(--color-fg));
  font-weight: 600;
}

/* grid select */
.forallpromos-price-display th.colHover:not(:first-child),
.forallpromos-price-display th.colSelected:not(:first-child),
.forallpromos-price-display .sell-price-row td.colHover:not(:first-child),
.forallpromos-price-display .sell-price-row td.colSelected:not(:first-child){
  position: relative;
  z-index: 0;
  color: var(--color-light);
  text-shadow: 0 0 2px var(--advancedPriceTableColor);
  background: transparent;
}
.forallpromos-price-display th.colHover:not(:first-child)::after,
.forallpromos-price-display th.colSelected:not(:first-child)::after,
.forallpromos-price-display .sell-price-row td.colHover:not(:first-child)::after,
.forallpromos-price-display .sell-price-row td.colSelected:not(:first-child)::after {
  --position: calc(clamp(0%, 1vw, 20%) - var(--table-padding-horizontal));
  content: "\00a0";
  position: absolute;
  border-radius: var(--radius-inf);
  border:1px solid var(--color-accent);
  background: var(--color-accent);
  inset: 0;
  left: max(var(--position), 1px);
  right: max(var(--position), 1px);
  z-index: -1;
  padding: 0.25em;
  max-width: 8ch;
  margin: .45em auto;
}



.forallpromos-price-display {
  font-size: clamp(86%, 4vw, 1em);
  line-height: calc(1rlh + .175em);
}


.production-time-notes {
  margin-top: 10px;
}


/* https://developer.chrome.com/docs/css-ui/scrollbar-styling */
.quantity-price-display {
  --scrollbar-color-thumb: var(--advancedPriceTableHeadingBg);
  --scrollbar-color-track: var(--color-primary-100);
  --scrollbar-width: thin;
  --scrollbar-width-legacy: 10px;
}

/* Modern browsers with `scrollbar-*` support */
@supports (scrollbar-width: auto) {
  .quantity-price-display {
    scrollbar-color: var(--scrollbar-color-thumb) var(--scrollbar-color-track);
    scrollbar-width: var(--scrollbar-width);
  }
}

/* Legacy browsers with `::-webkit-scrollbar-*` support */
@supports selector(::-webkit-scrollbar) {
  .quantity-price-display::-webkit-scrollbar-thumb {
    background: var(--scrollbar-color-thumb);
  }
  .quantity-price-display::-webkit-scrollbar-track {
    background: var(--scrollbar-color-track);
  }
  .quantity-price-display::-webkit-scrollbar {
    max-width: var(--scrollbar-width-legacy);
    max-height: var(--scrollbar-width-legacy);
  }
}
