@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&display=swap");

@import "reset.css";
@import "variables.css";

/* Components */
@import "components/status-bar.css";
@import "components/nav-bar.css";
@import "components/screen-header.css";
@import "components/user-component.css";
@import "components/badge.css";
@import "components/icon-row.css";
@import "components/alt-screen-header.css";
@import "components/mobile.css";
@import "components/tab-menu.css";

/* Screens */
@import "screens/login.css";
@import "screens/friends.css";
@import "screens/find.css";
@import "screens/more.css";
@import "screens/settings.css";
@import "screens/chat/chat.css";
@import "screens/chat/chat-fubuki.css";
@import "screens/chat/chat-coco.css";
@import "screens/chat/chat-gura.css";

body,
html {
  height: 100%;
  margin: 0;
  background-color: var(--blue); /* 배경색으로 --blue 변수 사용 */
  display: flex;
  justify-content: center;
  align-items: center; /* 컨텐츠를 화면 중앙에 배치 */
}

.main-screen {
  padding: 0px var(--horizontal-space);
}

.justify-between {
  justify-content: space-between;
}

.justify-start {
  justify-content: flex-start;
}