
@font-face { font-family: 'IRANYekan'; src: url('../fonts/IRANYekanWebThin.woff') format('woff');
    font-weight: 100; font-style: normal; }
@font-face { font-family: 'IRANYekan'; src: url('../fonts/IRANYekanWebLight.woff') format('woff');
    font-weight: 300; font-style: normal; }
@font-face { font-family: 'IRANYekan'; src: url('../fonts/IRANYekanWebRegular.woff') format('woff');
    font-weight: 400; font-style: normal; }
@font-face { font-family: 'IRANYekan'; src: url('../fonts/IRANYekanWebMedium.woff') format('woff');
    font-weight: 500; font-style: normal; }
@font-face { font-family: 'IRANYekan'; src: url('../fonts/IRANYekanWebBold.woff') format('woff');
    font-weight: 700; font-style: normal; }
@font-face { font-family: 'IRANYekan'; src: url('../fonts/IRANYekanWebExtraBold.woff') format('woff');
    font-weight: 800; font-style: normal; }
@font-face { font-family: 'IRANYekan'; src: url('../fonts/IRANYekanWebBlack.woff') format('woff');
    font-weight: 900; font-style: normal; }


@font-face { font-family: 'IRANSans'; src: url('../fonts/IRANSansWeb_Ultralight.woff') format('woff');
    font-weight: 100; font-style: normal; }
@font-face { font-family: 'IRANSans'; src: url('../fonts/IRANSansWeb_Light.woff') format('woff');
    font-weight: 300; font-style: normal; }
@font-face { font-family: 'IRANSans'; src: url('../fonts/IRANSansWeb.woff') format('woff');
    font-weight: 400; font-style: normal; }
@font-face { font-family: 'IRANSans'; src: url('../fonts/IRANSansWeb_Medium.woff') format('woff');
    font-weight: 500; font-style: normal; }
@font-face { font-family: 'IRANSans'; src: url('../fonts/IRANSansWeb_Bold.woff') format('woff');
    font-weight: 700; font-style: normal; }
@font-face { font-family: 'IRANSans'; src: url('../fonts/IRANSansWeb_Black.woff') format('woff');
    font-weight: 900; font-style: normal; }

body, li, input, button, label {
    font-family: 'IRANYekan', Tahoma, sans-serif;
    font-weight: 500; /* پیش‌فرض */
}

nav ul li a, .cart-btn a, button, .add-to-cart {
    font-family: 'IRANYekan', Tahoma, sans-serif;
    font-weight: 700; /* Bold */
}


h1, h2, h3 , h4,p{
    font-family: 'IRANSans', Tahoma, sans-serif;
    font-weight: 500; /* Black */
}


/* اعمال به کل سایت */
body {
    font-family: 'IRANYekan', Tahoma, sans-serif;
}
/* ورود و ثبت نام*/
.login-page {
    font-family: 'Tahoma', sans-serif;
    direction: rtl;
    background-color: #fff8e1;
    padding: 20px;
}
.login-form{
    padding-right: 40px;
}

.login-container {
    background-color: #fffdf5;
    padding: 35px;
    margin: 25px auto;
    width: 350px;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(212, 160, 23, 0.3);
    border: 1px solid #f2c94c;
}

.tab-buttons {
    display: flex;
    justify-content: space-between;
    margin-bottom: 19px;

}

.tab-buttons button {
    flex: 1;
    padding: 10px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-weight: bold;
    background-color: #f2c94c;
    margin: 0 5px;
    color: #333;
}

.tab-buttons button.active {
    background-color: #d4a017;
    color: white;
}

form {
    display: none;
}

form.active {
    display: block;
}

label {
    display: block;
    margin-top: 10px;
    color: #333;
    font-weight: bold;

}

input {
    width: 95%;
    padding: 8px;
    margin-top: 20px;
    border: 1px solid #ccc;
    border-radius: 5px;
}

button.submit-btn {
    margin-top: 15px;

    width: 100%;
    padding: 10px;
    background-color: #d4a017;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-weight: bold;
}

button.submit-btn:hover {
    background-color: #b88c0f;
}
/*  برای صفحه index*/

body {
    font-family: 'Tahoma', sans-serif;
    direction: rtl;
    margin: 0;
    padding: 0;
    background-color: #fff8e1;
}


.container {
    max-width: 1200px;
    margin: 0 auto;
    background-color: #fffdf5;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    padding: 9px 15px;
}

/* 🎯 هدر جدید با نوار جستجو کنار لوگو */
header {
    background-color: white;
    padding: 15px 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 0px solid #f2c94c;
}

.header-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

header h1 {
    font-size: 28px;
    color: #333;
    margin: 0;
    font-family: 'IRANSans', Tahoma, sans-serif;
    text-align: center;
    left: 50%;
}

.search-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: flex-start;
    transform: translateX(11%);
}


.search-bar input {
    padding: 8px;
    width: 220px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-family: 'IRANYekan', sans-serif;

}


.search-bar button {
    padding: 10px 16px;
    margin-top: 14px;
    background-color: #d4a017;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.3s ease;
    font-family: 'IRANYekan', sans-serif;
    font-weight: bold;
}

.search-bar button:hover {
    background-color: #b88c0f;
}

/* 🔹 حذف فاصله بین هدر و اسلایدر */
.slider {
    margin-top: 0;
}


nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #f2c94c;
    padding: 10px 20px;
    border-radius: 10px;
}

nav ul {
    list-style: none;
    display: flex;
    justify-content: flex-start;
    margin: 0;
    padding: 0;
}

nav ul li {
    margin: 0 15px;
}

nav ul li a {
    text-decoration: none;
    color: white;
    font-weight: bold;

}
.nav a{
    color: white;
}

nav ul li a:hover {
    color: white;
}

