[dir="rtl"] .feedback-tags > .form-check.form-check-inline {
    display: inline-flex !important;
    align-items: center !important;
    flex-direction: row-reverse !important; /* checkbox on the right */
    gap: .35rem !important;
    padding: 0 !important;
    margin: 0 .75rem .5rem 0 !important; /* space between chips */
}
[dir="rtl"] .feedback-tags > .form-check.form-check-inline > .form-check-input {
    position: static !important;
    float: none !important;
    flex: 0 0 auto !important;
    margin: 0 0 0 .3125rem !important; /* small gap to label */
    order: 2 !important; /* ensure input sits on the right */
}
[dir="rtl"] .feedback-tags > .form-check.form-check-inline > .form-check-label {
    flex: 0 1 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    text-align: left !important;
    order: 1 !important; /* ensure label sits left of the input */
    margin-bottom: 0 !important;
}
[dir="rtl"] .feedback-tags {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
}
[dir="rtl"] .feedback-tags .form-check.form-check-inline {
    flex: 0 0 auto !important; /* prevent full-width growth */
}
[dir="rtl"] .feedback-tags .form-check {
    display: inline-flex !important;
    width: auto !important;
}
/* === COMPREHENSIVE RTL SUPPORT === */
/* Additional RTL layout support for Arabic language */

/* RTL-specific input group fixes */
[dir="rtl"] .input-group-prepend {
    order: 2;
}

[dir="rtl"] .input-group-append {
    order: 0;
}

[dir="rtl"] .input-group .form-control {
    order: 1;
}

/* RTL-specific close button positioning */
[dir="rtl"] .close {
    float: left;
}

[dir="rtl"] .modal-header .close {
    margin: -1rem auto -1rem -1rem;
}

/* Force numeric fields to LTR in RTL context */
[dir="rtl"] input[type="number"],
[dir="rtl"] .numeric-field,
[dir="rtl"] .price-display,
[dir="rtl"] .amount-display {
    direction: ltr !important;
    text-align: left !important;
}

/* RTL-specific card and form adjustments */
[dir="rtl"] .card-header {
    text-align: right;
}

[dir="rtl"] .form-label {
    text-align: right;
}

/* RTL-specific button group adjustments */
[dir="rtl"] .btn-group .btn:first-child {
    border-top-right-radius: 0.25rem;
    border-bottom-right-radius: 0.25rem;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

[dir="rtl"] .btn-group .btn:last-child {
    border-top-left-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

/* RTL-specific dropdown positioning */
[dir="rtl"] .dropdown-menu {
    right: 0;
    left: auto;
}

/* RTL-specific alert positioning */
[dir="rtl"] .alert-dismissible .close {
    position: absolute;
    top: 0;
    left: 0;
    right: auto;
    padding: 0.75rem 1.25rem;
}

/* === RTL FORM IMPROVEMENTS === */
/* RTL-specific form-check improvements */
[dir="rtl"] .form-check {
    padding-right: 1.25rem;
    padding-left: 0;
    text-align: right;
}

[dir="rtl"] .form-check-input {
    margin-right: -1.25rem;
    margin-left: 0;
    float: right;
}

[dir="rtl"] .form-check-label {
    padding-right: 0.5rem;
    padding-left: 0;
    margin-right: 0;
    margin-left: 0;
}

/* RTL-specific input group improvements */
[dir="rtl"] .input-group-sm .form-control {
    text-align: right;
}

[dir="rtl"] .input-group-sm .input-group-text {
    border-left: 1px solid #ced4da;
    border-right: 0;
}

[dir="rtl"] .input-group .input-group-prepend {
    margin-left: 0;
    margin-right: -1px;
}

[dir="rtl"] .input-group .input-group-append {
    margin-right: 0;
    margin-left: -1px;
}

/* RTL-specific form spacing */
[dir="rtl"] .form-group {
    margin-bottom: 1rem;
    text-align: right;
}

[dir="rtl"] .form-row .form-group {
    padding-right: 15px;
    padding-left: 15px;
}

[dir="rtl"] .form-group label {
    text-align: right;
    display: block;
    margin-bottom: 0.5rem;
}

/* Custom RTL form improvements */
[dir="rtl"] .rtl-form-check {
    text-align: right;
    padding-right: 1.5rem;
    padding-left: 0;
}

[dir="rtl"] .rtl-label {
    display: inline-block;
    margin-right: 0.5rem;
    margin-left: 0;
}

[dir="rtl"] .cash-amount,
[dir="rtl"] .points-credit {
    float: left;
    margin-left: 0.5rem;
    margin-right: 0;
}

/* RTL-specific payment method styling */
[dir="rtl"] .payment-method-section {
    text-align: right;
}

[dir="rtl"] .payment-method-section .form-check {
    margin-bottom: 0.75rem;
    padding-right: 1.5rem;
    padding-left: 0;
    position: relative;
    display: block;
}

[dir="rtl"] .payment-method-section .form-check-input {
    position: absolute;
    right: 0;
    top: 0.125rem;
    margin-right: 0;
    margin-left: 0;
    z-index: 1;
}

[dir="rtl"] .payment-method-section .form-check-label {
    padding-right: 1.5rem;
    padding-left: 0;
    width: 100%;
    cursor: pointer;
    display: block;
    position: relative;
}

/* Ensure all radio buttons are visible */
[dir="rtl"] .form-check-input[type="radio"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute;
    right: 0;
    top: 0.125rem;
    margin: 0;
    z-index: 2;
}

/* Fix for loyalty/subscription options that might be hidden */
[dir="rtl"] .loyalty-payment-option .form-check-input,
[dir="rtl"] .subscription-payment-option .form-check-input {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* RTL-specific subscription and points styling */
[dir="rtl"] .subscription-select-group,
[dir="rtl"] .points-redemption-group {
    margin-top: 0.5rem;
    padding-right: 1.5rem;
    padding-left: 0;
}

[dir="rtl"] .points-value-display {
    direction: ltr;
    text-align: left;
}

/* RTL-specific small text alignment */
[dir="rtl"] .form-text {
    text-align: right;
}

[dir="rtl"] .form-text .points-credit {
    direction: ltr;
    display: inline-block;
}

/* Kids name badge section RTL layout fixes - force horizontal display */
[dir="rtl"] #kidsList {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 0.5rem;
    width: 100%;
}

[dir="rtl"] #kidsList > * {
    /* Force all direct children to display inline */
    display: inline-flex !important;
    margin-left: 0.25rem;
    margin-right: 0;
    margin-bottom: 0.25rem;
    flex-shrink: 0;
}

[dir="rtl"] #kidsList .badge {
    white-space: nowrap;
    display: inline-flex !important;
    align-items: center;
}

