@use "../../../variables/index" as *;


/**
 * device software tab - Component styles
 *
 * Note: Uses $size-* tokens for spacing where applicable.
 *
 * Intentionally hardcoded values:
 * - Component-specific dimensions: Fixed sizes for component layout
 * - Off-grid spacing: Component-specific positioning
 * - Border widths (1px, 2px, 3px): Standard borders
 * - Font-sizes: Typography
 * - Percentages: Layout
 */
c8y-software-device-tab {
  .split-view {
    @media (min-width: $screen-md-min) {
      &--7-5 {
        grid-template-columns: minmax(0, 7fr) minmax(284px, 5fr);
      }
    }
  }

  c8y-installed-software {
    #software-list {
      max-height: calc(100vh - 344px);

      @media (max-width: $screen-xs-max) {
        max-height: calc(100vh - 260px);
      }
    }

    #operation-block ~ #software-list {
      max-height: calc(100vh - 416px);

      @media (max-width: $screen-xs-max) {
        max-height: calc(100vh - 332px);
      }
    }
  }

  c8y-device-software-changes {
    height: 100%;

    #software-changes-list {
      @media (min-width: $screen-md-min) {
        max-height: calc(100vh - 280px);
      }
    }
  }
}