@use 'mixins';

body:has(.container) :global {
  @include mixins.special;
}

.container {
  padding: 100px 0 200px;
  background: no-repeat 0 100px;
}

:root {
  &:global(.dark) {
    .login-form {
      background-color: #434652;
      box-shadow: 0 3px 5px #000;
    }
  }
}

.login-form {
  margin-left: auto;
  padding: 40px 60px;
  width: min(452px, 100%);
  border-radius: 4px;
  background-color: #fefefe;
  box-shadow: 0 0 8px #3c3c3c4a;
}

.title {
  font-size: 20px;
  font-weight: 600;
  margin-top: 16px;
  text-align: center;
}

.content {
  margin-bottom: 20px;
  text-align: center;
}