html {
margin-top: 0 !important;
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
/* ==========================================================================
Fonts
========================================================================== */
@font-face {
font-display: swap;
font-family: "yekan-bakh";
src: url("../font/yekan-bakh/YekanBakhFaNum-Fat.woff2") format('woff2');
font-weight: 900;
font-style: normal;
}
@font-face {
font-display: swap;
font-family: "yekan-bakh";
src: url("../font/yekan-bakh/YekanBakhFaNum-Medium.woff2") format('woff2');
font-weight: 500;
font-style: normal;
}
@font-face {
font-display: swap;
font-family: "yekan-bakh";
src: url("../font/yekan-bakh/YekanBakhFaNum-Bold.woff2") format('woff2');
font-weight: bold;
font-style: normal;
}
@font-face {
font-display: swap;
font-family: "yekan-bakh";
src: url("../font/yekan-bakh/YekanBakhFaNum-Heavy.woff2") format('woff2');
font-weight: 800;
font-style: normal;
}
@font-face {
font-display: swap;
font-family: "yekan-bakh";
src: url("../font/yekan-bakh/YekanBakhFaNum-Light.woff2") format('woff2');
font-weight: 300;
font-style: normal;
}
@font-face {
font-display: swap;
font-family: "yekan-bakh";
src: url("../font/yekan-bakh/YekanBakhFaNum-Regular.woff2") format('woff2');
font-weight: normal;
font-style: normal;
}
@font-face {
font-display: swap;
font-family: "iranyekan";
src: url("../font/iran-yekan/bold.woff") format('woff');
font-weight: bold;
font-style: normal;
}
@font-face {
font-display: swap;
font-family: "iranyekan";
src: url("../font/iran-yekan/regular.woff") format('woff');
font-weight: normal;
font-style: normal;
}
@font-face {
font-display: swap;
font-family: "iranyekan";
src: url("../font/iran-yekan/light.woff") format('woff');
font-weight: lighter;
font-style: normal;
}
@font-face {
font-display: swap;
font-family: "iransans";
src: url("../font/iransans/Iransans.woff") format('woff');
font-weight: normal;
font-style: normal;
}
@font-face {
font-display: swap;
font-family: "iranyekan";
src: url("../font/iransans/Iransans.woff2") format('woff2');
font-weight: normal;
font-style: normal;
}
@font-face {
font-display: swap;
font-family: "iransans";
src: url("../font/iransans/Iransans-Light.woff") format('woff');
font-weight: light;
font-style: normal;
}
@font-face {
font-display: swap;
font-family: "iranyekan";
src: url("../font/iransans/Iransans-Light.woff2") format('woff2');
font-weight: lighter;
font-style: normal;
}
@font-face {
font-display: swap;
font-family: "iransans";
src: url("../font/iransans/Iransans-Bold.woff") format('woff');
font-weight: lighter;
font-style: normal;
}
@font-face {
font-display: swap;
font-family: "iranyekan";
src: url("../font/iransans/Iransans-Bold.woff2") format('woff2');
font-weight: bold;
font-style: normal;
}
:root {
/* theme color */
/*--main-color-one: #0761f6;*/
/*--main-color-one-shadow: #0763f622;*/
/*--main-color-one-hover: #0547b2;*/
--main-color-two: #ef473a;
--main-color-two-shadow: #ef473a22;
--main-color-two-hover: #ce2c20;
--main-color-three: #11c56b;
--main-color-three-shadow: #11c56b33;
--main-color-three-hover: #099f54;
/*--bg-site: #f4f5f9;*/
/*--color-site: #515151;*/
--font-site: 'yekan-bakh';
/* shadow */
--shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
--shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
--shadow-box: rgb(0 0 0 / 10%) 0px 0px 10px 0px !important;
--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
--shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
--shadow-inner: inset 0 2px 12px 4px rgb(0 0 0 / 5%);
/* text */
--text-muted: #565757;
--text-muted-two: #929292;
/* border */
--border-muted: #ced4da;
}
body {
font-family: var(--font-site);
background: var(--bg-site);
color: var(--color-site);
position: relative;
}
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
font-weight: 600;
margin-bottom: 0;
}
.tooltip {
font-family: var(--font-site);
}
input[type=checkbox] {
width: 20px;
height: 20px;
margin-left: 7px;
}
.form-control:focus,
.form-select:focus {
box-shadow: none;
border-color: var(--main-color-one);
}
.content {
padding: 20px 0;
}
.content-box {
background-color: #fff;
box-shadow: var(--shadow-box);
padding: 20px 20px;
margin-bottom: 20px;
border-radius: 10px;
}
.content-box:nth-last-child(1) {
margin-bottom: 0;
}
.font-en {
font-family: var(--font-site) !important;
}
a {
text-decoration: none;
color: var(--color-site);
}
.fw-900 {
font-weight: 900;
}
.fw-800 {
font-weight: 800;
}
a:hover {
color: var(--main-color-one-hover);
}
.text-overflow {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.def-color {
color: var(--color-site) !important;
}
.py-20 {
padding: 20px 0;
}
.font-10 {
font-size: 10px;
}
.font-11 {
font-size: 11px;
}
.font-12 {
font-size: 12px;
}
.font-13 {
font-size: 13px;
}
.font-14 {
font-size: 14px;
}
.font-15 {
font-size: 15px;
}
.font-16 {
font-size: 16px;
}
.font-17 {
font-size: 17px;
}
.font-18 {
font-size: 18px;
}
.font-19 {
font-size: 19px;
}
.font-20 {
font-size: 20px;
}
.text-overflow-1 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.text-overflow-2 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.text-overflow-3 {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
.text-justify {
text-align: justify;
}
.span-primary {
display: inline;
background-color: #0967ff13;
border-bottom: 1px dashed var(--main-color-one);
padding: 4px 7px;
color: var(--main-color-one-hover);
}
.form-group {
margin-bottom: 15px;
}
.main-color-one-color {
color: var(--main-color-one) !important;
}
.main-color-one-bg {
background-color: var(--bg-site) !important;
color: var(--color-site) !important;
box-shadow: 0px 0px 3px var(--main-color-one-shadow) !important;
}
.main-color-one-bg:hover {
background-color: var(--main-color-one-hover) !important;
color: #fff !important;
}
.main-color-two-color {
color: var(--main-color-two) !important;
}
.main-color-two-bg {
background-color: var(--main-color-two) !important;
color: #fff !important;
box-shadow: 0 5px 15px var(--main-color-two-shadow) !important;
}
.main-color-two-bg:hover {
background-color: var(--main-color-two-hover) !important;
color: #fff !important;
}
.main-color-three-color {
color: var(--main-color-three) !important;
}
.main-color-three-bg {
background-color: var(--main-color-three) !important;
color: #fff !important;
box-shadow: 0 5px 15px var(--main-color-three-shadow) !important;
}
.main-color-three-bg:hover {
background-color: var(--main-color-three-hover) !important;
color: #fff !important;
}
.mco-hover,
.mct-hover,
.mctt-hover {
transition: 0.3s;
-webkit-transition: 0.3s;
-moz-transition: 0.3s;
-ms-transition: 0.3s;
-o-transition: 0.3s;
}
.mco-hover:hover {
color: var(--main-color-one-hover) !important;
}
.mct-hover:hover {
color: var(--main-color-two-hover) !important;
}
.mctt-hover:hover {
color: var(--main-color-three-hover) !important;
}
.shadow-sm {
box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
}
.shadow {
box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
}
.shadow-md {
box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
}
.shadow-lg {
box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
}
.shadow-xl {
box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
}
.shadow-2xl {
box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
}
.shadow-inner {
box-shadow: inset 0 2px 12px 4px rgb(0 0 0 / 5%);
}
.shadow-box {
box-shadow: rgb(0 0 0 / 10%) 0 0 10px 0 !important;
}
.pointer {
cursor: pointer;
}
.border-muted {
border-color: var(--border-muted) !important;
}
.swiper-button-next,
.swiper-button-prev {
box-shadow: var(--shadow-md);
padding: 25px;
background: #fff;
border-radius: 0 25px 25px 0;
top: 50% !important;
transform: translateY(-50%) !important;
}
.swiper-button-prev::after,
.swiper-button-next::after {
font-size: 16px;
color: var(--color-site);
}
.swiper-button-next::after {
position: absolute;
left: 40%;
transform: translateX(-40%);
}
.swiper-button-prev::after {
position: absolute;
right: 40%;
transform: translateX(40%);
}
.swiper-button-prev {
right: 1px !important;
border-radius: 25px 0 0 25px;
border: 1px solid #ddd;
}
.swiper-button-next {
left: 1px !important;
border: 1px solid #ddd;
}
.swiper-pagination-bullet-active {
background: var(--main-color-one);
width: 25px;
height: 7px;
border-radius: 10px;
}
.border-animate {
/* you can change these variables to control the border */
--border-color: var(--main-color-one-hover);
--border-width: 2px;
--bottom-distance: 0px;
/* you can increase this */
color: #666;
display: inline-block;
background-image: linear-gradient(var(--border-color), var(--border-color));
background-size: 0 var(--border-width);
background-repeat: no-repeat;
transition: background-size 0.3s;
margin: 5px 0;
}
.fromCenter {
background-position: 50% calc(100% - var(--bottom-distance));
}
.fromRight {
background-position: 100% calc(100% - var(--bottom-distance));
}
.fromLeft {
background-position: 0 calc(100% - var(--bottom-distance))
}
.border-animate:hover {
background-size: 100% var(--border-width);
}
.border-animate:focus {
background-size: 100% var(--border-width);
}
/* STYLING SCROLLBAR */
::-webkit-scrollbar {
width: 1vw;
/* THIS WILL RESET THE DEFAULT SCORLLBAR STYLING */
}
/* TO STYLE THE SCROLLBAR TRACK */
::-webkit-scrollbar-track {
background-color: #ffffff;
/* THIS WILL SET THE COLOR OF THE SCROLLBAR TRACK */
}
/* TO STYLE THE SCROLLBAR THUMB */
::-webkit-scrollbar-thumb {
background-color: var(--main-color-one);
border: 0.3vw solid #ffffff;
border-radius: 5vw;
}
/* header */
.header-top {
padding-top: 10px;
}
.header-top-link {
padding-bottom: 10px;
border-bottom: 2px solid transparent;
transition: .3s all linear;
-webkit-transition: .3s all linear;
-moz-transition: .3s all linear;
-ms-transition: .3s all linear;
-o-transition: .3s all linear;
}
.header-bottom.sticky {
position: fixed;
top: 0;
left: 0;
width: 100%;
transform: translateY(0);
animation: slideDown 0.4s ease forwards;
background: var(--main-color-one-shadow);
box-shadow: 1px 1px 5px #ddd;
z-index: 999;
max-width: 100%;
transition: 0.5s;
}
.header-bottom.sticky-header {
border-radius: 11px;
transition: 0.5s;
}
.header-top-link:hover {
color: var(--main-color-one);
border-bottom: 2px solid var(--main-color-one);
}
.header-bottom {
padding: 5px 0;
background: var(--main-color-one-shadow);
}
.header-bottom .btn {
color: var(--color-site);
}
.header-bottom-btn {
display: flex;
align-items: center;
justify-content: flex-end;
}
.header-bottom-link {
width: auto;
margin-left: 3px;
padding: 10px 15px;
display: flex;
align-items: center;
justify-content: center;
transition: .5s all linear;
border-radius: 25px;
border: 1px solid #ccc;
box-shadow: none;
color: var(--color-site);
border: 2px solid rgba(133, 133, 133, 0.2);
}
.header-bottom-link:hover {
background: var(--main-color-one);
color: #fff;
}
.header-bottom-link-cat {
background-color: transparent;
color: var(--color-site);
padding: 10px 15px;
border: 2px solid rgba(133, 133, 133, 0.2);
}
.header-bottom-link-cat:hover {
color: #fff;
background-color: var(--main-color-one);
}
.social .header-social-link img {
width: 20px;
filter: brightness(0);
}
.site-features {
width: 100%;
display: flex;
justify-content: space-around;
background: url('https://luster-babaei.com/wp-content/uploads/2026/07/pattern1.jpg');
background-size: contain;
background-position: center;
background-color: #ffffff21;
align-items: center;
padding: 10px 0;
flex-wrap: wrap;
background-blend-mode: hue;
}
.header-feature-item {
flex: 1 1 20%;
text-align: center;
color: #333333;
font-size: 18px;
text-decoration: none;
padding: 20px;
transition: background-color 0.3s ease;
position: relative;
z-index: 1;
font-weight: bold;
text-shadow: 0px 2px 15px #ddd;
}
.header-feature-item:not(:last-child)::after {
content: "";
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 1px;
height: 80px;
background: #7a7a7a;
}
.header-feature-content {
cursor: pointer;
transition: 0.3s;
padding:8px 0;
}
.header-feature-content:hover {
background: var(--mf-glass-bg);
transition: all 0.3s;
border-radius: 5px;
}
.header-feature-content:hover .header-feature-desc{
color: #fff;
}
.header-feature-desc p {
margin-bottom: 0;
}
/* ===================================================
نشانگر زیرمنو برای آیتمهای دارای فرزند (Sub-menu Indicator)
=================================================== */
/* تنظیم ساختار والد لینک */
.menu-item-has-children > a {
position: relative;
display: inline-flex;
align-items: center;
gap: 6px; /* فاصله مناسب بین متن و آیکون */
}
/* ساخت آیکون نشانگر با FontAwesome */
.menu-item-has-children > a::after {
content: "\f078"; /* کد آیکون fa-chevron-down */
font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome";
font-weight: 900;
font-size: 11px;
line-height: 1;
display: inline-block;
color: inherit; /* تبعیت از رنگ متن لینک */
opacity: 0.75;
transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s ease, color 0.3s ease;
vertical-align: middle;
}
/* انیمیشن و چرخش نشانگر هنگام هاور روی آیتم منو */
.menu-item-has-children:hover > a::after,
.menu-item-has-children:focus-within > a::after {
transform: rotate(180deg);
opacity: 1;
color: var(--main-color-one); /* تغییر به رنگ اصلی برند در هنگام هاور */
}
/* زیرمنوهای سطوح بعدی (عمق ۲ به بعد): تبدیل جهت فلش به سمت چپ در حالت راستچین */
.menu-item-has-children .sub-menu .menu-item-has-children > a::after {
content: "\f053"; /* کد آیکون fa-chevron-left مناسب زبان فارسی و RTL */
font-size: 10px;
margin-right: auto; /* هدایت فلش به انتهای سطر در زیرمنوی بازشونده */
}
.menu-item-has-children .sub-menu .menu-item-has-children:hover > a::after {
transform: translateX(-4px); /* لغزش ملایم به سمت چپ به جای چرخش */
}
/* end header */
/* home-slider */
.home-slider .swiper-slide {
border-radius: 10px;
}
.home-slider img {
object-fit: cover;
max-width: 100%;
border-radius: 10px;
}
.sugget-item .timer .countdown-container .seconds-bottom {
color: #fff;
background: var(--main-color-two);
}
.sugget-item .timer .countdown-container .countdown-heading {
font-size: 14px;
}
.sugget-item .timer .countdown-container .countdown-value {
font-size: 16px;
width: 35px;
height: 35px;
}
.sugget-item {
padding: 10px;
background: #fff;
box-shadow: var(--shadow-box);
border-radius: 10px;
min-height: 100%;
}
.sugget-slider {
margin-top: 10px;
height: 95%;
}
.sugget-item .image img {
display: block;
margin: 0 auto;
max-width: 250px;
}
.sugget-item .title {
border-bottom: 1px solid #eee;
padding-bottom: 5px;
}
.sugget-item .add a {
background-color: var(--main-color-two);
box-shadow: var(--shadow-md);
color: #fff;
font-weight: bold;
width: 60px;
height: 60px;
line-height: 60px;
padding: 7px 10px;
border-radius: 5px;
transition: 0.3s all ease-in-out;
}
.sugget-item .add a:hover {
background-color: #fff;
color: #515151;
}
/* end home-slider */
/* start mega menu */
.top-menu-parent{
position: relative;
}
.mega-menu {
background: transparent;
margin-top: 0px;
margin-bottom: 10px;
position: sticky;
top: 0;
z-index: 800;
box-shadow: none;
}
.top-menu-menu ul {
display: flex;
flex-direction: row;
align-items: center;
flex-wrap: wrap;
justify-content: center;
}
.top-menu-menu ul li {
margin-left: 20px;
}
.top-menu-menu>ul>li:hover .sub-menu {
opacity: 1;
visibility: visible;
}
.top-menu-menu ul > li > a {
font-size: 14px;
transition: 0.2s all ease-in-out;
-webkit-transition: 0.2s all ease-in-out;
-moz-transition: 0.2s all ease-in-out;
-ms-transition: 0.2s all ease-in-out;
-o-transition: 0.2s all ease-in-out;
color: var(--color-site);
}
.top-menu-menu ul>li>a.nav-active {
background-color: var(--main-color-one);
color: #fff !important;
padding: 4px 22px;
border-radius: 25px;
font-weight: normal !important;
}
.top-menu-menu ul>li>a.nav-active i{
color: #fff !important;
}
.top-menu-menu ul li a i {
margin-right: 4px;
font-size: 20px;
transition: 0.3s all ease-in;
}
.top-menu-menu ul li a i.bi-chevron-down::before {
transition: 0.3s all ease-in;
}
.top-menu-menu ul li a:hover .bi-chevron-down::before {
transform: rotate(180deg);
}
.top-menu-menu ul > li > a:hover {
color: var(--main-color-one);
}
.top-menu-menu ul > li > ul {
position: absolute;
align-items: flex-start;
top: 98%;
right: 0;
left: 0;
background: var(--bg-site);
display: flex;
flex-direction: column;
flex-wrap: wrap;
align-content: flex-start;
height: 300px;
padding: 20px 50px;
z-index: 10;
opacity: 0;
visibility: hidden;
transition: 0.2s all ease-in-out;
-webkit-transition: 0.2s all ease-in-out;
-moz-transition: 0.2s all ease-in-out;
-ms-transition: 0.2s all ease-in-out;
-o-transition: 0.2s all ease-in-out;
justify-content: flex-start;
}
.back-menu {
background-position: bottom left !important;
background-size: 300px !important;
}
.top-menu-menu ul>li>ul.back-menu-laptop {
background-position: bottom left;
background-size: 200px;
}
.top-menu-menu ul>li>ul>li {
display: inline;
margin-bottom: 7px;
margin-left: 6%;
}
.top-menu-menu ul>li>ul>li>a {
display: block;
transition: 0.3s all ease;
-webkit-transition: 0.3s all ease;
-moz-transition: 0.3s all ease;
-ms-transition: 0.3s all ease;
-o-transition: 0.3s all ease;
}
.top-menu-menu ul > li > ul > li > a.title {
color: var(--color-site);
font-weight: bold;
position: relative;
}
.top-menu-menu ul>li>ul>li>a.title i {
color: #333;
font-size: 10px;
font-weight: bold;
}
.top-menu-menu ul>li>ul>li>a.title::before {
content: '';
position: absolute;
right: -10px;
width: 2.5px;
height: 100%;
background: var(--main-color-one);
}
.top-menu-menu ul>li>ul>li>a:hover {
color: var(--main-color-one);
transform: translateX(-5px);
}
.top-menu-menu ul>li>ul>li>a.title:hover {
color: var(--main-color-one);
transform: none;
}
/* ///////////main menu /////////// */
.top-menu-menu ul.main-menu {
background: #fff;
display: none;
box-shadow: var(--shadow-md);
height: auto;
min-width: 200px;
min-height: 400px;
position: absolute;
top: 50px;
left: 20px;
right: 20px;
opacity: 0;
visibility: hidden;
padding: 0;
transition: 0.4s all ease-in-out;
border-radius: 0;
}
.top-menu-menu ul.main-menu.active {
display: flex;
left: 0;
right: 0;
}
.main-menu-head {
color: var(--main-color-one) !important;
}
.top-menu-menu ul.main-menu li {
width: 200px;
margin: 0;
padding: 15px 0;
border-radius: 10px;
}
.top-menu-menu ul.main-menu > li {
background-color: #f4f4f4;
border-radius: 0;
border-bottom: 1px dashed #d2d2d2d9;
}
/* .top-menu-menu ul.main-menu > li:nth-child(1){
border-top-color: transparent;
} */
.top-menu-menu ul.main-menu li a {
display: flex;
padding: 0 10px;
align-items: center;
}
.top-menu-menu ul.main-menu li a i {
vertical-align: baseline;
color: #333;
margin-left: 5px;
float: none;
transition: 0.3s all ease-in-out;
-webkit-transition: 0.3s all ease-in-out;
-moz-transition: 0.3s all ease-in-out;
-ms-transition: 0.3s all ease-in-out;
-o-transition: 0.3s all ease-in-out;
}
.top-menu-menu ul.main-menu li:hover {
background: #f3f3f3;
}
.top-menu-menu ul.main-menu li:hover i {
color: var(--main-color-one);
font-weight: bolder;
}
.top-menu-menu ul.main-menu>li>ul.main-menu-sub {
min-height: 400px;
max-height: 400px;
overflow-y: scroll;
min-width: 200px;
background: #fff;
position: absolute;
top: 0;
right: 200px;
opacity: 0;
visibility: hidden;
padding: 10px;
transition: 0.4s all ease-in-out;
border-radius: 10px;
}
.top-menu-menu ul.main-menu>li>ul.main-menu-sub li {
max-width: 150px;
margin-top: 4px;
padding: 5px 0;
}
.top-menu-menu ul.main-menu>li {
background-color: #eee;
border-radius: 0;
}
.main-menu-sub-active-li {
background: #fff;
border-bottom-left-radius: 50px;
border-top-left-radius: 50px;
}
.top-menu-menu ul.main-menu>li:hover {
box-shadow: var(--shadow-inner);
background: var(--main-color-two-shadow);
}
.top-menu-menu ul.main-menu>li:hover a {
color: #333;
}
.top-menu-menu ul.main-menu>li a i {
float: none;
}
.top-menu-menu ul.main-menu>li>ul.main-menu-sub li>a {
font-size: 13px !important;
color: var(--text-muted-two);
}
.top-menu-menu ul.main-menu>li>ul.main-menu-sub li>a:hover {
color: var(--main-color-one);
}
.top-menu-menu ul.main-menu>li>ul.main-menu-sub li>a.title {
color: #333333;
font-size: 16px;
font-weight: bold;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.top-menu-menu ul.main-menu>li>ul.main-menu-sub li>a.title i {
font-weight: bolder;
font-size: 14px;
}
.top-menu-menu ul.main-menu>li>ul.main-menu-sub li>a.title::before {
content: '';
position: absolute;
right: 0;
width: 2.5px;
height: 100%;
background: var(--main-color-one);
}
.top-menu-menu ul.main-menu>li>ul.main-menu-sub li:hover {
background: none;
}
.top-menu-menu li:hover ul.main-menu {
opacity: 1;
visibility: visible;
}
.top-menu-menu li:hover ul.main-menu:before{
content: '';
position: absolute;
top: 0;
bottom: 0;
right: 0;
width: 200px;
height: 100%;
background: #eee;
z-index: -1;
}
.main-menu-sub-active {
opacity: 1 !important;
visibility: visible !important;
}
.main-menu-sub-active-li>a {
color: #333 !important;
}
/* /////////// end main menu /////////// */
.top-menu-menu ul.level-one {
align-items: unset;
background-color: #fff;
box-shadow: var(--shadow-md);
height: auto;
min-width: 200px;
position: absolute;
top: 98%;
left: auto;
right: auto;
opacity: 0;
visibility: hidden;
padding: 0;
transition: 0.4s all ease-in-out;
border-radius: 10px;
}
.top-menu-menu ul.level-one li {
width: 100%;
margin: 0;
padding: 15px 0;
border-radius: 10px;
}
.top-menu-menu ul.level-one li a {
display: block;
padding: 0 10px;
}
.top-menu-menu ul.level-one li a i {
font-size: 14px;
vertical-align: middle;
color: #333;
float: left;
transition: 0.3s all ease-in-out;
-webkit-transition: 0.3s all ease-in-out;
-moz-transition: 0.3s all ease-in-out;
-ms-transition: 0.3s all ease-in-out;
-o-transition: 0.3s all ease-in-out;
}
.top-menu-menu ul.level-one li:hover {
background: var(--main-color-two);
}
.top-menu-menu ul.level-one li:hover i {
color: #fff;
font-weight: bolder;
}
.top-menu-menu ul.level-one li:hover a {
color: #fff;
}
.top-menu-menu ul.level-one>li>ul.level-two {
box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
height: auto;
min-width: 200px;
background: #fff;
position: absolute;
top: 0;
right: 100%;
opacity: 0;
visibility: hidden;
padding: 0;
transition: 0.4s all ease-in-out;
border-radius: 10px;
}
.top-menu-menu li:hover ul.level-one {
opacity: 1;
visibility: visible;
}
.top-menu-menu li ul li:hover ul.level-two {
opacity: 1;
visibility: visible;
}
.top-menu-menu li ul li:hover ul.level-two li a {
color: #333333;
}
.top-menu-menu li ul li:hover ul.level-two li:hover a {
color: #fff;
}
.top-menu-menu .nav-row {
min-width: 550px !important;
max-height: 520px !important;
}
.top-menu-menu .nav-row>li {
width: auto !important;
}
.top-menu-menu .nav-row>li:hover {
background: transparent;
}
.responsive-menu-icon {
height: 100%;
}
.responsive-menu-icon i {
font-size: 35px;
}
.rm-body {
position: relative;
}
.rm-overlay {
opacity: 0;
visibility: hidden;
position: fixed;
top: 0;
bottom: 0;
right: 0;
left: 0;
background: rgba(0, 0, 0, 0.6);
z-index: 8888;
transition: .8s all ease-in-out;
-webkit-transition: .8s all ease-in-out;
-moz-transition: .8s all ease-in-out;
-ms-transition: .8s all ease-in-out;
-o-transition: .8s all ease-in-out;
}
.rm-overlay.open {
opacity: 1;
visibility: visible;
}
.rm-items {
overflow-y: scroll;
padding: 20px 5px;
position: fixed;
top: 0;
bottom: 0;
right: -100%;
width: 0;
background: #fff;
z-index: 99999;
transition: .4s;
-webkit-transition: .4s all ease-in-out;
-moz-transition: .4s;
-ms-transition: .4s;
-o-transition: .4s;
}
.rm-items.open {
right: 0;
width: 320px;
}
.rm-item-close {
position: absolute;
top: 5px;
right: 5px;
}
.rm-item-close i {
color: #444;
font-size: 35px;
}
.rm-item-img {
text-align: center;
}
.rm-item-img img {
height: 70px;
max-width: 100%;
}
.rm-item-search {
margin: 10px 0;
}
.rm-item-search input.search-txt {
background: #d8d8d8;
}
.rm-item-menu ul {
height: auto;
width: 100%;
background: #fff;
}
.rm-item-menu li {
padding: 10px 0;
margin-bottom: 5px;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}
.rm-item-menu li i {
color: #222;
font-size: 14px;
font-weight: bold;
margin-left: 5px;
}
.rm-item-menu li i::before {
transition: 0.3s all ease;
}
.rm-item-menu li .showSubMenu.open i::before {
transform: rotate(270deg);
}
.rm-item-menu li a {
display: inline-block;
font-size: 14px;
padding: 0 10px;
color: #333333;
}
.rm-item-menu>li>ul>li {
border-bottom: 1px solid #ececec;
}
.rm-item-menu>li>ul>li:nth-last-child(1) {
border: none;
margin-bottom: 0;
}
.rm-item-menu>li>ul>li>a {
padding: 0 20px;
}
.rm-item-menu>li>ul>li>ul>li {
border-bottom: 1px solid #ececec;
}
.rm-item-menu>li>ul>li>ul>li:nth-last-child(1) {
border: none;
margin-bottom: 0;
}
.rm-item-menu>li>ul>li>ul>li>a {
padding: 0 30px;
}
.h-0 {
height: 0 !important;
opacity: 0;
visibility: hidden;
}
ul.show {
height: auto !important;
opacity: 1;
visibility: visible;
}
.showSubMenu {
cursor: pointer;
flex-grow: 1;
float: left;
display: block;
text-align: left;
}
.bg-ul-f7 {
background: #f7f7f7 !important;
}
/* end mega menu */
/* responsive menu */
.rm-overlay.open {
opacity: 1;
visibility: visible;
}
.rm-items {
overflow-y: scroll;
padding: 20px 5px;
position: fixed;
top: 0;
bottom: 0;
right: -100%;
width: 0;
background: #fff;
z-index: 99999;
/* transition: .4s;
-webkit-transition: .4s all ease-in-out;
-moz-transition: .4s;
-ms-transition: .4s;
-o-transition: .4s; */
}
.rm-items.open {
right: 0;
width: 320px;
}
.rm-item-search input.search-txt {
background: #d8d8d8;
}
.rm-item-menu ul {
height: auto;
width: 100%;
background: #fff;
-webkit-transition: all .5s ease;
-moz-transition: all .5s ease;
transition: all .5s ease;
}
.rm-item-menu li {
padding: 10px 0;
margin-bottom: 5px;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}
.rm-item-menu li i {
color: #222;
font-size: 14px;
font-weight: bold;
margin-left: 5px;
}
.rm-item-menu li i::before {
transition: 0.3s all ease;
-webkit-transition: 0.3s all ease;
-moz-transition: 0.3s all ease;
-ms-transition: 0.3s all ease;
-o-transition: 0.3s all ease;
}
.rm-item-menu li .showSubMenu.open i::before {
transform: rotate(270deg);
}
.rm-item-menu li a {
display: inline-block;
font-size: 14px;
padding: 0 10px;
color: #333;
}
.rm-item-menu>li>ul>li {
border-bottom: 1px solid #ececec;
}
.rm-item-menu>li>ul>li:nth-last-child(1) {
border: none;
margin-bottom: 0;
}
.rm-item-menu>li>ul>li>a {
padding: 0 20px;
}
.rm-item-menu>li>ul>li>ul>li {
border-bottom: 1px solid #ececec;
}
.rm-item-menu>li>ul>li>ul>li:nth-last-child(1) {
border: none;
margin-bottom: 0;
}
.rm-item-menu>li>ul>li>ul>li>a {
padding: 0 30px;
}
.h-0 {
display: none !important;
height: 0 !important;
}
ul.show {
display: flex !important;
height: auto !important;
}
.showSubMenu {
cursor: pointer;
flex-grow: 1;
float: left;
display: block;
text-align: left;
}
.bg-ul-f7 {
background: #f7f7f7 !important;
}
figure.avatar {
margin-bottom: 0;
height: 70px;
width: 70px;
padding: 2px;
background: #eeeff2;
border-radius: 50%;
position: relative;
}
figure.avatar img {
background: #fff;
width: 100%;
height: 100%;
display: block;
text-align: center;
border-radius: 50%;
}
.btn-action-cart{
position: relative;
}
.btn-action-cart span {
position: absolute;
top: 0;
right: 0;
transform: translate(50%,-50%);
height: 22px;
line-height: 22px;
font-size: 12px;
min-width: 22px;
background: #ff8a7e;
display: block;
text-align: center;
padding: 0 5px;
color: #fff;
border-radius: 11px;
box-shadow: 0 0 0 1px #fff;
-webkit-box-shadow: #fff 0 0 0 1px;
-webkit-animation-name: BasketBadge;
animation-name: BasketBadge;
-webkit-animation-duration: .4s;
animation-duration: .4s;
}
/* end mega menu */
/* feature */
.feature {
display: flex;
}
.feature-item {
padding: 10px;
background: #e9e7e7;
box-shadow: var(--shadow-inner);
transition: 0.3s all linear;
border-radius: 10px;
}
.feature-item .title h6 {
margin-top: 7px;
}
.feature-item.active {
background-color: var(--main-color-one);
color: #fff !important;
}
.feature-item.active .icon {
border-color: #fff;
}
.feature-item.active h6 {
color: #fff !important;
}
.feature-item:hover {
background-color: var(--main-color-one-shadow) !important;
color: var(--main-color-one-hover);
}
.feature-item:hover h6 {
color: var(--main-color-one-hover) !important;
}
.feature-item:hover .icon {
border-color: #fff;
}
.feature-item .icon {
width: 46px;
height: 46px;
display: flex;
justify-content: center;
align-items: center;
margin: auto;
padding: 5px;
border: 1px dashed #515151;
border-radius: 5px;
}
.feature-item .icon i {
font-size: 25px;
}
/* end feature */
/* start offer */
.offers {
padding: 20px 0;
}
.offer {
height: auto;
border-radius: 10px;
/* padding:10px 0 10px 10px; */
background: #fff;
position: relative;
box-shadow: 3px 3px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
}
.swiper-pagination-bullet-active {
background: var(--main-color-one);
width: 15px;
height: 7px;
border-radius: 10px;
}
.offer-item {
max-height: fit-content;
padding: 0 10px;
border-radius: 10px;
}
.offer-discount {
position: absolute;
top: 0;
right: 0;
overflow: hidden;
min-height: 100px;
min-width: 140px;
border-radius: 10px;
}
.offer-discount span {
border-radius: 0;
min-height: 30px;
min-width: 137px;
font-weight: 400;
margin: 0;
z-index: 9;
background-color: #e74c3c;
color: #fff;
width: 154px;
font-size: 16px;
position: absolute;
text-align: center;
padding: 30px 4px 4px;
right: -46px;
top: -15px;
transform: rotate(35deg);
line-height: 2;
display: block;
}
.offer-img {
width: 300px;
height: 400px;
text-align: center;
margin: auto;
}
.offer-img img {
width: 500px;
}
.offer-content {
text-align: center;
padding-bottom: 10px;
}
.offer-title {
display: inline-block;
margin-bottom: 10px;
padding: 10px;
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
background: #f0efef;
}
.offer-title h4 {
font-weight: bolder;
font-size: 16px;
}
.offer-title span {
color: var(--main-color-one);
}
.offer-desc {
width: 100%;
text-align: right;
}
.offer-desc h4 {
height: 65px;
font-size: 22px;
line-height: 35px;
font-weight: bold;
}
.se-title h5 {
font-size: 16px;
margin-bottom: 7px;
}
.se-title h6 {
font-size: 12px;
margin-bottom: 7px;
font-weight: normal;
}
.offer-desc-price {
margin: 10px auto;
}
.offer-desc-price .old {
font-size: 17px;
color: #c3c1c1;
text-decoration: line-through;
}
.offer-desc-price .new {
font-weight: bold;
font-size: 20px;
color: #009500;
}
.offer-timer {
display: flex;
flex-wrap: nowrap;
justify-content: center;
padding: 7px 0;
}
.offer-timer-item {
color: var(--main-color-one-shadow);
width: 60px;
height: 60px;
border: 1px solid #f8f8f8;
box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
padding: 5px;
margin: 0 5px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
border-radius: 50%;
}
.offer-timer-item .number {
font-weight: bold;
font-size: 16px;
}
.offer-btn {
margin: 22px 0;
}
.offer-item-link {
margin: 10px 10px;
max-height: 400px;
overflow-y: scroll;
padding: 10px 0 10px 10px;
}
.se-desc {
margin-top: 20px;
}
.se-desc h6 {
font-weight: bold;
font-size: 16px;
margin-bottom: 7px;
}
.se-desc ul {
margin-bottom: 10px;
list-style: none;
padding-right: 10px;
}
.se-desc ul li {
padding: 2px 0;
position: relative;
font-size: 14px;
}
.se-desc ul li::before {
content: "\f28a";
font-size: 8px;
font-family: bootstrap-icons, serif !important;
color: #000;
vertical-align: middle;
margin-left: 2px;
line-height: 18px;
}
.offer-item-link .swiper-slide {
width: 100% !important;
}
.offer-item-link .swiper-wrapper {
flex-direction: column !important;
transform: translate3d(0px, 0px, 0px) !important;
}
.offer-item-link-item {
margin-bottom: 10px;
background: #f4f5f9;
padding: 15px 20px;
cursor: pointer;
border-radius: 7px;
}
.offer-item-link-item h6 {
font-size: 14px;
font-weight: normal;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.offer-item-link .swiper-slide-thumb-active .offer-item-link-item {
border-right: 4px solid var(--main-color-one-shadow);
}
.swiper-slide:not(.swiper-slide-active) .offer-item {
opacity: 0;
}
.offer-item .countdown-container .countdown-value {
width: 50px;
height: 50px;
font-size: 16px;
border-radius: 50%;
}
.offer-item .countdown-container .countdown-heading {
font-size: 16px;
}
/* end offer */
/* start amazing */
.amazing {
/*background: var(--main-color-two) url('../image/patterns.png');*/
background-image: url('../image/patterns.png');
}
.free-mode .swiper-slide {
width: auto;
}
/* end amazing */
/* start fresh */
.fresh .parent {
background: var(--main-color-one) url('../image/patterns.png');
}
.fresh .left img {
border: 3px dotted #cbcbcb;
}
/* end fresh */
/* product banner */
.prodcut-banner-item {
background: url('../image/wave-card.svg') no-repeat center center;
background-size: 500px;
padding: 10px;
border-radius: 10px;
}
/* end product banner */
/* start main category */
.main-category {
padding: 20px 0;
}
.main-category .parent {
padding: 20px 20px;
}
.main-category-item {
margin: 30px 0;
text-align: center;
}
.main-category-title {
margin-bottom: 10px;
display: flex;
}
.main-title {
padding: 10px 45px 10px 10px;
position: relative;
font-size: 30px;
font-weight: 900;
border-radius: 25px;
}
.main-title::before {
content: '';
position: absolute;
right: 5px;
top: 50%;
transform: translateY(-50%);
width: 35px;
height: 8px;
border-radius: 5px;
background: var(--main-color-one);
}
.slider-title {
color: #fff;
text-align: right !important;
flex-grow: 1;
font-size: 20px;
position: relative;
padding-bottom: 15px;
margin-bottom: 10px;
font-weight: 900 !important;
}
.slider-title::before {
content: '';
position: absolute;
bottom: 0;
right: 0;
width: 100px;
height: 2px;
background: var(--main-color-one-shadow);
z-index: 2;
}
.slider-title::after {
content: '';
position: absolute;
bottom: 0;
right: 0;
width: 100%;
height: 2px;
background: linear-gradient(to left, #e8e8e8 0%, rgba(236, 236, 236, 0) 100%);
z-index: 1;
}
.main-category .item {
border: 1px solid transparent;
transition: 0.3s all ease-in-out;
text-align: center;
position: relative;
padding: 10px;
border-radius: 5px;
/*background: #a3e8ff24;*/
box-shadow: var(--shadow-inner);
}
.main-category .item:hover {
background: #f8f8f8;
box-shadow: var(--shadow-box);
border: 1px solid #ccc;
}
.main-category .item:hover .hover span {
background: var(--main-color-one) !important;
}
.main-category .item .hover {
position: absolute;
top: 5px;
right: 5px;
}
/* end main category */
/* product box */
.product-box .parent {
background: #fff;
padding: 20px;
box-shadow: var(--shadow-box);
border-radius: 10px;
}
.product-box .content-title {
position: relative;
display: flex;
justify-content: space-between;
}
.product-box .content-title::after {
content: '';
position: absolute;
top: 50%;
left: 0;
width: 100%;
height: 2px;
background: linear-gradient(to left, var(--main-color-one) 0%, rgba(236, 236, 236, 0) 100%);
z-index: 1;
}
.product-box .content-title .item {
background: #fff;
padding-left: 20px;
display: flex;
align-items: center;
justify-content: space-between;
z-index: 2;
}
.product-box .content-title .item:nth-last-child(1) {
padding-left: 0;
padding-right: 20px;
}
.product-box .content-title .item:nth-last-child(1) i {
margin-left: 5px;
}
.product-box .content-title .item .title {
font-size: 20px;
font-weight: bold;
color: var(--back-color);
}
.product-box .content-title .item .title {
font-size: 20px;
font-weight: bold;
color: var(--back-color);
}
.product-box .content-title .item svg {
margin-left: 5px;
color: var(--main-color-one);
}
.product-box-item {
width: 250px;
box-shadow: var(--shadow-box);
margin: 10px 0;
overflow: hidden;
border-radius: 10px;
z-index: 1;
position: relative;
border: 1px solid #ddd;
max-width: 100%;
}
.product-box-item::before {
content: '';
width: 160px;
height: 150px;
position: absolute;
bottom: -20%;
right: -20%;
background-color: var(--main-color-one-shadow);
border: 6px solid #e6e4e476;
border-radius: 50%;
z-index: -1;
}
.product-box-item .image img {
display: block;
margin: auto;
width: 170px;
height: 170px;
object-fit: contain;
border-radius: 10px;
}
.product-box-item .two-image {
z-index: -1;
position: absolute;
top: 0;
right: 0;
left: 0;
visibility: hidden;
opacity: 0;
transition: transform 1.5s, visibility .5s, opacity .5s;
-webkit-transition: transform 1.5s, visibility .5s, opacity .5s;
-moz-transition: transform 1.5s, visibility .5s, opacity .5s;
-ms-transition: transform 1.5s, visibility .5s, opacity .5s;
-o-transition: transform 1.5s, visibility .5s, opacity .5s;
}
.product-box-item:hover .one-image {
opacity: 0;
visibility: hidden;
}
.product-box-item:hover .two-image {
visibility: visible;
opacity: 1;
display: block;
transform: scale(1.15);
}
.product-box-item .desc {
padding: 10px;
}
.product-box-item .desc .title .title-fa {
font-size: 15px;
margin-bottom: 10px;
line-height: 25px;
height: 50px;
overflow: hidden;
font-weight: 800 !important;
}
#productModal img{
border: 1px solid #ccc;
}
.product-box-item .desc .title .title-en {
font-size: 12px;
margin-bottom: 10px;
height: 30px;
overflow: hidden;
}
.product-box-item .foot .add,
.product-box-item .foot .see-fast {
display: flex;
align-items: center;
justify-content: center;
background-color: #fff;
box-shadow: var(--shadow-md);
color: var(--color-site);
font-weight: bold;
width: 40px;
height: 40px;
line-height: 30px;
padding: 7px 10px;
border-radius: 5px;
transition: 0.3s all ease-in-out;
}
.product-box-item .foot .add:hover,
.product-box-item .foot .see-fast:hover {
background-color: var(--main-color-one);
color: #fff;
}
.product-box-item .title {
text-align: right;
}
.brand-box .swiper-slide .image {
box-shadow: var(--shadow-box);
border-radius: 10px;
transition: 0.3s all ease-in-out;
padding: 20px;
}
.brand-box .swiper-slide .image:hover {
box-shadow: rgba(1, 166, 226, 0.569) 0 0 10px 0 !important;
}
.brand-box .swiper-slide .image:hover img {
filter: grayscale(0);
-webkit-filter: grayscale(0);
}
.brand-box .swiper-slide .image img {
transition: 0.3s all ease-in-out;
width: 150px;
filter: grayscale(100%);
-webkit-filter: grayscale(100%);
-webkit-transition: 0.3s all ease-in-out;
-moz-transition: 0.3s all ease-in-out;
-ms-transition: 0.3s all ease-in-out;
-o-transition: 0.3s all ease-in-out;
}
.brand-box .swiper-button-next,
.brand-box .swiper-button-prev {
top: 70% !important;
}
.product-box-item:hover .hover {
opacity: 1;
visibility: visible;
}
.product-box-item .hover {
opacity: 0;
visibility: hidden;
position: absolute;
top: 0;
width: 100%;
display: flex;
justify-content: space-between;
padding: 10px;
transition: 0.3s all ease-in-out;
-webkit-transition: 0.3s all ease-in-out;
-moz-transition: 0.3s all ease-in-out;
-ms-transition: 0.3s all ease-in-out;
-o-transition: 0.3s all ease-in-out;
}
.product-box-item .hover .hover-btn {
order: 2;
display: flex;
flex-direction: column;
}
.product-box-item .hover .hover-btn a {
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 5px;
background: white;
color: var(--color-site);
padding: 5px 10px;
box-shadow: var(--shadow-md);
border-radius: 5px;
}
.product-box-item .hover .hover-color {
display: flex;
flex-direction: column;
order: 1;
}
.product-box-item .hover .hover-color span {
border: 1px solid #aaa;
margin-bottom: 5px;
width: 10px;
height: 10px;
border-radius: 50%;
}
/* end product box */
/* product-box-two */
.product-box-two .parents {
background-image: url('../image/patern2.png');
padding: 20px;
box-shadow: var(--shadow-box);
border-radius: 10px;
}
.product-row {
padding: 20px;
margin: 10px 0;
position: relative;
z-index: 1;
border: 1px solid #eee;
flex-wrap: wrap;
}
.product-row::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 1rem;
opacity: .4;
z-index: -1;
background: #fff url('../image/wave-card.svg') no-repeat center center;
background-size: cover;
}
.product-row .image,
.product-row .imagea {
width: 44%;
text-align: center;
height: 100px;
}
.product-row .desc,
.product-row .desca {
width: 48%;
}
.product-row .desca {
padding: 10px;
}
.product-row .desca .title {
padding: 0;
}
.product-row .desca .title::before {
visibility: hidden;
}
.product-row .desc .title {
height: 25px;
}
.product-box-two .content-title {
position: relative;
}
.product-box-two .content-title::before {
content: '';
position: absolute;
bottom: 40%;
left: 0;
width: 100%;
height: 2px;
background: linear-gradient(to left, #eee 0%, rgba(236, 236, 236, 0) 100%);
z-index: 1;
}
.product-box-two .content-title .item {
padding-left: 20px;
display: flex;
align-items: center;
justify-content: space-between;
z-index: 2;
color: #fff;
}
.product-box-two .content-title .item:nth-last-child(1) {
padding-left: 0;
padding-right: 20px;
}
/* end product-box-two */
/* product box three */
.product-box-three .content-title {
position: relative;
display: flex;
justify-content: space-between;
margin-bottom: 10px;
}
.product-box-three .content-title .item {
padding-left: 20px;
display: flex;
align-items: center;
justify-content: space-between;
z-index: 2;
}
.product-box-three .content-title .item:nth-last-child(1) {
padding-left: 0;
padding-right: 20px;
}
.product-box-three .content-title .item .title {
font-size: 16px;
font-weight: bold;
color: #fff;
}
.product-box-three .content-title .item svg {
margin-left: 5px;
color: #fff;
}
.product-box-three .parent {
position: relative;
padding: 20px 20px;
}
.product-box-three .parent::before {
content: "";
float: right;
position: absolute;
height: 100%;
top: 0;
right: 0;
/*background: var(--main-color-one);*/
width: 50%;
border-radius: 90px 20px 20px 90px;
box-shadow: var(--shadow-box);
z-index: -1;
}
.product-box-three .parent::after {
content: "";
float: right;
position: absolute;
height: 100%;
bottom: 0;
left: 0;
/*background: var(--main-color-two);*/
width: 45%;
border-radius: 20px 90px 90px 20px;
box-shadow: var(--shadow-box);
z-index: -1;
}
/* end product box three */
/* start blogbox */
.image-blog {
transition: 0.3s;
box-shadow: var(--shadow-md);
position: relative;
display: flex;
justify-content: center;
color: #fff;
border-radius: 10px;
}
.image-blog::after {
content: '';
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
border-radius: 10px;
background: linear-gradient(rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.895) 100%);
}
.blog-box .image-blog:hover {
transform: translateY(-10px);
}
.image-blog img {
object-fit: cover;
width: 100%;
border-radius: 10px;
max-height: 250px;
max-width: 250px;
}
.blog-desc {
padding: 10px;
z-index: 10;
width: 100%;
}
/* end blogbox */
/* responsive menu */
.rm-overlay.open {
opacity: 1;
visibility: visible;
}
.rm-items {
overflow-y: scroll;
padding: 20px 5px;
position: fixed;
top: 0;
bottom: 0;
right: -100%;
width: 0;
background: #fff;
z-index: 99999;
}
.rm-items.open {
right: 0;
width: 320px;
}
.rm-item-search input.search-txt {
background: #d8d8d8;
}
.rm-item-menu ul {
height: auto;
width: 100%;
background: #fff;
}
.rm-item-menu li {
padding: 10px 0;
margin-bottom: 5px;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}
.rm-item-menu li i {
color: #222;
font-size: 14px;
font-weight: bold;
margin-left: 5px;
}
.rm-item-menu li i::before {
transition: 0.3s all ease;
}
.rm-item-menu li .showSubMenu.open i::before {
transform: rotate(270deg);
}
.rm-item-menu li a {
display: inline-block;
font-size: 14px;
padding: 0 10px;
color: #333;
}
.rm-item-menu > li > ul > li {
border-bottom: 1px solid #ececec;
}
.rm-item-menu > li > ul > li:nth-last-child(1) {
border: none;
margin-bottom: 0;
}
.rm-item-menu > li > ul > li > a {
padding: 0 20px;
}
.rm-item-menu > li > ul > li > ul > li {
border-bottom: 1px solid #ececec;
}
.rm-item-menu > li > ul > li > ul > li:nth-last-child(1) {
border: none;
margin-bottom: 0;
}
.rm-item-menu > li > ul > li > ul > li > a {
padding: 0 30px;
}
.h-0 {
display: none !important;
height: 0 !important;
}
ul.show {
display: flex !important;
height: auto !important;
}
.showSubMenu {
cursor: pointer;
flex-grow: 1;
float: left;
display: block;
text-align: left;
}
.bg-ul-f7 {
background: #f7f7f7 !important;
}
/* end responsive menu */
/* login modal */
.auth .modal-content::before {
content: '\F4E1';
background: #fff;
color: #515151;
width: 100px;
height: 100px;
text-align: center;
border-radius: 50%;
box-shadow: var(--shadow-md);
font-family: 'bootstrap-icons', serif;
position: absolute;
top: -10%;
left: 50%;
font-size: 70px;
transform: translateX(-50%);
}
.auth{
background-color: #fff;
}
.auth .auth-content {
position: relative;
}
.auth-content::before {
content: '\F4E1';
background: #fff;
color: #515151;
width: 100px;
height: 100px;
border: 1px solid #eee;
text-align: center;
border-radius: 50%;
box-shadow: var(--shadow-md);
font-family: 'bootstrap-icons', serif;
position: absolute;
top: -15%;
left: 50%;
font-size: 70px;
transform: translateX(-50%);
}
.auth .divider {
position: relative;
padding-bottom: 15px;
display: flex;
justify-content: center;
align-items: center;
}
.auth .divider span {
background: #fff;
padding: 10px 20px;
z-index: 2;
}
.auth .divider::before {
content: '';
position: absolute;
top: 50%;
width: 100%;
border: 1px solid #efefef;
z-index: 1;
}
.float-input {
border: none;
border-bottom: 1px solid #ddd;
border-radius: 0;
}
.float-input:focus {
box-shadow: none;
}
/* end login modal */
/* start page product */
.product-variable .box {
position: relative;
margin-bottom: 10px;
}
.product-variable .box .box-item {
width: 100%;
border: 1px solid var(--border-muted);
padding: 5px 5px;
border-radius: 5px;
}
.product-variable .box .box-label {
position: absolute;
top: -15px;
background: #fff;
margin-right: 15px;
padding: 0 10px;
font-size: 12px;
border-radius: 5px;
}
.product-gallery-thumb {
margin: 10px 0;
border: 1px solid #eee;
padding: 10px;
}
.product-gallery-thumb .swiper-slide img {
height: 70px;
opacity: .6;
cursor: pointer;
border: 1px solid #dddd;
border-radius: 5px;
transition: 0.3s all ease-in-out;
}
.product-gallery-thumb .swiper-slide-thumb-active img {
border-color: var(--main-color-one-shadow);
opacity: 1;
}
.product-gallery .swiper-button-next,
.product-gallery .swiper-button-prev {
top: 70% !important;
}
.border-right-product {
border-right: 1px solid #eeeeeea7;
}
.summary-offer {
position: absolute;
top: 0;
right: -10px;
background: #e74c3c;
border-radius: 100% 50% 50% 100%/75% 69% 69% 75%;
width: 60px;
height: 60px;
line-height: 60px;
color: #fff;
font-weight: bold;
font-size: 18px;
text-align: center;
box-sizing: border-box;
box-shadow: 0 5px 15px #e74c3c57;
z-index: 10;
}
.product-meta .title h6 {
padding: 5px 0;
border-bottom: 1px dashed #ccc;
}
.product-gallery img {
max-width: 100%;
border: 1px solid #eee;
}
/* end page product */
/* bootstrap touch spin */
.bootstrap-touchspin-down,
.bootstrap-touchspin-up {
height: 100%;
width: 40px;
border: 0;
outline: none;
font-weight: bold;
background: var(--main-color-two);
box-shadow: var(--shadow-box);
color: #fff;
border-top-right-radius: 10px;
border-bottom-left-radius: 10px;
}
.form-counter {
width: 60px;
height: 30px;
text-align: center;
font-weight: bold;
border: 0;
background: #fff;
box-shadow: var(--shadow-box);
border-radius: 10px;
}
.form-counter:focus {
border: none;
outline: none;
}
/* end bootstrap touchspin */
/* color box */
.color-box {
display: flex;
align-items: center;
justify-content: flex-start;
flex-wrap: wrap;
}
.color-box-item {
margin-left: 5px;
width: 30px;
height: 30px;
padding: 2px;
background: #fff;
border: 1px solid #c0c0c0;
border-radius: 50%;
}
.color-box-item.active {
border: 2px solid #0f58e0;
transform: scale(1.2);
}
.color-box-item.active span {
position: relative;
}
.color-box-item.active span::before {
content: '\F26E';
color: #fff;
font-size: 22px;
font-family: 'bootstrap-icons', serif !important;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.color-box-item .color {
cursor: pointer;
display: block;
background: red;
width: 100%;
height: 100%;
border-radius: 50%;
}
/* end color box */
/* start product-descs */
.product-desc {
position: relative;
}
.product-desc-tab {
padding-bottom: 10px;
border-bottom: 1px solid #eee;
background: #fff;
overflow-x: scroll;
-ms-overflow-style: none;
/* IE and Edge */
scrollbar-width: none;
/* Firefox */
}
.product-desc-tab::-webkit-scrollbar {
display: none;
}
/* .product-desc-tab ul {
min-width: 450px;
flex-wrap: nowrap;
} */
.product-desc-tab ul li {
margin-left: 5px;
margin-bottom: 10px;
}
.product-desc-tab ul li button {
border: none;
height: 100%;
color: #515151;
outline: none;
box-shadow: none;
background: #ddd;
}
.product-desc-tab ul li button{
display: block;
padding: 10px;
white-space: nowrap;
color: var(--color-site);
}
.product-desc-tab ul li button.active {
height: 100%;
box-shadow: var(--shadow-inner);
border-top: 3px solid var(--main-color-one);
outline: none;
background: #fff;
transition: 150ms border-top linear;
-webkit-transition: 150ms border-top linear;
-moz-transition: 150ms border-top linear;
-ms-transition: 150ms border-top linear;
-o-transition: 150ms border-top linear;
}
.product-desc-tab ul li button.active {
color: var(--accent-color);
background: var(--back-color);
}
.product-desc-tab ul li button.active *{
color: var(--accent-color);
}
.product-desc-tab ul li button i {
margin-left: 5px;
}
.product-desc-tab-content {
padding: 20px 0;
}
.product-desc-tab-content table tr th {
width: 200px;
}
.product-desc-tab-content table tr td {
padding: 12px 0;
}
.tab-title {
font-size: 18px;
color: #505050;
text-align: center;
font-weight: 600;
line-height: 1.7;
}
.product-desc-content {
padding: 20px 0;
line-height: 2.2;
}
.product-desc-content img {
max-width: 100%;
display: block;
margin: 0 auto;
}
.table-product {
--bs-table-striped-bg: rgb(0 0 0 / 3%);
}
.comment {
padding: 20px;
border-radius: 10px;
}
.comment .avatar img {
width: 40px;
height: 40px;
}
.star i.bi-star {
color: #ddd;
}
.star i.bi-star-fill {
color: #f7ad0d;
}
.star i.bi-star-half {
color: #f7ad0d;
}
.positive-nav ul li {
position: relative;
padding-right: 10px;
}
.comment .comment-rates .positive {
background: #28ff3a3c;
padding: 10px 20px;
box-shadow: var(--shadow-box);
}
.positive-nav ul li::before {
content: '';
position: absolute;
top: 50%;
right: 0;
transform: translateY(-50%);
width: 7px;
height: 7px;
background: #0d9a00;
border-radius: 50%;
}
.positive-nav ul li:nth-child(1)::before {
background: transparent;
}
.negitive-nav ul li {
position: relative;
padding-right: 10px;
}
.comment .comment-rates .negitive {
background: #ff28283c;
padding: 0 20px;
box-shadow: var(--shadow-box);
}
.negitive-nav ul li::before {
content: '';
position: absolute;
top: 50%;
right: 0;
transform: translateY(-50%);
width: 7px;
height: 7px;
background: #d03404;
border-radius: 50%;
}
.negitive-nav ul li:nth-child(1)::before {
background: transparent;
}
.comment-reply {
padding: 20px 0;
}
/* end product-descs */
/* read more */
/* مخفی کردن متن کامل به صورت پیشفرض */
.read-more-full {
display: none;
visibility: hidden;
opacity: 0;
max-height: 0;
transition: all 0.3s ease;
}
/* نمایش خلاصه */
.read-more-summary {
display: block;
}
/* وقتی روی دکمه "بیشتر" کلیک شود */
.read-more-state:checked ~ .read-more-wrap .read-more-summary {
display: none;
visibility: hidden;
opacity: 0;
max-height: 0;
}
.read-more-state:checked ~ .read-more-wrap .read-more-full {
display: block;
visibility: visible;
opacity: 1;
max-height: 999em;
}
/* ظاهر دکمه بیشتر/بستن */
.read-more-trigger {
cursor: pointer;
display: inline-block;
margin-top: 15px;
padding: 5px 10px;
color: var(--main-color-one-shadow);
background-color: var(--main-color-one-light);
border: 1px solid var(--main-color-one-shadow);
border-radius: 4px;
font-size: 0.9em;
font-weight: bold;
text-align: center;
transition: background-color 0.3s ease, color 0.3s ease;
max-height: 0;
overflow: hidden;
display: inline;
transition: .3s ease;
}
/* تغییر متن دکمه بر اساس وضعیت */
.read-more-state ~ .read-more-trigger:before {
content: 'بیشتر +';
}
.read-more-state:checked ~ .read-more-trigger:before {
content: 'بستن _';
}
.read-more-state:checked ~ .read-more-wrap .read-more-target {
opacity: 1;
max-height: none;
}
.read-more-state:checked ~ .read-more-wrap .read-more-dots {
display: none;
}
/* end read more */
/* rating */
.rating {
border: none;
}
.rating:not(:checked) > input {
position: absolute;
/* top:-9999px; */
clip: rect(0, 0, 0, 0);
}
.rating:not(:checked) > label {
float: right;
width: 1em;
padding: 0 .1em;
overflow: hidden;
white-space: nowrap;
cursor: pointer;
font-size: 200%;
line-height: 1.2;
color: #ddd;
}
.rating:not(:checked) > label:before {
content: '★ ';
}
.rating > input:checked ~ label {
color: #e5c406;
}
.rating:not(:checked) > label:hover,
.rating:not(:checked) > label:hover ~ label {
color: gold;
}
.rating > input:checked + label:hover,
.rating > input:checked + label:hover ~ label,
.rating > input:checked ~ label:hover,
.rating > input:checked ~ label:hover ~ label,
.rating > label:hover ~ input:checked ~ label {
color: #ea0;
}
.rating > label:active {
position: relative;
}
.se-cart {
background: var(--bs-gray-100);
background-size: cover;
border: 1px solid #eee;
box-shadow: var(--shadow-sm);
padding: 10px;
border-radius: 10px;
}
.scd-item {
display: block;
margin-bottom: 7px;
font-size: 14px;
line-height: 1.5;
}
.scd-item i {
font-size: 18px;
}
.scd-item a,
.scd-item .link {
color: #515115;
}
.se-cart-price-old {
color: #4a4a4a;
text-decoration: line-through;
margin-left: 5px;
}
.se-cart-price-new {
color: #04ac12;
font-size: 20px;
font-weight: bold;
}
.se-cart-item {
padding: 15px 0;
}
.se-cart-item:not(:last-child) {
border-bottom: 1px solid #ddd;
}
/* end rating */
/* start product rating */
.product-rateing .title {
padding-bottom: 20px;
}
.product-rateing .number {
text-align: center;
padding: 20px 30px;
border: 1px solid #ccc;
border-radius: 10px;
}
.product-rateing .number h2 {
margin: 30px 0;
color: #333;
font-size: 40px;
}
.product-rateing .number .star {
padding: 5px;
background: #dddddd5b;
border-radius: 10px;
}
.product-rateing .number .star .bi-star {
color: #bbb;
}
.product-rateing .number .star .bi-star-fill {
color: rgb(246, 130, 5);
}
.product-rateing .prog-rating {
padding: 20px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
border: 1px solid #eee;
border-radius: 10px;
}
.product-rateing .prog-rating .right {
flex: 0 0 calc(10% - 10px);
max-width: calc(10% - 10px);
}
.product-rateing .prog-rating .center {
flex: 0 0 calc(80% - 10px);
max-width: calc(80% - 10px);
}
.product-rateing .prog-rating .left {
flex: 0 0 calc(10% - 10px);
max-width: calc(10% - 10px);
}
.product-rateing .prog-rating .center .progress {
margin-bottom: 3px;
}
/* end procut rating */
/* end page product */
/* start page category */
/* start item box */
.item-boxs {
position: relative;
top: 0;
}
.item-box {
box-shadow: var(--shadow-box);
margin-bottom: 20px;
border-radius: 10px;
background-color: #fff;
}
.item-box .title {
position: relative;
width: 100%;
padding: 10px 20px 10px 10px;
}
.item-box .title a i.bi-chevron-down::before {
transition: 0.3s all ease-in-out;
-webkit-transition: 0.3s all ease-in-out;
-moz-transition: 0.3s all ease-in-out;
-ms-transition: 0.3s all ease-in-out;
-o-transition: 0.3s all ease-in-out;
}
.item-box .title a.collapsed i.bi-chevron-down::before {
transform: rotate(180deg);
}
.item-box .title::before {
content: '';
position: absolute;
top: 50%;
right: 5px;
transform: translateY(-50%);
border-radius: 50%;
width: 10px;
height: 10px;
background-color: var(--main-color-one);
}
.item-box .desc {
padding: 15px 10px;
background-color: #fbf8f877;
box-shadow: var(--shadow-sm);
}
/* end item box */
/* filter items */
.filter-items {
margin-bottom: 20px;
background: #fff;
padding: 20px 10px;
border-radius: 10px;
}
.filter-items .items {
display: block;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
}
.filter-items .items .link a {
color: var(--color-site);
font-size: 14px;
padding: 2px 10px;
border-radius: 25px;
}
.filter-items .items .link a:hover {
background: #eee;
}
.filter-items .items .link a.active {
background: var(--main-color-one);
color: #fff;
}
.filter-items .count p {
font-size: 15px;
}
/* end filter-items */
/* start my paginate */
.my-paginate ul {
flex-wrap: wrap;
}
.my-paginate li {
margin-left: 5px;
margin-bottom: 5px;
}
.my-paginate li.disabled a {
background: #eee;
}
.my-paginate li.disabled a i {
color: #a0a0a096;
}
.my-paginate li a {
box-shadow: var(--shadow-inner);
font-weight: bold;
padding: 5px 15px;
color: #515151;
background: #faf9f9;
}
.my-paginate li a i {
color: #515151;
}
/* end my paginate */
/* new category */
.new-category .item {
display: flex;
transition: 0.3s all ease-in-out;
flex-direction: column;
width: 130px;
padding: 10px;
border-radius: 7px;
box-shadow: var(--shadow-box);
background-color: #fff;
}
.new-category .item:hover {
background-color: #eeeeee;
}
.new-category .item .icon {
display: inline;
padding: 7px;
border: 1px dashed #aaa;
}
.new-category .item i {
font-size: 32px;
color: var(--main-color-one);
}
.new-category .title {
position: relative;
}
.new-category .title::before {
content: '';
position: absolute;
right: -10px;
top: 50%;
transform: translateY(-50%);
background: var(--main-color-one);
width: 3px;
height: 20px;
}
/* end category */
/* start page cart */
/* start main table */
.responsive-table > table {
width: 100%;
border-collapse: collapse;
-webkit-overflow-scrolling: touch;
}
.responsive-table {
overflow-x: auto;
padding: 5px;
}
.main-table {
margin-bottom: 0;
padding: 10px;
border-collapse: collapse;
border-radius: 10px;
border-style: hidden;
}
.main-table th {
padding: 20px 0;
font-size: 14px;
vertical-align: middle;
text-align: center;
}
.main-table tr {
vertical-align: middle;
}
.main-table tr td.title {
max-width: 280px;
min-width: 280px;
}
.main-table tr td.counter {
max-width: 180px;
min-width: 180px;
}
/* end main table */
/* start line step */
.line-step-container {
margin-bottom: 20px;
overflow: hidden;
padding: 10px 5px;
border-radius: 10px;
}
.line-step {
position: relative;
display: flex;
align-items: center;
}
.line-step::before {
display: block;
content: '';
position: absolute;
width: 100%;
height: 10px;
background: #e9e9e9;
border-radius: 10px;
}
.line-step-boxs {
width: 100%;
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
}
.line-step-boxs::before {
z-index: 3;
content: '';
width: 20px;
height: 20px;
background: #ccc;
box-shadow: var(--shadow-md);
border-radius: 50%;
position: absolute;
right: -1px;
top: 50%;
transform: translateY(-50%);
}
.line-step-boxs::after {
z-index: 3;
content: '';
width: 20px;
height: 20px;
background: #ccc;
box-shadow: var(--shadow-md);
border-radius: 50%;
position: absolute;
left: -1px;
top: 50%;
transform: translateY(-50%);
}
.line-step-box {
width: 33.33%;
text-align: center;
position: relative;
z-index: 2;
overflow: hidden;
}
.line-step-box.disabled .icon i {
color: #ccc;
}
.line-step-box.disabled p {
color: #ccc;
}
.line-step-box.complete .icon {
background: var(--main-color-one);
}
.line-step-box.complete .icon i {
color: #fff;
}
.line-step-box.complete::before {
content: '';
width: 50%;
height: 10px;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
background-color: var(--main-color-one);
z-index: -1;
border-radius: 0;
}
.line-step-box .icon {
display: flex;
align-items: center;
justify-content: center;
margin: 30px auto 10px;
width: 50px;
height: 40px;
line-height: 4px;
background: #fff;
box-shadow: rgb(0 0 0 / 10%) 0 0 10px 0 !important;
border-radius: 5px;
}
.line-step-box .icon i {
font-size: 16px;
color: var(--main-color-one);
}
.line-step-box p {
font-size: 14px;
margin-top: 15px;
font-weight: bold;
}
/* end line step */
.cart-action {
background-color: #ddd;
padding: 20px;
box-shadow: 0 0px 5px var(--main-color-one-hover);
border-radius: 10px;
}
.cart-detail {
border: 1px solid var(--main-color-one-shadow);
border-radius: 10px;
padding: 5px;
}
.cart-detail .cart_item {
border-top: 1px solid var(--main-color-one);
}
.cart-detail .cart_item .variation .variation- {
float: right;
margin: 0;
}
.cart-detail .cart_item .variation > :nth-child(odd) {
text-align: center;
width: fit-content;
}
.cart-detail .cart_item .variation > :nth-child(even) {
text-align: right;
width: 80%;
padding: 0 10px;
}
/* end page cart */
/* start page payment */
/* start alert box */
.alert-box {
position: relative;
text-align: center;
width: 100%;
background-color: #fff;
box-shadow: var(--shadow-box);
padding: 20px;
border-radius: 10px;
}
.alert-box.ab-success {
border-top: 20px solid #0fcd58;
position: relative;
}
.alert-box.ab-nsuccess {
border-top: 20px solid #f04f3a;
position: relative;
}
.alert-box.ab-success::before {
content: '\F633';
background: #0fcd58;
color: #fff;
width: 100px;
height: 100px;
text-align: center;
border: 2px solid #02cd50;
border-radius: 50%;
box-shadow: 0 5px 15px #0fcd58;
font-family: 'bootstrap-icons', serif;
position: absolute;
top: -30%;
left: 50%;
font-size: 70px;
transform: translateX(-50%);
}
.alert-box.ab-nsuccess::before {
content: '\F62A';
background: #f04f3a;
color: #fff;
width: 100px;
height: 100px;
text-align: center;
border: 2px solid #e33c26;
border-radius: 50%;
box-shadow: 0 5px 15px #f04f3a;
font-family: 'bootstrap-icons', serif;
position: absolute;
top: -30%;
left: 50%;
font-size: 70px;
transform: translateX(-50%);
}
.alert-box .title {
padding: 20px 0;
position: relative;
}
.alert-box .title::before {
content: '';
background: #ccc;
width: 140px;
height: 2px;
position: absolute;
bottom: 5px;
left: 50%;
transform: translateX(-50%);
}
.alert-box.ab-success .title h5 {
font-size: 25px;
color: #02cd50;
}
.alert-box.ab-nsuccess .title h5 {
font-size: 25px;
color: #f04f3a;
}
.alert-box .desc {
margin: 10px 0;
}
.alert-box .action {
padding: 10px 0;
}
/* end alert box */
/* end page payment */
/* start page 404 */
.not-found {
background-image: url('../image/404.gif');
background-repeat: no-repeat;
background-position: center;
height: 400px;
text-align: center;
}
.not-found .title h1 {
font-size: 50px;
margin: 10px 0;
text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;
}
/* end page 404 */
/* start page compare */
.compare-title {
padding: 10px 0;
margin-bottom: 15px;
display: flex;
}
.compare-title i {
margin-left: 10px;
}
.compare-title h6 {
font-weight: bold;
font-size: 20px;
}
.compare table {
border: 1px double #d7d7d7;
}
.compare table tr {
width: 100%;
}
.compare table tr th,
.compare table tr td {
font-size: 14px;
vertical-align: middle;
text-align: center;
min-width: 220px;
border: 1px double #d7d7d7;
}
.compare table td i {
margin-left: 10px;
}
.compare table tr td:nth-child(1) {
font-weight: bold;
}
.td-head {
font-size: 14px;
text-align: right !important;
background-color: rgba(238, 239, 241, 0.63) !important;
}
.compare-box {
position: relative;
padding: 15px 0;
}
.compare-box .compare-delete {
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
z-index: 1;
padding-bottom: 10px;
}
.compare-delete i {
color: #333;
cursor: pointer;
font-size: 20px;
transition: .2s all ease;
-webkit-transition: .2s all ease;
-moz-transition: .2s all ease;
-ms-transition: .2s all ease;
-o-transition: .2s all ease;
}
.compare-delete span i:hover {
color: #d12714;
}
.compare-add {
display: flex;
justify-content: center;
}
.compare-add-product {
width: 220px;
border: 1px dashed #cdcaca;
height: 100%;
padding: 30px 0;
}
.cap-title {
margin: 10px 0;
}
.cap-icon i {
font-size: 30px;
color: #666;
}
.empty-cell {
position: relative;
text-align: center;
}
.empty-cart img{
width: 240px;
}
.empty-cell:after {
content: '';
position: absolute;
width: 50px;
height: 5px;
border-radius: 5px;
background: #ccc;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
/* end page compare */
/* start page blog */
.blog-item .image {
position: relative;
display: inline-block;
}
.blog-item .image::after {
content: '';
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
display: inline-block;
background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.806) 100%);
}
.box-icon {
text-align: center;
width: 32px;
height: 32px;
background-color: #ddd;
border-radius: 5px;
box-shadow: var(--shadow-md);
margin-left: 7px;
display: flex;
align-items: center;
justify-content: center;
color: #333;
}
.item-box a {
color: #333;
}
.blog-archive {
margin-bottom: 10px;
}
.blog-archive a {
display: block;
transition: 0.3s all ease-in-out;
-webkit-transition: 0.3s all ease-in-out;
-moz-transition: 0.3s all ease-in-out;
-ms-transition: 0.3s all ease-in-out;
-o-transition: 0.3s all ease-in-out;
}
.blog-archive a:hover {
padding-right: 5px;
}
.blog-tag {
background-color: #eee;
box-shadow: var(--shadow-md);
padding: 5px 10px;
font-size: 12px;
margin-left: 5px;
margin-bottom: 5px;
transition: 0.3s;
border-radius: 25px;
}
.blog-tag:hover {
background-color: var(--main-color-two);
}
.blog-tag:hover a {
color: #fff;
}
/* end page blog */
/* start page blog-detail */
.blog-detail-title {
padding-bottom: 20px;
border-bottom: 1px solid #eee;
}
.blog-desc p {
font-size: 16px;
line-height: 30px;
}
.blog-desc-foot .card {
background: #f8f8f8;
border: none;
}
/* end page blog-detail */
/* start pannel */
.profile-box-nav ul li a i {
margin-left: 10px;
font-size: 20px;
font-weight: bold;
}
.profile-box-nav ul {
width: 100%;
}
.profile-box-nav ul li {
width: 100%;
position: relative;
}
.profile-box-nav ul li::before {
content: '';
position: absolute;
right: -10px;
top: 50%;
transform: translateY(-50%);
height: 50%;
width: 3px;
opacity: 0;
background-color: var(--main-color-one);
transition: 0.3s;
}
.profile-box-nav ul li:hover::before {
opacity: 1;
}
.profile-box-nav ul li a {
display: block;
transition: 0.3s;
-webkit-transition: 0.3s;
-moz-transition: 0.3s;
-ms-transition: 0.3s;
-o-transition: 0.3s;
}
.profile-box-nav ul li a:hover {
color: var(--main-color-one);
}
.profile-box-nav ul li.active::before {
content: '';
position: absolute;
right: -10px;
top: 50%;
transform: translateY(-50%);
height: 50%;
width: 3px;
opacity: 1;
background-color: var(--main-color-one);
transition: 0.3s;
}
.profile-box-nav ul li.active a {
color: var(--main-color-one);
}
/* end pannel */
/* page order-detail */
.orders {
padding: 10px 0;
}
.order-item {
padding: 10px;
border-bottom: 1px solid #ddd;
}
.order-item:nth-last-child(1) {
padding-bottom: 0;
border-bottom: none;
}
.order-item-status {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
padding: 0 0 15px 0;
}
.order-item-status-item p {
font-weight: bold;
}
.order-item-status-item i {
font-size: 25px;
color: #009500;
}
.dropd-status i {
font-size: 16px;
color: #333;
}
.order-item-status-item span {
margin-right: 5px;
}
.order-item-detail {
padding-bottom: 20px;
border-bottom: 1px solid #ddd;
}
.order-item-detail ul li {
margin-left: 20px;
padding-bottom: 10px;
font-size: 14px;
}
.order-item-detail ul li:nth-last-child(1) {
padding-bottom: 0;
}
.order-item-detail ul li span {
margin-left: 7px;
}
.order-item-product-list {
display: flex;
align-items: center;
flex-wrap: wrap;
padding: 20px 0;
border-bottom: 1px solid #ddd;
}
.order-item-product-list-item {
margin-left: 7px;
}
.order-item-show {
padding: 20px 0 0 0;
display: flex;
align-items: center;
justify-content: flex-end;
}
.order-item-show p {
color: #052c8d;
font-size: 14px;
}
.order-item-show p i {
font-size: 20px;
margin-left: 5px;
}
.order-item-comment {
display: flex;
justify-content: flex-end;
color: #052c8d;
}
.order-item-comment a {
color: #052c8d;
}
.product-list-row-lg .product-row-title h6 {
font-size: 16px;
}
.order-progress h6 i {
font-size: 25px;
color: #009500;
}
.order-progress .progress {
height: 10px;
}
.order-progress .progress .progress-bar {
background-color: #05ae65;
}
.notifi-title {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}
.notifi-desc {
padding: 10px 0;
}
.dot-click i {
width: 5px;
height: 5px;
margin-bottom: 2px;
}
.auth-title-form {
padding-top: 50px;
}
/* end page order-detail */
/* start insta floating */
.insta-floating {
position: fixed;
right: 36px;
bottom: 70px;
z-index: 999999999;
}
.insta-floating img {
width: 70px;
}
/* end insta floating */
/* start blog featured */
.blog-featured {
background: #f1f1f1;
border-radius: 10px;
padding: 25px 25px 10px 25px;
margin-bottom: 20px;
min-width: 100%;
margin-top: 10px;
box-shadow: var(--shadow-inner);
}
.blog-featured .title {
display: flex;
justify-content: center;
align-items: center;
/* padding-bottom: 10px;
border-bottom: 1px dashed #bbb; */
}
.blog-featured .title h4 {
color: #6b6b6b;
font-size: 22px;
font-weight: 800;
font-family: var(--font-site);
}
.blog-featured .title span {
margin-right: 10px;
font-weight: bold;
}
.blog-featured .title span:hover {
color: var(--main-color-two);
}
.blog-featured .desc {
margin-top: 10px;
}
.blog-featured .desc ul {
list-style-type: decimal;
padding: 0 20px;
}
.blog-featured .desc ul li a {
font-size: 16px;
color: #333;
padding-bottom: 5px;
display: inline-block;
border-bottom: 1px dashed transparent;
transition: 0.2s ease;
-webkit-transition: 0.2s ease;
-moz-transition: 0.2s ease;
-ms-transition: 0.2s ease;
-o-transition: 0.2s ease;
}
.blog-featured .desc ul li a:hover {
color: var(--main-color-two);
border-bottom: 1px dashed var(--main-color-two);
font-weight: bold;
}
/* end blog featured */
/* icon product box */
.icon-product-box {
z-index: 10;
position: absolute;
top: 10px;
left: 3px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.icon-product-box-item {
cursor: pointer;
width: 100%;
background: #fff;
padding: 5px;
text-align: center;
}
.summary .swiper-button-next,
.summary .swiper-button-prev {
top: 70% !important;
}
.icon-product-box-item i {
font-size: 22px;
}
.icon-product-box-item span {
display: block;
text-align: center;
font-size: 14px;
}
.pro_gallery {
position: relative;
}
.special-label {
position: absolute;
top: 5px;
right: 5px;
z-index: 500;
}
.special-label img {
width: 80px;
}
/* end icon product box */
/* pro var */
.pro-var-responsive ul {
display: flex;
flex-wrap: wrap;
list-style-type: none;
padding: 10px 0;
margin-bottom: 0;
}
.pro-var-responsive ul li {
margin-left: 10px;
margin-bottom: 10px;
}
.pro-var-responsive ul li a {
font-size: 14px;
display: block;
border: 1px solid #ddd;
padding: 7px 10px;
border-radius: 50%;
}
.pro-var-responsive ul li a.active {
border-color: var(--main-color-one);
}
.product-feature {
border-top: 1px dashed #ccc;
}
/* end pro var */
/* multi seller */
.multi-seller {
padding-bottom: 20px;
}
.multi-seller .main-table th {
padding: 20px 0;
font-size: 14px;
vertical-align: middle;
text-align: center;
}
.multi-seller .content-box {
box-shadow: var(--shadow-box);
}
.table-responsive-mobile {
padding: 10px 0;
}
.table-responsive-mobile .trm-parent {
margin-bottom: 20px;
background: #fff;
box-shadow: var(--shadow-box);
border-radius: 5px;
}
.table-responsive-mobile .trm {
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #eee;
}
.table-responsive-mobile .trm .trm-item {
flex: 0 0 calc(49.5% - 1px);
max-width: calc(49.5% - 1px);
padding: 20px 10px;
border-radius: 5px;
}
.table-responsive-mobile .trm .trm-item:nth-child(1) {
font-weight: bold;
}
.table-responsive-mobile .trm .trm-item:nth-child(2) {
color: #717171;
}
.table-responsive-mobile .trm:nth-last-child(1) {
border-bottom: none;
}
.table-responsive-mobile .trm .trm-item-full {
flex: 0 0 100%;
max-width: 100%;
text-align: center;
padding: 25px 10px;
}
.btn-add-cart-new {
font-weight: bold;
height: 100%;
background: var(--main-color-three);
border: 1px solid var(--main-color-three);
outline: none;
color: #fff;
padding: 10px 15px;
font-size: 14px;
transition: 0.3s all ease;
border-radius: 25px;
}
.btn-add-cart-new:hover {
background: transparent;
color: var(--color-site);
}
/* end multi seller */
/* product feature */
.shop-feature {
margin-top: 10px;
padding: 10px 0;
border-top: 1px solid #f1f1f0;
border-bottom: 6px solid #f1f1f0;
}
.shop-feature ul {
width: 100%;
flex-direction: row;
justify-content: space-between;
flex-wrap: wrap;
}
.shop-feature ul li {
margin: 0 10px;
padding-left: 10px;
}
.shop-feature ul li img {
width: 40px;
margin: 5px auto;
display: block;
}
.shop-feature ul li span {
display: block;
font-size: 12px;
margin-top: 5px;
color: var(--text-muted-two);
}
.gold-specs{
margin-top:15px;
}
.gold-spec-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:10px;
}
.gold-spec-item {
display: flex;
align-items: center;
gap: 10px;
padding: 10px 12px;
background: #ddd;
border: 1px solid var(--accent-color);
border-radius: 10px;
transition: all .25s ease;
}
.gold-spec-item:hover{
border-color:var(--main-color-one);
box-shadow:0 4px 12px rgba(0,0,0,0.05);
}
.gold-spec-icon{
width:36px;
height:36px;
display:flex;
align-items:center;
justify-content:center;
background:var(--main-color-one-light);
border-radius:8px;
color:var(--main-color-one);
font-size:18px;
}
.gold-spec-title{
display:block;
font-size:12px;
color:#777;
}
.gold-spec-value{
display:block;
font-size:14px;
font-weight:700;
}
/* end product feature */
/* start content product */
.box-tabs ul li a {
color: #6f6f6f;
}
.box-tabs ul li i {
vertical-align: -8px;
color: #ccc;
padding: 3px;
}
.box-tabs .nav-tabs .nav-link {
border: 0 solid transparent;
}
.box-tabs .nav-tabs .nav-link.active {
border-top: 5px solid #00bfd6;
border-radius: 0;
}
.box-content h4 {
color: #6f6f6f;
}
.box-content span {
color: #6f6f6f;
font-size: 15px;
}
.box-content .box_list .title {
color: #4d4d4d;
}
.box-content .box_list i {
vertical-align: -7px;
color: #00bfd6;
}
.block {
display: block;
}
.box_params_list p {
display: block;
background: #fafafa;
padding: 14px 18px 12px;
font-size: 13px;
line-height: 1.692;
color: #4d4d4d;
min-height: 47px;
position: relative;
margin-bottom: 15px;
box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
}
.border_right_custom1 {
border-right: 3px solid var(--main-color-one);
}
.border_right_custom2 {
border-right: 3px solid var(--main-color-two);
}
.nav-tabs-custom {
background: #F5F5F5;
}
.box_comment .bc1 {
padding: 10px 33px 33px 60px;
}
.bc1 .row {
background: #fcfcfc;
border-radius: 5px;
}
.box_comment .progress_title,
.box_comment .progress_title2 {
font-size: 14px !important;
}
.box_list p.title {
font-weight: bold;
}
/* end content product */
/* add cart float */
.add-cart-float {
position: fixed;
bottom: 0;
width: 100%;
z-index: 850;
}
.mega-container {
margin: 0 auto;
}
/* end add cart float */
/*
*****************************
***** Morteza Jaladat *******
******************************
*/
.se-cart .variations tbody tr .label label {
color: var(--lux-text-muted);
margin: 15px 0px;
}
.se-cart .variations tbody tr .value select {
border-radius: 5px;
background-color: var(--lux-bg);
color: var(--color-site);
padding: 5px 10px;
border: none;
box-shadow: 0px 0px 10px #333;
margin: 0 10px auto;
}
.se-cart .variations tbody tr {
display: flex;
justify-content: center;
align-items: flex-start;
margin-bottom: 20px;
flex-direction: column;
}
.single-product .quantity {
margin: 0 8px;
}
.bi-cart-plus {
margin-top: 7px;
}
.single_variation_wrap .woocommerce-variation-add-to-cart.variations_button.woocommerce-variation-add-to-cart-disabled {
display: flex;
justify-content: space-evenly;
align-items: center;
}
.woocommerce .quantity .qty {
border-radius: 5px;
padding: 4px;
}
.woocommerce .woocommerce-breadcrumb {
padding: 10px 20px;
}
.woocommerce table.shop_attributes td {
font-style: normal;
color: var(--main-color-one);
}
.se-cart .se-cart-item .cart{
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 20px;
}
.variations_form.cart {
flex-direction: column;
}
.variations_form.cart .variations tbody td.value {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: relative;
}
.variations_form.cart .variations tbody td.value .reset_variations {
position: absolute;
bottom: -40px;
border: 1px solid #a5a5a5;
color: var(--main-color-two);
padding: 1px 5px;
border-radius: 10px;
background: var(--main-color-one-shadow);
}
.variations_form.cart .single_variation_wrap .woocommerce-variation-add-to-cart.variations_button.woocommerce-variation-add-to-cart-enabled {
display: flex;
}
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt.disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt.disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:disabled[disabled], .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:disabled[disabled]:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt.disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt.disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:disabled[disabled], .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:disabled[disabled]:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt.disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt.disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:disabled[disabled], .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:disabled[disabled]:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt.disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt.disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:disabled[disabled], .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:disabled[disabled]:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt.disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt.disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt:disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt:disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt:disabled[disabled], :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt:disabled[disabled]:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt.disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt.disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt:disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt:disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt:disabled[disabled], :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt:disabled[disabled]:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt.disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt.disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt:disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt:disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt:disabled[disabled], :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt:disabled[disabled]:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt.disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt.disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt:disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt:disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt:disabled[disabled], :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt:disabled[disabled]:hover {
background-color: var(--main-color-one) !important;
}
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt {
background-color: var(--main-color-one) !important;
}
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce #respond input#submit.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce a.button.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce button.button.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce input.button.alt:hover {
background-color: var(--main-color-one-hover) !important;
}
.variations_form.cart .single_variation_wrap {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin-top: 40px;
}
.se-cart .se-cart-item .cart button {
margin: 0 10px;
}
.se-cart .se-cart-item .cart .quantity .qty {
margin-right: 10px;
}
.woocommerce-sorting .woocommerce-ordering select.orderby {
border-radius: 5px;
margin: auto 10px;
background-color: var(--back-color);
color: #333;
padding: 5px 10px;
}
.woocommerce-sorting {
width: 100%;
align-items: center;
}
.archive-box .product-box-item {
width: 100%;
}
.cart-action td {
background-color: transparent;
}
.input-text.qty.text {
max-width: 70px;
margin: auto;
align-self: center;
display: block;
text-align: center;
}
/*** Checkout Styles ***/
.page2 {
padding-right: 2rem;
padding-left: 2rem;
}
.wc-block-components-product-metadata {
display: none;
}
.wc-block-components-button.wp-element-button.wc-block-components-checkout-place-order-button.wc-block-components-checkout-place-order-button--full-width.contained {
background: #ef473a;
border-radius: 10px;
color: #fff;
}
.attachment-thumbnail.size-thumbnail.wp-post-image {
max-width: 100%;
height: auto;
}
.social img {
width: 40px;
}
.product-save {
text-align: center;
background: transparent;
box-shadow: var(--shadow-md);
border-radius: 5px;
justify-content: center;
align-items: center;
display: flex;
padding: 5px 10px;
margin-bottom: 5px;
cursor: pointer;
}
.add-favorite, .delete-favorite {
display: flex;
}
.delete-favorite {
color: #f00;
}
.card-title,.product-box-item .foot .price {
min-height: 48px;
}
.product-box-item .foot .price div {
margin: auto;
}
.widhlist-box .product-box-item {
width: 100%;
height: 100%;
}
.ml-5 {
margin-left: 5px;
}
/* استایل کلی برای اسلایدر استوریها */
.stories-slider {
margin: 0 0;
overflow: hidden;
}
.stories-slider .swiper-wrapper {
display: flex;
align-items: center;
justify-content: space-between;
}
.story-item {
text-align: center;
margin: 10px;
cursor: pointer;
}
.story-image img {
width: 80px;
height: 80px;
border-radius: 50%;
/*border: 2px solid #ef473a;*/
object-fit: cover;
transition: transform 0.3s ease-in-out;
padding: 3px;
}
.story-image img:hover {
transform: scale(1.1); /* افکت هنگام قرار گرفتن ماوس روی تصویر */
}
.story-title {
margin-top: 5px;
font-size: 14px;
color: #333;
}
/* استایل برای مودال */
#story-modal {
max-width: 80%;
margin: 0 auto;
}
#story-modal .swiper-container {
width: 100%;
height: auto;
}
#story-modal .swiper-slide img {
width: 100%;
height: auto;
max-height: 500px;
object-fit: contain;
}
/* افکتهای مودال */
.mfp-bg {
background: rgba(0, 0, 0, 0.8); /* پسزمینه تاریک مودال */
}
.mfp-content {
max-width: 800px;
margin: 0 auto;
}
.mfp-close {
color: white;
font-size: 24px;
top: -10px;
right: -10px;
}
.story-link-button {
display: inline-block;
position: absolute;
bottom: 10px;
left: 50%;
transform: translateX(-50%);
padding: 8px 16px;
background-color: rgba(0, 0, 0, 0.7);
color: #fff;
text-align: center;
font-size: 14px;
border-radius: 5px;
text-decoration: none;
z-index: 10;
}
.story-link-button:hover {
background-color: rgba(0, 0, 0, 0.9);
}
#story-modal .swiper-button-next,#story-modal .swiper-button-prev {
border-radius: 50%;
}
.story-modal-swiper-item {
max-width: fit-content;
}
.progress-bar {
position: relative;
width: 100%;
height: 5px;
background-color: rgba(255, 255, 255, 0.3);
border-radius: 5px;
overflow: hidden;
margin-bottom: 10px;
display: none; /* پیشفرض نوارهای پیشرفت را مخفی کن */
}
.progress {
position: absolute;
top: 0;
right: 0;
height: 100%;
width: 0;
background-color: var(--main-color-one);
transform-origin: right; /* نقطه شروع نوار از سمت راست */
transition: width 4s linear;
}
/* پایان استایل کلی برای اسلایدر استوریها */
/* استایل های بنر کاما */
@keyframes rotatex{
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes rotatexReverse{
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(-360deg);
transform: rotate(-360deg);
}
}
.cama-banner-image {
padding: 100px;
position: relative;
}
.cama-banner-image img {
border-radius: 50% 50% 50% 50%;
z-index: 1;
position: relative;
}
.cama-banner-image-border {
width: 80%;
height: 80%;
position: absolute;
display: flex;
justify-content: center;
align-items: center;
top: 0;
left: 0;
margin-left: 10%;
margin-top: 10%;
}
.cama-banner-image-border span {
position: absolute;
width: 95%;
height: 95%;
border: 2px solid ;
pointer-events: none;
animation: rotatex 13s linear infinite;
top: 2%;
right: 2%;
font-size: 0;
}
#cama-banner-image-border1 span {
border-radius: 38% 62% 64% 36% / 43% 35% 65% 57%;
}
#cama-banner-image-border2 span {
animation-direction: reverse;
border-radius: 41% 59% 40% 60% / 65% 66% 34% 35%;
}
.cama-banner-texts {
display: flex;
flex-direction: column;
justify-content: space-around;
padding: 15% 20px;
}
.cama-banner-first-title {
font-size: 20px;
font-weight: 600;
}
.cama-banner-second-title {
font-weight: bold;
font-size: 38px;
text-shadow: 0 0 19px #888;
}
.cama-banner-button {
max-width: fit-content;
/*padding: 3px 5px;*/
background-color: var(--main-color-one);
}
.cama-banner-button:hover {
background-color: var(--main-color-one-hover);
}
/* پایان استایل های بنر کاما */
/* استایل های اسلایدر انیمیشنی کاما */
.cama-animated-slider-image {
padding: 50px 0;
}
.cama-animated-slider-image img {
z-index: 1;
position: relative;
}
.cama-animated-slider-texts {
display: flex;
flex-direction: column;
justify-content: center;
padding: 0 50px 0 0;
}
.cama-animated-slider-first-title {
font-size: 20px;
font-weight: 600;
}
.cama-animated-slider-second-title {
font-weight: bold;
font-size: 38px;
text-shadow: 0 0 19px #888;
margin: 2px 0px;
}
.cama-animated-slider-button {
max-width: fit-content;
/*padding: 3px 5px;*/
background-color: var(--main-color-one);
}
.cama-animated-slider-button:hover {
background-color: var(--main-color-one-hover);
}
.cama-animated-slider-container-fluid .swiper-button-next, .cama-animated-slider-container-fluid .swiper-button-prev {
opacity: 0.5;
}
/* پایان استایل های اسلایدر انیمیشنی کاما */
/* شروع استایل های محصولات منتخب اسلایدر ویژه */
.product-box-title h2 {
font-size: 20px;
font-weight: bold;
color: #fff;
text-align: center;
margin-top: 20px;
margin-bottom: 20px;
}
.selected-products-special-slider .product-box-title a {
color: #fff;
font-size: 20px;
font-weight: bold;
}
.product-box-title {
display: flex;
justify-content: space-around;
align-items: center;
}
.product-box.carousel_radius .col-md-2 {
display: flex;
justify-content: center;
}
.carousel_radius {
border-top-right-radius: 50px;
border-top-left-radius: 50px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
.section_product {
position: absolute;
width: 100%;
margin: auto;
top: -50%;
}
.section_product .product-box-item {
border-radius: 30px;
}
.selected-products-special-slider .swiper-slide.swiper-slide-active {
justify-content: center;
display: flex;
}
/* پایان استایل های محصولات منتخب اسلایدر ویژه */
/********
شروع بنر با پسزمینه ثابت
*/
.banner-widget {
text-align: center;
position: relative;
overflow: hidden;
}
.banner-widget .banner-content {
position: relative;
z-index: 2;
}
.banner-widget::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
/*background: rgba(0, 0, 0, 0.5);*/
z-index: 1;
}
.fixed-background-banner-summary{
max-width: 50%;
margin: auto;
}
.fixed-background-banner-phone-input {
max-width: 30%;
margin: auto;
}
.fixed-background-banner-phone-input {
text-align: right;
background: #dddddd4d;
padding-top: 15px;
padding-bottom: 15px;
}
.fixed-background-banner-btn {
color: #fff;
}
.fixed-background-banner-btn::before {
width: 100%;
}
.fixed-background-banner-btn:hover::before, .fixed-background-banner-btn:hover span {
background-color: var(--main-color-one-hover);
}
/********
پایان بنر با پسزمینه ثابت
*/
.most-sales-products .top-title {
color: #fff;
}
.header-counter-btn {
right: 10px;
bottom: 3px;
}
.header-bottom-btn .waves-effect .header-bottom-link {
box-shadow: var(--shadow-md);
}
.border-radius-10{
border-radius: 10px;
}
.main-color, .main-color .elementor-heading-title{
color: var(--main-color-one) !important;
}
.main-color-hover{
color: var(--main-color-one-hover) !important;
}
.main-color .elementor-icon i {
color: var(--main-color-one);
}
.main-color-hover .elementor-counter-number-wrapper {
color: var(--main-color-one-hover) !important;
}
.slider-selection{
background-color: var(--main-color-one-hover) !important;
}
.price.d-flex.flex-column.justify-content-end p.price ins * {
text-decoration: none !important;
}
.price.d-flex.flex-column.justify-content-end .woocommerce-Price-amount.amount bdi {
margin-right: 15px;
}
.price.d-flex.flex-column.justify-content-end p.price del * {
color: var(--main-color-two);
}
#like-button {
border-radius: 20px;
border: 1px solid var(--main-color-one-shadow);
box-shadow: 0 0 3px var(--main-color-one-shadow);
padding: 2px 0;
display: flex;
align-items: center;
justify-content: center;
}
#like-button i {
margin-right: 5px;
}
.blog-writer-icon i {
justify-content: center;
align-items: center;
display: flex;
}
#about-us-story-content {
margin: auto;
}
#about-us-story-image .elementor-widget-wrap.elementor-element-populated {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.flex-direction-column{
flex-direction: column;
}
.main-color-hover .elementor-counter-title {
font-family: 'yekan-bakh' !important;
}
.absolute-title .elementor-image-box-content {
position: absolute;
top: 40%;
}
.absolute-title {
position: relative;
}
.out-of-stock-badge {
position: absolute;
top: 10px;
left: 10px;
background-color: var(--main-color-two);
color: white;
font-size: 14px;
font-weight: bold;
padding: 5px 10px;
border-radius: 5px;
}
/*** ====== Search Ajax styles =====*/
/* ===== Search Button ===== */
.search-toggle-btn {
border: 2px solid rgba(133, 133, 133, 0.2);
cursor: pointer;
transition: .5s;
border-radius: 25px;
color: var(--color-site);
padding: 8px 10px;
background: transparent;
}
.search-toggle-btn:hover {
transform: scale(1.05);
transition: .5s;
background: var(--main-color-one);
}
/* ===== Overlay with Blur ===== */
.search-overlay {
position: fixed;
inset: 0;
backdrop-filter: blur(8px);
background: rgba(0, 0, 0, 0.53);
display: flex;
justify-content: center;
align-items: center;
opacity: 0;
visibility: hidden;
transition: .3s ease;
z-index: 99999;
}
.search-overlay.active {
opacity: 1;
visibility: visible;
transition: .5s ease;
}
.search-overlay-input {
border-radius: 0px;
padding: 5px 10px;
background: transparent;
color: #fff;
box-shadow: none !important;
border: none;
border-bottom: 1px solid #fff;
min-width: 500px;
transition: 0.3s;
}
.search-overlay-input:focus-visible {
box-shadow: none !important;
outline: none;
scale: 1.1;
transition: 0.3s;
border-bottom: 2px solid #eee;
}
/* ===== Modal Box ===== */
.search-modal {
background: #fff;
padding: 40px;
border-radius: 20px;
width: 90%;
max-width: 600px;
text-align: center;
transform: scale(.8);
opacity: 0;
transition: .3s ease;
}
.search-overlay.active .search-modal {
transform: scale(1);
opacity: 1;
}
/* ===== Input ===== */
#liveSearchInput {
width: 100%;
padding: 15px 25px;
border-radius: 50px;
border: 1px solid #ddd;
font-size: 18px;
outline: none;
}
/* ===== Close ===== */
.close-search {
position: absolute;
top: 70px;
right: 70px;
font-size: 35px;
background: #a7a49d;
border: none;
cursor: pointer;
min-width: 50px;
min-height: 50px;
border-radius: 8px;
}
/* ===== Results ===== */
.live-search-list {
list-style: none;
margin-top: 20px;
padding: 0;
text-align: right;
}
.live-search-list li {
padding: 10px;
border-bottom: 1px solid #eee;
}
.live-search-list li a {
text-decoration: none;
color: #333;
}
.live-search-list li:hover {
background: #f5f5f5;
}
.no-result {
margin-top: 15px;
color: #888;
}
/* ===== Header Shrink Effect ===== */
.header-small {
transform: scale(.95);
transition: .3s ease;
}
/*** ====== End Search Ajax styles =====*/
/**** بخش چارت طلا *****/
/* تنظیمات کارت اصلی برای قرارگیری روی اشکال */
.my-gold18-card {
position: relative;
z-index: 1;
/* اگر پسزمینه کارت شما رنگ سالید دارد، میتوانید کمی شفافیت (مثلا rgba) به آن بدهید تا نورهای پشت زیباتر دیده شوند */
}
/* استایل مشترک دو شکل متحرک پشت کارت */
.my-gold18-card::before, .my-gold18-card::after {
content: '';
position: absolute;
z-index: -1;
filter: blur(20px);
opacity: 0.6;
}
/* شکل اول (نور طلایی/نارنجی) */
.my-gold18-card::before {
width: 200px;
height: 200px;
background: linear-gradient(45deg, #DBB71A, #DBB71A30);
top: -40px;
right: -40px;
animation: blob-bounce-1 3s infinite alternate ease-in-out;
}
/* شکل دوم (نور آبی/بنفش) */
.my-gold18-card::after {
width: 180px;
height: 180px;
background: linear-gradient(45deg, #DBB71A, #DBB71A30);
bottom: -30px;
left: -30px;
animation: blob-bounce-2 3s infinite alternate ease-in-out;
}
/* انیمیشن سهبعدی و تغییر شکل نرم برای شکل اول */
@keyframes blob-bounce-1 {
0% {
transform: translate(0, 0) scale(1) rotate(0deg);
border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%;
}
100% {
transform: translate(-30px, 20px) scale(1.1) rotate(20deg);
border-radius: 60% 40% 30% 70% / 50% 60% 40% 50%;
}
}
/* انیمیشن سهبعدی و تغییر شکل نرم برای شکل دوم */
@keyframes blob-bounce-2 {
0% {
transform: translate(0, 0) scale(1) rotate(0deg);
border-radius: 50% 50% 40% 60% / 60% 40% 50% 50%;
}
100% {
transform: translate(40px, -20px) scale(1.15) rotate(-15deg);
border-radius: 30% 70% 50% 50% / 40% 60% 40% 60%;
}
}
/**** بخش چارت طلا *****/
/******** mj icon *******/
/******** mj pay divider (cashless / pos) ********/
/* رنگها (قابل تغییر) */
:root{
--mj-bg: #ffffff;
--mj-dark: #111111; /* مشکی مایل به خاکستری */
--mj-dark-2: #2a2a2a; /* خاکستری تیره */
--mj-gold: #D4AF37; /* طلایی */
--mj-gold-2:#F6D365; /* هایلایت طلایی */
}
/* مرکزچین کردن شورتکد و خطوط مثل جداکننده */
.mj-icon .elementor-shortcode{
display:flex;
align-items:center;
justify-content:center;
margin: 18px 0;
}
/* کنترل اندازه و واکنشگرایی SVG */
.mj-icon .mj-pay-divider{
width: min(620px, 100%);
height: auto;
display:block;
}
/* کمی لطافت در رندر */
.mj-icon .mj-pay-divider *{
transform-box: fill-box;
transform-origin: center;
}
/* رینگ طلایی خطچین: چرخش نرم */
.mj-icon .mj-ring-2{
animation: mj-rotate 5s linear infinite;
}
/* موجهای NFC: پالس/فید */
.mj-icon .mj-nfc-1{ animation: mj-nfc 1.3s ease-in-out infinite; }
.mj-icon .mj-nfc-2{ animation: mj-nfc 1.3s ease-in-out infinite; animation-delay: .18s; }
.mj-icon .mj-nfc-3{ animation: mj-nfc 1.3s ease-in-out infinite; animation-delay: .36s; }
/* درخشش کنترلشده ذرات */
.mj-icon .mj-spark-1{ animation: mj-spark 1.6s ease-in-out infinite; }
.mj-icon .mj-spark-2{ animation: mj-spark 1.9s ease-in-out infinite; animation-delay: .2s; }
.mj-icon .mj-spark-3{ animation: mj-spark 2.2s ease-in-out infinite; animation-delay: .35s; }
.mj-icon .mj-spark-4{ animation: mj-spark 2.0s ease-in-out infinite; animation-delay: .1s; }
/* یک پالس خیلی ظریف روی کل آیکن مرکزی که "دیجیتال" حس بده */
.mj-icon .mj-pay-center{
animation: mj-breathe 2.4s ease-in-out infinite;
}
@keyframes mj-rotate{
from{ transform: rotate(0deg); }
to{ transform: rotate(360deg); }
}
@keyframes mj-nfc{
0% { opacity: .15; transform: translateX(0) scale(.98); }
45% { opacity: 1; transform: translateX(0) scale(1); }
100% { opacity: .1; transform: translateX(0) scale(.99); }
}
@keyframes mj-spark{
0% { opacity: .15; transform: scale(.85); }
35% { opacity: 1; transform: scale(1.2); }
70% { opacity: .35; transform: scale(.95); }
100% { opacity: .12; transform: scale(.85); }
}
@keyframes mj-breathe{
0% { transform: translateY(0); filter: saturate(1); }
50% { transform: translateY(-1px); filter: saturate(1.08); }
100% { transform: translateY(0); filter: saturate(1); }
}
/* احترام به کاربرانی که reduce motion فعال دارند */
@media (prefers-reduced-motion: reduce){
.mj-icon .mj-ring-2,
.mj-icon .mj-nfc-1,
.mj-icon .mj-nfc-2,
.mj-icon .mj-nfc-3,
.mj-icon .mj-spark-1,
.mj-icon .mj-spark-2,
.mj-icon .mj-spark-3,
.mj-icon .mj-spark-4,
.mj-icon .mj-pay-center{
animation: none !important;
}
}
/***** Mj Categories ********/
.mj-category-card {
border: 1px solid #40403b;
}
.mj-category-card-link {
text-decoration: none;
display: block;
}
.mj-category-card {
border-radius: 8px;
padding: 20px;
transition: all .25s ease;
height: 100%;
}
.mj-category-card:hover {
transform: translateY(-4px);
}
.mj-category-card-title {
font-size: 1.05rem;
font-weight: 600;
}
.mj-category-card-desc {
font-size: 0.9rem;
opacity: .8;
}
.mj-category-card-price {
font-size: 18px;
margin-top: 8px;
font-weight: 700;
}
.mj-category-card:hover .mj-category-card-title {
color: #D2B051 !important;
}
.mj-category-card-image {
display: flex;
justify-content: center;
align-items: center;
}
.mj-category-card-content {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
/****************** luxury products widget ******************/
/* =========================================================
Luxury Products Widget
========================================================= */
.luxury-widget-container {
padding: 60px 0;
overflow: hidden;
direction: rtl;
color: #fff;
background-image: linear-gradient(90deg,#111111,#414141 70%,#4e4e4e 90%);
}
.luxury-main-flex {
display: flex;
align-items: center;
gap: 30px;
max-width: 1440px;
margin: 0 auto;
padding: 0 15px;
}
.luxury-banner-box {
flex: 0 0 40%;
display: flex;
align-items: center;
justify-content: space-between;
direction: ltr;
}
.banner-inner-content {
flex: 1;
padding: 0 20px;
text-align: right;
z-index: 10;
}
.banner-image-wrap {
flex: 1;
margin-right: 40px;
}
.banner-image-wrap img {
width: 130%;
max-width: 500px;
transform: translateX(5%);
}
.buy-now {
display: block;
font-size: 13px;
letter-spacing: 2px;
color: #999;
margin-bottom: 10px;
text-transform: uppercase;
}
.banner-title {
font-family: "Playfair Display", serif;
font-size: 48px;
line-height: 1.1;
margin-bottom: 20px;
color: #fff;
}
.banner-desc {
font-size: 15px;
line-height: 1.6;
color: #ccc;
margin-bottom: 30px;
}
.banner-btn {
display: inline-block;
padding: 14px 40px;
color: #000;
font-weight: bold;
text-decoration: none;
transition: all 0.4s ease;
border-radius: 5px;
}
.banner-btn:hover {
background-color: #fff !important;
transform: translateY(-3px);
color:var(--main-color-one);
}
.luxury-sliders-box {
flex: 0 0 60%;
min-width: 0;
}
.luxury-swiper {
padding: 25px 0;
}
.luxury-product-card {
background: linear-gradient(0deg,#f2f2f2,#fefefe);
border: 1px solid var(--back-color);
padding: 20px;
text-align: center;
height: 100%;
transition: border-color 0.4s ease;
border-radius: 5px;
box-shadow: 0px 4px 6px #ddd;
}
.luxury-product-card:hover {
border-color: #f3d078;
}
.luxury-image-wrapper {
position: relative;
height: 200px;
margin-bottom: 20px;
display: flex;
align-items: center;
justify-content: center;
/*background: linear-gradient(145deg,#c7c4ad,#555,#c7c4ad);*/
background: transparent;
border-radius: 5px;
}
.luxury-image-wrapper img {
max-height: 90%;
max-width: 90%;
object-fit: contain;
}
.luxury-badges {
position: absolute;
top: 10px;
right: 10px;
display: flex;
flex-direction: column;
gap: 5px;
}
.badge-sale-label {
background: #f3d078;
color: #000;
font-size: 10px;
font-weight: bold;
padding: 2px 8px;
}
.badge-discount {
background: #fff;
color: #000;
font-size: 10px;
padding: 2px 8px;
}
.luxury-title {
font-size: 16px;
font-weight: 500;
margin: 15px 0 10px;
color: var(--color-site);
}
.luxury-price {
font-size: 17px;
font-weight: bold;
color: #333;
}
.luxury-rating {
font-size: 11px;
margin-bottom: 8px;
color: #f3d078;
}
/* =========================================================
اصلاحات تکمیلی برای ست شدن فروشگاه با ویجت لاکچری
========================================================= */
.archive .col-lg-3 .item-boxs, .filter-items .count p {
color: #333;
}
.archive-box {
margin-bottom: 20px;
}
.back-color{
background: var(--back-color) !important;
}
.color-site{
color: var(--color-site) !important;
}
.btn.back-color.color-site.shadow-box.waves-effect.waves-light:hover {
background: var(--accent-color) !important;
color: var(--back-color) !important;
transition: 0.3s;
}
/* تنظیمات کلی کارت در صفحه فروشگاه */
.luxury-product-card {
position: relative;
overflow: hidden; /* برای دکمههای شناور */
display: flex;
flex-direction: column;
justify-content: space-between;
}
/* افکت تعویض عکس در هاور (ست شده با تم مشکی) */
.luxury-image-wrapper .hover-img {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
opacity: 0;
transition: opacity 0.5s ease, transform 0.8s ease;
}
.luxury-product-card:hover .main-img {
opacity: 0;
}
.luxury-product-card:hover .hover-img {
opacity: 1;
transform: translate(-50%, -50%) scale(1.1);
}
/* دکمههای شناور (علاقهمندی و مقایسه) */
.luxury-action-btns {
position: absolute;
top: 15px;
left: -70px; /* ابتدا مخفی در سمت چپ */
z-index: 15;
transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
display: flex;
flex-direction: column;
gap: 8px;
}
.luxury-product-card:hover .luxury-action-btns {
left: 10px;
}
.action-btn-item {
background: #222;
width: 38px;
height: 38px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
border: 1px solid #333;
transition: 0.3s;
color: #333;
cursor: pointer;
background: #ddd;
visibility: hidden;
}
.action-btn-item:hover {
background: #f3d078;
color: #000;
border-color: #f3d078;
}
.luxury-product-card .action-btn-item .compare.button {
border-radius: 20px;
background: transparent;
}
.luxury-product-card:hover .action-btn-item {
visibility: visible;
}
/* قیمت و تخفیف */
.luxury-price-wrapper {
margin-top: 10px;
}
.old-price {
display: block;
font-size: 13px;
color: #666;
text-decoration: line-through;
margin-bottom: 3px;
}
.luxury-price .currency {
font-size: 12px;
margin-right: 5px;
opacity: 0.7;
}
/* دکمه افزودن به سبد خرید (پایین کارت) */
.luxury-footer-action {
margin-top: 15px;
padding-top: 15px;
border-top: 1px solid #222;
}
.add-to-cart-btn {
background: transparent;
border: 1px solid #333;
color: #333;
padding: 10px;
border-radius: 4px;
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
font-size: 13px;
transition: 0.3s;
cursor: pointer;
}
.luxury-product-card:hover .add-to-cart-btn {
background: #f3d078;
color: #000;
border-color: #f3d078;
}
/* نشان ناموجود (لاکچری) */
.luxury-badge-out {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: rgba(243, 208, 120, 0.9); /* رنگ طلایی با کمی شفافیت */
color: #000;
padding: 5px 20px;
font-weight: bold;
z-index: 10;
font-size: 12px;
letter-spacing: 1px;
}
/* تایمر شمارش معکوس لاکچری */
.luxury-countdown {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
background: linear-gradient(to top, rgba(0,0,0,0.8), transparent);
color: #f3d078;
padding: 10px;
font-size: 12px;
text-align: center;
font-family: monospace;
}
/* اصلاح برای حالت ریسپانسیو موبایل */
@media (max-width: 768px) {
.luxury-action-btns {
left: 10px; /* در موبایل همیشه نمایش داده شود یا در دسترس باشد */
}
.luxury-image-wrapper {
height: 160px;
}
}
/*--------------------------------------------------------------
# Luxury Blog Styles
--------------------------------------------------------------*/
.luxury-blog-container {
position: relative;
padding: 0;
direction: rtl;
}
.luxury-blog-card {
transition: all 0.4s ease;
height: 100%;
border: 1px solid #40403b;
overflow: hidden;
border-radius: 8px;
}
.blog-media {
position: relative;
height: 260px;
overflow: hidden;
}
.blog-media img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}
.luxury-blog-card:hover .blog-media img {
transform: scale(1.1);
}
.blog-like-badge {
position: absolute;
top: 15px;
right: 15px;
z-index: 2;
display: flex;
align-items: center;
gap: 8px;
padding: 6px 14px;
font-size: 13px;
color: #ffffff;
background: rgba(0, 0, 0, 0.5);
border-radius: 30px;
backdrop-filter: blur(8px);
}
.blog-content {
padding: 35px 25px;
text-align: center;
}
.blog-meta-time {
display: block;
margin-bottom: 15px;
font-size: 11px;
font-weight: 700;
letter-spacing: 1.5px;
text-transform: uppercase;
}
.blog-title {
margin-bottom: 15px;
font-family: "Playfair Display", serif;
font-size: 26px;
line-height: 1.3;
min-height: 70px;
}
.blog-title a {
text-decoration: none;
transition: all 0.3s ease;
}
.blog-excerpt {
font-size: 14px;
line-height: 1.8;
opacity: 0.8;
}
.blog-swiper {
padding: 20px 0 60px !important;
}
.luxury-nav {
width: 40px !important;
height: 40px !important;
color: #ffffff !important;
background: rgba(255, 255, 255, 0.1);
border-radius: 50%;
}
.luxury-nav::after {
font-size: 18px !important;
}
.luxury-nav:hover {
color: #000000 !important;
}
@media (max-width: 768px) {
.luxury-nav {
display: none !important;
}
}
/* =========================================================
Responsive
========================================================= */
@media (max-width: 1100px) {
.luxury-main-flex {
flex-direction: column;
}
.luxury-banner-box {
flex: 0 0 100%;
margin-bottom: 40px;
}
.banner-image-wrap img {
width: 100%;
transform: none;
}
.luxury-sliders-box {
flex: 0 0 100%;
width: 100%;
}
}
@media(max-width: 767px){
.product-box-title {
width: 100%;
}
/* استایل عمومی برای زیرمنوها */
.rm-item-menu .navbar-nav {
margin-right: 10px; /* فاصله 10 پیکسل از سمت راست */
padding-right: 10px; /* کمی فضای داخلی از سمت راست */
}
/* اطمینان از نمایش درست زیرمنوها */
.rm-item-menu .menu-item-has-children > ul {
margin-right: 10px; /* فاصله از سمت راست والد */
}
/* استایل برای لینکهای داخل زیرمنو */
.rm-item-menu .menu-item-has-children > ul > li > a {
padding-right: 10px; /* فضای اضافی برای متن لینک */
display: block; /* لینکها به صورت بلوک باشند */
white-space: nowrap; /* جلوگیری از شکستن متن */
}
.fixed-background-banner-phone-input , .fixed-background-banner-summary {
max-width: 95%;
}
#box-register-login {
max-width: 80%;
margin: auto;
}
.h6.mf-link-title {
font-size: .7rem;
}
.selected-products-special-slider {
margin-bottom: 330px;
margin-top: 15px !important;
}
.cama-banner-image, .cama-animated-slider-image {
padding: 56px 20px 20px 25px;
}
.cama-animated-slider-image {
padding: 10px 0 10px 0;
}
.cama-banner-texts {
padding: 5% 20px;
}
.cama-animated-slider {
font-size: 11px;
}
.cama-animated-slider-first-title {
font-size: 13px;
}
.cama-animated-slider-second-title {
font-size: 15px;
}
.cama-animated-slider-button {
font-size: 13px;
padding: 5px 10px;
}
.cama-animated-slider-description {
margin-bottom: 0.5rem;
}
.cama-animated-slider-texts {
padding: 0 20px 0 0;
}
.cama-animated-slider-container-fluid .swiper-button-next, .cama-animated-slider-container-fluid .swiper-button-prev {
display: none;
}
.cama-animated-slider-container-fluid .swiper {
padding: 2rem 0px;
}
.cama-animated-slider-container-fluid .swiper-pagination {
bottom: 0px;
}
/*
سبد خرید ریسپانسیو
*/
.cart-table table {
width: 100%;
border-collapse: collapse;
}
.cart-table table thead {
display: none;
}
.cart-table table thead th {
display: table-cell; /* نمایش ستونها در موبایل */
}
.cart-table table tbody tr {
display: flex;
flex-direction: column;
border: 1px solid #ddd;
margin-bottom: 10px;
padding: 10px;
}
.cart-table table tbody tr td {
display: flex;
justify-content: space-between;
padding: 10px;
border-bottom: 1px solid #ddd;
}
.cart-table table tbody tr td:last-child {
border-bottom: 0;
}
.cart-table table tbody tr td:before {
content: attr(data-title);
font-weight: bold;
}
.cart-table table tbody tr td img {
max-width: 50px;
height: auto;
}
.cart-table table tbody tr td.title {
font-size: 14px; /* سایز فونت را در حالت موبایل کمی کوچکتر کنید */
white-space: normal; /* اجازه دهید متن به خط بعدی برود */
word-wrap: break-word; /* خطوط خیلی طولانی را بشکنید */
overflow-wrap: break-word; /* از شکسته شدن کلمات بزرگ جلوگیری کنید */
}
.cart-table table .cart-action.mt-lg-0.mt-3 {
text-align: center;
}
.cart-table table .cart-action td .cart-footer-update {
margin: auto;
}
/*
پایان سبد خرید ریسپانسیو
*/
}
.nav-link {
color: var(--color-site);
}
.single-product .content * {
color: var(--lux-text-muted);
}
.my-gold18-card {
background: var(--bs-gray-800);
}
.gold-color {
color: #fcd462 !important;
}
.bg-gold-color {
background-color: #fcd462 !important;
}
.about-us-icon-section .main-color-hover * {
color: var(--bs-body-bg-rgb) !important;
}
/* ========================================================
Arad POS Footer Styles
Theme: Fintech Modern Dark (Amber Gold & Charcoal Gray)
Designed by: Vira Fannavar Isatis
======================================================== */
/*:root {*/
/* --pos-bg-dark: #0a0d14;*/
/* --pos-card-bg: rgba(16, 22, 34, 0.72);*/
/* --pos-primary: #00d2ff;*/
/* --pos-primary-hover: #3a7bd5;*/
/* --pos-cyan-glow: rgba(0, 210, 255, 0.35);*/
/* --pos-border: rgba(0, 210, 255, 0.16);*/
/* --pos-border-subtle: rgba(255, 255, 255, 0.08);*/
/* --pos-text-main: #f0f4f8;*/
/* --pos-text-muted: #94a3b8;*/
/* --pos-glass: rgba(255, 255, 255, 0.03);*/
/* }*/
:root {
--pos-bg-dark: #0d1117;
--pos-card-bg: rgba(22, 27, 34, 0.75);
--pos-primary: #f59e0b;
--pos-primary-hover: #d97706;
--pos-primary-glow: rgba(245, 158, 11, 0.35);
--pos-border: rgba(245, 158, 11, 0.22);
--pos-border-subtle: rgba(255, 255, 255, 0.08);
--pos-text-main: #f8fafc;
--pos-text-muted: #94a3b8;
--pos-glass: rgba(255, 255, 255, 0.03);
}
.pos-footer {
position: relative;
overflow: hidden;
background:
radial-gradient(circle at 10% 15%, rgba(245, 158, 11, 0.06), transparent 35%),
radial-gradient(circle at 90% 85%, rgba(217, 119, 6, 0.05), transparent 35%),
linear-gradient(180deg, #0d1117 0%, #111620 50%, #080b10 100%);
color: var(--pos-text-muted);
padding: 60px 0 24px;
border-top: 1px solid rgba(245, 158, 11, 0.2);
}
/* شبکه مدار و خطوط مدرن پس زمینه */
.pos-footer-gridlines {
position: absolute;
inset: 0;
background-image:
linear-gradient(rgba(255, 255, 255, 0.02) 1px, transparent 1px),
linear-gradient(90deg, rgba(255, 255, 255, 0.02) 1px, transparent 1px);
background-size: 30px 30px;
pointer-events: none;
}
.pos-footer::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 2px;
background: linear-gradient(90deg, transparent 0%, #f59e0b 30%, #d97706 70%, transparent 100%);
box-shadow: 0 0 14px var(--pos-primary-glow);
}
.pos-footer-glow {
position: absolute;
border-radius: 50%;
filter: blur(100px);
pointer-events: none;
z-index: 1;
}
.pos-footer-glow-1 {
top: -60px;
right: 5%;
width: 280px;
height: 280px;
background: rgba(245, 158, 11, 0.1);
}
.pos-footer-glow-2 {
bottom: -40px;
left: 8%;
width: 320px;
height: 320px;
background: rgba(217, 119, 6, 0.08);
}
.pos-footer-container {
position: relative;
z-index: 2;
}
/* نوار ویژگیهای شاپرک و پوز */
.pos-features-bar {
background: var(--pos-card-bg);
border: 1px solid var(--pos-border);
border-radius: 16px;
padding: 20px 24px;
margin-bottom: 45px;
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45);
}
.pos-feature-item {
display: flex;
align-items: center;
gap: 14px;
}
.pos-feature-icon {
width: 46px;
height: 46px;
min-width: 46px;
border-radius: 12px;
background: linear-gradient(135deg, rgba(245, 158, 11, 0.15), rgba(217, 119, 6, 0.25));
border: 1px solid rgba(245, 158, 11, 0.35);
display: flex;
align-items: center;
justify-content: center;
color: var(--pos-primary);
font-size: 20px;
}
.pos-feature-text h6 {
color: #ffffff;
font-size: 14px;
font-weight: 700;
margin: 0 0 3px 0;
}
.pos-feature-text p {
color: var(--pos-text-muted);
font-size: 11px;
margin: 0;
}
/* کارت برند و مشخصات */
.pos-footer-brand-box,
.pos-footer-mapbox {
background: var(--pos-card-bg);
border: 1px solid var(--pos-border-subtle);
border-radius: 18px;
padding: 26px;
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4);
transition: all 0.3s ease;
}
.pos-footer-brand-box:hover,
.pos-footer-mapbox:hover {
border-color: rgba(245, 158, 11, 0.35);
}
.pos-status-badge {
display: inline-flex;
align-items: center;
gap: 8px;
background: rgba(245, 158, 11, 0.08);
border: 1px solid rgba(245, 158, 11, 0.25);
padding: 6px 14px;
border-radius: 30px;
font-size: 12px;
color: var(--pos-primary);
margin-bottom: 16px;
}
.pos-status-dot {
width: 8px;
height: 8px;
background: #10b981;
border-radius: 50%;
box-shadow: 0 0 8px #10b981;
animation: posPulse 2s infinite;
}
@keyframes posPulse {
0%, 100% { opacity: 1; transform: scale(1); }
50% { opacity: 0.4; transform: scale(0.85); }
}
.pos-footer-title {
color: #ffffff;
font-size: 22px;
line-height: 1.5;
margin-bottom: 14px;
font-weight: 800;
}
.pos-footer-about {
color: var(--pos-text-muted);
line-height: 1.9;
font-size: 13.5px;
margin-bottom: 22px;
}
.pos-footer-contact-list {
display: flex;
flex-direction: column;
gap: 10px;
}
.pos-contact-chip {
display: inline-flex;
align-items: center;
gap: 12px;
width: fit-content;
max-width: 100%;
padding: 10px 16px;
border: 1px solid var(--pos-border);
border-radius: 10px;
background: rgba(245, 158, 11, 0.05);
color: var(--pos-text-main);
text-decoration: none;
font-size: 13px;
font-weight: 500;
transition: all 0.25s ease;
}
.pos-contact-chip i {
color: var(--pos-primary);
font-size: 16px;
transition: 0.25s ease;
}
.pos-contact-chip:hover {
background: linear-gradient(135deg, #f59e0b, #d97706);
border-color: #f59e0b;
color: #000000;
font-weight: 700;
transform: translateY(-2px);
box-shadow: 0 6px 18px rgba(245, 158, 11, 0.35);
}
.pos-contact-chip:hover i {
color: #000000;
}
/* ستون منوها و لینکها */
.pos-footer-heading {
color: #ffffff;
font-size: 16px;
font-weight: 700;
margin-bottom: 20px;
padding-bottom: 8px;
position: relative;
}
.pos-footer-heading::after {
content: "";
position: absolute;
right: 0;
bottom: 0;
width: 34px;
height: 2px;
background: var(--pos-primary);
box-shadow: 0 0 8px var(--pos-primary-glow);
}
.pos-footer-links {
list-style: none;
margin: 0;
padding: 0;
}
.pos-footer-links li {
margin-bottom: 12px;
}
.pos-footer-links li a {
color: var(--pos-text-muted);
text-decoration: none;
font-size: 14px;
transition: all 0.25s ease;
display: inline-flex;
align-items: center;
}
.pos-footer-links li a:hover {
color: var(--pos-primary);
padding-right: 6px;
}
/* آدرس و نقشه */
.pos-footer-address {
display: flex;
align-items: flex-start;
gap: 10px;
color: var(--pos-text-muted);
font-size: 13px;
line-height: 1.8;
margin-bottom: 16px;
}
.pos-footer-address i {
color: var(--pos-primary);
font-size: 16px;
margin-top: 2px;
}
.pos-map-frame {
position: relative;
overflow: hidden;
border-radius: 12px;
height: 195px;
border: 1px solid var(--pos-border-subtle);
background: #090c10;
}
.pos-map-frame iframe {
width: 100%;
height: 100%;
border: 0;
filter: invert(90%) hue-rotate(180deg) brightness(88%) contrast(90%);
}
.pos-map-btn {
position: absolute;
right: 12px;
bottom: 12px;
display: inline-flex;
align-items: center;
gap: 6px;
padding: 8px 14px;
border-radius: 8px;
background: rgba(13, 17, 23, 0.9);
border: 1px solid var(--pos-border);
color: var(--pos-primary);
text-decoration: none;
font-size: 12px;
backdrop-filter: blur(6px);
transition: 0.25s ease;
}
.pos-map-btn:hover {
background: var(--pos-primary);
color: #000000;
font-weight: 700;
}
/* خط جداکننده */
.pos-footer-divider {
height: 1px;
margin: 36px 0 24px;
background: linear-gradient(90deg, transparent 0%, var(--pos-border) 30%, rgba(255, 255, 255, 0.1) 50%, var(--pos-border) 70%, transparent 100%);
}
.pos-footer-bottom {
position: relative;
}
.pos-footer-copy {
color: #7b889b;
font-size: 12.5px;
line-height: 1.8;
}
/* شبکههای اجتماعی */
.pos-socials {
display: flex;
justify-content: center;
align-items: center;
gap: 10px;
flex-wrap: wrap;
}
.pos-social-btn {
width: 40px;
height: 40px;
border-radius: 10px;
display: inline-flex;
align-items: center;
justify-content: center;
background: rgba(255, 255, 255, 0.03);
border: 1px solid var(--pos-border-subtle);
color: var(--pos-text-muted);
transition: 0.25s ease;
}
.pos-social-btn:hover {
background: rgba(245, 158, 11, 0.15);
border-color: var(--pos-primary);
color: var(--pos-primary);
transform: translateY(-3px);
box-shadow: 0 4px 15px rgba(245, 158, 11, 0.25);
}
.pos-social-btn img {
max-width: 18px;
max-height: 18px;
object-fit: contain;
filter: brightness(0) invert(1);
}
/* نمادهای اعتماد و اینماد */
.pos-trust-list {
display: flex;
justify-content: flex-end;
align-items: center;
gap: 12px;
flex-wrap: wrap;
}
.pos-trust-item {
min-width: 74px;
min-height: 74px;
padding: 6px;
border-radius: 12px;
background: rgba(255, 255, 255, 0.02);
border: 1px solid var(--pos-border-subtle);
display: inline-flex;
align-items: center;
justify-content: center;
transition: 0.3s ease;
}
.pos-trust-item:hover {
border-color: var(--pos-border);
background: rgba(245, 158, 11, 0.05);
transform: translateY(-2px);
}
.pos-trust-item img {
max-width: 68px;
max-height: 68px;
object-fit: contain;
}
/* کپیرایت ایساتیس */
.pos-footer-signature {
margin-top: 24px;
padding-top: 18px;
border-top: 1px solid rgba(255, 255, 255, 0.05);
text-align: center;
}
.pos-footer-signature p {
font-size: 12px;
color: #64748b;
}
.pos-footer-signature a {
color: var(--pos-primary);
font-weight: 600;
text-decoration: none;
transition: 0.25s ease;
}
.pos-footer-signature a:hover {
color: #ffffff;
text-shadow: 0 0 8px var(--pos-primary-glow);
}
/* ========================================================
Mobile Modern Footer (POS & Tech Styled)
======================================================== */
@media (max-width: 991.98px) {
.pos-footer {
padding: 40px 0 90px;
}
.pos-footer-brand-box,
.pos-footer-mapbox {
padding: 20px;
}
.pos-trust-list,
.pos-socials {
justify-content: center;
}
.mobile-footer {
background: rgba(13, 17, 23, 0.92) !important;
-webkit-backdrop-filter: blur(16px);
backdrop-filter: blur(16px);
border: 1px solid rgba(245, 158, 11, 0.25);
box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.65);
right: 2%;
bottom: 12px;
width: 96% !important;
border-radius: 16px;
overflow: hidden;
position: fixed;
z-index: 9999 !important;
margin: 0;
padding: 4px 0 !important;
}
.mobile-footer::before {
content: "";
position: absolute;
inset: 0 0 auto 0;
height: 1px;
background: linear-gradient(90deg, transparent, rgba(245, 158, 11, 0.6), transparent);
}
.mobile-footer ul {
margin: 0;
padding: 0;
list-style: none;
}
.mobile-footer .d-table-row {
display: table;
width: 100%;
table-layout: fixed;
}
.mobile-footer .d-table-cell {
vertical-align: middle;
}
.mobile-footer .mf-link {
display: flex !important;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 8px 4px;
color: #94a3b8 !important;
text-decoration: none;
transition: 0.2s ease;
}
.mobile-footer .mf-link-icon {
color: #cbd5e1 !important;
}
.mobile-footer .mf-link-title {
font-size: 11px;
font-weight: 500;
color: #94a3b8 !important;
margin-top: 4px !important;
}
.mobile-footer .d-table-cell:hover .mf-link,
.mobile-footer .d-table-cell:active .mf-link {
color: var(--pos-primary) !important;
}
.mobile-footer .d-table-cell:hover .mf-link-icon {
color: var(--pos-primary) !important;
}
.pos-badge {
background: linear-gradient(135deg, #f59e0b, #d97706) !important;
box-shadow: 0 0 10px rgba(245, 158, 11, 0.4);
color: #000000 !important;
font-weight: 700;
font-size: 10px;
}
}
@media (max-width: 767px) {
.pos-features-bar {
padding: 16px;
}
.pos-feature-item {
gap: 10px;
}
.pos-feature-icon {
width: 38px;
height: 38px;
min-width: 38px;
font-size: 16px;
}
.pos-contact-chip {
width: 100%;
justify-content: center;
}
}
/*==================================
** Luxury Footer end ************
**===============================*/
/* ==========================================================================
Lux Product Page Styles - Arad POS Dark Luxury Theme
========================================================================== */
.lux-product-page,
.lux-product-page--dark {
/* متغیرهای رنگی اختصاصی هماهنگ با درباره ما و تماس با ما */
--bg-luxury: #111111;
--bg-luxury-card: #1E1E1E;
--bg-luxury-field: #151515;
--color-luxury-text: #B7B7B7;
--color-luxury-title: #F5F5F5;
--gold-luxury: #F59E0B;
--gold-luxury-hover: #E1BC63;
--gold-luxury-shadow: rgba(245, 158, 11, 0.2);
--border-luxury: rgba(245, 158, 11, 0.18);
background-color: var(--bg-luxury) !important;
color: var(--color-luxury-text) !important;
}
/* رنگهای کلی */
.lux-product-page .text-gold {
color: var(--gold-luxury) !important;
}
.lux-product-page .text-muted {
color: var(--color-luxury-text) !important;
}
.lux-product-page .text-dark,
.lux-product-page .text-light {
color: var(--color-luxury-title) !important;
}
.lux-product-page .lux-divider {
border-color: var(--border-luxury) !important;
}
/* کارتها و بلوکهای اصلی */
.lux-product-page .lux-surface,
.lux-product-page .lux-product-topbar {
background-color: var(--bg-luxury-card) !important;
border: 1px solid var(--border-luxury) !important;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45) !important;
}
.lux-product-page .lux-brand-badge {
background: rgba(245, 158, 11, 0.1);
border: 1px solid var(--border-luxury);
}
.lux-product-page .lux-amazing-timer {
background: linear-gradient(90deg, #251b0a 0%, var(--bg-luxury-field) 100%);
border: 1px solid var(--border-luxury);
}
/* ==========================================================================
گالری تصاویر (Gallery)
========================================================================== */
.lux-product-page .lux-gallery-box {
background: var(--bg-luxury-field);
border: 1px solid var(--border-luxury);
}
.lux-product-page .lux-gallery-stage {
background: #181818;
min-height: 290px;
display: flex;
align-items: center;
justify-content: center;
padding: 1rem;
}
.lux-product-page .product-gallery-thumb .swiper-slide {
opacity: 0.45;
border: 2px solid transparent;
border-radius: 8px;
overflow: hidden;
transition: 0.25s ease;
background: #181818;
}
.lux-product-page .product-gallery-thumb .swiper-slide-thumb-active {
opacity: 1;
border-color: var(--gold-luxury);
}
.lux-product-page .lux-floating-actions {
position: absolute;
top: 12px;
right: 12px;
z-index: 10;
display: flex;
flex-direction: column;
gap: 8px;
}
.lux-product-page .lux-floating-actions .icon-product-box-item {
width: 38px;
height: 38px;
background: #181818;
border: 1px solid var(--border-luxury);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
color: var(--gold-luxury);
box-shadow: 0 4px 12px rgba(0,0,0,0.5);
transition: 0.25s ease;
cursor: pointer;
}
.lux-product-page .lux-floating-actions .icon-product-box-item:hover {
background: var(--gold-luxury);
color: #111;
transform: translateY(-2px);
}
/* ==========================================================================
مشخصات و متای محصول (Specs)
========================================================================== */
.lux-product-page .lux-quick-specs {
background: var(--bg-luxury-field);
border: 1px solid var(--border-luxury);
}
.lux-product-page .lux-spec-row + .lux-spec-row {
border-top: 1px dashed rgba(245, 158, 11, 0.15);
}
.lux-product-page .lux-trust-chip {
background: var(--bg-luxury-field);
border: 1px solid var(--border-luxury);
}
.lux-product-page .lux-service-highlights {
background: var(--bg-luxury-field);
border: 1px solid var(--border-luxury);
}
/* ==========================================================================
سایدبار و جعبه خرید (Buy Box & Anti-Overflow Fixes)
========================================================================== */
@media (min-width: 992px) {
.lux-product-page .lux-buy-box {
position: sticky;
top: 1rem;
}
}
.lux-product-page .lux-buy-box {
background: linear-gradient(180deg, #222222 0%, #1a1a1a 100%) !important;
border: 1px solid var(--border-luxury) !important;
box-shadow: 0 12px 36px rgba(0, 0, 0, 0.6) !important;
overflow: hidden; /* جلوگیری از پرش المانها */
}
.lux-product-page .lux-price-box {
background: rgba(245, 158, 11, 0.08);
border: 1px solid var(--border-luxury);
}
.lux-product-page .lux-price-box .price del {
color: #777;
font-size: 0.85em;
margin-left: 8px;
}
.lux-product-page .lux-price-box .price ins {
text-decoration: none;
color: var(--gold-luxury);
}
/* بازنویسی فرم متغیرها و Swatches در ستون سایدبار برای رفع کامل سرریز (Overflow) */
.lux-buy-box form.cart {
margin-bottom: 0 !important;
width: 100% !important;
}
.lux-buy-box table.variations {
width: 100% !important;
margin-bottom: 12px !important;
border: none !important;
background: transparent !important;
}
.lux-buy-box table.variations tbody,
.lux-buy-box table.variations tr,
.lux-buy-box table.variations td {
display: block !important;
width: 100% !important;
padding: 0 !important;
border: none !important;
background: transparent !important;
}
.lux-buy-box table.variations td.label {
margin-bottom: 6px;
}
.lux-buy-box table.variations td.label label {
font-size: 13px !important;
font-weight: 700 !important;
color: var(--color-luxury-title) !important;
margin-bottom: 0 !important;
}
/* استایل دکمههای Swatches (۵ عددی، ۱۰ عددی و...) */
.lux-buy-box .woo-variation-swatches-stylesheet-enabled .variable-items-wrapper,
.lux-buy-box ul.variable-items-wrapper {
display: flex !important;
flex-wrap: wrap !important;
gap: 8px !important;
margin: 4px 0 10px 0 !important;
padding: 0 !important;
list-style: none !important;
}
.lux-buy-box .variable-item {
background: var(--bg-luxury-field) !important;
border: 1px solid rgba(255, 255, 255, 0.15) !important;
color: var(--color-luxury-title) !important;
border-radius: 8px !important;
font-size: 12px !important;
padding: 6px 12px !important;
min-width: unset !important;
height: auto !important;
box-shadow: none !important;
cursor: pointer;
transition: all 0.25s ease !important;
}
.lux-buy-box .variable-item:hover {
border-color: var(--gold-luxury) !important;
color: var(--gold-luxury) !important;
}
.lux-buy-box .variable-item.selected {
border-color: var(--gold-luxury) !important;
background: var(--gold-luxury) !important;
color: #111111 !important;
font-weight: bold !important;
box-shadow: 0 0 12px var(--gold-luxury-shadow) !important;
}
.lux-buy-box .reset_variations {
font-size: 11px !important;
color: #ef4444 !important;
margin-bottom: 10px !important;
display: inline-block !important;
text-decoration: none !important;
}
/* استایل بخش افزودن به سبد خرید و فیلد تعداد (Quantity) */
.lux-buy-box .woocommerce-variation-add-to-cart,
.lux-buy-box .single_variation_wrap {
width: 100% !important;
}
.lux-buy-box .woocommerce-variation-add-to-cart {
display: flex !important;
gap: 8px !important;
align-items: stretch !important;
}
.lux-buy-box .quantity {
margin: 0 !important;
flex-shrink: 0;
}
.lux-buy-box .quantity .qty {
width: 60px !important;
height: 48px !important;
background: var(--bg-luxury-field) !important;
border: 1px solid var(--border-luxury) !important;
border-radius: 10px !important;
color: #fff !important;
text-align: center;
font-weight: bold;
}
/* دکمه افزودن به سبد خرید */
.lux-product-page .lux-add-to-cart-wrapper .single_add_to_cart_button,
.lux-product-page .lux-add-to-cart-wrapper button[type="submit"] {
background: linear-gradient(135deg, var(--gold-luxury) 0%, #d97706 100%) !important;
border: none !important;
color: #111111 !important;
font-weight: 800 !important;
border-radius: 10px !important;
padding: 0.75rem 1rem !important;
width: 100% !important;
height: 48px !important;
box-shadow: 0 6px 20px var(--gold-luxury-shadow) !important;
transition: all 0.25s ease !important;
display: flex;
align-items: center;
justify-content: center;
}
.lux-product-page .lux-add-to-cart-wrapper .single_add_to_cart_button:hover {
background: linear-gradient(135deg, var(--gold-luxury-hover) 0%, var(--gold-luxury) 100%) !important;
transform: translateY(-2px) !important;
box-shadow: 0 8px 25px rgba(245, 158, 11, 0.4) !important;
}
/* ==========================================================================
تبها (Tabs)
========================================================================== */
.lux-product-page .lux-nav-pills .nav-link {
color: var(--color-luxury-text) !important;
background: var(--bg-luxury-field) !important;
border: 1px solid var(--border-luxury) !important;
border-radius: 10px;
padding: 10px 18px;
transition: 0.3s ease;
}
.lux-product-page .lux-nav-pills .nav-link.active,
.lux-product-page .lux-nav-pills .nav-link:hover {
color: #111111 !important;
background: var(--gold-luxury) !important;
border-color: var(--gold-luxury) !important;
box-shadow: 0 4px 15px var(--gold-luxury-shadow);
font-weight: bold;
}
.lux-product-page .lux-link-more {
color: var(--gold-luxury) !important;
font-weight: 700;
font-size: 13px;
text-decoration: underline;
}
/* جدول مشخصات فنی در تب */
.lux-product-page .lux-table-wrapper table.shop_attributes {
width: 100% !important;
border-collapse: separate !important;
border-spacing: 0 !important;
border: 1px solid var(--border-luxury) !important;
border-radius: 10px !important;
overflow: hidden !important;
}
.lux-product-page .lux-table-wrapper table.shop_attributes th,
.lux-product-page .lux-table-wrapper table.shop_attributes td {
padding: 12px 16px !important;
font-size: 13px !important;
border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}
.lux-product-page .lux-table-wrapper table.shop_attributes th {
background: rgba(245, 158, 11, 0.1) !important;
color: var(--gold-luxury) !important;
width: 32% !important;
}
.lux-product-page .lux-table-wrapper table.shop_attributes td {
background: var(--bg-luxury-field) !important;
color: var(--color-luxury-title) !important;
}
/* ==========================================================================
آکاردئون سوالات متداول (FAQ)
========================================================================== */
.lux-product-page .lux-accordion .accordion-item {
border: 1px solid var(--border-luxury) !important;
background: var(--bg-luxury-field) !important;
border-radius: 10px !important;
margin-bottom: 10px;
overflow: hidden;
}
.lux-product-page .lux-accordion .accordion-button {
background: var(--bg-luxury-field) !important;
color: var(--color-luxury-title) !important;
box-shadow: none !important;
}
.lux-product-page .lux-accordion .accordion-button:not(.collapsed) {
background: rgba(245, 158, 11, 0.1) !important;
color: var(--gold-luxury) !important;
}
.lux-product-page .lux-accordion .accordion-button::after {
filter: invert(1) brightness(0.8);
}
.lux-product-page .lux-accordion .accordion-body {
background: var(--bg-luxury-card) !important;
color: var(--color-luxury-text) !important;
}
/* ==========================================================================
مودال اشتراکگذاری (Share Modal)
========================================================================== */
#shareModal .lux-modal-content {
background: var(--bg-luxury-card) !important;
border: 1px solid var(--border-luxury) !important;
border-radius: 16px;
box-shadow: 0 16px 48px rgba(0, 0, 0, 0.8) !important;
}
.lux-share-btn {
border-radius: 10px;
color: #fff;
border: none;
}
.btn-whatsapp { background: #25d366; }
.btn-telegram { background: #0088cc; }
.btn-twitter { background: #181818; border: 1px solid #333; }
.btn-email { background: var(--gold-luxury); color: #111 !important; font-weight: bold; }
/* Breadcrumb */
.lux-product-page .breadcrumb-item + .breadcrumb-item::before {
color: #555;
}
/* ==========================================================================
فیکس نهایی: رفع اورفلو سواچها + حذف بوردر گالری
========================================================================== */
/* ---------- ۱) رفع کامل اورفلو و زیباسازی سواچهای رول کاغذ ---------- */
/* ظرف اصلی فرم متغیرها: هیچ چیز از کادر بیرون نزند */
.lux-buy-box form.cart,
.lux-buy-box table.variations,
.lux-buy-box .variations td.value,
.lux-buy-box .variations .value {
max-width: 100% !important;
overflow-wrap: break-word;
}
/* هر نوع خروجی لیستی افزونه (ul / div) به چیپهای فلکس تبدیل شود */
.lux-buy-box .variations td.value ul,
.lux-buy-box .variations .value ul,
.lux-buy-box .variations .value .variable-items-wrapper {
display: flex !important;
flex-wrap: wrap !important; /* کلید رفع اورفلو: رفتن به سطر بعدی */
gap: 8px !important;
list-style: none !important;
margin: 6px 0 0 0 !important;
padding: 0 !important;
width: 100% !important;
}
/* اگر افزونه خروجی لیستی داد، لیبلهای radio را به دکمه چیپ تبدیل کن */
.lux-buy-box .variations td.value ul li,
.lux-buy-box .variations .value ul li {
margin: 0 !important;
padding: 0 !important;
list-style: none !important;
float: none !important;
}
/* مخفی کردن دایره radio و اتصال استایل به لیبل */
.lux-buy-box .variations .value input[type="radio"],
.lux-buy-box .variations .value input[type="checkbox"] {
position: absolute !important;
opacity: 0 !important;
width: 1px !important;
height: 1px !important;
pointer-events: none;
}
.lux-buy-box .variations .value ul li label,
.lux-buy-box .variations .value label {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
background: var(--bg-luxury-field, #151515) !important;
border: 1px solid rgba(255, 255, 255, 0.15) !important;
border-radius: 10px !important;
color: var(--color-luxury-title, #F5F5F5) !important;
font-size: 13px !important;
font-weight: 600 !important;
padding: 8px 16px !important;
margin: 0 !important;
cursor: pointer !important;
transition: all 0.25s ease !important;
white-space: nowrap;
line-height: 1.4 !important;
}
.lux-buy-box .variations .value ul li label:hover,
.lux-buy-box .variations .value label:hover {
border-color: var(--gold-luxury, #F59E0B) !important;
color: var(--gold-luxury, #F59E0B) !important;
}
/* حالت انتخابشده: چون radio مخفی است، از :checked + label استفاده میکنیم */
.lux-buy-box .variations .value input[type="radio"]:checked + label,
.lux-buy-box .variations .value input[type="checkbox"]:checked + label,
.lux-buy-box .variable-item.selected {
background: var(--gold-luxury, #F59E0B) !important;
border-color: var(--gold-luxury, #F59E0B) !important;
color: #111111 !important;
font-weight: 800 !important;
box-shadow: 0 0 14px rgba(245, 158, 11, 0.35) !important;
}
/* اگر سواچ به صورت select پیشفرض رندر شده باشد */
.lux-buy-box .variations td.value select,
.lux-buy-box .variations .value select {
width: 100% !important;
background: var(--bg-luxury-field, #151515) !important;
color: var(--color-luxury-title, #F5F5F5) !important;
border: 1px solid var(--border-luxury, rgba(245,158,11,0.18)) !important;
border-radius: 10px !important;
padding: 10px 14px !important;
font-size: 13px !important;
}
/* لیبل عنوان ویژگی (رول کاغذ حرارتی) */
.lux-buy-box .variations td.label label {
display: block;
margin-bottom: 6px;
}
/* ---------- ۲) حذف بوردر و ناهماهنگی گالری ---------- */
/* حذف قاب دور کل باکس گالری */
.lux-product-page .lux-gallery-box {
border: none !important;
background: transparent !important;
box-shadow: none !important;
}
/* حذف بوردر داخلی دور تصویر اصلی */
.lux-product-page .lux-gallery-stage {
background: transparent !important;
border: none !important;
padding: 0 !important;
min-height: auto !important;
}
.lux-product-page .product-gallery .swiper-slide,
.lux-product-page .product-gallery img {
border: none !important;
outline: none !important;
box-shadow: none !important;
background: transparent !important;
}
/* هماهنگسازی دکمههای ناوبری با تم طلایی */
.lux-product-page .product-gallery .swiper-button-next,
.lux-product-page .product-gallery .swiper-button-prev {
width: 40px !important;
height: 40px !important;
background: rgba(30, 30, 30, 0.85) !important;
border: 1px solid var(--border-luxury, rgba(245, 158, 11, 0.18)) !important;
border-radius: 50% !important;
color: var(--gold-luxury, #F59E0B) !important;
transition: 0.25s ease;
}
.lux-product-page .product-gallery .swiper-button-next:hover,
.lux-product-page .product-gallery .swiper-button-prev:hover {
background: var(--gold-luxury, #F59E0B) !important;
color: #111 !important;
}
.lux-product-page .product-gallery .swiper-button-next::after,
.lux-product-page .product-gallery .swiper-button-prev::after {
font-size: 16px !important;
font-weight: 800;
}
/* اسلایدر تصاویر کوچک ( thumbs ) — حذف پسزمینه اضافه */
.lux-product-page .product-gallery-thumb .swiper-slide {
background: transparent !important;
opacity: 0.4;
}
.lux-product-page .product-gallery-thumb .swiper-slide-thumb-active {
opacity: 1 !important;
}
.products-addons td {
display: flex;
flex-direction: column;
}
/* ==========================================================================
End of Arad POS Product Styles
========================================================================== */
/*====================================
** Luxury styles (about & contact) **
**=================================*/
.luxury-text-widget {
max-width: 600px;
margin: auto;
}
.lux-form .contact-form *, .lux-form .contact-form {
background-color: #f7f7f7 !important;
}
.lux-form .contact-form {
box-shadow: 0px 0px 15px #D4A843;
}
.contact-us-lux-map .elementor-widget-wrap.elementor-element-populated {
padding: 0;
}
.contact-us-lux-map {
filter: hue-rotate(180deg);
filter: invert(90%);
}
/*============= لوستر زنده ============*/
/* ========================================================
Live Chandelier (V2) - Physics Based Animation
======================================================== */
.live-chandeler {
cursor: pointer;
user-select: none;
position: relative;
display: inline-block;
transform-origin: top center; /* نقطه اتصال لوستر به سقف */
will-change: transform, filter;
transition: filter 0.6s ease;
/* متغیرهای کنترل حالت */
--lc-glow-opacity: 0.8;
--lc-glow-size: 50px;
--lc-brightness: 1.1;
}
/* تصویر وقتی خاموش است */
.live-chandeler.is-off {
--lc-glow-opacity: 0;
--lc-glow-size: 0px;
--lc-brightness: 0.6;
filter: brightness(var(--lc-brightness)) grayscale(0.3) !important;
}
/* افکت نوری پشت لوستر (Glow) */
.live-chandeler::before {
content: "";
position: absolute;
inset: -15%;
z-index: -1;
pointer-events: none;
background: radial-gradient(circle at 50% 40%, rgba(212, 168, 67, 0.5) 0%, transparent 70%);
opacity: var(--lc-glow-opacity);
filter: blur(25px);
transition: all 0.7s ease;
}
/* استایل خود تصویر و درخشش روی بدنه */
.live-chandeler img,
img.live-chandeler {
filter: drop-shadow(0 0 var(--lc-glow-size) rgba(212, 168, 67, 0.4)) brightness(var(--lc-brightness));
transition: all 0.7s ease;
max-width: 100%;
height: auto;
}
/* انیمیشن Idle (تکان ملایم همیشگی) */
.live-chandeler.is-ready {
animation: lc-idleSwing 6s ease-in-out infinite;
}
@keyframes lc-idleSwing {
0%, 100% { transform: rotate(-1.5deg); }
50% { transform: rotate(1.5deg); }
}
/* انیمیشن فیزیکی ضربه (برگرفته از ویجت بنر شما) */
.live-chandeler.hit-animation {
animation: lc-physicsSwing 5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both !important;
}
@keyframes lc-physicsSwing {
0% { transform: rotate(0deg); }
8% { transform: rotate(16deg); }
20% { transform: rotate(-11deg); }
34% { transform: rotate(7deg); }
48% { transform: rotate(-4deg); }
62% { transform: rotate(2.5deg); }
76% { transform: rotate(-1.2deg); }
90% { transform: rotate(0.4deg); }
100% { transform: rotate(0deg); }
}
/*============= پایان لوستر زنده ============
/* استایل کلی بخش تبدار */
.cama-tabbed-product-wrapper {
position: relative;
padding: 25px 0;
direction: rtl;
}
/* ساختار هدر و خط زیرین */
.cama-tabbed-header {
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 2px solid #f0f0f0;
margin-bottom: 24px;
position: relative;
flex-direction: column;
}
/* عنوان اصلی در سمت راست */
.cama-section-main-title h3 {
font-size: 1.15rem;
font-weight: 800;
color: #1a1a1a;
margin: 0;
padding-bottom: 12px;
}
/* دکمههای تب */
.cama-tab-btn {
background: transparent;
border: none;
outline: none;
cursor: pointer;
font-size: 0.95rem;
font-weight: 600;
color: #757575;
padding: 0 4px 12px 4px;
position: relative;
transition: color 0.25s ease;
}
/*.cama-tab-btn:hover {*/
/* color: #c2185b;*/
/*}*/
/* خط صورتی زیر تب فعال */
.cama-tab-btn.is-active {
/*color: #c2185b;*/
font-weight: 700;
}
.cama-tab-btn.is-active::after {
content: '';
position: absolute;
bottom: -2px;
left: 0;
right: 0;
height: 3px;
/*background-color: #c2185b;*/
border-radius: 3px 3px 0 0;
}
/* پنلهای تب */
.cama-tab-pane {
display: none;
opacity: 0;
transition: opacity 0.3s ease;
}
.cama-tab-pane.is-active {
display: block;
opacity: 1;
}
/* ناوبری اسلایدر */
.cama-tab-swiper .swiper-button-next,
.cama-tab-swiper .swiper-button-prev {
width: 38px;
height: 38px;
background-color: #ffffff;
border: 1px solid #e0e0e0;
border-radius: 50%;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
color: #333;
}
.cama-tab-swiper .swiper-button-next::after,
.cama-tab-swiper .swiper-button-prev::after {
font-size: 14px;
font-weight: bold;
}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
pointer-events: auto !important;
}
/************************
== Arad Poz Contact Us ==
*************************/
/* بکگراند کارتهای تماس در هماهنگی با فوتر دارک-گلد */
.contact-card-box {
background: rgba(22, 27, 34, 0.75);
border: 1px solid rgba(217, 119, 6, 0.2);
border-radius: 18px;
padding: 30px 24px;
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
position: relative;
overflow: hidden;
}
.contact-card-box::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 3px;
background: linear-gradient(90deg, transparent, #d97706, transparent);
opacity: 0;
transition: opacity 0.3s ease;
}
.contact-card-box:hover {
transform: translateY(-6px);
border-color: rgba(217, 119, 6, 0.6);
box-shadow: 0 12px 30px rgba(0, 0, 0, 0.5), 0 0 20px rgba(217, 119, 6, 0.2);
}
.contact-card-box:hover::before {
opacity: 1;
}
/* آیکون کارتها */
.contact-card-icon {
width: 60px;
height: 60px;
border-radius: 14px;
background: rgba(217, 119, 6, 0.1);
border: 1px solid rgba(217, 119, 6, 0.3);
display: flex;
align-items: center;
justify-content: center;
font-size: 26px;
color: #f59e0b;
margin-bottom: 20px;
}
/* استایل فیلدهای اینپوت فرم تماس */
.contact-pos-form input,
.contact-pos-form select,
.contact-pos-form textarea {
background: rgba(13, 17, 23, 0.8) !important;
border: 1px solid rgba(255, 255, 255, 0.12) !important;
color: #f1f5f9 !important;
border-radius: 12px !important;
padding: 14px 16px !important;
transition: all 0.3s ease;
}
.contact-pos-form input:focus,
.contact-pos-form select:focus,
.contact-pos-form textarea:focus {
border-color: #d97706 !important;
box-shadow: 0 0 12px rgba(217, 119, 6, 0.35) !important;
outline: none !important;
}
/* دکمه ارسال فرم */
.contact-pos-submit-btn {
background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
color: #000000 !important;
font-weight: 700 !important;
border-radius: 12px !important;
padding: 14px 28px !important;
border: none !important;
box-shadow: 0 4px 18px rgba(217, 119, 6, 0.35);
transition: all 0.3s ease;
}
.contact-pos-submit-btn:hover {
transform: translateY(-2px);
box-shadow: 0 6px 24px rgba(217, 119, 6, 0.55);
}
/* استایل کلی کانتینر فرم تماس ۷ آراد پوز */
.pos-cf7-wrapper {
background: rgba(22, 27, 34, 0.7);
border: 1px solid rgba(217, 119, 6, 0.25);
border-radius: 20px;
padding: 32px 28px;
backdrop-filter: blur(14px);
-webkit-backdrop-filter: blur(14px);
box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4);
direction: rtl;
text-align: right;
}
/* ساختار دو ستونه فرم */
.pos-cf7-row {
display: flex;
flex-wrap: wrap;
gap: 20px;
margin-bottom: 20px;
}
.pos-cf7-col {
flex: 1 1 calc(50% - 10px);
display: flex;
flex-direction: column;
}
.pos-cf7-row.full-width .pos-cf7-col {
flex: 1 1 100%;
}
/* برچسب فیلدها */
.pos-cf7-label {
font-size: 13.5px;
font-weight: 600;
color: #e2e8f0;
margin-bottom: 8px;
display: block;
}
.pos-cf7-label .required-star {
color: #ef4444;
font-size: 14px;
margin-right: 2px;
}
.pos-cf7-label .optional-text {
font-size: 11.5px;
color: #94a3b8;
font-weight: normal;
}
/* استایل اینپوتها، سلکتباکس و تکستاریا */
.pos-cf7-wrapper input[type="text"],
.pos-cf7-wrapper input[type="tel"],
.pos-cf7-wrapper input[type="email"],
.pos-cf7-wrapper select,
.pos-cf7-wrapper textarea {
width: 100% !important;
background: rgba(13, 17, 23, 0.85) !important;
border: 1px solid rgba(255, 255, 255, 0.12) !important;
color: #f8fafc !important;
border-radius: 12px !important;
padding: 13px 16px !important;
font-size: 14px !important;
font-family: inherit !important;
box-sizing: border-box !important;
transition: all 0.3s ease !important;
}
.pos-cf7-wrapper input::placeholder,
.pos-cf7-wrapper textarea::placeholder {
color: #9EBDC9 !important;
font-size: 13px !important;
}
/* استایل حالت Focus (کلیک داخل فیلد) */
.pos-cf7-wrapper input:focus,
.pos-cf7-wrapper select:focus,
.pos-cf7-wrapper textarea:focus {
border-color: #d97706 !important;
background: rgba(13, 17, 23, 0.95) !important;
box-shadow: 0 0 14px rgba(217, 119, 6, 0.35) !important;
outline: none !important;
}
/* استایل سلکت باکس */
.pos-cf7-wrapper select {
cursor: pointer;
}
.pos-cf7-wrapper select option {
background: #161b22;
color: #ffffff;
}
/* دکمه ارسال */
.pos-cf7-submit-wrapper {
margin-top: 10px;
text-align: left;
}
.pos-cf7-btn {
background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
color: #0b0f14 !important;
font-size: 15px !important;
font-weight: 800 !important;
border: none !important;
border-radius: 12px !important;
padding: 14px 36px !important;
cursor: pointer !important;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
box-shadow: 0 4px 18px rgba(217, 119, 6, 0.35) !important;
width: auto !important;
}
.pos-cf7-btn:hover {
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(217, 119, 6, 0.55) !important;
background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%) !important;
}
/* لودر و پیامهای خطا و موفقیت CF7 */
.pos-cf7-wrapper .wpcf7-spinner {
margin: 0 10px 0 0;
background-color: #f59e0b;
}
.pos-cf7-wrapper .wpcf7-not-valid-tip {
color: #ef4444;
font-size: 12px;
margin-top: 6px;
}
.pos-cf7-wrapper .wpcf7-response-output {
border-radius: 10px !important;
padding: 12px 16px !important;
margin-top: 20px !important;
font-size: 13.5px !important;
border: 1px solid transparent !important;
}
.pos-cf7-wrapper .wpcf7-mail-sent-ok {
background: rgba(16, 185, 129, 0.15) !important;
border-color: #10b981 !important;
color: #34d399 !important;
}
.pos-cf7-wrapper .wpcf7-validation-errors {
background: rgba(239, 68, 68, 0.15) !important;
border-color: #ef4444 !important;
color: #f87171 !important;
}
/* ریسپانسیو موبایل */
@media (max-width: 768px) {
.pos-cf7-col {
flex: 1 1 100%;
}
.pos-cf7-wrapper {
padding: 22px 18px;
}
.pos-cf7-submit-wrapper {
text-align: stretch;
}
.pos-cf7-btn {
width: 100% !important;
}
}
/**************************
== Arad Poz Contact Us End
**************************/
/**********************************
== Arad Poz Representation CF7
**********************************/
/* استایل برای چکباکس پذیرش و رضایت */
.pos-cf7-wrapper .pos-cf7-consent {
margin-top: 5px;
margin-bottom: 10px;
}
.pos-cf7-wrapper .pos-cf7-consent label {
font-size: 13px;
color: #c7c7c7;
cursor: pointer;
display: flex;
align-items: center;
gap: 8px;
}
.pos-cf7-wrapper .pos-cf7-consent input[type="checkbox"] {
accent-color: #0b63e5; /* رنگ برند آرادپوز */
width: 17px;
height: 17px;
cursor: pointer;
}
.pos-cf7-wrapper .optional-text {
font-size: 11px;
color: var(--main-color-one-hover);
font-weight: normal;
margin-right: 4px;
}
/*===================================
== Arad Poz Representation CF7 End
*=================================*/