[dir="rtl"] #kidsList .btn {
    display: inline-flex !important;
    align-items: center;
}

/* Children details section RTL fixes - COMPREHENSIVE SOLUTION */
/* Target both hardcoded first child and JS-generated subsequent children */

/* Container spacing for X button */
[dir="rtl"] .child-entry,
[dir="rtl"] #childrenContainer .child-entry {
    position: relative !important;
    padding-left: 3rem !important;
    padding-right: 1rem !important;
}

/* X button positioning - Override inline styles */
[dir="rtl"] .child-entry .remove-child-btn {
    position: absolute !important;
    left: 10px !important;
    right: auto !important;
    top: 10px !important;
    z-index: 10 !important;
}

/* RADIO BUTTON FIXES - Target all form-check variations */
/* Standard form-check (hardcoded first child) */
[dir="rtl"] .child-entry .form-check,
[dir="rtl"] .child-entry .rtl-form-check {
    text-align: right !important;
    padding-right: 1.25rem !important;
    padding-left: 0 !important;
    margin-bottom: 0.5rem !important;
    position: relative !important;
    direction: rtl !important;
}

/* Radio button input positioning */
[dir="rtl"] .child-entry .form-check-input {
    position: absolute !important;
    right: 0 !important;
    left: auto !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    top: 0.125rem !important;
    float: none !important;
}

/* Radio button labels */
[dir="rtl"] .child-entry .form-check-label,
[dir="rtl"] .child-entry .rtl-label {
    padding-right: 1.5rem !important;
    padding-left: 0 !important;
    display: block !important;
    text-align: right !important;
    width: 100% !important;
    direction: rtl !important;
}

/* Payment methods container */
[dir="rtl"] .child-entry .payment-methods {
    text-align: right !important;
    direction: rtl !important;
}

/* All payment method form-checks */
[dir="rtl"] .child-entry .payment-methods .form-check,
[dir="rtl"] .child-entry .payment-methods .rtl-form-check {
    margin-bottom: 0.75rem !important;
    padding-right: 1.5rem !important;
    padding-left: 0 !important;
    text-align: right !important;
    direction: rtl !important;
}

/* Subscription dropdown positioning */
[dir="rtl"] .child-entry .subscription-select-group {
    margin-right: 1rem !important;
    margin-left: 0 !important;
    text-align: right !important;
}

/* Points redemption group positioning */
[dir="rtl"] .child-entry .points-redemption-group {
    margin-right: 1rem !important;
    margin-left: 0 !important;
    text-align: right !important;
}

/* Input groups inside points section - Keep LTR for numbers */
[dir="rtl"] .child-entry .points-redemption-group .input-group {
    direction: ltr !important;
    text-align: left !important;
}

