/**
 * Bootstrap RTL Overrides
 * 
 * Dodati ovaj CSS na kraj site.css ili kreirati zasebnu datoteku
 * i uklju?iti je nakon Bootstrapa u _Layout.cshtml
 * 
 * Ovaj CSS osigurava da Bootstrap komponente rade ispravno u RTL na?inu
 */

/* ========================================
   BOOTSTRAP RTL OVERRIDES
   ======================================== */

/* Margin Auto Utilities */
[dir="rtl"] .ms-auto {
    margin-inline-start: auto !important;
    margin-inline-end: 0 !important;
}

[dir="rtl"] .me-auto {
    margin-inline-start: 0 !important;
    margin-inline-end: auto !important;
}

/* Float Utilities */
[dir="rtl"] .float-start {
    float: inline-start !important;
}

[dir="rtl"] .float-end {
    float: inline-end !important;
}

/* Text Alignment */
[dir="rtl"] .text-start {
    text-align: start !important;
}

[dir="rtl"] .text-end {
    text-align: end !important;
}

/* Dropdown Menu */
[dir="rtl"] .dropdown-menu {
    inset-inline-start: auto;
    inset-inline-end: 0;
}

[dir="rtl"] .dropdown-menu-end {
    inset-inline-end: auto !important;
    inset-inline-start: 0 !important;
}

[dir="rtl"] .dropdown-menu-start {
    inset-inline-start: auto !important;
    inset-inline-end: 0 !important;
}

/* Modal */
[dir="rtl"] .modal-header .btn-close {
    margin: -0.5rem auto -0.5rem -0.5rem;
}

/* Navbar */
[dir="rtl"] .navbar-nav .dropdown-menu {
    position: absolute;
}

[dir="rtl"] .navbar-expand-sm .navbar-nav .dropdown-menu {
    inset-inline-start: auto;
}

/* List Group */
[dir="rtl"] .list-group-horizontal .list-group-item:first-child {
    border-end-start-radius: 0;
    border-start-start-radius: 0.25rem;
}

[dir="rtl"] .list-group-horizontal .list-group-item:last-child {
    border-start-end-radius: 0;
    border-end-end-radius: 0.25rem;
}

/* Breadcrumb */
[dir="rtl"] .breadcrumb-item + .breadcrumb-item {
    padding-inline-start: 0.5rem;
    padding-inline-end: 0;
}

[dir="rtl"] .breadcrumb-item + .breadcrumb-item::before {
    float: inline-start;
    padding-inline-end: 0.5rem;
    padding-inline-start: 0;
}

/* Pagination */
[dir="rtl"] .page-item:first-child .page-link {
    border-start-start-radius: 0;
    border-end-start-radius: 0;
    border-start-end-radius: 0.25rem;
    border-end-end-radius: 0.25rem;
}

[dir="rtl"] .page-item:last-child .page-link {
    border-start-end-radius: 0;
    border-end-end-radius: 0;
    border-start-start-radius: 0.25rem;
    border-end-start-radius: 0.25rem;
}

/* Carousel */
[dir="rtl"] .carousel-control-prev {
    inset-inline-start: auto;
    inset-inline-end: 0;
}

[dir="rtl"] .carousel-control-next {
    inset-inline-end: auto;
    inset-inline-start: 0;
}

[dir="rtl"] .carousel-indicators {
    inset-inline-start: 15%;
    inset-inline-end: auto;
}

/* Form Controls */
[dir="rtl"] .form-check {
    padding-inline-start: 0;
    padding-inline-end: 1.5em;
}

[dir="rtl"] .form-check-input {
    float: inline-end;
    margin-inline-start: 0;
    margin-inline-end: -1.5em;
}

[dir="rtl"] .form-switch .form-check-input {
    background-position: inset-inline-end center;
}

[dir="rtl"] .form-switch .form-check-input:checked {
    background-position: inset-inline-start center;
}

/* Input Group */
[dir="rtl"] .input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
    margin-inline-start: -1px;
    margin-inline-end: 0;
}

