/* 
 * Internationalization Styles - RTL Support for Arabic
 * Full RTL (Right-to-Left) layout for Arabic language
 */

/* ============================================
   BASE RTL LAYOUT
   ============================================ */

/* Set RTL direction for entire page in Arabic */
html[lang="ar"],
html[lang="ar"] body {
    direction: rtl !important;
    text-align: right !important;
}

/* ============================================
   SIDEBAR RTL ADJUSTMENTS
   ============================================ */

/* Move sidebar to the right side for Arabic */
html[lang="ar"] .sidebar-fixed {
    left: auto !important;
    right: 0 !important;
    border-left: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-right: none !important;
}

/* Adjust main content padding when sidebar is on right */
html[lang="ar"] .main-content {
    margin-left: 0 !important;
    margin-right: 260px !important;
    padding-right: 2rem !important;
    padding-left: 2rem !important;
}

/* Sidebar navigation items */
html[lang="ar"] .sidebar-nav .nav-link {
    text-align: right !important;
    padding-right: 1.25rem !important;
    padding-left: 1rem !important;
}

/* Icons in sidebar - move to right */
html[lang="ar"] .sidebar-nav .bi {
    margin-right: 0 !important;
    margin-left: 0.75rem !important;
}

/* Badges in sidebar - move to left with proper spacing */
html[lang="ar"] .sidebar-nav .badge {
    margin-right: auto !important;
    margin-left: 12px !important; /* Add space between text and number badge */
}

/* Sub-menu indentation - indent from right */
html[lang="ar"] .sidebar-nav .nav-link.ps-4 {
    padding-left: 1rem !important;
    padding-right: 3rem !important;
}

/* ============================================
   NAVBAR RTL ADJUSTMENTS
   ============================================ */

/* Navbar content alignment */
html[lang="ar"] .navbar {
    direction: rtl !important;
}

html[lang="ar"] .navbar .container-fluid {
    direction: rtl !important;
}

html[lang="ar"] .navbar-nav {
    direction: rtl !important;
}

/* Navbar brand - position on right */
html[lang="ar"] .navbar-brand {
    margin-left: 0 !important;
    margin-right: 20px !important;
}

/* Right side items - position on left in RTL */
html[lang="ar"] .navbar .ms-auto {
    margin-left: 0 !important;
    margin-right: auto !important;
}

/* Reduce gap between navbar icons in Arabic */
html[lang="ar"] .navbar-actions {
    gap: 0.25rem !important;  /* Minimal gap - 4px */
}

/* Navbar icons - spacing adjustments */
html[lang="ar"] .navbar .bi {
    margin-right: 0 !important;
    margin-left: 0 !important;
}

/* Navbar buttons - reduce padding to make them more compact */
html[lang="ar"] .navbar .btn-outline-secondary {
    padding: 0.375rem 0.5rem !important;  /* Reduce button padding */
}

/* Navbar buttons and dropdowns - proper spacing */
html[lang="ar"] .navbar .d-flex.align-items-center {
    direction: rtl !important;
}

/* Search container alignment */
html[lang="ar"] .navbar-search-container {
    direction: rtl !important;
}

html[lang="ar"] .navbar-search-container .input-group {
    direction: rtl !important;
}

html[lang="ar"] .navbar-search-container .input-group-text {
    border-right: 0 !important;
    border-left: 0 !important; /* Remove vertical border line */
    border-radius: 0 0.375rem 0.375rem 0 !important;
}

html[lang="ar"] .navbar-search-container .form-control {
    border-left: 0 !important;
    border-right: 0 !important; /* Remove vertical border line */
    border-radius: 0.375rem 0 0 0.375rem !important;
    padding-right: 0 !important;
    padding-left: 0.75rem !important;
    text-align: right !important;
}

/* Dropdown menus - align to left in RTL (right in LTR becomes left) */
html[lang="ar"] .dropdown-menu {
    left: 0 !important;
    right: auto !important;
    text-align: right !important;
}

