/**
 * Elementor Widgets RTL Fixes
 * 
 * @package DiveBnB_WTE_Customizations
 * 
 * Specific fixes for WP Travel Engine Elementor widgets in RTL mode
 * - Tour Search Widget button positioning
 * - Trip Search Advanced Fields
 * - Search form layouts
 */

/* ELEMENTOR TRIP SEARCH WIDGET - RTL FIX */

/* Fix Tour Search Widget Container */
body.rtl .wpte-widget .wpte-tour-search,
body.rtl .wpte-tour-search {
    direction: rtl;
    text-align: right;
}

/* Fix Search Form Layout */
body.rtl .wpte-widget .wpte-tour-search .form-section .search-form {
    direction: rtl;
}

/* Fix Search Field Input - Text should align right */
body.rtl .wpte-widget .wpte-tour-search .form-section .search-field {
    direction: rtl;
    text-align: right;
    padding: var(--search-padding, 16px 24px 16px 8px); /* Reversed padding */
}

/* CRITICAL FIX: Move search button to LEFT side for RTL */
body.rtl .wpte-widget .wpte-tour-search .form-section .search-submit {
    right: auto !important;
    left: 8px !important;
}

/* Fix Search Keywords/Categories */
body.rtl .wpte-widget .wpte-tour-search .search-keyword {
    direction: rtl;
    text-align: right;
}

body.rtl .wpte-widget .wpte-tour-search .search-keyword .cat-title {
    direction: rtl;
}

/* Fix Trip Search Advanced Fields */
body.rtl .wpte-trip-sfilter-wrapper {
    direction: rtl;
}

body.rtl .wpte-trip__search-fields {
    direction: rtl;
}

/* Fix Trip Search Individual Field */
body.rtl .wpte-trip__adv-field {
    direction: rtl;
    text-align: right;
}

/* Fix Icon Position in Search Fields */
body.rtl .wpte-trip__adv-field .icon {
    margin-right: 0;
    margin-left: 8px;
    order: 2; /* Move icon to right side */
}

body.rtl .wpte-trip__adv-field .wpte__input {
    text-align: right;
    direction: rtl;
    padding-right: 12px;
    padding-left: 40px;
}

/* Fix Select Dropdown Options */
body.rtl .wpte__select-options {
    direction: rtl;
    text-align: right;
}

body.rtl .wpte__select-options ul {
    text-align: right;
}

body.rtl .wpte__select-options ul li {
    text-align: right;
    padding-right: 12px;
    padding-left: 12px;
}

/* Fix Submit Button */
body.rtl .wpte-trip__submit-field {
    text-align: right;
}

body.rtl .wpte-trip__search-submit {
    direction: rtl;
}

/* Fix Horizontal Layout for RTL */
body.rtl .wpte-trip__search-fields.horizontal {
    direction: rtl;
}

body.rtl .wpte-trip__search-fields.horizontal .wpte-trip__adv-field {
    direction: rtl;
}

/* ==================================================
   SEARCH WIDGET SPACING FIXES (LTR + RTL)
   ================================================== */

/* Ensure Tour Search Widget has proper spacing */
.wpte-widget .wpte-tour-search .form-section {
    position: relative;
}

/* Fix button overlap - ensure it stays inside the field */
.wpte-widget .wpte-tour-search .form-section .search-submit {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    pointer-events: auto;
}

/* Ensure search input has proper padding to avoid overlap with button */
.wpte-widget .wpte-tour-search .form-section .search-field {
    padding-right: 60px !important; /* Extra space for button */
    box-sizing: border-box;
}

