@charset "utf-8";

/** 
 * @author dfgm
 */

/* 특정 클래스가 지정된 링크에 대한 스타일 */
.special-link,
.special-link2 {
	text-decoration: none;
	/* 밑줄 제거 */
	padding: 5px 10px;
	display: inline-flex;
	/* inline-flex로 변경 */
	align-items: center;
	/* 수직 가운데 정렬 */
	justify-content: center;
	/* 수평 가운데 정렬 */
	margin: 10px;
	border: 5px solid transparent;
	/* 초기에는 투명한 테두리로 설정 */
	transition: border-color 0.3s;
	/* 테두리 색상 변화에 대한 트랜지션 효과 */
}

/* 특정 클래스가 지정된 링크에 클릭 시 테두리 색상 변경 및 유지 */
.special-link.clicked,
.special-link:active,
.special-link2.clicked,
.special-link2:active {
	border-color: #0000FF !important;
	/* 클릭 시 및 포커스 시 테두리 색상 변경 (파란색) */
}

.custom-toast {
	display: flex;
	align-items: center;
	width: 350px;
	/* 이미지 크기에 맞게 조절 */
	margin-bottom: 10px;
}

.toast-img {
	max-width: 50px;
	/* border-radius: 50%; /* 원형 이미지 모양 */
	margin-right: 10px;
}

.captcha {
	border: 2px solid #000;
	/* 테두리 두께와 색상 설정 */
	padding: 5px;
	/* 이미지 주위에 여백 추가 */
}

/* 추가된 CSS */
body {
	padding-top: 56px;
	/* 네비게이션 바의 높이만큼 추가 패딩 */
}

.navbar {
	z-index: 1000;
	/* 다른 요소보다 위에 표시되도록 높은 z-index 값 설정 */
}

.navbar-custom {
	background-color: #000000;
	/* 배경색을 원하는 색상으로 지정 */

	/* 프로필 사진을 동그라미로 렌더링하는 스타일 */
	.profile-picture {
		width: 20px;
		height: 20px;
		border-radius: 50%;
		/* 동그라미 모양으로 만들기 */
		object-fit: cover;
		/* 이미지가 동그라미 모양에 맞게 잘리도록 설정 */
	}
}

.toast-success {
	background-color: #198754 !important;
}

.toast-info {
	background-color: #DC3545 !important;
}

.toast-error {
	background-color: #007bff !important;
}

/* edit_groups.php css */
#sortable-list .card {
	transition: opacity 0.3s ease-in-out;
}

#sortable-list .card.dragging {
	opacity: 0.5;
}

.help-box {
	background-color: #f0f0f0;
	padding: 10px;
	border-radius: 5px;
	margin-top: 20px;
}

.card-body {
	padding: 30px;
}
.card-text {
	margin-bottom: 10px;
}

.card-title {
	font-size: 24px;
	cursor: grab; /* 일반적인 드래그 */
}

.card-title:active {
	cursor: grabbing; /* 드래그 중일 때 */
}

.list-group-item {
	cursor: grab;
}

.help {
	cursor: pointer;
}

.help:hover {
	cursor: help;
}

.clear {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

.list-group-item a.link-click,
.list-group-item button.delete-btn {
	pointer-events: auto;
}

.container {
	padding: 10px;
	max-width: 1200px; /* 컨텐츠 최대 너비 설정 */
	margin: 0 auto; /* 중앙 정렬 */
}
.card {
	border: none;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	transition: box-shadow 0.3s ease;
}
.card:hover {
	box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

#editButton {
	margin-top: 20px;
}

.dropdown-menu a.dropdown-item {
	cursor: pointer;
}
.dropdown-menu-right {
	right: 0;
	left: auto;
}

#randomString {
	user-select: none; /* 드래그 및 복사 방지 */
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	border: 2px solid #ccc; /* 테두리 추가 */
	padding: 10px; /* 내부 여백 추가 */
	display: inline-block; /* 인라인 요소로 표시 */
}

@media (min-width: 768px) and (max-width: 991.98px) {
	.nav-item.d-md-inline {
		display: none !important;
	}
}