/* Find By : 






*/

/* ------------------------------------------------ */
/* -------------------#index----------------------- */
/* ------------------------------------------------ */
header {
    width: 100%;
    height: 15rem;
    background-color: #f7f7f7;
    position: relative;
    z-index: 2;
}

header.other-page-header {
    margin-bottom: 25px;
    border-bottom: 1px solid #dfdfdf;
}

header .image-box {
    width: 20rem;
    height: 4rem;
}

header .image-box img {
    width: 100%;
}

.search-box .search-bar #searchbox {
    background-color: #fff;
    border: 1px solid #a7a9ac;
    color: #a0a0a0;
    font-size: 14px;
    border-radius: 10px;
    height: 4rem;
    width: 45rem;
    padding: 10px;
}

.search-box .search-bar i {
    color: #e1306c;
    position: absolute;
    left: 10px;
    font-size: 18px;
}

#search-results {
    position: absolute;
    background: #fff;
    width: 45rem;
    color: #000;
    padding: 15px;
    border-radius: 15px;
    border: 1px solid #a7a9ac;
}

#search-results .title-result {
    margin-bottom: 5px;
}

#search-results .item-link-result {
    font-size: 12px;
    color: #9d9e9f;
}

.login-cart-box .basket {
    padding: 5px 5px 5px 8px;
    height: 4rem;
    background-color: #fff;
    border: 1px solid #a7a9ac;
    font-size: 14px;
    border-radius: 10px;
    color: #5e5e5e;
}

.login-cart-box .basket .basket-count {
    width: 3rem;
    height: 3rem;
    background-color: #eaeaea;
    border: 1px solid #a7a9ac;
    border-radius: 10px;
}

.login-cart-box .basket i {
    color: #e1306c;
    font-size: 16px;
}

.login-cart-box .login-box {
    background-color: #fff;
    border: 1px solid #a7a9ac;
    color: #665ddb;
    width: 4rem;
    height: 4rem;
    border-radius: 10px;

}

.header-top {
    transform: translateY(30px);
}

