/* ================================================================
   Google Translate Widget — Position & Appearance
   ================================================================ */
#google_translate_element {
    position: fixed;
    top: 12px;
    left: 12px;
    z-index: 99999;
    background: #fff;
    border-radius: 8px;
    padding: 6px 10px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.12);
}

body.rtl #google_translate_element {
    left: auto;
    right: 12px;
}

/* Hide Google Translate top-bar that pushes page down */
.skiptranslate {
    display: none !important;
}

body {
    top: 0 !important;
}

/* Keep the inline widget visible */
#google_translate_element .skiptranslate {
    display: block !important;
}

/* Clean up the GT select dropdown */
.goog-te-gadget {
    font-size: 0 !important;
}

.goog-te-gadget .goog-te-combo {
    font-size: 13px !important;
    font-family: 'Cairo', 'Inter', sans-serif !important;
    padding: 4px 8px;
    border: 1px solid #ddd;
    border-radius: 5px;
    outline: none;
    cursor: pointer;
    background: #fff;
    color: #333;
}

.goog-te-gadget>span {
    display: none !important;
}

/* ================================================================
   Layout Protection — Prevent Google Translate from breaking RTL
   ================================================================ */

/* Lock direction on all key containers */
body.rtl,
body.rtl .login-container,
body.rtl .dashboard-container,
body.rtl .sidebar,
body.rtl .main-content,
body.rtl .content-wrapper {
    direction: rtl !important;
}

/* Lock text-align on critical elements */
body.rtl .input-group label,
body.rtl h2,
body.rtl .form-group label,
body.rtl .content-wrapper h1,
body.rtl th {
    text-align: right !important;
}

body.rtl .login-form-content {
    text-align: right !important;
}

/* ================================================================
   RTL Overrides — Login Page
   ================================================================ */
body.rtl {
    font-family: 'Cairo', 'Inter', sans-serif;
    direction: rtl;
}

body.rtl .login-container {
    flex-direction: row-reverse;
}

body.rtl .logo {
    text-align: left;
}



body.rtl .input-wrapper input {
    padding: 16px 48px;
    text-align: right;
}

body.rtl .form-actions {
    flex-direction: row-reverse;
}

/* ================================================================
   RTL Overrides — Dashboard & Inner Pages
   ================================================================ */
body.rtl .sidebar {
    border-right: none;
    border-left: 1px solid #e0e0e0;
}

body.rtl .main-content {
    margin-left: 0;
    margin-right: 260px;
}

body.rtl .nav-links li a:hover,
body.rtl .nav-links li a.active {
    border-right: none;
    border-left: 3px solid #015599;
}

body.rtl .nav-links li a {
    flex-direction: row-reverse;
    text-align: right;
}

body.rtl .top-bar {
    justify-content: flex-start;
}

body.rtl .user-info {
    flex-direction: row-reverse;
}

body.rtl .template-bar {
    flex-direction: row-reverse;
}

body.rtl .btn-row {
    flex-direction: row-reverse;
}

body.rtl .drop-zone h3,
body.rtl .drop-zone p {
    direction: rtl;
}

body.rtl .edit-badge {
    flex-direction: row-reverse;
    text-align: right;
}

body.rtl .verify-bar {
    flex-direction: row-reverse;
}

body.rtl .meta-bar {
    flex-direction: row-reverse;
}

body.rtl .meta-bar .info span {
    margin-right: 0;
    margin-left: 20px;
}

/* ================================================================
   Responsive RTL
   ================================================================ */
@media (max-width: 900px) {
    body.rtl .login-container {
        flex-direction: column;
    }

    body.rtl .logo {
        text-align: right;
        justify-content: flex-start;
    }

    body.rtl h2 {
        text-align: right !important;
    }
}

@media (max-width: 768px) {
    body.rtl .main-content {
        margin-right: 0;
    }

    body.rtl .sidebar {
        position: relative;
        width: 100%;
        height: auto;
    }

    #google_translate_element {
        top: 8px;
        left: 8px;
        right: auto;
    }

    body.rtl #google_translate_element {
        left: auto;
        right: 8px;
    }
}

/* ================================================================
   Print: hide translate widget
   ================================================================ */
@media print {

    #google_translate_element,
    .skiptranslate {
        display: none !important;
    }
}