@charset "utf-8";

/*
 * 농업기술센터 공통 스타일시트
 * 기본 변수 / 폰트 / Reset / 공통 요소
 */

/* ════════════════════════════════════════════════════
   1) 공통 변수
════════════════════════════════════════════════════ */
:root {
	/* Brand */
	--brand:        #4a7c3f;
	--brand-dark:   #3b6311;
	--brand-soft:   #EAF3DE;
	--brand-deep:   #3B6D11;

	/* Text */
	--ink:        #1a1a1a;
	--ink-soft:   #5f5e5a;
	--ink-mute:   #888780;

	/* Background */
	--bg-page:    #f5f4ef;
	--bg-card:    #ffffff;
	--bg-soft:    #f1efe8;

	/* Border */
	--bd:         rgba(0, 0, 0, 0.08);
	--bd-mid:     rgba(0, 0, 0, 0.16);

	/* Status */
	--warn:       #BA7517;
	--warn-soft:  #FAEEDA;
	--warn-deep:  #854F0B;
	--err:        #A32D2D;
	--err-soft:   #FCEBEB;

	/* Layout */
	--header-h:   52px;
	--sidebar-w:  220px;
	--radius:     8px;
	--radius-lg:  12px;

	/* Font */
	--font-base: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, system-ui, 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
	--font-code: 'D2Coding', Consolas, monospace;
}

/* ════════════════════════════════════════════════════
   2) Reset & Base
════════════════════════════════════════════════════ */
* {
	box-sizing: border-box;
}

html,
body {
	margin: 0;
	padding: 0;
	min-height: 100vh;
	font-family: var(--font-base);
	font-size: 14px;
	line-height: 1.5;
	color: var(--ink);
	background: var(--bg-page);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

body {
	word-break: keep-all;
}

a {
	color: inherit;
	text-decoration: none;
}

a:hover {
	text-decoration: none;
}

ul,
ol {
	margin: 0;
	padding: 0;
	list-style: none;
}

button,
input,
select,
textarea {
	font-family: inherit;
}

button {
	cursor: pointer;
}

img {
	max-width: 100%;
	vertical-align: middle;
	border: 0;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

fieldset {
	margin: 0;
	padding: 0;
	border: 0;
}

legend {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}

/* ════════════════════════════════════════════════════
   3) 공통 유틸
════════════════════════════════════════════════════ */
.clearfix::after {
	display: block;
	clear: both;
	content: "";
}

.blind,
.sr-only {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	margin: -1px !important;
	padding: 0 !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

.text-left {
	text-align: left !important;
}

.text-center {
	text-align: center !important;
}

.text-right {
	text-align: right !important;
}

.text-muted {
	color: var(--ink-mute) !important;
}

/* ════════════════════════════════════════════════════
   4) 공통 버튼 기본형
════════════════════════════════════════════════════ */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 4px;
	padding: 6px 12px;
	font-family: inherit;
	font-size: 12px;
	line-height: 1.4;
	color: var(--ink-soft);
	background: var(--bg-card);
	border: 1px solid var(--bd-mid);
	border-radius: 5px;
	cursor: pointer;
	transition: background .15s, border-color .15s, color .15s, transform .15s;
}

.btn:hover {
	color: var(--ink);
	background: var(--bg-soft);
}

.btn-primary {
	color: #fff;
	font-weight: 500;
	background: var(--brand);
	border-color: var(--brand);
}

.btn-primary:hover {
	color: #fff;
	background: var(--brand-dark);
	border-color: var(--brand-dark);
}

.btn i {
	font-size: 13px;
}

/* ════════════════════════════════════════════════════
   5) 공통 카드 기본형
════════════════════════════════════════════════════ */
.card {
	padding: 14px 16px;
	margin-bottom: 10px;
	background: var(--bg-card);
	border: 1px solid var(--bd);
	border-radius: var(--radius);
}