/* Cash amount display - Keep LTR for numbers */
[dir="rtl"] .child-entry .cash-amount {
    direction: ltr !important;
    display: inline-block !important;
}

/* Form labels RTL alignment */
[dir="rtl"] .child-entry .form-group label {
    text-align: right !important;
    display: block !important;
    width: 100% !important;
}

/* Form controls RTL */
[dir="rtl"] .child-entry .form-control {
    text-align: right !important;
}

/* Numeric inputs should remain LTR */
[dir="rtl"] .child-entry input[type="number"],
[dir="rtl"] .child-entry .points-input,
[dir="rtl"] .child-entry .cash-amount,
[dir="rtl"] .child-entry .numeric-display,
[dir="rtl"] .child-entry .points-value-display {
    direction: ltr !important;
    text-align: left !important;
}

/* Bootstrap form-check override for RTL */
[dir="rtl"] .form-check {
    padding-right: 1.25rem !important;
    padding-left: 0 !important;
}

[dir="rtl"] .form-check-input {
    margin-right: -1.25rem !important;
    margin-left: 0 !important;
}

/* Additional specificity for payment method radios */
[dir="rtl"] .child-entry .payment-method-radio {
    position: absolute !important;
    right: 0 !important;
    left: auto !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    top: 0.125rem !important;
}

/* ULTRA-SPECIFIC RTL RADIO BUTTON FIXES */
/* Force radio buttons to right side with maximum specificity */
[dir="rtl"] .child-entry .payment-methods .form-check .form-check-input,
[dir="rtl"] .child-entry .payment-methods .rtl-form-check .form-check-input,
[dir="rtl"] .child-entry .payment-methods .form-check .payment-method-radio,
[dir="rtl"] .child-entry .payment-methods .rtl-form-check .payment-method-radio {
    position: absolute !important;
    right: 0 !important;
    left: auto !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    top: 0.125rem !important;
    transform: none !important;
}

/* Force form-check containers to have proper RTL structure */
[dir="rtl"] .child-entry .payment-methods .form-check,
[dir="rtl"] .child-entry .payment-methods .rtl-form-check {
    position: relative !important;
    display: block !important;
    min-height: 1.5rem !important;
    padding-right: 1.5rem !important;
    padding-left: 0 !important;
    margin-bottom: 0.5rem !important;
    text-align: right !important;
    direction: rtl !important;
}

/* Force labels to have proper RTL spacing and layout */
[dir="rtl"] .child-entry .payment-methods .form-check-label,
[dir="rtl"] .child-entry .payment-methods .rtl-label {
    position: relative !important;
    display: block !important;
    padding-right: 2rem !important;
    padding-left: 0.5rem !important;
    margin-bottom: 0 !important;
    font-weight: normal !important;
    text-align: right !important;
    direction: rtl !important;
    cursor: pointer !important;
    line-height: 1.5 !important;
    min-height: 1.5rem !important;
    word-wrap: break-word !important;
}

/* Override any Bootstrap or other CSS that might interfere */
[dir="rtl"] .child-entry input[type="radio"] {
    position: absolute !important;
    right: 0 !important;
    left: auto !important;
    margin: 0 !important;
    top: 0.125rem !important;
}

/* Ensure payment method section has proper RTL flow */
[dir="rtl"] .child-entry .payment-method-section {
    direction: rtl !important;
    text-align: right !important;
}

/* Force all radio inputs in child entries to right side */
[dir="rtl"] .child-entry input[type="radio"][name*="payment_method"] {
    position: absolute !important;
    right: 0 !important;
    left: auto !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    top: 0.125rem !important;
    z-index: 1 !important;
}

/* Final RTL layout refinements */
[dir="rtl"] .child-entry .payment-methods {
    overflow: hidden !important;
    clear: both !important;
}

/* Ensure proper spacing between payment options */
[dir="rtl"] .child-entry .payment-methods .form-check:not(:last-child),
[dir="rtl"] .child-entry .payment-methods .rtl-form-check:not(:last-child) {
    margin-bottom: 1rem !important;
    border-bottom: 1px solid #e9ecef;
    padding-bottom: 0.5rem !important;
}

/* Ensure icons and text are properly aligned */
[dir="rtl"] .child-entry .payment-methods .form-check-label i,
[dir="rtl"] .child-entry .payment-methods .rtl-label i {
    margin-left: 0.5rem !important;
    margin-right: 0 !important;
    display: inline-block !important;
    width: 1.2rem !important;
    text-align: center !important;
}

/* Cash amount positioning in RTL */
[dir="rtl"] .child-entry .payment-methods .cash-amount {
    float: left !important;
    margin-left: 0.5rem !important;
    margin-right: 0 !important;
    direction: ltr !important;
}

