@charset "utf-8";

.immersive-translate-input { position: absolute; inset: 0px; z-index: 2147483647; display: flex; justify-content: center; align-items: center; }

.immersive-translate-attach-loading::after { content: " "; --loading-color: #f78fb6; width: 6px; height: 6px; border-radius: 50%; display: block; margin: 12px auto; color: white; box-sizing: border-box; animation: 1.5s linear 0s infinite normal none running immersiveTranslateShadowRolling; position: absolute; top: 50%; left: 50%; transform: translate(-2000%, -50%); z-index: 100; }

.immersive-translate-loading-spinner { vertical-align: middle !important; width: 10px !important; height: 10px !important; display: inline-block !important; margin: 0px 4px !important; border-width: 2px !important; border-style: solid !important; border-color: rgba(0, 0, 0, 0.376) rgba(221, 244, 255, 0.6) rgba(221, 244, 255, 0.6) rgba(0, 0, 0, 0.376) !important; border-image: initial !important; border-radius: 50% !important; padding: 0px !important; animation: 0.6s linear 0s infinite normal none running immersive-translate-loading-animation !important; }

@-webkit-keyframes immersive-translate-loading-animation { 
  0% { transform: rotate(0deg); }
  100% { transform: rotate(359deg); }
}

@keyframes immersive-translate-loading-animation { 
  0% { transform: rotate(0deg); }
  100% { transform: rotate(359deg); }
}

.immersive-translate-input-loading { --loading-color: #f78fb6; width: 6px; height: 6px; border-radius: 50%; display: block; margin: 12px auto; position: relative; color: white; left: -100px; box-sizing: border-box; animation: 1.5s linear 0s infinite normal none running immersiveTranslateShadowRolling; }

@keyframes immersiveTranslateShadowRolling { 
  0% { box-shadow: rgba(255, 255, 255, 0) 0px 0px, rgba(255, 255, 255, 0) 0px 0px, rgba(255, 255, 255, 0) 0px 0px, rgba(255, 255, 255, 0) 0px 0px; }
  12% { box-shadow: 100px 0 var(--loading-color), 0px 0 rgba(255, 255, 255, 0),
      0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0); }
  25% { box-shadow: 110px 0 var(--loading-color), 100px 0 var(--loading-color),
      0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0); }
  36% { box-shadow: 120px 0 var(--loading-color), 110px 0 var(--loading-color),
      100px 0 var(--loading-color), 0px 0 rgba(255, 255, 255, 0); }
  50% { box-shadow: 130px 0 var(--loading-color), 120px 0 var(--loading-color),
      110px 0 var(--loading-color), 100px 0 var(--loading-color); }
  62% { box-shadow: 200px 0 rgba(255, 255, 255, 0), 130px 0 var(--loading-color),
      120px 0 var(--loading-color), 110px 0 var(--loading-color); }
  75% { box-shadow: 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0),
      130px 0 var(--loading-color), 120px 0 var(--loading-color); }
  87% { box-shadow: 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0),
      200px 0 rgba(255, 255, 255, 0), 130px 0 var(--loading-color); }
  100% { box-shadow: rgba(255, 255, 255, 0) 200px 0px, rgba(255, 255, 255, 0) 200px 0px, rgba(255, 255, 255, 0) 200px 0px, rgba(255, 255, 255, 0) 200px 0px; }
}

.immersive-translate-toast { display: flex; position: fixed; z-index: 2147483647; left: 0px; right: 0px; top: 1%; width: fit-content; padding: 12px 20px; margin: auto; overflow: auto; background: rgb(254, 246, 249); box-shadow: rgba(0, 10, 30, 0.06) 0px 4px 10px 0px; font-size: 15px; border-radius: 8px; color: rgb(51, 51, 51); }

.immersive-translate-toast-content { display: flex; flex-direction: row; align-items: center; }

.immersive-translate-toast-hidden { margin: 0px 20px 0px 72px; text-decoration: underline; cursor: pointer; }

.immersive-translate-toast-close { color: rgb(102, 102, 102); font-size: 20px; font-weight: bold; padding: 0px 10px; cursor: pointer; }

@media screen and (max-width: 768px) {
  .immersive-translate-toast { top: 0px; padding: 12px 0px 0px 10px; }
  .immersive-translate-toast-content { flex-direction: column; text-align: center; }
  .immersive-translate-toast-hidden { margin: 10px auto; }
}

