/* RTL Overrides for RIWAM */

/* Cairo Font Definitions */
@font-face {
    font-family: 'Cairo';
    src: url('../webfonts/Cairo-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'Cairo';
    src: url('../webfonts/Cairo-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'Cairo';
    src: url('../webfonts/Cairo-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'Cairo';
    src: url('../webfonts/Cairo-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: 'Cairo';
    src: url('../webfonts/Cairo-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'Cairo';
    src: url('../webfonts/Cairo-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

/* Force Cairo Font on Everything in Arabic */
html[dir="rtl"],
html[dir="rtl"] body,
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"] a,
html[dir="rtl"] span,
html[dir="rtl"] div,
html[dir="rtl"] button,
html[dir="rtl"] input,
html[dir="rtl"] textarea {
    font-family: 'Cairo', sans-serif !important;
}

html[dir="rtl"] {
    /* Set text direction and font */
    direction: rtl;
    text-align: right;
}

/* Example RTL flip for generic padding and margins */
html[dir="rtl"] .text-left { text-align: right !important; }
html[dir="rtl"] .text-right { text-align: left !important; }

/* --- Header Search Modal RTL --- */
/* Push the close button to the left side */
html[dir="rtl"] .header-action-details .modal .close {
    margin: 0 auto 15px 0 !important;
}

/* Flip the padding of the search form wrapper */
html[dir="rtl"] .modal-search-form {
    padding-right: 0 !important;
    padding-left: 20px !important;
}

/* --- Navigation Dropdown RTL --- */
/* Align dropdown menu text to the right and anchor to right edge */
html[dir="rtl"] .main-menu ul ul {
    text-align: right !important;
    left: auto !important;
    right: 0 !important;
}

/* Fix nested submenus (third level) */
html[dir="rtl"] .main-menu ul ul ul {
    right: 100% !important;
    left: auto !important;
}

/* Fix submenu arrow direction */
html[dir="rtl"] .main-menu ul .nav-item.submenu > a:after {
    margin-left: 0 !important;
    margin-right: 8px !important;
}

/* --- Mobile Menu RTL --- */
/* Align mobile menu text to the right */
html[dir="rtl"] .slicknav_nav,
html[dir="rtl"] .slicknav_menu,
html[dir="rtl"] .responsive-menu ul,
html[dir="rtl"] .navbar-collapse {
    text-align: right !important;
}

/* Position the slicknav dropdown arrows to the left */
html[dir="rtl"] .slicknav_arrow:after {
    right: auto !important;
    left: 15px !important;
}

/* --- Footer Mobile RTL --- */
@media (max-width: 767px) {
    /* Align footer links to the right */
    html[dir="rtl"] body .main-footer .footer-links {
        text-align: right !important;
    }
    
    /* Align social links to the right edge (flex-start in RTL is right) */
    html[dir="rtl"] body .main-footer .footer-social-links ul {
        justify-content: flex-start !important;
    }
    
    /* Align contact info list to the right edge */
    html[dir="rtl"] body .main-footer .footer-contact-item-list {
        justify-content: flex-start !important;
    }
    
    /* Align logo to the right */
    html[dir="rtl"] body .main-footer .footer-logo {
        text-align: right !important;
    }
}

/* --- Breadcrumbs RTL --- */
/* Flip custom breadcrumb arrows in p.php */
html[dir="rtl"] .product-single-breadcrumb-list .breadcrumb li::before {
    right: auto !important;
    left: -34px !important;
    transform: translateY(-50%) rotate(225deg) !important;
}

/* Flip Bootstrap default breadcrumbs arrows for all other pages */
html[dir="rtl"] .breadcrumb-item + .breadcrumb-item::before {
    float: right;
    padding-right: 0 !important;
    padding-left: 0.5rem !important;
}