/* Zavaj RTL Stylesheet - Arabic Optimization */
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700;800;900&display=swap');

html[dir="rtl"],
body[dir="rtl"],
html[lang="ar"] body {
    direction: rtl;
    text-align: right;
    font-family: 'Cairo', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

/* Headings and UI text */
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"] .menu a,
html[dir="rtl"] .btn,
html[dir="rtl"] .default-btn,
html[dir="rtl"] button {
    font-family: 'Cairo', system-ui, -apple-system, sans-serif;
}

/* Header & Navigation with Margins and Unreduced Logo */
html[dir="rtl"] .header-section .header-bottom {
    padding-left: clamp(20px, 3.5vw, 48px) !important;
    padding-right: clamp(20px, 3.5vw, 48px) !important;
}
html[dir="rtl"] .header-section .header-bottom .container {
    max-width: 1400px !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
html[dir="rtl"] .header-section .header-wrapper {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    min-width: 0 !important;
}
html[dir="rtl"] .header-brand {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    flex-shrink: 0 !important;
}
html[dir="rtl"] .header-brand .logo {
    display: flex !important;
    align-items: center !important;
    flex-shrink: 0 !important;
    width: auto !important;
}
html[dir="rtl"] .header-brand .logo a {
    display: inline-flex !important;
    align-items: center !important;
}
html[dir="rtl"] .header-brand .logo a img {
    height: 50px !important;
    width: auto !important;
    max-height: 52px !important;
    border-radius: 8px !important;
    object-fit: contain !important;
    display: block !important;
}
html[dir="rtl"] .header-social {
    margin-right: 20px;
    margin-left: 0;
    padding-right: 0;
}
html[dir="rtl"] .header-social li {
    margin-left: 10px;
    margin-right: 0;
}
html[dir="rtl"] .menu-area {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-shrink: 1 !important;
    min-width: 0 !important;
}
html[dir="rtl"] .menu {
    padding-right: 0;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    flex-shrink: 1 !important;
}
html[dir="rtl"] .menu li {
    margin-left: 2px !important;
    margin-right: 2px !important;
    flex-shrink: 0 !important;
    white-space: nowrap !important;
}
html[dir="rtl"] .menu li a {
    white-space: nowrap !important;
}
html[dir="rtl"] .menu-area .login,
html[dir="rtl"] .menu-area .signup {
    margin-right: 4px !important;
    margin-left: 0 !important;
    flex-shrink: 0 !important;
    white-space: nowrap !important;
}

/* User Profile Menu in Header */
html[dir="rtl"] .zavaj-user-dropdown {
    left: 0 !important;
    right: auto !important;
    text-align: right;
}
html[dir="rtl"] .zavaj-user-dropdown .dropdown-item {
    text-align: right;
}
html[dir="rtl"] .zavaj-user-dropdown .dropdown-item i {
    margin-left: 8px;
    margin-right: 0;
}

/* Directional Icons Flipping */
html[dir="rtl"] .icofont-arrow-right,
html[dir="rtl"] .icofont-double-right,
html[dir="rtl"] .icofont-rounded-right,
html[dir="rtl"] .icofont-curved-right,
html[dir="rtl"] .icofont-thin-right {
    transform: scaleX(-1);
    display: inline-block;
}

html[dir="rtl"] .icofont-arrow-left,
html[dir="rtl"] .icofont-double-left,
html[dir="rtl"] .icofont-rounded-left,
html[dir="rtl"] .icofont-curved-left,
html[dir="rtl"] .icofont-thin-left {
    transform: scaleX(-1);
    display: inline-block;
}

/* Swiper Controls */
html[dir="rtl"] .swiper-button-prev,
html[dir="rtl"] .swiper-button-next {
    transform: scaleX(-1);
}

/* Form Controls & Inputs */
html[dir="rtl"] input,
html[dir="rtl"] select,
html[dir="rtl"] textarea {
    text-align: right;
}

/* LTR Isolation for Numbers, OTP, Phones, Emails, Dates */
html[dir="rtl"] input[type="tel"],
html[dir="rtl"] input[type="email"],
html[dir="rtl"] input[type="url"],
html[dir="rtl"] input[type="number"],
html[dir="rtl"] input[name="phone"],
html[dir="rtl"] input[name="mobile"],
html[dir="rtl"] input[name="otp"],
html[dir="rtl"] input[name="code"],
html[dir="rtl"] .phone-number,
html[dir="rtl"] .ltr-iso,
html[dir="rtl"] .price,
html[dir="rtl"] .currency-symbol {
    direction: ltr !important;
    text-align: left !important;
    unicode-bidi: isolate;
}

/* OTP inputs should be centered */
html[dir="rtl"] .otp-input,
html[dir="rtl"] .code-input {
    text-align: center !important;
    direction: ltr !important;
}

/* Checkboxes and Radios */
html[dir="rtl"] .form-check {
    padding-right: 1.5em;
    padding-left: 0;
    text-align: right;
}
html[dir="rtl"] .form-check-input {
    float: right;
    margin-right: -1.5em;
    margin-left: 0;
}

/* Footer Section */
html[dir="rtl"] .zavaj-footer-grid {
    text-align: right;
}
html[dir="rtl"] .zavaj-footer-links h4::after {
    right: 0;
    left: auto;
}
html[dir="rtl"] .zavaj-footer-social {
    padding-right: 0;
}
html[dir="rtl"] .zavaj-footer-social li {
    margin-left: 10px;
    margin-right: 0;
}
html[dir="rtl"] .zavaj-footer-contact-item i {
    margin-left: 8px;
    margin-right: 0;
}
html[dir="rtl"] .zavaj-trust-pill i {
    margin-left: 6px;
    margin-right: 0;
}

/* Breadcrumbs & Pagination */
html[dir="rtl"] .breadcrumb-item + .breadcrumb-item::before {
    float: right;
    padding-left: var(--bs-breadcrumb-item-padding-x);
    padding-right: 0;
    transform: scaleX(-1);
}
html[dir="rtl"] .pagination {
    padding-right: 0;
}

/* Language Switcher Styling - Strict LTR (Flags Left, Text Right) */
html[dir="rtl"] .lang-switcher-dropdown,
html[dir="rtl"] .lang-switcher-dropdown .btn,
html[dir="rtl"] .lang-switcher-dropdown .dropdown-menu,
html[dir="rtl"] .lang-switcher-dropdown .dropdown-item {
    direction: ltr !important;
    text-align: left !important;
}

html[dir="rtl"] .lang-switcher-dropdown .btn {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
}

html[dir="rtl"] .lang-switcher-dropdown .btn .flag-icon {
    order: 1 !important;
    margin: 0 !important;
}

html[dir="rtl"] .lang-switcher-dropdown .btn .lang-current-label {
    order: 2 !important;
    margin: 0 !important;
}

html[dir="rtl"] .lang-switcher-dropdown .btn::after {
    order: 3 !important;
    margin-left: 4px !important;
    margin-right: 0 !important;
}

html[dir="rtl"] .lang-switcher-menu {
    min-width: 140px !important;
    direction: ltr !important;
    text-align: left !important;
}

html[dir="rtl"] .lang-switcher-item {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    padding: 8px 16px !important;
    font-size: 13.5px !important;
    direction: ltr !important;
    text-align: left !important;
    white-space: nowrap !important;
    color: #333333 !important;
    text-decoration: none !important;
    transition: background-color 0.15s ease;
}

html[dir="rtl"] .lang-switcher-item .flag-icon {
    order: 1 !important;
    margin: 0 !important;
    width: 18px !important;
}

html[dir="rtl"] .lang-switcher-item .lang-native-name,
html[dir="rtl"] .lang-switcher-item span:not(.flag-icon) {
    order: 2 !important;
    margin: 0 !important;
    text-align: left !important;
}

html[dir="rtl"] .lang-switcher-item:hover,
html[dir="rtl"] .lang-switcher-item.active {
    background-color: #f3f4f6 !important;
    color: #df314d !important;
    font-weight: 600 !important;
}

/* Hero wordmark brand must always stay strictly LTR ('zavaj', never 'jzava') */
html[dir="rtl"] .zavaj-hero-wordmark {
    direction: ltr !important;
    flex-direction: row !important;
    display: inline-flex !important;
    unicode-bidi: isolate !important;
}

html[dir="rtl"] .zavaj-hero-wordmark > span {
    direction: ltr !important;
    unicode-bidi: isolate !important;
}

html[dir="rtl"] .zavaj-hero-wordmark > span:first-child {
    padding-right: 9px !important;
    padding-left: 0 !important;
}

/* Footer wordmark brand must always stay strictly LTR ('zavaj', never 'jzava') */
html[dir="rtl"] .zavaj-footer-logo-text {
    direction: ltr !important;
    flex-direction: row !important;
    display: inline-flex !important;
    unicode-bidi: isolate !important;
}

html[dir="rtl"] .zavaj-footer-logo-text > span {
    direction: ltr !important;
    unicode-bidi: isolate !important;
}

