/* ============================================================
   rtl.css — RTL(아랍어 등) 테마 보정
   dir="rtl" 일 때만 로드. Bootstrap 자체는 bootstrap.rtl.min.css 가
   유틸리티/컴포넌트를 처리하고, 본 파일은 Porto 테마(theme.css)의
   물리적 속성과 wtmall 커스텀 컴포넌트를 보정한다.
   ============================================================ */

html[dir="rtl"] { direction: rtl; }
html[dir="rtl"] body { text-align: right; }

/* ── 테마가 쓰는 물리적 float/text 유틸 플립 (Bootstrap4 잔재 대응) ── */
html[dir="rtl"] .float-left  { float: right !important; }
html[dir="rtl"] .float-right { float: left  !important; }
html[dir="rtl"] .text-left   { text-align: right !important; }
html[dir="rtl"] .text-right  { text-align: left  !important; }
html[dir="rtl"] .pull-left   { float: right !important; }
html[dir="rtl"] .pull-right  { float: left  !important; }

/* ── 리스트 들여쓰기 ── */
html[dir="rtl"] ul, html[dir="rtl"] ol { padding-left: 0; padding-right: 2rem; }
html[dir="rtl"] .list-unstyled, html[dir="rtl"] .nav { padding-right: 0; }

/* ── 폼 입력: 값/플레이스홀더 우측 정렬 ── */
html[dir="rtl"] .form-control,
html[dir="rtl"] .form-select { text-align: right; }
html[dir="rtl"] .input-group > .form-control { text-align: right; }

/* ── 방향성 아이콘(화살표/꺾쇠) 미러링 ── */
html[dir="rtl"] .fa-angle-right, html[dir="rtl"] .fa-angle-left,
html[dir="rtl"] .fa-chevron-right, html[dir="rtl"] .fa-chevron-left,
html[dir="rtl"] .fa-arrow-right, html[dir="rtl"] .fa-arrow-left,
html[dir="rtl"] .fa-caret-right, html[dir="rtl"] .fa-caret-left,
html[dir="rtl"] [class*="ph-caret-"], html[dir="rtl"] [class*="ph-arrow-"],
html[dir="rtl"] .ri-arrow-right-line, html[dir="rtl"] .ri-arrow-left-line {
  display: inline-block;
  transform: scaleX(-1);
}

/* ── 브레드크럼 구분자 방향 ── */
html[dir="rtl"] .breadcrumb-item + .breadcrumb-item { padding-right: .5rem; padding-left: 0; }
html[dir="rtl"] .breadcrumb-item + .breadcrumb-item::before {
  float: right; padding-left: .5rem; padding-right: 0;
  transform: scaleX(-1); display: inline-block;
}

/* ── Owl 캐러셀: 트랙 방향 유지(아이템 순서 보존), 네비만 좌우 반전 ── */
html[dir="rtl"] .owl-carousel { direction: ltr; }
html[dir="rtl"] .owl-carousel .owl-item { direction: rtl; }

/* ── 헤더/탑바: 로고-액션 좌우 배치는 flex 가 dir 인지하므로 자동.
      여백만 보정 ── */
html[dir="rtl"] .tb-right, html[dir="rtl"] .header-actions { margin-left: 0; margin-right: auto; }

/* ── 상품 카드 텍스트 정렬 ── */
html[dir="rtl"] .product-card, html[dir="rtl"] .wt-card,
html[dir="rtl"] .card-body { text-align: right; }

/* ── 가격/배지 등 좌측 고정 요소 보정 ── */
html[dir="rtl"] .badge { margin-left: 0; margin-right: .25rem; }

/* ── 드롭다운 메뉴 정렬 (BS5 RTL 이 처리하지만 커스텀 메뉴 보강) ── */
html[dir="rtl"] .dropdown-menu { text-align: right; }

/* ── 푸터 컬럼 정렬 ── */
html[dir="rtl"] footer, html[dir="rtl"] .site-footer { text-align: right; }

/* ── 우하단 플로팅 런처: RTL 에서는 좌하단으로 ── */
html[dir="rtl"] .taein-hub-launcher { right: auto; left: 16px; }

/* ── 숫자/가격/브랜드 라틴 토큰은 LTR 유지(혼용 깨짐 방지) ── */
html[dir="rtl"] .price, html[dir="rtl"] .money, html[dir="rtl"] bdi,
html[dir="rtl"] .latin { direction: ltr; unicode-bidi: isolate; display: inline-block; }