@st-namespace 'ReviewSummary-deprecated-st-css';
:import {
    -st-from: "../../common/formatters.st";
    -st-named: color, font, fallback;
}

:import {
    -st-from: "../ProgressBar/ProgressBar.deprecated.st.css";
    -st-default: ProgressBar;
}

/* Defaults - default params */
:vars {
  DefaultBarColor: color-8;
  DefaultTextFont: font("{theme: 'Body-M', size: '12px', lineHeight: '1.4em'}");
  DefaultBarBGColor: color-5;
}

/* Overrides - deceleration of overridable parameters by the consumer */
:vars {
  /*
      The font
      @default {theme: 'Body-M', size: '12px', lineHeight: '1.4em'}
  */
  TextFont: --overridable;
  /*
      The item background-color
      @default color-5
  */
  BarBGColor: --overridable;
  /*
      The item color
      @default color-8
  */
  BarColor: --overridable;
}
/*
 * The font
 * @type font
 * @default preset: 'Body-M' | overrides: { size: '12px', lineHeight: '1.4em'}
 */
@property st-global(--wix-ui-tpa-review-summary-text-font);
/*
 * The item background-color
 * @type color
 * @default --wix-color-5
 */
@property st-global(--wix-ui-tpa-review-summary-bar-b-g-color);
/*
 * The item color
 * @type color
 * @default --wix-color-8
 */
@property st-global(--wix-ui-tpa-review-summary-bar-color);

/* Overrides */
:vars {
  barColor: color(fallback(value(BarColor), value(DefaultBarColor)));
  barBgColor: color(fallback(value(BarBGColor), value(DefaultBarBGColor)));
  textFont: fallback(font(value(TextFont)), font(value(DefaultTextFont)));
}
.root {
  font: value(textFont);
}

.itemList {
  -st-states: withSuffix, withPrefix;
  padding: 0;
  list-style: none;
  display: grid;
  row-gap: 16px;
  grid-template-columns: 1fr;
}

.itemList:withSuffix {
  grid-template-columns: 1fr max-content;
}

.itemList:withPrefix {
  grid-template-columns: max-content 1fr;
}

.itemList:withSuffix:withPrefix {
  grid-template-columns: max-content 1fr max-content;
}

.itemWrapper, .progressBar {
  display: contents;
}

.progressBar {
  -st-extends: ProgressBar;
  -st-mixin: ProgressBar(
      TextFont value(textFont),
      BarColor value(barColor),
      BarBGColor value(barBgColor)
  );
  -st-states: clickable,
}

.progressBar:clickable:hover, .progressBar:clickable:hover::barContainer {
  cursor: pointer;
}

.progressBar:clickable:hover::barBackground {
  background: value(barColor);
}

.progressBar::barContainer {
  align-self: center;
  display: flex;
}

.progressBar::prefixIndicationContainer {
  justify-content: end;
  align-items: center;
}

.progressBar::progressIndicationSection {
  justify-content: start;
}

/* st-namespace-reference="../../../../src/components/ReviewSummary/ReviewSummary.deprecated.st.css" */