/* ===== منوی کشویی در ناوبری ===== */
.dropdown {
    position: relative;
}

.dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    background-color: #fffdf5;
    border: 2px solid #f2c94c;
    border-radius: 15px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    padding: 8px 0;
    z-index: 999;
    min-width: 180px;
}

.dropdown-menu li a {
    display: block;
    padding: 8px 15px;
    border-radius: 15px;
    color: #333;
    text-decoration: none;
    font-weight: normal;
    font-size: 15px;
    transition: background-color 0.3s, color 0.3s;
}

.dropdown-menu li a:hover {
    background-color: #d4a017;
    color: white;
}

.dropdown:hover .dropdown-menu {
    display: block;
}

.dropdown > a::after {
    content: " ▼";
    font-size: 12px;
    color: #d4a017;
}



.cart-btn {
    margin-right: auto;
    margin-left: 10px;
}

/* دکمه طلایی سبد خرید */
.cart-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background-color: #d4a017; /* رنگ طلایی متمایز از هدر */
    color: white;
    padding: 8px 16px;
    border-radius: 30px;

    text-decoration: none;
   transition: all 0.3s ease;

}
.cart-button{
    font-family: IRANSans;
}
.cart-button span{
    color: white;
}

/* آیکن داخل دکمه */
.cart-button img {
    width: 22px;
    height: 22px;
    object-fit: contain;
    transition: transform 0.3s ease;
}

/* ✨ افکت هاور (زمانی که موس روی دکمه میره) */
.cart-button:hover {
    background-color: #b88c0f; /* رنگ تیره‌تر در حالت هاور */
    transform: scale(1.05);
    box-shadow: 0 5px 12px rgba(1, 0, 0, 0.3);
}

/* حرکت ملایم آیکن هنگام هاور */
.cart-button:hover img {
    transform: rotate(-10deg) scale(1.1);
}
/* 📦 دکمه‌های سمت چپ (ورود و سبد خرید) */
.nav-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* 🎫 دکمه ورود و ثبت‌نام */
.login-btn {

    display: inline-flex;
    align-items: center;
    gap: 8px;
    background-color: #d4a017; /* رنگ طلایی متمایز از هدر */
    color: white;
    padding: 8px 16px;
    border-radius: 30px;

    text-decoration: none;
    transition: all 0.3s ease;
}
.login-btn{
    font-family: IRANSans;
}



.login-btn:hover {
    background-color: #b88c0f;
    transform: scale(1.05);
    box-shadow: 0 5px 12px rgba(1,0,0,0.3);
    color: white;

}

/* 🛒 کوچکتر کردن سبد خرید */
.cart-button {
    padding: 6px 12px;        /* کوچکتر از قبل */
    border-radius: 25px;
    font-size: 13px;
    gap: 6px;
}
.login-btn{
    font-size: 13px;
}

.cart-button img {
    width: 18px;
    height: 18px;
}





.slider {
    position: relative;
    width: 100%;
    height: 400px;
    margin: 30px 0;
    overflow: hidden;
    border-radius: 10px;
    box-shadow: 0 3px 8px rgba(0,0,0,0.2);
}

.slides img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 10px;
    transition: transform 0.4s ease, filter 0.4s ease;
    padding-bottom: 35px;
    margin-bottom: 35px;
}

.slides img:hover {
    transform: scale(1.03);
    filter: brightness(90%);
}

/* ===== دکمه اسلایدر ===== */
.slider-btn {
    font-family: IRANYekan;
    position: absolute;
    bottom: 30px;
    right: 450px;
    background-color: #d4a017;
    color: white;
    padding: 15px 24px;
    border-radius: 8px;
    font-weight: bold;
    text-decoration: none;
    font-size: 16px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.3);
    transition: background-color 0.3s ease, transform 0.3s ease;
}

.slider-btn:hover {
    background-color: #b88c0f;
    transform: scale(1.05);
}

.products {
    padding: 30px;


}

.products h2 {
    text-align: center;
    color: black;
    font-size: 34px;
    font_weight: 900px;
}

.product-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
    margin-top: 20px;
}

.product-card {
    border: 1px solid #f2c94c;
    border-radius: 8px;
    padding: 60px;
    width: 170px;
    text-align: center;
    background-color: #fffdf5;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);

}
.product-card{
    font-family: IRANSans;
}
.product-card:hover{
    transform: translateY(-5px); /* کمی بالا رفتن باکس */
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.35); /* سایه بزرگتر و پررنگ‌تر */
}
.product-card img {
    width: 100%;
    height: auto;
    border-radius: 15px;

}
.product-card span{
    font-family: IRANYekan;

}

.product-card img:hover {

    box-shadow: 0 6px 15px rgba(0,0,0,0.3);
}

.price-box {
    margin-top: 8px;
    border-radius: 15px;

}

.old-price {
    text-decoration: line-through;
    color: #888;
    font-size: 13px;
}

.new-price {
    color: #d4a017;
    font-weight: bold;
    font-size: 18px;
}

.add-to-cart {
    margin-top: 10px;
    padding: 8px 10px;
    background-color: #d4a017;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-weight: bold;
    width: 100%;
    transition: background-color 0.3s;
}

.add-to-cart:hover {
    background-color: #b88c0f;
}

.banners img {
    width: 100%;
    margin-top: 30px;
    border-radius: 8px;
    transition: transform 0.3s ease, filter 0.3s ease;
}

.banners img:hover {
    transform: scale(1.02);
    filter: brightness(95%);
}

.footer {
    background-color: #f9f9f9;
    color: #333;
    padding: 50px 25px 20px;
    border-top: 1px solid #ddd;
    font-family: 'Tahoma', sans-serif;


    /* اضافه شده برای هم‌اندازه شدن با سایت */
    max-width: 1200px;
    margin: 0 auto;
    box-shadow: 0 0 10px rgba(0,0,0,0.05);
    border-radius: 10px 10px 0 0;
}
.footer-col ul img{
    border-radius: 15px;
    padding-top: 12px;

}
.footer-bottom p{
    font-family: IRANSans;
}