html[lang="ar"] .dropdown-menu-end {
    left: auto !important;
    right: 0 !important;
}

html[lang="ar"] .dropdown-item {
    text-align: right !important;
    direction: rtl !important;
}

/* Dropdown arrow positioning for Arabic - Move arrow to left side of text */
html[lang="ar"] .dropdown-toggle {
    flex-direction: row-reverse !important;
    display: inline-flex !important;
    align-items: center !important;
}

html[lang="ar"] .dropdown-toggle::after {
    margin-left: 0 !important;
    margin-right: .255em !important;
    order: -1 !important; /* Move arrow to the beginning (left side) */
}

html[lang="ar"] .dropdown-toggle:empty::after {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Additional targeting for form dropdowns and buttons */
html[lang="ar"] .btn.dropdown-toggle {
    flex-direction: row-reverse !important;
    display: inline-flex !important;
    align-items: center !important;
}

html[lang="ar"] .btn.dropdown-toggle::after {
    margin-left: 0 !important;
    margin-right: .5rem !important;
    order: -1 !important;
}

/* Target select-like dropdowns */
html[lang="ar"] .form-select,
html[lang="ar"] .custom-select {
    background-position: left .75rem center !important;
    padding-left: 2.25rem !important;
    padding-right: .75rem !important;
}

html[lang="ar"] .dropdown-item .bi {
    margin-right: 0 !important;
    margin-left: 0.5rem !important;
}

/* User dropdown alignment */
html[lang="ar"] .navbar-nav .dropdown-menu {
    right: auto !important;
    left: 0 !important;
}

/* User avatar and name */
html[lang="ar"] .user-avatar-button {
    flex-direction: row-reverse !important;
}

html[lang="ar"] .user-avatar-circle {
    margin-left: 0 !important;
    margin-right: 0.5rem !important;
}

/* Notification badges positioning */
html[lang="ar"] .position-absolute.start-100 {
    left: auto !important;
    right: 100% !important;
    transform: translate(50%, -50%) !important;
}

/* Language switcher flag and text */
html[lang="ar"] .language-switcher-dropdown .dropdown-item {
    direction: rtl !important;
}

html[lang="ar"] .language-switcher-dropdown .ms-auto {
    margin-left: 0 !important;
    margin-right: auto !important;
}

/* Quick actions dropdown */
html[lang="ar"] .dropdown-menu .dropdown-header {
    text-align: right !important;
    padding-right: 0 !important;
    padding-left: 1rem !important;
}

/* ============================================
   BUTTONS RTL ADJUSTMENTS
   ============================================ */

/* Button icons - move to right */
html[lang="ar"] .btn .bi {
    margin-right: 0 !important;
    margin-left: 0.5rem !important;
}

/* Button groups */
html[lang="ar"] .btn-group {
    direction: rtl !important;
}

/* ============================================
   FORMS RTL ADJUSTMENTS
   ============================================ */

/* Form labels and controls */
html[lang="ar"] .form-label,
html[lang="ar"] .form-control,
html[lang="ar"] .form-select,
html[lang="ar"] textarea.form-control {
    text-align: right !important;
    direction: rtl !important;
}

/* Form floating labels */
html[lang="ar"] .form-floating > label {
    right: 0 !important;
    left: auto !important;
    transform-origin: right center !important;
}

html[lang="ar"] .form-floating > .form-control:focus ~ label,
html[lang="ar"] .form-floating > .form-control:not(:placeholder-shown) ~ label,
html[lang="ar"] .form-floating > .form-select ~ label {
    transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem) !important;
}

/* Input group icons */
html[lang="ar"] .input-group-text .bi {
    margin: 0 !important;
}

/* Checkboxes and radios - GENERAL FORMS */
html[lang="ar"] .form-check {
    padding-right: 1.5em !important;
    padding-left: 0 !important;
}

html[lang="ar"] .form-check-input {
    float: right !important;
    margin-right: -1.5em !important;
    margin-left: 0 !important;
}

