/* ============================================================
   Carton Castle - RTL / Arabic styles
   Active only when <body class="rtl"> (set by lang.js)
   Uses Cairo font for Arabic readability
============================================================ */

/* ---- Arabic font when in RTL ---- */
body.rtl,
body.rtl h1, body.rtl h2, body.rtl h3, body.rtl h4,
body.rtl h5, body.rtl h6, body.rtl p, body.rtl a,
body.rtl span, body.rtl li, body.rtl button,
body.rtl input, body.rtl textarea, body.rtl label,
body.rtl small {
    font-family: 'Cairo', 'Tajawal', sans-serif !important;
    letter-spacing: 0 !important;
}

/* ---- Global direction ---- */
body.rtl {
    direction: rtl;
    text-align: right;
}

/* ---- Navbar ---- */
body.rtl .navbar-nav {
    padding-right: 0;
}
/* keep brand on the right, contact button on the left in RTL */
body.rtl .navbar .container {
    flex-direction: row;
}
body.rtl .nav-link::after {
    left: auto;
    right: 0;
}

/* ---- Language toggle button ---- */
.lang-toggle {
    background: transparent;
    border: 1.5px solid var(--main);
    color: #fff;
    border-radius: 30px;
    padding: 6px 16px;
    font-weight: 700;
    font-size: .9rem;
    margin: 0 10px;
    transition: all .3s ease;
    white-space: nowrap;
}
.lang-toggle:hover {
    background: var(--main);
    color: #1A120D;
}

/* ---- Generic text alignment flips ---- */
body.rtl .text-end { text-align: left !important; }
body.rtl .text-start { text-align: right !important; }
body.rtl .me-auto { margin-right: 0 !important; margin-left: auto !important; }
body.rtl .ms-auto { margin-left: 0 !important; margin-right: auto !important; }
body.rtl .me-2 { margin-right: 0 !important; margin-left: .5rem !important; }
body.rtl .ms-2 { margin-left: 0 !important; margin-right: .5rem !important; }

/* ---- Lists: flip padding/icons ---- */
body.rtl .ps-3 { padding-left: 0 !important; padding-right: 1rem !important; }
body.rtl ul { padding-right: 0; }

/* ---- Timeline cards (journey) ---- */
body.rtl .timeline .card-body.text-end {
    text-align: right !important;
}
body.rtl .left-animate  { transform: translateX(80px); }
body.rtl .right-animate { transform: translateX(-80px); }
body.rtl .left-animate.show,
body.rtl .right-animate.show { transform: translateX(0); }

/* ---- Tradition border (border-start becomes border on right) ---- */
body.rtl .border-start {
    border-left: 0 !important;
    border-right: 4px solid var(--main) !important;
}
body.rtl .border-start.ps-3 {
    padding-right: 1rem !important;
    padding-left: 0 !important;
}

/* ---- Forms ---- */
body.rtl .form-control,
body.rtl .form-label {
    text-align: right;
}
body.rtl input,
body.rtl textarea {
    direction: rtl;
}
/* keep email / url / tel inputs LTR for correct rendering */
body.rtl input[type="email"],
body.rtl input[type="url"],
body.rtl input[type="tel"] {
    direction: ltr;
    text-align: right;
}

/* ---- Newsletter form ---- */
body.rtl .newsletter-form { flex-direction: row-reverse; }

/* ---- Footer ---- */
body.rtl .footer-section { text-align: right; }
body.rtl .social-links { justify-content: flex-start; }
body.rtl .contact-list i { margin-left: 8px; margin-right: 0; }

/* ---- Blog "read more" arrows already use ← in AR dict ---- */
body.rtl .blog-content small { direction: rtl; }

/* ---- Buttons with arrows ---- */
body.rtl .btn-gold { direction: rtl; }

/* ---- Keep numbers / stats LTR so they read correctly ---- */
body.rtl .stat-number,
body.rtl .metric-card h3,
body.rtl .stat-item h2,
body.rtl .stat span,
body.rtl .timeline .text-main {
    direction: ltr;
    unicode-bidi: embed;
    display: inline-block;
}

/* ---- Mobile: navbar toggler position ---- */
@media (max-width: 991px) {
    body.rtl .navbar-nav { text-align: right; }
}