html.lt-translating body { opacity: 0 !important; visibility: hidden !important; transition: opacity 0.3s ease-in-out; }
html.lt-translated body { opacity: 1 !important; visibility: visible !important; }
.lt-global-spinner { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 40px; height: 40px; border: 4px solid #f3f3f3; border-top: 4px solid #0073aa; border-radius: 50%; animation: lt-spin 1s linear infinite; z-index: 9999999; display: none; }
html.lt-translating .lt-global-spinner { display: block; }
@keyframes lt-spin { 0% { transform: translate(-50%, -50%) rotate(0deg); } 100% { transform: translate(-50%, -50%) rotate(360deg); } }

.lt-custom-dropdown { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }
.lt-dropdown-btn { background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(5px); border: 1px solid #e0e0e0; padding: 6px 14px; border-radius: 20px; box-shadow: 0 4px 15px rgba(0,0,0,0.1); cursor: pointer; display: flex; align-items: center; gap: 8px; font-weight: 600; font-size: 13px; color: #444; transition: 0.2s; min-width: 120px; justify-content: space-between; margin: 0 !important; }
.lt-dropdown-btn:hover { box-shadow: 0 6px 20px rgba(0,0,0,0.15); }
.lt-btn-icon img { width: 18px; height: 13px; border-radius: 2px; object-fit: cover; display: block; }
.lt-dropdown-list { display: none; position: absolute; bottom: 100%; left: 0; margin-bottom: 8px; background: #fff; border-radius: 10px; box-shadow: 0 5px 25px rgba(0,0,0,0.2); min-width: 100%; border: 1px solid #eaeaea; max-height: 60vh; overflow-y: auto; overflow-x: hidden; }
.lt-custom-dropdown.active .lt-dropdown-list { display: block; }

.lt-custom-dropdown.lt-pos-edge { bottom: 0 !important; }
.lt-custom-dropdown.lt-pos-edge .lt-dropdown-btn { border-bottom-left-radius: 0 !important; border-bottom-right-radius: 0 !important; border-bottom: none !important; padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px)) !important; transform: translateY(1px); }
.lt-custom-dropdown.lt-pos-top .lt-dropdown-list { top: 100%; bottom: auto; margin-top: 8px; margin-bottom: 0; }

.lt-dropdown-list::-webkit-scrollbar { width: 5px; }
.lt-dropdown-list::-webkit-scrollbar-track { background: #f1f1f1; border-radius: 10px; }
.lt-dropdown-list::-webkit-scrollbar-thumb { background: #ccc; border-radius: 10px; }
.lt-lang-option { padding: 10px 14px; display: flex; align-items: center; gap: 10px; cursor: pointer; color: #444; text-decoration: none; font-size: 13px; border-bottom: 1px solid #f5f5f5; transition: 0.2s;}
.lt-lang-option:last-child { border-bottom: none; }
.lt-lang-option:hover { background: #f0f8ff; color: #0073aa; }
.lt-lang-option img { width: 18px; height: 13px; border-radius: 2px; object-fit: cover; flex-shrink: 0; }
.lt-status { font-size: 10px; margin-left: 3px; color: #0073aa; }

/* * ANTI-FLICKER SYSTEM: 
 * Hides the entire page while the plugin is fetching translations or applying JSON cache.
 * This prevents the "Flash of Untranslated Content" (FOUC).
 */
html.lt-translating body {
    opacity: 0 !important;
    visibility: hidden !important;
}

/* * Smoothly fades in the page once the DOM replacement is finished.
 */
html.lt-translated body {
    opacity: 1 !important;
    visibility: visible !important;
    transition: opacity 0.2s ease-in-out !important;
}