.header-bottom {
    height: 5rem;
    background: linear-gradient(90deg, #171224 0%, #6736c5 50%, #171224 100%);
    border-radius: 50px;
    color: #fff;
    padding: 10px;
    transform: translateY(55px);
}

.call-me .text-call {
    font-size: 12px;
    color: #9b9b9b;
}

.call-me .text-number {
    font-size: 15px;
}

.call-me i {
    color: #e1306c;
    background-color: #a11c48be;
    width: 35px;
    height: 35px;
    display: flex;
    border-radius: 50%;
}

/* منوی اصلی */
ul.nod-1 {
    display: flex;
    align-items: center;
}

ul.nod-1>li:first-child {
    background-color: #6022cf;
    width: 10rem;
    margin-left: 4rem;
    border-radius: 30px;
    padding-left: 0 !important;
    display: flex;
    justify-content: center;
    height: 3.8rem;
    line-height: 4rem;
}

ul.nod-1>li {
    position: relative;
    height: 5rem;
    line-height: 5rem;
    padding-left: 5rem !important;
}

ul.nod-1>li>a {
    display: flex;
    font-size: 14px;
    color: #fff;
}

ul.nod-1>li:hover>a {
    color: #e1306c;
}

/* مگا منو */
.nod-2 {
    position: absolute;
    top: 5rem;
    right: 0;
    background: #fff;
    padding: 15px 15px 0;
    border-radius: 15px;
    box-shadow: rgba(0, 0, 0, 0.15) 2px 1px 3px;
    min-width: 24rem;

    opacity: 0;
    visibility: hidden;
    transform: translateY(15px);
    transition: all 0.35s ease;
    pointer-events: none;
}

.has-mega:hover .nod-2 {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

/* لیست آیتم‌ها */
.nod-1 .giftcard-list {
    display: grid;
    grid-auto-flow: column;
    grid-template-rows: repeat(6, auto);
    /* ⬅️ هر ۹ آیتم = یک ستون */
    column-gap: 45px;
    row-gap: 10px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.nod-1 .giftcard-list li a {
    display: flex;
    align-items: center;
    font-size: 14px;
    color: #000;
    white-space: nowrap;
}

.nod-1 .giftcard-list li a:hover {
    color: #146C94;
}

/* تصویر */
.mobile__nav .image-box,
.nod-1 .image-box {
    width: 32px;
    height: 32px;
    margin-left: 6px;
    border-radius: 4px;
    overflow: hidden;
    flex-shrink: 0;
}

.mobile__nav .image-box img,
.nod-1 .image-box img {
    width: 100%;
    height: auto;
}

/* مشاهده همه */
.view-all-category {
    display: block;
    text-align: center;
    margin-top: 15px;
    border-top: 1px solid #ebebeb;
    color: #146C94;
    font-size: 14px;
}


/* Menu Mob*/
.mobile__nav {
    width: 100%;
    height: 2.2rem;
    z-index: 1090;
}

/* === آیکن منو (همبرگری) === */
.mobile__nav--bar {
    position: relative;
    width: 3rem;
    height: 2.2rem;
    cursor: pointer;
    z-index: 9999;
    position: absolute;
    top: 7px;
}

.mobile__nav--bar.close {
    position: absolute;
    right: 23rem;
    top: -8.3rem;
}

.mobile__nav--bar .line {
    position: absolute;
    width: 100%;
    height: .2rem;
    background: #fff;
    border-radius: .3rem;
    right: 0;
    transition: all .3s ease;
}

.line1 {
    top: .6rem;
}

.line2 {
    top: 1.4rem;
}

.line3 {
    top: 2.2rem;
}

.mobile__nav--bar.close .line1 {
    transform: rotate(45deg);
    top: 1.3rem;
    background: crimson;
}

.mobile__nav--bar.close .line2 {
    opacity: 0;
}

.mobile__nav--bar.close .line3 {
    transform: rotate(-45deg);
    top: 1.3rem;
    background: crimson;
}

/* === منوی اصلی === */
.mobile__navigation {
    /* position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0);
    transition: background .3s ease;
    z-index: 1089;
    pointer-events: none; */
}

.mobile__navigation.active {
    background: rgba(0, 0, 0, 0.5);
    pointer-events: auto;
    height: 100vh;
    width: 104%;
    top: -10rem;
    right: -8px;
    position: absolute;
}

/* === لیست منو === */
.mobile__navigation--menu {
    position: fixed;
    top: -10rem;
    right: -32rem;
    width: 28rem;
    height: 100vh;
    background: #fff;
    overflow-y: auto;
    transition: right .3s ease;
    z-index: 1090;
}

.mobile__navigation--menu.active {
    right: -8px;
}

.mobile__navigation--menu li {
    display: block;
    height: 6rem;
    line-height: 3rem;
}

.mobile__navigation--title {
    padding: 1.5rem;
    background: #6022cf;
    box-shadow: 0 3px 6px rgba(0, 0, 0, .1);
    text-align: center;
    font-size: 1.4rem;
}

/* === زیرمنو === */
.mobile__navigation--submenu--items {
    position: absolute;
    top: 0;
    right: -32rem;
    width: 100%;
    height: 100%;
    background: #fff;
    transition: right .3s ease;
}

.mobile__navigation--submenu--items.active {
    right: 0;
}

.mobile__navigation--submenu-back {
    padding: 1.5rem;
    background: #f5f5f5;
    color: #d32840;
    font-size: 1.4rem;
    cursor: pointer;
    display: flex !important;
    align-items: center;
    height: 5rem !important;
}

.mobile__navigation--submenu-back::before {
    content: "\e94c";
    font-family: 'icomoon';
    color: black;
    margin-left: 1rem;
}

.mobile__navigation--menu a {
    display: flex;
    padding: 1.5rem;
    border-bottom: 1px solid #f5f5f5;
    color: #222;
    font-size: 1.4rem;
    height: 6rem;
    line-height: 3rem;
}

.mobile__navigation--submenu>a::after {
    content: "\e918";
    font-family: 'icomoon';
    color: #0e1d42;
    font-size: 10px;
    margin: 0 auto 0 0;
}

/* Start Mainslider Section */
.mainslider-box {
    width: 100%;
    max-height: 59rem;
    overflow: hidden;
}

.mainslider-box .mainslider-item img {
    width: 100%;
    height: auto;
}

/* Start Category Section */
.category-section {
    padding: 50px 0;
}

.category-box .title-category {
    font-size: 24px;
    color: #5a6068;
}

.category-box .category-list .category-item .img-box .img-category {
    width: 13rem;
    height: 13rem;
    border-radius: 50%;
}

.category-box .category-list .category-item .img-box .img-category img {
    width: auto;
    height: 100%;
    transition: transform .5s ease-in-out;
}

.category-box .category-list .category-item:hover .img-box .img-category img {
    transform: rotate(15deg);
}

.category-box .category-list .category-item .name-category {
    margin-top: 20px;
    color: #000;
}

.category-section-bg {
    background-image: url("../img/bg-123.jpg");
    background-repeat: no-repeat;
    margin: 50px 0;
}

/* Start Slider Product Section */
.slider-product-section {
    padding: 20px 0 50px 0;
}

.slider-product-section .title {
    font-size: 24px !important;
    color: #5a6068;
}

.item-slider-product .image-box {
    height: 35rem;
    max-height: 35rem;
    border: 1px solid #b7b7b7;
    border-radius: 10px;
}

.item-slider-product .image-box img {
    width: 100%;
    height: auto;
}

.item-slider-product .title {
    height: 4rem;
    max-height: 4rem;
    line-height: 4rem;
    font-size: 14px;
}

.item-slider-product .title a {
    color: #4c4c4c;
}

.item-slider-product .buy-btn-box {
    border: 1px solid #6125cd;
    height: 5rem;
    border-radius: 30px;
    padding: 3px;
    transition: border 0.3s ease-in-out;
}

.item-slider-product:hover .buy-btn-box {
    border: 1px solid #e2175c;

}

.item-slider-product .buy-btn {
    background: linear-gradient(90deg, #785eaa 0%, #6125cd 50%);
    border-radius: 30px;
    color: #fff;
    transition: background 2s ease-in-out;
}

.item-slider-product:hover .buy-btn {
    background: linear-gradient(90deg, #e0175b 0%, #b40440 50%);
}

.price-box .percent {
    background-color: #e2175d;
    border-radius: 5px;
}

.price-box .real-price {
    text-decoration: line-through;
    color: #b7b7b7;

}

.item-slider-product .number-videos {
    color: #b7b7b7;
}

.price-box .payable-price {
    color: #6125cd;
}

.item-slider-product:hover .price-box .payable-price {
    color: #e1175b;

}

.page-productlist .item-slider-product {
    margin-bottom: 20px;
    background-color: #fff;
    padding: 10px;
    border-radius: 15px;
    width: 24%;
}

.page-productlist .item-slider-product .image-box {
    height: 29rem;
}

.sort-bar-box {
    height: 6rem;
    background-color: #ffffff;
    margin-bottom: 1rem !important;
}

/* Start Our Services Section */
.our-services-section {
    padding: 50px 0;
}

.our-services-box .title-our-services {
    font-size: 24px;
    color: #5a6068;
}

.our-services-list {
    padding: 5rem 3rem 0 3rem;
}

.our-services-list::before {
    content: "";
    position: absolute;
    bottom: -30px;
    right: 0;
    width: 100%;
    height: 17rem;
    border-radius: 30px;
    background-color: #e6e7e8;
}

.our-services-list .our-services-item {
    height: 21rem;
    border-radius: 30px;
}

.our-services-list .our-services-item .image-box {
    width: 100%;
    height: 21rem;
    padding: 10px;
    border-radius: 30px;
}

.our-services-list .our-services-item .image-box img {
    width: 100%;
    height: auto;
    transition: transform .3s ease-in-out;
}

.our-services-list .our-services-item:hover .image-box img {
    transform: scale(1.03);
}

.our-services-list .our-services-item .content-box {
    width: 100%;
    height: 7rem;
    border-radius: 30px 0 30px 30px;
    background-color: #fff;
    bottom: 0;
    padding: 10px;
}

.our-services-list .our-services-item .small-title {
    position: absolute;
    bottom: 6rem;
    background: #fff;
    color: #5a6068;
    font-size: 14px;
    padding: 7px 10px 15px 15px;
    border-radius: 20px 17px 0 0px;
}

.title-services {
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, #311565 0%, #161223 50%);
    border-radius: 30px;
    padding: 10px;
}

/* Start Comments Section */
.comments-section {
    padding: 50px 0;
}

.comments-section .title-box {
    padding: 15px 0;
    border: 1px solid #b5b5b5;
    border-radius: 15px;
}

.comments-section .title-box span {
    font-size: 20px;
    color: #6023cf;
}

.comments-section .title-box p {
    color: #5b5b5b;
}

.comments-section .comments-item {
    width: 100%;
    border: 1px solid #b5b5b5;
    border-radius: 15px;
    overflow: hidden;
}

.comments-section .comments-item .header-comments {
    height: 7.5rem;
    background: linear-gradient(90deg, #311565 0%, #161223 50%);
    color: #fff;
    padding: 15px;
}

.comments-list-item .name-user {
    color: #5b5b5b;
}

.comments-list-item .data-box {
    font-size: 11px;
    padding: 5px;
    background-color: #e5e5e5;
    color: #747474;
    border-radius: 5px;
}

.comments-list .comments-list-item {
    border-bottom: 1px solid #b5b5b5;
    transition: background-color .1s ease-in-out;
}

.comments-list .comments-list-item:hover {
    background-color: #f9f5ff !important;
}

.comments-list:nth-child(odd) .comments-list-item {
    background-color: #f7f7f7;
}

.comments-list:nth-child(even) .comments-list-item {
    background-color: #ffffff;
}

.comments-list .comments-list-item:last-child {
    border-bottom: none;
}

/* Start About Us Section */
.about-us-section .content-box .title {
    color: #6023cf;
}

.about-us-section .content-box .text-main {
    color: #747474;
    line-height: 30px;
}

.about-us-section .content-box .see-more-box {
    border: 1px solid #b40440;
    height: 4rem;
    border-radius: 30px;
    padding: 3px;
    transition: border 0.3s ease-in-out;
    margin: 30px auto 0 0;
    width: 22rem;
}

.about-us-section .content-box .see-more {
    width: 100%;
    border-radius: 30px;
    color: #fff;
    background: linear-gradient(90deg, #e0175b 0%, #b40440 50%);
}

/* Articles Box Section */
.articles-box-section {
    padding: 50px 0;
}

.articles-box-section p {
    color: #747474;
    line-height: 30px;
}

/* Article Item Styles */
.page-articlelist .article-item {
    width: 23%;
    height: 39rem;
    /* Full height */
    background-color: #fff;
    padding: 10px;
    border-radius: 15px;
    margin: 15px 5px;
    /* Spacing between items */
    transition: transform 0.4s ease, opacity 0.4s ease, box-shadow 0.4s ease, margin 0.4s ease;
    opacity: 0.5;
    /* Less visible when not center */
    transform: scale(0.9);
    /* Smaller when not center */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: grab;
}

.article-list .article-item {
    height: 39rem;
    /* Full height */
    background-color: #fff;
    padding: 10px;
    border-radius: 15px;
    margin: 15px 5px;
    /* Spacing between items */
    transition: transform 0.4s ease, opacity 0.4s ease, box-shadow 0.4s ease, margin 0.4s ease;
    opacity: 0.5;
    /* Less visible when not center */
    transform: scale(0.9);
    /* Smaller when not center */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: grab;
}

.article-item .content-box .title a {
    font-size: 17px;
    color: #000;
    height: 4rem;
    display: flex;
    line-height: 4rem;
}

/* Image within Article Item */
.article-item .image-article {
    width: 100%;
    height: 20rem;
    border-radius: 10px;
    overflow: hidden;
}

.article-item .image-article img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Content Box within Article Item */
.article-item .content-box {
    padding: 10px;

}

.article-item .content-box h4 {
    margin-bottom: 10px;
    font-size: 1.3rem;
}

.article-item .content-box p {
    color: #555;
    font-size: 12px;
    line-height: 20px;
    height: 9rem;
    text-align: justify;
}

.article-item .content-box .data-box span {
    font-size: 0.8rem;
    color: #888;
}

.subject::before {
    content: "";
    width: 8px;
    height: 8px;
    display: inline-block;
    margin-left: 4px;
    background-color: #b40440;
    border-radius: 1px;
}

.article-item .content-box .see-btn {
    border: 1px solid #673AB7;
    border-radius: 30px;
    color: #673AB7;
}

.article-item .content-box .see-btn span {
    background: linear-gradient(90deg, #785eaa 0%, #6125cd 50%);
    color: #fff;
    padding: 5px 10px;
    border-radius: 30px;

}

.article-item .content-box .see-btn {
    font-size: 1rem;
    border: 1px solid #673AB7;
    border-radius: 30px;
    text-decoration: none;
    font-weight: bold;
    display: flex;
    align-items: center;
}

.article-item .content-box .see-btn i {
    margin-left: 5px;
    /* Space between text and icon */
    font-size: 1.1em;
}

/* Center Item Styles */
.page-articlelist .article-item,
.article-list .owl-item.center .article-item {
    opacity: 1;
    /* Fully visible */
    transform: scale(1.03);
    /* Slightly larger */
    cursor: grabbing;
    z-index: 10;
    /* Ensure it's on top */
    margin: 15px auto;
    /* Center the item */
    height: 39rem;
    /* Full height */
    background-color: #fff;
}

/* اصلاحات عمومی برای جلوگیری از تداخل متن */
.article-item .content-box p {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    /* نمایش فقط ۳ خط متن */
    -webkit-box-orient: vertical;
    height: auto !important;
    /* ارتفاع خودکار برای جلوگیری از فضای خالی زیاد */
    min-height: 60px;
}

.article-item {
    height: auto !important;
    /* اجازه دهید محتوا ارتفاع را تعیین کند */
    padding-bottom: 20px;
}

/* بخش رسپانسیو */
@media (max-width: 768px) {
    .articles-box-section {
        padding: 30px 0;
    }

    .subtitle-article {
        text-align: center;
        align-items: center;
        margin-bottom: 30px;
    }

    .subtitle-article p {
        width: 100% !important;
    }

    /* تنظیمات کارت در موبایل */
    .article-item {
        width: 100% !important;
        margin: 10px 0 !important;
        transform: scale(0.95);
        /* کمی کوچک‌تر برای کارت‌های غیر فعال */
    }

    .article-list .owl-item.center .article-item {
        transform: scale(1) !important;
        /* کارت وسط بزرگتر باشد */
    }

    .article-item .content-box .title a {
        font-size: 15px;
        line-height: 1.5;
        height: auto;
        margin-bottom: 10px;
    }

    /* دکمه ادامه مطلب در موبایل */
    .article-item .content-box .see-btn span {
        font-size: 11px;
        padding: 4px 32px;
    }
}

/* تنظیمات فلش‌های ناوبری در موبایل */
@media (max-width: 576px) {
    .owl-nav {
        display: flex;
        justify-content: center;
        margin-top: 15px;
    }

    .owl-nav button {
        background: #673AB7 !important;
        color: #fff !important;
        width: 35px;
        height: 35px;
        border-radius: 50% !important;
        margin: 0 10px !important;
    }
}


.pagination {
    display: flex;
    padding-right: 0;
    list-style: none;
}

.app-paging .pagination .page-item {
    width: 3rem;
    height: 3rem;
    margin-right: 5px;
    border-radius: 5px;
    background: #fff;
    text-align: center;
    line-height: 2;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    overflow: hidden;
}

.app-paging .pagination .page-item a {
    display: flex;
    width: 100%;
    justify-content: center;
    color: grey;
}

.app-paging .pagination .page-item.active a {
    color: #ffffff;
    background: #6125cd;
}

.app-paging .pagination .page-item:hover a {
    color: #ffffff;
    background: #6125cd;
}

/* Start Footer */
footer {
    background: linear-gradient(90deg, #12121a 0%, #2f1560 50%, #12121a 100%);
    margin-top: 100px;
}

.nav-bar-footer-box {
    height: 17rem;
}

footer .nav-bar-footer {
    background-image: url("../img/bg-footer.jpg");
    width: 100%;
    height: 20rem;
    overflow: hidden;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 35px;
    border-radius: 30px;
    transform: translateY(-100px);
}

.footer-item p {
    text-align: justify;
    line-height: 30px;
    font-family: "Anjoman-Light";
}

.footer-item ul li {
    font-family: "Anjoman-Light";

}

.symbol-box .title-symbol {
    background: linear-gradient(90deg, #2c1c5b 0%, #431d8d 50%);
}

.symbol-box .symbol-item {
    padding: 10px;
    width: 14rem;
    height: 13rem;
    background: linear-gradient(90deg, #2c1c5b 0%, #431d8d 50%);
}

.footer-item-left {
    padding: 10px !important;
    height: 10rem;
    border-radius: 15px;
    background: linear-gradient(90deg, #2c1c5b 0%, #431d8d 50%);
}

.footer-item-right {
    padding: 10px !important;
    height: 10rem;
    border-radius: 15px;
    background: linear-gradient(90deg, #431d8d 0%, #2c1c5b 50%);
}

.footer-item-right input {
    width: 85%;
    height: 4rem;
    border: none;
    padding: 10px;
    border-radius: 20px;
    font-size: 16px;
}

.footer-item-right input::placeholder {
    font-size: 14px;
    color: grey;
}

.footer-item-right button {
    border-radius: 20px;
    height: 4rem;

    padding: 7px;
    border: none;
    width: 14%;
    background-color: #e1306c;
    color: #fff;
}

.footer-item-left ul li {
    font-family: "Anjoman-Light";
}

.footer-item-left ul li .image-box {
    width: 27px;
    height: 27px;
    overflow: hidden;
}

.footer-item-left ul li .image-box img {
    width: 100%;
}

.back-to-top {
    background: transparent;
    color: #fff;
    font-size: 16px;
    font-family: "Anjoman-Light";
    border: 1px solid #fff;
    border-radius: 10px;
    padding: 5px 10px;
}

/* Start Single Video Section */
.single-video-section .video-box-section {
    background-color: #fff;
    padding: 15px;
    border-radius: 15px;
    border-top: 3px solid #552ea1;
}

.single-video-section .video-box-section .video-box {
    width: 100%;
    height: 50rem;
    overflow: hidden;
    border: 1px solid gray;
}

.single-video-section .video-box-section .video-box video {
    width: 100%;
    height: auto;
}

.tab-content-giftcard .nav-pills {
    background-color: #fff;
    border-radius: 15px;
    padding: 15px !important;
}

.tab-content-giftcard .nav-pills .nav-item {
    margin-left: 5px;
}

.tab-content-giftcard .nav-pills .nav-link.active {
    color: #3f2474;
    border: 1px solid #3f2474;
    background-color: #ffffff;

}

.tab-content-giftcard .nav-pills .nav-link {
    color: #808080;
    border: 1px solid #808080;
    background-color: #ffffff;
    border-radius: 15px;
    font-size: 14px;
    height: 3rem;
    padding: 0 20px;
}

.tab-content-giftcard .tab-content .tab-pane {
    background-color: #fff;
    border-radius: 15px;
    padding: 15px !important;

}

.description-widget-course {
    background-color: #fff;
    padding: 15px;
    border-radius: 15px;
}

.description-widget-course .image-box {
    height: 46rem;
    margin-bottom: 15px;
}

.description-widget-course .item-content {
    margin-bottom: 15px;
}

.description-widget-course .item-content span {
    color: #000;
}

.description-widget-course .item-content .description {
    color: #808080;
}

.description-widget-course .item-content-price {
    background-color: #f1f1f1;
    border-radius: 10px;
    padding: 5px 15px;
    margin-bottom: 10px;
}

#sendMessageBtn,
.description-widget-course .send-btn {
    background-color: #58c211;
    border-radius: 10px;
    height: 3.5rem;
    border: none;
}

#CommentForm {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    position: relative;
}

#CommentForm p {
    width: 100%;
}

#CommentForm div {
    width: 100%;
}

.comment-box input {
    border: 1px solid #eaeef7;
    background-color: #f1f1f1;
    width: 100%;
}

.comment-box span {
    font-size: 1.6rem !important;
}

#CommentForm div textarea {
    margin-bottom: 10px;
    border: 1px solid #eaeef7;
    background-color: #f1f1f1;
}

.your-comments {
    background: #f7f7f7;
}

.tab-pane .tab-pane-list .item-slider-product {
    width: 23.5%;
    margin-bottom: 15px;
}

.tab-pane .tab-pane-list .item-slider-product .image-box {
    height: 32rem;
    max-height: 32rem;
}

.tab-pane .tab-pane-list .item-slider-product:hover .buy-btn-box {
    border: 1px solid #e2175c;

}

.tab-pane .tab-pane-list .item-slider-product:hover .buy-btn {
    background: linear-gradient(90deg, #e0175b 0%, #b40440 50%);
}

.tab-pane .tab-pane-list .item-slider-product .title {
    margin: 0.8rem 0 0.8rem !important;
}



/* -----------------------#ads1---------------------- */
.ads.ads-1 .ads-1-box .item {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 1.5rem;
    -webkit-border-radius: 1.5rem;
    -moz-border-radius: 1.5rem;
    -ms-border-radius: 1.5rem;
    -o-border-radius: 1.5rem;
}

.ads.ads-1 {
    width: 100%;
    height: auto;
}

.ads.ads-1 .ads-1-box {
    width: 100%;
    height: auto;
}

.ads.ads-1 .ads-1-box .item img {
    width: 100%;
    height: auto;
    border-radius: 15px 15px 0 15px !important;
}

/* ----------------------#ads-2------------------------ */
.ads.ads-2 .ads-2-box {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.ads.ads-2 .ads-2-box .item {
    width: calc(50% - 1.5rem);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ads.ads-2 .ads-2-box .item:nth-child(1) {
    border-radius: 30px 30px 0 30px !important;
    background-color: #000;

}

.ads.ads-2 .ads-2-box .item:nth-child(2) {
    border-radius: 30px 30px 30px 0 !important;
    background-color: #000;

}

.ads.ads-2 .ads-2-box .item img {
    width: 100%;
    height: auto;

}

/* ----------------------#ads-3------------------------ */
.ads.ads-3 .ads-3-box {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.ads.ads-3 .ads-3-box .item {
    width: calc(33.33% - 1.5rem);
    border-radius: 15px !important;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ads.ads-3 .ads-3-box .item img {
    width: 100%;
    height: auto;
    border-radius: 15px !important;
}

/* -----------------------#ads-4------------------------ */
.ads.ads-4 .ads-4-box {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.ads.ads-4 .ads-4-box .item {
    width: calc(24.5% - 1.5rem);
    border-radius: 15px !important;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ads.ads-4 .ads-4-box .item img {
    width: 100%;
    height: auto;
    border-radius: 15px !important;
}

/* ----------------------#ads-5------------------------ */
.ads.ads-5 .ads-5-box {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.ads.ads-5 .ads-5-box .item {
    width: calc(50% - 1.5rem);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ads.ads-5 .ads-5-box .item:nth-child(1) {
    width: calc(35% - 1.5rem);
    border-radius: 30px 30px 0 30px !important;
    background-color: #000;
    margin-left: 30px;
}

.ads.ads-5 .ads-5-box .item:nth-child(2) {
    width: calc(65% - 1.5rem);
    border-radius: 30px 30px 30px 0 !important;
    background-color: #000;

}

.ads.ads-5 .ads-5-box .item img {
    width: 100%;
    height: auto;

}


/* Start Pagination */
.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    list-style: none;
    padding: 0;
    margin: 30px 0;
    gap: 8px;
}

.pagination .page-item span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    height: 38px;
    padding: 0 12px;
    border-radius: 8px;
    background-color: #fff;
    color: #333;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.3s ease;
    border: 1px solid transparent;
}

.pagination .page-item span:hover {
    background-color: #112a53;
    color: #fff;
    transform: translateY(-2px);
}

/* حالت صفحه فعال */
.pagination .page-item.active span {
    background-color: #112a53;
    color: #fff;
    border-color: #112a53;
    font-weight: 600;
}

/* -------------------------------------------- */
/* ------------------ #Login ------------------ */
/* -------------------------------------------- */
.login-page {
    height: 100vh;
    position: fixed;
    top: 0;
    z-index: 99999;
    padding: 15px;
}

.login-page .logo {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-page .logo a {
    display: flex;
    width: 25rem;
    height: auto;
}

.login-page .logo a img {
    width: 100%;
}


#loginForm label {
    cursor: auto;
}

.login-page .login-box {
    width: 45rem;
    min-height: 43rem;
    border-radius: 1rem;
    height: auto;
    padding: 5rem;
    -webkit-border-radius: 1rem;
    -moz-border-radius: 1rem;
    -ms-border-radius: 1rem;
    -o-border-radius: 1rem;
}

.login-page input {
    height: 5rem;
    text-align: right;
    font-size: 1.6rem !important;
}

.login-page input::-webkit-input-placeholder {
    font-size: 13px !important;
}

.login-page input::-moz-placeholder {
    font-size: 13px !important;
}

.login-page input:-ms-input-placeholder {
    font-size: 13px !important;
}

.login-page input::-ms-input-placeholder {
    font-size: 13px !important;
}

.login-page input::placeholder {
    font-size: 13px !important;
}

.login-page input[type="checkbox"] {
    display: inline-block;
    margin-left: 0.5rem;
}

.login-page .acceptrules label {
    margin: 0;
}

.login-page .btn {
    height: 5rem;
    background-color: #6022cf;
}

.login-page p {
    line-height: 2;
    font-size: 1rem;
    text-align: justify;
}

.login-page .icon-Enter {
    vertical-align: middle;
}

.login-page .icon-Enter::before {
    color: #222;
}

.login-page .loginbysms {
    cursor: pointer;
}

.login-page .logo img {
    width: auto;
}

/* widget box  */
.widget-blog .blog-audio .text-blog-audio {
    line-height: 20px;
}

.widget-blog .blog-audio audio {
    width: 100%;
    height: 4.5rem;
}

.widget-blog .widget-blog-list li {
    border-bottom: 1px solid #f2f6fc;
    padding: 10px;
    height: 9rem;
}

.widget-blog .widget-blog-list li:last-child {
    border-bottom: 0;
    padding-bottom: 0 !important;
}

.widget-blog .widget-blog-list li .image-box {
    width: 11rem;
    height: 7rem;
    border-radius: 10px !important;
    padding: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.widget-blog .widget-blog-list li .image-box img {
    width: 100%;
    height: auto;
    border-radius: 10px !important;
}

.widget-blog .widget-blog-list li .title-and-deta {
    width: calc(100% - 7rem);
    color: #112a53;
}

.widget-blog .widget-blog-list li .title-and-deta .title-blog {
    line-height: 15px;
    text-align: justify;
    font-size: 11px !important;
    height: 4rem;
}

.widget-blog .grouping-scoring-box .progress {
    height: 20px !important;
    margin-top: 0;
    width: 100% !important;
}

.widget-blog .grouping-scoring-box .user-rating .rate:not(old) {
    height: 3em !important;
}

.rate:not(old)>input {
    margin-right: -100%;
    opacity: 0;
}

.rate:not(old)>label {
    display: block;
    float: left;
    margin-right: 0.5rem;
    position: relative;
    background: url(/Content/Images/star-off-big.png);
    background-size: contain;
}

.widget-blog .rate:not(old)>label:before {
    width: 2.8em;
    height: 2.8em;
}

.blog-audio .blog-down-pdf {
    background-color: #5d32b1;
}

.blog-audio .blog-down-audio {
    background-color: #378b0e;
}

/* -------#widget---*/
.widget.widget-filter li.panel {
    width: 100%;
    line-height: 3;
    font-size: 1.2rem;
    border-bottom: .1rem solid #ececec;
}

.widget.widget-filter li.panel a:after {
    content: '\276F';
    color: #0072bc;
    float: right;
    margin-left: 1rem;
    font-size: 1.4rem;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transition: all .3s;
    transition: all .3s;
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
}

.widget.widget-filter li.panel a.collapsed::after {
    -webkit-transform: none;
    transform: none;
}

.widget.widget-filter li.panel ul {
    margin: 0px 20px 0 0 !important;
}

.widget.widget-filter li.panel ul li {
    display: block;
    padding-right: 1.5rem;
}

.widget.widget-filter li.panel a.collapsed+ul li {
    padding-right: 1.5rem;
}

.widget {
    background-color: #fff;
    padding: 20px;
    border-radius: 15px !important;
    -webkit-border-radius: 15px !important;
    -moz-border-radius: 15px !important;
    -ms-border-radius: 15px !important;
    -o-border-radius: 15px !important;
}

.widget .widget-title {
    color: #3b4359;
    font-size: 18px;
}

.widget-search-btn {
    margin-top: 5px;
}

.widget input.input-filtr,
.widget input.form-control {
    width: 100%;
    height: 5rem;
    background-color: #f5f5f5;
    border-radius: 15px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -ms-border-radius: 15px;
    -o-border-radius: 15px;
    padding: 15px;
    margin-top: 5px;
}

.widget .widget-category-list ul {
    display: flex;
    flex-direction: column;
}

.widget .widget-category-list ul li {
    font-size: 15px;
    color: gray;
    padding-right: 3px;
    height: 3rem;
}

.widget .widget-category-list ul li a {
    font-size: 13px;
    color: gray;
    padding-right: 3px;
    height: 3rem;
}

.widget .widget-category-list ul .cco2 {
    padding-right: 20px;
    align-items: center;
}

.widget .widget-category-list ul .cco3 {
    padding-right: 40px;
}

.widget .widget-category-list ul li.cco1::before,
.widget .widget-category-list ul li.cco2::before {
    content: "-";
    font-size: 12px;
    color: gray;
    margin-top: 5px;
}

.widget .widget-category-list ul .cco3 label {
    color: gray
}

.widget .widget-category-list ul .cco3 ul {
    margin-top: 10px !important;
}

.widget .widget-category-list ul li.cco3::before {
    content: "-";
    font-size: 18px;
    color: gray;
}

/* The switch - the box around the slider */
.widget-toggle .switch {
    position: relative;
    display: inline-block;
    width: 4rem;
    height: 1.6rem;
}

/* Hide default HTML checkbox */
.widget-toggle .switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

/* The slider */
.widget-toggle .stockslider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    transition: .4s;
}


.widget.widget-brand .widget-brand-img {
    width: 80%;
    height: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.widget.widget-brand .widget-brand-img img {
    height: 100%;
    width: auto;
}

.widget-brand-list ul li {
    margin-bottom: 5px;
}

.widget-brand-list ul li label {
    width: 100%;
    margin: 0 5px 0 0;
    font-size: 15px;
    cursor: pointer;

}

.widget.widget-brand .widget-brand-list ul li:last-child {
    margin-bottom: 0;
}

.widget-range--content input {
    height: 4rem;
    width: auto;
    margin-top: 8px;
}


.widget.widget-brand .widget-brand-list ul li span {
    float: left;
    padding-left: 1rem;
}

.stockslider:before {
    position: absolute;
    content: "";
    height: 1.5rem;
    width: 1.5rem;
    left: .5rem;
    bottom: .3rem;
    background-color: white;
    transition: .4s;
}

input:checked+.stockslider {
    background-color: #F9AB00;
}

input:focus+.stockslider {
    box-shadow: 0 0 1px #F9AB00;
}

input:checked+.stockslider:before {
    transform: translateX(26px);
    left: -.5rem;
}

/* Rounded sliders */
.stockslider.round {
    border-radius: 34px;
    width: 4rem;
    height: 2rem;
}

.stockslider.round:before {
    border-radius: 50%;
}

/* Rounded sliders */
.stockslider.round {
    border-radius: 34px;
    width: 4rem;
    height: 2rem;
}

.stockslider.round:before {
    border-radius: 50%;
}

.ui-slider-horizontal {
    height: .1rem;
}

.ui-widget-content {
    background: #f5f6f7;
}

.ui-widget-header {
    background: #000;
}

.ui-widget.ui-widget-content {
    border: .1rem solid #f5f6f7;
}

.ui-slider .ui-slider-handle {
    width: 3rem;
    height: 3rem;
    top: -1.5rem;
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
.ui-button.ui-state-disabled:hover,
.ui-button.ui-state-disabled:active {
    background: #f5f6f7;
}

.widget-range .widget-range--content #slider {
    position: relative;
    width: 90%;
    margin: 1rem auto;
}

.widget-range .text-range--content {
    color: grey;
}

span.ui-slider-handle.ui-state-default.ui-corner-all:nth-child(2)::after,
a.ui-slider-handle.ui-state-default.ui-corner-all:nth-child(2)::after {
    content: '\203A';
    position: absolute;
    color: #F9AB00;
    top: -1.1rem;
    left: .9rem;
    font-size: 3rem;
}

span.ui-slider-handle.ui-state-default.ui-corner-all:nth-child(3)::after,
a.ui-slider-handle.ui-state-default.ui-corner-all:nth-child(3)::after {
    content: '\2039';
    position: absolute;
    color: #F9AB00;
    top: -1.1rem;
    left: .9rem;
    font-size: 3rem;
}

.ui-widget.ui-widget-content {
    width: calc(100% - 3rem);
    margin: 0 auto;
}

.ui-slider-horizontal .ui-slider-handle {
    top: -.9em;
    margin-left: -15px;
}

/* Breadcrumb */
.page-breadcrumb {
    padding: 1.5rem 0;
}

.page-breadcrumb .breadcrumb .breadcrumb-item,
.page-breadcrumb .breadcrumb .breadcrumb-item a {
    color: gray !important;
    font-size: 14px;
}

/* blog */
.blog .single-blog-page {
    position: relative;
    background: #fff;
    margin-bottom: 25px;
}

.blog .single-blog-page .btn-product-edit {
    font-size: 25px;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 99;
    color: #112a53;
}

.blog .single-blog-page .header-box {
    border-bottom: 1px solid #f2f6fc;
    height: 8rem;
    top: 0;
    z-index: 9;
    background: #fff;
}

.blog .single-blog-page .header-box .name-blog-fa {
    font-size: 19px !important;
}

.blog .single-blog-page .header-box .study-time {
    height: 3.5rem;
    border-radius: 5px 5px 0 0;
    background: #f1f1f1;
    position: absolute;
    bottom: 0;
    left: 0;
    -webkit-border-radius: 5px 5px 0 0;
    -moz-border-radius: 5px 5px 0 0;
    -ms-border-radius: 5px 5px 0 0;
    -o-border-radius: 5px 5px 0 0;
}

.blog .single-blog-page .header-box .study-time i {
    color: #112a53;
}

.blog .single-blog-page .grouping-scoring-box .number-article {
    border-left: 1px solid #f2f6fc;
    padding-left: 15px;
}

.blog .single-blog-page .grouping-scoring-box .progress {
    height: 2rem !important;
    width: 100% !important;
}

.blog .single-blog-page .article-abstract-box {
    width: 100%;
    background: #f1f1f1;
    padding: 15px;
    border-radius: 15px;
    margin-top: 15px;
}

.blog .single-blog-page .article-abstract-box .article-abstract-text {
    width: calc(100% - 25%);
}

.blog .single-blog-page .article-abstract-box .article-abstract-text p {
    text-align: justify;
    line-height: 23px;
    margin: 10px 0 !important;
    font-size: 14px;
}

.blog .single-blog-page .article-abstract-box .image-blog {
    width: 25%;
    height: 16rem;
    max-height: 16rem;
    background: #fff;
}

.blog .single-blog-page .article-abstract-box .image-blog img {
    width: 100%;
    height: 100%;
}

.blog .header-box .nav {
    width: 100%;
    height: .2rem;
    background-color: rgb(179, 179, 179);
    bottom: 0;
}

.blog .header-box .nav .nav-bar {
    position: absolute;
    bottom: 0;
    width: 0;
    height: .5rem;
    background-color: red;
}

.blog .data-box .update-btn,
.blog .grouping-blogs .grouping-link {
    background: #da1e38;
    color: #fff;
    padding: 5px 15px;
    border-radius: 15px 15px 0 0;
}

.blog .grouping-blogs .title-base i {
    display: none;
}

.blog .data-box .update-btn {
    background: #5d32b1;
}

.blog .social-networks {
    justify-content: center !important;
}

.social-networks-box .social-networks .social-networks-item {
    display: flex;
    align-items: center;
    justify-content: center;
}

.social-networks-box .social-networks .social-networks-item a img {
    width: 100%;
}

/* ====================================
   Base Typography
==================================== */

.description-box,
.blog-content {
    color: #000;
    font-size: 1.5rem;
    line-height: 2.4;
}

.description-box p,
.blog-content p {
    margin-bottom: 1.5rem;
    text-align: justify;
}

.description-box p span,
.blog-content p span {
    font-size: inherit;
    line-height: inherit;
}

/* ====================================
   Headings (Hierarchy مهم برای SEO)
==================================== */

.description-box h2,
.blog-content h2 {
    font-size: 2rem;
    margin: 2rem 0 1rem !important;
    font-weight: bold !important;
    color: #1a3870;
}

.description-box h3,
.blog-content h3 {
    font-size: 1.7rem;
    margin: 1.8rem 0 0.8rem !important;
    font-weight: bold !important;
    color: #1a3870;
}

.description-box h4,
.blog-content h4 {
    font-size: 1.5rem;
    margin: 1.5rem 0 0.7rem !important;
    font-weight: bold !important;
    color: #1a3870;
}

/* ====================================
   Strong & Links
==================================== */

.description-box strong,
.blog-content strong {
    font-weight: 600;
}

.description-box a,
.blog-content a {
    color: #0064ff;
    text-decoration: none;
    transition: 0.3s;
}

.description-box a:hover,
.blog-content a:hover {
    text-decoration: underline;
}

/* ====================================
   Images
==================================== */

.description-box img,
.blog-content img {
    max-width: 100%;
    height: auto;
    border-radius: 12px;
    margin: 1.5rem 0;
}

/* ====================================
   Lists
==================================== */

.description-box ul,
.blog-content ul,
.description-box ol,
.blog-content ol {
    margin: 1.5rem 0;
    padding-right: 4rem !important;
}

.description-box ul li,
.blog-content ul li {
    display: list-item;
    list-style: disc;
    list-style-position: outside;
    margin-bottom: 0.8rem;
}

.description-box ol li,
.blog-content ol li {
    display: list-item;
    list-style: decimal;
    list-style-position: outside;
    margin-bottom: 0.8rem;
}

/* ====================================
   Blockquote
==================================== */

.description-box blockquote,
.blog-content blockquote {
    margin: 2rem 0;
    padding: 1.5rem;
    background: #f4f5f9;
    border-right: 4px solid #2962FF;
    border-radius: 8px;
    font-style: italic;
}

/* ====================================
   Tables
==================================== */

.description-box table,
.blog-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 2rem 0;
}

.description-box table th,
.description-box table td,
.blog-content table th,
.blog-content table td {
    padding: 1rem;
    border: 1px solid #e5e5e5;
    text-align: center;
    font-size: 1.4rem;
}

.description-box table tr:nth-child(odd),
.blog-content table tr:nth-child(odd) {
    background: #f8f8f8;
}

/* ====================================
   Highlight Box (Div بدون کلاس)
==================================== */
.description-box>div:not([class]),
.blog-content>div:not([class]) {
    background: #f4f5f9;
    border: 1px solid #dcdcdc;
    padding: 1.5rem;
    border-radius: 12px;
    margin: 1.5rem 0;
}

.grouping-scoring-box .user-rating .rate:not(old) {
    height: 2em !important;
}


/* #Info Page */
.contant-page {
    background-image: url(../img/support_content.webp);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 30px 0;
    margin-bottom: 0 !important;
}

.content-page a {
    color: #000;
}

.info-page .page-breadcrumb {
    padding-top: 15.5rem;
}

.info-page .page-breadcrumb li {
    display: inline-block;
    font-size: 1.2rem;
}

.info-page .contactus {
    background-image: linear-gradient(var(--gray-color) 10%, var(--white-color) 50%, var(--white-color) 100%);
    padding: 3rem 2rem;
}

.info-page .contactus .block-title {
    font-size: 1.4rem;
}

.info-page .contactus .block-content ol#recently-viewed-items {
    list-style-position: inside;
    margin-top: 25px;
    padding-right: 0 !important;
}

.info-page .contactus .block-content ol#recently-viewed-items li {
    padding: 1rem;
    margin-bottom: 1rem;
    font-size: 1.4rem;
    background-color: #ffffff;
    width: 100%;
    border-radius: 5px;
}

.info-page .contactus .block-content ol#recently-viewed-items li a {
    color: #000;
}

.info-page .contactus .page-title {
    margin-bottom: 1rem;
}

.info-page .contactus .page-title h2 {
    font-size: 1.4rem;
}

.info-page .contactus .static-contain {
    border: 0.1rem solid #f5f5f5;
    padding: 1.5rem;
    border-radius: 0.5rem;
    margin-top: 25px;
    background: #fff;
    border-radius: 5px;
}

.info-page .contactus .static-contain .panel {
    border-top: 25px;
    border-bottom: 1px solid #f1f1f1;
}

.info-page .contactus .static-contain .panel:last-child {
    border-bottom: none;
}

.info-page .contactus .static-contain img {
    height: auto !important;
    width: 100% !important;
}

.static-contain .panel-collapse {
    font-size: 1.3rem;
    text-align: justify;
    border: .1rem solid #f5f5f5;
    border-radius: 1rem;
    margin-bottom: 2rem;
    line-height: 2;
}

.static-contain .panel-heading h4 {
    font-size: 1.4rem;
    line-height: 2.5;
}

.info-page .contactus .static-contain p {
    text-align: justify;
    font-size: 1.4rem;
    line-height: 2.5;
}

.static-contain .panel-collapse .panel-body {
    padding: 1rem 2rem;
}

.info-page .contactus .static-contain p span {
    font-family: inherit !important;
}

.info-page .contactus .static-contain h1 {
    font-size: 1.8rem;
    margin-bottom: 1rem;
}

.info-page .contactus .static-contain h2 {
    font-size: 1.6rem;
    margin-bottom: 1rem;
}

.info-page .contactus .static-contain ul {
    padding-right: 1.5rem;
    margin: 1rem 0;
    font-size: 1.2rem;
    list-style-type: disc;
    line-height: 2.5;
    list-style-position: inside;
}

.btn-product-edit {
    position: absolute;
    top: 1rem;
    right: 1rem;
    z-index: 99;
    font-size: 2.5rem;
}

.btn-product-edit .icon-Color:before {
    color: #052a66;
    position: absolute;
    top: 1rem;
    right: 1rem;
    z-index: 1090;
    font-size: 2.5rem;
}

.product__info .btn-product-edit .icon-Color:before {
    color: #052a66;
    position: absolute;
    top: 2rem;
    left: 2rem !important;
    right: auto;
    z-index: 1090;
    font-size: 3rem;
}

.bootstrap-maxlength {
    font-size: .9rem !important;
}

.modal-backdrop.fade.show {
    z-index: 1098;
}

.modal-open .modal {
    z-index: 1099;
}

input#btnCoupon {
    position: relative;
    top: 0.5rem;
    right: calc(100% - 12rem);
    width: 11.5rem;
    height: 3rem;
}

.lendo-offer {
    font-size: 1.3rem;
    background-color: #052a66;
    color: wheat;
    padding: 1rem 2rem;
    border-radius: 2rem;
    height: 4rem;
}

.lendo-offer a {
    color: var(--white-color);
}

.lendo-offer::before {
    content: '';
    width: 1rem;
    height: 1rem;
    border-left: 1rem solid #052a66;
    border-top: 1rem solid transparent;
    border-bottom: 1rem solid transparent;
    position: absolute;
    top: 10px;
    right: -7px;
}

.cart__offer strong#CouponDescription {
    font-size: 1.2rem;
}

li.insite {
    width: 3rem;
    height: 3rem;
    text-align: center;
}

.no-comment {
    width: 100%;
    height: 4rem;
    background-color: var(--silver-color);
    display: block;
    line-height: 2.5rem;
    padding: 0 1.5rem;
    border-radius: 2rem;
}

.category-text-content .read-more-box::after {
    background: linear-gradient(to bottom, transparent, #fff);
}

.category-text-content div.bg-white.border-10 {
    border-radius: 1.5rem;
}

.category-text-content {
    background-color: white;
    padding: 1.5rem;
    border-radius: 1rem;
    margin-bottom: 1.5rem;
    margin-top: 1.5rem;
}


.category-text-content a {
    color: #176cc8 !important;
}

.lg-outer {
    direction: rtl;
}

.lg-outer .lg-inner {
    direction: ltr;
}

.product-info .sticky-top.product-info-buy {
    top: 4rem;
}

.lg-backdrop {
    z-index: 99999 !important;
    background-color: #fff !important;
}

.lg-outer {
    z-index: 2000000003 !important;
}

.category-text-content {
    color: #444;
}

/* =========================
   Headings (سلسله مراتب درست)
========================= */

.category-text-content h1 {
    font-size: 2.4rem;
    /* بزرگ‌ترین */
    font-weight: 700;
    margin: 2rem 0 1.2rem !important;
    line-height: 1.4;
}

.category-text-content h2 {
    font-size: 2rem;
    font-weight: 600;
    margin: 2rem 0 1rem !important;
    line-height: 1.5;
}

.category-text-content h3 {
    font-size: 1.7rem;
    font-weight: 600;
    margin: 1.8rem 0 0.8rem !important;
    line-height: 1.6;
}

.category-text-content h4 {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 1.5rem 0 0.7rem !important;
    line-height: 1.6;
}

/* =========================
   Paragraph
========================= */

.category-text-content p {
    font-size: 1.5rem;
    line-height: 2.4;
    margin-bottom: 1.5rem;
    text-align: justify;
}

.category-text-content p strong {
    font-weight: 600;
}

/* =========================
   Lists (برای محتوای سئو مهمه)
========================= */

.category-text-content ul li {
    list-style: disc;
    list-style-position: inside;
    display: list-item;
    font-size: 14px;
    line-height: 2;
}

/* =========================
   Inline category list (برچسب‌ها)
========================= */

.category-text-content ul.category-listbox {
    padding: 0;
}

.category-text-content ul.category-listbox li {
    display: inline-block;
    margin-left: 1.2rem;
    list-style: none;
    font-size: 1.3rem;
}

/* =========================
   Responsive
========================= */

@media (max-width: 768px) {
    .category-text-content h1 {
        font-size: 2rem;
    }

    .category-text-content h2 {
        font-size: 1.8rem;
    }

    .category-text-content h3 {
        font-size: 1.6rem;
    }

    .category-text-content p {
        font-size: 1.4rem;
    }
}


/* read-more-box */
.read-more-box {
    max-height: 380px;
    overflow: hidden;
    position: relative;
    transition: max-height 0.6s ease;
}

.read-more-box::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 60px;
    background: linear-gradient(to bottom, transparent, #f1f1f1);
    pointer-events: none;
}

.read-more-box.expanded::after {
    display: none;
}

.read-less {
    display: none;
}

.read-more-btn .icon-chevron-down:before {
    content: "\e911";
    font-family: 'icomoon' !important;
    font-size: 10px;
    padding-right: 5px;
}

.read-less-btn .icon-angle-up:before {
    content: "\e91b";
    font-family: 'icomoon' !important;
    font-size: 10px;
    padding-right: 5px;
}

.read-less-btn,
.read-more-btn {
    font-size: 1.4rem;
    line-height: 2.5;
    position: absolute;
    bottom: 0;
    color: #da1e38;
    z-index: 99;
    width: 100%;
    display: flex;
    justify-content: center;
    cursor: pointer;
}

/* Start Contact Us */
.contactus-page .container {
    max-width: 1280px !important;
}

.contactus-page .form-contant-box .image-box {
    height: 18rem;
    border-radius: 15px;
    overflow: hidden;
}

.contactus-page .form-contant-box .image-box img {
    width: 100%;
    height: auto;
}

.contactus-page .form-contant-box textarea,
.contactus-page .form-contant-box input {
    border: 1px solid grey;
}

.contactus-page .form-contant-box textarea {
    height: 10rem;
}

.contactus-page .form-contant-box .btn-send {
    background-color: #4d2a91;
}

.contactus-page .description-top p,
.contactus-page .description-bottom p {
    line-height: 30px;
    color: #3d3d3d;
}

.contactus-page .description-top p {
    margin-bottom: 7rem !important;
    padding-bottom: 7rem !important;
    border-bottom: 1px solid grey;

}

/*  #Cart */
.cart .cart-box {
    background-color: #fff;
    padding: 15px;
    border-radius: 15px;
}

.cart .cart-list-box .cart-item .image-box {
    width: 10rem;
    height: 10rem;
    border-radius: 15px 15px 15px 5px;
    overflow: hidden;
}

.cart .cart-list-box .cart-item .image-box img {
    width: 100%;
}

.cart .cart-list-box .cart-item .name-and-delete-box .name {
    font-size: 1.8rem;
    line-height: 2.5rem;
}

.cart .cart-list-box .cart-item .numder-box .plus,
.cart .cart-list-box .cart-item .numder-box .minus {
    color: gray;
}

.cart .cart-list-box .cart-item .numder-box input {
    width: 5rem;
    border-radius: 5px;
    text-align: center;
    color: gray;

}

.cart .cart-list-box .cart-item .discount-percent {
    top: -32px;
    left: 0;
    width: 30px;
    height: 30px;
    border-radius: 5px !important;

}

.cart .cart-list-box .cart-item:last-child {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    border-bottom: none !important;
}

.cart .score-box {
    background-color: #ffd28f;
}

.cart .score-box .use-score-btn {
    background-color: #ffa622;
}

.cart .cart-item-right {
    width: 45%;
}

.cart .cart-item-left {
    width: 55%;
}

.off-cart-box {
    background-color: #fbe8eb;
    border-radius: 15px 4px 4px 4px;
    padding: 10px;
}

.off-cart-box input {
    background-color: #ee97a3;
    width: 12rem;
    height: 2.5rem;
    margin-left: 5px;
}

.off-cart-box input::placeholder {
    color: #da1e38;
    font-size: 13px;
}

.add-off-cart {
    height: 2.5rem;
    line-height: 10px;
}

.pay-cart-box {
    background-color: #eef9e7;
    color: #73cc37;
}

#table-op {
    height: 6rem;
    border: none;
    background: #1cb561;
    display: -webkit-inline-box;
    line-height: 4rem;
    text-align: center;
    padding: 0 15px;
    color: #fff;
    border-radius: 4px;
    font-size: 20px !important;
}

.cart .item-model,
.cart .item-model span {
    font-size: 1rem !important;
}

.cart .item-warranty {
    font-size: 1.1rem !important;
    margin-bottom: 0 !important;
}

.cart .item-color {
    font-size: 1.1rem !important;
    margin-bottom: 0 !important;
}

.cart .color-box {
    width: 2rem;
    height: 2rem;
}

.cart .product-title {
    letter-spacing: 0rem;
    font-weight: lighter !important;
    font-size: 1.4rem !important;
    line-height: 2.5rem;
    margin-bottom: 0 !important;
}

.cart .item-price {
    width: 100% !important;
    padding-bottom: 1.5rem;
    flex-direction: column;
    align-items: inherit !important;
}

.cart .item-price .total-price {
    flex-direction: column !important;
    align-items: inherit !important;
}

.cart .item-price .order-count {
    display: flex;
    justify-content: end;
    margin-top: 20px;
}

.cart .real-price {
    margin-right: 0 !important;
}

.cart .real-price div {
    font-size: 1.6rem !important;
    line-height: 2rem;
}

.cart .remove-item {
    top: inherit;
    bottom: inherit;
    left: inherit;
    right: inherit;
    cursor: pointer;
    position: inherit !important;
}

.comment-box span {
    font-size: 1.6rem !important;
}

.comment-box p {
    font-size: 1.4rem !important;
}

.no-comment {
    font-size: 1.2rem !important;
}

.contactus .contactus__image {
    height: auto;
}

.info-page .col-main {
    padding: 25px 25px;
}

.menu-admin li a {
    font-size: 1.4rem;
}

.cart .cart-item-box {
    flex-direction: column;
    align-items: center;
}

.Internet-payment-box {
    flex-direction: column;
}

.cart-notice {
    background: #fff;
    margin-top: 10px;
    border: 1px solid #dee2e6;
}

.cart-notice .cart-notice-item {
    margin-top: 15px !important;
}

/* ----------------------- */
/* ----- #Final Cart ----- */
/* ----------------------- */
.finalcart {
    padding: 3rem 0;
    background: #fff;

}

.finalcart .finalcart__info h3 {
    color: #649a43;
    font-size: 2rem;
    line-height: 3.5rem;
}

.finalcart .finalcart__info h3 i {
    color: #649a43;
    font-size: 2.5rem;
    vertical-align: middle;
    margin-left: 1rem;
}

.finalcart .finalcart__info .finalcart__info--form {
    padding: 2rem 0;
}

.cart-item-image a {
    width: 8rem;
    height: 8rem;
}

.cart-item-image a img {
    width: 100%;
    height: 100%;
}

.cart-item-content {
    border-bottom: 1px solid rgb(204, 204, 204);
}

.cart-item-content:last-child {
    border-bottom: none;
}

.cart-item-content .input-text {
    padding: 8px 5px;
    border-radius: 5px;
    font-size: 16px;
    width: 50px;
}

.cart-item-content .table-op {
    font-size: 18px;
    padding: 0 5px;
}

/* ----------------- */
/* ----- #Cart ----- */
/* ----------------- */

.cart-item-desc a h3 {
    height: 4rem;
    line-height: 6rem !important;
}

.cart-sendbar .cart-item {
    min-height: auto;
}

.cart .cart-item-box .cart-item-image img {
    width: 100%;
}

.cart .cart-item-box .cart-item-content {
    width: 100%;
    padding-right: 10px;
}

.cart .item-model,
.cart .item-model span {
    font-size: 1rem !important;
}

.cart .item-warranty {
    font-size: 1.1rem !important;
    margin-bottom: 0 !important;
}

.cart .item-color {
    font-size: 1.1rem !important;
    margin-bottom: 0 !important;
}

.cart .color-box {
    width: 2rem;
    height: 2rem;
}

.cart .product-title {
    letter-spacing: 0rem;
    font-weight: lighter !important;
    font-size: 1.4rem !important;
    line-height: 2.5rem;
    margin-bottom: 0 !important;
}

.cart .item-price {
    width: 100% !important;
    padding-bottom: 1.5rem;
    flex-direction: column;
    align-items: inherit !important;
}

.cart .item-price .total-price {
    flex-direction: column !important;
    align-items: inherit !important;
}

.cart .item-price .order-count {
    display: flex;
    justify-content: end;
    margin-top: 20px;
}

.cart .real-price {
    margin-right: 0 !important;
}

.cart .real-price div {
    font-size: 1.6rem !important;
    line-height: 2rem;
}

.cart .remove-item {
    top: inherit;
    bottom: inherit;
    left: inherit;
    right: inherit;
    cursor: pointer;
    position: inherit !important;
}

.finalcart .finalcart__info .finalcart__info--form .finalcart__info--form-value {
    flex-basis: auto;
    margin-bottom: 1.5rem;
    border-radius: 5px !important;
    -webkit-border-radius: 5px !important;
    -moz-border-radius: 5px !important;
    -ms-border-radius: 5px !important;
    -o-border-radius: 5px !important;
}

.finalcart .finalcart__info .finalcart__info--form .finalcart__info--form-value {
    position: relative;
}

.finalcart .finalcart__info .finalcart__info--form .finalcart__info--form-value i {
    position: absolute;
    top: .7rem;
    right: 2rem;
    font-size: 2.5rem;
    vertical-align: middle;
    margin-left: 1rem;
}

.finalcart .finalcart__info .finalcart__info--form input.form-control {
    height: 4rem;
    line-height: 4rem;
    border-radius: .4rem;
    padding-right: 1rem;
    vertical-align: middle;
    font-size: 1.6rem;
}

.finalcart .finalcart__info .finalcart__info--form input.form-control::-webkit-input-placeholder {
    font-size: 1.2rem;
}

.finalcart .finalcart__info .finalcart__info--form input.form-control:-ms-input-placeholder {
    font-size: 1.2rem;
}

.finalcart .finalcart__info .finalcart__info--form input.form-control::-moz-placeholder {
    font-size: 1.2rem;
}

.finalcart .finalcart__info .finalcart__info--form input.form-control::-ms-input-placeholder {
    font-size: 1.2rem;
}

.finalcart .finalcart__info .finalcart__info--form input.form-control::-webkit-input-placeholder {
    font-size: 1.2rem;
}

.finalcart .finalcart__info .finalcart__info--form input.form-control:-ms-input-placeholder {
    font-size: 1.2rem;
}

.finalcart .finalcart__info .finalcart__info--form input.form-control::placeholder {
    font-size: 1.2rem;
}

.finalcart .finalcart__info .finalcart__info--form .finalcart__info--form-address label {
    display: block;
    font-size: 1.1rem;
    margin-bottom: 2rem;
}

.finalcart .finalcart__info .finalcart__info--form .finalcart__info--form-address select {
    display: block;
    width: 100%;
    height: 4rem;
    border-radius: .4rem;
    padding: 0 1rem;
    font-size: 1.4rem;
    margin-bottom: 1rem;
    border-color: #ced4da
}

.finalcart .finalcart__info .finalcart__info--form .finalcart__info--form-address textarea {
    font-size: 1.2rem;
    width: 100%;
    border-radius: .4rem;
    padding: 1rem;
    border-color: #f1f1f1;
}

.finalcart .finalcart__info .finalcart__info--form .finalcart__info--form-type select {
    display: block;
    width: 100%;
    height: 4rem;
    border-radius: .4rem;
    padding: 0 1rem;
    font-size: 1.4rem;
    margin-bottom: 1rem;
    border-color: #ced4da;
}

.finalcart .finalcart__info .finalcart__info--form .finalcart__info--form-factor {
    margin-top: 3rem;
}

.finalcart .finalcart__info .finalcart__info--form .finalcart__info--form-factor .factor-border {
    border: .1rem solid #dcdcdc;
    width: 100%;
    height: 5rem;
    border-radius: .4rem;
    margin-top: .5rem;
    background-color: #fff;
    line-height: 5rem;
    padding: 0 2rem;
    display: flex;
    justify-content: space-between;
}

.finalcart .finalcart__info .finalcart__info--form .finalcart__info--form-factor .factor-border label {
    font-size: 1.6rem;
}

.finalcart .finalcart__info .finalcart__info--form .finalcart__info--form-btn {
    border: .1rem solid #ced4da;
    border-radius: .4rem;
    padding: 1.5rem;
    text-align: left;
}

.finalcart .finalcart__info .finalcart__info--form .finalcart__info--form-btn .bank {
    display: inline-block;
    width: 100%;
    text-align: right;
}

.finalcart .finalcart__info .finalcart__info--form .finalcart__info--form-btn .bank img {
    width: 5rem;
}

.finalcart .finalcart__info .finalcart__info--form .finalcart__info--form-btn .bank .bank-select {
    display: inline-block;
    margin-left: 15px;
}

.finalcart .finalcart__info .finalcart__info--form .finalcart__info--form-btn input.btn {
    vertical-align: middle;
    display: inline-block;
    background-color: #00ab67;
    color: #fff;
    width: 13rem;
    height: 4rem;
    border-radius: .4rem;
    font-size: 1.6rem;
    transition: all .3s;
}

.finalcart .finalcart__info .finalcart__info--form .finalcart__info--form-btn input.btn:hover {
    background-color: #0072bc;
}

.finalcart .form-control {
    background-color: #f1f1f1;
    height: 4rem;
}

.cart__btn {
    background: #112a53;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
    border-radius: 15px;
    color: #FFF !important;
    font-size: 1.6rem;
    border: 0;
}

.cart-title {
    padding-bottom: 15px;
    margin-bottom: 15px !important;
}

/* ============================= */
/* ===== Responsive ≤ 991px ==== */
/* ============================= */

@media (max-width: 991px) {

    /* ۱. تغییر ساختار کلی آیتم سبد به ستونی */
    .cart .cart-item {
        flex-direction: column !important;
        align-items: flex-start !important;
        padding: 15px;
        position: relative;
    }

    /* ۲. تنظیم بخش تصویر و نام محصول */
    .cart .cart-item-right {
        width: 100% !important;
        margin-bottom: 15px;
        border-bottom: 1px dashed #eee;
        padding-bottom: 10px;
    }

    .cart .cart-list-box .cart-item .image-box {
        width: 70px !important;
        height: 70px !important;
        min-width: 70px;
        margin-left: 10px;
        /* فاصله از نام */
    }

    .cart .cart-item-right .name {
        font-size: 1.1rem !important;
        line-height: 1.5rem;
    }

    /* ۳. تنظیم بخش قیمت و تعداد (باکس‌های داخلی) */
    .cart .cart-item-left {
        width: 100% !important;
    }

    .cart .cart-item-left-box {
        flex-direction: column !important;
        align-items: flex-start !important;
        background: #f9f9f9;
        padding: 10px;
        border-radius: 10px;
        margin-bottom: 15px !important;
        position: relative;
        /* برای دکمه حذف */
    }

    /* نام زیرمجموعه (مثلا ۳۲۵ یوسی) */
    .other-name {
        font-size: 1rem !important;
        font-weight: bold;
        margin-bottom: 10px;
    }

    /* باکس قیمت */
    .price-box {
        width: 100%;
        margin-bottom: 10px;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
    }

    .price-box .price-real {
        margin: 0 5px !important;
        font-size: 1.1rem !important;
    }

    /* ۴. تنظیم باکس تعداد و دکمه حذف */
    .numder-box {
        width: 100%;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        margin-top: 5px;
    }

    /* اصلاح دکمه حذف که در تصویر روی متن بود */
    .cart .remove-item {
        position: static !important;
        /* خارج کردن از حالت مطلق */
        margin-top: 15px !important;
        padding: 5px 10px;
        background: #fff5f5;
        border-radius: 5px;
        width: fit-content;
    }

    /* ۵. اصلاح باکس امتیاز */
    .score-box {
        flex-direction: column;
        text-align: center;
    }

    .score-box .use-score-btn {
        width: 100%;
        margin-top: 15px;
    }

    /* ۶. اصلاح باکس خلاصه صورتحساب (ستون سمت چپ) */
    .total-cart {
        margin-top: 25px;
    }

    .off-cart-box form {
        flex-direction: column !important;
        align-items: flex-start !important;
    }

    .off-cart-box form div {
        width: 100%;
        margin-top: 10px;
    }

    .off-cart-box input {
        width: 100% !important;
        margin-left: 0 !important;
        margin-bottom: 5px;
    }

    .add-off-cart {
        width: 100%;
    }
}

/* اصلاح فونت اعداد فارسی اگر لود نشده باشند */
.num-fa {
    direction: ltr;
    display: inline-block;
}


/* Start Forums page */
.forums-page .forums-page-box .accordion-item {
    margin-bottom: 10px;
    border-radius: 15px;
    overflow: hidden;
}

.forums-page .forums-page-box .accordion-body-row {
    border-bottom: 1px solid #dfdfdf;
    padding: 10px !important;
}

.forums-page .forums-page-box .accordion-body-row:last-child {
    border-bottom: none;
    padding-bottom: 0 !important;
}

.forums-page .forums-page-box .accordion-body-row:first-child {
    padding-top: 0 !important;
}

.forums-page .forums-page-box .accordion-call-me .accordion-button,
.forums-page .forums-page-box .accordion-call-me .accordion-button:not(.collapsed) {
    color: #5b31ad;
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .125);
    background-color: #4f2b9533;
}

.forums-page .forums-page-box .accordion-call-user .accordion-button,
.forums-page .forums-page-box .accordion-call-user .accordion-button:not(.collapsed) {
    color: #5b31ad;
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .125);
    background-color: #fff8dc;
}

.forums-page .forums-page-box .accordion-call-me .accordion-item {
    margin-bottom: 5px;
}

.forums-page .forums-page-box .accordion-call-me {
    margin-bottom: 25px;
}

.forums-page .forums-page-box .accordion-call-user .accordion-body-row:nth-child(even) {
    background-color: #f0f8ff;
}

.forums-page .forums-page-box .accordion-body {
    padding: 1rem 0 !important;
}

.forums-page .forums-page-box .app-paging .pagination .page-item {
    background-color: #dcd5ea4f;
}

.singleforums-page table {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, .125);
    border-radius: 15px;
    overflow: hidden;
}

.singleforums-page table thead {
    color: #5b31ad;
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .125);
    background-color: #fff8dc;
    border-bottom: 1px solid rgba(0, 0, 0, .125);
}

.singleforums-page table tbody th,
.singleforums-page table tbody td {
    font-size: 15px;
    padding: 1.5rem .5rem;
}

.singleforums-page .table>:not(:last-child)>:last-child>* {
    border-bottom: 1px solid rgba(0, 0, 0, .125);
}

.singleforums-page table tbody tr:nth-child(even) {
    background-color: #f9f9f9;
}

.last-topic-box {
    border: 1px solid #dfdfdf;
    border-radius: 15px;
    overflow: hidden;
}

.last-topic-box .topic-heading .topic-title {
    background-color: #4f2b9533;
    height: 4rem;
    line-height: 4rem;
    text-align: center;
}

.last-topic-box .topic-list li:nth-child(even) a {
    background-color: #ffffff;
}

.last-topic-box .topic-list li a {
    font-size: 14px;
    height: 5rem;
    line-height: 23px;
    padding: 5px 10px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #dfdfdf;
    color: #423e3e;

}

.new-topic-btn {
    padding: 5px 10px;
    font-size: 15px;
    color: #fff !important;
    border-color: #fff;
    background-color: #CE0002;
    margin-left: 15px;
    border-radius: 5px;
}

.add-topic-box {
    border: 1px solid #ced4da;
    margin-bottom: 30px;
    margin: 0 auto 30px auto;
    padding: 30px;
    background-color: #f0f8ff;
    border-radius: 15px;
}

.add-topic-box .form-group>div input {
    height: 4rem;
    margin-top: 10px;
    border-radius: 15px;
    margin-bottom: 30px;
    font-size: 16px;
    padding: 10px;

}

.add-topic-box .form-group>div textarea {
    margin-top: 10px;
    border-radius: 15px;
    margin-bottom: 30px;
    font-size: 16px;
    padding: 10px;

}

.add-topic-box .form-group>div {
    position: relative;
}

.add-topic-box .form-group>div #newTopicTextError,
.add-topic-box .form-group>div #newTopicTitleError {
    position: absolute;
    bottom: -20px;
    font-size: 12px;
}

.add-topic-box .btn-add-topic {
    background-color: #4d2a90;
    color: #fff;
    border-radius: 25px;
    height: 4rem;
    width: 12rem;
    font-size: 13px;
}

.add-topic-box {
    display: none;
}

.hidden {
    display: none !important;
}

.user-submitted-topic-box {
    border: 1px solid #dfdfdf;
    border-radius: 15px;
    padding: 15px;
    background: #fff;
}

.user-submitted-topic-box .accont-user-box {
    border-radius: 15px;
    overflow: hidden;
}

.user-submitted-topic-box .accont-user-box {
    height: 100%;
}

.user-thread-box .persian-number {
    font-size: 12px;
    color: gray;
    padding-left: 10px;
    margin: 10px 0;
}

.user-thread-box .persian-number::after {
    content: "|";
    padding-right: 10px;
}

.user-thread-box .persian-number:last-child::after {
    content: "";
}

.response-info {
    font-size: 16px;
    line-height: 30px;
}

/* Start Page User Panel */
.side-bar-menu {
    background-color: #fff;
    width: 100%;
    height: 100vh;
    padding: 50px 30px;
}

.side-bar-menu .image-profile {
    width: 7rem;
    height: 7rem;
    overflow: hidden;
    border: 1px dashed;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    padding: 5px;
}

.side-bar-menu .image-profile img {
    width: 100%;
}

.side-bar-menu .menu-item .image-box {
    width: 2rem;
    height: 2rem;
    margin-left: 3px;
}

.side-bar-menu .menu-item .image-box img {
    width: 100%;
}

.menu-item {
    cursor: pointer;
    padding: 10px;
    border-radius: 8px;
    transition: 0.3s;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.submenu a {
    display: block;
    padding: 6px 10px;
    color: #555;
    text-decoration: none;
    font-size: 14px;
}

.body-userpanel {
    background-color: #f7f2ff !important;
}

.header-userpanel {
    height: 13rem;
    align-items: center;
}

.header-userpanel .name-user {
    background: linear-gradient(90deg, #e0175b 0%, #b40440 50%);
    height: 4rem;
    line-height: 4rem;
    border-radius: 30px;
    padding: 15px 30px;
    display: flex;
    align-items: center;
    color: #fff;
    font-size: 14px;
    position: relative;
    cursor: pointer;
}

.header-userpanel .name-user .other-userpanel {
    display: none;
}

.header-userpanel .name-user:hover .other-userpanel {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 40px;
    right: 0;
    background: #ffffff;
    width: 100%;
    border-radius: 10px;
    padding: 5px;
}

.header-userpanel .name-user .other-userpanel a {
    padding: 5px 15px;
    color: #000;

}

.header-userpanel .name-user .other-userpanel a:hover {
    background-color: #f7f2ff;
    border-radius: 15px;
}

.list-sevice-userpanel {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr);
    gap: 15px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.content-body-userpanel .item-sevice-userpanel {
    display: flex;
    flex-direction: column;
    background-color: #fff;
    border-radius: 15px;
    padding: 15px;
    gap: 15px;
    width: 29.5rem;
}

.content-body-userpanel .item-sevice-userpanel .image-box {
    width: 100%;
    height: 22rem;
    border-radius: 15px;
    padding: 30px;
}

.content-body-userpanel .item-sevice-userpanel .image-box img {
    width: auto;
    height: 100%;
}

.content-body-userpanel .item-sevice-userpanel .name-service {
    height: 5rem;
    background-color: #e7e7ff;
    color: #6022cf;
    border-radius: 15px;

}

.page-userpanel .col-xl-10 {
    padding: 0 20px !important;
}

/* Profile Custom Styles */
.user-profile-card {
    background-color: #fff;
    border-radius: 15px;
    padding: 25px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
}

.profile-header-bar {
    border-bottom: 2px solid #e7e7ff;
    padding-bottom: 15px;
    margin-bottom: 20px;
}

.children-page .children-title,
.children-page .children-title,
.edit-profile-container .title-page,
.profile-title {
    color: #6022cf;
    font-size: 18px;
    font-weight: bold;
}

.user-profile-card .btn-edit-profile {
    background: linear-gradient(90deg, #785eaa 0%, #6125cd 50%);
    color: #fff !important;
    padding: 6px 20px;
    border-radius: 8px;
    font-size: 13px;
}

.user-profile-card .btn-edit-profile:hover {
    background: linear-gradient(90deg, #654999 0%, #4613a3 50%);
    box-shadow: 0 4px 8px rgba(74, 144, 226, 0.3);
}

.user-profile-card .profile-details-table {
    display: flex;
    flex-direction: column;
}

.user-profile-card .profile-row {
    display: flex;
    border-bottom: 1px solid #f0f0f0;
    padding: 15px 0;
}

.user-profile-card .profile-col {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.user-profile-card .profile-col .label {
    color: #999;
    font-size: 14px;
    font-weight: bold;
}

.user-profile-card .profile-col .value {
    color: #444;
    font-size: 15px;
}

/* Start Edite Profile  */
.edit-profile-container {
    background: #fff;
    border-radius: 15px;
    padding: 30px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.03);
}

.edit-profile-container .alert-info-custom {
    background-color: #fbc02d;
    /* زرد تصویر */
    color: #fff;
    padding: 8px 15px;
    border-radius: 5px;
    font-size: 13px;
}

.edit-profile-container .alert-info-custom a {
    color: #2196f3;
    text-decoration: none;
    font-weight: bold;
}

.edit-profile-container .form-group-custom {
    display: flex;
    flex-direction: column;
    margin-bottom: 30px;
}

.edit-profile-container .form-group-custom label {
    font-size: 14px;
    color: #777;
    margin-bottom: 10px;
}

.edit-profile-container .form-group-custom .form-control,
.edit-profile-container .form-group-custom .form-select {
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 10px;
    font-size: 14px;
    transition: 0.3s;
}

.edit-profile-container .form-group-custom .form-control:focus {
    border-color: #6022cf;
    box-shadow: 0 0 0 0.2rem rgba(96, 34, 207, 0.1);
}

.edit-profile-container .form-control:disabled {
    background-color: #f8f9fa;
    cursor: not-allowed;
}

.edit-profile-container .btn-submit-changes {
    background: linear-gradient(90deg, #785eaa 0%, #6125cd 50%);
    color: white;
    border: none;
    padding: 10px 30px;
    border-radius: 8px;
    font-size: 14px;
    cursor: pointer;
    transition: 0.3s;
}

.edit-profile-container .btn-submit-changes:hover {
    box-shadow: 0 4px 12px rgba(92, 124, 250, 0.4);
}

/* Start Children Page  */
.children-page {
    background: #fff;
    border-radius: 16px;
    padding: 24px;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.04);
}

.children-page .children-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    flex-wrap: wrap;
    gap: 12px;
}

.children-page .child-name {
    font-size: 16px;
    color: #6022cf;
}

.children-page .btn-add-child {
    background: #6022cf;
    color: #fff;
    border: none;
    border-radius: 10px;
    padding: 10px 18px;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    transition: 0.3s;
}

.children-page .btn-add-child:hover {
    background: #4f1fb0;
}

.children-page .children-list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 16px;
}

.children-page .child-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 16px;
    padding: 16px 18px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.03);
    gap: 20px;
    width: 49%;
}

.children-page .child-card-right {
    flex: 0 0 70px;
}

.children-page .child-card-right {
    width: 90px;
    height: auto;
}

.children-page .child-card-right img {
    width: 100%;
    height: auto;
}

.children-page .child-card-center {
    flex: 1;
}

.children-page .child-card-center p {
    margin: 4px 0;
    color: #666;
    font-size: 14px;
}

.children-page .child-card-center p span {
    font-weight: 700;
    color: #444;
}

.children-page .child-card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.children-page .child-card-actions button.btn-change-panel,
.children-page .child-card-actions button.btn-edit-child,
.children-page .child-card-actions button.btn-delete-child {
    border: none;
    border-radius: 8px;
    padding: 8px 14px;
    font-size: 13px;
    cursor: pointer;
    transition: 0.3s;
    white-space: nowrap;
}

.children-page .btn-change-panel {
    background: #f7f2ff;
    color: #6022cf;
}

.children-page .btn-change-panel:hover {
    background: #e8ddff;
}

.children-page .btn-edit-child {
    background: #5c7cfa;
    color: #fff;
}

.children-page .btn-edit-child:hover {
    background: #4263eb;
}

.children-page .btn-delete-child {
    background: #ffebee;
    color: #e53935 !important;
}

.children-page .btn-delete-child:hover {
    background: #ffd7da;
}

.children-page .add-topic-box .form-group .data-box {
    top: 6px;
    left: 25px;
    font-size: 25px;
}

.channels-page {
    background: #fff;
    border-radius: 16px;
    padding: 24px;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.04);
}

.channels-page .list-sevice-userpanel .channel-item-info {
    background: #e8e7ff;
    height: 3rem;
    border-radius: 10px;
    color: #7037d1;
}

.content-body-userpanel .channels-page .item-sevice-userpanel {
    gap: 0;
    border: #e8e7ff 1px solid;
    width: 28.5rem;
}

.single-channel-page {
    background: #fff;
    border-radius: 16px;
    padding: 24px;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.04);
}

.video-detail-container {
    background: #fff;
    border-radius: 15px;
}

/* نوار اطلاعات بالا */
.video-detail-container .video-info-bar {
    background: #e0f7fa;
    /* آبی بسیار روشن مشابه تصویر */
    display: flex;
    justify-content: space-around;
    padding: 10px;
    border-radius: 10px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.video-detail-container .info-item {
    font-size: 13px;
    color: #555;
    display: flex;
    align-items: center;
    gap: 5px;
}

.video-detail-container .info-item i {
    color: #26a69a;
    /* رنگ تیک‌ها */
}

/* عنوان */
.video-detail-container .video-title-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #666;
    margin-bottom: 15px;
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
}

.video-detail-container .video-title-wrap h4 {
    margin: 0;
    font-size: 18px;
}

/* باکس ویدیو */
.video-detail-container .video-player-box {
    background: #000;
    width: 100%;
    aspect-ratio: 16 / 9;
    max-width: 800px;
    margin: 0 auto 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-radius: 8px;
}

.video-detail-container .player-placeholder p {
    color: #ccc;
    padding: 0 40px;
    font-size: 14px;
    line-height: 1.8;
}

/* انتخاب سرور */
.video-detail-container .server-selection-wrapper {
    border: 1px solid #eee;
    border-radius: 12px;
    overflow: hidden;
}

.video-detail-container .server-header {
    background: #f9f9f9;
    padding: 10px;
    text-align: center;
    font-weight: bold;
    color: #444;
    border-bottom: 1px solid #eee;
}

.video-detail-container .server-card {
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    padding: 15px;
    text-align: center;
    transition: 0.3s;
}

.video-detail-container .server-card.active {
    border-color: #4caf50;
    /* کادر سبز دور گزینه فعال */
}

.video-detail-container .btn-server {
    width: 100%;
    border: none;
    padding: 12px;
    border-radius: 8px;
    color: #fff;
    font-weight: bold;
    font-size: 16px;
    margin-bottom: 10px;
}

.video-detail-container .btn-blue {
    background-color: #81d4fa;
    transition: all;
}

.video-detail-container .btn-yellow {
    background-color: #ffca28;
    transition: all;
}

.video-detail-container .btn-green {
    background-color: #4caf50;
    transition: all;
}

.video-detail-container .btn-blue:hover {
    background-color: #4ac3fc;
}

.video-detail-container .btn-yellow:hover {
    background-color: #ffc209;
}

.video-detail-container .btn-green:hover {
    background-color: #33a737;
}

.video-detail-container .server-status {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    font-size: 12px;
}

.video-detail-container .badge-status {
    background: #f1f8e9;
    color: #2e7d32;
    padding: 2px 8px;
    border-radius: 4px;
}

.video-detail-container .details-link {
    color: #999;
    text-decoration: none;
}

/* modal report */
.btn-report {
    background-color: #f5f7f8;
    color: tomato;
    padding: 10px 40px;
    border: brown dotted thin;
    border-radius: 5px;
    font-size: 16px;
    transition: background-color 0.3s ease;
    margin: 10px auto 0 auto;
}

.btn-report:focus,
.btn-report:checked,
.btn-report:hover {
    color: #fff;
    background-color: tomato !important;
    border-color: tomato;
}

.bug-report-modal {
    direction: rtl;
    font-family: inherit;
}

.brm-header {
    position: relative;
    text-align: center;
    padding: 6px 0 14px;
    border-bottom: 1px solid #eee;
    margin-bottom: 14px;
}

.brm-title {
    margin: 0;
    font-size: 22px;
    color: #333;
}

.brm-close:hover {
    color: #666;
}

.brm-video-info {
    background: #eaf7fb;
    border-radius: 6px;
    padding: 12px 14px;
    margin: 0 0 12px 0;
}

.brm-info-row {
    display: flex;
    gap: 8px;
    justify-content: flex-start;
    align-items: baseline;
    margin: 6px 0;
    color: #444;
    font-size: 14px;
}

.brm-info-label {
    font-weight: 700;
    color: #4a4a4a;
    white-space: nowrap;
}

.brm-info-value {
    color: #555;
}

.brm-alert {
    background: #f4c21b;
    color: #fff;
    border-radius: 4px;
    padding: 10px 12px;
    font-size: 13px;
    text-align: center;
    margin-bottom: 14px;
}

.brm-desc {
    margin: 0 0 14px 0;
    color: #777;
    font-size: 13px;
    line-height: 2;
    text-align: center;
}

.brm-form {
    margin-top: 6px;
}

.brm-field {
    margin-bottom: 14px;
}

.brm-label {
    display: block;
    margin-bottom: 8px;
    color: #666;
    font-size: 13px;
}

.brm-control {
    width: 100%;
    border: 1px solid #ddd;
    border-radius: 6px;
    padding: 10px 12px;
    font-size: 14px;
    outline: none;
    background: #fff;
    transition: 0.2s ease;
}

.brm-control:focus {
    border-color: #6022cf;
    box-shadow: 0 0 0 0.2rem rgba(96, 34, 207, 0.10);
}

.brm-textarea {
    resize: vertical;
    min-height: 140px;
}

.brm-actions {
    display: flex;
    justify-content: center;
    padding-top: 10px;
    border-top: 1px solid #eee;
    margin-top: 10px;
}

.brm-submit {
    background: #82c7e6;
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 10px 26px;
    font-size: 15px;
    cursor: pointer;
    transition: 0.2s ease;
}

.brm-submit:hover {
    background: #6bb8dc;
}

/* next programmer */
.np-minimal-card {
    direction: rtl;
    background: #ffffff;
    border: 1px solid #eeeef5;
    border-right: 4px solid #6022cf;
    border-radius: 12px;
    padding: 12px 20px;
    margin-top: 15px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
    transition: transform 0.2s;
}

.np-minimal-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(96, 34, 207, 0.08);
}

.np-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px dashed #f0f0f5;
}

.np-title-box {
    display: flex;
    align-items: center;
    gap: 8px;
}

.np-text-title {
    font-weight: 800;
    font-size: 16px;
    color: #444;
    color: #6022cf;
}

.np-icon-pulse {
    color: #6022cf;
    font-size: 18px;
    display: flex;
}

.np-status-tag {
    background: #f7f2ff;
    color: #6022cf;
    font-size: 13px;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 20px;
}

.np-body-row {
    display: flex;
    flex-wrap: wrap;
    gap: 25px;
    align-items: center;
}

.np-info-group {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.main-info {
    flex: 1;
    min-width: 200px;
}

.np-tag {
    font-size: 12px;
    color: #999;
    font-weight: 500;
}

.np-content-text {
    font-size: 15px;
    color: #333;
    font-weight: 600;
}

.np-content-text.mono {
    letter-spacing: 0.5px;
    color: #6022cf;
}

/* Start  Description Section */
.single-channel-page .description-section {
    direction: rtl;
    background: #ffffff;
    border-radius: 12px;
    padding: 20px;
    margin-top: 20px;
    border: 1px solid #f0f0f5;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02);
}

.desc-header {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 15px;
}

.desc-title {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #6022cf;
    font-weight: 800;
    font-size: 16px;
    white-space: nowrap;
}

.desc-title i {
    font-size: 18px;
}

.desc-line {
    height: 2px;
    background: linear-gradient(to left, #6022cf, #f7f2ff);
    flex-grow: 1;
    border-radius: 2px;
    opacity: 0.3;
}

.desc-content p {
    color: #555;
    line-height: 1.8;
    font-size: 14.5px;
    margin: 0;
    text-align: justify;
}

.tvs-button2 {
    background: #3aafa6;
    color: #FFFFFF;
    border: none;
    line-height: 32px;
    margin: auto;
    padding: 5px 20px 5px;
    border-radius: 45px;
    font-size: 16px;
}

.menu-toggle {
    width: 40px;
    height: 40px;
    border: none;
    background: #b40440;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
}

.menu-toggle span {
    width: 22px;
    height: 2px;
    background: #fff;
    display: block;
}

/* overlay */

.menu-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    opacity: 0;
    visibility: hidden;
    transition: .3s;
    z-index: 998;
}

.menu-overlay.active {
    opacity: 1;
    visibility: visible;
}

.sidebar-header {
    display: none;
}

/* استایل ضربدر */
.menu-close {
    width: 35px;
    height: 35px;
    border: none;
    background: #f1f1f1;
    border-radius: 8px;
    font-size: 22px;
    line-height: 35px;
    cursor: pointer;
}

/* mobile user panel  */
@media (max-width:1199px) {
    .hide-mob {
        display: none !important;
    }

    .header-userpanel {
        height: 6rem;
        align-items: end;
        margin-bottom: 20px;
    }

    .welcome-text {
        margin-top: 10px !important;
    }

    .side-bar-menu {
        position: fixed;
        right: -320px;
        top: 0;
        width: 280px;
        height: 100vh;
        z-index: 999;
        transition: .35s;
        overflow-y: auto;
    }

    .side-bar-menu.active {
        right: 0;
    }

    .page-userpanel .col-xl-2 {
        position: static;
        width: 0;
        padding: 0;
    }

    .page-userpanel .col-xl-10 {
        width: 100%;
    }

    .sidebar-header {
        display: flex;
        justify-content: flex-end;
        margin-bottom: 15px;
    }

    .menu-close:hover {
        background: #e0175b;
        color: #fff;
    }

    .header-userpanel .name-user {
        font-size: 12px;
        padding: 10px 20px;
    }

    .list-sevice-userpanel {
        flex-wrap: wrap;
        display: flex !important;
    }

    .content-body-userpanel .channels-page .item-sevice-userpanel {
        width: 47%;
        padding: 5px;
    }

    .content-body-userpanel .item-sevice-userpanel .image-box {
        height: 14rem;
        padding: 20px;
    }

    .channels-page .list-sevice-userpanel .channel-item-info div,
    .channels-page .list-sevice-userpanel .channel-item-info span,
    .content-body-userpanel .item-sevice-userpanel .name-service {
        font-size: 11px !important;
    }

    .channels-page .list-sevice-userpanel .channel-item-info {
        flex-direction: column;
        height: 5rem;
        justify-content: space-around !important;
    }

    .children-page .child-card {
        flex-direction: column;
        width: 100%;
    }

}

@media (min-width:1199px) and (max-width:1550px) {
    .list-sevice-userpanel {
        flex-wrap: wrap;
        display: flex !important;
    }

    .content-body-userpanel .channels-page .item-sevice-userpanel {
        width: 47%;
        padding: 5px;
    }
}

@media (min-width: 1550px) and (max-width:1850px) {
    .list-sevice-userpanel {
        flex-wrap: wrap;
        display: flex !important;
    }

    .content-body-userpanel .channels-page .item-sevice-userpanel {
        width: 32%;
        padding: 5px;
    }
}


/* mobile web pages  */
@media (max-width:991px) {
    .hide-mob {
        display: none !important;
    }

    .hide-des {
        display: block !important;
    }

    header .image-box {
        width: 13rem;
        height: 3rem;
    }

    header {
        width: 100%;
        height: 11rem;
        background-color: #f7f7f7;
        position: relative;
        z-index: 2;
    }

    .header-top {
        transform: inherit;
    }

    .search-box {
        position: absolute;
        left: 10px;
        top: 58px;
        width: calc(100% - 15px);
    }

    .search-box .search-bar #searchbox {
        height: 3rem;
        width: 100%;
    }

    .header-bottom {
        height: 4.5rem;
        /* background: linear-gradient(90deg, #171224 0%, #6736c5 50%, #171224 100%); */
        border-radius: 10px;
        /* color: #fff; */
        /* padding: 10px; */
        transform: translateY(40px);
    }

    header.other-page-header {
        margin-bottom: 30px;
        border-bottom: inherit;
    }

    .page-articlelist .article-item,
    .article-list .owl-item.center .article-item {
        z-index: inherit;
    }

    .page-articlelist .article-item {
        width: 48% !important;
    }

    .article-item .image-article {
        height: auto;
    }

    .article-item .content-box p {
        min-height: 90px;
    }

    .article-item .content-box {
        padding-bottom: 0 !important;
    }

    .article-item .content-box>div {
        flex-direction: column !important;
    }

    .article-item .content-box>div .see-btn {
        margin-top: 5px;
        width: 100%;
    }

    .category-box .title-category {
        font-size: 18px;
    }

    .category-box .category-list .category-item .img-box .img-category {
        width: 8rem;
        height: 8rem;
    }

    .category-box .category-list .category-item .name-category {
        font-size: 13px;
    }

    .category-section {
        padding: 30px 0;
    }

    .category-section-bg {
        margin: 20px 0;
    }

    .item-slider-product .image-box {
        height: auto;
        max-height: inherit;
    }



    .price-and-buy {
        flex-direction: column-reverse;

    }

    .price-and-buy .buy-btn-box,
    .price-and-buy .price-box {
        width: 100% !important;
    }

    .price-and-buy .price-box {
        flex-direction: row !important;
        align-items: center !important;
    }

    .price-and-buy .price-box .payable-price {
        margin-right: 3px;
    }

    .item-slider-product .buy-btn-box {
        height: 4rem;
    }

    .slider-product-section .title-box {
        padding-top: 0rem !important;
    }

    .slider-product-section .title {
        font-size: 20px !important;
        color: #5a6068;
    }

    .slider-product-section {
        padding: 20px 0 20px 0;
    }

    .our-services-section {
        padding: 20px 0;
    }

    .our-services-list {
        padding: 2rem 3rem 0 3rem;
    }

    .title-services a {
        font-size: 14px !important;
    }

    .owl-theme .owl-nav.disabled+.owl-dots {
        margin-top: 10px;
        z-index: 999;
        position: relative;
    }

    .our-services-list::before {
        bottom: -10px;
    }

    .comments-section {
        padding: 20px 0;
    }

    .comments-section .comments-item {
        margin-bottom: 10px;
    }

    .subtitle-article p {
        width: 100% !important;
    }

    .nav-bar-footer>div>p {
        font-size: 16px !important;
    }

    .nav-bar-footer>div>div>p {
        font-size: 11px;
    }

    footer .nav-bar-footer {
        height: 12rem;
        transform: translateY(-60px);
    }

    footer {
        margin-top: 60px;
    }

    .nav-bar-footer-box {
        height: 9rem;
    }

    .footer-item-left,
    .footer-item-right,
    .col-xl-3,
    .col-xl-4 {
        margin-bottom: 15px !important;
    }

    .symbol-box .symbol-item {
        width: 11rem;
        height: 11rem;
    }

    .back-to-top {
        font-size: 12px;
    }

    .footer-item-left ul li span {
        font-size: 13px !important;
    }

    /* ----------#ads-2(min-width: 768px)and (max-width:991px) ------- */
    .ads {
        padding-top: 15px !important;
        padding-bottom: 15px !important;
    }

    .ads.ads-2 .ads-2-box,
    .ads.ads-5 .ads-5-box {
        flex-wrap: wrap;
    }

    .ads.ads-2 .ads-2-box .item:nth-child(1),
    .ads.ads-5 .ads-5-box .item:nth-child(1) {
        width: 100%;
        margin-left: 0;
    }

    .ads.ads-2 .ads-2-box .item:nth-child(2),
    .ads.ads-5 .ads-5-box .item:nth-child(2) {
        width: 100%;
        margin-top: 15px;
    }

    /*#filters*/
    .sortbar-mob {
        width: 100%;
        height: 4rem;
        background-color: #6423cb;
        color: #fff;
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 999;
        box-shadow: rgb(50 50 93 / 25%) 0px -6px 27px -5px, rgb(0 0 0 / 30%) 16px 0px 0px 0px;
    }

    .sortbar-mob .sortbar-mob-box {
        border-right: 1px solid #fff;
        width: calc(100% - 25%);
    }

    .page-sortbar-items li {
        font-size: 15px;
        height: 4rem;
        border-bottom: 1px solid #cfb7ef !important;
        width: 90%;
        align-items: center;
        display: flex;
        justify-content: center;
        margin: 0 auto 5px auto;
    }

    .page-sortbar-items li:last-child {
        border-bottom: none !important;
    }

    /* ----------------------#filters----------------------- */
    .Filters {
        display: none;
        position: fixed;
        top: 0;
        right: 0;
        background-color: #ececec;
        width: 100%;
        height: 100vh;
        margin-top: 0;
        overflow-y: scroll;
        z-index: 1099999;
        border-radius: 0;
        padding-top: 6rem;
        padding-bottom: 6rem;
    }

    .listFilterClose-sort {
        position: absolute !important;
        top: 15px !important;
    }

    .listFilterClose-sort,
    .listFilterClose {
        display: inline-block;
        width: 2.5rem;
        height: 2.5rem;
        line-height: 2.5rem;
        font-size: 2rem;
        border-radius: 50%;
        left: 1.5rem;
        top: 1.5rem;
        background-color: crimson;
        color: #fff;
        border: none;
        box-shadow: none;
        position: fixed;
        z-index: 9999999;
    }

    .listFilterRemove {
        display: inline-block;
        width: auto;
        height: 2.5rem;
        line-height: 2rem;
        font-size: 1.2rem;
        border-radius: 1rem;
        padding: 0 1rem;
        position: absolute;
        right: 1.5rem;
        top: 1.5rem;
        background-color: #f5f5f5;
        color: crimson;
        border: none;
        box-shadow: none;
    }

    .ordering {
        width: 100%;
        height: 41rem;
        position: fixed;
        box-shadow: rgb(50 50 93 / 25%) 0px -6px 27px -5px, rgb(0 0 0 / 30%) 16px 0px 0px 0px;
        bottom: 4rem;
        right: 0;
        display: none;
        z-index: 999999;
    }

    .ordering::after {
        content: '';
        width: 100%;
        height: calc(100% - 41rem);
        background-color: #00000040;
        z-index: -1;
        position: fixed;
        top: -40px;
        right: 0;
    }

    .page-breadcrumb nav {
        overflow-x: auto;
        overflow-y: unset;
    }

    ol.breadcrumb {
        width: max-content;
    }

    .page-breadcrumb ::-webkit-scrollbar-thumb {
        display: none;
        background-color: transparent;
    }



    .description-box img,
    .blog-content img {
        width: 100% !important;
        height: auto !important;
    }

    .description-box h2,
    .blog-content h2 {
        font-size: 1.8rem;
        line-height: 30px;
    }

    .description-box h3,
    .blog-content h3 {
        font-size: 1.6rem;
        line-height: 28px;
    }

    .description-box h4,
    .blog-content h4 {
        font-size: 1.4rem;
        line-height: 26px;
    }

    .description-box p,
    .blog-content p {
        font-size: 1.4rem;
    }

    .page-articlelist .article-item {
        width: 48%;
    }

    .page-articlelist {
        margin-top: 0 !important;
    }

    .blog .single-blog-page .header-box {
        height: auto;
        padding: 15px 10px 45px 10px !important;
    }

    .blog .single-blog-page {
        padding: 1rem !important;
    }

    .blog .single-blog-page .header-box .name-blog-fa {
        font-size: 20px !important;
        line-height: 30px;
    }

    .blog .single-blog-page .article-abstract-box {
        flex-direction: column;
    }

    .blog .single-blog-page .article-abstract-box .image-blog {
        width: 100%;
        height: auto;
        max-height: inherit;
    }

    .blog .single-blog-page .article-abstract-box .article-abstract-text {
        width: 100%;
        padding: 15px 0 0 0 !important;
    }

    .content-body-userpanel .item-sevice-userpanel {
        width: 100%;
    }

    .contactus-page .form-contant-box {
        margin-left: 0 !important;
    }

    .page-productlist .item-slider-product {
        width: 48% !important;
    }

    .page-productlist .item-slider-product .image-box {
        height: auto;
    }

    .price-and-buy {
        flex-direction: column-reverse;
        height: 10rem;
    }

    .user-submitted-topic-box {
        flex-direction: column;
    }

    .user-thread-box,
    .accont-user-box,
    .pull-right.user-part {
        width: 100% !important;
    }

    .user-thread-box {
        margin-top: 15px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {



    /*#filters*/
    .sortbar-mob {
        width: 100%;
        height: 4rem;
        background-color: #112a53;
        color: #fff;
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 999;
        box-shadow: rgb(50 50 93 / 25%) 0px -6px 27px -5px, rgb(0 0 0 / 30%) 16px 0px 0px 0px;
    }

    .sortbar-mob .sortbar-mob-box {
        border-right: 1px solid #fff;
        width: calc(100% - 25%);
    }

    .page-articlelist .article-item {
        width: 24%;
    }

    .blog .single-blog-page .header-box {
        height: auto;
        padding: 15px 10px 45px 10px !important;
    }

    .page-breadcrumb nav {
        overflow-x: auto;
        overflow-y: unset;
    }

    ol.breadcrumb {
        width: max-content;
    }

    .page-breadcrumb ::-webkit-scrollbar-thumb {
        display: none;
        background-color: transparent;
    }

}

@media (min-width: 991px) and (max-width: 1200px) {
    .page-productlist .item-slider-product {
        max-height: inherit;
        height: auto;
        width: 32%;
    }

    .page-productlist .item-slider-product .image-box {
        height: 23rem;
    }

    .item-slider-product .image-box {
        height: auto;
        max-height: inherit;
    }



    .price-and-buy {
        flex-direction: column-reverse;

    }

    .price-and-buy .buy-btn-box,
    .price-and-buy .price-box {
        width: 100% !important;
    }

    .price-and-buy .price-box {
        flex-direction: row !important;
        align-items: center !important;
    }

    .price-and-buy .price-box .payable-price {
        margin-right: 3px;
    }

    .item-slider-product .buy-btn-box {
        height: 4rem;
    }
}

@media (min-width: 1200px) and (max-width: 1550px) {
    .page-productlist .item-slider-product {
        max-height: inherit;
        height: auto;
        width: 32%;
    }

    .page-productlist .item-slider-product .image-box {
        height: 23rem;
    }

    .item-slider-product .image-box {
        height: auto;
        max-height: inherit;
    }



    .price-and-buy {
        flex-direction: column-reverse;

    }

    .price-and-buy .buy-btn-box,
    .price-and-buy .price-box {
        width: 100% !important;
    }

    .price-and-buy .price-box {
        flex-direction: row !important;
        align-items: center !important;
    }

    .price-and-buy .price-box .payable-price {
        margin-right: 3px;
    }

    .item-slider-product .buy-btn-box {
        height: 4rem;
    }
}