From 58427fb8e05332be384d523acf9dbf821c37e2db Mon Sep 17 00:00:00 2001
From: SeongHyun Kim <kksh7842@gmail.com>
Date: Fri, 21 Nov 2025 17:00:25 +0900
Subject: [PATCH] =?UTF-8?q?style(ui):=20=EB=B0=B0=EA=B2=BD=EC=83=89=20?=
 =?UTF-8?q?=ED=86=B5=EC=9D=BC=20=EB=B0=8F=20=EC=8A=A4=ED=81=AC=EB=A1=A4=20?=
 =?UTF-8?q?=EC=B5=9C=EC=A0=81=ED=99=94?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- autocomplete-search-input: !bg-background 강제 적용
- section-paper: 배경색 진하게(bg-muted/40), 기본 테두리 활성화, overflow-visible
- modal-repeater-table: tbody 흰색 배경, 스크롤 높이 제한(240px), 헤더 고정
- autocomplete 드롭다운: z-index 100으로 상향

배경색 통일로 일관된 디자인, 스크롤로 공간 효율 개선
---
 .../AutocompleteSearchInputComponent.tsx             |  4 ++--
 .../modal-repeater-table/RepeaterTable.tsx           |  8 ++++----
 .../section-paper/SectionPaperComponent.tsx          | 12 ++++++------
 3 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/frontend/lib/registry/components/autocomplete-search-input/AutocompleteSearchInputComponent.tsx b/frontend/lib/registry/components/autocomplete-search-input/AutocompleteSearchInputComponent.tsx
index 263cb294..e3572e33 100644
--- a/frontend/lib/registry/components/autocomplete-search-input/AutocompleteSearchInputComponent.tsx
+++ b/frontend/lib/registry/components/autocomplete-search-input/AutocompleteSearchInputComponent.tsx
@@ -175,7 +175,7 @@ export function AutocompleteSearchInputComponent({
           onFocus={handleInputFocus}
           placeholder={placeholder}
           disabled={disabled}
-          className="h-8 pr-16 text-xs sm:h-10 sm:text-sm"
+          className="h-8 pr-16 text-xs sm:h-10 sm:text-sm !bg-background"
         />
         <div className="absolute right-1 top-1/2 flex -translate-y-1/2 items-center gap-1">
           {loading && (
@@ -198,7 +198,7 @@ export function AutocompleteSearchInputComponent({
 
       {/* 드롭다운 결과 */}
       {isOpen && (results.length > 0 || loading) && (
-        <div className="absolute z-50 mt-1 max-h-[300px] w-full overflow-y-auto rounded-md border bg-background shadow-lg">
+        <div className="absolute z-[100] mt-1 max-h-[300px] w-full overflow-y-auto rounded-md border bg-background shadow-lg">
           {loading && results.length === 0 ? (
             <div className="p-4 text-center text-sm text-muted-foreground">
               <Loader2 className="mx-auto mb-2 h-4 w-4 animate-spin" />
diff --git a/frontend/lib/registry/components/modal-repeater-table/RepeaterTable.tsx b/frontend/lib/registry/components/modal-repeater-table/RepeaterTable.tsx
index 879cbce5..c9aa2cfd 100644
--- a/frontend/lib/registry/components/modal-repeater-table/RepeaterTable.tsx
+++ b/frontend/lib/registry/components/modal-repeater-table/RepeaterTable.tsx
@@ -118,10 +118,10 @@ export function RepeaterTable({
   };
 
   return (
-    <div className="border rounded-md overflow-hidden">
-      <div className="overflow-x-auto">
+    <div className="border rounded-md overflow-hidden bg-background">
+      <div className="overflow-x-auto max-h-[240px] overflow-y-auto">
         <table className="w-full text-xs sm:text-sm">
-          <thead className="bg-muted">
+          <thead className="bg-muted sticky top-0 z-10">
             <tr>
               <th className="px-4 py-2 text-left font-medium text-muted-foreground w-12">
                 #
@@ -141,7 +141,7 @@ export function RepeaterTable({
               </th>
             </tr>
           </thead>
-          <tbody>
+          <tbody className="bg-background">
             {data.length === 0 ? (
               <tr>
                 <td
diff --git a/frontend/lib/registry/components/section-paper/SectionPaperComponent.tsx b/frontend/lib/registry/components/section-paper/SectionPaperComponent.tsx
index e8b06380..526bdfa1 100644
--- a/frontend/lib/registry/components/section-paper/SectionPaperComponent.tsx
+++ b/frontend/lib/registry/components/section-paper/SectionPaperComponent.tsx
@@ -40,10 +40,10 @@ export function SectionPaperComponent({
 
   // 배경색 매핑
   const backgroundColorMap = {
-    default: "bg-muted/20",
-    muted: "bg-muted/30",
-    accent: "bg-accent/20",
-    primary: "bg-primary/5",
+    default: "bg-muted/40",
+    muted: "bg-muted/50",
+    accent: "bg-accent/30",
+    primary: "bg-primary/10",
     custom: "",
   };
 
@@ -74,7 +74,7 @@ export function SectionPaperComponent({
   const padding = config.padding || "md";
   const rounded = config.roundedCorners || "md";
   const shadow = config.shadow || "none";
-  const showBorder = config.showBorder || false;
+  const showBorder = config.showBorder !== undefined ? config.showBorder : true;
   const borderStyle = config.borderStyle || "subtle";
 
   // 커스텀 배경색 처리
@@ -87,7 +87,7 @@ export function SectionPaperComponent({
     <div
       className={cn(
         // 기본 스타일
-        "relative transition-colors",
+        "relative transition-colors overflow-visible",
 
         // 배경색
         backgroundColor !== "custom" && backgroundColorMap[backgroundColor],