/* ==================== SOPORTE RTL (Right-to-Left) ==================== */
/* Estilos para idiomas de derecha a izquierda: Hebreo, Árabe, Persa, Urdu */

/* Aplicar RTL a todo el documento cuando está en modo RTL */
[dir="rtl"],
.rtl-mode,
html[dir="rtl"] body,
html[dir="rtl"] .contenedor-principal {
    direction: rtl;
    text-align: right;
}

/* Invertir márgenes y padding en RTL */
[dir="rtl"] *,
.rtl-mode * {
    /* Los márgenes y padding se ajustarán automáticamente con las siguientes reglas */
}

/* Contenedores principales */
[dir="rtl"] .contenedor-principal,
.rtl-mode .contenedor-principal {
    direction: rtl;
}

[dir="rtl"] .chat-container,
.rtl-mode .chat-container {
    direction: rtl;
}

[dir="rtl"] #main-content-wrapper,
.rtl-mode #main-content-wrapper {
    direction: rtl;
}

/* Sidebar - Invertir posición */
[dir="rtl"] #sidebar,
.rtl-mode #sidebar {
    right: 0;
    left: auto;
    transform: translateX(100%);
}

[dir="rtl"] #sidebar.open,
.rtl-mode #sidebar.open {
    transform: translateX(0);
}

/* Overlay del sidebar */
[dir="rtl"] #sidebar-overlay,
.rtl-mode #sidebar-overlay {
    right: 0;
    left: auto;
}

/* Botones y controles - Invertir iconos y posiciones */
[dir="rtl"] .boton-encabezado,
.rtl-mode .boton-encabezado {
    margin-left: 0;
    margin-right: 8px;
}

[dir="rtl"] .boton-abrir-sidebar,
.rtl-mode .boton-abrir-sidebar {
    right: 20px;
    left: auto;
}

[dir="rtl"] .boton-cerrar-sidebar,
.rtl-mode .boton-cerrar-sidebar {
    left: 20px;
    right: auto;
}

/* Chat - Invertir burbujas de mensaje */
[dir="rtl"] .mensaje-usuario,
.rtl-mode .mensaje-usuario {
    text-align: right;
    justify-content: flex-end;
}

[dir="rtl"] .mensaje-ia,
.rtl-mode .mensaje-ia {
    text-align: right;
    justify-content: flex-start;
}

[dir="rtl"] .burbuja-usuario,
.rtl-mode .burbuja-usuario {
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 18px;
}

[dir="rtl"] .burbuja-ia,
.rtl-mode .burbuja-ia {
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 18px;
}

/* Botones de lectura del chat */
[dir="rtl"] .chat-message-read-btn,
.rtl-mode .chat-message-read-btn {
    left: 10px;
    right: auto;
}

/* Área de entrada del chat */
[dir="rtl"] .area-entrada,
.rtl-mode .area-entrada {
    direction: rtl;
    text-align: right;
}

[dir="rtl"] .area-texto,
.rtl-mode .area-texto {
    direction: rtl;
    text-align: right;
}

[dir="rtl"] textarea,
.rtl-mode textarea {
    direction: rtl;
    text-align: right;
}

/* Botones de acción del chat */
[dir="rtl"] .botones-acciones,
.rtl-mode .botones-acciones {
    flex-direction: row-reverse;
}

[dir="rtl"] .boton-entrada,
.rtl-mode .boton-entrada {
    margin-left: 0;
    margin-right: 8px;
}

/* Encabezado del chat */
[dir="rtl"] .encabezado-chat,
.rtl-mode .encabezado-chat {
    flex-direction: row-reverse;
}

[dir="rtl"] .acciones-encabezado,
.rtl-mode .acciones-encabezado {
    flex-direction: row-reverse;
}

/* Contenedor de historial */
[dir="rtl"] .contenedor-historial-moderno,
.rtl-mode .contenedor-historial-moderno {
    direction: rtl;
    text-align: right;
}

/* Versículos de la Biblia */
[dir="rtl"] .versiculo,
.rtl-mode .versiculo {
    direction: rtl;
    text-align: right;
}

[dir="rtl"] .numero-versiculo,
.rtl-mode .numero-versiculo {
    margin-left: 8px;
    margin-right: 0;
}

