@keyframes game-market-printers-view-rotate-animation {
  100% {
    rotate: 360deg;
  }
}


#game-market-printers-view {
  width: 100%;
  max-width: 44rem;
  min-height: 28rem;
  max-height: min(100lvh - 0.8rem);

  &[shown] {
    transition: none;
  }

  @media (width >= 680px) and (height >= 500px) {
    &:not([hidden]) {
      border-radius: var(--sheet-border-radius);
      translate: 0% calc((100vh - 100%) / -2);
    }
  }


  > header {
    [action="reload"] {
      &[disabled] {
        animation: game-market-printers-view-rotate-animation 1.2s linear infinite;
      }
    }
  }


  > main {
    padding-bottom: env(safe-area-inset-bottom);


    .title {
      margin-top: 0.8rem;
      padding-inline: 0.8rem;
    }


    .printer {
      padding-block: 0.4rem;
      padding-inline: 0.8rem;
      display: flex;
      align-items: center;
      gap: 0.8rem;


      svg {
        aspect-ratio: 1 / 1;
        width: 2.8rem;
        height: auto;
      }


      .labels {
        flex: 1 1;
        display: flex;
        flex-direction: column;
        gap: 0.8rem;


        span {
          &:empty {
            display: none;
          }

          &.device-name {
            font-size: 1.3rem;
          }
        }
      }


      .actions {

      }
    }
  }
}
