/*!
 * FLUENT RTL - Microsoft Fluent Design System
 * Professional Right-to-Left Language Support
 * Version 2.0
 */

:root {
    /* Fluent RTL Spacing */
    --rtl-spacing-xs: 4px;
    --rtl-spacing-sm: 8px;
    --rtl-spacing-md: 16px;
    --rtl-spacing-lg: 24px;
    --rtl-spacing-xl: 32px;
    
    /* Fluent RTL Animation */
    --rtl-transition: 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ===== BASE RTL CONTAINER ===== */
.rtl {
    direction: rtl;
    unicode-bidi: embed;
    text-align: right;
    font-family: 'Segoe UI', 'Tahoma', 'Arial', sans-serif;
}

/* Maintain LTR for specific elements like code, URLs, etc. */
.rtl code,
.rtl pre,
.rtl .url,
.rtl .email,
.rtl [dir="ltr"] {
    direction: ltr;
    unicode-bidi: embed;
    text-align: left;
}

/* ===== FLOATING UTILITIES ===== */
.rtl .pull-left {
    float: right !important;
    margin-left: 0 !important;
    margin-right: var(--rtl-spacing-sm) !important;
}

.rtl .pull-right {
    float: left !important;
    margin-right: 0 !important;
    margin-left: var(--rtl-spacing-sm) !important;
}

/* ===== TABLES ===== */
.rtl table.list thead th,
.rtl table.list caption,
.rtl .dialog th,
.rtl .tip_box th {
    text-align: right;
}

.rtl table.list thead th a {
    background-position: 100% 50%;
    padding-right: 3px;
    padding-left: 20px;
    display: inline-block;
}

.rtl table.list thead th.sortable a {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='%23605e5c'%3E%3Cpath d='M12 5.83L15.17 9l1.41-1.41L12 3 7.41 7.59 8.83 9 12 5.83zm0 12.34L8.83 15l-1.41 1.41L12 21l4.59-4.59L15.17 15 12 18.17z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: left center;
    padding-right: 3px;
    padding-left: 20px;
}

.rtl table.list thead th.sortable.desc a,
.rtl table.list thead th.sortable.asc a {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='%230078d4'%3E%3Cpath d='M12 5.83L15.17 9l1.41-1.41L12 3 7.41 7.59 8.83 9 12 5.83zm0 12.34L8.83 15l-1.41 1.41L12 21l4.59-4.59L15.17 15 12 18.17z'/%3E%3C/svg%3E");
}

/* ===== DIALOGS ===== */
.rtl .dialog {
    text-align: right;
}

.rtl .dialog h3 {
    padding-right: inherit;
    padding-left: 2.5em;
    position: relative;
}

.rtl .dialog a.close {
    right: auto;
    left: 1.25em;
    transition: transform var(--rtl-transition);
}

.rtl .dialog a.close:hover {
    transform: scale(1.1);
}

/* ===== NAVIGATION ===== */
.rtl #nav .inactive li,
.rtl #sub_nav li {
    text-align: right;
}

.rtl #nav .inactive li a,
.rtl #sub_nav li a {
    background-position: 100% 50%;
    padding-left: 0;
    padding-right: 28px;
    position: relative;
    transition: padding var(--rtl-transition);
}

.rtl #nav .inactive li a:hover,
.rtl #sub_nav li a:hover {
    padding-right: 32px;
}

.rtl #nav li.inactive > ul {
    left: auto;
    right: 0;
    box-shadow: -2px 2px 8px rgba(0, 0, 0, 0.1);
}

.rtl #sub_nav li + li > a {
    margin-left: 0;
    margin-right: var(--rtl-spacing-md);
    position: relative;
}

.rtl #sub_nav li + li > a::before {
    content: '';
    position: absolute;
    right: calc(-1 * var(--rtl-spacing-sm));
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 16px;
    background: rgba(0, 0, 0, 0.15);
}

/* ===== TOOLTIPS & TIPS ===== */
.rtl .tip_close {
    right: auto;
    left: 0.75em;
    transition: transform var(--rtl-transition);
}

.rtl .tip_close:hover {
    transform: scale(1.1);
}

.rtl .tip_content h1 {
    padding-right: 0;
    padding-left: 1.75em;
}

.rtl .tip_box {
    text-align: right;
}

/* ===== NOTIFICATIONS ===== */
.rtl #msg_notice,
.rtl #warning_bar,
.rtl #msg_warning,
.rtl #msg_error,
.rtl .error-banner {
    background-position: 2% 50%;
    background-position: calc(0% + 16px) 50%;
    padding-left: var(--rtl-spacing-md);
    padding-right: 44px;
    border-left: none;
    border-right: 4px solid transparent;
    border-radius: 0 4px 4px 0;
}

.rtl #msg_notice {
    border-right-color: #107c41;
}

.rtl #warning_bar,
.rtl #msg_warning {
    border-right-color: #ff8c00;
}

.rtl #msg_error,
.rtl .error-banner {
    border-right-color: #d13438;
}

