// Import all the tools needed to customize the theme and extract parts of it
// @import '~@angular/material/core/theming/all-theme';
@import '../../all-theme';

// Define a mixin that accepts a theme and outputs the color styles for the component.
@mixin ap-checkbox-theme($theme) {
  // Extract whichever individual palettes you need from the theme.
  $primary: map-get($theme, primary);
  $accent: map-get($theme, accent);

  md-checkbox[ap-checkbox] {
    &.md-primary {
      .md-checkbox-frame { border-color: md-color($primary, 500); }
    }
    &.md-accent {
      .md-checkbox-frame { border-color: md-color($accent, 500); }
    }
    .md-checkbox-inner-container {
      .md-checkbox-background {
        transform: scale(0.5);
        .md-checkbox-checkmark {
          display: none;
        }
      }
      .md-checkbox-frame { border-width: 1px; }
    }
  }

}