/**
 * FontViewer - RTL (Right-to-Left) Support
 * For Arabic and other RTL languages
 */

/* ============================================
   GENERAL RTL ADJUSTMENTS
   ============================================ */
[dir="rtl"] {
    text-align: right;
}

[dir="rtl"] body {
    direction: rtl;
}

/* ============================================
   NAVBAR
   ============================================ */
[dir="rtl"] .navbar .container-fluid {
    flex-direction: row-reverse;
}

[dir="rtl"] .nav-actions {
    flex-direction: row-reverse;
}

/* ============================================
   HERO SECTION
   ============================================ */
[dir="rtl"] .hero-section {
    text-align: right;
}

[dir="rtl"] .hero-badges {
    justify-content: flex-end;
}

/* ============================================
   UPLOAD SECTION
   ============================================ */
[dir="rtl"] .upload-area {
    text-align: right;
}

[dir="rtl"] .format-badges {
    justify-content: flex-end;
}

/* ============================================
   FONT INFO CARDS
   ============================================ */
[dir="rtl"] .info-card {
    text-align: right;
}

[dir="rtl"] .info-card .info-icon {
    margin-left: 16px;
    margin-right: 0;
}

[dir="rtl"] .info-row {
    flex-direction: row-reverse;
}

[dir="rtl"] .info-label {
    text-align: right;
}

[dir="rtl"] .info-value {
    text-align: left;
}

/* ============================================
   FEATURE CARDS
   ============================================ */
[dir="rtl"] .feature-card {
    text-align: right;
}

[dir="rtl"] .feature-icon {
    margin-left: 16px;
    margin-right: 0;
}

/* ============================================
   HOW IT WORKS STEPS
   ============================================ */
[dir="rtl"] .steps-container {
    flex-direction: row-reverse;
}

[dir="rtl"] .step-card {
    text-align: right;
}

[dir="rtl"] .step-connector {
    transform: scaleX(-1);
}

/* ============================================
   FAQ SECTION
   ============================================ */
[dir="rtl"] .faq-item {
    text-align: right;
}

[dir="rtl"] .faq-question {
    flex-direction: row-reverse;
}

[dir="rtl"] .faq-icon {
    margin-right: 0;
    margin-left: 12px;
}

/* ============================================
   FOOTER
   ============================================ */
[dir="rtl"] .footer-content {
    text-align: right;
}

[dir="rtl"] .footer-links {
    text-align: right;
}

[dir="rtl"] .footer-social {
    justify-content: flex-start;
}

/* ============================================
   BUTTONS
   ============================================ */
[dir="rtl"] .btn-icon-right {
    flex-direction: row-reverse;
}

[dir="rtl"] .btn-icon-right svg {
    margin-left: 0;
    margin-right: 8px;
}

/* ============================================
   FORMS
   ============================================ */
[dir="rtl"] .form-group {
    text-align: right;
}

[dir="rtl"] .form-label {
    text-align: right;
}

[dir="rtl"] input,
[dir="rtl"] textarea,
[dir="rtl"] select {
    text-align: right;
}

/* ============================================
   FONT DETAIL PAGE
   ============================================ */
[dir="rtl"] .detail-header {
    text-align: right;
}

[dir="rtl"] .detail-actions {
    flex-direction: row-reverse;
}

[dir="rtl"] .back-link {
    flex-direction: row-reverse;
}

[dir="rtl"] .back-link svg {
    transform: scaleX(-1);
    margin-left: 8px;
    margin-right: 0;
}

[dir="rtl"] .section-header {
    text-align: right;
}

[dir="rtl"] .metadata-grid {
    text-align: right;
}

[dir="rtl"] .metadata-item {
    text-align: right;
}

/* ============================================
   LEGAL NOTICE
   ============================================ */
[dir="rtl"] .legal-notice {
    text-align: right;
    border-left: none;
    border-right: 4px solid #f59e0b;
    padding-left: 0;
    padding-right: 20px;
}

/* ============================================
   SHARE MODAL
   ============================================ */
[dir="rtl"] .share-input-group {
    flex-direction: row-reverse;
}

[dir="rtl"] .share-input {
    border-radius: 0 12px 12px 0;
}

[dir="rtl"] .share-copy-btn {
    border-radius: 12px 0 0 12px;
}

/* ============================================
   LANGUAGE SWITCHER
   ============================================ */
[dir="rtl"] .lang-dropdown {
    right: auto;
    left: 0;
}

[dir="rtl"] .lang-option {
    flex-direction: row-reverse;
}

[dir="rtl"] .lang-btn {
    flex-direction: row-reverse;
}

/* ============================================
   SECTION LABELS
   ============================================ */
[dir="rtl"] .section-label {
    text-align: right;
}

/* ============================================
   GRID LAYOUTS
   ============================================ */
[dir="rtl"] .grid-2,
[dir="rtl"] .grid-3,
[dir="rtl"] .grid-4 {
    direction: rtl;
}

/* ============================================
   TOAST NOTIFICATIONS
   ============================================ */
[dir="rtl"] #toast-container {
    right: auto;
    left: 12px;
}

[dir="rtl"] .toast {
    text-align: right;
}

/* ============================================
   CONTACT PAGE
   ============================================ */
[dir="rtl"] .contact-info {
    text-align: right;
}

[dir="rtl"] .contact-form {
    text-align: right;
}

/* ============================================
   PDF DOWNLOAD BUTTON
   ============================================ */
[dir="rtl"] .pdf-download-btn {
    flex-direction: row-reverse;
}

[dir="rtl"] .pdf-download-btn svg {
    margin-left: 0;
    margin-right: 8px;
}

/* ============================================
   LISTS
   ============================================ */
[dir="rtl"] ul,
[dir="rtl"] ol {
    padding-right: 20px;
    padding-left: 0;
}

[dir="rtl"] li {
    text-align: right;
}

/* ============================================
   MARGINS & PADDINGS FLIP
   ============================================ */
[dir="rtl"] .ml-auto {
    margin-left: 0 !important;
    margin-right: auto !important;
}

[dir="rtl"] .mr-auto {
    margin-right: 0 !important;
    margin-left: auto !important;
}

[dir="rtl"] .text-left {
    text-align: right !important;
}

[dir="rtl"] .text-right {
    text-align: left !important;
}

/* ============================================
   ANIMATIONS
   ============================================ */
[dir="rtl"] .slide-in-left {
    animation-name: slideInRight;
}

[dir="rtl"] .slide-in-right {
    animation-name: slideInLeft;
}

@keyframes slideInRight {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes slideInLeft {
    from {
        transform: translateX(-100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

/* ============================================
   ARROW ICONS
   ============================================ */
[dir="rtl"] .arrow-right {
    transform: scaleX(-1);
}

[dir="rtl"] .arrow-left {
    transform: scaleX(-1);
}

/* ============================================
   BREADCRUMBS
   ============================================ */
[dir="rtl"] .breadcrumb {
    flex-direction: row-reverse;
}

[dir="rtl"] .breadcrumb-separator {
    transform: scaleX(-1);
}