tetrons 2.4.2 → 2.4.3

package/dist/index.css

@@ -230,7 +230,6 @@
   display: flex;
   align-items: center;
   background: transparent;
-  flex-wrap: wrap;
   gap: 0.5rem;
 }
 .tetrons-editor__premium-separator {
@@ -243,13 +242,9 @@
   width: 100%;
   height: 100%;
   transition: transform 0.2s ease;
-  overflow: visible !important;
 }
 @media (max-width: 768px) {
   .tetrons-editor__premium-groups {
-    flex-wrap: nowrap;
-    overflow-x: auto;
-    -ms-overflow-style: auto;
     padding: 4px 0;
     min-height: 40px;
     gap: 0.5rem;
@@ -499,17 +494,22 @@
 }
 .tetrons-toolbar__basic {
   display: flex;
-  flex-wrap: nowrap;
   align-items: center;
   padding: 6px;
   background: var(--background);
   border-radius: 4px 4px 0 0;
-  overflow: visible !important;
 }
 @media (max-width: 768px) {
   .tetrons-toolbar__wrapper {
     overflow-x: auto;
+    overflow-y: hidden;
+    white-space: nowrap;
+  }
+  .tetrons-toolbar__basic {
+    display: inline-flex;
+    flex-wrap: nowrap;
     white-space: nowrap;
+    min-width: max-content;
   }
   .tetrons-toolbar__basic > * {
     flex: 0 0 auto;
@@ -1470,14 +1470,6 @@
   top: 0;
   z-index: 400000000 !important;
 }
-.tetrons-toolbar__wrapper,
-.tetrons-toolbar__basic {
-  position: relative;
-  z-index: 50;
-  background: var(--background, #fff);
-  -webkit-user-select: none;
-  user-select: none;
-}
 .top-menu-dropdown-root,
 .top-menu-submenu,
 .dropdown-menu,
@@ -2184,20 +2176,9 @@
 @media (max-width: 576px) {
   .platinum-group-platinumGroupContainer {
     display: flex;
-    flex-wrap: nowrap;
-    overflow-x: auto;
-    overflow-y: hidden;
-    white-space: nowrap;
     gap: 0.35rem;
     padding-bottom: 4px;
   }
-  .platinum-group-platinumGroupContainer::-webkit-scrollbar {
-    height: 6px;
-  }
-  .platinum-group-platinumGroupContainer::-webkit-scrollbar-thumb {
-    background: rgba(0, 0, 0, 0.25);
-    border-radius: 3px;
-  }
   .platinum-group-button {
     flex: 0 0 auto;
     width: auto;
@@ -2433,7 +2414,6 @@
 .insert-group-group {
   display: flex;
   align-items: center;
-  flex-wrap: wrap;
   gap: 6px;
   padding: 4px 6px;
 }
@@ -2710,18 +2690,9 @@
 }
 @media (max-width: 768px) {
   .insert-group-group {
-    flex-wrap: nowrap;
-    overflow-x: auto;
     gap: 6px;
     padding: 8px;
   }
-  .insert-group-group::-webkit-scrollbar {
-    height: 6px;
-  }
-  .insert-group-group::-webkit-scrollbar-thumb {
-    background: rgba(0, 0, 0, 0.2);
-    border-radius: 3px;
-  }
 }
 @media (max-width: 576px) {
   .insert-group-group {
@@ -2731,7 +2702,6 @@
 }
 .list-group-group {
   position: static !important;
-  overflow: visible !important;
   display: flex;
   align-items: center;
   gap: 12px;
@@ -2751,7 +2721,6 @@
 }
 .list-group-dropdown {
   position: relative !important;
-  overflow: visible !important;
   z-index: 99999999 !important;
 }
 .list-group-dropdown > button {
@@ -2879,18 +2848,6 @@
   background: rgba(0, 0, 0, 0.12);
   border-radius: 6px;
 }
-.tetrons-editor__third-row,
-.tetrons-editor__premium-groups,
-.tetrons-editor__toolbar,
-.list-group-group {
-  overflow: visible !important;
-}
-.tetrons-editor__wrapper,
-.tetrons-editor__wrapper-page {
-  overflow: visible !important;
-  position: relative;
-  z-index: 1;
-}
 .tetrons-editor__area,
 .tetrons-editor__area-page {
   z-index: 1 !important;
@@ -3476,7 +3433,6 @@
 }
 .tetrons-editor__container:fullscreen .tetrons-editor__wrapper {
   height: calc(100vh - 80px);
-  overflow: visible !important;
 }
 .tetrons-editor__main-area {
   height: calc(100vh - 220px);
@@ -3911,7 +3867,6 @@
 }
 .tetrons-editor__wrapper,
 .tetrons-editor__wrapper-page {
-  overflow: visible !important;
   position: relative !important;
   z-index: 2 !important;
 }
@@ -3919,1037 +3874,1034 @@
   z-index: 1 !important;
   position: relative;
 }
-.tetrons-toolbar__wrapper,
-.tetrons-toolbar__basic,
-.tetrons-editor__third-row {
-  overflow: visible !important;
-}
-@media (min-width: 769px) {
-  .tetrons-toolbar__wrapper,
-  .tetrons-toolbar__basic,
-  .tetrons-editor__third-row {
-    overflow: visible;
-  }
-}
 @media (max-width: 768px) {
-  .tetrons-toolbar__wrapper {
-    overflow-x: auto !important;
-    overflow-y: hidden !important;
-    white-space: nowrap !important;
-  }
-  .tetrons-toolbar__basic {
-    overflow-x: auto !important;
-    overflow-y: hidden !important;
-    white-space: nowrap !important;
-    flex-wrap: nowrap !important;
-  }
   .tetrons-toolbar__basic > * {
     flex: 0 0 auto !important;
     display: inline-flex !important;
   }
   .tetrons-editor__premium-groups {
-    overflow-x: auto !important;
     overflow-y: hidden !important;
-    white-space: nowrap !important;
     flex-wrap: nowrap !important;
   }
   .tetrons-editor__premium-groups > * {
     flex: 0 0 auto !important;
     display: inline-flex !important;
   }
-  .tetrons-toolbar__basic::-webkit-scrollbar,
-  .tetrons-editor__premium-groups::-webkit-scrollbar {
-    height: 6px;
-  }
-  .tetrons-toolbar__basic::-webkit-scrollbar-thumb,
-  .tetrons-editor__premium-groups::-webkit-scrollbar-thumb {
-    background: rgba(0, 0, 0, 0.25);
-    border-radius: 3px;
+  .sharelink-overlay {
+    position: fixed;
+    inset: 0;
+    background: rgba(0, 0, 0, 0.45);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 16px;
+    z-index: 9999;
   }
-}
-.sharelink-overlay {
-  position: fixed;
-  inset: 0;
-  background: rgba(0, 0, 0, 0.45);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: 16px;
-  z-index: 9999;
-}
-.sharelink-modal {
-  width: 100%;
-  max-width: 420px;
-  background: #fff;
-  padding: 20px;
-  border-radius: 12px;
-  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.15);
-  animation: fadeInScale 0.25s ease-out;
-}
-.sharelink-title {
-  margin-bottom: 12px;
-  font-size: 1.125rem;
-  font-weight: 600;
-  text-align: center;
-}
-.sharelink-label {
-  display: block;
-  margin-bottom: 6px;
-  font-size: 0.9rem;
-  font-weight: 500;
-}
-.sharelink-input {
-  width: 100%;
-  padding: 10px;
-  font-size: 0.9rem;
-  border: 1px solid #ccc;
-  border-radius: 6px;
-  margin-bottom: 16px;
-  word-break: break-all;
-}
-.sharelink-button-row {
-  display: flex;
-  flex-direction: row;
-  gap: 10px;
-  margin-bottom: 16px;
-}
-.sharelink-btn {
-  flex: 1;
-  padding: 10px;
-  border: none;
-  border-radius: 6px;
-  cursor: pointer;
-  font-size: 0.9rem;
-  font-weight: 500;
-  transition: background 0.2s ease, transform 0.15s ease;
-}
-.sharelink-btn:hover {
-  transform: translateY(-1px);
-}
-.sharelink-copy {
-  background: #007bff;
-  color: white;
-}
-.sharelink-open {
-  background: #28a745;
-  color: white;
-}
-.sharelink-close {
-  width: 100%;
-  background: #ccc;
-  color: #333;
-}
-@media (max-width: 480px) {
   .sharelink-modal {
-    padding: 16px;
-    border-radius: 10px;
+    width: 100%;
+    max-width: 420px;
+    background: #fff;
+    padding: 20px;
+    border-radius: 12px;
+    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.15);
+    animation: fadeInScale 0.25s ease-out;
   }
   .sharelink-title {
-    font-size: 1.05rem;
-  }
-  .sharelink-btn {
-    padding: 9px;
-    font-size: 0.85rem;
-  }
-  .sharelink-button-row {
-    flex-direction: column;
+    margin-bottom: 12px;
+    font-size: 1.125rem;
+    font-weight: 600;
+    text-align: center;
   }
-}
-@media (max-width: 768px) {
-  .sharelink-modal {
-    max-width: 90%;
+  .sharelink-label {
+    display: block;
+    margin-bottom: 6px;
+    font-size: 0.9rem;
+    font-weight: 500;
   }
   .sharelink-input {
-    font-size: 0.95rem;
+    width: 100%;
+    padding: 10px;
+    font-size: 0.9rem;
+    border: 1px solid #ccc;
+    border-radius: 6px;
+    margin-bottom: 16px;
+    word-break: break-all;
   }
-}
-@media (min-width: 1200px) {
-  .sharelink-modal {
-    max-width: 460px;
+  .sharelink-button-row {
+    display: flex;
+    flex-direction: row;
+    gap: 10px;
+    margin-bottom: 16px;
   }
-}
-@media (prefers-reduced-motion: reduce) {
-  .sharelink-modal {
-    animation: none;
+  .sharelink-btn {
+    flex: 1;
+    padding: 10px;
+    border: none;
+    border-radius: 6px;
+    cursor: pointer;
+    font-size: 0.9rem;
+    font-weight: 500;
+    transition: background 0.2s ease, transform 0.15s ease;
   }
   .sharelink-btn:hover {
-    transform: none;
+    transform: translateY(-1px);
   }
-}
-@keyframes fadeInScale {
-  from {
-    opacity: 0;
-    transform: scale(0.96);
+  .sharelink-copy {
+    background: #007bff;
+    color: white;
   }
-  to {
-    opacity: 1;
-    transform: scale(1);
+  .sharelink-open {
+    background: #28a745;
+    color: white;
+  }
+  .sharelink-close {
+    width: 100%;
+    background: #ccc;
+    color: #333;
+  }
+  @media (max-width: 480px) {
+    .sharelink-modal {
+      padding: 16px;
+      border-radius: 10px;
+    }
+    .sharelink-title {
+      font-size: 1.05rem;
+    }
+    .sharelink-btn {
+      padding: 9px;
+      font-size: 0.85rem;
+    }
+    .sharelink-button-row {
+      flex-direction: column;
+    }
+  }
+  @media (max-width: 768px) {
+    .sharelink-modal {
+      max-width: 90%;
+    }
+    .sharelink-input {
+      font-size: 0.95rem;
+    }
+  }
+  @media (min-width: 1200px) {
+    .sharelink-modal {
+      max-width: 460px;
+    }
+  }
+  @media (prefers-reduced-motion: reduce) {
+    .sharelink-modal {
+      animation: none;
+    }
+    .sharelink-btn:hover {
+      transform: none;
+    }
+  }
+  @keyframes fadeInScale {
+    from {
+      opacity: 0;
+      transform: scale(0.96);
+    }
+    to {
+      opacity: 1;
+      transform: scale(1);
+    }
+  }
+  .docContainer {
+    max-width: 800px;
+    margin: 40px auto;
+    padding: 20px;
+    background: #ffffff;
+    border-radius: 8px;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
   }
-}
-.docContainer {
-  max-width: 800px;
-  margin: 40px auto;
-  padding: 20px;
-  background: #ffffff;
-  border-radius: 8px;
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
-}
-.tetrons-link-preview-popup {
-  position: fixed;
-  z-index: 999999;
-  max-width: 280px;
-  width: calc(100vw - 40px);
-  background: #ffffff;
-  border: 1px solid #ddd;
-  border-radius: 8px;
-  padding: 12px;
-  box-shadow: 0 6px 22px rgba(0, 0, 0, 0.15);
-  font-family: sans-serif;
-  transition: opacity 0.15s ease-out, transform 0.15s ease-out;
-  will-change: opacity, transform;
-  max-height: calc(100vh - 40px);
-  overflow-y: auto;
-}
-.tetrons-link-preview-title {
-  font-size: 15px;
-  font-weight: 600;
-  margin-bottom: 6px;
-  line-height: 1.3;
-}
-.tetrons-link-preview-desc {
-  font-size: 13px;
-  color: #555;
-  margin: 6px 0;
-  line-height: 1.4;
-}
-.tetrons-link-preview-url {
-  font-size: 12px;
-  color: #888;
-  word-break: break-all;
-}
-.tetrons-link-preview-img-wrapper {
-  width: 100%;
-  overflow: hidden;
-  border-radius: 6px;
-  margin-bottom: 6px;
-}
-.tetrons-link-preview-img {
-  width: 100% !important;
-  height: auto !important;
-  object-fit: cover !important;
-  border-radius: 6px;
-}
-@media (max-width: 1024px) {
   .tetrons-link-preview-popup {
-    max-width: 300px;
-    padding: 10px;
+    position: fixed;
+    z-index: 999999;
+    max-width: 280px;
+    width: calc(100vw - 40px);
+    background: #ffffff;
+    border: 1px solid #ddd;
+    border-radius: 8px;
+    padding: 12px;
+    box-shadow: 0 6px 22px rgba(0, 0, 0, 0.15);
+    font-family: sans-serif;
+    transition: opacity 0.15s ease-out, transform 0.15s ease-out;
+    will-change: opacity, transform;
+    max-height: calc(100vh - 40px);
+    overflow-y: auto;
   }
   .tetrons-link-preview-title {
-    font-size: 14px;
+    font-size: 15px;
+    font-weight: 600;
+    margin-bottom: 6px;
+    line-height: 1.3;
   }
   .tetrons-link-preview-desc {
+    font-size: 13px;
+    color: #555;
+    margin: 6px 0;
+    line-height: 1.4;
+  }
+  .tetrons-link-preview-url {
     font-size: 12px;
+    color: #888;
+    word-break: break-all;
   }
-}
-@media (max-width: 600px) {
-  .tetrons-link-preview-popup {
-    left: 8px !important;
-    right: 8px !important;
-    max-width: none;
-    width: auto;
-    padding: 10px;
+  .tetrons-link-preview-img-wrapper {
+    width: 100%;
+    overflow: hidden;
     border-radius: 6px;
+    margin-bottom: 6px;
   }
-  .tetrons-link-preview-title {
-    font-size: 14px;
-    margin-bottom: 4px;
+  .tetrons-link-preview-img {
+    width: 100% !important;
+    height: auto !important;
+    object-fit: cover !important;
+    border-radius: 6px;
   }
-  .tetrons-link-preview-desc {
-    font-size: 12px;
+  @media (max-width: 1024px) {
+    .tetrons-link-preview-popup {
+      max-width: 300px;
+      padding: 10px;
+    }
+    .tetrons-link-preview-title {
+      font-size: 14px;
+    }
+    .tetrons-link-preview-desc {
+      font-size: 12px;
+    }
+  }
+  @media (max-width: 600px) {
+    .tetrons-link-preview-popup {
+      left: 8px !important;
+      right: 8px !important;
+      max-width: none;
+      width: auto;
+      padding: 10px;
+      border-radius: 6px;
+    }
+    .tetrons-link-preview-title {
+      font-size: 14px;
+      margin-bottom: 4px;
+    }
+    .tetrons-link-preview-desc {
+      font-size: 12px;
+    }
+    .tetrons-link-preview-img-wrapper {
+      max-height: 140px;
+    }
+  }
+  @media (max-width: 380px) {
+    .tetrons-link-preview-popup {
+      padding: 8px;
+      border-radius: 5px;
+    }
+    .tetrons-link-preview-title {
+      font-size: 13px;
+    }
+    .tetrons-link-preview-desc {
+      font-size: 11px;
+    }
+    .tetrons-link-preview-url {
+      font-size: 11px;
+    }
   }
-  .tetrons-link-preview-img-wrapper {
-    max-height: 140px;
+  .tetrons-editor__modal-overlay {
+    position: fixed;
+    inset: 0;
+    background: rgba(0, 0, 0, 0.45);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    z-index: 99999;
+    padding: 16px;
+    box-sizing: border-box;
   }
-}
-@media (max-width: 380px) {
-  .tetrons-link-preview-popup {
-    padding: 8px;
-    border-radius: 5px;
+  .email-modal {
+    width: 520px;
+    max-width: 100%;
+    padding: 24px;
+    background: #fff;
+    border-radius: 10px;
+    box-sizing: border-box;
+    overflow-y: auto;
+    max-height: 90vh;
   }
-  .tetrons-link-preview-title {
-    font-size: 13px;
+  .email-modal h2 {
+    margin-top: 0;
+    margin-bottom: 16px;
+    font-size: 20px;
+    font-weight: 600;
   }
-  .tetrons-link-preview-desc {
-    font-size: 11px;
+  .email-field {
+    margin-bottom: 14px;
+    display: flex;
+    flex-direction: column;
   }
-  .tetrons-link-preview-url {
-    font-size: 11px;
-  }
-}
-.tetrons-editor__modal-overlay {
-  position: fixed;
-  inset: 0;
-  background: rgba(0, 0, 0, 0.45);
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  z-index: 99999;
-  padding: 16px;
-  box-sizing: border-box;
-}
-.email-modal {
-  width: 520px;
-  max-width: 100%;
-  padding: 24px;
-  background: #fff;
-  border-radius: 10px;
-  box-sizing: border-box;
-  overflow-y: auto;
-  max-height: 90vh;
-}
-.email-modal h2 {
-  margin-top: 0;
-  margin-bottom: 16px;
-  font-size: 20px;
-  font-weight: 600;
-}
-.email-field {
-  margin-bottom: 14px;
-  display: flex;
-  flex-direction: column;
-}
-.email-field label {
-  font-size: 14px;
-  margin-bottom: 5px;
-}
-.email-field input,
-.email-field textarea {
-  padding: 8px 10px;
-  border: 1px solid #ccc;
-  border-radius: 6px;
-  font-size: 14px;
-  box-sizing: border-box;
-  width: 100%;
-}
-textarea#email-body {
-  resize: vertical;
-}
-.email-actions {
-  display: flex;
-  justify-content: flex-end;
-  margin-top: 16px;
-  gap: 12px;
-}
-.email-actions button {
-  min-width: 100px;
-  padding: 10px 16px;
-  font-size: 14px;
-  font-weight: 500;
-  border-radius: 6px;
-  border: none;
-  cursor: pointer;
-  transition: all 0.18s ease;
-}
-.email-actions button:first-child {
-  background: #f3f4f6;
-  color: #374151;
-  border: 1px solid #e5e7eb;
-}
-.email-actions button:first-child:hover {
-  background: #e5e7eb;
-}
-.email-actions button:first-child:active {
-  background: #d1d5db;
-}
-.email-actions button:last-child {
-  background: #2563eb;
-  color: #ffffff;
-  border: 1px solid #1e4fd4;
-}
-.email-actions button:last-child:hover {
-  background: #1e4fd4;
-}
-.email-actions button:last-child:active {
-  background: #1b44b8;
-}
-@media (max-width: 1200px) {
-  .email-modal {
-    width: 480px;
-    padding: 22px;
-  }
-}
-@media (max-width: 992px) {
-  .email-modal {
-    width: 440px;
-    padding: 20px;
-  }
-  .email-field label {
-    font-size: 13px;
+  .email-field label {
+    font-size: 14px;
+    margin-bottom: 5px;
   }
   .email-field input,
   .email-field textarea {
-    font-size: 13px;
-    padding: 7px 9px;
+    padding: 8px 10px;
+    border: 1px solid #ccc;
+    border-radius: 6px;
+    font-size: 14px;
+    box-sizing: border-box;
+    width: 100%;
   }
-}
-@media (max-width: 768px) {
-  .email-modal {
-    width: 380px;
-    padding: 18px;
+  textarea#email-body {
+    resize: vertical;
   }
   .email-actions {
+    display: flex;
+    justify-content: flex-end;
+    margin-top: 16px;
+    gap: 12px;
+  }
+  .email-actions button {
+    min-width: 100px;
+    padding: 10px 16px;
+    font-size: 14px;
+    font-weight: 500;
+    border-radius: 6px;
+    border: none;
+    cursor: pointer;
+    transition: all 0.18s ease;
+  }
+  .email-actions button:first-child {
+    background: #f3f4f6;
+    color: #374151;
+    border: 1px solid #e5e7eb;
+  }
+  .email-actions button:first-child:hover {
+    background: #e5e7eb;
+  }
+  .email-actions button:first-child:active {
+    background: #d1d5db;
+  }
+  .email-actions button:last-child {
+    background: #2563eb;
+    color: #ffffff;
+    border: 1px solid #1e4fd4;
+  }
+  .email-actions button:last-child:hover {
+    background: #1e4fd4;
+  }
+  .email-actions button:last-child:active {
+    background: #1b44b8;
+  }
+  @media (max-width: 1200px) {
+    .email-modal {
+      width: 480px;
+      padding: 22px;
+    }
+  }
+  @media (max-width: 992px) {
+    .email-modal {
+      width: 440px;
+      padding: 20px;
+    }
+    .email-field label {
+      font-size: 13px;
+    }
+    .email-field input,
+    .email-field textarea {
+      font-size: 13px;
+      padding: 7px 9px;
+    }
+  }
+  @media (max-width: 768px) {
+    .email-modal {
+      width: 380px;
+      padding: 18px;
+    }
+    .email-actions {
+      flex-direction: column;
+      gap: 10px;
+      align-items: stretch;
+    }
+    .email-actions button {
+      width: 100%;
+    }
+  }
+  @media (max-width: 576px) {
+    .email-modal {
+      width: 100%;
+      padding: 16px;
+      border-radius: 8px;
+    }
+    .email-field {
+      margin-bottom: 10px;
+    }
+    .email-field label {
+      font-size: 12.5px;
+    }
+    .email-field input,
+    .email-field textarea {
+      font-size: 12.5px;
+      padding: 6px 8px;
+    }
+    .email-actions {
+      margin-top: 12px;
+    }
+  }
+  @media (max-width: 400px) {
+    .email-modal {
+      width: 100%;
+      padding: 14px;
+    }
+    .email-field input,
+    .email-field textarea {
+      font-size: 12px;
+      padding: 6px;
+    }
+    .email-actions {
+      flex-direction: column;
+      gap: 8px;
+    }
+  }
+  @media (max-width: 360px) {
+    .email-modal {
+      width: 100%;
+      padding: 12px;
+    }
+    .email-field label {
+      font-size: 12px;
+    }
+    .email-field input,
+    .email-field textarea {
+      font-size: 11.5px;
+      padding: 5px 7px;
+    }
+  }
+  .cc-bcc {
+    display: flex;
     flex-direction: column;
     gap: 10px;
-    align-items: stretch;
   }
-  .email-actions button {
-    width: 100%;
+  .email-show-toggle,
+  .email-hide-toggle {
+    background: none;
+    border: none;
+    padding: 0;
+    margin: 4px 0 10px 0;
+    color: #0073e6;
+    font-size: 14px;
+    text-align: left;
+    cursor: pointer;
   }
-}
-@media (max-width: 576px) {
-  .email-modal {
-    width: 100%;
+  .email-show-toggle:hover,
+  .email-hide-toggle:hover {
+    text-decoration: underline;
+  }
+  .email-collapsible {
+    animation: slideDown 0.25s ease-out;
+  }
+  @keyframes slideDown {
+    from {
+      opacity: 0;
+      transform: translateY(-4px);
+    }
+    to {
+      opacity: 1;
+      transform: translateY(0);
+    }
+  }
+  .tetrons-modal-overlay {
+    position: fixed;
+    inset: 0;
+    background: rgba(0, 0, 0, 0.45);
+    display: flex;
+    align-items: center;
+    justify-content: center;
     padding: 16px;
-    border-radius: 8px;
-  }
-  .email-field {
-    margin-bottom: 10px;
-  }
-  .email-field label {
-    font-size: 12.5px;
+    z-index: 9999;
   }
-  .email-field input,
-  .email-field textarea {
-    font-size: 12.5px;
-    padding: 6px 8px;
-  }
-  .email-actions {
-    margin-top: 12px;
-  }
-}
-@media (max-width: 400px) {
-  .email-modal {
-    width: 100%;
-    padding: 14px;
+  .tetrons-modal.image-to-text-modal {
+    width: 420px;
+    max-width: 100%;
+    background: #ffffff;
+    border-radius: 10px;
+    padding: 20px;
+    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.1);
+    box-sizing: border-box;
   }
-  .email-field input,
-  .email-field textarea {
-    font-size: 12px;
-    padding: 6px;
+  .image-to-text-title {
+    font-size: 18px;
+    font-weight: 600;
+    margin-bottom: 16px;
   }
-  .email-actions {
-    flex-direction: column;
-    gap: 8px;
+  .image-to-text-label {
+    display: block;
+    font-size: 14px;
+    font-weight: 500;
+    margin-bottom: 6px;
   }
-}
-@media (max-width: 360px) {
-  .email-modal {
+  .image-to-text-file-input {
     width: 100%;
-    padding: 12px;
-  }
-  .email-field label {
-    font-size: 12px;
-  }
-  .email-field input,
-  .email-field textarea {
-    font-size: 11.5px;
-    padding: 5px 7px;
+    padding: 6px 4px;
+    font-size: 14px;
+    border: 1px solid #dddddd;
+    border-radius: 6px;
+    background: #fafafa;
+    box-sizing: border-box;
   }
-}
-.cc-bcc {
-  display: flex;
-  flex-direction: column;
-  gap: 10px;
-}
-.email-show-toggle,
-.email-hide-toggle {
-  background: none;
-  border: none;
-  padding: 0;
-  margin: 4px 0 10px 0;
-  color: #0073e6;
-  font-size: 14px;
-  text-align: left;
-  cursor: pointer;
-}
-.email-show-toggle:hover,
-.email-hide-toggle:hover {
-  text-decoration: underline;
-}
-.email-collapsible {
-  animation: slideDown 0.25s ease-out;
-}
-@keyframes slideDown {
-  from {
-    opacity: 0;
-    transform: translateY(-4px);
+  .image-to-text-selected {
+    margin-top: 10px;
+    font-size: 14px;
+    color: #444;
   }
-  to {
-    opacity: 1;
-    transform: translateY(0);
+  .image-to-text-actions {
+    margin-top: 20px;
+    display: flex;
+    justify-content: flex-end;
+    gap: 12px;
   }
-}
-.tetrons-modal-overlay {
-  position: fixed;
-  inset: 0;
-  background: rgba(0, 0, 0, 0.45);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: 16px;
-  z-index: 9999;
-}
-.tetrons-modal.image-to-text-modal {
-  width: 420px;
-  max-width: 100%;
-  background: #ffffff;
-  border-radius: 10px;
-  padding: 20px;
-  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.1);
-  box-sizing: border-box;
-}
-.image-to-text-title {
-  font-size: 18px;
-  font-weight: 600;
-  margin-bottom: 16px;
-}
-.image-to-text-label {
-  display: block;
-  font-size: 14px;
-  font-weight: 500;
-  margin-bottom: 6px;
-}
-.image-to-text-file-input {
-  width: 100%;
-  padding: 6px 4px;
-  font-size: 14px;
-  border: 1px solid #dddddd;
-  border-radius: 6px;
-  background: #fafafa;
-  box-sizing: border-box;
-}
-.image-to-text-selected {
-  margin-top: 10px;
-  font-size: 14px;
-  color: #444;
-}
-.image-to-text-actions {
-  margin-top: 20px;
-  display: flex;
-  justify-content: flex-end;
-  gap: 12px;
-}
-@media (max-width: 480px) {
-  .tetrons-modal.image-to-text-modal {
-    width: 100%;
-    padding: 16px;
-    border-radius: 8px;
+  @media (max-width: 480px) {
+    .tetrons-modal.image-to-text-modal {
+      width: 100%;
+      padding: 16px;
+      border-radius: 8px;
+    }
+    .image-to-text-title {
+      font-size: 16px;
+      margin-bottom: 12px;
+    }
+    .image-to-text-actions {
+      flex-direction: column;
+      gap: 8px;
+    }
+    .image-to-text-actions button {
+      width: 100%;
+    }
+  }
+  @media (max-width: 768px) {
+    .tetrons-modal.image-to-text-modal {
+      width: 90%;
+    }
+  }
+  @media (max-width: 1024px) {
+    .tetrons-modal.image-to-text-modal {
+      width: 70%;
+    }
+  }
+  .tetrons-btn-primary {
+    background: #0066ff;
+    color: #ffffff;
+    font-size: 14px;
+    font-weight: 500;
+    border: none;
+    padding: 10px 18px;
+    border-radius: 6px;
+    cursor: pointer;
+    transition: background 0.2s ease, opacity 0.2s ease;
   }
-  .image-to-text-title {
-    font-size: 16px;
-    margin-bottom: 12px;
+  .tetrons-btn-primary:hover:not(:disabled) {
+    background: #0057d6;
   }
-  .image-to-text-actions {
-    flex-direction: column;
-    gap: 8px;
+  .tetrons-btn-primary:active:not(:disabled) {
+    background: #004bb8;
   }
-  .image-to-text-actions button {
-    width: 100%;
+  .tetrons-btn-primary:disabled {
+    background: #a7c4ff;
+    cursor: not-allowed;
+    opacity: 0.6;
   }
-}
-@media (max-width: 768px) {
-  .tetrons-modal.image-to-text-modal {
-    width: 90%;
+  .tetrons-btn-secondary {
+    background: #f3f3f3;
+    color: #333333;
+    font-size: 14px;
+    font-weight: 500;
+    border: 1px solid #d0d0d0;
+    padding: 10px 18px;
+    border-radius: 6px;
+    cursor: pointer;
+    transition: background 0.2s ease, border-color 0.2s ease;
   }
-}
-@media (max-width: 1024px) {
-  .tetrons-modal.image-to-text-modal {
-    width: 70%;
+  .tetrons-btn-secondary:hover:not(:disabled) {
+    background: #e8e8e8;
+    border-color: #bababa;
   }
-}
-.tetrons-btn-primary {
-  background: #0066ff;
-  color: #ffffff;
-  font-size: 14px;
-  font-weight: 500;
-  border: none;
-  padding: 10px 18px;
-  border-radius: 6px;
-  cursor: pointer;
-  transition: background 0.2s ease, opacity 0.2s ease;
-}
-.tetrons-btn-primary:hover:not(:disabled) {
-  background: #0057d6;
-}
-.tetrons-btn-primary:active:not(:disabled) {
-  background: #004bb8;
-}
-.tetrons-btn-primary:disabled {
-  background: #a7c4ff;
-  cursor: not-allowed;
-  opacity: 0.6;
-}
-.tetrons-btn-secondary {
-  background: #f3f3f3;
-  color: #333333;
-  font-size: 14px;
-  font-weight: 500;
-  border: 1px solid #d0d0d0;
-  padding: 10px 18px;
-  border-radius: 6px;
-  cursor: pointer;
-  transition: background 0.2s ease, border-color 0.2s ease;
-}
-.tetrons-btn-secondary:hover:not(:disabled) {
-  background: #e8e8e8;
-  border-color: #bababa;
-}
-.tetrons-btn-secondary:active:not(:disabled) {
-  background: #dddddd;
-  border-color: #b0b0b0;
-}
-.tetrons-btn-secondary:disabled {
-  background: #f3f3f3;
-  border-color: #e0e0e0;
-  color: #999999;
-  cursor: not-allowed;
-  opacity: 0.6;
-}
-@media (max-width: 480px) {
-  .tetrons-btn-primary,
-  .tetrons-btn-secondary {
-    width: 100%;
-    text-align: center;
+  .tetrons-btn-secondary:active:not(:disabled) {
+    background: #dddddd;
+    border-color: #b0b0b0;
   }
-}
-.help-modal {
-  width: 820px;
-  height: max-content;
-  display: flex;
-  flex-direction: column;
-  border-radius: 10px;
-  background: #fff;
-  max-width: 95%;
-  max-height: 95%;
-  overflow: hidden;
-  padding-bottom: 10px;
-}
-.help-modal-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 20px;
-  border-bottom: 1px solid #ddd;
-}
-.help-modal-close {
-  background: transparent;
-  border: none;
-  font-size: 22px;
-  cursor: pointer;
-}
-.help-modal-body {
-  display: flex;
-  flex: 1;
-  overflow: hidden;
-}
-.help-tabs {
-  width: 220px;
-  border-right: 1px solid #ddd;
-  display: flex;
-  flex-direction: column;
-  background: #fafafa;
-  padding: 12px 0;
-  overflow-y: auto;
-}
-.help-tab-item {
-  padding: 14px 20px;
-  cursor: pointer;
-  font-size: 15px;
-  border-radius: 6px;
-  margin: 3px 10px;
-  transition: background 0.15s ease;
-  white-space: nowrap;
-}
-.help-tab-item:hover {
-  background: #e6e6e6;
-}
-.help-tab-item.active {
-  background: #007bff;
-  color: #fff;
-}
-.help-content-area {
-  flex: 1;
-  padding: 24px 28px;
-  overflow-y: auto;
-  line-height: 1.6;
-  font-size: 15px;
-}
-.help-content-area h3 {
-  margin-top: 0;
-  margin-bottom: 18px;
-  font-size: 22px;
-}
-.help-content-area h4 {
-  margin-top: 20px;
-  margin-bottom: 10px;
-  font-size: 18px;
-}
-.help-content-area ul,
-.help-content-area ol {
-  margin-left: 20px;
-  margin-bottom: 14px;
-}
-.help-content-area li {
-  margin-bottom: 6px;
-}
-@media (max-width: 992px) {
-  .help-modal {
-    width: 90%;
-    height: 75%;
+  .tetrons-btn-secondary:disabled {
+    background: #f3f3f3;
+    border-color: #e0e0e0;
+    color: #999999;
+    cursor: not-allowed;
+    opacity: 0.6;
   }
-  .help-tabs {
-    width: 180px;
+  @media (max-width: 480px) {
+    .tetrons-btn-primary,
+    .tetrons-btn-secondary {
+      width: 100%;
+      text-align: center;
+    }
   }
-  .help-tab-item {
-    font-size: 14px;
-    padding: 12px 16px;
+  .help-modal {
+    width: 820px;
+    height: max-content;
+    display: flex;
+    flex-direction: column;
+    border-radius: 10px;
+    background: #fff;
+    max-width: 95%;
+    max-height: 95%;
+    overflow: hidden;
+    padding-bottom: 10px;
   }
-  .help-content-area {
+  .help-modal-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
     padding: 20px;
+    border-bottom: 1px solid #ddd;
   }
-}
-@media (max-width: 768px) {
-  .help-modal {
-    width: 96%;
-    height: 90%;
+  .help-modal-close {
+    background: transparent;
+    border: none;
+    font-size: 22px;
+    cursor: pointer;
   }
   .help-modal-body {
-    flex-direction: column;
+    display: flex;
+    flex: 1;
+    overflow: hidden;
   }
   .help-tabs {
-    width: 100%;
-    height: auto;
-    border-right: none;
-    border-bottom: 1px solid #ddd;
-    flex-direction: row;
-    overflow-x: auto;
-    white-space: nowrap;
-    padding: 10px 10px;
-    gap: 8px;
+    width: 220px;
+    border-right: 1px solid #ddd;
+    display: flex;
+    flex-direction: column;
+    background: #fafafa;
+    padding: 12px 0;
+    overflow-y: auto;
   }
   .help-tab-item {
-    margin: 0 4px;
-    padding: 10px 14px;
-    border-radius: 4px;
-    display: inline-block;
-    font-size: 14px;
+    padding: 14px 20px;
+    cursor: pointer;
+    font-size: 15px;
+    border-radius: 6px;
+    margin: 3px 10px;
+    transition: background 0.15s ease;
+    white-space: nowrap;
+  }
+  .help-tab-item:hover {
+    background: #e6e6e6;
+  }
+  .help-tab-item.active {
+    background: #007bff;
+    color: #fff;
   }
   .help-content-area {
-    padding: 18px;
+    flex: 1;
+    padding: 24px 28px;
+    overflow-y: auto;
+    line-height: 1.6;
+    font-size: 15px;
   }
-}
-@media (max-width: 480px) {
-  .help-modal {
-    width: 100%;
-    height: 100%;
-    border-radius: 0;
+  .help-content-area h3 {
+    margin-top: 0;
+    margin-bottom: 18px;
+    font-size: 22px;
   }
-  .help-modal-header {
-    padding: 14px;
+  .help-content-area h4 {
+    margin-top: 20px;
+    margin-bottom: 10px;
+    font-size: 18px;
   }
-  .help-tab-item {
-    font-size: 13px;
-    padding: 8px 12px;
+  .help-content-area ul,
+  .help-content-area ol {
+    margin-left: 20px;
+    margin-bottom: 14px;
   }
-  .help-content-area {
-    padding: 14px;
+  .help-content-area li {
+    margin-bottom: 6px;
   }
-  .ug-header,
-  .faq-header {
-    padding: 10px 0;
+  @media (max-width: 992px) {
+    .help-modal {
+      width: 90%;
+      height: 75%;
+    }
+    .help-tabs {
+      width: 180px;
+    }
+    .help-tab-item {
+      font-size: 14px;
+      padding: 12px 16px;
+    }
+    .help-content-area {
+      padding: 20px;
+    }
+  }
+  @media (max-width: 768px) {
+    .help-modal {
+      width: 96%;
+      height: 90%;
+    }
+    .help-modal-body {
+      flex-direction: column;
+    }
+    .help-tabs {
+      width: 100%;
+      height: auto;
+      border-right: none;
+      border-bottom: 1px solid #ddd;
+      flex-direction: row;
+      overflow-x: auto;
+      white-space: nowrap;
+      padding: 10px 10px;
+      gap: 8px;
+    }
+    .help-tab-item {
+      margin: 0 4px;
+      padding: 10px 14px;
+      border-radius: 4px;
+      display: inline-block;
+      font-size: 14px;
+    }
+    .help-content-area {
+      padding: 18px;
+    }
+  }
+  @media (max-width: 480px) {
+    .help-modal {
+      width: 100%;
+      height: 100%;
+      border-radius: 0;
+    }
+    .help-modal-header {
+      padding: 14px;
+    }
+    .help-tab-item {
+      font-size: 13px;
+      padding: 8px 12px;
+    }
+    .help-content-area {
+      padding: 14px;
+    }
+    .ug-header,
+    .faq-header {
+      padding: 10px 0;
+    }
+    .ug-content,
+    .faq-content {
+      padding: 8px 0 14px 6px;
+    }
+    .ug-header h4,
+    .faq-header h4 {
+      font-size: 16px;
+    }
+  }
+  @media (max-width: 360px) {
+    .help-tab-item {
+      font-size: 12px;
+      padding: 6px 10px;
+    }
+    .help-content-area {
+      padding: 10px;
+      font-size: 14px;
+    }
+    .ug-content,
+    .faq-content {
+      padding-left: 4px !important;
+    }
+  }
+  .user-guide-container {
+    padding: 4px;
+  }
+  .ug-section {
+    border-bottom: 1px solid #e4e4e4;
+    padding: 8px 0;
   }
-  .ug-content,
-  .faq-content {
-    padding: 8px 0 14px 6px;
+  .ug-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 12px 0;
+    cursor: pointer;
   }
-  .ug-header h4,
-  .faq-header h4 {
+  .ug-header h4 {
+    margin: 0;
+    font-size: 17px;
+  }
+  .ug-arrow {
     font-size: 16px;
+    opacity: 0.6;
   }
-}
-@media (max-width: 360px) {
-  .help-tab-item {
-    font-size: 12px;
-    padding: 6px 10px;
+  .ug-content {
+    padding: 10px 0 16px 10px;
+    animation: fadeIn 0.2s ease-in-out;
   }
-  .help-content-area {
-    padding: 10px;
-    font-size: 14px;
+  .ug-content h5 {
+    margin-top: 12px;
+    margin-bottom: 6px;
+    font-size: 15px;
+    font-weight: 600;
   }
-  .ug-content,
-  .faq-content {
-    padding-left: 4px !important;
+  .ug-content ul,
+  .ug-content ol {
+    margin-left: 18px;
+    margin-bottom: 12px;
   }
-}
-.user-guide-container {
-  padding: 4px;
-}
-.ug-section {
-  border-bottom: 1px solid #e4e4e4;
-  padding: 8px 0;
-}
-.ug-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 12px 0;
-  cursor: pointer;
-}
-.ug-header h4 {
-  margin: 0;
-  font-size: 17px;
-}
-.ug-arrow {
-  font-size: 16px;
-  opacity: 0.6;
-}
-.ug-content {
-  padding: 10px 0 16px 10px;
-  animation: fadeIn 0.2s ease-in-out;
-}
-.ug-content h5 {
-  margin-top: 12px;
-  margin-bottom: 6px;
-  font-size: 15px;
-  font-weight: 600;
-}
-.ug-content ul,
-.ug-content ol {
-  margin-left: 18px;
-  margin-bottom: 12px;
-}
-.faq-container {
-  padding: 4px;
-}
-.faq-section {
-  border-bottom: 1px solid #e4e4e4;
-  padding: 8px 0;
-}
-.faq-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: 12px 0;
-  cursor: pointer;
-}
-.faq-header h4 {
-  margin: 0;
-  font-size: 17px;
-}
-.faq-arrow {
-  font-size: 16px;
-  opacity: 0.6;
-}
-.faq-content {
-  padding: 10px 0 16px 10px;
-  animation: fadeIn 0.2s ease-in-out;
-}
-.faq-content ul,
-.faq-content ol {
-  margin-left: 18px;
-  margin-bottom: 12px;
-}
-.faq-content li {
-  margin-bottom: 6px;
-}
-@keyframes fadeIn {
-  from {
-    opacity: 0;
-    transform: translateY(-2px);
+  .faq-container {
+    padding: 4px;
   }
-  to {
-    opacity: 1;
-    transform: translateY(0);
+  .faq-section {
+    border-bottom: 1px solid #e4e4e4;
+    padding: 8px 0;
   }
-}
-.version-info-container {
-  padding: 8px;
-  line-height: 1.6;
-  font-size: 15px;
-}
-.version-info-container h3 {
-  margin-top: 0;
-  margin-bottom: 16px;
-  font-size: 22px;
-}
-.version-info-container p {
-  margin-bottom: 14px;
-}
-.version-info-container ul {
-  margin-left: 20px;
-  margin-bottom: 16px;
-}
-.version-info-container li {
-  margin-bottom: 8px;
-}
-.version-info-container strong {
-  font-weight: 600;
-}
-@media (max-width: 992px) {
-  .version-info-container {
-    padding: 8px 6px;
+  .faq-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 12px 0;
+    cursor: pointer;
   }
-  .version-info-container h3 {
-    font-size: 20px;
-    margin-bottom: 14px;
+  .faq-header h4 {
+    margin: 0;
+    font-size: 17px;
   }
-  .version-info-container li {
-    margin-bottom: 7px;
+  .faq-arrow {
+    font-size: 16px;
+    opacity: 0.6;
   }
-}
-@media (max-width: 768px) {
-  .version-info-container {
-    padding: 12px;
-    font-size: 14px;
+  .faq-content {
+    padding: 10px 0 16px 10px;
+    animation: fadeIn 0.2s ease-in-out;
   }
-  .version-info-container h3 {
-    font-size: 19px;
+  .faq-content ul,
+  .faq-content ol {
+    margin-left: 18px;
+    margin-bottom: 12px;
   }
-  .version-info-container ul {
-    margin-left: 16px;
+  .faq-content li {
+    margin-bottom: 6px;
+  }
+  @keyframes fadeIn {
+    from {
+      opacity: 0;
+      transform: translateY(-2px);
+    }
+    to {
+      opacity: 1;
+      transform: translateY(0);
+    }
   }
-}
-@media (max-width: 480px) {
   .version-info-container {
-    padding: 10px;
-    font-size: 14px;
+    padding: 8px;
+    line-height: 1.6;
+    font-size: 15px;
   }
   .version-info-container h3 {
-    font-size: 18px;
-    margin-bottom: 12px;
+    margin-top: 0;
+    margin-bottom: 16px;
+    font-size: 22px;
+  }
+  .version-info-container p {
+    margin-bottom: 14px;
   }
   .version-info-container ul {
-    margin-left: 14px;
+    margin-left: 20px;
+    margin-bottom: 16px;
   }
   .version-info-container li {
-    margin-bottom: 6px;
+    margin-bottom: 8px;
   }
-}
-@media (max-width: 360px) {
-  .version-info-container {
-    padding: 8px;
-    font-size: 13px;
+  .version-info-container strong {
+    font-weight: 600;
   }
-  .version-info-container h3 {
-    font-size: 17px;
+  @media (max-width: 992px) {
+    .version-info-container {
+      padding: 8px 6px;
+    }
+    .version-info-container h3 {
+      font-size: 20px;
+      margin-bottom: 14px;
+    }
+    .version-info-container li {
+      margin-bottom: 7px;
+    }
+  }
+  @media (max-width: 768px) {
+    .version-info-container {
+      padding: 12px;
+      font-size: 14px;
+    }
+    .version-info-container h3 {
+      font-size: 19px;
+    }
+    .version-info-container ul {
+      margin-left: 16px;
+    }
+  }
+  @media (max-width: 480px) {
+    .version-info-container {
+      padding: 10px;
+      font-size: 14px;
+    }
+    .version-info-container h3 {
+      font-size: 18px;
+      margin-bottom: 12px;
+    }
+    .version-info-container ul {
+      margin-left: 14px;
+    }
+    .version-info-container li {
+      margin-bottom: 6px;
+    }
+  }
+  @media (max-width: 360px) {
+    .version-info-container {
+      padding: 8px;
+      font-size: 13px;
+    }
+    .version-info-container h3 {
+      font-size: 17px;
+    }
+    .version-info-container ul {
+      margin-left: 12px;
+    }
   }
-  .version-info-container ul {
-    margin-left: 12px;
+  .tetrons-toolbar__wrapper,
+  .tetrons-editor__third-row,
+  .tetrons-toolbar__basic {
+    position: relative !important;
+    z-index: 500 !important;
+  }
+  .tetrons-editor__area,
+  .tetrons-editor__area .ProseMirror {
+    z-index: 1 !important;
+    position: relative !important;
+  }
+  .tetrons-editor__modal-overlay,
+  .ai-modal-overlay,
+  .voice-modal-modalOverlay,
+  .math-equation-modalOverlay,
+  .modal-backdrop,
+  .insert-group-modalBackdrop,
+  .preview-modal-overlay,
+  .confirm-modal-overlay,
+  .tetrons-modal-overlay {
+    z-index: 9999999999 !important;
+  }
+  .tetrons-editor__modal-content,
+  .ai-modal-modal,
+  .voice-modal-modalContent,
+  .math-equation-modalContent,
+  .modal-modal,
+  .insert-group-modal,
+  .preview-modal-modal,
+  .confirm-modal-modal,
+  .tetrons-modal.image-to-text-modal,
+  .help-modal {
+    z-index: 9999999999 !important;
+    position: relative;
   }
-}
-.tetrons-editor__main-area,
-.tetrons-editor__splitview {
-  overflow: visible !important;
-}
-.tetrons-toolbar__wrapper,
-.tetrons-editor__third-row,
-.tetrons-toolbar__basic {
-  position: relative !important;
-  z-index: 500 !important;
-}
-.tetrons-editor__area,
-.tetrons-editor__area .ProseMirror {
-  z-index: 1 !important;
-  position: relative !important;
-}
-.tetrons-editor__modal-overlay,
-.ai-modal-overlay,
-.voice-modal-modalOverlay,
-.math-equation-modalOverlay,
-.modal-backdrop,
-.insert-group-modalBackdrop,
-.preview-modal-overlay,
-.confirm-modal-overlay,
-.tetrons-modal-overlay {
-  z-index: 9999999999 !important;
-}
-.tetrons-editor__modal-content,
-.ai-modal-modal,
-.voice-modal-modalContent,
-.math-equation-modalContent,
-.modal-modal,
-.insert-group-modal,
-.preview-modal-modal,
-.confirm-modal-modal,
-.tetrons-modal.image-to-text-modal,
-.help-modal {
-  z-index: 9999999999 !important;
-  position: relative;
-}
-.ProseMirror table {
-  border-collapse: collapse;
-  table-layout: fixed;
-  width: 100%;
-  max-width: 100%;
-  margin: 0.75em 0;
-  background: #fff;
-}
-.ProseMirror th,
-.ProseMirror td {
-  border: 1px solid #d0d0d0;
-  padding: 6px 8px;
-  vertical-align: top;
-  word-break: break-word;
-  overflow-wrap: anywhere;
-}
-.ProseMirror th {
-  background-color: #f5f5f5;
-  font-weight: 600;
-  text-align: left;
-}
-.ProseMirror .selectedCell {
-  background: rgba(200, 200, 255, 0.4);
-}
-.ProseMirror table p {
-  margin: 0;
-}
-.ProseMirror {
-  overflow-x: auto;
-}
-@media (max-width: 768px) {
   .ProseMirror table {
-    display: block;
-    width: max-content;
+    border-collapse: collapse;
+    table-layout: fixed;
+    width: 100%;
     max-width: 100%;
+    margin: 0.75em 0;
+    background: #fff;
   }
   .ProseMirror th,
   .ProseMirror td {
-    min-width: 120px;
+    border: 1px solid #d0d0d0;
+    padding: 6px 8px;
+    vertical-align: top;
+    word-break: break-word;
+    overflow-wrap: anywhere;
   }
-}
-@media (max-width: 480px) {
-  .ProseMirror th,
-  .ProseMirror td {
-    min-width: 100px;
-    padding: 6px;
-    font-size: 13px;
+  .ProseMirror th {
+    background-color: #f5f5f5;
+    font-weight: 600;
+    text-align: left;
+  }
+  .ProseMirror .selectedCell {
+    background: rgba(200, 200, 255, 0.4);
+  }
+  .ProseMirror table p {
+    margin: 0;
+  }
+  .ProseMirror {
+    overflow-x: auto;
+  }
+  @media (max-width: 768px) {
+    .ProseMirror table {
+      display: block;
+      width: max-content;
+      max-width: 100%;
+    }
+    .ProseMirror th,
+    .ProseMirror td {
+      min-width: 120px;
+    }
+  }
+  @media (max-width: 480px) {
+    .ProseMirror th,
+    .ProseMirror td {
+      min-width: 100px;
+      padding: 6px;
+      font-size: 13px;
+    }
+  }
+  .ProseMirror .column-resize-handle {
+    position: absolute;
+    right: -2px;
+    top: 0;
+    bottom: 0;
+    width: 4px;
+    background-color: rgba(0, 0, 0, 0.15);
+    pointer-events: none;
+  }
+  .ProseMirror th:hover .column-resize-handle,
+  .ProseMirror td:hover .column-resize-handle {
+    pointer-events: auto;
+  }
+  .ProseMirror table:focus-within {
+    outline: 2px solid rgba(100, 150, 255, 0.35);
+    outline-offset: 2px;
+  }
+  @media (min-width: 769px) {
+    .tetrons-toolbar__wrapper {
+      overflow: visible;
+      white-space: normal;
+      flex-wrap: wrap;
+    }
+  }
+  @media (max-width: 768px) {
+    .tetrons-toolbar__wrapper {
+      overflow-x: auto;
+      overflow-y: hidden;
+      white-space: nowrap;
+    }
+    .tetrons-toolbar__basic {
+      display: inline-flex;
+      flex-wrap: nowrap;
+      white-space: nowrap;
+      min-width: max-content;
+    }
+    .tetrons-toolbar__basic > *,
+    .platinum-group-platinumGroupContainer,
+    .insert-group-group,
+    .align-group-group,
+    .utility-group-group {
+      flex: 0 0 auto;
+      width: auto;
+    }
+  }
+  .tetrons-toolbar__wrapper::-webkit-scrollbar {
+    height: 6px;
+  }
+  .tetrons-toolbar__wrapper::-webkit-scrollbar-thumb {
+    background: rgba(0, 0, 0, 0.25);
+    border-radius: 3px;
   }
-}
-.ProseMirror .column-resize-handle {
-  position: absolute;
-  right: -2px;
-  top: 0;
-  bottom: 0;
-  width: 4px;
-  background-color: rgba(0, 0, 0, 0.15);
-  pointer-events: none;
-}
-.ProseMirror th:hover .column-resize-handle,
-.ProseMirror td:hover .column-resize-handle {
-  pointer-events: auto;
-}
-.ProseMirror table:focus-within {
-  outline: 2px solid rgba(100, 150, 255, 0.35);
-  outline-offset: 2px;
 }
 /*# sourceMappingURL=index.css.map */