.tns-outer {
    direction: ltr;

    .tns-nav, button {
        display: none;
    }
}

.slider-content {
    direction: ltr;
    overflow: hidden;

    .item {

    }
}


.tns-inner {
    overflow: hidden;
}

a, a:visited {
    text-decoration: none;
    color: var(--xshop-primary);

    &:hover {
        color: var(--xshop-secondary);
    }
}

blockquote p,q p {
    padding: 1rem;
        background: rgba(118, 118, 118, 0.34);
        border-radius: var(--xshop-border-radius);

    &:before{
        content: '“ ';
    }
    &:after{
        content: '” ';
    }
}


.btn {
    border-radius: var(--xshop-border-radius);
    font-family: VazirXUI, sans-serif;
}

.btn-primary {
    background: var(--xshop-primary);
    border-color: var(--xshop-primary);
    color: var(--xshop-diff) !important;

    &:hover {
        border-color: var(--xshop-primary);
        background: var(--xshop-secondary);;
    }
}

.btn-outline-primary {
    border-color: var(--xshop-primary);
    color: var(--xshop-primary);

    &:hover {
        border-color: var(--xshop-secondary);
        color: var(--xshop-diff2) !important;
        background: var(--xshop-secondary);;
    }
}

.btn-secondary {
    background: var(--xshop-secondary);
    border-color: var(--xshop-secondary);
    color: var(--xshop-diff2) !important;

    &:hover {
        border-color: var(--xshop-primary);
        background: var(--xshop-secondary);;
    }
}

.btn-outline-secondary {
    border-color: var(--xshop-secondary);
    color: var(--xshop-secondary);

    &:hover {
        border-color: var(--xshop-primary);
        color: var(--xshop-diff) !important;
        background: var(--xshop-primary);;
    }
}

.btn-outline-invert {
    border-color: var(--xshop-diff);
    color: var(--xshop-diff);

    &:hover {
        background: var(--xshop-diff);
        color: var(--xshop-primary);
    }
}

a.btn-outline-light {
    color: white;
}

a.btn-outline-dark {
    color: black;
}

ul.pagination {
    justify-content: center;
    margin: 2rem 0;

    .page-item {
        .page-link {
            color: var(--xshop-primary);

            &:hover {
                background: var(--xshop-secondary);
                color: var(--xshop-diff2);
            }
        }
    }

    .page-item.active {
        .page-link {
            background: var(--xshop-primary);
            border-color: transparent;
            color: var(--xshop-diff);
        }

    }
}

.form-check-input:checked {
    background-color: var(--xshop-primary);
    border-right-color: var(--xshop-secondary);
}

.modal.lightbox {
    backdrop-filter: blur(7px);

    .ratio {
        background: #33333355 !important;
        border-radius: var(--xshop-border-radius);
        overflow: hidden;
    }
}


.custom-tooltip {
    --bs-tooltip-bg: var(--xshop-primary);
    --bs-tooltip-color: var(--xshop-diff);
}


.accordion-button:not(.collapsed) {
    background: transparent;
}

.btn-outline-light:hover {
    color: black !important;
}

.nested-list {
    .ri-arrow-down-wide-line, .ri-arrow-up-wide-line {
        cursor: pointer;
    }

    .nested-parent {
        ul {
            display: none;
        }
    }

    .active {
        display: block !important;
    }
}
