/*
Theme Name: foxgram
Theme URI: https://foxgram.co
Author: تیم فاکس گرام
Author URI: https://foxgram.co
Description: اولین قالب وردپرسی با رابط کاربری اینستاگرامی در ایران
فاکس گرام یک قالب فروشگاهی وردپرسی فوق‌العاده پیشرفته است که با الهام از رابط کاربری اینستاگرام طراحی شده؛ نه صرفاً از نظر ظاهر، بلکه در نحوه تعامل، تجربه کاربری (UX) و چیدمان عناصر فروشگاهی. اگر شما یک فروشنده فعال در اینستاگرام هستید یا دنبال طراحی سایتی هستید که حس کار با اپلیکیشن‌های اجتماعی را به کاربر منتقل کند، فاکس گرام تنها گزینه‌ای‌ست که شما را از هر قالب دیگر بی‌نیاز می‌کند.
Requires at least: 6.7
Tested up to: 6.7
Requires PHP: 7.4
Version: 1.1
Text Domain: foxgram
*/

:root {
    --foxgram-main-color: #02835D;
}

* {
    box-sizing: border-box;
    margin: 0;
}

body {
    max-width: 600px;
    background: #ffffff;
    border: solid 1px #eeeeee;
    margin: auto;
    /*padding: 15px;*/
    height: 100vh;
    max-height: 100vh;
    overflow: auto;
    position: relative;

}

.nw_foxgram_body_content {
    padding-bottom: 95px;
}

.nw_container {
    padding: 0 20px !important;
}

h1, h2, h3, h4, h5, h6, a, p, button, input, span, div, ul, textarea, select {
    font-family: yekanbakh;
}

i {
    font-family: "Font Awesome 6 Pro";
}

/***** general *****/
.nw_foxgram_page_content {
    background: #F4F4F4;
    padding: 20px;
    min-height: 90vh;
}

.nw_foxgram_page_box_title img {
    height: auto;
    border-radius: 75px;
    aspect-ratio: 1;
}

.nw_foxgram_page_box_title h1 {
    font-size: 18px;
    color: #292D32;
    /*margin-bottom: 5px;*/
}

.nw_foxgram_page_box_title p {
    font-size: 14px;
    color: #727981;
}

.nw_foxgram_btn {
    display: flex !important;
    background: var(--foxgram-main-color) !important;
    padding: 20px !important;
    border-radius: 10px !important;
    border: none !important;
    width: 100% !important;
    color: #ffffff !important;
    height: 60px !important;
    justify-content: center !important;
    text-decoration: none !important;
}

/***** header *****/
.nw_foxgram_header_main {
    padding: 20px 0;
}

.nw_foxgram_menu_hamburger {
    padding: 10px;
    font-size: 14px;
    color: #727981;
    font-weight: 400;
    display: flex;
    align-items: center;
    gap: 15px;
}

.nw_foxgram_menu_hamburger i {
    font-size: 24px;
    color: #727981;
}

.nw_foxgram_header_notify_icon, .nw_foxgram_header_back_btn {
    padding: 10px;
    display: flex;
    justify-content: end;
    color: #727981;
    font-size: 24px;
}

.nw_foxgram_header_notify_icon a {
    color: #727981;
    position: relative;
}

.nw_foxgram_header_notify_icon .nw_count_notify {
    position: absolute;
    right: -6px;
    top: -1px;
    width: 15px;
    height: 15px;
    font-size: 9px;
    background: var(--foxgram-main-color);
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
}

/******* footer *******/
footer {
    position: fixed;
    bottom: 0;
    left: 50%;
    background: #ffffff;
    width: 100%;
    max-width: 600px;
    transform: translateX(-50%);
    height: 100px;
    display: flex;
    align-items: center;
    border-radius: 10px 10px 0 0;
    z-index: 99;
}

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

.nw_foxgram_footer_row > div {
    display: flex;
    align-items: center;
    justify-content: center;
}

.nw_foxgram_footer_row a {
    text-decoration: none;
}

.nw_foxgram_footer_row i {
    text-decoration: none;
    color: #292D32;
    font-size: 20px;
}

