/*
 * Copyright (C) 2024 BIRU
 *
 * This file is part of Tenzu.
 *
 * Tenzu is free software: you can redistribute it and/or modify it
 * under the terms of the GNU Affero General Public License as published
 * by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
 * See the GNU Affero General Public License for more details.
 *
 * You should have received a copy of the GNU Affero General Public License
 * along with this program. If not, see <https://www.gnu.org/licenses/>.
 *
 * You can contact BIRU at ask@biru.sh
 *
 */

@use '@angular/material' as mat;

.mat-mdc-select-panel {
  border-style: solid;
  border-color: var(--mat-sys-outline);
  border-width: 1px;
  .mat-mdc-option {
    min-height: 32px;
    padding: 0 12px;
    .mat-pseudo-checkbox-minimal {
    margin-left: 0;
    }
    .mat-icon {
      margin-right: 0;
    }
  }
  .mdc-list-item__primary-text {
    color:  var(--mat-sys-on-primary-container);
  }
  &:hover .mdc-list-item__primary-text {
    color:  var(--mat-sys-on-primary-container);
  }
}
.mat-mdc-form-field.transparent .mat-mdc-select-trigger{
  line-height: 0px;
  .icon {
    width: 24px;
    height: 24px;
    font-size: 24px;
  }
}

@mixin tokens-overrides() {
  @include mat.select-overrides((
    trigger-text-size: var(--mat-sys-body-medium-size),
    trigger-text-line-height: var(--mat-sys-body-medium-line-heigh),
    enabled-trigger-text-color: var(--mat-sys-on-primary-container),
    container-elevation-shadow: var(--mat-sys-level3)
  ));
  .mat-mdc-select-panel {
    @include mat.list-overrides((
      list-item-hover-state-layer-opacity: 0,
      list-item-focus-state-layer-opacity: 0,
    ));
  }
  @include mat.option-overrides((
    label-text-size : var(--mat-sys-body-medium-size),
    label-text-line-height : var(--mat-sys-body-line-heigh),
    label-text-color:  var(--mat-sys-on-primary-container),
    selected-state-layer-color: var(--mat-sys-primary-container),
    selected-state-label-text-color: var(--mat-sys-on-primary-container),
    hover-state-layer-color: var(--mat-sys-primary-container),
    focus-state-layer-color: var(--mat-sys-primary),
  ));
  @include mat.pseudo-checkbox-overrides((
    full-selected-checkmark-color: var(--mat-sys-on-tertiary),
  ));
}