@use '@angular/material' as mat;
@use 'sass:math' as math;
@import 'constants';


@mixin theme-font($typography) {
  &.small {
    .mat-header-cell {
      font-weight: 700;
    }
    .mr-4 {
      margin-right: 1rem !important;
    }
    .mat-menu-item, .mat-tree .mat-tree-node, .mat-tree .mat-nested-tree-node-parent {
      min-height: $tree-node-height * 0.7;
      height: $tree-node-height * 0.7;
    }
    .mat-primary .mat-select-panel .mat-option.mat-selected:not(.mat-option-multiple),
    .mat-primary .mat-option.mat-selected:not(.mat-option-multiple):not(.mat-option-disabled) {
      font-size: $small-font-size * 1.1;
    }
    .genseed-message, .validation-error-message .validation-error-icon.mat-icon, .fa-icon-small, .top-icon-small {
      font-size: $small-font-size * 1.2;
    }
    .page-title-container, .page-sub-title-container {
      font-size: $small-font-size * 1.1;
    }
    .mat-icon-button .top-toolbar-icon.icon-pinned, .mat-step-header .mat-step-icon .mat-icon {
      padding-top: 1rem;
    }
    .top-toolbar-icon .top-toolbar-img, .sidenav-img svg {
      width: $small-font-size * 1.8; 
      height: $small-font-size * 1.8;
      font-size: 1.5rem;
    }
    .horizontal-button .sidenav-img svg {
      width: $small-font-size * 2.1; 
      height: $small-font-size * 2.1;
      font-size: 2.2rem;
    }
    .material-icons, .modal-info-header {
      font-size: $small-font-size * 1.5;
      line-height: 2rem;
    }
    .mat-expansion-panel-header, .mat-menu-item, .mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-option, .mat-select, .mat-selection-list .mat-list-item {
      font-size: $small-font-size !important;
    }
    .logo {
      font-size: $small-font-size * 2;
    }
    .font-60-percent {
      font-size: $small-font-size * 0.6;
    }
    .fa-icon-regular {
      font-size: $small-font-size * 1.75;
    }
    .icon-large {
      font-size: $small-font-size * 5;
    }
    .icon-small {
      font-size: $small-font-size * 1.5 !important;
    }
    .icon-smaller {
      font-size: $small-font-size * 0.75 !important;
    }
    .size-triple {
      font-size: $small-font-size * 3;
    }
    .mat-icon-36 {
      font-size: $small-font-size * 2;
    }
    .btn-close-x {
      font-size: $small-font-size * 1.5;
      font-weight: 600;
      min-width: 3.6rem;
      max-width: 3.6rem;
    }
  }
  &.medium {
    .mat-header-cell {
      font-weight: 700;
    }
    .mat-tree .mat-tree-node, .mat-tree .mat-nested-tree-node-parent {
      min-height: $tree-node-height;
      height: $tree-node-height;
    }
    .mat-primary .mat-select-panel .mat-option.mat-selected:not(.mat-option-multiple),
    .mat-primary .mat-option.mat-selected:not(.mat-option-multiple):not(.mat-option-disabled) {
      font-size: $medium-font-size * 1.1;
    }
    .genseed-message, .validation-error-message .validation-error-icon.mat-icon {
      font-size: $medium-font-size * 1.2;
    }
    .page-title-container, .page-sub-title-container {
      font-size: $medium-font-size * 1.1;
    }
    .fa-icon-small, .top-icon-small {
      font-size: $medium-font-size * 1.2;
    }
    .modal-info-header {
      font-size: $medium-font-size * 1.3;
      padding: $gap $gap * 2 $gap $gap * 2 !important;
      @include for_screensize(tab-port) {
        padding: math.div($gap, 2) math.div($gap, 2) math.div($gap, 2) $gap !important;
      }
      @include for_screensize(phone) {
        padding: math.div($gap, 4) !important;
      }
    }
    .top-toolbar-icon.icon-pinned {
      font-size: $medium-font-size * 1.3;
    }
    .top-toolbar-icon .top-toolbar-img, .sidenav-img svg {
      width: $medium-font-size * 1.8; 
      height: $medium-font-size * 1.8;
      font-size: $medium-font-size * 1.3;
    }
    .horizontal-button .sidenav-img svg {
      width: $medium-font-size * 2.2; 
      height: $medium-font-size * 2.2;
      font-size: 2.5rem;
    }
    .material-icons {
      font-size: $medium-font-size * 2;
      &.info-icon {
        font-size: $medium-font-size;
        margin: 0 2px;
        width: $medium-font-size;
        height: $medium-font-size;
      }
    }
    .material-icons.mat-icon.small-icon {
      font-size: $medium-font-size * 1.2;
    }
    .mat-step-header .mat-step-icon .mat-icon {
      font-size: initial;
    }
    .mat-expansion-panel-header, .mat-menu-item, .mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-option, .mat-select, .mat-selection-list .mat-list-item {
      font-size: $medium-font-size !important;
    }
    .logo {
      font-size: $medium-font-size * 2;
    }
    .font-60-percent {
      font-size: $medium-font-size * 0.6;
    }
    .fa-icon-regular {
      font-size: $medium-font-size * 1.75;
    }
    .icon-large {
      font-size: $medium-font-size * 5;
    }
    .icon-small {
      font-size: $medium-font-size * 1.5 !important;
    }
    .icon-smaller {
      font-size: $medium-font-size * 0.75 !important;
    }
    .size-triple {
      font-size: $medium-font-size * 3;
    }
    .mat-icon-36 {
      font-size: $medium-font-size * 2;
    }
    .btn-close-x {
      font-size: $medium-font-size * 1.5;
      font-weight: 600;
      min-width: 3.6rem;
      max-width: 3.6rem;
    }
  }
  &.large {
    .mat-header-cell {
      font-weight: 800;
    }
    .mat-tree .mat-tree-node, .mat-tree .mat-nested-tree-node-parent {
      height: $tree-node-height;
    }
    .mat-primary .mat-select-panel .mat-option.mat-selected:not(.mat-option-multiple),
    .mat-primary .mat-option.mat-selected:not(.mat-option-multiple):not(.mat-option-disabled) {
      font-size: $large-font-size * 1.1;
    }
    .genseed-message, .validation-error-message .validation-error-icon.mat-icon {
      font-size: $large-font-size * 1.2;
    }
    .page-title-container, .page-sub-title-container {
      margin-top: 0.5rem;
      font-size: $large-font-size * 1.1;
    }
    .fa-icon-small, .top-icon-small, .modal-info-header {
      font-size: $large-font-size * 1.2;
    }
    .top-toolbar-icon.icon-pinned, .mat-step-header .mat-step-icon .mat-icon {
      font-size: $large-font-size * 1.25;
    }
    .top-toolbar-icon .top-toolbar-img, .sidenav-img svg {
      width: $large-font-size * 2; 
      height: $large-font-size * 2;
      font-size: $large-font-size * 1.25;
    }
    .horizontal-button .sidenav-img svg {
      width: $large-font-size * 2.25; 
      height: $large-font-size * 2.25;
      font-size: $large-font-size * 2;
    }
    .material-icons {
      font-size: $large-font-size * 2.5;
    }
    .mat-expansion-panel-header, .mat-menu-item, .mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-option, .mat-select, .mat-selection-list .mat-list-item {
      font-size: $large-font-size !important;
    }
    .logo {
      font-size: $large-font-size * 2;
    }
    .font-60-percent {
      font-size: $large-font-size * 0.6;
    }
    .fa-icon-regular {
      font-size: $large-font-size * 1.75;
    }
    .icon-large {
      font-size: $large-font-size * 5;
    }
    .icon-small {
      font-size: $large-font-size * 1.5 !important;
    }
    .icon-smaller {
      font-size: $large-font-size * 0.75 !important;
    }
    .size-triple {
      font-size: $large-font-size * 3;
    }
    .mat-icon-36 {
      font-size: $large-font-size * 2;
    }
    .btn-close-x {
      font-size: $large-font-size * 1.5;
      font-weight: 600;
      min-width: 3.6rem;
      max-width: 3.6rem;
    }
  }

  .mat-icon.material-icons:focus {
    outline: none;
  }

  .mat-flat-button.mat-primary:focus, .mat-flat-button.mat-primary:hover {
    @include mat.elevation(2);
  }

  .mat-flat-button.mat-primary:disabled {
    cursor: not-allowed;
  }

}
