/**
 * El Shorbagy Plastic Machinery - RTL Styles for Arabic Language
 * Applied when html[dir="rtl"] is active
 */

/* Import Arabic Font - Cairo */
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700;800&display=swap');

/* RTL Base Styles */
html[dir="rtl"] {
    font-family: 'Cairo', 'Segoe UI', Tahoma, sans-serif;
}

html[dir="rtl"] body {
    font-family: 'Cairo', 'Segoe UI', Tahoma, sans-serif;
    text-align: right;
}

/* RTL Mode Class for fine-tuned control */
body.rtl-mode {
    direction: rtl;
}

/* Fix for icon fonts in RTL - prevent direction from breaking icons */
html[dir="rtl"] .fa,
html[dir="rtl"] [class^="icon-"],
html[dir="rtl"] [class*=" icon-"],
html[dir="rtl"] .flaticon,
html[dir="rtl"] [class^="flaticon-"],
html[dir="rtl"] [class*=" flaticon-"] {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    direction: ltr !important;
}

html[dir="rtl"] .iocn-holder,
html[dir="rtl"] .icon-holder {
    direction: ltr !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}


/* Typography */
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4,
html[dir="rtl"] h5,
html[dir="rtl"] h6,
html[dir="rtl"] p,
html[dir="rtl"] span,
html[dir="rtl"] a,
html[dir="rtl"] li,
html[dir="rtl"] div {
    font-family: 'Cairo', 'Segoe UI', Tahoma, sans-serif;
}

/* Text Alignment Overrides */
html[dir="rtl"] .text-left {
    text-align: right !important;
}

html[dir="rtl"] .text-right {
    text-align: left !important;
}

/* Float Overrides */
html[dir="rtl"] .pull-left,
html[dir="rtl"] .float-left {
    float: right !important;
}

html[dir="rtl"] .pull-right,
html[dir="rtl"] .float-right {
    float: left !important;
}

/* Header Adjustments */
html[dir="rtl"] .header-area .logo {
    text-align: right;
}

/* Keep header contact info in same visual layout */
html[dir="rtl"] .header-contact-info {
    direction: ltr !important;
}

html[dir="rtl"] .header-contact-info ul {
    direction: ltr;
    text-align: left;
}

html[dir="rtl"] .header-contact-info li {
    float: left;
    margin-left: 0;
    margin-right: 30px;
    padding-left: 0;
    padding-right: 30px;
    border-left: none;
    border-right: 1px solid #f7f7f7;
}

html[dir="rtl"] .header-contact-info li:last-child {
    margin-right: 0;
    padding-right: 0;
    border-right: none;
}

html[dir="rtl"] .header-contact-info .text-holder {
    text-align: left;
    padding-left: 10px;
    padding-right: 0;
}

/* Navigation */
html[dir="rtl"] .main-menu .navigation {
    text-align: right;
}

html[dir="rtl"] .main-menu .navigation li {
    float: right;
}

html[dir="rtl"] .navigation li {
    margin-left: 0;
    margin-right: 20px;
}

html[dir="rtl"] .navbar-collapse {
    text-align: right;
}

/* Main Menu Style 2 (index.php) */
html[dir="rtl"] .main-menu.style-2 .navigation {
    text-align: right;
}

html[dir="rtl"] .mainmenu-area .navigation li {
    float: right;
}

/* Right Column / Search */
html[dir="rtl"] .right-column {
    float: left;
}

html[dir="rtl"] .link_btn.float_right {
    float: left;
}

/* Hero Section */
html[dir="rtl"] .hero-content {
    text-align: right;
}

html[dir="rtl"] .hero-text {
    text-align: right;
}

html[dir="rtl"] .hero-actions {
    justify-content: flex-start;
}

html[dir="rtl"] .hero-actions .hero-btn {
    margin-left: 15px;
    margin-right: 0;
}

/* About Section */
html[dir="rtl"] .about-text {
    text-align: right;
}

