/* ===================================
   RTL CSS - HÉBREU UNIQUEMENT
   Fichier à charger sur les pages en hébreu
   =================================== */

/* === GUIDE.PHP - Tutorial Container === */
/* EN RTL : direction:rtl inverse déjà automatiquement !
   Pas besoin de row-reverse (sinon double inversion)
   Spécificité renforcée avec html[dir="rtl"] pour override */
html[dir="rtl"] .tutorial-container,
html[lang="he"] .tutorial-container,
html[lang="ar"] .tutorial-container {
    flex-direction: row !important;         /* Pas row-reverse ! */
    left: 50% !important;                   /* Centre horizontal */
    transform: translateX(-50%) !important; /* Décale de -50% */
    right: auto !important;                 /* Reset right */
    width: auto !important;                 /* Laisse flex calculer */
    max-width: 1750px !important;           /* Limite maximale */
}

/* === BACKTESTING - Guru Avatars === */

/* 1. Guru dans les titres des blocs */
.bt-advcat-title .guide-trigger-card {
    float: left !important;
    margin-left: -20px !important;
    margin-right: 0 !important;
}

/* 2. Guru dans les headers d'accordéon */
.accordion-header .guide-trigger-card {
    left: 50px !important;
    right: auto !important;
}

/* 3. Guru dans les cartes d'indicateurs */
.guide-buttons-wrapper {
    flex-direction: row-reverse !important;
}

.guide-buttons-wrapper .guide-trigger-card {
    margin-right: 0 !important;
    margin-left: 10px !important;
}

/* 4. Ajustement du padding pour les textes RTL */
.bt-advcat-title {
    padding-left: 60px !important;
    padding-right: 10px !important;
}

/* 5. Icône de stratégie */
.guide-buttons-wrapper .btn-strategy {
    margin-right: 0 !important;
    margin-left: auto !important;
}

/* 6. Bubble Guru position en RTL */
.bubble-guru {
    right: -200px !important;
    left: auto !important;
}

/* 7. Ajustement général des headers */
.accordion-header {
    padding-left: 100px !important;
    padding-right: 50px !important;
}

/* 8. Panneau flottant S/R */
.sr-floating-panel {
    right: auto !important;
    left: 20px !important;
}