[dir="rtl"] .input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu),
[dir="rtl"] .input-group:not(.has-validation) > .dropdown-toggle:nth-last-child(n + 3) {
    border-start-end-radius: 0;
    border-end-end-radius: 0;
}

[dir="rtl"] .input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
    margin-inline-start: -1px;
    border-start-start-radius: 0;
    border-end-start-radius: 0;
}

/* Offcanvas */
[dir="rtl"] .offcanvas-start {
    inset-block-start: 0;
    inset-inline-start: auto;
    inset-inline-end: 0;
    transform: translateX(100%);
}

[dir="rtl"] .offcanvas-end {
    inset-block-start: 0;
    inset-inline-end: auto;
    inset-inline-start: 0;
    transform: translateX(-100%);
}

/* Toast */
[dir="rtl"] .toast-header .btn-close {
    margin-inline-end: auto;
    margin-inline-start: -0.375rem;
}

/* Accordion */
[dir="rtl"] .accordion-button::after {
    margin-inline-start: 0;
    margin-inline-end: auto;
}

/* Progress Bar */
[dir="rtl"] .progress-bar {
    flex-direction: row-reverse;
}

/* Custom RTL Utilities */
[dir="rtl"] .pe-0 { padding-inline-start: 0 !important; }
[dir="rtl"] .pe-1 { padding-inline-start: 0.25rem !important; }
[dir="rtl"] .pe-2 { padding-inline-start: 0.5rem !important; }
[dir="rtl"] .pe-3 { padding-inline-start: 1rem !important; }
[dir="rtl"] .pe-4 { padding-inline-start: 1.5rem !important; }
[dir="rtl"] .pe-5 { padding-inline-start: 3rem !important; }

[dir="rtl"] .ps-0 { padding-inline-end: 0 !important; }
[dir="rtl"] .ps-1 { padding-inline-end: 0.25rem !important; }
[dir="rtl"] .ps-2 { padding-inline-end: 0.5rem !important; }
[dir="rtl"] .ps-3 { padding-inline-end: 1rem !important; }
[dir="rtl"] .ps-4 { padding-inline-end: 1.5rem !important; }
[dir="rtl"] .ps-5 { padding-inline-end: 3rem !important; }

[dir="rtl"] .me-0 { margin-inline-start: 0 !important; }
[dir="rtl"] .me-1 { margin-inline-start: 0.25rem !important; }
[dir="rtl"] .me-2 { margin-inline-start: 0.5rem !important; }
[dir="rtl"] .me-3 { margin-inline-start: 1rem !important; }
[dir="rtl"] .me-4 { margin-inline-start: 1.5rem !important; }
[dir="rtl"] .me-5 { margin-inline-start: 3rem !important; }

[dir="rtl"] .ms-0 { margin-inline-end: 0 !important; }
[dir="rtl"] .ms-1 { margin-inline-end: 0.25rem !important; }
[dir="rtl"] .ms-2 { margin-inline-end: 0.5rem !important; }
[dir="rtl"] .ms-3 { margin-inline-end: 1rem !important; }
[dir="rtl"] .ms-4 { margin-inline-end: 1.5rem !important; }
[dir="rtl"] .ms-5 { margin-inline-end: 3rem !important; }

/* Border Radius */
[dir="rtl"] .rounded-start {
    border-start-start-radius: 0.25rem !important;
    border-end-start-radius: 0.25rem !important;
    border-start-end-radius: 0 !important;
    border-end-end-radius: 0 !important;
}

[dir="rtl"] .rounded-end {
    border-start-end-radius: 0.25rem !important;
    border-end-end-radius: 0.25rem !important;
    border-start-start-radius: 0 !important;
    border-end-start-radius: 0 !important;
}

/* ========================================
   END BOOTSTRAP RTL OVERRIDES
   ======================================== */

/* ========================================
   CUSTOM RTL FIXES FOR SEARCH BOXES
   ======================================== */

/* Fix search icon positioning in RTL mode for user and group lists */
[dir="rtl"] .search.fa-search {
    left: auto !important;
    right: 10px !important;
}

[dir="rtl"] .searchBox {
    padding-left: 12px !important;
    padding-right: 28px !important;
}