html[dir="rtl"] .about-text h2 {
    text-align: right;
}

html[dir="rtl"] .about-text .text p {
    text-align: right;
}

html[dir="rtl"] .fact-counter ul {
    text-align: center;
}

html[dir="rtl"] .single-fact-counter {
    text-align: center;
    margin-right: 0;
    margin-left: 50px;
}

html[dir="rtl"] .single-fact-counter:last-child {
    margin-left: 0;
}

html[dir="rtl"] .single-fact-counter .count-outer {
    direction: ltr;
    /* Force LTR for numbers e.g. 20+ */
    display: block;
    /* Ensure it takes full width/center */
    margin-bottom: 5px;
}

html[dir="rtl"] .single-fact-counter .fa-plus {
    margin-left: 5px;
    /* Add spacing between number and plus */
}

/* Services/Machinery Section */
html[dir="rtl"] .section-title {
    text-align: right;
}

html[dir="rtl"] .section-title.text-center {
    text-align: center !important;
}

html[dir="rtl"] .single-our-service {
    text-align: right;
}

html[dir="rtl"] .single-our-service h4 {
    text-align: right;
}

html[dir="rtl"] .single-our-service p {
    text-align: right;
}

/* Reverse column order in machinery section */
html[dir="rtl"] .our-services .row {
    display: flex;
    flex-direction: row-reverse;
}

html[dir="rtl"] .our-services .row .col-md-4 {
    order: 2;
}

html[dir="rtl"] .our-services .row .col-md-8 {
    order: 1;
}

/* Contact Section */
html[dir="rtl"] .call-back .section-title,
html[dir="rtl"] .call-back h4,
html[dir="rtl"] .call-back .text {
    text-align: right;
}

html[dir="rtl"] .contact-form-area {
    text-align: right;
}

html[dir="rtl"] .contact-form input,
html[dir="rtl"] .contact-form textarea {
    text-align: right;
    direction: rtl;
}

html[dir="rtl"] .contact-form .thm-btn {
    float: right;
}

/* News Cards */
html[dir="rtl"] .blog-news-card {
    text-align: right;
}

html[dir="rtl"] .news-card-content {
    text-align: right;
}

html[dir="rtl"] .news-card-footer {
    flex-direction: row-reverse;
}

html[dir="rtl"] .news-card-date {
    left: auto;
    right: 15px;
}

html[dir="rtl"] .news-card-read-more {
    flex-direction: row-reverse;
}

html[dir="rtl"] .news-card-read-more i {
    transform: rotate(180deg);
}

/* Footer */
html[dir="rtl"] .footer-col {
    text-align: right;
}

html[dir="rtl"] .footer-title {
    text-align: right;
}

html[dir="rtl"] .footer-list {
    text-align: right;
    padding-right: 0;
}

html[dir="rtl"] .footer-list li {
    text-align: right;
}

html[dir="rtl"] .footer-social {
    text-align: right;
}

html[dir="rtl"] .footer-social li {
    margin-right: 0;
    margin-left: 10px;
}

html[dir="rtl"] .contact-info li {
    text-align: right;
    padding-right: 0;
    padding-left: 25px;
}

html[dir="rtl"] .contact-info li i {
    margin-right: 0;
    margin-left: 10px;
}

html[dir="rtl"] .footer-bottom {
    text-align: right;
}

html[dir="rtl"] .footer-bottom .copyright {
    text-align: right;
}

html[dir="rtl"] .footer-menu.pull-right {
    float: left;
}

html[dir="rtl"] .footer-menu ul li {
    margin-left: 0;
    margin-right: 20px;
}

/* Breadcrumb */
html[dir="rtl"] .breadcrumb-area {
    text-align: right;
}

html[dir="rtl"] .breadcrumb li {
    float: right;
}

html[dir="rtl"] .breadcrumb li+li:before {
    content: "\\";
    padding: 0 10px;
}

/* Page Banner */
html[dir="rtl"] .page-banner .content {
    text-align: right;
}

