/*
 * Copyright 2022-2023 Bloomreach. All rights reserved. (https://www.bloomreach.com/)
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *  https://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

:root {
  --mat-filled-button-container-shape: var(--brie-button-border-radius);
  --mat-outlined-button-container-shape: var(--brie-button-border-radius);
  --mat-text-button-container-shape: var(--brie-button-border-radius);
  --mat-protected-button-container-shape: var(--brie-button-border-radius);
}

button[mat-icon-button] {
  height: var(--brie-button-icon-size);
  width: var(--brie-button-icon-size);
  border-radius: var(--brie-button-border-radius);
  line-height: 1;
  padding: 0;

  .mat-icon {
    line-height: 1;
  }
}

button[mat-button], button[mat-icon-button], button.mat-mdc-button:not(:disabled) {
  color: var(--brie-button-base-text);
  font: var(--brie-button-text-font);
  border-radius: var(--brie-button-border-radius);
  line-height: 1;

  &.mat-button-disabled {
    color: var(--brie-button-text-color-disabled);
  }

  .mat-icon {
    color: var(--brie-button-base-text);
    line-height: 1;
  }

  &:hover {
    background: var(--brie-button-base-background-hover);

    .mat-icon {
      color: var(--brie-button-base-background-hover-icon);
    }
  }

  &:disabled {
    background: var(--brie-button-base-background-disabled);
  }
}

button[mat-button].mat-warn, button[mat-icon-button].mat-warn {
  color: var(--brie-button-base-danger-text);

  &:hover {
    background: var(--brie-button-base-danger-background-hover);

    .mat-icon {
      color: var(--brie-button-base-danger-text);
    }
  }

  &:disabled {
    background: var(--brie-button-base-background-disabled);
  }
}

button[mat-flat-button], button[mat-flat-button].mat-primary {
  background: var(--brie-button-flat-background);
  color: var(--brie-button-flat-text);
  font: var(--brie-button-text-font);

  &:hover {
    background: var(--brie-button-flat-background-hover);

    .mat-icon {
      color: var(--brie-button-flat-text);
    }
  }

  &:active {
    background: var(--brie-button-flat-background-pressed);
  }

  &:disabled {
    background: var(--brie-button-flat-background-disabled);
    color: var(--brie-button-flat-text-disabled);
  }
}

button[mat-flat-button].mat-warn {
  background: var(--brie-button-flat-danger-background);
  color: var(--brie-button-flat-danger-text);

  &:hover {
    background: var(--brie-button-flat-danger-background-hover);

    .mat-icon {
      color: var(--brie-button-flat-danger-text);
    }
  }

  &:active {
    background: var(--brie-button-flat-danger-background-pressed);
  }

  &:disabled {
    background: var(--brie-button-flat-danger-background-disabled);
    color: var(--brie-button-flat-danger-text-disabled);
  }
}

button[mat-stroked-button], button[mat-stroked-button].mat-primary, button.mat-mdc-outlined-button:not(:disabled) {
  background: var(--brie-button-stroked-background);
  border-color: var(--brie-button-stroked-border);
  color: var(--brie-button-stroked-text);
  font: var(--brie-button-text-font);

  .mat-icon {
    color: var(--brie-button-stroked-text);
  }

  &:hover {
    background: var(--brie-button-stroked-background-hover);
    border-color: var(--brie-button-stroked-border-hover);

    .mat-icon {
      color: var(--brie-button-stroked-text);
    }
  }

  &:active {
    background: var(--brie-button-stroked-background-pressed);
    border-color: var(--brie-button-stroked-border-pressed);
  }

  &:disabled {
    background: var(--brie-button-stroked-background-disabled);
    border-color: var(--brie-button-stroked-border-disabled);
    color: var(--brie-button-stroked-text-disabled);
  }
}

button[mat-stroked-button].mat-warn {
  background: var(--brie-button-stroked-danger-background);
  color: var(--brie-button-stroked-danger-text);
  border-color: var(--brie-button-stroked-danger-border);

  &:hover {
    background: var(--brie-button-stroked-danger-background);
    border-color: var(--brie-button-stroked-danger-border-hover);

    .mat-icon {
      color: var(--brie-button-stroked-danger-text);
    }
  }

  &:active {
    background: var(--brie-button-stroked-danger-background-pressed);
    border-color: var(--brie-button-stroked-danger-border-pressed);
  }

  &:disabled {
    background: var(--brie-button-stroked-danger-background-disabled);
    border-color: var(--brie-button-stroked-danger-border-disabled);
    color: var(--brie-button-stroked-danger-text-disabled);
  }
}

button[mat-stroked-button].mat-accent {
  border-color: var(--brie-orange-500);
}