.nw_foxgram_footer_row i.active {
    background: linear-gradient(143.71deg, #8B2EE8 5.12%, #E848B3 49.97%, #FFB65C 95.77%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.nw_foxgram_footer_cart {
    width: 60px;
    height: 60px;
    border-radius: 100px;
    background: linear-gradient(143.71deg, #8B2EE8 5.12%, #E848B3 49.97%, #FFB65C 95.77%);
    box-shadow: 0px 18px 52px 0px #EA81C0;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.nw_count_cart {
    position: absolute;
    top: -4px;
    right: -3px;
    width: 25px;
    height: 25px;
    background: #e02f2f;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
}

.nw_foxgram_footer_cart i {
    color: #FFFFFF;
    font-size: 20px;
}


/****** side navigation ******/
.nw_foxgram_side_menu_back {
    position: absolute;
    background: #00000040;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 200;
    display: none;
    overflow: hidden;
    backdrop-filter: blur(10px);

}


.nw_foxgram_side_menu {
    position: absolute;
    background: #ffffff;
    top: 0;
    right: -400px;
    width: 90%;
    max-width: 400px;
    height: 90vh;
    border-radius: 35px 0 0 35px;
    z-index: 210;
    padding: 25px;
    overflow: auto;
    visibility: hidden;
    transition: right 0.3s ease-in-out;
    margin-top: 5vh;
}

.nw_foxgram_side_menu.active {
    right: 0;
    visibility: visible;
    transition: right 0.3s ease-in-out;
}

.nw_side_menu_head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}

.nw_side_menu_head i {
    color: #FF1F35;
    font-size: 24px;
    background: #ffdcdc;
    border-radius: 50px;
    width: 35px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    /*position: absolute;*/
    /*left: 0;*/
    /*top: 20px;*/

}


.nw_side_menu_head p {
    font-size: 14px;
    color: #727981;
    font-weight: 400;
}

.nw_side_menu_list ul {
    list-style: none;
    padding: 0;
}
li.category-item {
    background: #f4f4f4;
    padding: 0 10px;
    border-radius: 6px;
    margin-bottom: 10px;
}
.nw_side_menu_list a {
    color: #292D32;
    font-size: 18px;
    text-decoration: none;
    padding: 5px 0;

    display: block;
    position: relative;
    padding-left: 20px;
}


.nw_side_menu_list a.has_sub_categories:after {
    content: "\f104";
    font-family: "Font Awesome 6 Pro";
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 16px;
    transition: all 0.3s linear;
}

.nw_side_menu_list a.has_sub_categories.open:after {
    transform: translateY(-50%) rotate(-90deg);
    transition: all 0.3s linear;
}

.nw_side_menu_list ul ul {
    padding: 10px 15px;
}

.nw_side_menu_list ul ul a {
    color: #727981;
    margin-bottom: 0;
    font-size: 16px;
    padding-left: 50px;
}

.nw_side_menu_list ul ul a.has_sub_categories:after {
    content: "\f104";
    font-family: "Font Awesome 6 Pro";
    position: absolute;
    left: 45px;

}

.sub-category-list {
    display: none;
    margin-left: 20px;
}

.category-item > a {
    cursor: pointer;
}

.toggle-icon {
    font-size: 18px;
    margin-left: 10px;
}

/******* home info ********/
.nw_foxgram_home_info {
    margin-bottom: 20px;
}

.nw_foxgram_story_image {
    position: relative;
    padding: 3px;
    border-radius: 400px;
    height: max-content;

}

.nw_foxgram_story_image .back_profile {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(40deg, #f9ce34 0%, #ee2a7b 50%, #6228d7 100%);
    border-radius: 400px;
    z-index: 2;
}

.nw_foxgram_story_image.observed .back_profile {
    background: #DBDEE9;
}

.nw_foxgram_story_image img {
    width: 100%;
    border-radius: 400px;
    z-index: 4;
    border: solid 5px #ffffff;
    display: block;
    position: relative;
    aspect-ratio: 1;
    object-fit: cover;
}

.nw_foxgram_info_box_title {
    display: flex;
    flex-wrap: wrap;
    /*justify-content: space-between;*/
}

.nw_foxgram_info_title {
    width: 100%;
    font-size: 17px;
    font-weight: 800;
    margin-bottom: 25px;
}

.nw_foxgram_info_box_title_col {
    width: 33%;
}

.nw_foxgram_info_box_title_col_number {
    font-size: 16px;
    font-weight: 800;
}

.nw_foxgram_info_box_title_col_text {
    font-size: 13px;
    font-weight: 400;
    color: #727981;
}

.nw_foxgram_info_box_desc {
    margin-top: 15px;
    line-height: 1.7em;
    font-size: 14px;
    color: #727981;
    padding: 10px;
    text-align: justify;
}

/******* home buttons ********/
.nw_foxgram_home_buttons a {
    height: 50px;
    border-radius: 10px;
    text-decoration: none;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: solid 1px #DBDEE9;
    color: #292D32;
    gap: 8px;
}

.nw_foxgram_home_buttons_row {
    gap: 10px;
}

.nw_foxgram_home_btn_saved, .nw_foxgram_home_btn_order {
    width: 42%;
}

.nw_foxgram_home_btn_tell {
    width: 16%;
}

.nw_foxgram_home_btn_tell i {
    font-size: 20px;
}

.nw_foxgram_home_btn_order {
    border-color: var(--foxgram-main-color) !important;
    background: var(--foxgram-main-color);
    color: #ffffff !important;
}

/******* home highlight ********/
.nw_foxgram_highlight {
    border-bottom: solid 1px #DBDEE9;
}

.nw_foxgram_highlight_row {
    display: flex;
    gap: 20px;
    overflow-x: auto;
    white-space: nowrap;
    -ms-overflow-style: none;
    scrollbar-width: none;
    padding: 25px 0;
}

.nw_foxgram_highlight_row {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.nw_foxgram_highlight_row img {
    pointer-events: auto;
    user-drag: none;
    -webkit-user-drag: none;
    cursor: pointer;
}

.nw_foxgram_highlight_row::-webkit-scrollbar {
    display: none;
}

.nw_foxgram_highlight_col {
    width: 20%;
    flex: 0 0 auto;
    white-space: nowrap;
}

.nw_foxgram_highlight_box_img {
    position: relative;
    padding: 2px;
    border-radius: 400px;
    height: max-content;

}

.nw_foxgram_highlight_box_img_border {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #DBDEE9;
    border-radius: 400px;
    z-index: 2;
}

.nw_foxgram_highlight_box_img img {
    width: 100%;
    border-radius: 400px;
    z-index: 4;
    border: solid 3px #ffffff;
    display: block;
    position: relative;
    aspect-ratio: 1;
    object-fit: cover;
}

.nw_foxgram_highlight_text {
    text-align: center;
    font-size: 13px;
    color: #292D32;
    margin-top: 10px;
}

/******* home categories ********/
.nw_foxgram_home_categories_row {
    display: flex;
    overflow-x: auto;
    white-space: nowrap;

    -ms-overflow-style: none;
    scrollbar-width: none;
}

.nw_foxgram_home_categories_row {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.nw_foxgram_home_categories_row::-webkit-scrollbar {
    display: none;
}

.nw_foxgram_home_categories_col {
    border-bottom: solid 3px #DBDEE9;
    padding: 0 10px;
    cursor: pointer;
}

.nw_foxgram_home_categories_col p {
    flex: 0 0 auto;
    padding: 15px 5px;
    border-radius: 8px;
    white-space: nowrap;
    color: #727981;
    font-size: 15px;
}

.nw_foxgram_home_categories_col.active p {
    position: relative;
    font-weight: 600;
    background: linear-gradient(143.71deg, #8B2EE8 5.12%, #E848B3 49.97%, #FFB65C 95.77%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    z-index: 66;
}

.nw_foxgram_home_categories_col.active p:after {
    content: "";
    position: absolute;
    background: linear-gradient(176deg, #8B2EE8 5.12%, #E848B3 49.97%, #FFB65C 95.77%);
    width: 100%;
    height: 3px;
    bottom: -2px;
    left: 0;
    border-radius: 4px;
    z-index: 77;
}

/**** home products ****/
.nw_foxgram_home_products {
    padding: 20px;
    background: #F4F4F4;
    min-height: 40vh;
}

.nw_foxgram_home_products_loading {
    width: 100%;
    padding: 25px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 30px;
}

.nw_foxgram_home_products_loading .loading-spinner {
    width: 38px;
    height: 38px;
    border-top-color: var(--foxgram-main-color);
}

p.nw_foxgram_home_products_empty {
    text-align: center;
    width: 100%;
    margin-bottom: 30px;
    margin-top: 15px;
    font-size: 15px;
}

.nw_foxgram_home_products_row {
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
}

.nw_home_products_load_more {
    display: flex;
    justify-content: center;
    padding: 25px 0;
    width: 100%;
}

.nw_home_products_load_more button {
    border: 1px solid #DBDEE9;
    padding: 15px 30px;
    font-size: 13px;
    border-radius: 10px;
    background: transparent;
    color: #292D32;
    cursor: pointer;
}

.nw_foxgram_home_products_box {
    /*width: 33%;*/
    /*margin-bottom: 3px;*/
    display: block;
    padding: 4px;
    position: relative;
}

.nw_foxgram_home_products_box .nw_discount_percentage {
    position: absolute;
    left: 10px;
    top: 10px;
    padding: 5px 8px;
    z-index: 60;
    background: #EF394E;
    color: #FFFFFF;
    border-radius: 4px;
    line-height: 1em;
    font-weight: 600;
    font-size: 11px;
}

.nw_foxgram_home_products_box .price {
    position: absolute;
    bottom: 15%;
    left: 50%;
    transform: translateX(-50%);
    width: max-content;
    background: #FFFFFF;
    font-size: 11px;
    font-weight: 700;
    color: #292D32;
    padding: 2px 5px;
    border-radius: 3px;
}

.nw_foxgram_home_products_box img {
    width: 100%;
    display: block;
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: 8px;
}

.nw_foxgram_home_products_box .price .price_symbol {
    font-size: 11px;
    font-weight: 400;
    color: #727981;
}

/********* home Social networks **********/
.nw_foxgram_home_social_networks {
    padding: 20px;
    padding-top: 45px;
    background: #F4F4F4;
}

.nw_foxgram_home_social_networks_images {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 35px;
    gap: 25px;
}

.nw_social_networks_images_box {
    width: 25%;
    max-width: 60px;
}

.nw_foxgram_home_social_networks_images img {
    width: 100%;
    height: auto;
}

.nw_foxgram_home_social_networks_icons {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px;
    margin-bottom: 20px;
}

.nw_foxgram_home_social_networks_icons img {
    max-width: 20px;
    height: 100%;
    max-height: 20px;
    display: block;
    opacity: 0.8;
}

.nw_foxgram_home_copy_right {
    color: #727981;
    font-size: 12px;
    width: 100%;
    text-align: center;
    line-height: 2em;
    margin-bottom: 20px;
    font-weight: 600;
}

.nw_foxgram_home_copy_right a {
    text-decoration: none;
    font-weight: 500;
    background: linear-gradient(143.71deg, #8B2EE8 5.12%, #E848B3 49.97%, #ff825c 95.77%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/******** shop page ********/
.nw_shop_orderby_select {
    height: 50px;
    border: 1px solid #DBDEE9;
    border-radius: 10px;
    padding: 10px;
}

.nw_shop_products > div {
    padding: 3px;
}

.nw_shop_products {
    display: flex;
    justify-content: start;
    flex-wrap: wrap;
}

.nw_shop_products img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 8px;
    aspect-ratio: 1;
}

.nw_shop_item_product {
    position: relative;
}

.nw_shop_item_product .price {
    position: absolute;
    bottom: 15%;
    left: 50%;
    transform: translateX(-50%);
    width: max-content;
    background: #FFFFFF;
    font-size: 12px;
    font-weight: 700;
    color: #292D32;
    padding: 2px 5px;
    border-radius: 3px;
}

.nw_shop_item_product .price .price_symbol {
    font-size: 11px;
    font-weight: 400;
    color: #727981;
}

/******** product page ********/
.nw_foxgram_product_title_site strong {
    color: #292D32;
    font-weight: 800;
    margin-bottom: 5px;
    font-size: 17px;
}

.woocommerce-message {
    border-top: none;
    background: var(--foxgram-main-color);
    margin: 5px;
    border-radius: 5px;
    color: #fff;
    font-size: 15px;
}

.woocommerce-error {
    border-top: none;
    background: #a31111;
    margin: 5px;
    border-radius: 5px;
    color: #fff;
    font-size: 15px;
}

.woocommerce-info {
    border-top: none;
    background: #3f85c6;
    margin: 5px;
    border-radius: 5px;
    color: #fff;
    font-size: 15px;
}

.woocommerce-message a, .woocommerce-error a, .woocommerce-info a {
    text-decoration: none;
    color: #ffffff;
}

.woocommerce-message > a, .woocommerce-error > a, .woocommerce-info > a {
    background: #fff;
    padding: 5px 10px;
    border-radius: 3px;
    text-decoration: none;
    color: #2b2b2b;
    font-size: 13px;
    margin-top: 10px;
}

.nw_foxgram_product_title_site p {
    color: #727981;
    font-size: 13px;
}

.nw_foxgram_product_image_slider .nw_discount_percentage {
    position: absolute;
    left: 10px;
    top: 10px;
    padding: 10px 15px;
    z-index: 60;
    background: #EF394E;
    color: #FFFFFF;
    border-radius: 4px;
    line-height: 1em;
    font-weight: 700;
    font-size: 15px;
}

.nw_foxgram_product_page {
    background: #F4F4F4;
    padding: 20px;
    padding-bottom: 80px;
}

.nw_foxgram_product_box_price {
    background: #FFFFFF;
    padding: 15px;
    border-radius: 10px;
    margin-bottom: 15px;
}

.nw_foxgram_product_box_price h3 {
    color: #292D32;
    margin-bottom: 5px;
    font-weight: 700;
    font-size: 15px;
}

.nw_foxgram_product_box_price .price {
    color: #292D32;
    font-weight: 700;
    font-size: 17px;
}

.nw_foxgram_product_box_image {
    background: #FFFFFF;
    padding: 15px;
    border-radius: 10px;
    margin-bottom: 15px;
}

.nw_foxgram_product_box_image img {
    width: 100%;
    border-radius: 8px;
    display: block;
}

.nw_foxgram_product_image_slider {
    position: relative;
    margin-bottom: 15px;
}

.nw_foxgram_product_image_slider .swiper-pagination {
    position: absolute;
    top: auto !important;
    bottom: -45px !important;
    width: max-content !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
}

.nw_foxgram_product_box_icons {
    margin: 0 !important;
}

.nw_foxgram_product_box_icons .nw_box_comment_like {
    display: flex;
    justify-content: end;
    align-items: center;
    gap: 15px;
    padding: 5px 10px !important;
}

.nw_box_comment_like div, .nw_box_comment_like a {
    display: flex;
    align-items: center;
    gap: 7px;
    text-decoration: none;
    color: #292D32;
}

.nw_foxgram_product_box_icons i {
    font-size: 21px;
}

.nw_icon_like .fa-solid {
    color: #FF0051;
}

.nw_box_save_share i {
    font-size: 21px;
    cursor: pointer;
}

.nw_box_save_share {
    display: flex;
    gap: 25px;
    align-items: center;
    padding: 5px 10px !important;
    color: #292D32;
}

.nw_foxgram_product_box_content {
    background: #FFFFFF;
    padding: 15px;
    border-radius: 10px;
    margin-bottom: 15px;
}

.nw_foxgram_product_box_content h1 {
    font-size: 18px;
    font-weight: 800;
    margin: 15px 0;
}

.nw_foxgram_product_box_content .nw_box_description {
    font-size: 14px;
    color: #292D32;
    line-height: 1.9em;
    font-weight: 400;
    text-align: justify;
    margin-bottom: 20px;
}

.nw_box_tags {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.nw_box_tags a {
    color: #6C7CA3;
    text-decoration: none;
    font-weight: 600;
}

table.variations {
    width: 100%;
    margin-top: 30px;
}

table.variations tr td {
    width: 80%;
    padding: 5px 0;
}

table.variations tr th {
    width: 20%;
    padding: 5px 0;
    display: flex;
    align-items: start;
}

table.variations label {
    display: flex;
    align-items: center;
    justify-content: start;
    font-size: 15px;
    color: #292D32;
    height: 50px;
}

table.variations tr select {
    width: 100%;
    height: 50px;
    background: #FFFFFF;
    border: 1px solid #DBDEE9;
    border-radius: 8px;
    padding: 0 5px;
}

.nw_foxgram_product_box_content .quantity, .woocommerce-variation-price {
    display: none !important;
}

.variations_button, .nw_foxgram_product_cart_btn_box {
    position: fixed;
    left: 50%;
    bottom: 95px;
    width: 100%;
    padding: 20px;
    max-width: 600px;
    z-index: 99;
    transform: translateX(-50%);
}

.variations_button button, .nw_foxgram_product_cart_btn {
    background: var(--foxgram-main-color);
    padding: 20px;
    border-radius: 10px;
    border: none;
    width: 100%;
    color: #ffffff;
    height: 60px;

}

.single_add_to_cart_button {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

.single_add_to_cart_button .quantity-box {
    display: flex;
    align-items: center;
    gap: 2px;
}

.single_add_to_cart_button .qty-input {
    width: 50px;
    border-radius: 6px;
    border: none;
    height: 35px;
    text-align: center;
}

.single_add_to_cart_button .qty-plus, .single_add_to_cart_button .qty-minus {
    width: 20px;
    border-radius: 6px;
    border: none;
    height: 35px;
    background: #DBDEE9;
    color: #2b2b2b;
    display: flex;
    align-items: center;
    justify-content: center;
}

.reset_variations {
    text-decoration: none;
    background: #DBDEE9;
    padding: 5px;
    border-radius: 4px;
    font-size: 12px;
    display: block;
    width: max-content;
    color: #292D32;
    margin-top: 8px;
}

.loading-spinner {
    border: 4px solid #eaeaea; /* رنگ زمینه */
    border-top: 4px solid #292D32; /* رنگ قسمت متحرک */
    border-radius: 50%;
    width: 18px;
    height: 18px;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/******** comment page *********/
.nw_comment_page {
    background: #F4F4F4;
    padding: 20px;
}

.nw_comment_page_box {
    background: #FFFFFF;
    padding: 15px;
    border-radius: 10px;
    margin-bottom: 15px;
}

.nw_comment_title_box h2 {
    color: #292D32;
    font-weight: 800;
    font-size: 18px;
}

.nw_comment_title_box p {
    color: #727981;
    font-size: 14px;
    font-weight: 400;
}

.nw_rating_star_icon {
    color: #DBDEE9;
}

.nw_rating_star_icon.active {
    color: #FFC039;
}

.nw_rating_star {
    width: max-content;
    display: flex;
    justify-content: end;
    align-items: center;
    gap: 5px;
}

.nw_box_rating {
    margin-top: 15px;
    margin-bottom: 25px;
}

.nw_box_rating p {
    font-size: 15px;
    color: #292D32;
    font-weight: 600;
}

.nw_comment_box_form .stars {
    display: none;
}

.nw_comment_box_form input {
    width: 100%;
    margin-bottom: 10px;
    border: solid 1px #DBDEE9;
    background: #ffffff;
    height: 50px;
    border-radius: 8px;
    padding: 10px;
}

.nw_comment_box_form textarea {
    width: 100%;
    margin-bottom: 10px;
    border: solid 1px #DBDEE9;
    background: #ffffff;
    height: 100px;
    border-radius: 8px;
    padding: 10px;
}

.nw_comment_box_form textarea::placeholder, .nw_comment_box_form input::placeholder {
    font-size: 14px;
    color: #727981;
}

.nw_comment_box_form button {
    background: var(--foxgram-main-color);
    width: 100%;
    border-radius: 10px;
    height: 60px;
    text-align: center;
    font-size: 16px;
    color: #ffffff;
    cursor: pointer;
    border: none;
    font-weight: 600;
}

.nw_box_comment {
    padding: 17px;
    border-radius: 10px;
    border: solid 1px #DBDEE9;
    margin-bottom: 12px;
}

.nw_box_comment_time {
    font-size: 14px;
    color: #727981;
    margin-bottom: 5px;
}

.nw_box_comment_title {
    display: flex;
    gap: 10px;
}

.nw_box_comment_avatar {
    background: #EFEFEF;
    border-radius: 50px;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--foxgram-main-color);
    font-weight: 800;
}

.nw_box_comment_head {
    display: flex;
    justify-content: space-between;
    margin-bottom: 15px;
}

.nw_box_comment_stars i {
    font-size: 10px;
}

.nw_box_comment_stars p {
    font-size: 14px;
    color: #808080;
}

.nw_box_comment_text {
    font-size: 15px;
    color: #616161;
    text-align: justify;
    line-height: 1.6em;
}

.nw_comment_list_title {
    font-size: 18px;
    margin-bottom: 15px;
    font-weight: 700;
}

/*********  popups  *********/

.nw_foxgram_popup_form input, .nw_foxgram_popup_form textarea {
    border-radius: 8px;
    border: 1px solid #DBDEE9;
    width: 100%;
    height: 60px;
    margin-bottom: 10px;
    padding: 10px;
}

.nw_foxgram_popup_form *::placeholder {
    color: #292D32;
    font-size: 15px;
}

.nw_foxgram_popup_form textarea {
    height: 120px;
    max-width: 100%;
    min-width: 100%;
    min-height: 120px;
    max-height: 120px;
}

.nw_foxgram_popup_button {
    background: var(--foxgram-main-color);
    height: 60px;
    margin-bottom: 10px;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    width: 100%;
    border-radius: 10px;
    border: none;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
}

.nw_popup_head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 27px;
}

.nw_popup_head h3 {
    font-weight: 800;
    font-size: 18px;
    color: #292D32;
}

.nw_popup_head i {
    font-size: 24px;
    color: #FF1F35;
    padding: 7px;
    cursor: pointer;
}

.nw_popup_description {
    font-size: 15px;
    color: #727981;
    text-align: justify;
    margin-bottom: 35px;
}

/*********  contact-us  *********/
#nw_contact_us_form p {
    width: max-content;
    padding: 10px 20px;
    font-size: 15px;
    color: #ffffff;
    background: var(--foxgram-main-color);
    border-radius: 6px;
}

.nw_foxgram_popup_contact_us {
    position: fixed;
    width: 100%;
    height: 100%;
    display: none;
    justify-content: center;
    align-items: center;
    top: 0;
    left: 0;
    z-index: 100;
}

.nw_foxgram_popup_contact_us.active {
    display: flex;
}

.nw_foxgram_popup_contact_us_back {
    position: absolute;
    top: 0;
    left: 0;
    background: #00000066;
    width: 100%;
    height: 100%;
    z-index: 105;
}

.nw_foxgram_popup_contact_us_box {
    padding: 25px;
    border-radius: 10px;
    background: #FFFFFF;
    z-index: 110;
    width: 95%;
    max-width: 550px;
}


.nw_foxgram_popup_contact_us_bottom {
    margin-top: 45px;
    display: flex;
    justify-content: space-between;
}

.nw_foxgram_popup_contact_us_bottom strong a {
    color: #292D32;
    font-size: 18px;
    font-weight: 700;
    text-decoration: none;
}

.nw_foxgram_popup_contact_us_bottom p {
    font-size: 14px;
    color: #727981;
}

.nw_foxgram_popup_contact_us_bottom .nw_popup_icons {
    display: flex;
    gap: 12px;
    margin-bottom: 8px;
    align-items: center;
    justify-content: center;
}

.nw_foxgram_popup_contact_us_bottom .nw_popup_icons img {
    max-width: 19px;
    height: 100%;
    max-height: 19px;
    display: block;
}

/*********  Order tracking  *********/
.nw_foxgram_popup_order_tracking {
    position: fixed;
    width: 100%;
    height: 100%;
    display: none;
    justify-content: center;
    align-items: center;
    top: 0;
    left: 0;
    z-index: 100;
}

.nw_foxgram_popup_order_tracking.active {
    display: flex;
}

.nw_foxgram_popup_order_tracking_back {
    position: absolute;
    top: 0;
    left: 0;
    background: #00000066;
    width: 100%;
    height: 100%;
    z-index: 105;
}

.nw_foxgram_popup_order_tracking_box {
    padding: 25px;
    border-radius: 10px;
    background: #FFFFFF;
    z-index: 110;
    width: 95%;
    max-width: 550px;
}

.popup_order_tracking_result {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px 5px;
    gap: 15px;
}

.popup_order_tracking_result strong {
    padding: 10px 20px;
    background: #eee;
    border-radius: 6px;
    font-size: 15px;
    color: var(--foxgram-main-color);
}

/**** story *****/
.nw_story_head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    gap: 5px;
    padding: 25px;
}

.nw_story_head i {
    font-size: 17px;
    color: #FFFFFF;
    cursor: pointer;
}

.nw_story_head div {
    display: flex;
    align-items: center;
    gap: 12px;
}

.nw_story_head img {
    width: 45px;
    height: 45px;
    border-radius: 50px;
    object-fit: cover;
}

.nw_story_head strong {
    color: #FFFFFF;
    font-size: 15px;
    font-weight: 700;
}

.nw_foxgram_section_story_back {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 110;
    background: #00000066;
    display: none;
}

.nw_foxgram_section_story {
    position: fixed;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 120;
    width: 100%;
    max-width: 600px;
    height: 100%;
    display: none;
}

.nw_foxgram_section_story.active {
    display: block;
}

.nw_foxgram_section_sub_story_back {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 110;
    background: #00000066;
    display: none;
}

.nw_foxgram_section_sub_story {
    position: fixed;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 120;
    width: 100%;
    max-width: 600px;
    height: 100%;
    display: none;
}

.nw_foxgram_section_sub_story.active {
    display: block;
}

.progress-bars {
    display: flex;
    position: absolute;
    top: 80px;
    left: 10px;
    right: 10px;
    z-index: 10;
    gap: 5px;
}

.progress-bar {
    flex: 1;
    height: 4px;
    background: rgba(255, 255, 255, 0.62);
    overflow: hidden;
    border-radius: 2px;

    /*border: solid 1px #d5d5d5;*/
}

.progress-fill {
    height: 100%;
    width: 0%;
    background: white;
    transition: width 0s;
}

/*.progress-bar::after {*/
/*    content: "";*/
/*    position: absolute;*/
/*    top: 0;*/
/*    left: 0;*/
/*    height: 100%;*/
/*    width: 0%;*/
/*    background: white;*/
/*    animation: progressAnim 5s linear forwards;*/
/*}*/

@keyframes progressAnim {
    to {
        width: 100%;
    }
}

.click-center {
    position: absolute;
    top: 0;
    left: 30%;
    width: 40%; /* وسط تصویر */
    height: 100%;
    z-index: 20;
    cursor: pointer;
}

.swiper-slide {
    position: relative;
}

.nw_foxgram_section_story, .nw_foxgram_section_sub_story {
    width: 100vw !important;
    height: auto;
    max-height: 100vh;
    max-width: calc(100vh * 9 / 16) !important;
}

.nw_foxgram_section_story .swiper-slide,
.nw_foxgram_section_sub_story .swiper-slide {
    aspect-ratio: 9 / 16;
    width: 100%;
    height: 100vh;
    margin: 0 auto;
    background: #22252a;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    position: relative;
}

.nw_foxgram_section_story .fa-chevron-right, .nw_foxgram_section_sub_story .fa-chevron-right {
    position: absolute;
    right: 10px;
    top: 50%;
    font-size: 20px;
    color: #ffffff;
    z-index: 99;
    opacity: 0.9;
}

.nw_foxgram_section_story .fa-chevron-left, .nw_foxgram_section_sub_story .fa-chevron-left {
    position: absolute;
    left: 10px;
    top: 50%;
    font-size: 20px;
    color: #ffffff;
    z-index: 99;
    opacity: 0.9;
}

.nw_foxgram_section_story .swiper-slide img,
.nw_foxgram_section_sub_story .swiper-slide img {
    width: auto;
    height: auto;
    object-fit: contain;
    max-height: 100%;
    max-width: 100%;
}

/****** cart *****/
.nw_empty_cart_box {
    min-height: 350px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 15px;
}

.nw_empty_cart_box img {
    width: 30%;
    margin-bottom: 25px;
}

.nw_empty_cart_box p {
    font-size: 15px;
    color: #727981;
}

.nw_foxgram_cart_page_box {
    background: #FFFFFF;
    padding: 15px;
    border-radius: 10px;
    margin-bottom: 15px;
}

.nw_foxgram_page_box_title {
    background: #FFFFFF;
    padding: 15px;
    border-radius: 10px;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 15px;
}

.nw_foxgram_page_box {
    background: #FFFFFF;
    padding: 15px;
    border-radius: 10px;
    margin-bottom: 15px;
}

.nw_cart_item {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    border: 1px solid #DBDEE9;
    margin-bottom: 15px;
    border-radius: 12px;
    padding: 15px;
}

.nw_cart_item .nw_cart_item_quantity_ajax_box {
    display: flex;
    align-items: center;
    gap: 2px;
}

.nw_cart_item .nw_cart_qty_input {
    width: 50px;
    border-radius: 6px;
    border: 1px solid #DBDEE9;
    height: 35px;
    text-align: center;
}

.nw_cart_item .nw_qty_btn {
    width: 20px;
    border-radius: 6px;
    border: 1px solid #DBDEE9;
    height: 35px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--foxgram-main-color);
    color: #ffffff;
    cursor: pointer;
}

.nw_cart_item_content {
    width: 65%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 5px 15px 5px 5px;
}

.nw_cart_item_image {
    width: 35%;
}

.nw_cart_item_image img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    aspect-ratio: 1;
    object-fit: cover;
}

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

.nw_cart_item_trash_price i {
    color: #FF0051;
    font-size: 20px;
}

.nw_cart_item_name {
    color: #292D32;
    font-size: 15px;
    font-weight: 800;
    margin-bottom: 8px;
}

.nw_cart_item_price {
    color: #292D32;
    font-size: 16px;
    font-weight: 700;
}

.nw_cart_item_price .woocommerce-Price-currencySymbol {
    color: #727981;
    font-size: 13px;
    font-weight: 400;
}

.nw_cart_item_quantity {
    color: #727981;
    font-size: 14px;
    font-weight: 400;
}

.nw_foxgram_coupon_form_box {
    margin-bottom: 80px;
}

.nw_foxgram_coupon_form {
    display: flex;
    width: 100%;
    gap: 8px;
}

.nw_foxgram_coupon_form input {
    border: 1px solid #DBDEE9;
    background: #FFFFFF;
    height: 50px;
    padding: 10px 20px;
    border-radius: 10px;
    width: 70%;
}

.nw_foxgram_coupon_form button {
    border: none;
    background: #292D32 !important;
    color: #ffffff !important;
    height: 50px;
    width: 30%;
    border-radius: 10px !important;
    font-size: 15px !important;
    font-weight: 400 !important;
}

.nw_foxgram_cart_page_submit_btn {
    position: fixed;
    left: 50%;
    bottom: 95px;
    width: 100%;
    padding: 20px;
    max-width: 600px;
    z-index: 99;
    transform: translateX(-50%);
}

.nw_foxgram_cart_page_submit_btn a {
    display: flex;
    background: var(--foxgram-main-color);
    padding: 20px;
    border-radius: 10px;
    border: none;
    width: 100%;
    color: #ffffff;
    height: 60px;
    justify-content: space-between;
    text-decoration: none;
}

/*******  checkout  *******/
.nw_foxgram_checkout_page_box {
    background: #FFFFFF;
    padding: 15px;
    border-radius: 10px;
    margin-bottom: 15px;
}

.nw_foxgram_checkout_page_box:last-child {
    margin-bottom: 70px;
}

.nw_foxgram_checkout_page_box input[type='text'],
.nw_foxgram_checkout_page_box input[type='tel'],
.nw_foxgram_checkout_page_box input[type='email'],
.nw_foxgram_checkout_page_box input[type='number'],
.nw_foxgram_checkout_page_box textarea,
.nw_foxgram_checkout_page_box select, .nw_foxgram_checkout_page_box .select2-selection {
    border: 1px solid #DBDEE9 !important;
    background: #FFFFFF !important;
    height: 50px !important;
    border-radius: 8px !important;
    padding: 0 15px !important;
}

.nw_foxgram_checkout_page_box textarea {
    height: 100px !important;
    padding: 15px 15px !important;
}

.woocommerce-form__label-for-checkbox {
    display: flex;
    align-items: center;
    gap: 15px;
}

.nw_foxgram_checkout_page_box h3 {
    font-size: 16px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 15px;
    color: #292D32;
}

.nw_checkout_btn_box {
    position: fixed;
    left: 50%;
    bottom: 95px;
    width: 100%;
    padding: 20px;
    max-width: 600px;
    z-index: 99;
    transform: translateX(-50%);
}

.nw_checkout_btn {
    display: flex;
    background: var(--foxgram-main-color) !important;
    padding: 20px;
    border-radius: 10px !important;
    border: none;
    width: 100%;
    color: #ffffff;
    height: 60px;
    justify-content: space-between;
    text-decoration: none;
}

/*******  thank you  *******/
.nw_foxgram_thank_you_page_box {
    background: #FFFFFF;
    padding: 15px;
    border-radius: 10px;
    margin-bottom: 15px;
}

.nw_foxgram_thank_you_page_box h3, .nw_foxgram_thank_you_page_box h2 {
    font-size: 16px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 15px;
    color: #292D32;
}

/*******  wishlist products  *******/
.nw_foxgram_wishlist_products_box {
    background: #FFFFFF;
    padding: 15px;
    border-radius: 10px;
    margin-bottom: 15px;
}

.nw_wishlist_login_icon {
    color: #292D32;
}

.nw_foxgram_wishlist_products_box h3, .nw_foxgram_wishlist_products_box h2 {
    font-size: 16px;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 15px;
    color: #292D32;
}

.nw_wishlist_products_list {
    display: flex;
    justify-content: start;
    flex-wrap: wrap;
}

.nw_wishlist_products_list a {
    /*display: block;*/
    /*padding: 5px;*/
}

.nw_wishlist_products_list img {
    width: 100%;
    height: auto;
    display: block;
    aspect-ratio: 1;
    border-radius: 8px;
}

/***** login page *****/
.nw_foxgram_box_login {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.nw_foxgram_box_login img {
    border-radius: 95px;
    margin-bottom: 18px;
    aspect-ratio: 1;
    object-fit: cover;
}

.nw_foxgram_box_login h2 {
    color: #292D32;
    font-size: 20px;
    font-weight: 700;
}

.nw_foxgram_box_login p {
    color: #727981;
    font-size: 15px;
    font-weight: 400;
    max-width: 60%;
    text-align: center;
    margin-bottom: 30px;
}

.nw_foxgram_box_login label {
    display: block;
    width: 100%;
    max-width: 300px;
    padding: 0 15px;
}

.nw_foxgram_box_login label span {
    background: #ffffff;
    padding: 3px 5px;
    position: relative;
    bottom: -13px;
    font-size: 12px;
    color: #727981;
}

.nw_foxgram_box_login input {
    border-radius: 10px;
    border: 1px solid #DBDEE9;
    height: 60px;
    padding: 15px;
    width: 100%;
    max-width: 300px;
    margin-bottom: 15px;
}

span.nw_login_error {
    background: #b13535;
    color: #fff;
    padding: 7px;
    width: 100%;
    max-width: 200px;
    border-radius: 4px;
    text-align: center;
    margin-bottom: 15px;
    font-size: 14px;
}

/*** panel ****/
.nw_panel_user_box {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.nw_panel_user_box h2 {
    color: #292D32;
    font-size: 20px;
    font-weight: 700;
    margin: 15px 0;
}

.nw_foxgram_user_avatar {
    position: relative;
    padding: 3px;
    border-radius: 400px;
    height: max-content;
    max-width: 120px;
}

.nw_foxgram_user_avatar .back_profile {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(40deg, #f9ce34 0%, #ee2a7b 50%, #6228d7 100%);
    border-radius: 400px;
    z-index: 2;
}

.nw_foxgram_user_avatar img {
    width: 100%;
    border-radius: 400px;
    z-index: 4;
    border: solid 5px #ffffff;
    display: block;
    position: relative;
    aspect-ratio: 1;
    object-fit: cover;
}

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

.nw_panel_menu li {
    margin-bottom: 10px;
}

.nw_panel_menu a {
    display: block;
    text-decoration: none;
    color: #292D32;
    padding: 10px;
    border: 1px solid #DBDEE9;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 600;
}

.nw_panel_menu li.is-active a {
    background: var(--foxgram-main-color);
    color: #ffffff;
}

.nw_panel_content input {
    width: 100%;
    margin-bottom: 10px;
    border: solid 1px #DBDEE9;
    background: #ffffff;
    height: 50px;
    border-radius: 8px;
    padding: 10px;
}

.nw_panel_content label {
    font-size: 15px;
    color: #292D32;
    font-weight: 600;
}

.nw_panel_content em {
    font-size: 14px;
    color: #727981;
}

/***** search ****/
.nw_search_form_box {
    padding: 25px;
    position: relative;
}

.nw_search_form_box input {
    width: 100%;
    border: solid 1px #DBDEE9;
    background: #ffffff;
    height: 60px;
    border-radius: 8px;
    padding: 10px;
}

.nw_search_form_box button {
    position: absolute;
    left: 40px;
    top: 60px;
    transform: translateY(-50%);
    padding: 10px;
    font-size: 26px;
    background: transparent;
    border: none;
    color: #727981;
}

.nw_search_result {
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
}

.nw_search_words {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 20px;
}

.nw_search_words span {
    background: #DBDEE9;
    padding: 5px 10px;
    border-radius: 6px;
    font-size: 14px;
    cursor: pointer;
}

.nw_search_words p {
    color: #727981;
    font-size: 13px;
    margin-bottom: 5px;
    width: 100%;
}

/****** notifications *******/
.nw_foxgram_notif {
    display: block;
    text-decoration: none;
    padding: 10px;
    border: 1px solid #DBDEE9;
    border-radius: 8px;
    margin-bottom: 10px;
}

.nw_foxgram_notif_head {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--foxgram-main-color);
    cursor: pointer;
}

.nw_foxgram_notif strong {
    font-size: 15px;
    font-weight: 700 !important;
    color: #292D32;
}

.nw_foxgram_notif_message {
    font-size: 14px;
    font-weight: 400;
    color: #42464b;
    padding-top: 10px;
    text-align: justify;
    line-height: 1.9em;
    overflow-wrap: break-word; /* یا word-wrap: break-word; */
    word-break: break-all;
    overflow: hidden;
}

.nw_foxgram_notif_message a {
    color: var(--foxgram-main-color);
}

@media (max-width: 425px) {
    .nw_foxgram_info_box_desc {
        font-size: 12px;
    }

    .nw_foxgram_info_box_title_col_text {
        font-size: 11px;
    }
}