/* /css/page_my_common.css */
@charset "utf-8";

#boxMy{
	--my-bg:#f3f4f6;
	--my-box:#fff;
	--my-text:#191c20;
	--my-text-strong:#111827;
	--my-text-muted:#6b7280;
	--my-text-light:#9ca3af;
	--my-border:#e5e7eb;
	--my-border-strong:#d1d5db;
	--my-primary:#2563eb;
	--my-primary-soft:#eff6ff;
	--my-primary-dark:#1d4ed8;
	--my-company:#059669;
	--my-company-soft:#ecfdf5;
	--my-company-dark:#047857;
	--my-danger:#ef4444;
	--my-success:#15803d;
	--my-warning:#c2410c;
	--my-info:#0369a1;
	--my-radius-sm:4px;
	--my-radius-md:.75rem;
	--my-radius-lg:1rem;
	--my-radius-xl:1.5rem;
	--my-radius-pill:999px;
	--my-shadow:0 .25rem 1rem rgba(15,23,42,.04);
	--my-form-height:3rem;
	--my-btn-height:3rem;

	padding:1.25rem 0 2rem;
	background:var(--my-bg);
	color:var(--my-text);
	font-size:1rem;
	line-height:1.5;
}

#boxMy.is-general{
	--my-theme:var(--my-primary);
	--my-theme-soft:var(--my-primary-soft);
	--my-theme-dark:var(--my-primary-dark);
}

#boxMy.is-company{
	--my-theme:var(--my-company);
	--my-theme-soft:var(--my-company-soft);
	--my-theme-dark:var(--my-company-dark);
}

#boxMy *,
#boxMy *::before,
#boxMy *::after{
	box-sizing:border-box;
}

#boxMy a{
	text-decoration:none;
}

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

#boxMy .contain{
	width:100%;
	margin:0 auto;
	padding:0 1rem;
}

#boxMy .my-layout{
	display:flex;
	flex-direction:column;
	width:100%;
}

#boxMy .my-content{
	order:1;
	width:100%;
	min-width:0;
}

#boxMy .my-side{
	display:block;
	order:2;
	margin-top:1rem;
	margin-bottom:0;
}

#boxMy .my-side-top,
#boxMy .my-side-bottom{
	display:none;
}

#boxMy .my-side-menu{
	display:grid;
	grid-template-columns:1fr;
	gap:0;
	padding:1.25rem 1.25rem;
	border-radius:var(--my-radius-xl);
	background:var(--my-box);
	box-shadow:var(--my-shadow);
}

#boxMy .my-side-menu a{
	display:grid;
	grid-template-columns:2rem minmax(0,1fr) 1.25rem;
	align-items:center;
	gap:.75rem;
	min-height:3.75rem;
	color:var(--my-text);
	font-size:1.05rem;
	font-weight:500;
	letter-spacing:-.04em;
}

#boxMy .my-side-menu a::after{
	content:"chevron_right";
	display:block;
	color:var(--my-text-light);
	font-family:"Material Symbols Outlined";
	font-size:1.5rem;
	font-weight:300;
	line-height:1;
	text-align:right;
	font-variation-settings:'FILL' 0,'wght' 300,'GRAD' 0,'opsz' 40;
}

#boxMy .my-side-menu a span{
	display:block;
	color:var(--my-text);
	font-size:1.75rem;
	font-weight:300;
	line-height:1;
	font-variation-settings:'FILL' 0,'wght' 300,'GRAD' 0,'opsz' 40;
}

#boxMy .my-side-menu a.active{
	color:var(--my-theme-dark);
	font-weight:500;
}

#boxMy .my-side-menu a.active span,
#boxMy .my-side-menu a.active::after{
	color:var(--my-theme-dark);
}

#boxMy .my-quick{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	margin-bottom:1rem;
	padding:1rem 0;
	border-radius:var(--my-radius-lg);
	background:var(--my-box);
	box-shadow:var(--my-shadow);
	overflow:hidden;
}

#boxMy .my-quick-item{
	position:relative;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:.25rem;
	min-height:4.5rem;
	padding:.5rem;
	text-align:center;
}

#boxMy .my-quick-item + .my-quick-item::before{
	content:"";
	position:absolute;
	left:0;
	top:50%;
	width:1px;
	height:3rem;
	background:var(--my-border);
	transform:translateY(-50%);
}

