@charset "utf-8";

@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css");

/* ==========================================================================
   Bootstrap 5.3.8 & HOMER Theme 전용 커스텀 CSS 변수 및 기본 태그 오버라이딩
   ========================================================================== */

:root {
	font-size: 14px; /* 백오피스 기본 16px 대비 약 87.5% 비례 스케일링 적용 */

	/* 폰트 시스템 (Pretendard) */
	--bs-font-sans-serif: 'Pretendard Variable', var(--bs-font-sans-serif);

	/* 슬레이트 톤 프리미엄 컬버스킴 및 테두리/그림자 전역 오버라이드 */
	--bs-body-bg: #e9ecef;                          /* Slate-50 백오피스 프리미엄 배경 */
	--bs-body-color: #334155;                       /* Slate-700 본문 색상 */
	--bs-border-color: #e2e8f0;                     /* Slate-200 정교한 경계선 */
	--bs-border-color-translucent: rgba(15, 23, 42, 0.06);
	--bs-box-shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.04), 0 1px 2px rgba(15, 23, 42, 0.02);

	/* 테두리 곡률(Border Radius) 전역 CSS 변수 오버라이드 */
	--bs-border-radius: 0.5rem;                     /* 기본 요소(8px 곡률) */
	--bs-border-radius-sm: 0.375rem;                /* sm 요소(form-control-sm, btn-sm 등 6px 곡률) */
	--bs-border-radius-lg: 0.75rem;                 /* lg 요소(12px 곡률) */
	--bs-border-radius-xl: 1rem;                    /* xl 요소(16px 곡률) */
	--bs-border-radius-2xl: 1.5rem;                 /* 2xl 요소(24px 곡률) */
}

.h1, .h2, .h3, .h4, .h5, .h6,
h1, h2, h3, h4, h5, h6 {
	font-weight: 600;
}

i[class*="bi-"],
i[class*="fa-"] {
	margin-right: .375em;
	display: inline-block;
	vertical-align: middle;
}

i[class*="bi-"]:first-child:last-child,
i[class*="fa-"]:first-child:last-child {
	margin-right: 0;
}


/* ==========================================================================
   1. 폼 요소(Input, Select, Form Control, Label) 전역 오버라이딩
   ========================================================================== */
