@use '@inside-library/styles/mixins/partials/common-mixin' as *;

.socials-homepage-container {
  width: 49%;
  margin-left: auto;
  padding: var(--spacing-xl) var(--spacing-xxl);
  background-image: url('../../assets/img/sumo-corner.png');
  background-position: bottom right;
  background-repeat: no-repeat;
  border: var(--border-default);

  @include mobile {
    width: 100%;
    margin-left: 0;
  }

  .social-items-container {
    display: flex;

    .social-item {
      display: flex;
      justify-content: center;
      align-items: center;
      flex-shrink: 0;
      width: 53px;
      height: 53px;
      border-radius: var(--radius-xl);

      @include tablet {
        width: 40px;
        height: 40px;
      }
    }
  }
}