#boxMy .my-quick-icon{
	display:block;
	color:var(--my-text);
	font-size:1.6rem;
	line-height:1;
	font-variation-settings:'FILL' 0,'wght' 300,'GRAD' 0,'opsz' 40;
}

#boxMy .my-quick-title{
	display:block;
	overflow:hidden;
	max-width:100%;
	color:var(--my-text);
	font-size:.95rem;
	font-weight:500;
	letter-spacing:-.04em;
	text-overflow:ellipsis;
	white-space:nowrap;
}

#boxMy .my-section,
#boxMy .my-form-section{
	margin-bottom:1rem;
	padding:1.5rem 2.25rem;
	border-radius:var(--my-radius-lg);
	background:var(--my-box);
	box-shadow:var(--my-shadow);
}

#boxMy .my-section:last-child,
#boxMy .my-form-section:last-child{
	margin-bottom:0;
}

#boxMy .my-section-head,
#boxMy .my-form-section-head{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:1rem;
	margin-bottom:1rem;
}

#boxMy .my-section-title,
#boxMy .my-section-head h3,
#boxMy .my-form-section-head h3{
	margin:0;
	color:var(--my-text-strong);
	font-size:.9rem;
	font-weight:500;
}

#boxMy .my-section-more{
	flex:0 0 auto;
	color:var(--my-text-muted);
	font-size:.9rem;
	font-weight:500;
}

#boxMy .my-section-body{
	min-width:0;
}

#boxMy .my-card-list{
	display:flex;
	gap:.75rem;
	overflow-x:auto;
	overflow-y:hidden;
	padding:.125rem 0 .375rem;
	scrollbar-width:none;
	-webkit-overflow-scrolling:touch;
}

#boxMy .my-card-list::-webkit-scrollbar{
	display:none;
}

#boxMy .my-card-item{
	flex:0 0 8.25rem;
	min-width:0;
	display:block;
}

#boxMy .my-card-thumb{
	width:100%;
	aspect-ratio:1.28 / 1;
	border-radius:var(--my-radius-sm);
	background:#f1f3f5 no-repeat center center / cover;
	overflow:hidden;
}

#boxMy .my-card-info{
	min-width:0;
	padding-top:.5rem;
}

#boxMy .my-card-price{
	display:block;
	overflow:hidden;
	margin-bottom:.15rem;
	color:var(--my-text-strong);
	font-size:.95rem;
	font-weight:500;
	text-overflow:ellipsis;
	white-space:nowrap;
}

#boxMy .my-card-title{
	display:block;
	overflow:hidden;
	margin:0 0 .1rem;
	color:var(--my-text-muted);
	font-size:.82rem;
	font-weight:400;
	text-overflow:ellipsis;
	white-space:nowrap;
}

#boxMy .my-card-text{
	display:block;
	overflow:hidden;
	color:var(--my-text-muted);
	font-size:.8rem;
	font-weight:400;
	text-overflow:ellipsis;
	white-space:nowrap;
}

#boxMy .my-card-date{
	display:none;
}

#boxMy .my-list{
	display:block;
	margin:0;
	padding:0;
	list-style:none;
}

#boxMy .my-list-item{
	display:grid;
	grid-template-columns:minmax(0,1fr);
	gap:.5rem;
	align-items:center;
	padding:1rem 0;
	border-bottom:1px solid var(--my-border);
}

#boxMy .my-list-item:first-child{
	padding-top:0;
}

#boxMy .my-list-item:last-child{
	padding-bottom:0;
	border-bottom:0;
}

#boxMy .my-list-title{
	overflow:hidden;
	color:var(--my-text-strong);
	font-size:.95rem;
	font-weight:600;
	text-overflow:ellipsis;
	white-space:nowrap;
}

#boxMy .my-list-date{
	color:var(--my-text-light);
	font-size:.78rem;
	font-style:normal;
	font-weight:500;
}

#boxMy .my-badge,
#boxMy .my-list-badge{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:fit-content;
	min-height:1.75rem;
	padding:.25rem .75rem;
	border-radius:var(--my-radius-pill);
	background:#f1f5f9;
	color:#475569;
	font-size:.75rem;
	font-weight:500;
	line-height:1.2;
	white-space:nowrap;
}

#boxMy .my-badge-done{
	background:#dcfce7;
	color:var(--my-success);
}

