.cmm-order {
  color: var(--e-global-color-secondary) !important;
  margin-bottom: 50px;
}

.cmm-school, .cmm-event {
  color: var(--e-global-color-secondary) !important;
}

.cmm-show {
  margin-bottom: 50px;
}

.cmm-coreo, .cmm-music {
  color: var(--e-global-color-secondary) !important;
  font-size: var(--e-global-typography-text-font-size) !important;
  text-transform: none !important;
}

.cmm-coreo span {
  color: #787c8a !important;
}

.cmm-upload-form {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.cmm-upload-form input[name="cmm_music_prefix"] {
  border-radius: 4px;
  width: 8ch;
  font-family: var(--e-global-typography-text-font-family);
  font-size: var(--e-global-typography-text-font-size);
  font-weight: var(--e-global-typography-text-font-weight);
  line-height: var(--e-global-typography-text-line-height);
}

.cmm-music-prefix {
  padding: 6px 12px !important;
}

.cmm-file-input {
  display: none;
}

.cmm-file-label {
  background: var(--e-global-color-accent);
  color: var(--e-global-color-primary);
  padding: 6px 12px;
  border-radius: 4px;
  cursor: pointer;
  font-family: var(--e-global-typography-accent-font-family), Sans-serif;
  font-size: var(--e-global-typography-accent-font-size);
  font-weight: var(--e-global-typography-accent-font-weight);
  line-height: var(--e-global-typography-accent-line-height);
}

.cmm-file-label:hover {

}

.cmm-file-name {
  font-family: var(--e-global-typography-text-font-family);
  font-size: var(--e-global-typography-text-font-size);
  font-weight: var(--e-global-typography-text-font-weight);
  line-height: var(--e-global-typography-text-line-height);
  color: #555;
  width: 30ch;
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  vertical-align: middle;
}

.cmm-submit {
  background-color: var(--e-global-color-accent) !important;
  color: var(--e-global-color-primary) !important;
  padding: 6px 12px !important;
  border-radius: 4px !important;
  border-width: 0px !important;
  font-family: var(--e-global-typography-accent-font-family), Sans-serif;
  font-size: var(--e-global-typography-accent-font-size);
  font-weight: var(--e-global-typography-accent-font-weight);
  line-height: var(--e-global-typography-accent-line-height);
}

.cmm-submit:hover {
  color: var(--e-global-color-primary) !important;
  border-width: 0px !important;
}

.progress-bar {
  width: 100%;
  height: 5px;
  background: #eee;
  border-radius: 4px;
  overflow: hidden;
  margin: 5px 0px;
}

.progress-fill {
  height: 100%;
  width: 0%;
  background: var(--e-global-color-accent);
  transition: width 0.2s;
}

.progress-text span {
  color: var(--e-global-color-accent);
  font-family: var(--e-global-typography-accent-font-family), Sans-serif;
  font-size: var(--e-global-typography-accent-font-size);
  font-weight: var(--e-global-typography-accent-font-weight);
  line-height: var(--e-global-typography-accent-line-height);
}