refactor: 중복되는 버튼 디자인 스타일 클래스로 분리

Author: AAminha

src/components/ConfirmModal.tsx

@@ -35,14 +35,14 @@ const ConfirmModal = ({
         <section className="flex items-center gap-6">
           <button
             type="button"
-            className="bg-primary-4 body-m h-10 flex-1 basis-1/2 rounded-lg text-gray-50"
+            className="body-m secondary-btn h-10 flex-1 basis-1/2"
             onClick={onCancel}
           >
             {cancelText}
           </button>
           <button
             type="button"
-            className="bg-primary-3 body-m h-10 flex-1 basis-1/2 rounded-lg text-black"
+            className="primary-btn body-m h-10 flex-1 basis-1/2"
             onClick={onConfirm}
           >
             {confirmText}

src/styles/components.css

@@ -1,4 +1,11 @@
 /* 재사용 가능한 UI 컴포넌트의 스타일 정의 */
 
 @layer components {
+  .primary-btn {
+    @apply bg-primary-3 rounded-lg text-black;
+  }
+
+  .secondary-btn {
+    @apply bg-primary-4 rounded-lg text-gray-50;
+  }
 }