#boxMy .my-badge-wait{
	background:#fff7ed;
	color:var(--my-warning);
}

#boxMy .my-badge-request{
	background:#e0f2fe;
	color:var(--my-info);
}

#boxMy .my-empty{
	display:flex;
	align-items:center;
	justify-content:center;
	min-height:5rem;
	padding:1rem;
	color:var(--my-text-muted);
	font-size:1rem;
	text-align:center;
	letter-spacing:-.03em;
}

#boxMy .my-form{
	width:100%;
	margin:0;
}

#boxMy .my-form-guide{
	margin:0 0 1rem;
	color:var(--my-text-muted);
	font-size:.9rem;
	line-height:1.5;
	letter-spacing:-.03em;
}

#boxMy .my-form-grid{
	display:grid;
	grid-template-columns:1fr;
	gap:1rem;
}

#boxMy .my-form-row{
	min-width:0;
}

#boxMy .my-form-row--full{
	grid-column:1 / -1;
}

#boxMy .my-form-row label{
	display:block;
	margin-bottom:.45rem;
	color:var(--my-text);
	font-size:.95rem;
	font-weight:600;
	letter-spacing:-.03em;
}

#boxMy .my-form-row label span{
	color:var(--my-danger);
}

#boxMy .my-form-row input,
#boxMy .my-form-row select,
#boxMy .my-form-row textarea{
	width:100%;
	border:1px solid var(--my-border-strong);
	border-radius:var(--my-radius-sm);
	background:#fff;
	color:#222;
	font-size:1rem;
	outline:none;
	transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}

#boxMy .my-form-row input,
#boxMy .my-form-row select{
	height:var(--my-form-height);
	padding:0 .875rem;
}

#boxMy .my-form-row textarea{
	min-height:9.375rem;
	padding:.875rem;
	line-height:1.5;
	resize:vertical;
}

#boxMy .my-form-row input[readonly]{
	background:#f8fafc;
	color:var(--my-text-muted);
}

#boxMy .my-form-row input::placeholder,
#boxMy .my-form-row textarea::placeholder{
	color:#a0a7b2;
}

#boxMy .my-form-row input:focus,
#boxMy .my-form-row select:focus,
#boxMy .my-form-row textarea:focus{
	border-color:var(--my-theme);
	box-shadow:0 0 0 .1875rem rgba(37,99,235,.08);
}

#boxMy .my-form-inline{
	display:flex;
	flex-direction:column;
	gap:.5rem;
}

#boxMy .my-form-inline + .my-form-inline{
	margin-top:.5rem;
}

#boxMy .my-form-inline input{
	min-width:0;
}

#boxMy .my-form-inline button{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:100%;
	height:var(--my-form-height);
	padding:0 1rem;
	border:1px solid var(--my-theme);
	border-radius:var(--my-radius-sm);
	background:var(--my-theme);
	color:#fff;
	font-size:.9rem;
	font-weight:600;
	cursor:pointer;
	white-space:nowrap;
}

#boxMy .my-form-msg{
	margin:.45rem 0 0;
	color:var(--my-danger);
	font-size:.78rem;
	line-height:1.5;
	letter-spacing:-.03em;
}

#boxMy .my-form-msg.ok{
	color:var(--my-theme-dark);
}

#boxMy .my-form-notice{
	margin:0 0 .75rem;
	padding:.75rem .875rem;
	border:1px solid #dbeafe;
	border-radius:var(--my-radius-md);
	background:#eff6ff;
	color:#1e40af;
	font-size:.88rem;
	line-height:1.5;
	letter-spacing:-.03em;
}

#boxMy .my-form-file-current{
	display:block;
	margin-bottom:.75rem;
	padding:.75rem .875rem;
	border:1px solid var(--my-border);
	border-radius:var(--my-radius-md);
	background:#f8fafc;
}

#boxMy .my-form-file-current span{
	display:block;
	margin-bottom:.25rem;
	color:var(--my-text-muted);
	font-size:.82rem;
	font-weight:600;
}

#boxMy .my-form-file-current strong{
	display:block;
	color:var(--my-text);
	font-size:.9rem;
	font-weight:600;
	word-break:break-all;
}

