/* QSM_TRANSLATE_WIDGET_2026_06_22
   Client-side language switch only. Does not change original lessons, summaries, or subscription logic. */

#qsm-translate-widget,
#qsm-translate-widget * {
  box-sizing: border-box;
}

#qsm-translate-widget {
  position: fixed;
  right: 14px;
  bottom: 14px;
  z-index: 2147483000;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 7px;
  border-radius: 999px;
  background: rgba(13, 27, 42, 0.94);
  border: 1px solid rgba(255,255,255,0.16);
  box-shadow: 0 12px 35px rgba(0,0,0,0.28);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  direction: ltr !important;
  isolation: isolate;
}

#qsm-translate-widget .qsm-tw-label {
  color: #fff;
  font-weight: 800;
  font-size: 12px;
  padding: 0 7px 0 4px;
  letter-spacing: .2px;
  white-space: nowrap;
}

#qsm-translate-widget button {
  appearance: none;
  border: 0;
  cursor: pointer;
  padding: 8px 11px;
  border-radius: 999px;
  background: rgba(255,255,255,0.10);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  min-width: 42px;
  transition: transform .12s ease, background .12s ease;
}

#qsm-translate-widget button:hover {
  transform: translateY(-1px);
  background: rgba(255,255,255,0.18);
}

#qsm-translate-widget button.qsm-tw-active {
  background: #e9c46a;
  color: #0d1b2a;
}

#google_translate_element,
.goog-te-banner-frame,
.goog-te-balloon-frame,
.goog-te-gadget-icon,
.goog-te-menu-frame {
  display: none !important;
  visibility: hidden !important;
}

body {
  top: 0 !important;
}

body > .skiptranslate:not(#qsm-translate-widget) {
  display: none !important;
}

body > #qsm-translate-widget {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

@media (max-width: 640px) {
  #qsm-translate-widget {
    right: 10px;
    bottom: 10px;
    padding: 6px;
    gap: 4px;
  }

  #qsm-translate-widget .qsm-tw-label {
    display: none;
  }

  #qsm-translate-widget button {
    padding: 8px 10px;
    min-width: 40px;
    font-size: 12px;
  }
}


/* QSM_TRANSLATE_WIDGET_VISIBLE_FIX_2026_06_22 */
html body #qsm-translate-widget {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}


/* QSM_TRANSLATE_CLICK_FIX_2026_06_22
   Keep Google Translate internal combo alive offscreen.
   Do not hide #google_translate_element with display:none. */
html body #qsm-translate-widget #google_translate_element {
  display: block !important;
  visibility: visible !important;
  opacity: 0 !important;
  position: absolute !important;
  left: -10000px !important;
  top: auto !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

html body #qsm-translate-widget .goog-te-gadget,
html body #qsm-translate-widget .goog-te-combo {
  display: block !important;
  visibility: visible !important;
}

html body #qsm-translate-widget .qsm-tw-status {
  color: rgba(255,255,255,.82);
  font-size: 11px;
  font-weight: 700;
  padding: 0 5px;
  white-space: nowrap;
}

@media (max-width: 640px) {
  html body #qsm-translate-widget .qsm-tw-status {
    display: none;
  }
}

/* QSM_SERVER_TRANSLATION_WIDGET_VISIBLE_2026_06_22 */
html body #qsm-translate-widget {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* QSM_SMOOTH_LANGUAGE_SWITCH_2026_06_22 */
html body #qsm-translate-widget {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

html body #qsm-lang-loading {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483647 !important;
  background: rgba(13, 27, 42, .72) !important;
  color: white !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  text-align: center !important;
  backdrop-filter: blur(4px) !important;
  direction: ltr !important;
}

/* QSM_LANGUAGE_SWITCH_ROUTES_2026_06_22 */
html body #qsm-translate-widget {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

html body #qsm-translate-widget a.qsm-tw-btn {
  appearance: none !important;
  border: 0 !important;
  cursor: pointer !important;
  padding: 8px 11px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,0.10) !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  min-width: 42px !important;
  text-align: center !important;
  text-decoration: none !important;
  transition: transform .12s ease, background .12s ease !important;
}

html body #qsm-translate-widget a.qsm-tw-btn:hover {
  transform: translateY(-1px) !important;
  background: rgba(255,255,255,0.18) !important;
}

html body #qsm-translate-widget a.qsm-tw-btn.qsm-tw-active {
  background: #e9c46a !important;
  color: #0d1b2a !important;
}