/* Barra de navegación de libros y capítulos */
[dir="rtl"] #bookBar,
.rtl-mode #bookBar {
    flex-direction: row-reverse;
}

[dir="rtl"] #chapterBar,
.rtl-mode #chapterBar {
    flex-direction: row-reverse;
}

[dir="rtl"] .selection-bar,
.rtl-mode .selection-bar {
    flex-direction: row-reverse;
}

/* Botones de navegación */
[dir="rtl"] .boton-nav,
.rtl-mode .boton-nav {
    margin-left: 0;
    margin-right: 8px;
}

/* Modal de notas de estudio */
[dir="rtl"] #chatResponseModal,
.rtl-mode #chatResponseModal {
    direction: rtl;
}

[dir="rtl"] .study-notes-header,
.rtl-mode .study-notes-header {
    flex-direction: row-reverse;
}

[dir="rtl"] .modal-header-actions,
.rtl-mode .modal-header-actions {
    flex-direction: row-reverse;
}

[dir="rtl"] .modal-close,
.rtl-mode .modal-close {
    left: 20px;
    right: auto;
}

[dir="rtl"] .study-notes-body,
.rtl-mode .study-notes-body {
    direction: rtl;
    text-align: right;
}

[dir="rtl"] .notes-actions,
.rtl-mode .notes-actions {
    flex-direction: row-reverse;
}

/* Títulos y párrafos en RTL */
[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3,
[dir="rtl"] h4,
[dir="rtl"] h5,
[dir="rtl"] h6,
.rtl-mode h1,
.rtl-mode h2,
.rtl-mode h3,
.rtl-mode h4,
.rtl-mode h5,
.rtl-mode h6 {
    text-align: right;
    direction: rtl;
}

[dir="rtl"] p,
.rtl-mode p {
    text-align: right;
    direction: rtl;
}

/* Listas en RTL */
[dir="rtl"] ul,
[dir="rtl"] ol,
.rtl-mode ul,
.rtl-mode ol {
    padding-right: 20px;
    padding-left: 0;
    direction: rtl;
}

[dir="rtl"] li,
.rtl-mode li {
    text-align: right;
    direction: rtl;
}

/* Widget GTranslate - Posición en RTL */
[dir="rtl"] #gtranslate_floating_widget,
.rtl-mode #gtranslate_floating_widget {
    right: 20px !important;
    left: auto !important;
}

[dir="rtl"] #gtranslate_wrapper,
.rtl-mode #gtranslate_wrapper {
    right: 20px !important;
    left: auto !important;
}

/* Botones de tema y accesibilidad */
[dir="rtl"] #boton-tema,
.rtl-mode #boton-tema {
    margin-left: 0;
    margin-right: 8px;
}

[dir="rtl"] #accessibilityBtn,
.rtl-mode #accessibilityBtn {
    right: 20px;
    left: auto;
}

/* Panel de accesibilidad */
[dir="rtl"] .accessibility-panel,
.rtl-mode .accessibility-panel {
    direction: rtl;
}

[dir="rtl"] .accessibility-header,
.rtl-mode .accessibility-header {
    flex-direction: row-reverse;
}

[dir="rtl"] .close-accessibility,
.rtl-mode .close-accessibility {
    left: 20px;
    right: auto;
}

/* Formularios y inputs */
[dir="rtl"] input[type="text"],
[dir="rtl"] input[type="email"],
[dir="rtl"] input[type="password"],
[dir="rtl"] input[type="search"],
[dir="rtl"] select,
.rtl-mode input[type="text"],
.rtl-mode input[type="email"],
.rtl-mode input[type="password"],
.rtl-mode input[type="search"],
.rtl-mode select {
    direction: rtl;
    text-align: right;
    padding-right: 12px;
    padding-left: 12px;
}

/* Placeholders en RTL */
[dir="rtl"] input::placeholder,
[dir="rtl"] textarea::placeholder,
.rtl-mode input::placeholder,
.rtl-mode textarea::placeholder {
    direction: rtl;
    text-align: right;
}

/* Iconos - Invertir cuando sea necesario */
[dir="rtl"] .fa-chevron-left::before,
.rtl-mode .fa-chevron-left::before {
    content: "\f054"; /* chevron-right */
}

[dir="rtl"] .fa-chevron-right::before,
.rtl-mode .fa-chevron-right::before {
    content: "\f053"; /* chevron-left */
}