#boxMy .my-form-file{
	display:flex;
	align-items:center;
	justify-content:center;
	width:100%;
	min-height:9.375rem;
	margin:0;
	padding:1rem;
	border:1px dashed #cbd5e1;
	border-radius:var(--my-radius-lg);
	background:#f8fbff;
	text-align:center;
	cursor:pointer;
}

#boxMy .my-form-file input{
	display:none;
}

#boxMy .my-form-file span{
	color:var(--my-text-muted);
	font-size:.95rem;
	line-height:1.5;
}

#boxMy .my-form-file em{
	color:var(--my-text-light);
	font-size:.85rem;
	font-style:normal;
}

#boxMy .my-form-file-list{
	margin-top:.75rem;
	color:var(--my-text);
	font-size:.9rem;
}

#boxMy .my-form-file-list .file-item{
	padding:.75rem .875rem;
	border:1px solid var(--my-border);
	border-radius:var(--my-radius-md);
	background:#fff;
}

#boxMy .my-form-file-list .file-item + .file-item{
	margin-top:.5rem;
}

#boxMy .my-form-file-list .file-item.is-existing{
	background:#f8fafc;
}

#boxMy .my-form-file-list .file-item.is-new{
	border-color:#bfdbfe;
	background:#eff6ff;
	color:#1e40af;
}

#boxMy .my-form-submit{
	display:flex;
	flex-direction:column;
	justify-content:center;
	gap:.5rem;
	margin-top:1.5rem;
	padding-top:1.25rem;
	border-top:1px solid var(--my-border);
}

#boxMy .my-form-btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:100%;
	min-width:0;
	height:var(--my-btn-height);
	padding:0 1rem;
	border-radius:var(--my-radius-md);
	font-size:1rem;
	font-weight:600;
	line-height:1;
	text-align:center;
	cursor:pointer;
	appearance:none;
}

#boxMy .my-form-btn--line{
	border:1px solid #cbd5e1;
	background:#fff;
	color:#1f2937;
}

#boxMy .my-form-btn--primary{
	border:1px solid var(--my-theme);
	background:var(--my-theme);
	color:#fff;
	box-shadow:0 .375rem 1rem rgba(37,99,235,.15);
}

#joinCompleteToast{
	position:fixed;
	left:50%;
	top:5.5rem;
	z-index:99999;
	min-width:15rem;
	padding:.875rem 1.25rem;
	border-radius:var(--my-radius-pill);
	background:rgba(15,23,42,.94);
	color:#fff;
	font-size:.9rem;
	font-weight:600;
	text-align:center;
	opacity:0;
	pointer-events:none;
	box-shadow:0 .625rem 1.875rem rgba(0,0,0,.16);
	transform:translate(-50%,-.75rem);
	transition:opacity .28s ease,transform .28s ease;
}

#joinCompleteToast.show{
	opacity:1;
	transform:translate(-50%,0);
}

@media(min-width:640px){
	#boxMy .my-section-title,
	#boxMy .my-section-head h3,
	#boxMy .my-form-section-head h3{
		font-size:1.15rem;
	}
	
	#boxMy{
		padding:1.75rem 0 2.5rem;
	}

	#boxMy .contain{
		padding:0 1.25rem;
	}

	#boxMy .my-form-grid{
		grid-template-columns:repeat(2,minmax(0,1fr));
	}

	#boxMy .my-form-inline{
		flex-direction:row;
	}

	#boxMy .my-form-inline button{
		width:auto;
		flex:0 0 auto;
	}

	#boxMy .my-form-submit{
		flex-direction:row;
	}

	#boxMy .my-form-btn{
		width:auto;
		min-width:10rem;
	}

	#boxMy .my-card-item{
		flex-basis:10rem;
	}

	#boxMy .my-list-item{
		grid-template-columns:7rem minmax(0,1fr) 5rem;
		gap:1rem;
	}

	#boxMy .my-list-date{
		text-align:right;
	}
}