/* OVERRIDE FOR TABLES - Make checkboxes visible in tables */
html[lang="ar"] table .form-check-input,
html[lang="ar"] .table .form-check-input,
html[lang="ar"] table.table .form-check-input {
    float: none !important;
    margin: 0 !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    position: relative !important;
    display: inline-block !important;
}

html[lang="ar"] table .column-checkbox,
html[lang="ar"] .table .column-checkbox {
    text-align: center !important;
}

/* ============================================
   CARDS RTL ADJUSTMENTS
   ============================================ */

/* Card content */
html[lang="ar"] .card {
    text-align: right !important;
}

html[lang="ar"] .card-title,
html[lang="ar"] .card-text,
html[lang="ar"] .card-header,
html[lang="ar"] .card-body,
html[lang="ar"] .card-footer {
    text-align: right !important;
}

/* Card icons */
html[lang="ar"] .card .bi {
    margin-right: 0 !important;
    margin-left: 0.5rem !important;
}

/* ============================================
   TABLES RTL ADJUSTMENTS
   ============================================ */

/* Table content */
html[lang="ar"] table {
    direction: rtl !important;
}

html[lang="ar"] th,
html[lang="ar"] td {
    text-align: right !important;
}

/* Table actions - move to left */
html[lang="ar"] .table-actions {
    text-align: left !important;
}

/* ============================================
   MODALS RTL ADJUSTMENTS
   ============================================ */

/* Modal content */
html[lang="ar"] .modal-content {
    text-align: right !important;
}

html[lang="ar"] .modal-header,
html[lang="ar"] .modal-body,
html[lang="ar"] .modal-footer {
    text-align: right !important;
}

/* Modal close button - move to left */
html[lang="ar"] .modal-header .btn-close {
    margin-right: auto !important;
    margin-left: 0 !important;
}

/* ============================================
   BREADCRUMBS RTL ADJUSTMENTS
   ============================================ */

/* Breadcrumb navigation */
html[lang="ar"] .breadcrumb {
    direction: rtl !important;
}

html[lang="ar"] .breadcrumb-item + .breadcrumb-item::before {
    float: right !important;
    padding-left: 0.5rem !important;
    padding-right: 0 !important;
    content: "/" !important;
}

/* ============================================
   PAGINATION RTL ADJUSTMENTS
   ============================================ */

/* Pagination */
html[lang="ar"] .pagination {
    direction: rtl !important;
}

/* ============================================
   ALERTS & TOASTS RTL ADJUSTMENTS
   ============================================ */

/* Alerts */
html[lang="ar"] .alert {
    text-align: right !important;
}

html[lang="ar"] .alert .bi {
    margin-right: 0 !important;
    margin-left: 0.5rem !important;
}

/* Toast notifications */
html[lang="ar"] .toast {
    text-align: right !important;
}

html[lang="ar"] .toast-header,
html[lang="ar"] .toast-body {
    text-align: right !important;
}

/* ============================================
   TABS RTL ADJUSTMENTS
   ============================================ */

/* Nav tabs */
html[lang="ar"] .nav-tabs,
html[lang="ar"] .nav-pills {
    direction: rtl !important;
}

html[lang="ar"] .nav-tabs .nav-link,
html[lang="ar"] .nav-pills .nav-link {
    text-align: right !important;
}

/* ============================================
   LISTS RTL ADJUSTMENTS
   ============================================ */

/* List groups */
html[lang="ar"] .list-group {
    text-align: right !important;
}

html[lang="ar"] .list-group-item {
    text-align: right !important;
}

/* ============================================
   BADGES & LABELS RTL ADJUSTMENTS
   ============================================ */

/* Badges */
html[lang="ar"] .badge {
    direction: rtl !important;
}

/* Auto-margin badges */
html[lang="ar"] .ms-auto {
    margin-right: 0 !important;
    margin-left: auto !important;
}

html[lang="ar"] .me-auto {
    margin-left: 0 !important;
    margin-right: auto !important;
}

/* ============================================
   FLEXBOX RTL ADJUSTMENTS
   ============================================ */

