md-progress-circular.md-THEME_NAME-theme { background-color: transparent; .md-inner { .md-gap { border-top-color: '{{primary-color}}'; border-bottom-color: '{{primary-color}}'; } .md-left, .md-right { .md-half-circle { border-top-color: '{{primary-color}}'; } } .md-right { .md-half-circle { border-right-color: '{{primary-color}}'; } } .md-left { .md-half-circle { border-left-color: '{{primary-color}}'; } } } &.md-warn { .md-inner { .md-gap { border-top-color: '{{warn-color}}'; border-bottom-color: '{{warn-color}}'; } .md-left, .md-right { .md-half-circle { border-top-color: '{{warn-color}}'; } } .md-right { .md-half-circle { border-right-color: '{{warn-color}}'; } } .md-left { .md-half-circle { border-left-color: '{{warn-color}}'; } } } } &.md-accent { .md-inner { .md-gap { border-top-color: '{{accent-color}}'; border-bottom-color: '{{accent-color}}'; } .md-left, .md-right { .md-half-circle { border-top-color: '{{accent-color}}'; } } .md-right { .md-half-circle { border-right-color: '{{accent-color}}'; } } .md-left { .md-half-circle { border-left-color: '{{accent-color}}'; } } } } }