@media screen and (max-width: 768px) {

  .FormOverView {
    width: 100% !important;
    max-width: 100% !important;
    padding: 10px !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
  }

  .FormOverView * {
    box-sizing: border-box !important;
    min-width: 0 !important;
  }


  ::ng-deep gb-newpicklist,
  ::ng-deep gb-input,
  ::ng-deep gb-date {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  ::ng-deep .mat-mdc-form-field,
  ::ng-deep .mat-mdc-text-field-wrapper,
  ::ng-deep .mat-mdc-form-field-flex,
  ::ng-deep .mdc-text-field,
  ::ng-deep input,
  ::ng-deep select {
    width: 100% !important;
    max-width: 100% !important;
  }


  ::ng-deep gb-formgrid {
    display: block !important;
    width: 100% !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  ::ng-deep gb-formgrid > *:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  ::ng-deep gb-formgrid > div,
  ::ng-deep gb-formgrid > div > div {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
  }

  ::ng-deep gb-formgrid th:empty,
  ::ng-deep gb-formgrid td:empty {
    display: none !important;
    width: 0 !important;
    padding: 0 !important;
  }

  .FormOverView > gb-newpicklist:last-of-type,
  ::ng-deep .FormOverView gb-newpicklist .mat-mdc-form-field-subscript-wrapper {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  ::ng-deep gb-formgrid table {
    width: 100% !important;
    min-width: 350px !important;
    table-layout: fixed !important;
    border-spacing: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border-collapse: collapse !important;
  }

  ::ng-deep gb-formgrid thead,
  ::ng-deep gb-formgrid tbody,
  ::ng-deep gb-formgrid tr {
    margin: 0 !important;
    padding: 0 !important;
  }

  ::ng-deep gb-formgrid th:first-child,
  ::ng-deep gb-formgrid td:first-child {
    width: 35px !important;
    min-width: 35px !important;
    max-width: 35px !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
    text-align: center !important;
  }

  ::ng-deep gb-formgrid th:nth-child(2),
  ::ng-deep gb-formgrid td:nth-child(2) {
    width: auto !important;
    min-width: 150px !important;
  }

  ::ng-deep gb-formgrid td:nth-child(2) gb-newpicklist,
  ::ng-deep gb-formgrid td:nth-child(2) .mat-mdc-form-field,
  ::ng-deep gb-formgrid td:nth-child(2) input,
  ::ng-deep gb-formgrid td:nth-child(2) select {
    width: 100% !important;
    min-width: unset !important;
    max-width: 100% !important;
  }

  ::ng-deep gb-formgrid th:last-child,
  ::ng-deep gb-formgrid td:last-child {
    position: static !important;
    right: auto !important;
    left: auto !important;
    width: 50px !important;
    min-width: 50px !important;
    max-width: 50px !important;
    text-align: center !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  ::ng-deep gb-formgrid .sticky,
  ::ng-deep gb-formgrid .sticky-column,
  ::ng-deep gb-formgrid [class*="sticky"] {
    position: static !important;
    left: auto !important;
    right: auto !important;
  }

  ::ng-deep gb-formgrid button {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
    padding: 0 !important;
  }
}


@media screen and (min-width: 481px) and (max-width: 768px) {

  .FormOverView > div:first-child {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
  }

  .FormOverView > div:first-child > gb-newpicklist {
    flex: 1 !important;
  }

  .automanual {
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    padding: 0 !important;
  }

  .FormOverView > div[style*="display: flex"] {
    display: flex !important;
    gap: 10px !important;
  }

  .FormOverView > div[style*="display: flex"] gb-date {
    flex: 1 !important;
  }
}

@media screen and (max-width: 480px) {

  .FormOverView {
    padding: 8px !important;
  }

  .FormOverView > div:first-child {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
  }

  .FormOverView > div:first-child > gb-newpicklist {
    flex: 1 !important;
  }

  .automanual {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    padding: 0 !important;
  }

  .automanual span {
    font-size: 12px !important;
  }

  .FormOverView > div[style*="display: flex"] {
    flex-direction: column !important;
    gap: 10px !important;
  }

  .FormOverView > div[style*="display: flex"] gb-date {
    width: 100% !important;
  }

  ::ng-deep gb-formgrid table {
    min-width: 300px !important;
  }

  ::ng-deep gb-formgrid th:nth-child(2),
  ::ng-deep gb-formgrid td:nth-child(2) {
    min-width: 120px !important;
    width: auto !important;
  }
}