.immersive-translate-dialog { position: fixed; z-index: 2147483647; display: flex; width: 300px; flex-direction: column; align-items: center; font-size: 15px; inset: 0px; margin: auto; height: fit-content; border-radius: 20px; background-color: rgb(255, 255, 255); }

.immersive-translate-modal { display: none; position: fixed; z-index: 2147483647; left: 0px; top: 0px; width: 100%; height: 100%; overflow: auto; background-color: rgba(0, 0, 0, 0.4); font-size: 15px; }

.immersive-translate-modal-content { background-color: rgb(254, 254, 254); margin: 10% auto; padding: 40px 24px 24px; border-radius: 12px; width: 350px; font-family: system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu, Cantarell, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; position: relative; }

@media screen and (max-width: 768px) {
  .immersive-translate-modal-content { margin: 25% auto !important; }
}

@media screen and (max-width: 480px) {
  .immersive-translate-modal-content { width: 80vw !important; margin: 20vh auto !important; padding: 20px 12px 12px !important; }
  .immersive-translate-modal-title { font-size: 14px !important; }
  .immersive-translate-modal-body { font-size: 13px !important; max-height: 60vh !important; }
  .immersive-translate-btn { font-size: 13px !important; padding: 8px 16px !important; margin: 0px 4px !important; }
  .immersive-translate-modal-footer { gap: 6px !important; margin-top: 16px !important; }
}

.immersive-translate-modal .immersive-translate-modal-content-in-input { max-width: 500px; }

.immersive-translate-modal-content-in-input .immersive-translate-modal-body { text-align: left; max-height: unset; }

.immersive-translate-modal-title { text-align: center; font-size: 16px; font-weight: 700; color: rgb(51, 51, 51); }

.immersive-translate-modal-body { text-align: center; font-size: 14px; font-weight: 400; color: rgb(51, 51, 51); margin-top: 24px; word-break: break-all; }

@media screen and (max-width: 768px) {
  .immersive-translate-modal-body { max-height: 250px; overflow-y: auto; }
}

.immersive-translate-close { color: rgb(102, 102, 102); position: absolute; right: 16px; top: 16px; font-size: 20px; font-weight: bold; }

.immersive-translate-close:hover, .immersive-translate-close:focus { text-decoration: none; cursor: pointer; }

.immersive-translate-modal-footer { display: flex; justify-content: center; flex-wrap: wrap; margin-top: 24px; }

.immersive-translate-btn { width: fit-content; color: rgb(255, 255, 255); background-color: rgb(234, 76, 137); border: none; font-size: 14px; margin: 0px 8px; padding: 9px 30px; border-radius: 5px; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background-color 0.3s; }

.immersive-translate-btn-container { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; }

.immersive-translate-btn:hover { background-color: rgb(240, 130, 172); }

.immersive-translate-btn:disabled { opacity: 0.6; cursor: not-allowed; }

.immersive-translate-btn:disabled:hover { background-color: rgb(234, 76, 137); }

.immersive-translate-link-btn { background-color: transparent; color: rgb(234, 76, 137); border: none; cursor: pointer; height: 30px; line-height: 30px; }

.immersive-translate-cancel-btn { background-color: rgb(89, 107, 120); }

.immersive-translate-cancel-btn:hover { background-color: rgb(65, 84, 98); }

.immersive-translate-action-btn { background-color: transparent; color: rgb(234, 76, 137); border: 1px solid rgb(234, 76, 137); }

.immersive-translate-btn svg { margin-right: 5px; }

.immersive-translate-link { cursor: pointer; user-select: none; -webkit-user-drag: none; text-decoration: none; color: rgb(234, 76, 137); -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1); }

.immersive-translate-primary-link { cursor: pointer; user-select: none; -webkit-user-drag: none; text-decoration: none; color: rgb(234, 76, 137); -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1); }

.immersive-translate-modal input[type="radio"] { margin: 0px 6px; cursor: pointer; }

.immersive-translate-modal label { cursor: pointer; }

.immersive-translate-close-action { position: absolute; top: 2px; right: 0px; cursor: pointer; }

.imt-image-status { background-color: rgba(0, 0, 0, 0.5) !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; border-radius: 16px !important; }

.imt-image-status img, .imt-image-status svg, .imt-img-loading { width: 28px !important; height: 28px !important; margin: 0px 0px 8px !important; min-height: 28px !important; min-width: 28px !important; position: relative !important; }