/* About Page */
html[dir="rtl"] .about-content {
    text-align: right;
}

html[dir="rtl"] .about-content h3,
html[dir="rtl"] .about-content p {
    text-align: right;
}

html[dir="rtl"] .feature-list li {
    padding-left: 0;
    padding-right: 30px;
}

html[dir="rtl"] .feature-list li:before {
    left: auto;
    right: 0;
}

/* Contact Page */
html[dir="rtl"] .contact-info-box {
    text-align: right;
}

html[dir="rtl"] .contact-info-box i {
    float: right;
    margin-right: 0;
    margin-left: 15px;
}

html[dir="rtl"] .contact-details {
    text-align: right;
}

/* Service Page */
html[dir="rtl"] .category-filter-list {
    direction: rtl;
}

html[dir="rtl"] .single-product-card {
    text-align: right;
}

html[dir="rtl"] .single-product-card h3,
html[dir="rtl"] .single-product-card h4,
html[dir="rtl"] .single-product-card p {
    text-align: right;
}

/* Fix product card sizing and alignment in RTL */
html[dir="rtl"] .single-product-card .content-box {
    min-height: 200px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

html[dir="rtl"] .single-product-card h3 {
    min-height: 50px;
    display: flex;
    align-items: center;
    line-height: 1.4;
}

html[dir="rtl"] .single-product-card p {
    flex: 1;
    line-height: 1.6;
    overflow: hidden;
}

html[dir="rtl"] .single-product-card .btn-specs {
    align-self: flex-start;
    margin-top: auto;
}

/* Ensure product grid columns maintain equal height */
html[dir="rtl"] .product-item {
    display: flex;
    margin-bottom: 30px;
}

html[dir="rtl"] .product-item .single-product-card {
    width: 100%;
    display: flex;
    flex-direction: column;
    height: 100%;
}

html[dir="rtl"] .product-item .single-product-card .img-box {
    flex-shrink: 0;
}

html[dir="rtl"] .product-item .single-product-card .content-box {
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* Category filter boxes in RTL */
html[dir="rtl"] .category-box h4 {
    text-align: center;
}

html[dir="rtl"] .category-filter-container {
    direction: rtl;
}

/* Product specs content alignment */
html[dir="rtl"] .specs-content {
    text-align: right !important;
}

html[dir="rtl"] .specs-content ul {
    padding-right: 20px;
    padding-left: 0;
}

html[dir="rtl"] .specs-content li {
    text-align: right;
}

/* Fix button hover transform in RTL */
html[dir="rtl"] .single-product-card .btn-specs:hover {
    transform: translateX(-5px);
}


/* Blog Page */
html[dir="rtl"] .blog-card {
    text-align: right;
}

html[dir="rtl"] .blog-card-content {
    text-align: right;
}

html[dir="rtl"] .blog-modal-content {
    text-align: right;
}

/* Mobile Menu */
html[dir="rtl"] .mobile-menu-modern {
    right: auto;
    left: 0;
    transform: translateX(-100%);
}

html[dir="rtl"] .mobile-menu-modern.active {
    transform: translateX(0);
}

html[dir="rtl"] .mobile-header-toggle-wrapper {
    right: auto !important;
    left: 20px !important;
}

html[dir="rtl"] .mobile-menu-toggle {
    right: auto !important;
    left: 0 !important;
    /* Reset, wrapper handles position */
}

html[dir="rtl"] .menu-items {
    text-align: right;
}

html[dir="rtl"] .menu-items li a {
    flex-direction: row-reverse;
    text-align: right;
}

html[dir="rtl"] .menu-icon {
    margin-right: 0;
    margin-left: 12px;
}

/* Buttons */
html[dir="rtl"] .thm-btn i {
    margin-left: 0;
    margin-right: 8px;
}

/* Icons that need to be mirrored */
html[dir="rtl"] .fa-arrow-right:before {
    content: "\f060";
    /* arrow-left */
}

html[dir="rtl"] .fa-arrow-left:before {
    content: "\f061";
    /* arrow-right */
}

html[dir="rtl"] .fa-chevron-right:before {
    content: "\f053";
    /* chevron-left */
}

html[dir="rtl"] .fa-chevron-left:before {
    content: "\f054";
    /* chevron-right */
}

/* Language Switcher in RTL */
html[dir="rtl"] .language-switcher {
    margin-left: 0;
    margin-right: 20px;
}

/* Owl Carousel RTL */
html[dir="rtl"] .owl-carousel {
    direction: ltr;
}

html[dir="rtl"] .owl-carousel .owl-item {
    direction: rtl;
}

/* Revolution Slider RTL */
html[dir="rtl"] .rev_slider_wrapper {
    direction: ltr;
}

html[dir="rtl"] .rev_slider {
    direction: rtl;
}

/* Forms in RTL */
html[dir="rtl"] input[type="text"],
html[dir="rtl"] input[type="email"],
html[dir="rtl"] input[type="tel"],
html[dir="rtl"] input[type="password"],
html[dir="rtl"] textarea,
html[dir="rtl"] select {
    text-align: right;
    direction: rtl;
}

/* Loader Text */
html[dir="rtl"] .loading-text {
    font-family: 'Cairo', sans-serif;
}



/* Responsive Adjustments */
@media (max-width: 991px) {
    html[dir="rtl"] .header-contact-info {
        text-align: right;
    }

    html[dir="rtl"] .mainmenu-area .navigation li {
        float: none;
        text-align: right;
    }
}

@media (max-width: 767px) {
    html[dir="rtl"] .about-text {
        padding-right: 0;
    }

    html[dir="rtl"] .section-title {
        text-align: center;
    }

    html[dir="rtl"] .hero-actions {
        justify-content: center;
    }

    html[dir="rtl"] .footer-col {
        text-align: center;
    }

    html[dir="rtl"] .footer-social {
        justify-content: center;
    }
}

@media (max-width: 479px) {
    html[dir="rtl"] .mobile-menu-toggle {
        right: auto !important;
        left: 7% !important;
    }
}

/* RTL Contact Page - Quick Contact Section Fix */
html[dir="rtl"] .footer-contact-info ul li {
    display: flex;
    flex-direction: row-reverse;
    text-align: right;
}

html[dir="rtl"] .footer-contact-info ul li .iocn-holder {
    margin-left: 20px;
    margin-right: 0;
    float: right;
}

html[dir="rtl"] .footer-contact-info ul li .text-holder {
    float: right;
    text-align: right;
}

html[dir="rtl"] .footer-contact-info ul li .text-holder h6,
html[dir="rtl"] .footer-contact-info ul li .text-holder p {
    text-align: right;
}

/* Ensure icons stay LTR */
html[dir="rtl"] .footer-contact-info ul li .iocn-holder span {
    direction: ltr !important;
}

/* ================================
   Phone Numbers & Email Fix for RTL
   ================================ */

/* Force all phone numbers and emails to display left-to-right */
html[dir="rtl"] a[href^="tel:"],
html[dir="rtl"] a[href^="mailto:"],
html[dir="rtl"] [dir="ltr"],
html[dir="rtl"] .contact-info li,
html[dir="rtl"] .contact-info a,
html[dir="rtl"] .header-contact-info a,
html[dir="rtl"] .footer-col .contact-info li {
    direction: ltr !important;
    unicode-bidi: embed;
    text-align: left !important;
}

/* Ensure phone number icons stay on the left side */
html[dir="rtl"] .contact-info li .fa,
html[dir="rtl"] .contact-info li i {
    margin-right: 10px;
    margin-left: 0;
}

/* Fix for contact section text direction */
html[dir="rtl"] .contact-info {
    direction: rtl;
}

html[dir="rtl"] .contact-info li {
    direction: ltr !important;
    text-align: left !important;
}