.form-control,
.form-select {
	--bs-border-color: #cbd5e1;
	background-color: #ffffff;
	border-color: var(--bs-border-color);
	color: #1e293b;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.form-control:focus,
.form-select:focus {
	background-color: #ffffff;
	border-color: #2f6fed;
	box-shadow: 0 0 0 0.2rem rgba(47, 111, 237, 0.18);
}

.form-control::placeholder {
	color: #94a3b8;
	opacity: 1;
	transition: opacity 0.2s ease-in-out, color 0.2s ease-in-out;
}

.form-control:focus::placeholder {
	opacity: 0.3;
}

.form-control[readonly],
.form-control[disabled],
.form-select[disabled] {
	background-color: #e9ecef !important;
	border-color: #dee2e6 !important;
	color: #6c757d !important;
	cursor: not-allowed;
	opacity: 0.85;
}

.form-label {
	color: rgba(var(--bs-dark-rgb), var(--bs-text-opacity, 1));
	font-size: 0.9rem;
	font-weight: 600;
}

.form-check-input {
	--bs-border-color: #cbd5e1;
}

/* ==========================================================================
   2. 카드(Card) 컴포넌트 변수 오버라이딩
   ========================================================================== */
.card {
	--bs-card-bg: #ffffff;                          /* 카드 배경색 순백색(#fff) 지정 */
	--bs-card-cap-bg: #ffffff;                          /* 카드 배경색 순백색(#fff) 지정 */
	--bs-card-border-radius: 0.75rem;               /* 12px 프리미엄 카드 곡률 (기존 6px 오버라이드) */
	box-shadow: var(--bs-box-shadow-sm);
}

/* ==========================================================================
   3. 테이블(Table) 컴포넌트 오버라이딩
   ========================================================================== */
.table {
	--bs-table-bg: #ffffff;
	--bs-table-color: #334155;
	--bs-table-border-color: #f1f5f9;
	line-height: 1.4;
	vertical-align: middle;
	margin-bottom: 0;
	white-space: nowrap;
}

.table thead {
	border-top: 1px solid var(--bs-table-border-color);
}

.table thead th {
	font-size: 0.9rem;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	background-color: #f8fafc !important;
	border-bottom: 1px solid #e2e8f0 !important;
}

/* ==========================================================================
   4. 상태 뱃지(Badge) 도트 표시 가상 요소 및 텍스트 고대비 오버라이딩
   ========================================================================== */
.badge {
     --bs-badge-font-size: 0.8em;
}

.badge[class*="-subtle"] {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.35em 0.65em;
	font-weight: 600;
	border-radius: 50rem;
}

/* 상태 뱃지 공통 도트 가상 요소 */
.badge[class*="-subtle"]::before {
	content: '';
	display: inline-block;
	width: 6px;
	height: 6px;
	border-radius: 50%;
}

/* 상태별 텍스트 색상 및 도트 포인트 색상 (Bootstrap 표준 CSS 변수 연동) */
.badge.bg-success-subtle {
	color: var(--bs-success-text-emphasis);
}
.badge.bg-success-subtle::before {
	background-color: var(--bs-success);
}

.badge.bg-warning-subtle {
	color: var(--bs-warning-text-emphasis);
}
.badge.bg-warning-subtle::before {
	background-color: var(--bs-warning);
}

.badge.bg-danger-subtle {
	color: var(--bs-danger-text-emphasis);
}
.badge.bg-danger-subtle::before {
	background-color: var(--bs-danger);
}

.badge.bg-secondary-subtle {
	color: var(--bs-secondary-text-emphasis);
}
.badge.bg-secondary-subtle::before {
	background-color: var(--bs-secondary);
}

.badge.bg-info-subtle {
	color: var(--bs-info-text-emphasis);
}
.badge.bg-info-subtle::before {
	background-color: var(--bs-info);
}

.badge.bg-primary-subtle {
	color: var(--bs-primary-text-emphasis);
}
.badge.bg-primary-subtle::before {
	background-color: var(--bs-primary);
}

/* ==========================================================================
   5. 페이지네이션(Pagination) 오버라이딩
   ========================================================================== */
.page-link {
	--bs-pagination-font-size: 0.85rem;   /* 폰트 크기 축소 (기존 1rem -> 0.85rem) */
	--bs-pagination-padding-y: 0.3rem;    /* 위아래 여백 축소 */
	--bs-pagination-padding-x: 0.4rem;    /* 좌우 여백 축소로 완벽한 정원 연출 */
	min-width: calc(
				var(--bs-pagination-font-size) * 1.5
				+ var(--bs-pagination-padding-y) * 2
				+ var(--bs-pagination-border-width) * 2
			);
	text-align: center;
	margin-left: calc(var(--bs-pagination-font-size) * .2) !important;
	margin-right: calc(var(--bs-pagination-font-size) * .2) !important;
	border-radius: 50rem !important;
}

/* ==========================================================================
   6. 모달(Modal) 전역 테마 및 스타일 오버라이딩
   ========================================================================== */
.modal-content {
	--bs-modal-bg: #ffffff;
	--bs-modal-border-color: var(--bs-border-color);
	--bs-modal-border-radius: 0.75rem;
	--bs-modal-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
	--bs-modal-body-bg: var(--bs-tertiary-bg, #f8fafc);
	border: 0;
	overflow: hidden;
	box-shadow: var(--bs-modal-box-shadow);
}

.modal-header {
	--bs-modal-header-bg: #212330;
	--bs-modal-header-color: #ffffff;
	--bs-modal-header-border-color: rgba(255, 255, 255, 0.1);
	background-color: var(--bs-modal-header-bg);
	color: var(--bs-modal-header-color);
	border-bottom: 1px solid var(--bs-modal-header-border-color);
}

.modal-header-sm {
	--bs-modal-header-padding: 0.5rem 1rem;
	padding: var(--bs-modal-header-padding);
}

.modal-header .btn-close {
	filter: invert(1) grayscale(100%) brightness(200%);
}

.modal-body {
	background-color: var(--bs-modal-body-bg, var(--bs-tertiary-bg, #f8fafc));
}

.modal-footer {
	--bs-modal-footer-border-color: var(--bs-border-color);
}

.modal-footer-sm {
	--bs-modal-footer-padding: 0.5rem 1rem;
	padding: var(--bs-modal-footer-padding);
}

/* ==========================================================================
   7. 리스트 그룹(List Group) 전역 오버라이딩
   ========================================================================== */
.list-group {
	--bs-list-group-bg: transparent;
	--bs-list-group-border-color: var(--bs-border-color);
}

.list-group-item {
	background-color: var(--bs-list-group-bg);
}