.imt-img-loading { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADgAAAA4CAMAAACfWMssAAAAtFBMVEUAAAD////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////oK74hAAAAPHRSTlMABBMIDyQXHwyBfFdDMSw+OjXCb+5RG51IvV/k0rOqlGRM6KKMhdvNyZBz9MaupmxpWyj437iYd/yJVNZeuUC7AAACt0lEQVRIx53T2XKiUBCA4QYOiyCbiAsuuGBcYtxiYtT3f6/pbqoYHVFO5r+iivpo6DpAWYpqeoFfr9f90DsYAuRSWkFnPO50OgR9PwiCUFcl2GEcx+N/YBh6pvKaefHlUgZd1zVe0NbYcQjGBfzrPE8Xz8aF+71D8gG6DHFPpc4a7xFiCDuhaWgKgGIJQ3d5IMGDrpS4S5KgpIm+en9f6PlAhKby4JwEIxlYJV9h5k5nee9GoxHJ2IDSNB0dwdad1NAxDJ/uXDHYmebdk4PdbkS58CIVHdYSUHTYYRWOJblWSyu2lmy3KNFVJNBhxcuGW4YBVCbYGRZwIooipHsNqjM4FbgOQqQqSKQQU9V8xmi1QlgHqQQ6DDBvRUVCDirs+EzGDGOQTCATgtYTnbCVLgsVgRE0T1QE0qHCFAht2z6dLvJQs3Lo2FQoDxWNUiBhaP4eRgwNkI+dAjVOA/kUrIDwf3CG8NfNOE0eiFotSuo+rBiq8tD9oY4Qzc6YJw99hl1wzpQvD7ef2M8QgnOGJfJw+EltQc+oX2yn907QB22WZcvlUpd143dqQu+8pCJZuGE4xCuPXJqqcs5sNpsI93Rmzym1k4Npk+oD1SH3/a3LOK/JpUBpWfqNySxWzCfNCUITuDG5dtuphrUJ1myeIE9bIsPiKrfqTai5WZxbhtNphYx6GEIHihyGFTI69lje/rxajdh0s0msZ0zYxyPLhYCb1CyHm9Qsd2H37Y3lugVwL9kNh8Ot8cha6fUNQ8nuXi5z9/ExsAO4zQrb/ev1yrCB7lGyQzgYDGuxq1toDN/JGvN+HyWNHKB7zEoK+PX11e12G431erGYzwmytAWU56fkMHY5JJnDRR2eZji3AwtIcrEV8Cojat/BdQ7XOwGV1e1hDjGGjXbdArm8uJZtCH5MbcctVX8A1WpqumJHwckAAAAASUVORK5CYII="); background-size: 28px 28px; animation: 1s linear 0s infinite normal none running image-loading-rotate !important; }

.imt-image-status span { color: var(--bg-2, #fff) !important; font-size: 14px !important; line-height: 14px !important; font-weight: 500 !important; font-family: "PingFang SC", Arial, sans-serif !important; }

.imt-primary-button { display: flex; padding: 12px 80px; justify-content: center; align-items: center; gap: 8px; border-radius: 8px; background: rgb(234, 76, 137); color: rgb(255, 255, 255); font-size: 16px; font-style: normal; font-weight: 700; line-height: 24px; border: none; cursor: pointer; }

.imt-retry-text { color: rgb(153, 153, 153); text-align: center; font-size: 14px; font-style: normal; font-weight: 400; line-height: 21px; cursor: pointer; }

.imt-action-container { display: flex; flex-direction: column; gap: 12px; }

.imt-modal-content-text { text-align: left; color: rgb(51, 51, 51); font-size: 16px; font-weight: 400; line-height: 24px; }

@keyframes image-loading-rotate { 
  0% { transform: rotate(360deg); }
  100% { transform: rotate(0deg); }
}

.imt-linear-gradient-text { background: linear-gradient(90deg, rgb(0, 166, 255) 0%, rgb(195, 105, 255) 52.4%, rgb(255, 69, 144) 100%) text; -webkit-text-fill-color: transparent; }

.imt-flex-center { display: flex; align-items: center; justify-content: center; }

.imt-linear-black-btn { border-radius: 50px; background: linear-gradient(66deg, rgb(34, 34, 34) 19%, rgb(105, 105, 105) 94.25%); height: 48px; width: 100%; color: rgb(255, 255, 255); font-size: 16px; font-weight: 700; display: flex; align-items: center; cursor: pointer; justify-content: center; }