.footer-container {
    display: flex;
    flex-wrap: wrap;
    font-family: 'IRANSans', Tahoma, sans-serif;
    justify-content: space-between;
    align-items: flex-start;
    max-width: 1200px;
    margin: 0 auto;
    gap: 40px;

}

.footer-logo {
    flex: 1 1 300px;
    text-align: center;
}

.footer-logo h2 {
    font-size: 28px;
    color: #5a2d0c;
    letter-spacing: 2px;
}

.footer-logo p {
    margin: 10px 0 20px;
    font-size: 14px;
    color: #666;
}

.newsletter {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.newsletter input {
    padding: 8px 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    width: 200px;
}

.newsletter button {
    background-color: #d4a017;
    color: white;
    border: none;
    padding: 8px 16px;
    margin-top: 6px;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s;
}

.newsletter button:hover {
    background-color: #b88c0f;
}

/* 🔹 ستون‌ها */
.footer-columns {
    flex: 2 1 600px;
    display: flex;
    justify-content: space-around;
    align-items: flex-start;
    text-align: right;
    flex-wrap: wrap;
}

.footer-col {
    min-width: 150px;
}

.footer-col h4 {
    color: black;
    margin-bottom: 10px;
    font-size: 18px;
    font-family: 'IRANYekan', sans-serif;
    font-weight: 800;
}

.footer-col ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-col ul li {
    margin: 8px 0;
}

.footer-col ul li a {
    text-decoration: none;
    color: #444;
    transition: color 0.3s;
    font-family: 'IRANSans', Tahoma, sans-serif;
    font-weight: 300;
}

.footer-col ul li a:hover {
    color: #d4a017;
}

/* 🔹 کپی‌رایت پایین */
.footer-bottom {
    text-align: center;
    padding: 15px 0;
    margin-top: 30px;
    border-top: 1px solid #ddd;
    font-size: 14px;
    color: #555;
}
.footer-bottom {
    display: flex;
    justify-content: space-between; /* قرار گرفتن در دو طرف */
    align-items: center;
    padding: 15px 0;
    margin-top: 30px;
    border-top: 1px solid #ddd;
    font-size: 14px;
    color: #555;
}

.footer-bottom .footer-right,
.footer-bottom .footer-left {
    font-family: IRANSans;

}

/* حالت موبایل */
@media (max-width: 600px) {
    .footer-bottom {
        flex-direction: column;
        gap: 8px;
        text-align: center;
        padding-right: 15px;
    }
}


/* 📱 نسخه موبایل */
@media (max-width: 768px) {
    .footer-container {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .footer-columns {
        flex-direction: column;
        align-items: center;
    }
}
/* برای یک اندازه شدن عکس ها*/
.product-card img {
    width: 100%;
    height: 220px; /* ارتفاع ثابت برای همه عکس‌ها */
    object-fit: cover; /* تصویر رو بدون کشیدگی تنظیم می‌کنه */
    border-radius: 4px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* ✅ هم‌تراز و هم‌ارتفاع شدن کارت‌ها */
.product-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 330px; /* ارتفاع ثابت برای همه کارت‌ها */
}

/* ✅ وسط‌چین دقیق متن‌ها در هر کارت */
.product-card h3,
.product-card p,
.product-card .price-box,
.product-card .add-to-cart {
    margin: 5px 0;
}



/* برای صفحه تماس با ما */

.contact-section {
    padding: 40px 20px;
    background-color: #fffdf5;
    text-align: center;
}

.contact-section h2 {
    color: #d4a017;
    margin-bottom: 15px;
}

.contact-section p {
    color: #555;
    margin-bottom: 30px;
}

.contact-container {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap;
    gap: 20px;
    max-width: 800px;
    margin: 0 auto;
}

.contact-form {
    flex: 1 1 400px;
    background-color: #fff8e1;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(212,160,23,0.2);
    text-align: right;
}

.contact-form label {
    display: block;
    margin-top: 10px;
    font-weight: bold;
    color: #333;
}
.cart-btn {
    margin-right: auto;
    margin-left: 10px;
}

/* دکمه طلایی سبد خرید */
.cart-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background-color: #d4a017; /* رنگ طلایی متمایز از هدر */
    color: white;
    padding: 8px 16px;
    border-radius: 30px;
    font-weight: bold;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
}

/* آیکن داخل دکمه */
.cart-button img {
    width: 22px;
    height: 22px;
    object-fit: contain;
    transition: transform 0.3s ease;
}

/* ✨ افکت هاور (زمانی که موس روی دکمه میره) */
.cart-button:hover {
    background-color: #b88c0f; /* رنگ تیره‌تر در حالت هاور */
    transform: scale(1.05);
    box-shadow: 0 5px 12px rgba(0, 0, 0, 0.3);
}

/* حرکت ملایم آیکن هنگام هاور */
.cart-button:hover img {
    transform: rotate(-10deg) scale(1.1);
}


.contact-form input,
.contact-form textarea {
    width: 100%;
    padding: 8px;
    margin-top: 5px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-family: 'IRANYekan', sans-serif;
}

.contact-form .submit-btn {
    margin-top: 15px;
    width: 100%;
    padding: 10px;
    background-color: #d4a017;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-weight: bold;
}

.contact-form .submit-btn:hover {
    background-color: #b88c0f;
}

/* اطلاعات تماس */
.contact-info {
    flex: 1 1 300px;
    text-align: right;
    background-color: #fffdf5;
    padding: 20px;
    border-radius: 10px;
    border: 1px solid #f2c94c;
    box-shadow: 0 0 8px rgba(0,0,0,0.1);
}

.contact-info h3 {
    color: #d4a017;
    margin-bottom: 15px;
}

.contact-info p {
    margin: 8px 0;
    color: #444;
    font-size: 15px;
    font-family: IRANSans;
}

.contact-info a {
    color: #d4a017;
    text-decoration: none;
}

.contact-info a:hover {
    text-decoration: underline;
}

.social-links {
    margin-top: 15px;

}

/* 📱 نسخه موبایل */
@media (max-width: 768px) {
    .contact-container {
        flex-direction: column;
        align-items: center;
    }

    .contact-form, .contact-info {
        width: 100%;
    }

}
/* 🗺️ نقشه گوگل در تماس با ما */
.contact-map {
    flex: 1 1 400px;
    background-color: #fffdf5;
    padding: 10px;
    border-radius: 10px;
    border: 1px solid #f2c94c;
    box-shadow: 0 0 8px rgba(0,0,0,0.1);
    text-align: center;
}

.contact-map iframe {
    width: 100%;
    height: 300px;
    border-radius: 10px;
}

/* 📱 نسخه موبایل */
@media (max-width: 768px) {
    .contact-container {
        flex-direction: column;
        align-items: center;
    }

    .contact-form,
    .contact-info,
    .contact-map {
        width: 100%;
    }

}


/* برای صفحه  درباره  ما */
.about-section {
    padding: 50px 20px;
    background-color: #fffdf5;
}

.cart-btn {
    margin-right: auto;
    margin-left: 10px;
}

/* دکمه طلایی سبد خرید */
.cart-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background-color: #d4a017; /* رنگ طلایی متمایز از هدر */
    color: white;
    padding: 8px 16px;
    border-radius: 30px;
    font-weight: bold;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
}

