/* Khzanti Arabic/RTL Support - Complete Implementation */
/* Comprehensive RTL layout and Arabic language support */

/* ===== BASE RTL SETUP ===== */

[dir="rtl"] {
  direction: rtl;
  text-align: right;
}

[dir="ltr"] {
  direction: ltr;
  text-align: left;
}

/* ===== ARABIC FONT LOADING ===== */

@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/cairo/v28/SLXgcAAEslXG-8yJM5F5_RE.woff2') format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0898-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC;
}

@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/cairo/v28/SLXgcAAEslXG-8yJM5F5_RE.woff2') format('woff2');
}

@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/cairo/v28/SLXgcAAEslXG-8yJM5F5_RE.woff2') format('woff2');
}

@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/cairo/v28/SLXgcAAEslXG-8yJM5F5_RE.woff2') format('woff2');
}

@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/cairo/v28/SLXgcAAEslXG-8yJM5F5_RE.woff2') format('woff2');
}

@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('https://fonts.gstatic.com/s/cairo/v28/SLXgcAAEslXG-8yJM5F5_RE.woff2') format('woff2');
}

/* ===== TYPOGRAPHY RTL ADJUSTMENTS ===== */

[dir="rtl"] {
  font-family: var(--font-family-arabic);
}

[dir="ltr"] {
  font-family: var(--font-family-latin);
}

/* Arabic text specific adjustments */
.arabic-text {
  font-family: var(--font-family-arabic);
  font-size: 16px;
  line-height: 1.6;
  letter-spacing: 0.01em;
}

/* Mixed content handling */
.mixed-content {
  direction: ltr;
  text-align: left;
}

.mixed-content[dir="rtl"] {
  direction: rtl;
  text-align: right;
}

/* ===== LAYOUT RTL ADJUSTMENTS ===== */

/* Header RTL */
[dir="rtl"] .header-content {
  flex-direction: row-reverse;
}

[dir="rtl"] .logo {
  margin-left: 0;
  margin-right: auto;
}

/* Navigation RTL */
[dir="rtl"] .desktop-nav {
  flex-direction: row-reverse;
}

[dir="rtl"] .nav-link {
  margin-left: 0;
  margin-right: var(--space-lg);
}

/* Search bar RTL */
[dir="rtl"] .search-container {
  flex-direction: row-reverse;
}

[dir="rtl"] .search-input {
  text-align: right;
}

[dir="rtl"] .search-button {
  margin-left: 0;
  margin-right: var(--space-xs);
}

/* User actions RTL */
[dir="rtl"] .user-actions {
  flex-direction: row-reverse;
}

[dir="rtl"] .cart-count {
  left: -8px;
  right: auto;
}

/* ===== CARD RTL ADJUSTMENTS ===== */

[dir="rtl"] .product-card {
  text-align: right;
}

[dir="rtl"] .product-info {
  text-align: right;
}

[dir="rtl"] .product-seller {
  flex-direction: row-reverse;
}

[dir="rtl"] .seller-avatar {
  margin-left: var(--space-sm);
  margin-right: 0;
}

[dir="rtl"] .verified-badge {
  left: var(--space-md);
  right: auto;
}

[dir="rtl"] .favorite-button {
  left: var(--space-md);
  right: auto;
}

/* ===== BUTTON RTL ADJUSTMENTS ===== */

[dir="rtl"] .khzanti-button {
  flex-direction: row-reverse;
}

[dir="rtl"] .khzanti-button__content {
  margin-left: var(--space-sm);
  margin-right: 0;
}

/* ===== FORM RTL ADJUSTMENTS ===== */

[dir="rtl"] .mdc-text-field__input {
  text-align: right;
  direction: rtl;
}

[dir="rtl"] .mdc-text-field__label {
  text-align: right;
  direction: rtl;
}

/* ===== GRID RTL ADJUSTMENTS ===== */

[dir="rtl"] .products-grid {
  direction: rtl;
}

[dir="rtl"] .categories-grid {
  direction: rtl;
}

/* ===== TRUST SECTION RTL ===== */

[dir="rtl"] .trust-item {
  text-align: right;
}

[dir="rtl"] .trust-icon {
  margin-left: 0;
  margin-right: auto;
}

/* ===== HERO SECTION RTL ===== */

[dir="rtl"] .hero-content {
  text-align: right;
}

[dir="rtl"] .hero-actions {
  flex-direction: row-reverse;
}

/* ===== FOOTER RTL ===== */

[dir="rtl"] .footer-content {
  direction: rtl;
}

[dir="rtl"] .footer-section {
  text-align: right;
}

[dir="rtl"] .social-links {
  flex-direction: row-reverse;
}

[dir="rtl"] .newsletter {
  flex-direction: row-reverse;
}

