@import url('./../../../../../projects/gbhost/public/gbstyle/gbcommonstyle.scss');
.labelFocused{
  color: var(--action-primary-default);
  transition: .4s ease-in-out;
}

.underline {
  position: relative;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  transition: width 0.3s ease;
}

.combobox_Form_Field{
  display: block;
  height: 76px !important;
}

.form_combobox:focus +.underlinewidth .underline {
  width: 100%;
}

::ng-deep.mat-mdc-select-value-text{
  color: var(--field-text-default) !important;
}

::ng-deep .mat-mdc-select-disabled{
  color: var(--field-text-default) !important;
}

::ng-deep .mat-mdc-select-arrow svg path {
  fill: var(--field-text-default) !important;
}
  
::ng-deep .mat-mdc-select-arrow svg{
  fill: var(--field-text-default) !important;
}

::ng-deep .hide-arrow .mat-mdc-select-arrow {
  display: none !important;  /* Hides the arrow */
}

::ng-deep .hide-arrow .mat-mdc-select-trigger {
  pointer-events: none !important;  /* Prevents user interaction */
}
:host ::ng-deep .custom-select-height.mat-mdc-form-field-type-mat-select 
.mat-mdc-text-field-wrapper {
  height: 36px !important;

}
::ng-deep .Mat_Form_Field.no-border-combobox {
  .mdc-text-field {
    border: none !important;
    background: #FFFFFF !important;
  }

  .mdc-text-field--outlined .mdc-notched-outline {
    display: none !important;
  }

  .mdc-text-field--filled::before {
    display: none !important;
  }

  // .mat-mdc-select-value,
  // .mat-mdc-select-value-text,
  // .mat-mdc-select-trigger {
  //   color: #F5A623 !important;
  // }

  // .mdc-text-field__input {
  //   color: #F5A623 !important;
  // }
}

/* Readonly mode — gray background, no focus highlight */
::ng-deep .Mat_Form_Field.readonly-field .mat-mdc-text-field-wrapper {
  background-color: var(--field-bg-readonly, #f0f0f0) !important;
  cursor: default;
}

::ng-deep .Mat_Form_Field.readonly-field .mat-mdc-select-value-text {
  color: var(--field-text-readonly, #757575) !important;
}

::ng-deep .Mat_Form_Field.readonly-field.mat-mdc-form-field.mat-focused .mat-mdc-text-field-wrapper {
  border: 1px solid var(--mat-form-field-outlined-idle-border-color, rgba(0, 0, 0, 0.38)) !important;
}

::ng-deep .mat-mdc-select-panel {
  background-color: var(--bg-surface) !important;
}

::ng-deep .mat-mdc-option .mdc-list-item__primary-text {
  color: var(--text-primary) !important;
}

::ng-deep .mat-mdc-select-panel-above div.mat-mdc-select-panel {
  border-top-left-radius: 12px !important;
  border-top-right-radius: 12px !important;
  border-radius: 12px !important;
}

::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{
  border-top-left-radius: 12px !important;
  border-top-right-radius: 12px !important;
  border-radius: 12px !important;
}
::ng-deep .mat-mdc-option:hover:not(.mdc-list-item--disabled){
  background-color: var(--bg-hover) !important;
  margin: 0px 8px;
  border-radius: 8px;
  padding-left: 8px;
}

::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled):not(.mat-mdc-option-multiple){
  background-color: var(--bg-hover) !important;
  margin: 4px 8px;
  border-radius: 8px;
  padding-left: 9px;
}

::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled):not(.mat-mdc-option-multiple) .mdc-list-item__primary-text{
  color:var(--text-primary) !important;
}

::ng-deep .mat-pseudo-checkbox-checked::after {
  color: var(--field-text-default) !important;
}

::ng-deep .mat-mdc-option.mdc-list-item--selected{
  background-color: var(--button-primary-bg-disabled) !important;
  margin: 4px 8px;
  border-radius: 8px;
  color: var(--text-primary) !important;
}