html body #qsm-lang-loading {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483647 !important;
  background: rgba(13, 27, 42, .72) !important;
  color: white !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  text-align: center !important;
  backdrop-filter: blur(4px) !important;
  direction: ltr !important;
}

/* QSM_TRANSLATE_WIDGET_PROD_RESPONSIVE_2026_06_22 */
html body #qsm-translate-widget {
  position: fixed !important;
  right: 14px !important;
  bottom: 14px !important;
  z-index: 2147483000 !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 7px !important;
  border-radius: 999px !important;
  background: rgba(13,27,42,.94) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  box-shadow: 0 12px 35px rgba(0,0,0,.28) !important;
  font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  direction: ltr !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

html body #qsm-translate-widget .qsm-tw-label {
  color: #fff !important;
  font-weight: 800 !important;
  font-size: 12px !important;
  padding: 0 7px 0 4px !important;
  white-space: nowrap !important;
}

html body #qsm-translate-widget a.qsm-tw-btn {
  cursor: pointer !important;
  padding: 9px 12px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.10) !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  min-width: 44px !important;
  text-align: center !important;
  text-decoration: none !important;
  line-height: 1 !important;
}

html body #qsm-translate-widget a.qsm-tw-btn.qsm-tw-active {
  background: #e9c46a !important;
  color: #0d1b2a !important;
}

html body #qsm-lang-loading {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483647 !important;
  background: rgba(13,27,42,.72) !important;
  color: white !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  text-align: center !important;
  backdrop-filter: blur(4px) !important;
}

@media (max-width: 640px) {
  html body #qsm-translate-widget {
    left: 50% !important;
    right: auto !important;
    bottom: 12px !important;
    transform: translateX(-50%) !important;
    padding: 7px !important;
  }
  html body #qsm-translate-widget .qsm-tw-label {
    display: none !important;
  }
  html body #qsm-translate-widget a.qsm-tw-btn {
    min-width: 58px !important;
    padding: 11px 14px !important;
    font-size: 13px !important;
  }
}

/* QSM_TRANSLATE_WIDGET_FINAL_CLEAN_15B_RESPONSIVE_2026_06_22 */
html body #qsm-translate-widget {
  position: fixed !important;
  right: 14px !important;
  bottom: 14px !important;
  z-index: 2147483000 !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 7px !important;
  border-radius: 999px !important;
  background: rgba(13,27,42,.94) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  box-shadow: 0 12px 35px rgba(0,0,0,.28) !important;
  font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  direction: ltr !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

html body #qsm-translate-widget .qsm-tw-label {
  color: #fff !important;
  font-weight: 800 !important;
  font-size: 12px !important;
  padding: 0 7px 0 4px !important;
  white-space: nowrap !important;
}

html body #qsm-translate-widget a.qsm-tw-btn {
  cursor: pointer !important;
  padding: 9px 12px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.10) !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  min-width: 44px !important;
  text-align: center !important;
  text-decoration: none !important;
  line-height: 1 !important;
}

html body #qsm-translate-widget a.qsm-tw-btn.qsm-tw-active {
  background: #e9c46a !important;
  color: #0d1b2a !important;
}

html body #qsm-lang-loading {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483647 !important;
  background: rgba(13,27,42,.72) !important;
  color: white !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  text-align: center !important;
  backdrop-filter: blur(4px) !important;
}

@media (max-width: 640px) {
  html body #qsm-translate-widget {
    left: 50% !important;
    right: auto !important;
    bottom: 12px !important;
    transform: translateX(-50%) !important;
    padding: 7px !important;
  }

  html body #qsm-translate-widget .qsm-tw-label {
    display: none !important;
  }

  html body #qsm-translate-widget a.qsm-tw-btn {
    min-width: 58px !important;
    padding: 11px 14px !important;
    font-size: 13px !important;
  }
}