[dir="rtl"] .newsletter-input {
  text-align: right;
}

/* ===== MOBILE MENU RTL ===== */

[dir="rtl"] .mobile-menu {
  text-align: right;
  direction: rtl;
}

/* ===== DIALOG RTL ===== */

[dir="rtl"] .mdc-dialog__surface {
  direction: rtl;
  text-align: right;
}

[dir="rtl"] .mdc-dialog__actions {
  flex-direction: row-reverse;
}

/* ===== SNACKBAR RTL ===== */

[dir="rtl"] .mdc-snackbar__surface {
  direction: rtl;
  text-align: right;
}

/* ===== DRAWER RTL ===== */

[dir="rtl"] .material-drawer {
  border-left: 1px solid var(--color-border-light);
  border-right: none;
  left: 0;
  right: auto;
}

/* ===== LIST RTL ===== */

[dir="rtl"] .material-list-tile {
  text-align: right;
  direction: rtl;
}

/* ===== CHIP RTL ===== */

[dir="rtl"] .material-chip {
  direction: rtl;
}

/* ===== TAB BAR RTL ===== */

[dir="rtl"] .material-tab-bar {
  direction: rtl;
}

/* ===== ARABIC NUMBER FORMATTING ===== */

.arabic-numbers {
  font-variant-numeric: tabular-nums;
}

/* Eastern Arabic numerals (٠١٢٣٤٥٦٧٨٩) */
[dir="rtl"] .arabic-numbers {
  -moz-font-feature-settings: "lnum";
  -webkit-font-feature-settings: "lnum";
  font-feature-settings: "lnum";
}

/* ===== CULTURAL ADJUSTMENTS ===== */

/* Cultural calendar adjustments */
.cultural-calendar {
  direction: rtl;
  text-align: right;
}

.cultural-calendar [dir="ltr"] {
  direction: ltr;
  text-align: left;
}

/* Cultural time display */
.cultural-times {
  direction: rtl;
  text-align: right;
}

.cultural-times .time {
  font-family: var(--font-family-arabic);
  font-variant-numeric: tabular-nums;
}

/* ===== ACCESSIBILITY RTL ===== */

/* Screen reader adjustments */
[dir="rtl"] .sr-only {
  direction: rtl;
}

/* Focus management in RTL */
[dir="rtl"] *:focus {
  outline-offset: -2px;
}

/* ===== PRINT RTL ===== */

@media print {
  [dir="rtl"] {
    direction: rtl;
    text-align: right;
  }

  [dir="ltr"] {
    direction: ltr;
    text-align: left;
  }
}

/* ===== ANIMATION RTL ===== */

/* Flip animations for RTL */
[dir="rtl"] .slide-in-left {
  animation: slideInFromRight 0.3s ease;
}

[dir="rtl"] .slide-in-right {
  animation: slideInFromLeft 0.3s ease;
}

@keyframes slideInFromRight {
  from {
    transform: translateX(100%);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 0;
  }
}

@keyframes slideInFromLeft {
  from {
    transform: translateX(-100%);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 0;
  }
}

/* ===== RESPONSIVE RTL FIXES ===== */

@media (max-width: 768px) {
  [dir="rtl"] .hero-actions {
    flex-direction: column;
  }

  [dir="rtl"] .newsletter {
    flex-direction: column;
  }

  [dir="rtl"] .user-actions {
    flex-direction: row-reverse;
    justify-content: space-between;
  }
}

/* ===== BROWSER SPECIFIC RTL FIXES ===== */

/* Firefox RTL fixes */
@-moz-document url-prefix() {
  [dir="rtl"] .mdc-text-field__input {
    text-align: right;
    direction: rtl;
  }
}

/* Safari RTL fixes */
@supports (-webkit-appearance: none) {
  [dir="rtl"] .search-input {
    font-family: var(--font-family-arabic);
  }
}

/* Edge RTL fixes */
@supports (-ms-ime-align: auto) {
  [dir="rtl"] .khzanti-button {
    text-align: center;
  }
}

/* ===== PERFORMANCE OPTIMIZATIONS ===== */

/* Font loading optimization */
[dir="rtl"] {
  font-display: swap;
}

/* Reduce reflows in RTL */
[dir="rtl"] * {
  contain: layout style;
}

/* ===== TESTING UTILITIES ===== */

.rtl-test-border {
  border: 1px solid red !important;
}

.rtl-test-background {
  background-color: rgba(255, 0, 0, 0.1) !important;
}

/* Remove in production */
@media (max-width: 768px) {
  .rtl-debug [dir="rtl"] {
    outline: 2px solid blue;
  }

  .rtl-debug [dir="ltr"] {
    outline: 2px solid green;
  }
}