/* ===== FORMS ===== */
.rtl .form_table th,
.rtl div.section-break {
    text-align: right;
}

.rtl div.section-break {
    border-left: none;
    border-right: 3px solid #0078d4;
    padding-right: 0;
    padding-left: 0;
    margin-right: 0;
    margin-left: 0;
}

/* ===== TEXT ALIGNMENT ===== */
.rtl .flush-right {
    text-align: left;
}

.rtl .flush-left {
    text-align: right;
}

/* ===== DRAFT SAVED ===== */
.rtl .draft-saved {
    right: initial;
    left: 1em;
    animation: slideInLeft 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes slideInLeft {
    from {
        opacity: 0;
        transform: translateX(20px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* ===== SEQUENCES ===== */
.rtl #sequences .manage-buttons {
    margin-right: initial;
    margin-left: 60px;
}

/* ===== ROW ITEMS ===== */
.rtl .row-item {
    position: relative;
}

.rtl .row-item .button-group {
    right: initial;
    left: 0;
}

.rtl .row-item .button-group div {
    padding-left: 12px;
    padding-right: 12px;
}

.rtl .row-item .delete {
    border-left: none;
    border-right: 1px solid rgba(0, 0, 0, 0.15);
}

.rtl .row-item .delete:hover {
    background: linear-gradient(145deg, #d13438, #b32d30);
}

/* ===== ICONS ===== */
.rtl [class^="icon-"].pull-left,
.rtl [class*=" icon-"].pull-left {
    margin-right: 0;
    margin-left: 0.35em;
}

.rtl [class^="icon-"].pull-right,
.rtl [class*=" icon-"].pull-right {
    margin-left: 0;
    margin-right: 0.35em;
}

/* ===== TABS ===== */
.rtl ul.tabs {
    padding-left: var(--rtl-spacing-xs);
    padding-right: var(--rtl-spacing-lg);
    text-align: right;
    display: flex;
    flex-direction: row-reverse;
}

.rtl #response_options ul.tabs {
    padding-right: 190px;
    padding-left: var(--rtl-spacing-xs);
    justify-content: flex-start;
}

.rtl ul.tabs li {
    margin-right: 0;
    margin-left: 2px;
}

.rtl ul.tabs li a {
    border-radius: 4px 4px 0 0;
}

/* ===== ACTION BUTTONS ===== */
.rtl .action-button {
    display: inline-flex;
    align-items: center;
}

.rtl .action-button i.icon-caret-down {
    border-left: none;
    border-right: 1px solid rgba(0, 0, 0, 0.15);
    margin-left: 0;
    margin-right: var(--rtl-spacing-xs);
    padding-left: 0;
    padding-right: var(--rtl-spacing-xs);
}

.rtl .action-dropdown ul {
    text-align: right;
    left: 0;
    right: auto;
}

.rtl .action-dropdown ul::before {
    left: 12px;
    right: auto;
}

/* ===== FILE ATTACHMENTS ===== */
.rtl .file {
    padding-left: initial;
    padding-right: 24px;
    margin-right: initial;
    margin-left: var(--rtl-spacing-lg);
    background-position: 100% 50%;
    background-size: 16px 16px;
    display: inline-flex;
    align-items: center;
}

/* ===== FLOATING OPTIONS ===== */
.rtl .floating-options {
    right: auto;
    left: 0;
    padding-right: initial;
    padding-left: var(--rtl-spacing-xs);
    box-shadow: -2px 2px 8px rgba(0, 0, 0, 0.1);
}

/* ===== QUICK NOTES ===== */
.rtl .quicknote {
    text-align: right;
}

.rtl .quicknote .header .header-right {
    right: auto;
    left: 1em;
}

.rtl .quicknote .header .options {
    border-right: 1px solid rgba(0, 0, 0, 0.15);
    border-left: none;
    padding-right: var(--rtl-spacing-md);
    padding-left: initial;
    margin-right: var(--rtl-spacing-xs);
    margin-left: initial;
}

.rtl i.note-type {
    border-left: 1px solid rgba(0, 0, 0, 0.15);
    border-right: none;
    padding-left: var(--rtl-spacing-sm);
    padding-right: initial;
}

/* ===== LEFT TABS ===== */
.rtl .left-tabs {
    margin-left: auto;
    margin-right: 45px;
}

/* ===== DROPDOWNS ===== */
.rtl .dropdown-menu {
    left: auto;
    right: 0;
    text-align: right;
}

.rtl .dropdown-menu.pull-right {
    left: 0;
    right: auto;
}

.rtl .dropdown-menu li > a,
.rtl .dropdown-menu .dropdown-item {
    padding: 8px 16px 8px 24px;
    text-align: right;
}

.rtl .dropdown-menu .selected > a::after,
.rtl .dropdown-menu .dropdown-item.selected::after {
    float: left;
    margin-left: 0;
    margin-right: var(--rtl-spacing-sm);
}

/* ===== PAGINATION ===== */
.rtl .pagination {
    justify-content: flex-end;
}

.rtl .pagination li:first-child a {
    border-radius: 0 4px 4px 0;
}

.rtl .pagination li:last-child a {
    border-radius: 4px 0 0 4px;
}

/* ===== BREADCRUMBS ===== */
.rtl .breadcrumb {
    text-align: right;
}

.rtl .breadcrumb li + li::before {
    content: "\\";
    padding: 0 var(--rtl-spacing-sm);
}

/* ===== SEARCH BOXES ===== */
.rtl .search-box {
    background-position: 2% 50%;
    padding-left: var(--rtl-spacing-sm);
    padding-right: 36px;
}

/* ===== TREE VIEWS ===== */
.rtl .tree-view li {
    padding-left: 0;
    padding-right: 20px;
    background-position: 100% 50%;
}

.rtl .tree-view li.expanded {
    background-position: 100% 50%;
}

/* ===== PROGRESS BARS ===== */
.rtl .progress-bar {
    direction: ltr;
}

/* ===== DATE PICKER ===== */
.rtl .ui-datepicker {
    direction: rtl;
}

.rtl .ui-datepicker .ui-datepicker-prev {
    left: auto;
    right: 2px;
}

.rtl .ui-datepicker .ui-datepicker-next {
    right: auto;
    left: 2px;
}

/* ===== RESPONSIVE RTL ===== */
@media (max-width: 768px) {
    .rtl .pull-left,
    .rtl .pull-right {
        float: none !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
    }
    
    .rtl #sub_nav li + li > a {
        margin-right: 0;
    }
    
    .rtl #sub_nav li + li > a::before {
        display: none;
    }
    
    .rtl ul.tabs {
        padding-right: var(--rtl-spacing-sm);
        flex-direction: column;
    }
    
    .rtl #response_options ul.tabs {
        padding-right: var(--rtl-spacing-sm);
    }
    
    .rtl .dialog a.close {
        left: 0.75em;
    }
}