@media(min-width:1025px){
	#boxMy{
		padding:2rem 0 3rem;
		background:#f8fafc;
	}

	#boxMy .contain{
		padding:0 1.25rem;
	}

	#boxMy .my-layout{
		display:grid;
		grid-template-columns:16.25rem minmax(0,1fr);
		gap:2rem;
		align-items:start;
	}

	#boxMy .my-content{
		max-width:none;
		margin:0;
	}

	#boxMy .my-side{
		position:sticky;
		top:1.5rem;
		display:block;
		order:0;
		margin-top:0;
		margin-bottom:0;
		border:1px solid var(--my-border);
		border-radius:var(--my-radius-xl);
		background:#fff;
		box-shadow:var(--my-shadow);
		overflow:hidden;
	}

	#boxMy .my-side-top{
		display:block;
		padding:1.5rem 1.25rem;
		border-bottom:1px solid var(--my-border);
		text-align:center;
	}

	#boxMy .my-avatar{
		display:flex;
		align-items:center;
		justify-content:center;
		width:4rem;
		height:4rem;
		margin:0 auto .75rem;
		border-radius:50%;
		background:var(--my-theme-soft);
		color:var(--my-theme-dark);
	}

	#boxMy .my-avatar span{
		font-size:2rem;
		font-variation-settings:'FILL' 0,'wght' 300,'GRAD' 0,'opsz' 40;
	}

	#boxMy .my-name{
		margin:0 0 .5rem;
		color:var(--my-text-strong);
		font-size:1.05rem;
		font-weight:500;
		text-align:center;
		letter-spacing:-.03em;
	}

	#boxMy .my-mode-switch{
		display:grid;
		grid-template-columns:1fr 1fr;
		gap:.35rem;
		margin-top:1rem;
		padding:.25rem;
		border-radius:var(--my-radius-pill);
		background:#f8fafc;
	}

	#boxMy .my-mode-switch a{
		display:flex;
		align-items:center;
		justify-content:center;
		height:2rem;
		border-radius:var(--my-radius-pill);
		color:var(--my-text-muted);
		font-size:.82rem;
		font-weight:500;
	}

	#boxMy .my-mode-switch a.active{
		background:#fff;
		color:var(--my-theme-dark);
		box-shadow:0 .125rem .5rem rgba(15,23,42,.08);
	}

	#boxMy .my-side-menu{
		display:block;
		padding:.75rem;
		border-radius:0;
		background:#fff;
		box-shadow:none;
	}

	#boxMy .my-side-menu a{
		display:flex;
		align-items:center;
		justify-content:flex-start;
		gap:.625rem;
		min-height:2.75rem;
		padding:0 .875rem;
		border-radius:var(--my-radius-md);
		color:var(--my-text-muted);
		font-size:.95rem;
		font-weight:500;
		text-align:left;
		letter-spacing:-.03em;
	}

	#boxMy .my-side-menu a::after{
		display:none;
	}

	#boxMy .my-side-menu a + a{
		margin-top:.25rem;
	}

	#boxMy .my-side-menu a span{
		flex:0 0 auto;
		font-size:1.25rem;
		color:inherit;
	}

	#boxMy .my-side-menu a:hover{
		background:#f8fafc;
		color:var(--my-text);
	}

	#boxMy .my-side-menu a.active{
		background:var(--my-theme-soft);
		color:var(--my-theme-dark);
		font-weight:500;
	}

	#boxMy .my-side-bottom{
		display:block;
		padding:1rem 1.25rem 1.25rem;
		border-top:1px solid var(--my-border);
	}

	#boxMy .my-side-bottom a{
		display:flex;
		align-items:center;
		justify-content:center;
		gap:.5rem;
		height:2.75rem;
		border:1px solid var(--my-border);
		border-radius:var(--my-radius-md);
		background:#fff;
		color:var(--my-text-muted);
		font-size:.95rem;
		font-weight:500;
	}

	#boxMy .my-side-bottom a span{
		font-size:1.2rem;
	}

	#boxMy .my-quick{
		grid-template-columns:repeat(6,minmax(0,1fr));
		padding:1.25rem;
	}

	#boxMy .my-quick-item{
		min-height:6rem;
		background:#fff;
	}

	#boxMy .my-quick-icon{
		font-size:1.75rem;
	}

	#boxMy .my-section,
	#boxMy .my-form-section{
		margin-bottom:1rem;
		padding:2.5rem;
		border:1px solid var(--my-border);
		border-radius:var(--my-radius-xl);
	}

	#boxMy .my-card-list{
		display: flex;
		overflow-x: auto;
        overflow-y: hidden;
        gap: 1rem; 
        padding: .125rem 0 .375rem;
    }

	#boxMy .my-card-item{
		flex:initial;
        flex: 0 0 10rem;
    }
	
	#boxMy .my-card-thumb{
		border-radius:var(--my-radius-md);
	}

	#boxMy .my-form{
		max-width:960px;
		margin:0 auto;
	}
}