/* آیکن داخل دکمه */
.cart-button img {
    width: 22px;
    height: 22px;
    object-fit: contain;
    transition: transform 0.3s ease;
}

/* ✨ افکت هاور (زمانی که موس روی دکمه میره) */
.cart-button:hover {
    background-color: #b88c0f; /* رنگ تیره‌تر در حالت هاور */
    transform: scale(1.05);
    box-shadow: 0 5px 12px rgba(0, 0, 0, 0.3);
}

/* حرکت ملایم آیکن هنگام هاور */
.cart-button:hover img {
    transform: rotate(-10deg) scale(1.1);
}


.about-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 40px;
    max-width: 1100px;
    margin: 0 auto;
}

.about-text {
    flex: 1 1 500px;
    text-align: justify;
    color: #444;
    line-height: 1.9;
}

.about-text h2 {
    color: #d4a017;
    margin-bottom: 15px;
    font-size: 24px;
}

.about-text p {
    margin-bottom: 15px;
    font-family:IRANSans;
}

.about-quote {
    background-color: #fff8e1;
    border-right: 4px solid #d4a017;
    padding: 12px 15px;
    border-radius: 8px;
    font-style: italic;
    color: #5a2d0c;
    margin: 20px 0;
}

.about-image {
    flex: 1 1 400px;
    text-align: center;
}

.about-image img {
    width: 100%;          /* عرض کامل */
    height: 450px;        /* ارتفاع ثابت برای افقی شدن */
    object-fit: cover;    /* تصویر بدون کشیدگی پر می‌شود */
    border-radius: 10px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.2);
    transition: transform 0.3s ease;
}

.about-image img:hover {
    transform: scale(1.03);
}

/* 📱 نسخه موبایل */
@media (max-width: 768px) {
    .about-content {
        flex-direction: column-reverse;
        text-align: center;
    }
    .about-text {
        text-align: center;
    }
}


/*  قوانین ومقررات */

/* برای صفحه فروشگاه */

.products-page {
    display: flex;
    gap: 20px;
    padding: 30px 0;
}

.sidebar {
    width: 20%;
    background-color: #fffdf5;
    border: 1px solid #f2c94c;
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
/* هر بخش سایدبار را تبدیل به باکس جدا با سایه می‌کند */
.sidebar-section  {
    background: #ffffff;
    padding: 15px 12px;
    border-radius: 10px;
    border: 1px solid #f2c94c;
    box-shadow: 2px 4px 10px rgba(0,0,0,0.15);
    margin-bottom: 20px;
    margin: 10px 0;
}
.sidebar-section h3 {
    background: #fff8db;
    padding: 10px;
    border-radius: 6px;
    text-align: center;
    margin-bottom: 10px;
    border: 1px solid #f2c94c;
    font-size: 14px !important;
}
.sidebar h3 {
    color: #d4a017;

    margin-bottom: 15px;
    font-family: IRANYekan;
}
/* فقط دسته‌بندی داخل باکس باشد + سایه */
.category-box ul {
    background: #ffffff;
    padding: 15px;
    border-radius: 10px;
    border: 1px solid #f2c94c;
    box-shadow: 0 3px 10px rgba(0,0,0,0.15);
}

.sidebar ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.sidebar ul li {
    margin-bottom: 10px;
}

.sidebar ul li a {
    text-decoration: none;
    color: #333;
    font-family: IRANSans;
    transition: color 0.3s;
}

.sidebar ul li a:hover {
    color: #d4a017;
}

.main-products {
    width: 80%;
    margin-left: 25px;

}

.product-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* برای چهار ستونه کردن هست*/

    margin-right: 25px;
    column-gap: 20px;  /* سطر باکس را کم می کند*/
    row-gap: 30px;   /* ستون باکس را کم می کند*/
}

.product-card {
    border: 1px solid #f2c94c;
    border-radius: 8px;
    padding: 25px;
    text-align: center;
    background-color: #fffdf5;
    box-shadow: 0 2px 5px rgba(0,0,0,0.25);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    height: 330px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    font-family: IRANSans;
}

