/* ===== 로그인 페이지 로고 크기 =====
   원본 이미지 비율 365 x 115 를 유지한 채 배율만 조절한다.
   숫자만 키우거나 줄이면 됨

   ★ 어드민에 로고를 업로드한 테넌트는 <img class="*_dynamic"> 가 렌더되고,
     .img_png_logo / .login-bottom-logo 는 미업로드일 때만 나오는 v-else 폴백이다.
     그래서 두 쪽을 같이 잡아야 실제 화면에 적용된다. */
:root{
  --login-logo-scale: 0.8 !important;          /* 상단 로고 - PC */
  --login-bottom-logo-scale: 0.5 !important;   /* 하단 로고 - PC */
  /* 하단 로고 위치 (좌/상 기준 여백). 음수도 가능 — 왼쪽/위로 더 당길 때 */
  --login-bottom-logo-left: 20px !important;   /* 하단 로고 좌측 여백 - PC */
  --login-bottom-logo-top: 12px !important;    /* 하단 로고 상단 여백 - PC */
}
@media (max-width: 991.98px){
  :root{
    --login-logo-scale: 0.6 !important;        /* 상단 로고 - 모바일 */
    --login-bottom-logo-scale: 0.4 !important; /* 하단 로고 - 모바일 */
    --login-bottom-logo-left: 16px !important; /* 하단 로고 좌측 여백 - 모바일 */
    --login-bottom-logo-top: 16px !important;  /* 하단 로고 상단 여백 - 모바일 */
  }
}
/* 상단 로고 : 업로드 이미지(img) + 폴백(div) */
.img_png_logo_dynamic,
.img_png_logo{
  width: calc(365px * var(--login-logo-scale)) !important;
  height: calc(115px * var(--login-logo-scale)) !important;
  object-fit: contain !important;   /* 비율 다른 로고를 넣어도 안 찌그러지게 */
}
/* 하단 로고 : 업로드 이미지(img) + 폴백(div) */
.login-bottom-logo-dynamic,
.login-bottom-logo{
  width: calc(365px * var(--login-bottom-logo-scale)) !important;
  height: calc(115px * var(--login-bottom-logo-scale)) !important;
  object-fit: contain !important;
  margin-left: var(--login-bottom-logo-left) !important;
  margin-top: var(--login-bottom-logo-top) !important;
  margin-bottom: 0 !important;
}

/* ===== 하단 로고 x축 중앙 정렬 =====
   좌측 여백(--login-bottom-logo-left)으로 맞추는 대신, 흐름에서 빼내 컨테이너 정중앙에 고정한다.
   메신저 표시 여부와 무관하게 항상 정확히 가운데 (여백값 재계산 불필요).
   → 원래의 좌측 정렬로 되돌리려면 이 블록만 통째로 지우면 된다.
   세로 위치는 위의 --login-bottom-logo-top 이 그대로 먹는다. */
.login_area_bottom .spots-flex{
  position: relative !important;
}
.login_area_bottom .login-bottom-logo-dynamic,
.login_area_bottom .login-bottom-logo{
  position: absolute !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}