@media(min-width:1280px){
	#boxMy .my-quick{
		grid-template-columns:repeat(6,minmax(0,1fr));
	}

	#boxMy .my-card-list{
		grid-template-columns:repeat(5,minmax(0,1fr));
	}
}

@media(max-width:1024px){
	#boxMy .my-quick .my-quick-item:nth-child(n+4){
		display:none;
	}
}

@media(max-width:380px){
	#boxMy .contain{
		padding:0 .875rem;
	}

	#boxMy .my-side-menu,
	#boxMy .my-section,
	#boxMy .my-form-section{
		padding:1.25rem 1rem;
	}

	#boxMy .my-side-menu a{
		font-size:1rem;
	}

	#boxMy .my-quick-title{
		font-size:.9rem;
	}
}

/* 마이페이지 문의내역 미리보기 */
#boxMy .my-list-item--thumb{
	grid-template-columns:minmax(0,1fr) 4.5rem;
	gap:.75rem;
	align-items:center;
}

#boxMy .my-list-item--thumb .my-list-badge{
	grid-column:1 / 2;
	grid-row:1 / 2;
}

#boxMy .my-list-main{
	display:block;
	min-width:0;
}

#boxMy .my-list-desc{
	display:block;
	overflow:hidden;
	margin-top:.2rem;
	color:var(--my-text-muted);
	font-size:.82rem;
	font-weight:400;
	line-height:1.35;
	text-overflow:ellipsis;
	white-space:nowrap;
}

#boxMy .my-list-item--thumb .my-list-date{
	grid-column:1 / 2;
	grid-row:3 / 4;
	text-align:left;
}

#boxMy .my-list-thumb{
	grid-column:2 / 3;
	grid-row:1 / 4;
	display:block;
	width:4.5rem;
	aspect-ratio:1 / 1;
	border-radius:var(--my-radius-sm);
	background:#f1f3f5 no-repeat center center / cover;
	overflow:hidden;
}

@media(min-width:640px){
	#boxMy .my-list-item--thumb{
		grid-template-columns:7rem minmax(0,1fr) 5rem 4.75rem;
		gap:1rem;
	}

	#boxMy .my-list-item--thumb .my-list-badge{
		grid-column:auto;
		grid-row:auto;
	}

	#boxMy .my-list-item--thumb .my-list-date{
		grid-column:auto;
		grid-row:auto;
		text-align:right;
	}

	#boxMy .my-list-thumb{
		grid-column:auto;
		grid-row:auto;
		width:4.75rem;
	}
}

@media(min-width:1025px){
	#boxMy .my-list-thumb{
		width:5rem;
		border-radius:var(--my-radius-md);
	}
}

/* 거래유형별 가격 원형 배지 */
.price-badge{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:22px;
	height:22px;
	border-radius:50%;
	color:#fff;
	font-size:12px;
	font-weight:700;
	line-height:1;
	vertical-align:middle;
}

.price-badge--pre{
	background:#8b5cf6;
}

.price-badge--sale{
	background:#ef4444;
}

.price-badge--jeonse{
	background:#3b82f6;
}

.price-badge--deposit{
	background:#64748b;
}

.price-badge--rent{
	background:#10b981;
}

/* =========================================================
   공통 UI 토큰 및 재사용 클래스
========================================================= */
:root{
	--rf-text:#191c20;
	--rf-text-strong:#111827;
	--rf-text-muted:#6b7280;
	--rf-text-light:#9ca3af;
	--rf-danger:#ef4444;
	--rf-border:#e5e7eb;
	--rf-surface-soft:#f1f5f9;
	--rf-radius-sm:4px;
	--rf-radius-pill:999px;
	--rf-font-lg:1rem;
	--rf-font-md:.9rem;
	--rf-font-sm:.8rem;
	--rf-font-date:.8rem;
}

.rf-text-lg{font-size:var(--rf-font-lg);font-weight:500;line-height:1.4;}
.rf-text-md{font-size:var(--rf-font-md);font-weight:500;line-height:1.4;}
.rf-text-sm{font-size:var(--rf-font-sm);font-weight:400;line-height:1.4;}
.rf-text-date{color:var(--rf-text-muted);font-size:var(--rf-font-date);font-weight:400;line-height:1;}