.product-card img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 8px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.product-card img:hover {
    box-shadow: 0 6px 15px rgba(0,0,0,0.3);

}

.price-box .old-price {
    text-decoration: line-through;
    color: #888;
    font-size: 13px;
}

.price-box .new-price {
    color: #d4a017;
    font-weight: bold;
    font-size: 16px;
    font-family: IRANSans;
}

.add-to-cart {
    margin-top: 10px;
    padding: 10px 10px;
    background-color: #d4a017;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-weight: bold;
    width: 100%;
    transition: background-color 0.3s;
}



.add-to-cart:hover {
    background-color: #b88c0f;
}

/* نسخه موبایل */
@media (max-width: 768px) {
    .products-page {
        flex-direction: column;
    }
    .sidebar, .main-products {
        width: 100%;
    }
    .product-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .product-grid {
        grid-template-columns: 1fr;
    }
}
.footer {
    background-color: #f9f9f9;
    color: #333;
    padding: 50px 25px 20px ;
    border-top: 1px solid #ddd;
    font-family: 'Tahoma', sans-serif;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 20px;


    /* اضافه شده برای هم‌اندازه شدن با سایت */
    max-width: 1200px;
    margin: 0 auto;
    box-shadow: 0 0 10px rgba(0,0,0,0.05);
    border-radius: 10px 10px 0 0;
}
.footer-col ul img{
    border-radius: 15px;
}
.footer-bottom p{
    font-family: IRANSans;
}

.footer-container {
    display: flex;
    flex-wrap: wrap;
    font-family: 'IRANSans', Tahoma, sans-serif;
    justify-content: space-between;
    align-items: flex-start;
    max-width: 1200px;
    margin: 0 auto;
    gap: 40px;

}

.footer-logo {
    flex: 1 1 300px;
    text-align: center;
}

.footer-logo h2 {
    font-size: 28px;
    color: #5a2d0c;
    letter-spacing: 2px;
}

.footer-logo p {
    margin: 10px 0 20px;
    font-size: 14px;
    color: #666;
}