/* Flex utilities */
html[lang="ar"] .d-flex,
html[lang="ar"] .d-inline-flex {
    direction: rtl !important;
}

/* Gap utilities remain the same but reverse */
html[lang="ar"] .gap-1,
html[lang="ar"] .gap-2,
html[lang="ar"] .gap-3,
html[lang="ar"] .gap-4,
html[lang="ar"] .gap-5 {
    direction: rtl !important;
}

/* ============================================
   MARGINS & PADDINGS RTL SWAP
   ============================================ */

/* Swap left/right margins */
html[lang="ar"] .ms-1 { margin-left: 0 !important; margin-right: 0.25rem !important; }
html[lang="ar"] .ms-2 { margin-left: 0 !important; margin-right: 0.5rem !important; }
html[lang="ar"] .ms-3 { margin-left: 0 !important; margin-right: 1rem !important; }
html[lang="ar"] .ms-4 { margin-left: 0 !important; margin-right: 1.5rem !important; }
html[lang="ar"] .ms-5 { margin-left: 0 !important; margin-right: 3rem !important; }

html[lang="ar"] .me-1 { margin-right: 0 !important; margin-left: 0.25rem !important; }
html[lang="ar"] .me-2 { margin-right: 0 !important; margin-left: 0.5rem !important; }
html[lang="ar"] .me-3 { margin-right: 0 !important; margin-left: 1rem !important; }
html[lang="ar"] .me-4 { margin-right: 0 !important; margin-left: 1.5rem !important; }
html[lang="ar"] .me-5 { margin-right: 0 !important; margin-left: 3rem !important; }

/* Swap left/right paddings */
html[lang="ar"] .ps-1 { padding-left: 0 !important; padding-right: 0.25rem !important; }
html[lang="ar"] .ps-2 { padding-left: 0 !important; padding-right: 0.5rem !important; }
html[lang="ar"] .ps-3 { padding-left: 0 !important; padding-right: 1rem !important; }
html[lang="ar"] .ps-4 { padding-left: 0 !important; padding-right: 1.5rem !important; }
html[lang="ar"] .ps-5 { padding-left: 0 !important; padding-right: 3rem !important; }

html[lang="ar"] .pe-1 { padding-right: 0 !important; padding-left: 0.25rem !important; }
html[lang="ar"] .pe-2 { padding-right: 0 !important; padding-left: 0.5rem !important; }
html[lang="ar"] .pe-3 { padding-right: 0 !important; padding-left: 1rem !important; }
html[lang="ar"] .pe-4 { padding-right: 0 !important; padding-left: 1.5rem !important; }
html[lang="ar"] .pe-5 { padding-right: 0 !important; padding-left: 3rem !important; }

/* ============================================
   TEXT ALIGNMENT RTL ADJUSTMENTS
   ============================================ */

/* Swap text alignment */
html[lang="ar"] .text-start { text-align: right !important; }
html[lang="ar"] .text-end { text-align: left !important; }

/* ============================================
   FLOAT RTL ADJUSTMENTS
   ============================================ */

/* Swap floats */
html[lang="ar"] .float-start { float: right !important; }
html[lang="ar"] .float-end { float: left !important; }

/* ============================================
   BORDER RTL ADJUSTMENTS
   ============================================ */

/* Swap border sides */
html[lang="ar"] .border-start { border-left: 0 !important; border-right: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important; }
html[lang="ar"] .border-end { border-right: 0 !important; border-left: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important; }

/* ============================================
   SPECIAL COMPONENTS RTL ADJUSTMENTS
   ============================================ */

/* Stats cards */
html[lang="ar"] .stats-card {
    text-align: right !important;
}

/* Timeline */
html[lang="ar"] .timeline {
    direction: rtl !important;
}

html[lang="ar"] .timeline-item {
    text-align: right !important;
}

/* Activity feed */
html[lang="ar"] .activity-item {
    text-align: right !important;
}

/* Search bars */
html[lang="ar"] .search-bar {
    direction: rtl !important;
}

