/*
Theme Name: ZK Nito
Description: Adds support for languages written in a Right To Left (RTL) direction.
It's easy, just a matter of overwriting all the horizontal positioning attributes
of your CSS stylesheet in a separate stylesheet file named rtl.css.

See http://codex.wordpress.org/Right_to_Left_Language_Support
*/

/* Importing Google Font for Cairo */
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;700&display=swap');

html[dir="rtl"] body {
    direction: rtl;
    font-family: "Cairo Play", serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-variation-settings: "slnt" 0;
    letter-spacing: 0.5px; /* Adjust this value as needed */
}

html[dir="rtl"] h1, html[dir="rtl"] h2, html[dir="rtl"] h3, html[dir="rtl"] h4, html[dir="rtl"] h5, html[dir="rtl"] h6 {
    font-family: "Cairo", serif; /* No !important unless needed */
}
a.vc_general.vc_btn3.vc_btn3-size-md.vc_btn3-shape-rounded.vc_btn3-style-custom, a.vc_general.vc_btn3.vc_btn3-size-md.vc_btn3-shape-rounded.vc_btn3-style-modern.vc_btn3-color-grey {
    font-family: 'Cairo';
}
.vc-hoverbox-block-inner.vc-hoverbox-front-inner h2 {
    font-size: 24px;
    color: #fff;
    line-height: 40px;
}

*[id^='readlink'] {
    bottom: 0;
    position: absolute;
    font-family: 'Cairo';
}
#faqs .vc_tta-panel-title a {
    font-family: 'Cairo';
}
input[type="submit"] {
    letter-spacing: 0;
}
html[dir="rtl"] span.vc_tta-title-text {
    letter-spacing: 0;
}
html[dir="rtl"] p{
font-family: "Cairo Play", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings:
    "slnt" 0;
}

/* Change logo for RTL */
html[dir="rtl"] .main-logo {
    content: url('https://yasminaamericanschool.com/wp-content/uploads/2025/02/logo-ar-while-1.webp');
width: 160px;
}
html[dir="rtl"] .ontop-logo {
    content: url('https://yasminaamericanschool.com/wp-content/uploads/2025/02/logo-ar-while-1.webp');
width: 160px;
}
html[dir="rtl"] #cms-footer-top .wg-title, #cms-footer-top .widget-title, #cms-footer-top h1, #cms-footer-top h2, #cms-footer-top h3, #cms-footer-top h4, #cms-footer-top h5, #cms-footer-top h6 {
    font-family: 'Cairo';
    text-transform: uppercase;
    line-height: 35px;
    letter-spacing: 0;
}
html[dir="rtl"] .read_div {
    font-family: "Cairo Play", serif;
}

/* Set the entire footer to RTL */
html[dir="rtl"] #cms-footer {
    direction: rtl;
    text-align: right;
}
.textwidget a {
    text-align: right;
    font-family: "Cairo Play", serif;
}
.iti--allow-dropdown .iti__flag-container, .iti--separate-dial-code .iti__flag-container {
    right: 0 !important;
    left: auto !important;
}
#salesforce input#mobile {
    padding-right: 4rem !important;
}
#mobile::placeholder {
    direction: ltr;  /* Ensures placeholder text stays in correct direction */
    text-align: right;  /* Aligns the placeholder text to the right */
    unicode-bidi: plaintext;  /* Helps prevent unwanted spacing issues */
}
/* Reverse column order for RTL */
@media (min-width: 768px) {
    .footer-top-wg {
        display: flex;
        flex-direction: column;
    }
    
    .footer-top-wg.col-1 { order: 4; }
    .footer-top-wg.col-2 { order: 3; }
    .footer-top-wg.col-3 { order: 2; }
    .footer-top-wg.col-4 { order: 1; }
}

/* Align text and icons properly */
.cms-social li {
    text-align: right;
    padding-right: 10px;
}

.cms-social li i {
    margin-left: 8px;
    margin-right: 0;
}

/* Reverse floating elements (like images) */
.widget_sp_image img {
    float: left;
}

.read-link::after {
    font-family: "Font Awesome 5 Free";
    content: "\f100" !important;
    font-weight: 900;
    margin-left: 5px;
    transition: transform 0.3sease;
}

.read-link.read-less::after {
    content: "\f101" !important;
}

/* Ensure consistent RTL layout */
@media (min-width: 768px) {
    .footer-top-wg {
        float: right;
    }
}

/* Adjust headings and links */
.widget_text h6 {
    text-align: right;
}

.textwidget a {
    text-align: right;
}

/* Reverse padding & margins for RTL */
.textwidget p, 
.textwidget ul {
    padding-right: 15px;
    padding-left: 0;
}

/* Set the header to RTL */
#cms-header {
    direction: rtl;
    text-align: right;
}

/* Reverse logo and menu positions */
#cms-header-logo {
    float: right !important;
}

.cms-nav-extra {
    float: left;
}

/* Align navigation menu */
#cms-navigation {
    float: left;
}

.cms-main-navigation {
    text-align: right;
}

/* Adjust dropdown menus */
.cms-main-navigation .sub-menu {
    right: 0;
    left: auto;
    text-align: right;
}

.cms-main-navigation .sub-menu li {
    text-align: right;
}

/* Reverse menu toggle icons */
.cms-menu-toggle i {
    transform: rotate(180deg);
}

/* Align social icons properly */
.cms-social {
    text-align: right;
}

.cms-social li {
    margin-left: 10px;
    margin-right: 0;
}

/* Adjust spacing for menu items */
.cms-main-navigation li {
    padding-right: 10px;
    padding-left: 0;
}

/* Reverse mobile menu icon */
.cms-nav-extra-icon {
    float: left;
}