/* QSM_MOBILE_WIDGET_COMPACT_FIX_2026_06_22 */
@media (max-width: 640px) {
  html body #qsm-translate-widget {
    top: calc(env(safe-area-inset-top, 0px) + 82px) !important;
    right: 10px !important;
    left: auto !important;
    bottom: auto !important;
    transform: none !important;
    padding: 4px !important;
    gap: 4px !important;
    border-radius: 14px !important;
    background: rgba(13,27,42,.88) !important;
    box-shadow: 0 6px 18px rgba(0,0,0,.18) !important;
    max-width: fit-content !important;
  }

  html body #qsm-translate-widget .qsm-tw-label {
    display: none !important;
  }

  html body #qsm-translate-widget a.qsm-tw-btn,
  html body #qsm-translate-widget button.qsm-tw-btn,
  html body #qsm-translate-widget button[data-qsm-lang] {
    min-width: 40px !important;
    padding: 8px 10px !important;
    font-size: 12px !important;
    border-radius: 10px !important;
  }

  html body #qsm-lang-loading {
    font-size: 15px !important;
    padding: 20px !important;
  }
}

/* QSM_SERVER_ONLY_LANGUAGE_CONTROLLER_CSS_2026_06_22 */
html body #qsm-translate-widget {
  position: fixed !important;
  right: 14px !important;
  bottom: 14px !important;
  z-index: 2147483000 !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 7px !important;
  border-radius: 999px !important;
  background: rgba(13,27,42,.94) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  box-shadow: 0 12px 35px rgba(0,0,0,.28) !important;
  font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  direction: ltr !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}
html body #qsm-translate-widget .qsm-tw-label {
  color: #fff !important;
  font-weight: 800 !important;
  font-size: 12px !important;
  padding: 0 7px 0 4px !important;
  white-space: nowrap !important;
}
html body #qsm-translate-widget a.qsm-tw-btn {
  cursor: pointer !important;
  padding: 9px 12px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.10) !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  min-width: 44px !important;
  text-align: center !important;
  text-decoration: none !important;
  line-height: 1 !important;
}
html body #qsm-translate-widget a.qsm-tw-btn.qsm-tw-active {
  background: #e9c46a !important;
  color: #0d1b2a !important;
}
html body #qsm-lang-loading {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483647 !important;
  background: rgba(13,27,42,.72) !important;
  color: white !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  text-align: center !important;
  backdrop-filter: blur(4px) !important;
}
@media (max-width: 640px) {
  html body #qsm-translate-widget {
    top: calc(env(safe-area-inset-top, 0px) + 82px) !important;
    right: 10px !important;
    left: auto !important;
    bottom: auto !important;
    transform: none !important;
    padding: 4px !important;
    gap: 4px !important;
    border-radius: 14px !important;
    max-width: fit-content !important;
  }
  html body #qsm-translate-widget .qsm-tw-label { display: none !important; }
  html body #qsm-translate-widget a.qsm-tw-btn {
    min-width: 40px !important;
    padding: 8px 10px !important;
    font-size: 12px !important;
    border-radius: 10px !important;
  }
}


/* QSM FINAL EN FR TRANSLATE BUTTON V2 START */
html body #qsm-translate-widget {
  position: fixed !important;
  right: 14px !important;
  bottom: 14px !important;
  z-index: 2147483000 !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 7px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, rgba(4,35,52,.96), rgba(10,91,120,.94)) !important;
  border: 1px solid rgba(53,213,230,.36) !important;
  box-shadow: 0 16px 42px rgba(0,0,0,.30) !important;
  backdrop-filter: blur(14px) !important;
  direction: ltr !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

html body #qsm-translate-widget .qsm-tw-label {
  color: rgba(235,255,255,.86) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  padding: 0 7px 0 5px !important;
  white-space: nowrap !important;
}

html body #qsm-translate-widget a.qsm-tw-btn {
  cursor: pointer !important;
  min-width: 72px !important;
  padding: 10px 13px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.10) !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  text-align: center !important;
  text-decoration: none !important;
  line-height: 1 !important;
}

html body #qsm-translate-widget a.qsm-tw-btn.qsm-tw-active {
  background: linear-gradient(135deg, #ffffff, #d8fbff) !important;
  color: #073044 !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.16) !important;
}

@media (max-width: 640px) {
  html body #qsm-translate-widget {
    left: 50% !important;
    right: auto !important;
    bottom: calc(10px + env(safe-area-inset-bottom, 0px)) !important;
    transform: translateX(-50%) !important;
    width: min(94vw, 360px) !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 7px !important;
  }

  html body #qsm-translate-widget .qsm-tw-label {
    display: none !important;
  }

  html body #qsm-translate-widget a.qsm-tw-btn {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    padding: 12px 10px !important;
    font-size: 13px !important;
  }
}
/* QSM FINAL EN FR TRANSLATE BUTTON V2 END */