html[lang="ar"] .search-bar .form-control {
    text-align: right !important;
}

/* Tags input */
html[lang="ar"] .tags-input {
    direction: rtl !important;
}

/* ============================================
   PRINT RTL ADJUSTMENTS
   ============================================ */

/* ============================================
   IMPROVED SPACING FOR ARABIC RTL
   ============================================ */

/* Better spacing between badges and text in navigation */
html[lang="ar"] .nav-link .badge {
    margin-left: 12px !important;  /* Space on left side in RTL */
    margin-right: 0 !important;
}

/* Add spacing between menu text and badge in RTL */
html[lang="ar"] .sidebar-nav .nav-link span:not(.badge) {
    margin-left: 8px;   /* Space after text in RTL */
    margin-right: 0;
}

/* Better spacing for icons and text */
html[lang="ar"] .d-flex .badge {
    margin-left: 8px !important;
}

/* Remove internal borders from input groups in Arabic */
html[lang="ar"] .input-group > .input-group-text {
    border-left: 0 !important;
    border-right: 0 !important;
}

html[lang="ar"] .input-group > .form-control {
    border-left: 0 !important;
    border-right: 0 !important;
}

/* Add outer border to entire input group */
html[lang="ar"] .input-group {
    border: 1px solid #e0e0e0;
}

/* Lead detail page - Right sidebar spacing improvements */
html[lang="ar"] .list-group-item .badge {
    margin-left: 10px !important;
}

/* Better gap spacing in flex containers */
html[lang="ar"] .gap-2 > * + * {
    margin-right: 0.5rem !important;
    margin-left: 0 !important;
}

html[lang="ar"] .gap-3 > * + * {
    margin-right: 1rem !important;
    margin-left: 0 !important;
}

/* Tabs with badges - better spacing */
html[lang="ar"] .nav-tabs .nav-link .badge,
html[lang="ar"] .nav-pills .nav-link .badge {
    margin-left: 8px !important;
    margin-right: 0 !important;
}

/* Card titles with icons - better spacing */
html[lang="ar"] .card-title i,
html[lang="ar"] h1 i,
html[lang="ar"] h2 i,
html[lang="ar"] h3 i,
html[lang="ar"] h4 i,
html[lang="ar"] h5 i,
html[lang="ar"] h6 i {
    margin-left: 8px !important;
    margin-right: 0 !important;
}

/* ============================================
   PRINT RTL ADJUSTMENTS
   ============================================ */

@media print {
    html[lang="ar"] {
        direction: rtl !important;
    }
    
    html[lang="ar"] body {
        text-align: right !important;
    }
}

/* ============================================
   TABLE CHECKBOX FIX FOR ARABIC
   ============================================ */

/* Ensure checkboxes are visible and clickable in tables */
html[lang="ar"] table .form-check-input,
html[lang="ar"] .table .form-check-input,
html[lang="ar"] .lead-checkbox,
html[lang="ar"] #selectAll {
    float: none !important;
    margin: 0 auto !important;
    position: static !important;
    display: inline-block !important;
    cursor: pointer !important;
}

/* Center checkboxes in their table cells */
html[lang="ar"] .column-checkbox {
    text-align: center !important;
    vertical-align: middle !important;
}

/* Ensure checkbox column is always visible */
html[lang="ar"] th.column-checkbox,
html[lang="ar"] td.column-checkbox {
    width: 50px !important;
    min-width: 50px !important;
    padding: 0.75rem !important;
}

/* Remove any negative margins from table checkboxes */
html[lang="ar"] table .form-check,
html[lang="ar"] .table .form-check {
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

/* Make sure checkbox is above other elements */
html[lang="ar"] table .form-check-input {
    z-index: 10 !important;
}

/* Apply same fixes for contacts and properties */
html[lang="ar"] .contact-checkbox,
html[lang="ar"] .property-checkbox {
    float: none !important;
    margin: 0 auto !important;
    position: static !important;
    display: inline-block !important;
    cursor: pointer !important;
}