[dir="rtl"] .fa-arrow-left::before,
.rtl-mode .fa-arrow-left::before {
    content: "\f061"; /* arrow-right */
}

[dir="rtl"] .fa-arrow-right::before,
.rtl-mode .fa-arrow-right::before {
    content: "\f060"; /* arrow-left */
}

/* Scrollbar - Posición en RTL */
[dir="rtl"] ::-webkit-scrollbar,
.rtl-mode ::-webkit-scrollbar {
    direction: rtl;
}

/* Notificaciones */
[dir="rtl"] .notificacion,
.rtl-mode .notificacion {
    right: 20px;
    left: auto;
    text-align: right;
}

/* Tooltips */
[dir="rtl"] [title],
.rtl-mode [title] {
    direction: rtl;
}

/* Tablas */
[dir="rtl"] table,
.rtl-mode table {
    direction: rtl;
}

[dir="rtl"] th,
[dir="rtl"] td,
.rtl-mode th,
.rtl-mode td {
    text-align: right;
}

/* Citas y blockquotes */
[dir="rtl"] blockquote,
.rtl-mode blockquote {
    border-right: 4px solid var(--primary-color);
    border-left: none;
    padding-right: 15px;
    padding-left: 0;
    margin-right: 20px;
    margin-left: 0;
}

/* Código y pre */
[dir="rtl"] code,
[dir="rtl"] pre,
.rtl-mode code,
.rtl-mode pre {
    direction: ltr; /* El código siempre se lee de izquierda a derecha */
    text-align: left;
}

/* Mezcla de texto RTL y LTR (para código dentro de texto RTL) */
[dir="rtl"] .ltr-text,
.rtl-mode .ltr-text {
    direction: ltr;
    text-align: left;
    display: inline-block;
}

[dir="ltr"] .rtl-text,
.ltr-mode .rtl-text {
    direction: rtl;
    text-align: right;
    display: inline-block;
}

/* Ajustes específicos para hebreo */
[lang="he"],
[lang="iw"] {
    font-family: 'Segoe UI', 'Arial Hebrew', 'David', 'Gisha', 'Miriam', 'Rod', 'Tahoma', sans-serif;
}

/* Ajustes específicos para árabe */
[lang="ar"] {
    font-family: 'Segoe UI', 'Tahoma', 'Arial', 'Arabic Typesetting', 'Simplified Arabic', sans-serif;
}

/* Ajustes específicos para persa (Farsi) */
[lang="fa"] {
    font-family: 'Segoe UI', 'Tahoma', 'Arial', 'Nazanin', 'Lotus', sans-serif;
}

/* Ajustes específicos para urdu */
[lang="ur"] {
    font-family: 'Segoe UI', 'Tahoma', 'Arial', 'Nafees Web Naskh', 'Al Qalam Taj Nastaleeq', sans-serif;
}

/* Mejoras de legibilidad para texto RTL */
[dir="rtl"] .contenedor-historial-moderno,
.rtl-mode .contenedor-historial-moderno {
    line-height: 1.8; /* Mayor interlineado para mejor legibilidad en RTL */
}

[dir="rtl"] .burbuja-mensaje,
.rtl-mode .burbuja-mensaje {
    word-spacing: 0.1em; /* Espaciado entre palabras para mejor legibilidad */
}

/* Responsive para RTL */
@media (max-width: 768px) {
    [dir="rtl"] #sidebar,
    .rtl-mode #sidebar {
        right: 0;
        left: auto;
    }
    
    [dir="rtl"] .boton-abrir-sidebar,
    .rtl-mode .boton-abrir-sidebar {
        right: 10px;
        left: auto;
    }
    
    [dir="rtl"] #gtranslate_floating_widget,
    .rtl-mode #gtranslate_floating_widget {
        right: 10px !important;
        left: auto !important;
    }
}

/* Animaciones suaves para transición RTL/LTR */
[dir="rtl"],
[dir="ltr"],
.rtl-mode,
.ltr-mode {
    transition: direction 0.3s ease;
}

/* Asegurar que el texto hebreo y árabe se muestre correctamente */
[lang="he"],
[lang="ar"],
[lang="fa"],
[lang="ur"] {
    unicode-bidi: bidi-override;
    direction: rtl;
}