/* ===== DARK MODE RTL ===== */
@media (prefers-color-scheme: dark) {
    .rtl {
        color-scheme: dark;
    }
    
    .rtl .row-item .delete {
        border-right-color: rgba(255, 255, 255, 0.15);
    }
    
    .rtl .action-button i.icon-caret-down {
        border-right-color: rgba(255, 255, 255, 0.15);
    }
    
    .rtl .quicknote .header .options {
        border-right-color: rgba(255, 255, 255, 0.15);
    }
    
    .rtl i.note-type {
        border-left-color: rgba(255, 255, 255, 0.15);
    }
    
    .rtl #sub_nav li + li > a::before {
        background: rgba(255, 255, 255, 0.15);
    }
}

/* ===== HIGH CONTRAST RTL ===== */
@media (forced-colors: active) {
    .rtl .row-item .delete {
        border-right-color: WindowText;
    }
    
    .rtl .action-button i.icon-caret-down {
        border-right-color: WindowText;
    }
    
    .rtl .quicknote .header .options {
        border-right-color: WindowText;
    }
    
    .rtl i.note-type {
        border-left-color: WindowText;
    }
}

/* ===== PRINT RTL ===== */
@media print {
    .rtl {
        direction: rtl;
        unicode-bidi: embed;
    }
}

/* ===== MICROSOFT OUTLOOK COMPATIBILITY ===== */
.rtl p.MsoNormal,
.rtl li.MsoNormal,
.rtl div.MsoNormal,
.rtl p.MsoPlainText,
.rtl li.MsoPlainText,
.rtl div.MsoPlainText {
    direction: rtl;
    unicode-bidi: embed;
    text-align: right;
}

/* ===== GRID SYSTEM RTL ===== */
.rtl .row {
    flex-direction: row-reverse;
}

.rtl .col-xs-1,
.rtl .col-xs-2,
.rtl .col-xs-3,
.rtl .col-xs-4,
.rtl .col-xs-5,
.rtl .col-xs-6,
.rtl .col-xs-7,
.rtl .col-xs-8,
.rtl .col-xs-9,
.rtl .col-xs-10,
.rtl .col-xs-11,
.rtl .col-xs-12 {
    float: right;
}

@media (min-width: 768px) {
    .rtl .col-sm-1,
    .rtl .col-sm-2,
    .rtl .col-sm-3,
    .rtl .col-sm-4,
    .rtl .col-sm-5,
    .rtl .col-sm-6,
    .rtl .col-sm-7,
    .rtl .col-sm-8,
    .rtl .col-sm-9,
    .rtl .col-sm-10,
    .rtl .col-sm-11,
    .rtl .col-sm-12 {
        float: right;
    }
}

/* ===== CUSTOM SCROLLBAR RTL ===== */
.rtl ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.rtl ::-webkit-scrollbar-track {
    background: #f3f2f1;
}

.rtl ::-webkit-scrollbar-thumb {
    background: #c8c6c4;
    border-radius: 4px;
}

.rtl ::-webkit-scrollbar-thumb:hover {
    background: #a19f9d;
}