/* Fix for horizontal layout */
.wpte-trip__search-fields.horizontal {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.wpte-trip__search-fields.horizontal .wpte-trip__adv-field {
    flex: 1;
    min-width: 200px;
}

.wpte-trip__search-fields.horizontal .wpte-trip__submit-field {
    flex: 0 0 auto;
}

/* ==================================================
   ELEMENTOR WIDGET GENERAL RTL
   ================================================== */

body.rtl .wpte-elementor-widget {
    direction: rtl;
}

body.rtl .wpte-gblock-wrapper {
    direction: rtl;
    text-align: right;
}

body.rtl .wpte-gblock-title-wrap {
    text-align: right;
}

/* ==================================================
   ITINERARY WIDGET - RTL FIXES
   ================================================== */

/* Fix main itinerary container */
html[dir="rtl"] .wte-itinerary-header-wrapper,
html[dir="rtl"] .wp-travel-engine-itinerary-header,
html[dir="rtl"] .post-data.itinerary,
html[dir="rtl"] .wte-trip-itinerary-v2,
body.rtl .wte-itinerary-header-wrapper,
body.rtl .wp-travel-engine-itinerary-header,
body.rtl .post-data.itinerary,
body.rtl .wte-trip-itinerary-v2 {
    direction: rtl !important;
    text-align: right !important;
}

/* Fix itinerary row */
html[dir="rtl"] .itinerary-row,
body.rtl .itinerary-row {
    direction: rtl !important;
}

/* CRITICAL: Fix the head wrapper layout - Day on RIGHT, toggle on LEFT */
html[dir="rtl"] .wte-itinerary-head-wrap,
body.rtl .wte-itinerary-head-wrap {
    direction: rtl !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 10px;
}

/* Day label (e.g., "Day 01") - position on RIGHT side first */
html[dir="rtl"] .wte-itinerary-head-wrap > .title,
body.rtl .wte-itinerary-head-wrap > .title {
    order: 1 !important;
    flex-shrink: 0 !important;
    text-align: right !important;
    margin-left: 10px !important;
    margin-right: 0 !important;
}

/* Accordion toggle link - comes after Day label */
html[dir="rtl"] .wte-itinerary-head-wrap > .accordion-tabs-toggle,
body.rtl .wte-itinerary-head-wrap > .accordion-tabs-toggle,
html[dir="rtl"] .wte-itinerary-head-wrap > span.accordion-tabs-toggle,
body.rtl .wte-itinerary-head-wrap > span.accordion-tabs-toggle {
    order: 2 !important;
    flex: 1 !important;
    display: flex !important;
    flex-direction: row-reverse !important;
    align-items: center !important;
    text-align: right !important;
}

/* Arrow/toggle icon - move to LEFT side of the row */
html[dir="rtl"] .accordion-tabs-toggle .dashicons,
html[dir="rtl"] .accordion-tabs-toggle .custom-toggle-tabs,
body.rtl .accordion-tabs-toggle .dashicons,
body.rtl .accordion-tabs-toggle .custom-toggle-tabs {
    order: 2 !important;
    margin-right: 10px !important;
    margin-left: 0 !important;
}

/* Itinerary title text - align right */
html[dir="rtl"] .accordion-tabs-toggle .itinerary-title,
body.rtl .accordion-tabs-toggle .itinerary-title {
    order: 1 !important;
    text-align: right !important;
    flex: 1 !important;
}

/* Expand all button - align left */
html[dir="rtl"] .wp-travel-engine-itinerary-header,
body.rtl .wp-travel-engine-itinerary-header {
    display: flex !important;
    flex-direction: row-reverse !important;
    align-items: center !important;
    justify-content: space-between !important;
}

html[dir="rtl"] .wpte-itinerary-title,
body.rtl .wpte-itinerary-title {
    order: 1 !important;
    text-align: right !important;
}

html[dir="rtl"] .aib-button-toggle,
body.rtl .aib-button-toggle {
    order: 2 !important;
    margin-left: 0 !important;
    margin-right: auto !important;
}

/* Fix itinerary content area */
html[dir="rtl"] .itinerary-content,
html[dir="rtl"] .itinerary-content .content,
body.rtl .itinerary-content,
body.rtl .itinerary-content .content {
    direction: rtl !important;
    text-align: right !important;
}

/* Fix custom icons position */
html[dir="rtl"] .title .custom-icon,
body.rtl .title .custom-icon {
    margin-left: 8px !important;
    margin-right: 0 !important;
}

/* Fix slider/carousel buttons */
html[dir="rtl"] .itinerary-row .swiper-button-next,
html[dir="rtl"] .itinerary-content .swiper-button-next,
body.rtl .itinerary-row .swiper-button-next,
body.rtl .itinerary-content .swiper-button-next {
    right: auto !important;
    left: 10px !important;
}

html[dir="rtl"] .itinerary-row .swiper-button-prev,
html[dir="rtl"] .itinerary-content .swiper-button-prev,
body.rtl .itinerary-row .swiper-button-prev,
body.rtl .itinerary-content .swiper-button-prev {
    left: auto !important;
    right: 10px !important;
}

/* Fix additional itinerary info items */
html[dir="rtl"] .wpte-itinerary-infos,
body.rtl .wpte-itinerary-infos {
    direction: rtl !important;
}

html[dir="rtl"] .wpte-itinerary-info-item,
body.rtl .wpte-itinerary-info-item {
    flex-direction: row-reverse !important;
    text-align: right !important;
}

html[dir="rtl"] .wpte-itinerary-info-item-icon,
body.rtl .wpte-itinerary-info-item-icon {
    margin-left: 10px !important;
    margin-right: 0 !important;
}

html[dir="rtl"] .wpte-itinerary-info-item-content,
body.rtl .wpte-itinerary-info-item-content {
    text-align: right !important;
}