.unit-mix-summary {
  --ums-section-bg: #0f5f6b;
  --ums-phase-bg: #3d4f5f;
  --ums-metric-bg: #f4f6f8;
  --ums-subtotal-bg: #eceff3;
  --ums-total-bg: #eceff3;
  --ums-stripe-bg: #fafbfc;
  --ums-border: #d7dee5;
  --ums-text: #1f2933;
  --ums-header-text: #ffffff;
  --ums-muted-text: #5f6c7b;
  width: 100%;
}

.unit-mix-summary .ums-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.unit-mix-summary .ums-table {
  width: 100%;
  min-width: 720px;
  border-collapse: collapse;
  font-size: 0.875rem;
  line-height: 1.35;
  color: var(--ums-text);
}

.unit-mix-summary .ums-cell {
  padding: 0.55rem 0.75rem;
  border: 1px solid var(--ums-border);
  vertical-align: middle;
}

.unit-mix-summary .ums-cell--label {
  text-align: left;
  font-weight: 500;
  min-width: 11rem;
}

.unit-mix-summary .ums-cell--phase,
.unit-mix-summary .ums-cell--section {
  text-align: center;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.unit-mix-summary .ums-cell--section {
  background-color: var(--ums-section-bg);
  color: var(--ums-header-text);
  text-transform: uppercase;
}

.unit-mix-summary .ums-cell--phase {
  background-color: var(--ums-phase-bg);
  color: var(--ums-header-text);
  text-transform: none;
}

.unit-mix-summary .ums-phase-label {
  display: block;
  font-weight: 700;
}

.unit-mix-summary .ums-phase-subtitle {
  display: block;
  font-size: 0.8em;
  font-weight: 500;
  opacity: 0.9;
}

.unit-mix-summary .ums-row--metrics .ums-cell {
  background: var(--ums-metric-bg);
  color: var(--ums-muted-text);
  text-align: right;
  font-weight: 600;
  font-size: 0.8rem;
}

.unit-mix-summary .ums-row--metrics .ums-cell--label {
  text-align: left;
}

.unit-mix-summary .ums-cell--value {
  text-align: right;
  white-space: nowrap;
}

.unit-mix-summary .ums-cell--empty {
  color: var(--ums-muted-text);
}

.unit-mix-summary .ums-row--striped {
  background: var(--ums-stripe-bg);
}

.unit-mix-summary .ums-row--subtotal {
  background: var(--ums-subtotal-bg);
  font-weight: 700;
}

.unit-mix-summary .ums-row--total {
  background: var(--ums-total-bg);
  font-weight: 700;
}

.unit-mix-summary .ums-row--subtotal .ums-cell--label,
.unit-mix-summary .ums-row--subtotal .ums-cell--value,
.unit-mix-summary .ums-row--total .ums-cell--label,
.unit-mix-summary .ums-row--total .ums-cell--value {
  font-weight: 700;
}

.unit-mix-summary .ums-layout--stacked .ums-table {
  min-width: 28rem;
}

.unit-mix-summary .ums-row--phase-block .ums-cell--phase {
  text-align: center;
}

.unit-mix-summary .ums-layout--stacked .ums-row--phase-block .ums-phase-label,
.unit-mix-summary .ums-layout--stacked .ums-row--phase-block .ums-phase-subtitle {
  display: inline;
}

.unit-mix-summary .ums-layout--stacked .ums-row--phase-block .ums-phase-subtitle {
  margin-left: 0.35em;
}

@media (max-width: 767px) {
  .unit-mix-summary .ums-table {
    font-size: 0.8125rem;
  }

  .unit-mix-summary .ums-cell {
    padding: 0.45rem 0.55rem;
  }
}

.ums-excel-import-wrap {
  margin: 0 0 12px;
  padding: 12px;
  border: 1px dashed var(--ums-border, #d7dee5);
  border-radius: 4px;
  background: #f8fafb;
  color: #000;
}

#bricks-panel-element .ums-excel-import-wrap .ums-excel-import-label,
.ums-excel-import-wrap .ums-excel-import-label {
  display: block;
  margin-bottom: 8px;
  font-weight: 600;
  font-size: 12px;
  color: #000 !important;
}

.ums-excel-import-input {
  display: block;
  width: 100%;
  font-size: 12px;
}

.ums-excel-import-convert {
  display: block;
  width: 100%;
  margin-top: 8px;
  font-size: 12px;
  cursor: pointer;
}

.ums-excel-import-convert[hidden] {
  display: none;
}

.ums-excel-import-help,
.ums-excel-import-status {
  margin: 8px 0 0;
  font-size: 11px;
  line-height: 1.4;
  color: #5f6c7b;
}

.ums-excel-import-status.is-error {
  color: #b42318;
}

.ums-excel-import-status.is-success {
  color: #027a48;
}

.ums-import-guide {
  margin: 0;
}

.ums-import-guide__image {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  border: 1px solid var(--ums-border, #d7dee5);
  border-radius: 4px;
  background: #fff;
}

.ums-import-guide__note {
  margin: 8px 0 0;
  font-size: 11px;
  line-height: 1.45;
  color: #5f6c7b;
}
