// Bare input class for forge fields rendered outside <mat-form-field>.
// Resets the native input and applies Material body-large typography so
// inputs inside the forge wrapper match their formly/mat-form-field counterparts.
//
// Apply by adding the class directly to <input> elements in forge templates.
@mixin core() {
  // Adds a small amount of vertical padding to each Material form field (and the forge
  // form-field wrapper, which opts in via .dbx-forge-form-field). Angular Material's
  // dynamic-padding fields reserve no inter-field space on their own. (Migrated from the
  // removed formly core styles; applies to all mat-form-field + forge wrapper fields.)
  .mat-mdc-form-field,
  .dbx-forge-form-field {
    padding: var(--dbx-padding-2) 0;
  }

  // Resets native <input> elements that render inside the forge form-field wrapper
  // (outside a <mat-form-field>) so they match Material body-large typography.
  // Used by pickable filter inputs and searchable text/chip field inputs.
  input.dbx-forge-bare-input {
    border: none;
    outline: none;
    width: 100%;
    background: transparent;
    font-family: var(--mat-sys-body-large-font);
    font-size: var(--mat-sys-body-large-size);
    line-height: var(--mat-sys-body-large-line-height);
    letter-spacing: var(--mat-sys-body-large-tracking);
    padding: 5px 0 3px;

    &::placeholder {
      color: var(--mat-sys-on-surface-variant);
    }
  }

  .dbx-forge {
    // pushes icons in fields like dbxForgeDateTimeField() away from the edge
    .mat-mdc-form-field-icon-prefix {
      padding-left: 4px;
    }

    .mat-mdc-form-field-icon-suffix {
      padding-right: 4px;
    }
  }
}
