.category-top {
    height: 150px;
    margin-top: 60px !important;
}

@media (max-width: 460px) {
    .category-top {
        margin-top: 5px !important;
    }
}

@media (min-width: 460px) {
    .category-top {
        margin-top: 70px !important;
    }
}

@media (min-width: 750px) {
    .category-top {
        margin-top: 180px !important;
    }
}

@media (min-width: 1020px) {
    .category-top {
        margin-top: 20px !important;
    }
}

@media (min-width: 1380px) {
    .category-top {
        margin-bottom: 80px !important;
    }
}

@media (min-width: 750px) {
    .category-top-image {
        margin-right: 50px !important;
    }
}

/*.category-top-image{*/
/*    margin-right: 50px !important;*/
/*}*/


/* Style for Toast with sweetalert 2 */
.colored-toast.swal2-icon-success {
    background-color: #a5dc86 !important;
}

.colored-toast.swal2-icon-error {
    background-color: #f27474 !important;
}

.colored-toast.swal2-icon-warning {
    background-color: #f8bb86 !important;
}

.colored-toast.swal2-icon-info {
    background-color: #3fc3ee !important;
}

.colored-toast.swal2-icon-question {
    background-color: #87adbd !important;
}

.colored-toast .swal2-title {
    color: white;
}

.colored-toast .swal2-close {
    color: white;
}

.colored-toast .swal2-html-container {
    color: white;
}

/* End Style for Toast with sweetalert 2 */
.iconamoon--apps {
    display: inline-block;
    width: 24px;
    height: 24px;
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 4h2v2H4zm0 14h2v2H4zM18 4h2v2h-2zm0 7h2v2h-2zm-7 0h2v2h-2zm-7 0h2v2H4zm7-7h2v2h-2zm0 14h2v2h-2zm7 0h2v2h-2z'/%3E%3C/svg%3E");
    background-color: currentColor;
    -webkit-mask-image: var(--svg);
    mask-image: var(--svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

.text-dark-75 {
    color: rgba(۰, ۰, ۰, 0.75) !important;
}

/* فاصله‌ی مطمئن از هدرِ ثابت (mobile first) */
.page-product {
    padding-top: 106px; /* ارتفاع هدر موبایل */
}

/* دسکتاپ‌ها: کمی بیشتر تا زیر هدر نرود */
@media (min-width: 768px) {
    .page-product {
        padding-top: 100px;
    }
}

@media (min-width: 1024px) {
    .page-product {
        padding-top: 148px;
    }
}

/* بردکرامب: فاصله‌ی یکنواخت از بالا/پایین + همیشه روی عناصر پس‌زمینه */
#breadcrumb {
    margin-top: 16px; /* موبایل */
    margin-bottom: 16px;
    position: relative;
    z-index: 10;
}

/* در دسکتاپ کمی فاصله بیشتر اگر خواستی */
@media (min-width: 768px) {
    #breadcrumb {
        margin-top: 1px;
        margin-bottom: 1px;
    }
}

@media (min-width: 768px) {
    .min-h-800{
        margin-top: 10px !important;
    }
}