.newsletter {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.newsletter input {
    padding: 8px 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    width: 200px;
}

.newsletter button {
    background-color: #d4a017;
    color: white;
    border: none;
    padding: 8px 16px;
    margin-top: 6px;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s;
}

.newsletter button:hover {
    background-color: #b88c0f;
}

/* 🔹 ستون‌ها */
.footer-columns {
    flex: 2 1 600px;
    display: flex;
    justify-content: space-around;
    align-items: flex-start;
    text-align: right;
    flex-wrap: wrap;

}

.footer-col {
    min-width: 150px;
}

.footer-col h4 {
    color: black;
    margin-bottom: 10px;
    font-size: 18px;
    font-family: 'IRANYekan', sans-serif;
    font-weight: 800;
}

.footer-col ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-col ul li {
    margin: 8px 0;
}

.footer-col ul li a {
    text-decoration: none;
    color: #444;
    transition: color 0.3s;
    font-family: 'IRANSans', Tahoma, sans-serif;
    font-weight: 300;
}

.footer-col ul li a:hover {
    color: #d4a017;
}

/* 🔹 کپی‌رایت پایین */
.footer-bottom {
    text-align: center;
    padding: 15px 0;
    margin-top: 30px;
    border-top: 1px solid #ddd;
    font-size: 14px;
    color: #555;
}
.footer-bottom {
    display: flex;
    justify-content: space-between; /* قرار گرفتن در دو طرف */
    align-items: center;
    padding: 15px 0;
    margin-top: 30px;
    border-top: 1px solid #ddd;
    font-size: 14px;
    color: #555;
}

.footer-bottom .footer-right,
.footer-bottom .footer-left {
    font-family: IRANSans;

}

/* حالت موبایل */
@media (max-width: 600px) {
    .footer-bottom {
        flex-direction: column;
        gap: 8px;
        text-align: center;
        padding-right: 15px;
    }
}


/* 📱 نسخه موبایل */
@media (max-width: 768px) {
    .footer-container {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .footer-columns {
        flex-direction: column;
        align-items: center;
    }
}
/* --- استایل جدید و شبیه عکس --- */

.sidebar {
    width: 22%;
    background: #fff;
    padding: 15px 10px;
    border: none;
    height: 1090px;
}

.sidebar h3 {
    font-size: 18px;
    color: #333;
    text-align: center;
    margin-bottom: 15px;
    font-weight: bold;
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
    font-family: IRANSans;
}

.sidebar ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.sidebar ul li {
    padding: 6px 0;
}

.sidebar ul li a {
    text-decoration: none;
    color: #555;
    font-size: 12px;
    transition: color 0.2s;
}

.sidebar ul li a:hover {
    color: #d79b3e; /* هم‌رنگ مورد عکس */
}

/* آیتم فعال */
.sidebar .active a {
    color: #d79b3e;
    font-weight: bold;
}

/* فاصله بین بخش‌ها */
.sidebar h3:not(:first-child) {
    margin-top: 30px;
}

/* خط جداکننده */
.sidebar-section {
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #eee;
}
.filter-btn {
    background-color: #d4a017;
    color: #fff;
    border: none;
    padding: 6px 14px;
    font-size: 13px;
    border-radius: 5px;
    cursor: pointer;
    font-family: IRANSans;
    transition: 0.2s;
    margin-top: 10px;
}

.filter-btn:hover {
    background-color: #b98b15;
}



/*  جزییات محصول*/
.product-details-page {
    display: flex;
    gap: 30px;
    padding: 20px 0;

}

/* ستون راست: تصویر */
.product-images  {
    width: 45%;
    background-color: #fffdf5;
    border: 1px solid #f2c94c;
    padding: 60px 50px 50px 50px ;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    margin-left: 20px;
    margin-right: 20px;
}

.product-images img {
    width: 100%;
    height: 470px;
    object-fit: cover;
    border-radius: 10px;
}
/* گالری تصاویر کوچک زیر عکس اصلی */
.thumbnail-galleryd {
    margin-top: 20px;
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* سه ستون */
    gap: 10px;
}

.thumbnail-gallery img {
    width: 100%;
    height: 110px;
    object-fit: cover;
    border-radius: 8px;
    cursor: pointer;
    transition: 0.3s;
}

.thumbnail-gallery img:hover {
    transform: scale(1.05);
    border-color: #d4a017;
}

/* ستون چپ: متن و اطلاعات */
.product-info {
    width: 55%;
    background-color: #fffdf5;
    border: 1px solid #f2c94c;
    padding: 70px 70px 70px 70px;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    margin-right: 20px;
    margin-left: 20px;

}

.product-info h2 {
    font-size: 30px;
    color: #d4a017;
    margin-bottom: 15px;
    font-family: IRANSans;
}
.product-info h2{
    font-family: IRANSans;
}
.short-desc{
    font-family: IRANSans;
    text-align: justify;
}
.product-info .short-desc {
    font-size: 16px;
    color: #555;
    line-height: 1.8;
    margin-bottom: 20px;
}

.product-info .single-price-box {
    margin-top: 15px;
    margin-bottom: 20px;

}
.single-price-box {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.product-id {
    margin-right: 2px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.buttons-row {
    display: flex;
    gap: 15px;
}
.product-title {
    display: flex;
    justify-content: space-between; /* فاصله بین فارسی و انگلیسی */
    align-items: center;
    font-size: 24px; /* اندازه دلخواه برای عنوان */
}

.title-en {
    font-size: 16px;
    color: #555;
    font-weight: normal;
}


.buttons-row button {
    width: 60% ;

}

.add-to-cartsingle-add-to-card{
padding-right:  120px;
margin-right: 10px;


}

.wishlist-btn{
padding-right: 50px;
}
/* دکمه علاقه مندی‌ها با پس‌زمینه سفید و بوردر خردلی */
.wishlist-btn {
    background-color: #ffffff !important; /* پس‌زمینه سفید */
    color: #d4a017 !important;            /* متن و آیکون خردلی */
    border: 2px solid #d4a017 !important; /* بوردر خردلی */
    width: 45% !important;
    font-weight: bold;
}

.wishlist-btn i {
    color: #d4a017 !important; /* آیکون خردلی */
}

.wishlist-btn:hover {
    background-color: #fff7e0 !important; /* یک سفید مایل به خردلی هنگام هاور */
}

.product-info .old-price {
    text-decoration: line-through;
    color: #888;
    font-size: 16px;
    font-family: IRANSans;
}

.product-info .new-price {
    color: #d9534f;
    font-size: 38px;
    font-weight: bold;


}
.price-box single-price-box span{
    font-family: IRANSans;
    font-size: 20px;
}
.product-info{
    display: flex;
    flex-direction: column;
}
.add-to-cart{
    margin-top: 0px !important;
}
.action-row fa-solid fa-box-open{
    font-size: 20px;
    font-family: IRANSans;
}
.product-info .add-to-cartsingle-add-to-card {
    margin-top: 40px ;
    padding: 12px;
    display: block;
    background-color: #d4a017;
    color: white;
    border: none;
    border-radius: 8px;
    padding-left: 27px;



    width: 45% !important;
    cursor: pointer;
    font-size: 16px;
    transition: background 0.3s ease;


}


.product-info .add-to-cartsingle-add-to-card:hover {
    background-color: #b88c0f;
}

/* بخش توضیحات کامل */
.full-description {
    margin-top: 5px;
    background-color: #fffdf5;
    padding: 25px;
    border: 1px solid #f2c94c;
    border-radius: 10px;
    line-height: 2;
    color: #333;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    margin-bottom: 30px;
    margin-left: 20px;
    margin-right: 20px;
}
.product-features li,
.extra-specs li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 15px;
    color: #444;
    margin-bottom: 10px;
    font-family: IRANSans;
}

.product-features i,
.extra-specs i {
    color: #f2c94c; /* سبز خوشگل */
    font-size: 18px;
}

/* باکس مشخصات اضافه */
.extra-specs {
    list-style: none;
    padding: 0;
    margin-top: 15px;
}

.full-description h3 {
    color: #d4a017;
    margin-bottom: 15px;
    font-size: 29px;
    font-family: IRANSans;

}
.full-description h4 {
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);

}
.full-description p{
    text-align: justify;
}


/* ریسپانسیو */
@media(max-width: 768px) {
    .product-details-page {
        flex-direction: column;
    }

    .product-images,
    .product-info {
        width: 100%;
    }
}
.product-link {
    text-decoration: none;
    color: inherit;
    display: block;
}
/* دکمه کوچک‌تر و جمع‌وجور */
.product-info .add-to-cart {
    width: 220px !important;
    display: inline-block;
    font-size: 16px;
    padding: 10px 15px;
    margin-top: 0px;
}
.product-features {
    list-style: none;
    padding: 0;
    margin: 15px 0 25px 0;
}

.product-features li {
    font-size: 15px;
    color: #444;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.product-features i {
    color: #d4a017;
    font-size: 14px;
}
.stock-status {
    margin-top: 10px;
    color: black; /* قرمز ملایم برای تاکید */
    font-size: 16px;
    font-weight: bold;
    display: flex;
    align-items: center;
    gap: 6px;
}

 .stock-status i {
     color: #d9534f;
     font-size: 16px;
     font-family: IRANSans;

 }
.action-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
}
/* استایل برای بخش نظرات */
/* استایل برای بخش نظرات */
.reviews-section {
    margin-top: 25px;
    margin-bottom: 25px;
    background-color: #fffdf5;
    padding: 24px;
    border: 1px solid #f2c94c;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    margin-right: 20px;
    margin-left: 20px;

}

.reviews-section h3 {
    color: #d4a017;
    padding-right: 500px;
    margin-bottom: 15px;
    font-size: 30px;
    font-family: IRANSans;
}

/* ردیف ورودی‌ها */
.review-inputs {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

/* باکس نظر */
.review-textbox {
    flex: 1;
    width: 36%; /* عرض باکس نظر را کوچکتر کردیم */
    padding-right: 400px;
}

.review-textbox textarea {
    width: 92%;
    padding: 18px;
    font-size: 16px;
    border: 1px solid #f2c94c;
    border-radius: 8px;
    resize: none;
    background-color: #fff;

}

/* باکس نام و دکمه ثبت */
.review-submit {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 52%; /* عرض باکس نام و دکمه ثبت را کوچکتر کردیم */
    padding-right: 8px;
}

.name-input {
    padding: 9px; /* کاهش ارتفاع باکس نام */
    font-size: 12px; /* کاهش اندازه فونت */
    border: 1px solid #f2c94c;
    border-radius: 8px;
    width: 97%;
    margin-bottom: 8px; /* کاهش فاصله بین نام و دکمه */
    background-color: #fff;
    margin-left: 10px;


}

.submit-btn {
    padding: 6px 14px; /* کاهش اندازه دکمه ثبت */
    background-color: #d4a017;
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 12px; /* کاهش اندازه فونت دکمه */
    cursor: pointer;
    transition: background 0.3s ease;
    width: 95%;
}

.submit-btn:hover {
    background-color: #b88c0f;
}

/* ریسپانسیو برای نمایش بهتر در موبایل */
@media(max-width: 768px) {
    .review-inputs {
        flex-direction: column;
    }

    .review-textbox, .review-submit {
        width: 100%;
    }
}
.footer {
    background-color: #f9f9f9;
    color: #333;
    padding: 50px 25px 20px ;
    border-top: 5px solid #ddd;
    font-family: 'Tahoma', sans-serif;
    margin-left: 30px;
    margin-right: 30px;
    margin-top: 30px;


    /* اضافه شده برای هم‌اندازه شدن با سایت */
    max-width: 1200px;
    margin: 0 auto;
    box-shadow: 0 0 10px rgba(0,0,0,0.05);
    border-radius: 10px 10px 0 0;
}
.footer-col ul img{
    border-radius: 15px;
}
.footer-bottom p{
    font-family: IRANSans;
}

.footer-container {
    display: flex;
    flex-wrap: wrap;
    font-family: 'IRANSans', Tahoma, sans-serif;
    justify-content: space-between;
    align-items: flex-start;
    max-width: 1200px;
    margin: 0 auto;
    gap: 40px;
    padding-left: 25px;

}

.footer-logo {
    flex: 1 1 300px;
    text-align: center;
}

.footer-logo h2 {
    font-size: 28px;
    color: #5a2d0c;
    letter-spacing: 2px;
}

.footer-logo p {
    margin: 10px 0 20px;
    font-size: 14px;
    color: #666;
}

.newsletter {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.newsletter input {
    padding: 8px 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    width: 200px;
}

.newsletter button {
    background-color: #d4a017;
    color: white;
    border: none;
    padding: 8px 16px;
    margin-top: 6px;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s;
}

.newsletter button:hover {
    background-color: #b88c0f;
}

/* 🔹 ستون‌ها */
.footer-columns {
    flex: 2 1 600px;
    display: flex;
    justify-content: space-around;
    align-items: flex-start;
    text-align: right;
    flex-wrap: wrap;

}

.footer-col {
    min-width: 150px;
}

.footer-col h4 {
    color: black;
    margin-bottom: 10px;
    font-size: 18px;
    font-family: 'IRANYekan', sans-serif;
    font-weight: 800;
}

.footer-col ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-col ul li {
    margin: 8px 0;
}

.footer-col ul li a {
    text-decoration: none;
    color: #444;
    transition: color 0.3s;
    font-family: 'IRANSans', Tahoma, sans-serif;
    font-weight: 300;
}

.footer-col ul li a:hover {
    color: #d4a017;
}

/* 🔹 کپی‌رایت پایین */
.footer-bottom {
    text-align: center;
    padding: 15px 0;
    margin-top: 30px;
    border-top: 1px solid #ddd;
    font-size: 14px;
    color: #555;
}
.footer-bottom {
    display: flex;
    justify-content: space-between; /* قرار گرفتن در دو طرف */
    align-items: center;
    padding: 15px 0;
    margin-top: 30px;
    border-top: 1px solid #ddd;
    font-size: 14px;
    color: #555;
}

.footer-bottom .footer-right,
.footer-bottom .footer-left {
    font-family: IRANSans;

}

/* حالت موبایل */
@media (max-width: 600px) {
    .footer-bottom {
        flex-direction: column;
        gap: 8px;
        text-align: center;
        padding-right: 15px;
    }
}


/* 📱 نسخه موبایل */
@media (max-width: 768px) {
    .footer-container {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .footer-columns {
        flex-direction: column;
        align-items: center;
    }
}
/*برای ناوبری*/
/* 🔹 نوار ناوبری مسیر صفحات */
.breadcrumb {

    font-size: 15px;
    padding: 25px 22px 0px;
    display: flex;
    align-items: center;
text-align: right;
    gap: 14px;


}


.breadcrumb a {
    text-decoration: none;
    color: #444;
    font-weight: bold;
    font-family: IRANSans;
}

.breadcrumb a:hover {
    color: darkgray;
}

.breadcrumb .current {
    color: #444;
    font-weight: normal;
}
 /* سبد خرید */

.login-container{
    background: #fff; /* پس زمینه سفید */
    padding: 40px;
    border-radius: 15px;
    margin: 60px auto 60px auto; /* فاصله از بالا و پایین */
    max-width: 500px;
}
.cart-container {
    max-width: 600px;
    max-height: 600px;
    margin: 100px auto 60px auto;
    background: #fffdf5;
    padding: 60px 20px;
    border-radius: 15px;
    text-align: center;
    box-shadow: 0 3px 10px rgba(0,0,0,0.1);
    font-family: IRANSans;

}

.cart-title {
    font-size: 28px;
    font-weight: bold;
    margin-bottom: 15px;
}

.empty-icon {
    font-size: 90px;
    opacity: 0.1;
    margin: 40px 0;
}

.empty-text {
    font-size: 18px;
    color: #444;
    margin-bottom: 25px;
    margin-top: 25px;
    margin-bottom: 25px;
    padding-bottom: 50px;
}



.back-btn:hover {
    background-color: #b88c0f;
}
.cart-actions {
    margin-top: 40px;
    display: flex;
    justify-content: center;
    gap: 50px; /* فاصله بین دکمه‌ها */
}

.cart-btn, .checkout-btn {
    background-color: #d4a017;
    color: white;
    padding: 12px 24px;
    border-radius: 10px;
    text-decoration: none;
    font-size: 16px;
    font-weight: bold;
    transition: 0.2s ease;
}


.cart-btn:hover, .checkout-btn:hover {
    background-color: #b88c0f;
}
/*  تسویه حساب */
body {
    background-color: #fff8e1;
    font-family: 'IRANSans';
}

.checkout-container {
    max-width: 1100px;
    margin: 30px auto;
    background: #fffdf5;
    padding: 25px;
    border-radius: 15px;
    box-shadow: 0 3px 12px rgba(0,0,0,0.15);
}

h2.section-title {
    color: #d4a017;
    font-size: 36px;
    font-family: IRANSans;
    margin-bottom: 15px;;
    padding-right: 10px;
}

.form-group {
    margin-bottom: 18px;
}

.form-group label {
    font-weight: bold;
    font-size: 15px;
}

.form-group input,
.form-group textarea,
.form-group select {
    width: 90%;
    padding: 10px;
    border: 1px solid #f2c94c;
    border-radius: 10px;
    margin-top: 6px;
    background: white;
}

.checkout-flex {
    display: flex;
    flex-wrap: wrap;
    gap: 25px;
}

.checkout-box {
    flex: 1;
    min-width: 320px;
    background: white;
    padding: 20px;
    border-radius: 15px;
    border: 1px solid #f2c94c;
}

.order-summary-item {
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px dashed #ccc;
}

.checkoutd-btn{
    width: 90%;
    padding: 14px;
    background-color: #d4a017;
    color: white;
    text-align: center;
    font-size: 18px;
    border-radius: 12px;
    margin-top: 20px;
    display: block;
    font-weight: bold;
    transition: 0.3s;
    text-decoration: none;
}

.checkoutd-btn:hover {
    background-color: #b88c0f;
    transform: scale(1.02);
}

.payment-method {
    margin-top: 10px;
}

.payment-method label {
    display: block;
    margin-bottom: 8px;
}

.empty-space {
    height: 50px;
}
/* برای پنل مدیریت */

/*اخرین مقالات */
/* بخش مقالات */
.articles-section {
    padding: 40px 0;
}

.section-title {
    text-align: center;
    margin-bottom: 30px;
    font-size: 24px;
}

/* گرید 3×2 */
.articles-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

/* باکس مقاله */
.article-box {
    background: #fff;
    border-radius: 12px;
    padding: 30px;
    text-align: center;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

/* عکس مربعی */
.article-box img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: 10px;
    margin-bottom: 12px;
}

.article-box h3 {
    font-size: 16px;
    margin-bottom: 8px;
}

.article-box p {
    font-size: 14px;
    color: #555;
    margin-bottom: 10px;
}

.category {
    display: block;
    font-size: 13px;
    color: #888;
    margin-bottom: 12px;
}

/* دکمه نمایش */
.btn-view {
    display: inline-block;
    padding: 6px 14px;
    font-size: 13px;
    background-color: #000;
    color: #fff;
    border-radius: 6px;
    text-decoration: none;
}

.btn-view:hover {
    background-color: #444;
}

.______________________thumbs-track__________ {

 display: inline-block; /* اجازه دهد عرض به اندازه محتوا باشد */
  white-space: nowrap;   /* همه در یک خط بدون wrap */

  position: relative;
  transition: transform .3s ease;

}


.thumbnail-gallery {
  position: relative;

  width: 100%;
    display: block;
      height:110px;
}

.thumbs-track {
  display: block;
  width:100%;
  position:relative;
  height:110px;
  transition: transform 0.3s ease;
}



.thumbs-track img {
  position:absolute;
  z-index:1;  
  width: 120px;
  height: 110px;
  top:0;
  left:0;

}

.thumbnail-gallery .slide-caret{
position:absolute;
z-index:19000;
width:25px;
height:25px;
text-decoration: none;
display:flex;
align-items: center;
justify-content: center;
text-align: center;
font-size:15px;
font-weight: 600;
top:50%;
transform: translateY(-50%);
border-radius: 100%;
background-color: rgba(0,0,0,0.5);
color:#fff;
}

.thumbnail-gallery .slide-caret:hover{

  background-color: rgba(0,0,0,1.0);

}

.thumbnail-gallery .slide-caret.slide-caret-right{

right:6px;


}


.thumbnail-gallery .slide-caret.slide-caret-left{

left:6px;


}