feat(modal): mejorar el estilo del modal y ajustar la posición del botón de retroceso

packages/broadcast-panel/src/components/NewTransmissionModal.module.css

@@ -1,8 +1,17 @@
 /* NewTransmissionModal - StreamYard style */
 
+.modalWrapper {
+  position: relative;
+}
+
+.modalWrapper.hasBackButton :global(.modalHeader) {
+  padding-left: 56px;
+}
+
 .backButton {
   position: absolute;
-  top: 16px;
+  top: 50%;
+  transform: translateY(-50%);
   left: 16px;
   display: flex;
   align-items: center;
@@ -15,7 +24,7 @@
   color: #5f6368;
   cursor: pointer;
   transition: all 0.15s;
-  z-index: 1;
+  z-index: 10;
 }
 
 .backButton:hover {

packages/broadcast-panel/src/components/NewTransmissionModal.tsx

@@ -211,17 +211,18 @@ const NewTransmissionModal: React.FC<Props> = ({ open, onClose, onCreate, onUpda
   const showBackButton = view === 'add-destination'
 
   return (
-    <Modal
+    <div className={`${styles.modalWrapper} ${showBackButton ? styles.hasBackButton : ''}`}>
-      open={open}
+      <Modal
-      onClose={onClose}
+        open={open}
-      title={modalTitle}
+        onClose={onClose}
-      width="md"
+        title={modalTitle}
-    >
+        width="md"
-      {showBackButton && (
+      >
-        <button onClick={handleBackToMain} className={styles.backButton}>
+        {showBackButton && (
-          <MdArrowBack size={20} />
+          <button onClick={handleBackToMain} className={styles.backButton}>
-        </button>
+            <MdArrowBack size={20} />
-      )}
+          </button>
+        )}
 
       {view === 'main' && (
         <>
@@ -474,6 +475,7 @@ const NewTransmissionModal: React.FC<Props> = ({ open, onClose, onCreate, onUpda
         </div>
       )}
     </Modal>
+    </div>
   )
 }
 

shared/components/Modal.module.css

@@ -39,7 +39,6 @@
   align-items: center;
   justify-content: space-between;
   padding: 16px 24px;
-  border-bottom: 1px solid #e8eaed;
 }
 
 .modalTitle {