.rf-price-list{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;}
.rf-price-item{display:inline-flex;align-items:center;gap:.4rem;white-space:nowrap;}
.rf-price-badge{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-width:1.375rem;height:1.375rem;border-radius:3px;color:#fff;font-size:.8rem;font-style:normal;font-weight:500;line-height:1;}
.rf-price-badge.is-sale{background:#ef4444;}
.rf-price-badge.is-real{background:#2563eb;}
.rf-price-badge.is-yield{background:#16a34a;}
.rf-price-badge.is-loan{background:#64748b;}
.rf-price-badge.is-jeonse{background:#7c3aed;}
.rf-price-badge.is-deposit{background:#f97316;}
.rf-price-badge.is-rent{background:#0ea5e9;}
.rf-price-badge.is-premium{background:#db2777;}
.rf-price-value{color:var(--rf-text-strong);font-size:var(--rf-font-lg);font-weight:500;line-height:1.4;}

.rf-wish-icon{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:50%;background:rgba(255,255,255,.94);color:var(--rf-danger);font-size:1.125rem;font-weight:700;line-height:1;box-shadow:0 .25rem .75rem rgba(15,23,42,.15);}
.rf-delete-icon{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;padding:0;border:0;background:transparent;color:var(--rf-text-muted);font-size:1.75rem;font-weight:400;line-height:1;cursor:pointer;appearance:none;}
.rf-date{display:flex;align-items:center;gap:.25rem;color:var(--rf-text-muted);font-size:var(--rf-font-date);font-weight:400;line-height:1;white-space:nowrap;}
.rf-date .material-symbols-outlined{font-size:1rem;line-height:1;}
.rf-meta-tag{display:inline-flex;align-items:center;min-height:1.5rem;padding:0 .75rem;border-radius:var(--rf-radius-pill);background:var(--rf-surface-soft);color:#64748b;font-size:var(--rf-font-sm);font-weight:400;line-height:1.5rem;white-space:nowrap;}

@media(max-width:768px){
	:root{--rf-font-lg:.88rem;--rf-font-md:.88rem;--rf-font-sm:.75rem;--rf-font-date:.75rem;}
	.rf-price-list{gap:.25rem;}
	.rf-price-item{gap:.2rem;}
	.rf-price-badge{min-width:1.25rem;height:1.25rem;font-size:.68rem;}
	.rf-wish-icon{width:1.75rem;height:1.75rem;font-size:1rem;}
	.rf-meta-tag{min-height:1.35rem;padding:0 .425rem;font-size:.68rem;line-height:1.35rem;}
}

:root{--rf-text:var(--color-dark);--rf-text-strong:var(--color-dark);--rf-text-muted:var(--color-gray);--rf-text-light:var(--color-placeholder);--rf-danger:var(--color-required);--rf-border:var(--color-surface);--rf-surface-soft:var(--color-background-light);}

.rf-search-input{width:100%;height:2.75rem;padding:0 .875rem;border:1px solid var(--rf-border);border-radius:var(--rf-radius-sm);background:#fff;color:var(--rf-text-strong);font-size:var(--rf-font-md);font-weight:400;outline:none;transition:border-color .18s ease,box-shadow .18s ease;}
.rf-search-input::placeholder{color:var(--rf-text-light);}
.rf-search-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 .1875rem rgba(28,140,120,.08);}
.rf-button{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;height:2.75rem;padding:0 1rem;border-radius:var(--rf-radius-sm);font-size:var(--rf-font-md);font-weight:500;line-height:1;white-space:nowrap;cursor:pointer;appearance:none;transition:border-color .18s ease,background-color .18s ease,color .18s ease;}
.rf-button-primary{border:1px solid var(--color-primary);background:var(--color-primary);color:#fff;}
.rf-button-primary:hover{border-color:var(--color-primary-dark);background:var(--color-primary-dark);}
.rf-button-danger{border:1px solid #fecaca;background:#fff;color:var(--color-required);}
.rf-button-danger:hover{border-color:#fca5a5;background:#fef2f2;}
.rf-button:disabled{opacity:.55;cursor:default;}

@media(max-width:768px){
	.rf-search-input,.rf-button{height:2.625rem;}
}