/* Prevent text overflow and ensure proper wrapping */
[dir="rtl"] .child-entry .payment-methods .form-check-label,
[dir="rtl"] .child-entry .payment-methods .rtl-label {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: normal !important;
    max-width: calc(100% - 2rem) !important;
}

/* === RTL fixes for Bootstrap custom-checkbox (used on feedback tags) === */
[dir="rtl"] .custom-control {
    position: relative !important;
    padding-right: 1.5rem !important; /* space for checkbox on the right */
    padding-left: 0 !important;
    text-align: right !important;
}

/* Move the checkbox box to the right */
[dir="rtl"] .custom-control-label::before,
[dir="rtl"] .custom-control-label::after {
    /* In Bootstrap 4, the box is placed at left:-1.5rem; mirror that to the right */
    right: -1.5rem !important;
    left: auto !important;
    top: .25rem !important; /* align vertically with text */
}

/* Ensure the input itself sits on the right for hit area */
[dir="rtl"] .custom-control-input {
    /* Mirror Bootstrap's left: 0 placement */
    right: 0 !important;
    left: auto !important;
}

/* Label text padding so it doesn't overlap the checkbox */
[dir="rtl"] .custom-control-label {
    /* Provide space on the right equal to/greater than the control box width */
    padding-right: 1.75rem !important; /* 1.5rem box + .25rem gap */
    padding-left: 0 !important;
    margin-right: 0 !important;  /* keep label aligned */
    text-align: right !important;
    position: relative !important; /* anchor for ::before/::after */
}

/* Keep the tag checkboxes wrapping nicely in RTL */
[dir="rtl"] .d-flex.flex-wrap .custom-control {
    margin-left: .5rem !important;
    margin-right: 0 !important;
}

/* === Generic RTL fixes for Bootstrap .form-check (e.g., consent checkbox) === */
[dir="rtl"] .form-check {
    position: relative !important;
    /* Bootstrap uses 1.25rem for checkbox gutter; mirror to right */
    padding-right: 1.25rem !important;
    padding-left: 0 !important;
    text-align: right !important;
}
[dir="rtl"] .form-check:not(.form-check-inline) .form-check-input {
    position: absolute !important;
    right: 0 !important;
    left: auto !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    top: .25rem !important; /* aligns with label baseline */
}
[dir="rtl"] .form-check .form-check-label {
    padding-right: .5rem !important;
    padding-left: 0 !important;
    margin-right: 0 !important;
    text-align: right !important;
}

/* Flip inline checkbox spacing in RTL (Bootstrap sets margin-right: .75rem) */
[dir="rtl"] .form-check-inline {
    margin-right: 0 !important;
    margin-left: .75rem !important;
    display: inline-flex !important;
    align-items: center !important;
    flex-direction: row-reverse !important; /* place checkbox to the right of label */
    column-gap: .35rem !important; /* modern browsers */
}

/* Inline checkboxes in RTL should not use absolute positioning */
[dir="rtl"] .form-check-inline .form-check-input {
    position: static !important;
    right: auto !important;
    left: auto !important;
    float: none !important; /* cancel Bootstrap float in RTL */
    margin-right: 0 !important;
    margin-left: .3125rem !important; /* mirror Bootstrap's margin-right */
    top: auto !important;
}
[dir="rtl"] .form-check-inline {
    padding-right: 0 !important; /* no gutter padding for inline variant */
}
[dir="rtl"] .form-check-inline .form-check-label {
    padding-right: 0 !important; /* remove extra padding for inline layout */
    display: inline-block !important;
    white-space: nowrap !important;
    text-align: left !important; /* label sits left of the box in RTL inline */
    margin-bottom: 0 !important;
}

/* Stronger scoped overrides for feedback tags row to win over generic .form-check rules */
[dir="rtl"] .feedback-tags .form-check.form-check-inline {
    padding-right: 0 !important;
    margin-left: .75rem !important;
    flex-direction: row-reverse !important;
    column-gap: .35rem !important;
}
[dir="rtl"] .feedback-tags .form-check.form-check-inline .form-check-input {
    position: static !important;
    right: auto !important;
    left: auto !important;
    float: none !important;
    margin-left: .3125rem !important;
    margin-right: 0 !important;
    top: auto !important;
}
[dir="rtl"] .feedback-tags .form-check-input {
    float: none !important;
    margin-right: 0 !important;
}
[dir="rtl"] .feedback-tags .form-check.form-check-inline .form-check-label {
    padding-right: 0 !important;
    margin-right: 0 !important;
    display: inline-block !important;
    white-space: nowrap !important;
    text-align: left !important;
}
