/*--------- Abstracts variable ---------- */
 @import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
 @import url(./bootstrap-select.min.css);

 :root {
   --primary: #ff6f61;
   --primary-2: #ff9a90;
   --primary-3: #ffc5c0;
   --primary-4: #fff1ef;
   --primary-green: #39ae52;
   --secondary: #4b4ded;
   --secondary-2: rgba(75, 77, 237, 0.75);
   --secondary-3: rgba(75, 77, 237, 0.5);
   --secondary-4: #efeffd;
   --dark: #000000;
   --dark-1: #6a6a6a;
   --dark-2: #101828;
   --dark-3: #282828;
   --dark-4: #1c1c1c;
   --dark-5: #252525;
   --white: #ffffff;
   --white-2: #edeae5;
   --purple: #9148ff;
   --purple-2: #f6efff;
   --violet: #a83fff;
   --violet-2: #a474ff;
   --success: #31d0aa;
   --success-2: rgba(49, 208, 170, 0.75);
   --success-3: rgba(49, 208, 170, 0.5);
   --success-4: rgba(49, 208, 170, 0.1);
   --light-green: #00ba00;
   --text: #545454;
   --text-2: #393939;
   --text-3: #667085;
   --text-4: #757575;
   --line: #ebebeb;
   --line-2: #f2f4f7;
   --line-3: #c9c9c9;
   --line-4: #e4e7ec;
   --line-5: rgba(126, 126, 126, 0.2);
   --surface: #f5f5f5;
   --surface-2: #f7f7f7;
   --surface-3: #f3f3f3;
   --shadow-1: 0px 4px 20px 0px #0000001a;
   --gradient-1: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #ffffff 100%);
   --gradient-2: linear-gradient(180deg, rgba(231, 236, 210, 0) 0%, #e7ecd2 100%);
   --backdrop: rgba(0, 0, 0, 0.4);
   --bg-scrollbar-track: #f1f1f1;
   --bg-scrollbar-thumb: #c1c1c1;
   --rgba-white: rgba(255, 255, 255, 0.8);
   --rgba-dark: rgba(0, 0, 0, 0.6);
   --rgba-dark-2: rgba(0, 0, 0, 0.8);
   --rgba-dark-3: rgba(0, 0, 0, 0.2);
   --yellow: #ffc108;
   --yellow-2: #ff9a00;
   --brown: #8f5252;
   --red: #e21b1b;
   --Montserrat: "Montserrat", sans-serif;
   --Poppins: "Poppins", sans-serif;
 }

 .primary-2 {
   --primary: #39ae52;
 }

 .primary-3 {
   --primary: #d62c2c;
 }

 .primary-4 {
   --primary: #e4763b;
   --primary-rgb: 228 118 59;
 }

 .primary-5 {
   --primary: #942121;
   --primary-rgb: 148 33 33;
 }


 /*--------- Abstracts variable ---------- */
 html,
 body,
 div,
 span,
 applet,
 object,
 iframe,
 h1,
 h2,
 h3,
 h4,
 h5,
 h6,
 p,
 blockquote,
 pre,
 a,
 abbr,
 acronym,
 address,
 big,
 cite,
 code,
 del,
 dfn,
 em,
 img,
 ins,
 kbd,
 q,
 s,
 samp,
 small,
 strike,
 strong,
 sub,
 sup,
 tt,
 var,
 b,
 u,
 i,
 center,
 dl,
 dt,
 dd,
 ol,
 ul,
 li,
 fieldset,
 form,
 label,
 legend,
 table,
 caption,
 tbody,
 tfoot,
 thead,
 tr,
 th,
 td,
 article,
 aside,
 canvas,
 details,
 embed,
 figure,
 figcaption,
 footer,
 header,
 hgroup,
 menu,
 nav,
 output,
 ruby,
 section,
 summary,
 time,
 mark,
 audio,
 video {
   margin: 0;
   padding: 0;
   border: 0;
   outline: 0;
   font-size: 100%;
   font: inherit;
   vertical-align: baseline;
   font-family: var(--Poppins);
   font-size: 100%;
   font-style: inherit;
   font-weight: inherit;
 }

 article,
 aside,
 details,
 figcaption,
 figure,
 footer,
 header,
 hgroup,
 menu,
 nav,
 section {
   display: block;
 }

 /* Elements
-------------------------------------------------------------- */
 html {
   margin-right: 0 !important;
   scroll-behavior: smooth;
 }

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

 body {
   font-family: var(--Poppins);
   font-size: 14px;
   line-height: 20px;
   font-weight: 400;
   background-color: var(--white);
   font-style: normal;
   color: var(--dark);
 }

 img {
   max-width: 100%;
   height: auto;
   transform: scale(1);
   vertical-align: middle;
   -ms-interpolation-mode: bicubic;
 }

 .row {
   margin-right: -12px;
   margin-left: -12px;
 }

 .row>* {
   padding-left: 12px;
   padding-right: 12px;
 }

 ul,
 li {
   list-style-type: none;
   margin-bottom: 0;
   padding-left: 0;
   list-style: none;
 }

 .container {
   max-width: 1488px;
 }

 .container-2 {
   max-width: 1436px;
 }

 .container-3 {
   max-width: 1560px;
 }

 .container-4 {
   max-width: 1688px;
 }

 .container-5 {
   max-width: 1728px;
 }

 .container-6 {
   max-width: 1288px;
 }

 .container-7 {
   max-width: 1268px;
 }

 .container-7,
 .container-6,
 .container-5,
 .container-4,
 .container-3,
 .container-2,
 .container {
   width: 100%;
   margin: auto;
 }

 .container-7,
 .container-6,
 .container-5,
 .container-4,
 .container-3,
 .container-2,
 .container {
   padding-left: 15px;
   padding-right: 15px;
 }

 .container-full {
   width: 100%;
   max-width: 100%;
   margin: 0 auto;
   padding: 0px 15px;
 }

 .slider-layout-right {
   width: calc(100vw - (100vw - 1488px) / 2 - 7px);
   margin-right: unset;
   max-width: 100%;
   margin-left: auto;
   padding: 0 15px;
 }

 .slider-layout-right .swiper:not(.tf-sw-right) {
   margin-right: -15px;
 }

 .container-6 .wg-cls.style-circle {
   gap: 16px;
 }

 svg path {
   transition: all 0.3s ease-in-out;
 }

 textarea,
 input[type=text],
 input[type=password],
 input[type=datetime],
 input[type=datetime-local],
 input[type=date],
 input[type=month],
 input[type=time],
 input[type=week],
 input[type=number],
 input[type=email],
 input[type=url],
 input[type=search],
 input[type=tel],
 input[type=color] {
   font-family: var(--Poppins);
   border: 1px solid var(--line);
   outline: 0;
   box-shadow: none;
   font-size: 14px;
   line-height: 20px;
   border-radius: 6px;
   padding: 14px 20px;
   width: 100%;
   background: var(--white);
   color: var(--rgba-dark-2);
   height: 50px;
   font-weight: 400;
   transition: all 0.3s ease-in-out;
 }

 textarea:hover,
 textarea:focus,
 input[type=text]:hover,
 input[type=text]:focus,
 input[type=password]:hover,
 input[type=password]:focus,
 input[type=datetime]:hover,
 input[type=datetime]:focus,
 input[type=datetime-local]:hover,
 input[type=datetime-local]:focus,
 input[type=date]:hover,
 input[type=date]:focus,
 input[type=month]:hover,
 input[type=month]:focus,
 input[type=time]:hover,
 input[type=time]:focus,
 input[type=week]:hover,
 input[type=week]:focus,
 input[type=number]:hover,
 input[type=number]:focus,
 input[type=email]:hover,
 input[type=email]:focus,
 input[type=url]:hover,
 input[type=url]:focus,
 input[type=search]:hover,
 input[type=search]:focus,
 input[type=tel]:hover,
 input[type=tel]:focus,
 input[type=color]:hover,
 input[type=color]:focus {
   border-color: var(--rgba-dark-2);
 }

 textarea.style-2,
 input[type=text].style-2,
 input[type=password].style-2,
 input[type=datetime].style-2,
 input[type=datetime-local].style-2,
 input[type=date].style-2,
 input[type=month].style-2,
 input[type=time].style-2,
 input[type=week].style-2,
 input[type=number].style-2,
 input[type=email].style-2,
 input[type=url].style-2,
 input[type=search].style-2,
 input[type=tel].style-2,
 input[type=color].style-2 {
   padding-left: 12px;
   padding-right: 12px;
 }

 textarea::placeholder,
 input[type=text]::placeholder,
 input[type=password]::placeholder,
 input[type=datetime]::placeholder,
 input[type=datetime-local]::placeholder,
 input[type=date]::placeholder,
 input[type=month]::placeholder,
 input[type=time]::placeholder,
 input[type=week]::placeholder,
 input[type=number]::placeholder,
 input[type=email]::placeholder,
 input[type=url]::placeholder,
 input[type=search]::placeholder,
 input[type=tel]::placeholder,
 input[type=color]::placeholder {
   color: rgba(102, 112, 133, 0.8);
   transition: all 0.3s ease-in-out;
 }

 textarea {
   height: 160px;
   resize: none;
 }

 select {
   outline: 0;
 }

 /* Placeholder color */
 ::-webkit-input-placeholder {
   color: var(--text-3);
 }

 :-moz-placeholder {
   color: var(--text-3);
 }

 ::-moz-placeholder {
   color: var(--text-3);
   opacity: 1;
 }

 button {
   transition: all 0.3s ease-in-out;
   background-color: var(--dark);
   border: 1px solid var(--dark);
   color: var(--white);
   padding: 13px 32px;
   border-radius: 99px;
   display: inline-flex;
   justify-content: center;
   align-items: center;
   gap: 8px;
   font-size: 16px;
   line-height: 24px;
   font-weight: 500;
 }

 button .icon {
   font-size: 22px;
 }

 button:focus-within,
 button:focus-visible,
 button:focus {
   outline: none;
 }

 /* Since FF19 lowers the opacity of the placeholder by default */
 :-ms-input-placeholder {
   color: var(--secondary-2);
 }

 /* Typography
-------------------------------------------------------------- */
 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
   text-rendering: optimizeLegibility;
   color: var(--dark);
   font-weight: 500;
 }

 h1,
 .display-2xl {
   font-size: 72px;
   line-height: 90px;
 }

 .display-2xl-2 {
   font-size: 69px;
   line-height: 79px;
 }

 .display-xl-2 {
   font-size: 64px;
   line-height: 76.8px;
 }

 h2,
 .display-xl {
   font-size: 60px;
   line-height: 72px;
 }

 h3,
 .display-lg {
   font-size: 48px;
   line-height: 60px;
 }

 .display-lg-2 {
   font-size: 40px;
   line-height: 48px;
 }

 .display-lg-3 {
   font-size: 48px;
   line-height: 57.6px;
 }

 .display-lg-4 {
   font-size: 39px;
   line-height: 49px;
 }

 .display-lg-5 {
   font-size: 49px;
   line-height: 59px;
 }

 .display-lg-6 {
   font-size: 54px;
   line-height: 64px;
 }

 .display-lg-7 {
   font-size: 42px;
   line-height: 52px;
 }

 h4,
 .display-md {
   font-size: 36px;
   line-height: 44px;
   letter-spacing: -0.02em;
 }

 .display-md-2 {
   font-size: 32px;
   line-height: 38px;
 }

 .display-md-3 {
   font-size: 34px;
   line-height: 44px;
 }

 h5,
 .display-sm {
   font-size: 30px;
   line-height: 38px;
 }

 .display-sm-2 {
   font-size: 28px;
   line-height: 38px;
 }

 h6,
 .display-xs {
   font-size: 24px;
   line-height: 32px;
 }

 .display-xs-2 {
   font-size: 26px;
   line-height: 36px;
 }

 .text-xl {
   font-size: 20px;
   line-height: 30px;
 }

 .text-xl-2 {
   font-size: 20px;
   line-height: 24px;
 }

 .text-xl-3 {
   font-size: 20px;
   line-height: 32px;
 }

 .text-lg {
   font-size: 18px;
   line-height: 28px;
 }

 .text-md {
   font-size: 16px;
   line-height: 24px;
 }

 .text-sm {
   font-size: 14px;
   line-height: 20px;
 }

 .text-xs {
   font-size: 12px;
   line-height: 18px;
 }

 .text-xxs {
   font-size: 10px;
   line-height: 14px;
 }

 .text-caption {
   font-size: 12px;
   line-height: 15.72px;
 }

 .fs-84 {
   font-size: 84px;
   line-height: 84px;
 }

 .body-text {
   font-size: 16px;
   line-height: 25.6px;
 }

 .body-text-2 {
   font-size: 16px;
   line-height: 19.2px;
 }

 .fs-7 {
   font-size: 7px !important;
 }

 .fs-8 {
   font-size: 8px !important;
 }

 .fs-10 {
   font-size: 10px !important;
 }

 .fs-12 {
   font-size: 12px !important;
 }

 .fs-13 {
   font-size: 13px !important;
 }

 .fs-14 {
   font-size: 14px !important;
 }

 .fs-15 {
   font-size: 15px !important;
 }

 .fs-16 {
   font-size: 16px !important;
 }

 .fs-18 {
   font-size: 18px !important;
 }

 .fs-20 {
   font-size: 20px !important;
 }

 .lh-32px {
   line-height: 32px !important;
 }

 .font-main {
   font-family: var(--Poppins);
 }

 .font-2 {
   font-family: "Albert Sans", sans-serif !important;
 }

 .font-3 {
   font-family: "Playfair Display", serif !important;
 }

 .font-4 {
   font-family: "DM Sans", sans-serif !important;
 }

 .font-5 {
   font-family: "Nunito", sans-serif !important;
 }

 .font-6 {
   font-family: "Be Vietnam Pro", serif !important;
 }

 .font-7 {
   font-family: "Oswald", sans-serif !important;
 }

 .font-8 {
   font-family: "Grandstander", cursive !important;
 }

 .font-9 {
   font-family: "Jost", sans-serif !important;
 }

 .font-10 {
   font-family: "Agbalumo", sans-serif !important;
 }

 .font-11 {
   font-family: "Manrope", sans-serif !important;
 }

 .font-12 {
   font-family: "Open Sans", sans-serif !important;
 }

 .font-13 {
   font-family: "Inter", sans-serif !important;
 }

 .font-14 {
   font-family: "Gloock", sans-serif !important;
 }

 b,
 strong {
   font-weight: bolder;
 }

 video {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .text-primary {
   color: var(--primary) !important;
 }

 .text-primary-2 {
   color: var(--primary-2) !important;
 }

 .text-primary-3 {
   color: var(--primary-3) !important;
 }

 .text-primary-4 {
   color: var(--primary-4) !important;
 }

 .text-secondary {
   color: var(--secondary) !important;
 }

 .text-secondary-2 {
   color: var(--secondary-2) !important;
 }

 .text-secondary-3 {
   color: var(--secondary-3) !important;
 }

 .text-secondary-4 {
   color: var(--secondary-4) !important;
 }

 .text-dark {
   color: var(--dark) !important;
 }

 .text-dark-1 {
   color: var(--rgba-dark) !important;
 }

 .text-dark-2 {
   color: var(--dark-2) !important;
 }

 .text-dark-3 {
   color: var(--dark-3) !important;
 }

 .text-dark-4 {
   color: var(--rgba-dark-2) !important;
 }

 .text-dark-5 {
   color: var(--dark-4) !important;
 }

 .text-dark-6 {
   color: #222222 !important;
 }

 .text-dark-7 {
   color: #1f1f1f !important;
 }

 .text-dark-8 {
   color: #252525 !important;
 }

 .text-dark-9 {
   color: rgba(28, 28, 28, 0.6) !important;
 }

 .text-dark-10 {
   color: var(--dark-5) !important;
 }

 .text-white {
   color: var(--white) !important;
 }

 .text-success {
   color: var(--success) !important;
 }

 .text-success-2 {
   color: var(--success-2) !important;
 }

 .text-success-3 {
   color: var(--success-3) !important;
 }

 .text-success-4 {
   color: var(--success-4) !important;
 }

 .text-success-5 {
   color: #39b44b !important;
 }

 .text-main {
   color: var(--text) !important;
 }

 .text-main-2 {
   color: var(--text-2) !important;
 }

 .text-main-3 {
   color: #504545 !important;
 }

 .text-main-4 {
   color: #818181 !important;
 }

 .text-grey {
   color: #acacac !important;
 }

 .text-grey-2 {
   color: #747474 !important;
 }

 .text-grey-3 {
   color: #777777 !important;
 }

 .text-grey-4 {
   color: rgba(255, 255, 255, 0.6) !important;
 }

 .text-grey-5 {
   color: #a9a9a9 !important;
 }

 .text-grey-6 {
   color: #494949 !important;
 }

 .text-grey-7 {
   color: #444444 !important;
 }

 .text-green {
   color: #98ab23 !important;
 }

 .text-green-2 {
   color: #496048 !important;
 }

 .text-green-3 {
   color: #073c4e !important;
 }

 .text-green-4 {
   color: #108bb4 !important;
 }

 .text-yellow-2 {
   color: var(--yellow-2) !important;
 }

 .text-yellow-3 {
   color: #a48829 !important;
 }

 .text-yellow-4 {
   color: #ffc108 !important;
 }

 .text-brown {
   color: var(--brown) !important;
 }

 .text-line-3 {
   color: var(--line-3) !important;
 }

 .text-red {
   color: var(--red) !important;
 }

 .text-red-2 {
   color: #ff4a2f !important;
 }

 .text-red-3 {
   color: #c22f21 !important;
 }

 .text-blue {
   color: #4378ff !important;
 }

 .text-dark-orange {
   color: #f6620c !important;
 }

 .text-orange {
   color: #e4763b !important;
 }

 .text-dark-purple {
   color: #5135af !important;
 }

 .text-dark-purple-1 {
   color: #6638fe !important;
 }

 .text-dark-purple-2 {
   color: #a304ff !important;
 }

 .bg-primary {
   background-color: var(--primary) !important;
 }

 .bg-primary-2 {
   background-color: var(--primary-2) !important;
 }

 .bg-primary-3 {
   background-color: var(--primary-3) !important;
 }

 .bg-primary-4 {
   background-color: var(--primary-4) !important;
 }

 .bg-secondary {
   background-color: var(--secondary) !important;
 }

 .bg-secondary-2 {
   background-color: var(--secondary-2) !important;
 }

 .bg-secondary-3 {
   background-color: var(--secondary-2) !important;
 }

 .bg-secondary-4 {
   background-color: var(--secondary-2) !important;
 }

 .bg-dark {
   background-color: var(--dark) !important;
 }

 .bg-dark-2 {
   background-color: var(--dark-2) !important;
 }

 .bg-dark-3 {
   background-color: #292929 !important;
 }

 .bg-dark-4 {
   background-color: #2c2c2c !important;
 }

 .bg-dark-5 {
   background-color: #313030 !important;
 }

 .bg-dark-6 {
   background-color: #55514d !important;
 }

 .bg-dark-7 {
   background-color: #222222 !important;
 }

 .bg-grey {
   background-color: #acacac !important;
 }

 .bg-grey-2 {
   background-color: #f2f4f7 !important;
 }

 .bg-grey-3 {
   background-color: #546176 !important;
 }

 .bg-grey-4 {
   background-color: #d9d9d9 !important;
 }

 .bg-grey-5 {
   background-color: #dad9d4 !important;
 }

 .bg-grey-6 {
   background-color: #57627b !important;
 }

 .bg-grey-7 {
   background-color: #edefed !important;
 }

 .bg-grey-8 {
   background-color: #f4f4f4 !important;
 }

 .bg-grey-9 {
   background-color: rgba(251, 251, 251, 0.8) !important;
 }

 .bg-light-grey {
   background-color: #f3f2ee !important;
 }

 .bg-light-grey-2 {
   background-color: #f0f0f0 !important;
 }

 .bg-white {
   background-color: var(--white) !important;
 }

 .bg-surface {
   background-color: var(--surface) !important;
 }

 .bg-surface-2 {
   background-color: var(--surface-2) !important;
 }

 .bg-surface-3 {
   background-color: #fffcf6 !important;
 }

 .bg-surface-4 {
   background-color: #f3f2ee !important;
 }

 .bg-surface-5 {
   background-color: #fffcfa !important;
 }

 .bg-surface-6 {
   background-color: #f4f4f4 !important;
 }

 .bg-surface-7 {
   background-color: #e7e7e7 !important;
 }

 .bg-surface-8 {
   background-color: #f7f0ff !important;
 }

 .bg-line {
   background-color: var(--line) !important;
 }

 .bg-pink {
   background-color: #ffb8b8 !important;
 }

 .bg-pink-2 {
   background-color: #9d6e84 !important;
 }

 .bg-pink-3 {
   background-color: #ffe7e5 !important;
 }

 .bg-pink-4 {
   background-color: #ffe8e8 !important;
 }

 .bg-light-pink {
   background-color: #ff6969 !important;
 }

 .bg-light-pink-2 {
   background-color: #d47b62 !important;
 }

 .bg-light-pink-3 {
   background-color: #dcd3d4 !important;
 }

 .bg-light-pink-4 {
   background-color: #ffa3e8 !important;
 }

 .bg-light-pink-5 {
   background-color: #fddcc6 !important;
 }

 .bg-light-pink-6 {
   background-color: #ffa9a9 !important;
 }

 .bg-light-pink-7 {
   background-color: #f7d8d3 !important;
 }

 .bg-light-pink-8 {
   background-color: #ffa6a6 !important;
 }

 .bg-light-pink-9 {
   background-color: #fc9999 !important;
 }

 .bg-light-pink-10 {
   background-color: #facde3 !important;
 }

 .bg-light-pink-11 {
   background-color: #ffe1e1 !important;
 }

 .bg-light-pink-12 {
   background-color: #fee9ff !important;
 }

 .bg-dark-pink {
   background-color: #c3466d !important;
 }

 .bg-light-green {
   background-color: #7c8c47 !important;
 }

 .bg-light-green-2 {
   background-color: #74da30 !important;
 }

 .bg-light-green-3 {
   background-color: #c4c9b3 !important;
 }

 .bg-light-green-4 {
   background-color: #c1c285 !important;
 }

 .bg-light-green-5 {
   background-color: #e1ece4 !important;
 }

 .bg-light-green-6 {
   background-color: #c2ffc8 !important;
 }

 .bg-light-green-7 {
   background-color: #e9ffe4 !important;
 }

 .bg-light-green-8 {
   background-color: #89aa87 !important;
 }

 .bg-light-green-9 {
   background-color: #a0d57d !important;
 }

 .bg-light-green-10 {
   background-color: #e7ecd2 !important;
 }

 .bg-light-green-11 {
   background-color: #d9ffde !important;
 }

 .bg-green {
   background-color: #3f7b25 !important;
 }

 .bg-green-2 {
   background-color: #39b44b !important;
 }

 .bg-green-3 {
   background-color: #3bd336 !important;
 }

 .bg-green-4 {
   background-color: #409724 !important;
 }

 .bg-green-5 {
   background-color: #2ca554 !important;
 }

 .bg-dark-green {
   background-color: #185136 !important;
 }

 .bg-dark-green-2 {
   background-color: #2d613d !important;
 }

 .bg-dark-green-3 {
   background-color: #526821 !important;
 }

 .bg-dark-green-4 {
   background-color: #253321 !important;
 }

 .bg-dark-green-5 {
   background-color: #5e6f5e !important;
 }

 .bg-dark-green-6 {
   background-color: #2a4529 !important;
 }

 .bg-dark-green-7 {
   background-color: #219913 !important;
 }

 .bg-dark-green-8 {
   background-color: #246b64 !important;
 }

 .bg-olive-green {
   background-color: #808f65 !important;
 }

 .bg-violet {
   background-color: var(--violet) !important;
 }

 .bg-purple {
   background-color: var(--purple) !important;
 }

 .bg-purple-2 {
   background-color: #7c727b !important;
 }

 .bg-purple-3 {
   background-color: #aa88c5 !important;
 }

 .bg-purple-4 {
   background-color: #c79cff !important;
 }

 .bg-purple-5 {
   background-color: #f0e5ff !important;
 }

 .bg-purple-6 {
   background-color: #f0e5ff !important;
 }

 .bg-purple-7 {
   background-color: #a52c69 !important;
 }

 .bg-violet-2 {
   background-color: var(--violet-2) !important;
 }

 .bg-violet-3 {
   background-color: #591399 !important;
 }

 .bg-blue {
   background-color: #c2d5ff !important;
 }

 .bg-blue-2 {
   background-color: #386373 !important;
 }

 .bg-sky-blue {
   background-color: #3080a2 !important;
 }

 .bg-teal-blue {
   background-color: #4597a4 !important;
 }

 .bg-light-purple {
   background-color: #8f4a58 !important;
 }

 .bg-light-purple-2 {
   background-color: #a95354 !important;
 }

 .bg-light-purple-3 {
   background-color: #ded3de !important;
 }

 .bg-light-purple-6 {
   background-color: #fee9ff !important;
 }

 .bg-light-purple-7 {
   background-color: #e5e3ff !important;
 }

 .bg-light-purple-8 {
   background-color: #e3e6ff !important;
 }

 .bg-light-purple-9 {
   background-color: #ebe9ff !important;
 }

 .bg-light-purple-10 {
   background-color: #f2e8ff !important;
 }

 .bg-light-purple-11 {
   background-color: #f6efff !important;
 }

 .bg-light-blue {
   background-color: #5192f4 !important;
 }

 .bg-light-blue-2 {
   background-color: #add8e6 !important;
 }

 .bg-light-blue-3 {
   background-color: #d9e7fc !important;
 }

 .bg-light-blue-4 {
   background-color: #e8efff !important;
 }

 .bg-brown {
   background-color: #7e6449 !important;
 }

 .bg-brown-2 {
   background-color: #65552d !important;
 }

 .bg-brown-3 {
   background-color: #bf9332 !important;
 }

 .bg-brown-4 {
   background-color: #dab2b2 !important;
 }

 .bg-brown-5 {
   background-color: #a46c67 !important;
 }

 .bg-brown-6 {
   background-color: #603d38 !important;
 }

 .bg-brown-7 {
   background-color: #b58e68 !important;
 }

 .bg-brown-8 {
   background-color: #784e39 !important;
 }

 .bg-brown-9 {
   background-color: #968c83 !important;
 }

 .bg-brown-10 {
   background-color: #776041 !important;
 }

 .bg-brown-11 {
   background-color: #866022 !important;
 }

 .bg-brown-12 {
   background-color: #eee7da !important;
 }

 .bg-brown-13 {
   background-color: #8c320e !important;
 }

 .bg-brown-14 {
   background-color: #bb8f60 !important;
 }

 .bg-brown-15 {
   background-color: #a47551 !important;
 }

 .bg-brown-16 {
   background-color: #bab1b2 !important;
 }

 .bg-brown-17 {
   background-color: #420008 !important;
 }

 .bg-brown-18 {
   background-color: #995413 !important;
 }

 .bg-reddish-brown {
   background-color: #b06563 !important;
 }

 .bg-dark-brown {
   background-color: #502424 !important;
 }

 .bg-terra-cotta {
   background-color: #ac6664 !important;
 }

 .bg-yellow {
   background-color: #bbb355 !important;
 }

 .bg-yellow-2 {
   background-color: #ece093 !important;
 }

 .bg-yellow-3 {
   background-color: #f1ca41 !important;
 }

 .bg-yellow-4 {
   background-color: #fb9a10 !important;
 }

 .bg-yellow-5 {
   background-color: #f3ca54 !important;
 }

 .bg-yellow-6 {
   background-color: #fff8eb !important;
 }

 .bg-yellow-7 {
   background-color: #e9e4dc !important;
 }

 .bg-yellow-8 {
   background-color: #f3f1d9 !important;
 }

 .bg-yellow-9 {
   background-color: #fff8e5 !important;
 }

 .bg-light-orange {
   background-color: #fb9a74 !important;
 }

 .bg-light-orange-2 {
   background-color: #f59c11 !important;
 }

 .bg-light-orange-3 {
   background-color: #ffdcc2 !important;
 }

 .bg-light-orange-4 {
   background-color: #f5e1c7 !important;
 }

 .bg-light-orange-5 {
   background-color: #f5a55f !important;
 }

 .bg-light-orange-6 {
   background-color: #e4763b !important;
 }

 .bg-light-orange-7 {
   background-color: #ffd3bf !important;
 }

 .bg-beige {
   background-color: #e3d7c6 !important;
 }

 .bg-beige-2 {
   background-color: #ddcfb7 !important;
 }

 .bg-light-beige {
   background-color: #e8dcd0 !important;
 }

 .bg-light-beige-2 {
   background-color: #e0d8d4 !important;
 }

 .bg-light-beige-3 {
   background-color: #fff5dd !important;
 }

 .bg-red {
   background-color: #ff4848 !important;
 }

 .bg-red-2 {
   background-color: #c4212a !important;
 }

 .bg-orange {
   background-color: #ffdec8 !important;
 }

 .bg-orange-2 {
   background-color: #ff9760 !important;
 }

 .bg-orange-3 {
   background-color: #ff4a2f !important;
 }

 .bg-gradient-2 {
   background: var(--gradient-2);
 }

 .bg-gradient-3 {
   background: linear-gradient(270deg, #edd1ff 0%, #fff4d1 100%);
 }

 .bg-gradient-4 {
   background: linear-gradient(270deg, #6adf80 0%, #b3de3c 100%);
 }

 .bg-gradient-5 {
   background: linear-gradient(143.24deg, #71bc87 0%, #108ab4 85.26%) !important;
 }

 .bg-gradient-6 {
   background: linear-gradient(90deg, #497e4a 0%, #b17739 100%) !important;
 }

 .bg-gradient-7 {
   background: linear-gradient(180deg, #00b0e9 0%, #004055 100%);
 }

 .bg-gradient-8 {
   background: linear-gradient(90deg, #ffecd4 0%, #e5e1ff 100%);
 }

 a {
   transition: all 0.3s ease-in-out;
   text-decoration: none;
   cursor: pointer;
   display: inline-block;
   color: var(--dark);
 }

 a:focus,
 a:hover {
   transition: all 0.3s ease-in-out;
   text-decoration: none;
   outline: 0;
 }

 .link {
   transition: all 0.3s ease-in-out;
 }

 .link:hover {
   color: var(--primary) !important;
 }

 .grid-2 {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
 }

 .grid-3 {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
 }

 .grid-4 {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
 }

 .grid-6 {
   display: grid;
   grid-template-columns: repeat(6, 1fr);
 }

 .line {
   border: 1px solid var(--line) !important;
 }

 .line-2 {
   border: 1px solid var(--line-5) !important;
 }

 .line-3 {
   border-top: 1px solid rgba(164, 164, 164, 0.3019607843) !important;
 }

 .line-4 {
   border: 1px solid rgba(0, 0, 0, 0.3019607843) !important;
 }

 .line-bt {
   border-bottom: 1px solid var(--line) !important;
 }

 .line-top {
   border-top: 1px solid var(--line) !important;
 }

 .line-black {
   border: 1px solid var(--dark) !important;
 }

 .line-primary {
   border: 1px solid var(--primary) !important;
 }

 .line-purple {
   border: 1px solid var(--purple) !important;
 }

 .line-2 {
   border: 1px solid #d1d1d1 !important;
 }

 .o-hidden {
   overflow: hidden !important;
 }

 .gap-4 {
   gap: 4px !important;
 }

 .gap-6 {
   gap: 6px !important;
 }

 .gap-8 {
   gap: 8px !important;
 }

 .gap-10 {
   gap: 10px !important;
 }

 .gap-21 {
   gap: 21px !important;
 }

 .gap-48 {
   gap: 15px 48px !important;
 }

 .px_15 {
   padding-left: 15px;
   padding-right: 15px;
 }

 .py-4 {
   padding-top: 4px !important;
   padding-bottom: 4px !important;
 }

 .py-6 {
   padding-top: 6px !important;
   padding-bottom: 6px !important;
 }

 .pt-24 {
   padding-top: 24px;
 }

 .box-center {
   position: absolute;
   top: 50% !important;
   left: 50% !important;
   transform: translate(-50%, -50%) !important;
 }

 .place-content-center {
   place-content: center;
 }

 .mt_5 {
   margin-top: 5px !important;
 }

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

 .mt_15 {
   margin-top: 15px !important;
 }

 .mt_18 {
   margin-top: 18px !important;
 }

 .mt_30 {
   margin-top: 30px !important;
 }

 .mt_40 {
   margin-top: 40px;
 }

 .mt--30 {
   margin-top: -30px !important;
 }

 .mb_4 {
   margin-bottom: 4px;
 }

 .mb_6 {
   margin-bottom: 6px;
 }

 .mb_8 {
   margin-bottom: 8px;
 }

 .mb_10 {
   margin-bottom: 10px;
 }

 .mb_12 {
   margin-bottom: 12px;
 }

 .mb_15 {
   margin-bottom: 15px;
 }

 .mb_16 {
   margin-bottom: 16px;
 }

 .mb_20 {
   margin-bottom: 20px;
 }

 .mb_24 {
   margin-bottom: 24px;
 }

 .mb_32 {
   margin-bottom: 32px;
 }

 .mb_40 {
   margin-bottom: 40px;
 }

 .mx_40 {
   margin-left: 40px;
   margin-right: 40px;
 }

 .my_24 {
   margin-top: 24px;
   margin-bottom: 24px;
 }

 .my_20 {
   margin-top: 20px;
   margin-bottom: 20px;
 }

 .pt_0 {
   padding-top: 0px !important;
 }

 .pb_0 {
   padding-bottom: 0px !important;
 }

 [data-grid=grid-1] {
   display: grid;
   gap: 30px;
   grid-template-columns: 1fr;
 }

 [data-grid=grid-2] {
   display: grid;
   gap: 30px;
   grid-template-columns: 1fr 1fr;
 }

 [data-grid=grid-3] {
   display: grid;
   gap: 30px;
   grid-template-columns: repeat(3, 1fr);
 }

 [data-grid=grid-4] {
   display: grid;
   gap: 30px;
   grid-template-columns: repeat(4, 1fr);
 }

 [data-grid=grid-5] {
   display: grid;
   gap: 30px;
   grid-template-columns: repeat(5, 1fr);
 }

 [data-grid=grid-6] {
   display: grid;
   gap: 30px;
   grid-template-columns: repeat(6, 1fr);
 }

 [data-grid=grid-7] {
   display: grid;
   gap: 30px;
   grid-template-columns: repeat(7, 1fr);
 }

 .tf-row-flex {
   display: flex;
   flex-direction: row;
   column-gap: 30px;
   row-gap: 30px;
 }

 .tf-grid-layout {
   display: grid;
   column-gap: 12px;
   row-gap: 24px;
 }

 .tf-grid-layout.tf-col-2 {
   grid-template-columns: 1fr 1fr;
 }

 .tf-grid-layout.tf-col-3 {
   grid-template-columns: repeat(3, 1fr);
 }

 .tf-grid-layout.tf-col-4 {
   grid-template-columns: repeat(4, 1fr);
 }

 .tf-grid-layout.tf-col-5 {
   grid-template-columns: repeat(5, 1fr);
 }

 .tf-grid-layout.tf-col-6 {
   grid-template-columns: repeat(6, 1fr);
 }

 .tf-grid-layout.tf-col-7 {
   grid-template-columns: repeat(7, 1fr);
 }

 .tf-grid-layout .wg-pagination {
   grid-column: 1/-1;
   width: 100%;
   margin-top: 16px;
 }

 .tf-grid-layout .wd-load {
   grid-column: 1/-1;
 }

 .sticky-top {
   z-index: 50;
   top: 15px;
   position: sticky;
   transition: 0.2s ease-out;
 }

 .wmax {
   width: max-content !important;
 }

 .cursor-not-allowed {
   cursor: not-allowed;
 }

 .cursor-auto {
   cursor: auto;
 }

 .text-highlight {
   -webkit-text-stroke: 1px #000;
   color: transparent !important;
   flex-direction: row-reverse;
 }

 .text-line-clamp-1 {
   -webkit-line-clamp: 1;
   -webkit-box-orient: vertical;
   display: -webkit-box;
   overflow: hidden;
 }

 .text-line-clamp-2 {
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   display: -webkit-box;
   overflow: hidden;
 }

 .text-line-clamp-4 {
   -webkit-line-clamp: 4;
   -webkit-box-orient: vertical;
   display: -webkit-box;
   overflow: hidden;
 }

 .asp-ratio-2 {
   aspect-ratio: 0.832 !important;
 }

 .asp-ratio-1 {
   aspect-ratio: 1/1 !important;
 }

 .asp-ratio-0 {
   aspect-ratio: 0 !important;
 }

 .initial-child-container {
   flex: 0 0 auto;
   display: flex;
   min-width: auto;
   flex-direction: row;
   align-items: center;
 }

 .line-top-container {
   position: relative;
 }

 .line-top-container::before {
   position: absolute;
   content: "";
   top: 0;
   left: 50%;
   background-color: var(--line);
   height: 1px;
   width: 100%;
   max-width: 1440px;
   transform: translateX(-50%);
 }

 .line-bottom-container {
   position: relative;
 }

 .line-bottom-container::after {
   position: absolute;
   content: "";
   bottom: 0;
   left: 50%;
   background-color: var(--line);
   height: 1px;
   width: 100%;
   max-width: 1440px;
   transform: translateX(-50%);
 }

 #scroll-top {
   position: fixed;
   display: block;
   width: 48px;
   height: 48px;
   line-height: 50px;
   border-radius: 4px;
   z-index: 1;
   border-radius: 50%;
   opacity: 0;
   visibility: hidden;
   cursor: pointer;
   overflow: hidden;
   z-index: 100;
   background-color: var(--dark);
   border: 0;
   bottom: 92px;
   right: 20px;
   padding: 0;
   display: flex;
   align-items: center;
   justify-content: center;
   transition: all 0.3s ease-in-out;
 }

 #scroll-top.show {
   opacity: 1;
   visibility: visible;
 }

 #scroll-top.type-1 {
   bottom: 140px;
 }

 #scroll-top:hover {
   transform: translateY(-5px);
   background-color: var(--primary);
 }

 /* Preload 
------------------------------------------- */

 .flat-spacing {
   padding-top: 100px;
   padding-bottom: 100px;
 }

 .flat-spacing-2 {
   padding-top: 80px;
   padding-bottom: 80px;
 }

 .flat-spacing-3 {
   padding-top: 120px;
   padding-bottom: 120px;
 }

 .flat-spacing-4 {
   padding-top: 60px;
   padding-bottom: 60px;
 }

 .flat-spacing-5 {
   padding-top: 43px;
   padding-bottom: 43px;
 }

 .flat-spacing-6 {
   padding-top: 90px;
   padding-bottom: 90px;
 }

 .flat-spacing-7 {
   padding-top: 30px;
   padding-bottom: 30px;
 }

 .flat-spacing-8 {
   padding-top: 80px;
   padding-bottom: 60px;
 }

 .flat-spacing-9 {
   padding-top: 68px;
   padding-bottom: 68px;
 }

 .flat-spacing-10 {
   padding-top: 60px;
   padding-bottom: 70px;
 }

 .flat-spacing-11 {
   padding-top: 80px;
   padding-bottom: 127px;
 }

 .flat-spacing-12 {
   padding-top: 80px;
   padding-bottom: 44px;
 }

 .flat-spacing-13 {
   padding-top: 64px;
   padding-bottom: 100px;
 }

 .flat-spacing-14 {
   padding-top: 83px;
   padding-bottom: 98px;
 }

 .flat-spacing-14 {
   padding-top: 83px;
   padding-bottom: 98px;
 }

 .flat-spacing-15 {
   padding-top: 176px;
   padding-bottom: 176px;
 }

 .flat-spacing-16 {
   padding-top: 120px;
   padding-bottom: 80px;
 }

 .flat-spacing-17 {
   padding-top: 80px;
   padding-bottom: 120px;
 }

 .flat-spacing-18 {
   padding-top: 52px;
   padding-bottom: 52px;
 }

 .flat-spacing-19 {
   padding-top: 87px;
   padding-bottom: 143px;
 }

 .flat-spacing-20 {
   padding-top: 86px;
   padding-bottom: 86px;
 }

 .flat-spacing-21 {
   padding-top: 116px;
   padding-bottom: 116px;
 }

 .flat-spacing-22 {
   padding-top: 182px;
   padding-bottom: 120px;
 }

 .flat-spacing-23 {
   padding-top: 136px;
   padding-bottom: 136px;
 }

 .flat-spacing-24 {
   padding-top: 64px;
   padding-bottom: 80px;
 }

 .flat-spacing-25 {
   padding-top: 80px;
   padding-bottom: 100px;
 }

 .flat-spacing-26 {
   padding-top: 126px;
   padding-bottom: 80px;
 }

 .flat-spacing-27 {
   padding-top: 145px;
   padding-bottom: 120px;
 }

 .flat-spacing-28 {
   padding-top: 120px;
   padding-bottom: 80px;
 }

 .flat-spacing-29 {
   padding-top: 80px;
   padding-bottom: 94px;
 }

 .flat-spacing-30 {
   padding-top: 100px;
   padding-bottom: 58px;
 }

 .flat-spacing-31 {
   padding-top: 70px;
   padding-bottom: 70px;
 }

 .flat-spacing-32 {
   padding-top: 32px;
   padding-bottom: 32px;
 }

 .flat-spacing-33 {
   padding-top: 120px;
   padding-bottom: 114px;
 }

 .flat-spacing-34 {
   padding-top: 40px;
   padding-bottom: 124px;
 }

 .flat-spacing-35 {
   padding-top: 120px;
   padding-bottom: 103px;
 }

 .flat-spacing-36 {
   padding-top: 50px;
   padding-bottom: 50px;
 }

 .flat-spacing-37 {
   padding-top: 42px;
   padding-bottom: 42px;
 }

 .tf-overlay {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
 }

 .radius-40 {
   border-radius: 40px !important;
 }

 .radius-16 {
   border-radius: 16px !important;
 }

 .radius-20 {
   border-radius: 20px !important;
 }

 .radius-8 {
   border-radius: 8px !important;
 }

 .radius-6 {
   border-radius: 6px !important;
 }

 .radius-4 {
   border-radius: 4px !important;
 }

 .w-max-content {
   width: max-content !important;
 }

 .border-transparent {
   border-color: transparent !important;
 }

 .relative {
   position: relative;
 }

 .absolute {
   position: absolute;
 }

 .letter-0 {
   letter-spacing: 0px !important;
 }

 .w-1209 {
   max-width: 1209px;
   width: 100%;
 }

 .mw-1 {
   max-width: 1326px;
   width: 100%;
 }

 .text-delivered {
   color: #008a00;
 }

 .text-on-the-way {
   color: #ff4848;
 }

 .gap10 {
   gap: 10px !important;
 }

 .justify-items-left {
   justify-items: left !important;
 }

 .justify-items-right {
   justify-items: right !important;
 }

 .justify-items-center {
   justify-items: center !important;
 }

 #goTop {
   position: fixed;
   padding: 0;
   bottom: 90px;
   right: 40px;
   width: 38px;
   height: 38px;
   background: var(--white);
   color: black;
   font-size: 20px;
   text-align: center;
   line-height: 50px;
   cursor: pointer;
   border: none;
   border-radius: 3px;
   opacity: 0;
   visibility: hidden;
   transition: opacity 0.3s ease;
   box-shadow: var(--shadow-1);
   z-index: 1000;
 }

 #goTop .border-progress {
   position: absolute;
   top: -1px;
   left: -1px;
   width: calc(100% + 2px);
   height: calc(100% + 2px);
   border-radius: 3px;
   border: 1px solid #000000;
   mask-image: conic-gradient(#000000 var(--progress-angle, 0deg), transparent 0);
   -webkit-mask-image: conic-gradient(#000000 var(--progress-angle, 0deg), transparent 0);
   content: "";
   z-index: 1;
   transition: all 0.3s ease-in-out;
 }

 #goTop.show {
   opacity: 1;
   visibility: visible;
 }

 #goTop .icon {
   font-size: 10px;
   transition: all 0.3s ease-in-out;
 }

 #goTop .icon-arrow-right {
   transform: rotate(-90deg);
 }

 #goTop.pos1 {
   bottom: 140px;
   right: 15px;
 }

 .obj-contain {
   object-fit: contain !important;
 }

 .text-transform-none {
   text-transform: none !important;
 }

 .px-30 {
   padding-right: 15px;
   padding-left: 15px;
 }

 .text-clip {
   background: linear-gradient(0deg, #fff, #fff);
   background-size: 100% 100%;
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   -webkit-text-stroke: 0.6px #5a5a5a;
 }

 .text-clip-1 {
   background: linear-gradient(0deg, #fff, #fff);
   background-size: 100% 100%;
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   -webkit-text-stroke: 0.6px #073c4e;
 }

 .text-clip-2 {
   background: linear-gradient(0deg, #fff, #fff);
   background-size: 100% 100%;
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   -webkit-text-stroke: 1px #1f1f1f;
 }

 .box-shadow1 {
   box-shadow: 0px 1px 6px 0px rgba(158, 158, 158, 0.2509803922);
 }

 .h-46 {
   height: 46px !important;
 }

 /* sib-form */
 .sib-form {
   padding: 0 !important;
   font-family: var(--Poppins) !important;
   position: relative;
 }

 .sib-form .tf-btn {
   font-size: 16px;
   line-height: 24px;
 }

 .sib-form #sib-container {
   background-color: unset;
   padding: 0;
   display: block;
 }

 .sib-form .sib-form-block {
   padding: 0;
 }

 .sib-form .sib-optin {
   display: none;
 }

 .sib-form .sib-input .entry__field {
   background-color: unset;
   border: 0;
   box-shadow: none !important;
   margin: 0;
 }

 .sib-form .sib-form-message-panel {
   border: 0;
   padding: 0;
   font-size: 14px;
   line-height: 20px;
 }

 .sib-form .sib-form-message-panel .sib-form-message-panel__text {
   justify-content: center;
   padding: 0;
 }

 .sib-form .sib-form-container .input {
   font-family: var(--Poppins);
   border: 1px solid var(--line);
   outline: 0;
   box-shadow: none;
   font-size: 14px;
   line-height: 20px;
   border-radius: 6px;
   padding: 14px 20px;
   width: 100%;
   background: var(--white);
   color: var(--rgba-dark-2);
   height: 50px;
   font-weight: 400;
   box-sizing: border-box;
   transition: all 0.3s ease-in-out;
 }

 .sib-form .sib-form-container .input:hover,
 .sib-form .sib-form-container .input:focus {
   border-color: var(--rgba-dark-2);
 }

 .sib-form .sib-form-container .input::placeholder {
   color: rgba(102, 112, 133, 0.8);
   transition: all 0.3s ease-in-out;
 }

 .sib-form .entry__specification,
 .sib-form .entry__error,
 .entry__specification,
 .entry__label {
   margin: 0 !important;
 }

 #error-message {
   color: var(--red);
 }

 #success-message {
   color: var(--success);
 }

 .sib-form-block__button .clickable__icon {
   display: none;
 }

 .sib-form .form-newsletter fieldset .input {
   border-radius: 49px;
   border-color: var(--line);
   padding: 14px 20px;
   font-weight: 400;
 }

 .sib-form .form-newsletter fieldset .input::placeholder {
   font-weight: 400;
   color: #a5a5a5;
 }

 .sib-form .form-newsletter .button-submit {
   position: absolute;
   right: 0px;
   top: 50%;
   transform: translateY(-50%);
 }

 .sib-form .form-newsletter .button-submit button {
   height: 50px;
   padding-top: 0;
   padding-bottom: 0;
   display: flex;
   align-items: center;
   justify-content: center;
 }

 .sib-form .form-newsletter .subscribe-content {
   position: relative;
 }

 .sib-form .form-newsletter .entry__error {
   display: none !important;
 }

 .footer-default .sib-form .sib-form-message-panel .sib-form-message-panel__text {
   justify-content: flex-start;
 }

 #sib-form {
   position: relative;
 }

 .modal-newsletter .sib-form .form-newsletter fieldset .input {
   padding-left: 66px;
 }

 .rtl .modal-newsletter .sib-form .form-newsletter fieldset .input {
   padding-right: 66px;
   padding-left: 20px;
 }

 #pop-up {
   position: fixed;
   inset: 0;
   z-index: 1000;
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   opacity: 0;
   visibility: hidden;
   transition: all 0.3s linear;
 }

 #pop-up.show {
   opacity: 1;
   visibility: visible;
 }

 .over-play {
   position: fixed;
   inset: 0;
   background-color: rgba(0, 0, 0, 0.4);
 }

 #pop-up .close-icon {
   position: absolute;
   display: flex;
   top: 30px;
   right: 30px;
   z-index: 5;
   cursor: pointer;
 }

 #pop-up .wrap {
   position: relative;
   display: flex;
   margin: 15px;
   width: 100%;
   max-width: 1280px;
   max-height: 720px;
 }

 #pop-up a>img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   border-radius: 28px;
 }

 @media only screen and (max-width: 767px) {
   #pop-up .close-icon {
     top: 15px;
     right: 15px;
   }

   #pop-up .close-icon svg {
     width: 16px;
   }
   .tf-grid-layout.tf-col-4{
    grid-template-columns: repeat(2, 1fr);
}


 }

 /*------------ Components ---------------- */
 /*------------ button ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .tf-btn {
   transition: all 0.3s ease-in-out;
   background-color: var(--dark);
   border: 1px solid var(--dark);
   color: var(--white);
   padding: 13px 32px;
   border-radius: 99px;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   gap: 10px;
   font-size: 16px;
   line-height: 24px;
   font-weight: 500;
 }

 .tf-btn .icon {
   font-size: 16px;
 }

 .tf-btn.hover-icon:hover .icon {
   animation: 0.3s link-icon linear;
 }

 .tf-btn.hover-icon-2 {
   gap: 0px;
 }

 .tf-btn.hover-icon-2 .icon {
   transform: scale(0);
   transition: all 0.3s ease-in-out;
   color: var(--white);
   width: 0;
 }

 .tf-btn.hover-icon-2:hover .icon {
   transform: scale(1);
   width: 14px;
   margin-left: 10px;
 }

 .tf-btn.hover-icon-2.btn-cls .icon {
   font-size: 12px;
 }

 .tf-btn.btn-primary {
   background-color: var(--primary);
   color: var(--white);
   border-color: var(--primary);
 }

 .tf-btn.btn-out-line-primary {
   background-color: transparent;
   border-color: var(--primary);
   color: var(--primary);
 }

 .tf-btn.btn-out-line-primary:hover {
   background-color: var(--primary);
   color: var(--white);
   border-color: var(--primary);
 }

 .tf-btn.btn-out-line-white {
   background-color: transparent;
   border-color: var(--white);
   color: var(--white);
 }

 .tf-btn.btn-out-line-white:hover {
   background-color: var(--primary);
   color: var(--white);
   border-color: var(--primary);
 }

 .tf-btn.btn-out-line-dark {
   background-color: transparent;
   border-color: var(--dark);
   color: var(--dark);
 }

 .tf-btn.btn-out-line-dark:hover {
   background-color: var(--dark);
   color: var(--white);
   border-color: var(--dark);
 }

 .tf-btn.btn-out-line-dark-2 {
   background-color: transparent;
   border-color: var(--dark-2);
   color: var(--dark-2);
 }

 .tf-btn.btn-out-line-dark-2:hover {
   background-color: var(--dark-2);
   color: var(--white);
   border-color: var(--dark-2);
 }

 .tf-btn.btn-out-line-green {
   background-color: transparent;
   border-color: #108066;
   color: #108066;
 }

 .tf-btn.btn-out-line-green:hover {
   background-color: #16423c;
   color: var(--white);
   border-color: #16423c;
 }

 .tf-btn.btn-out-line-yellow {
   background-color: transparent;
   border-color: #b99f4a;
   color: #b99f4a;
 }

 .tf-btn.btn-out-line-yellow:hover {
   background-color: #b99f4a;
   color: var(--white);
   border-color: #b99f4a;
 }

 .tf-btn.btn-white {
   color: var(--dark);
   background-color: var(--white);
   border-color: var(--white);
 }

 .tf-btn.btn-yellow {
   color: var(--white);
   background-color: #b99f4a;
   border-color: #b99f4a;
 }

 .tf-btn.btn-green {
   color: var(--white);
   background-color: #496048;
   border-color: #496048;
 }

 .tf-btn.btn-green-2 {
   color: var(--white);
   background-color: #16423c;
   border-color: #16423c;
 }

 .tf-btn.btn-blue {
   color: var(--dark);
   background-color: #cae0e8;
   border-color: #cae0e8;
 }

 .tf-btn.btn-blue-2 {
   color: var(--white);
   background-color: #4378ff;
   border-color: #4378ff;
 }

 .tf-btn.btn-orange {
   color: var(--white);
   background-color: #ca790b;
   border-color: #ca790b;
 }

 .tf-btn.btn-orange-2 {
   color: var(--white);
   background-color: #f77904;
   border-color: #f77904;
 }

 .tf-btn.btn-orange-3 {
   color: var(--white);
   background-color: #fa7827;
   border-color: #fa7827;
 }

 .tf-btn.btn-outline-orange {
   color: #fa7827;
   border: 1px solid #fa7827;
   background-color: transparent;
 }

 .tf-btn.btn-outline-orange:hover {
   background-color: #fa7827;
   border-color: #fa7827;
   color: var(--white);
 }

 .tf-btn.hover-primary:hover {
   background-color: var(--primary);
   color: var(--white);
   border-color: var(--primary);
 }

 .tf-btn.hover-dark:hover {
   background-color: var(--dark);
   color: var(--white);
   border-color: var(--dark);
 }

 .tf-btn.hover-green:hover {
   background-color: #b99f4a;
   color: var(--white);
   border-color: #b99f4a;
 }

 .tf-btn.btn-line {
   border: none;
   background: transparent;
   padding: 0px;
   color: var(--dark);
   justify-content: unset;
   width: max-content;
   position: relative;
   gap: 6px;
 }

 .tf-btn.btn-line .icon {
   display: flex;
 }

 .tf-btn.btn-line i {
   font-size: 12px;
 }

 .tf-btn.btn-line:hover {
   color: var(--primary);
 }

 .tf-btn.btn-line:hover::after {
   left: 0;
   right: auto;
   width: 100%;
 }

 .tf-btn.btn-line::after {
   content: "";
   position: absolute;
   bottom: 2px;
   left: auto;
   right: 0;
   width: 0%;
   height: 1px;
   background-color: var(--primary);
   transition: all 0.3s ease-in-out;
 }

 .tf-btn.btn-line-dark {
   border: none;
   background: transparent;
   padding: 0px;
   color: var(--dark);
   justify-content: unset;
   width: max-content;
   position: relative;
   gap: 6px;
 }

 .tf-btn.btn-line-dark .icon {
   display: flex;
 }

 .tf-btn.btn-line-dark i {
   font-size: 12px;
 }

 .tf-btn.btn-line-dark:hover {
   color: var(--primary);
 }

 .tf-btn.btn-line-dark:hover::after {
   background-color: var(--primary);
 }

 .tf-btn.btn-line-dark::after {
   content: "";
   position: absolute;
   bottom: 0px;
   left: 0;
   right: auto;
   width: 100%;
   height: 1px;
   background-color: var(--dark);
   transition: all 0.3s ease-in-out;
 }

 .tf-btn.btn-line-white {
   border: none;
   background: transparent;
   padding: 0px;
   color: var(--white);
   justify-content: unset;
   width: max-content;
   position: relative;
   gap: 6px;
 }

 .tf-btn.btn-line-white .icon {
   display: flex;
 }

 .tf-btn.btn-line-white i {
   font-size: 12px;
 }

 .tf-btn.btn-line-white:hover {
   color: var(--primary);
 }

 .tf-btn.btn-line-white:hover::after {
   background-color: var(--primary);
 }

 .tf-btn.btn-line-white::after {
   content: "";
   position: absolute;
   bottom: 0px;
   left: 0;
   right: auto;
   width: 100%;
   height: 1px;
   background-color: var(--white);
   transition: all 0.3s ease-in-out;
 }

 .tf-btn.btn-outline-brown {
   color: #a47551;
   border: 1px solid #a47551;
   background-color: transparent;
 }

 .tf-btn.btn-outline-brown:hover {
   border-color: #252525;
   background-color: #252525;
   color: var(--white);
 }

 .tf-btn.hover-shadow:hover {
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
   transform: translateY(-2px);
 }

 .tf-btn.btn-out-line-dark2 {
   background-color: transparent;
   border: 1px solid var(--dark-2);
   color: var(--dark-2);
 }

 .tf-btn.btn-out-line-dark2:hover {
   background-color: var(--dark-2);
   color: var(--white);
 }

 .tf-btn.btn-dark2 {
   background-color: var(--dark-2);
   color: var(--white);
   border: 1px solid var(--dark-2);
 }

 .tf-btn.btn-dark3 {
   background-color: var(--text-2);
   color: var(--white);
   border: 1px solid var(--text-2);
 }

 .tf-btn.btn-red {
   background-color: #df3c01;
   color: var(--white);
   border: 1px solid #df3c01;
 }

 .tf-btn.btn-sold-out {
   opacity: 0.8;
 }

 .tf-btn.btn-small {
   padding: 9px 27px;
 }

 .tf-btn.btn-space1 {
   padding-left: 30px;
   padding-right: 15px;
   gap: 16px;
 }

 .tf-btn.btn-space1 .icon {
   font-size: 20px;
 }

 .tf-btn.btn-purple-1 {
   background-color: #8600DF;
 }

 .tf-btn.btn-purple-2 {
   background-color: #A304FF;
   border-color: #A304FF;
 }

 .tf-btn.btn-purple-2:hover {
   background-color: #fff;
   color: #A304FF;
 }

 .btn-out-stock {
   opacity: 0.5;
 }

 .animate-btn {
   position: relative;
   overflow: hidden;
 }

 .animate-btn:hover::after {
   animation: shine-reverse 1s forwards;
 }

 .animate-btn:after {
   content: "";
   position: absolute;
   width: 100%;
   height: 100%;
   background-image: linear-gradient(120deg, rgba(255, 255, 255, 0) 30%, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0) 70%);
   top: 0;
   left: -100%;
   opacity: 0.6;
 }

 button.animate-btn::after,
 .animate-btn.tf-btn::after {
   background-image: linear-gradient(120deg, rgba(0, 0, 0, 0) 20%, rgba(255, 255, 255, 0.4), rgba(0, 0, 0, 0) 70%);
 }

 .animate-btn.animate-dark::after {
   background-image: linear-gradient(90deg, transparent, rgba(0, 0, 0, 0.25), transparent);
 }

 @keyframes shine-forward {
   0% {
     left: -100%;
   }

   100% {
     left: 100%;
   }
 }

 @keyframes shine-reverse {
   0% {
     left: 100%;
   }

   100% {
     left: -100%;
   }
 }

 .effect-flash {
   position: relative;
   overflow: hidden;
 }

 .effect-flash::after {
   background-image: linear-gradient(90deg, transparent, var(--white), transparent);
   content: "";
   left: 150%;
   position: absolute;
   top: 0;
   bottom: 0;
   transform: skew(-20deg);
   width: 200%;
   animation: 3s cubic-bezier(0.01, 0.56, 1, 1) infinite erFlashEffect;
   opacity: 0.7;
 }

 @keyframes erFlashEffect {

   100%,
   20% {
     left: -200%;
   }
 }

 .btn-sidebar {
   display: none;
   position: fixed;
   top: 30%;
   z-index: 100;
   width: max-content;
 }

 .btn-sidebar.left {
   left: 0;
 }

 .btn-sidebar.right {
   right: 0;
 }

 .btn-sidebar button {
   width: 48px;
   height: 48px;
   display: flex;
   border: 0;
   align-items: center;
   justify-content: space-between;
   background-color: var(--white);
   box-shadow: var(--shadow-1);
   border-radius: 0 4px 4px 0px;
   padding: 10px;
 }

 .btn-sidebar button .icon {
   font-size: 20px;
   color: var(--dark);
 }

 .btn-sidebar .type-hover {
   gap: 10px;
   width: 40px;
 }

 .btn-sidebar .type-hover .text {
   display: none;
   font-size: 14px;
   line-height: 20px;
   font-weight: 400;
   color: var(--dark);
 }

 .btn-sidebar .type-hover:hover {
   width: max-content;
 }

 .btn-sidebar .type-hover:hover .text {
   display: block;
 }

 .tf-loading {
   font-size: 14px;
   line-height: 20px;
   width: auto;
   height: 42px;
   min-width: 118px;
   padding: 10px;
 }

 .tf-loading.loadmore .spinner-circle {
   display: none;
 }

 .tf-loading.loadmore.loading .spinner-circle {
   display: block;
 }

 .tf-loading.loadmore.loading .text {
   display: none;
 }

 .tf-loading.loadmore:hover .spinner-child::before {
   background-color: var(--white);
 }

 .tf-loading.loadmore .spinner-child::before {
   background-color: var(--dark);
 }

 .spinner-circle {
   width: 24px;
   height: 24px;
   position: relative;
 }

 .spinner-circle .spinner-child {
   width: 100%;
   height: 100%;
   position: absolute;
   left: 0;
   top: 0;
 }

 .spinner-circle .spinner-child::before {
   content: "";
   display: block;
   margin: 0 auto;
   width: 20%;
   height: 20%;
   background-color: var(--white);
   border-radius: 100%;
   animation: spinner-circleBounceDelay 1s infinite ease-in-out both;
 }

 .spinner-circle .spinner-circle2 {
   transform: rotate(40deg);
 }

 .spinner-circle .spinner-circle2::before {
   animation-delay: -0.9s;
 }

 .spinner-circle .spinner-circle3 {
   transform: rotate(80deg);
 }

 .spinner-circle .spinner-circle3::before {
   animation-delay: -0.8s;
 }

 .spinner-circle .spinner-circle4 {
   transform: rotate(120deg);
 }

 .spinner-circle .spinner-circle4::before {
   animation-delay: -0.7s;
 }

 .spinner-circle .spinner-circle5 {
   transform: rotate(160deg);
 }

 .spinner-circle .spinner-circle5::before {
   animation-delay: -0.6s;
 }

 .spinner-circle .spinner-circle6 {
   transform: rotate(200deg);
 }

 .spinner-circle .spinner-circle6::before {
   animation-delay: -0.5s;
 }

 .spinner-circle .spinner-circle7 {
   transform: rotate(240deg);
 }

 .spinner-circle .spinner-circle7::before {
   animation-delay: -0.4s;
 }

 .spinner-circle .spinner-circle8 {
   transform: rotate(280deg);
 }

 .spinner-circle .spinner-circle8::before {

   animation-delay: -0.3s;
 }

 .spinner-circle .spinner-circle9 {
   transform: rotate(320deg);
 }

 .spinner-circle .spinner-circle9::before {

   animation-delay: -0.2s;
 }

 @-webkit-keyframes spinner-circleBounceDelay {

   0%,
   80%,
   100% {
     transform: scale(0);
   }

   40% {
     transform: scale(1);
   }
 }

 @keyframes spinner-circleBounceDelay {

   0%,
   80%,
   100% {
     transform: scale(0);
   }

   40% {
     transform: scale(1);
   }
 }

 .btn-underline {
   font-size: 16px;
   line-height: 24px;
   font-weight: 500;
   color: var(--dark);
   transition: all 0.3s ease-in-out;
   background: linear-gradient(to right, var(--primary) 50%, var(--dark) 50%);
   background-size: 200% 100%;
   background-position: right;
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   transition: background-position 0.3s linear;
   position: relative;
 }

 .btn-underline:hover {
   background-position: left;
 }

 .btn-underline:hover::before {
   width: 100%;
 }

 .btn-underline::after {
   position: absolute;
   content: "";
   left: 0;
   bottom: 4px;
   right: 0;
   height: 1px;
   background-color: var(--dark);
   transition: all 0.3s ease-in-out;
 }

 .btn-underline::before {
   position: absolute;
   content: "";
   left: 0;
   width: 0;
   bottom: 4px;
   height: 1px;
   background-color: var(--primary);
   transition: width 0.3s linear;
   z-index: 1;
 }

 .tf-btn-icon {
   width: 32px;
   height: 32px;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   transition: all 0.3s ease-in-out;
 }

 .tf-btn-icon i {
   transition: all 0.3s ease-in-out;
 }

 .tf-btn-icon:hover i {
   transform: rotate(45deg);
 }

 .hv-line-under {
   position: relative;
   width: max-content;
 }

 .hv-line-under::after {
   position: absolute;
   content: "";
   bottom: 0px;
   left: 0;
   right: 0;
   height: 1px;
   background-color: transparent;
   transition: all 0.3s ease-in-out;
 }

 .hv-line-under:hover::after {
   background-color: #1F1F1F;
 }

 /*------------ avatar ---------------- */
 .avatar.round {
   border-radius: 50%;
   overflow: hidden;
 }

 .avatar img {
   width: 100%;
   min-width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .avt-40 {
   width: 40px;
   min-width: 40px;
   height: 40px;
 }

 .avt-56 {
   width: 56px;
   min-width: 56px;
   height: 56px;
 }

 .avt-60 {
   width: 60px;
   min-width: 60px;
   height: 60px;
 }

 .avt-100 {
   width: 100px;
   min-width: 100px;
   height: 100px;
 }

 /*------------ hover ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .hover-img .img-style {
   overflow: hidden;
 }

 .hover-img .img-style>img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   transition: opacity 0.5s ease, transform 2s cubic-bezier(0, 0, 0.44, 1.18);
 }

 .hover-img:hover .img-style>img {
   transform: scale(1.06);
 }

 .hover-img .img-style2 {
   overflow: hidden;
   border-radius: 10px;
 }

 .hover-img .img-style2 .img-hv {
   width: 100%;
   object-fit: cover;
   transition: all 1s cubic-bezier(0.3, 1, 0.35, 1) 0s;
   transition: transform 500ms ease;
 }

 .hover-shine {
   overflow: hidden;
 }

 .hover-shine .shine-item {
   position: relative;
   overflow: hidden;
 }

 .hover-shine .shine-item::after {
   content: "";
   position: absolute;
   width: 200%;
   height: 0%;
   left: 50%;
   top: 50%;
   background-color: rgba(255, 255, 255, 0.3);
   transform: translate(-50%, -50%) rotate(-45deg);
   z-index: 1;
 }

 .hover-shine:hover .shine-item::after {
   height: 250%;
   transition: all 600ms linear;
   background-color: transparent;
 }

 .hover-tooltip {
   position: relative;
 }

 .hover-tooltip .tooltip {
   position: absolute;
   white-space: nowrap;
   padding: 0px 10px;
   height: 23px;
   border-radius: 4px;
   bottom: calc(100% + 8px);
   transform: translateY(8px);
   opacity: 0;
   visibility: hidden;
   color: var(--white);
   width: max-content;
   background-color: var(--dark);
   transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24), -webkit-transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24);
   z-index: 100;
   font-size: 10px;
   line-height: 23px;
   font-weight: 500;
   text-align: center;
 }

 .hover-tooltip .tooltip::before {
   content: "";
   left: 50%;
   transform: translateX(-50%) rotate(45deg);
   top: 18px;
   position: absolute;
   background: var(--dark);
   width: 8px;
   height: 8px;
   z-index: -1;
 }

 .hover-tooltip:hover .tooltip {
   opacity: 1;
   visibility: visible;
   transform: none;
   transition-delay: 0.1s;
 }

 .hover-tooltip.tooltip-bot .tooltip {
   top: calc(100% + 8px);
   bottom: auto;
 }

 .hover-tooltip.tooltip-bot .tooltip::before {
   top: -2px;
 }

 .hover-tooltip.tooltip-left .tooltip {
   right: 100%;
   bottom: auto;
   transform: translateX(0px);
 }

 .hover-tooltip.tooltip-left .tooltip::before {
   top: 50%;
   left: auto;
   transform: translateY(-50%) rotate(45deg);
   right: -2px;
 }

 .hover-tooltip.tooltip-left:hover .tooltip {
   transform: translateX(-8px);
 }

 .hover-tooltip.tooltip-right .tooltip {
   left: 100%;
   bottom: auto;
   transform: translateX(0px);
 }

 .hover-tooltip.tooltip-right .tooltip::before {
   top: 50%;
   right: auto;
   transform: translateY(-50%) rotate(45deg);
   left: -2px;
 }

 .hover-tooltip.tooltip-right:hover .tooltip {
   transform: translateX(8px);
 }

 .hover-overlay {
   position: relative;
 }

 .hover-overlay::before {
   position: absolute;
   z-index: 2;
   content: "";
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.1);
   top: 0;
   left: 0;
   transition: 0.4s ease 0.1s;
   opacity: 0;
   visibility: hidden;
 }

 .hover-overlay:hover::before {
   opacity: 1;
   visibility: visible;
 }

 .hover-overlay-2 .img-hv-overlay {
   position: relative;
 }

 .hover-overlay-2 .img-hv-overlay::before {
   content: "";
   position: absolute;
   width: 50%;
   left: 0;
   top: 0;
   height: 0%;
   background-color: var(--dark);
   opacity: 0.1;
   z-index: 2;
   transition: all 0.3s ease-in-out;
 }

 .hover-overlay-2 .img-hv-overlay::after {
   content: "";
   position: absolute;
   width: 50%;
   right: 0;
   bottom: 0;
   height: 0%;
   background-color: var(--dark);
   opacity: 0.1;
   z-index: 2;
   transition: all 0.3s ease-in-out;
 }

 .hover-overlay-2:hover .img-hv-overlay::before {
   height: 100%;
 }

 .hover-overlay-2:hover .img-hv-overlay::after {
   height: 100%;
   transition-delay: 0.2s;
 }

 /*------------ form ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .tf-check {
   position: relative;
   background: transparent;
   cursor: pointer;
   outline: 0;
   -webkit-appearance: none;
   width: 16px;
   height: 16px;
   min-width: 16px;
   border: 1px solid var(--rgba-dark-3);
   display: inline-flex;
   justify-content: center;
   align-items: center;
   border-radius: 3px;
 }

 .tf-check:checked {
   border-color: var(--primary);
   background-color: var(--primary);
 }

 .tf-check:checked::before {
   opacity: 1;
   transform: scale(1);
 }

 .tf-check::before {
   font-weight: 500;
   font-family: "icomoon";
   content: "\e92c";
   position: absolute;
   color: var(--white);
   opacity: 0;
   font-size: 7px;
   transform: scale(0);
   transition: all 0.3s ease-in-out;
 }

 .tf-check-rounded {
   position: relative;
   border: 1px solid #9a9a9a;
   border-radius: 50%;
   background: none;
   cursor: pointer;
   outline: 0;
   height: 10px;
   width: 10px;
   display: flex;
   align-items: center;
   justify-content: center;
   -webkit-appearance: none;
 }

 .tf-check-rounded::before {
   content: "";
   position: absolute;
   border-radius: 50%;
   width: 6px;
   height: 6px;
   background-color: var(--primary);
   opacity: 0;
 }

 .tf-check-rounded:checked {
   border-color: var(--primary);
 }

 .tf-check-rounded:checked::before {
   opacity: 1;
 }

 .tf-select {
   position: relative;
 }

 .tf-select select {
   width: 100%;
   padding: 9px 24px 9px 12px;
   border: 1px solid var(--line);
   border-radius: 999px;
   -webkit-appearance: none;
   appearance: none;
   background-color: transparent;
   transition: all 0.3s ease-in-out;
   font-size: 16px;
   line-height: 24px;
   color: var(--text);
 }

 .tf-select::after {
   font-family: "icomoon";
   position: absolute;
   content: "\e95a";
   right: 12px;
   top: 50%;
   transform: translateY(-50%);
   font-size: 10px;
   z-index: -1;
   font-weight: 400;
 }

 .tf-select:hover select {
   border-color: var(--rgba-dark-2);
 }

 .tf-select.select-square select {
   padding-top: 14px;
   padding-bottom: 14px;
   border-radius: 6px;
   font-size: 14px;
   line-height: 20px;
   color: var(--text-3);
   opacity: 0.8;
   height: 50px;
 }

 .tf-field {
   position: relative;
 }

 .tf-field .tf-input:not(:placeholder-shown)~.tf-field-label,
 .tf-field .tf-input:focus~.tf-field-label {
   border-radius: 3px;
   background-color: rgb(242, 242, 242);
   font-size: 12px;
   top: 0;
   padding: 0 8px;
   color: var(--rgba-dark-2);
 }

 .tf-field .tf-input::placeholder {
   color: transparent;
 }

 .tf-field .tf-field-label {
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   left: 20px;
   transition: all 0.1s ease;
   cursor: text;
   font-size: 14px;
   line-height: 20px;
   color: rgba(102, 112, 133, 0.8);
 }

 .tf-field.style-2 .tf-input {
   padding: 24px 20px 6px;
   height: 50px;
 }

 .tf-field.style-2 .tf-input:not(:placeholder-shown)~.tf-field-label,
 .tf-field.style-2 .tf-input:focus~.tf-field-label {
   top: 6px;
   left: 20px;
   transform: none;
   background-color: transparent;
   padding: 0;
   font-size: 12px;
   line-height: 18px;
   color: rgba(102, 112, 133, 0.8);
 }

 .tf-field.style-3 .tf-input {
   padding-left: 12px;
   padding-right: 12px;
 }

 .tf-field.style-3 .tf-input:not(:placeholder-shown)~.tf-field-label,
 .tf-field.style-3 .tf-input:focus~.tf-field-label {
   left: 12px;
 }

 .tf-field.style-3 .tf-field-label {
   left: 12px;
 }

 .form-search {
   position: relative;
 }

 .form-search input {
   border-color: rgba(0, 0, 0, 0.2);
 }

 .form-search input::placeholder {
   color: #989898;
 }

 .form-search button {
   position: absolute;
   right: 16px;
   top: 50%;
   transform: translateY(-50%);
   padding: 0;
   background-color: transparent;
   border: 0;
   color: var(--dark);
 }

 .form-search button .icon {
   font-size: 24px;
 }

 .form-search .btn-search {
   background-color: var(--dark);
   color: var(--white);
   padding: 7px 22px;
   right: 6px;
 }

 .form-search .btn-search .icon {
   font-size: 24px;
 }

 .form-search .btn-search:hover {
   background-color: var(--primary);
   color: var(--white);
 }

 .tf-form-search {
   position: relative;
 }

 .tf-form-search .search-suggests-results {
   border-radius: 10px;
   position: absolute;
   top: calc(100% + 5px);
   right: 0;
   left: 0;
   z-index: 1000;
   height: auto;
   background-color: var(--white);
   opacity: 0;
   visibility: hidden;
   transition: all 0.1s ease-in-out;
   max-width: 100%;
   box-shadow: var(--shadow-1);
   pointer-events: none;
 }

 .tf-form-search .search-suggests-results .search-suggests-results-inner {
   overflow: auto;
   overflow-x: hidden;
   padding: 20px;
   max-height: calc(95vh - 183px);
 }

 .tf-form-search .search-suggests-results .search-suggests-results-inner::-webkit-scrollbar {
   width: 5px;
   border-radius: 5px;
 }

 .tf-form-search .search-suggests-results .search-suggests-results-inner::-webkit-scrollbar-track {
   background-color: var(--line);
 }

 .tf-form-search .search-suggests-results .search-suggests-results-inner::-webkit-scrollbar-thumb {
   background: var(--line-3);
   border-radius: 10px;
 }

 .tf-form-search:hover .search-suggests-results {
   opacity: 1;
   visibility: visible;
   pointer-events: all;
 }

 .tf-form-search .search-suggests-results-inner .search-result-item {
   display: flex;
   gap: 15px;
 }

 .tf-form-search .search-suggests-results-inner .search-result-item .box-content {
   flex-grow: 1;
 }

 .tf-form-search .search-suggests-results-inner .search-result-item .box-content .title {
   color: var(--dark);
   text-align: start;
 }

 .tf-form-search .search-suggests-results-inner .search-result-item .box-content .price {
   color: var(--dark);
   font-weight: 500;
   font-size: 14px;
   line-height: 22px;
   display: flex;
   align-items: center;
   gap: 8px;
 }

 .tf-form-search .search-suggests-results-inner .search-result-item .box-content .old-price {
   text-decoration: line-through;
   color: var(--rgba-dark);
 }

 .tf-form-search .search-suggests-results-inner .search-result-item .box-content .new-price {
   color: var(--primary);
 }

 .tf-form-search .search-suggests-results-inner .search-result-item .img-box {
   width: 60px;
   height: auto;
 }

 .tf-form-search .search-suggests-results-inner .search-result-item .img-box img {
   width: 100%;
   height: 100%;
 }

 .tf-form-search .search-suggests-results-inner li:not(:last-child) .search-result-item {
   padding-bottom: 10px;
   margin-bottom: 10px;
   border-bottom: solid 1px var(--line);
 }

 .tf-form-search.style-2 {
   display: flex;
   align-items: center;
   max-width: 631px;
   border: 1px solid var(--line);
   border-radius: 99px;
 }

 .tf-form-search.style-2 .tf-select {
   border-right: 1px solid var(--line);
 }

 .tf-form-search.style-2 .tf-select select {
   border: 0;
   width: 166px;
   padding: 0 24px 0 20px;
 }

 .tf-form-search.style-2 .form-search {
   flex-grow: 1;
 }

 .tf-form-search.style-2 .form-search input {
   border: 0;
 }

 .tf-form-search.style-2 .form-search:hover .search-suggests-results {
   opacity: 1;
   visibility: visible;
   pointer-events: all;
 }

 .tf-form-search.style-2:hover .search-suggests-results {
   opacity: 0;
   visibility: hidden;
   pointer-events: none;
 }

 .form-newsletter fieldset input {
   border-radius: 49px;
   border-color: var(--line);
   padding: 14px 20px;
   font-weight: 400;
 }

 .form-newsletter fieldset input::placeholder {
   font-weight: 400;
   color: #a5a5a5;
 }

 .form-newsletter .button-submit {
   position: absolute;
   right: 2px !important;
   top: 50%;
   transform: translateY(-50%);
 }

 .form-newsletter .subscribe-content {
   position: relative;
 }

 .form-default .cols {
   display: flex;
   gap: 24px;
   margin-bottom: 24px;
 }

 .form-default .cols>* {
   width: 100%;
 }

 .form-default fieldset label {
   font-size: 14px;
   line-height: 20px;
   margin-bottom: 10px;
 }

 .form-default fieldset input {
   border-radius: 45px;
   border-color: var(--line);
   color: var(--dark);
 }

 .form-default fieldset textarea {
   border-radius: 16px;
   border-color: var(--line);
   height: 228px;
 }

 .form-default fieldset textarea:hover {
   border-color: var(--dark);
 }

 .form-default .notice {
   margin-bottom: 42px;
 }

 .form-default .button-submit {
   display: flex;
   justify-content: center;
 }

 .form-default .button-submit .tf-btn {
   padding: 11px 28px;
   font-family: "DM Sans", sans-serif;
   min-width: 176px;
 }

 .wd-form-address {
   padding: 32px;
   border: 1px solid var(--line);
   border-radius: 16px;
 }

 .wd-form-address .cols {
   margin-bottom: 15px;
 }

 .wd-form-address fieldset input {
   border-radius: 6px;
 }

 .wd-form-address .tf-cart-checkbox {
   margin-bottom: 24px;
   display: flex;
   gap: 10px;
   align-items: center;
   cursor: pointer;
 }

 .wd-form-address .box-btn {
   display: flex;
   gap: 12px;
 }

 .show-form-address,
 .edit-form-address {
   display: none;
 }

 .edit-form-address {
   margin-top: 24px;
 }

 .account-address .title-account {
   margin-bottom: 23px;
 }

 .cols {
   display: flex;
   gap: 15px 10px;
 }

 .cols>* {
   width: 100%;
 }

 .form-ask-question .text {
   margin-bottom: 10px;
   font-size: 16px;
   font-weight: 400;
   line-height: 19px;
   color: #5d5d5d;
 }

 .form-ask-question textarea {
   height: 149px;
 }

 .form-ask-question button {
   margin-top: 42px;
   font-family: "DM Sans", sans-serif;
   font-size: 16px;
   font-weight: 600;
   line-height: 19.2px;
   letter-spacing: -0.03em;
 }

 .flat-alert {
   margin-bottom: 10px;
 }

 .flat-alert.msg-success {
   font-weight: 500;
   color: var(--success);
 }

 .flat-alert.msg-error {
   font-weight: 500;
   color: var(--red);
 }

 #subscribe-msg {
   color: var(--success);
 }

 #subscribe-msg .notification_ok {
   color: var(--success);
 }

 #subscribe-msg .notification_error {
   margin-top: 15px;
   color: var(--red);
 }

 /*------------ drop down ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .image-select.style-default {
   width: unset !important;
   display: flex;
 }

 .image-select.style-default>select {
   display: none !important;
 }

 .image-select.style-default>.dropdown-toggle {
   padding: 0;
   background-color: transparent !important;
   border: 0 !important;
   outline: none !important;
   padding-right: 14px;
   color: var(--dark);
   gap: 6px;
 }

 .image-select.style-default>.dropdown-toggle::after {
   border: 0;
   position: absolute;
   right: 0;
   content: "\e95a";
   font-family: "icomoon";
   font-size: 10px;
   color: var(--dark);
   margin-top: 2px;
 }

 .image-select.style-default .filter-option-inner-inner {
   display: flex;
   align-items: center;
   justify-content: start;
   gap: 6px;
   font-weight: 400;
   font-size: 14px;
   line-height: 18px;
   color: var(--dark);
 }

 .image-select.style-default .filter-option-inner-inner img {
   width: 14px;
   height: 14px;
   border-radius: 50%;
 }

 .image-select.style-default>.dropdown-menu {
   overflow: unset !important;
   margin-top: 17px !important;
   margin-bottom: 17px !important;
   padding: 15px 20px;
   border-radius: 8px;
   border: 0;
   background-color: var(--white);
   box-shadow: var(--shadow-1);
 }

 .image-select.style-default>.dropdown-menu a {
   padding: 5px 0;
 }

 .image-select.style-default>.dropdown-menu a .text {
   display: flex;
   align-items: center;
   justify-content: start;
   gap: 6px;
   font-weight: 400;
   font-size: 14px;
   line-height: 18px;
 }

 .image-select.style-default>.dropdown-menu a .text img {
   width: 14px;
   height: 14px;
   border-radius: 50%;
 }

 .image-select.style-default>.dropdown-menu a:hover,
 .image-select.style-default>.dropdown-menu a:active,
 .image-select.style-default>.dropdown-menu a.active {
   color: var(--primary);
   background-color: unset;
 }

 .image-select.style-default>.dropdown-menu::after {
   position: absolute;
   content: "";
   width: 12px;
   height: 12px;
   transform: translate(-50%, -50%) rotate(45deg);
   background-color: var(--white);
   top: 0;
   left: 50%;
   z-index: 2;
 }

 .image-select.style-default>.dropdown-menu[data-popper-placement=top-start]::after {
   display: none;
 }

 .image-select.style-default>.dropdown-menu[data-popper-placement=top-start]::before {
   position: absolute;
   content: "";
   width: 12px;
   height: 12px;
   transform: translate(-50%, 50%) rotate(45deg);
   background-color: var(--white);
   bottom: 0%;
   left: 50%;
   z-index: 2;
 }

 .image-select.type-currencies>.dropdown-menu {
   min-width: 215px;
 }

 

 .image-select.color-secondary-2>.dropdown-toggle {
   color: var(--secondary-2);
 }

 .image-select.color-secondary-2>.dropdown-toggle::after {
   color: var(--secondary-2);
 }

 .image-select.color-secondary-2>.dropdown-toggle .filter-option .filter-option-inner {
   color: var(--secondary-2);
 }

 .image-select.color-white>.dropdown-toggle {
   color: var(--white);
 }

 .image-select.color-white>.dropdown-toggle::after {
   color: var(--white);
 }

 .image-select.color-white>.dropdown-toggle .filter-option .filter-option-inner {
   color: var(--white);
 }

 .tf-variant-dropdown {
   position: relative;
   border-radius: 6px;
   padding: 10px 12px;
   min-width: 100px;
   border: 1px solid var(--line-2);
   cursor: pointer;
   transition: all 0.3s ease-in-out;
 }

 .tf-variant-dropdown .btn-select {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 10px;
 }

 .tf-variant-dropdown .btn-select .icon {
   font-size: 7px;
 }

 .tf-variant-dropdown .text-sort-value {
   text-wrap: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   font-size: 14px;
   line-height: 20px;
   font-weight: 500;
   color: var(--rgba-dark-2);
   text-transform: capitalize;
 }

 .tf-variant-dropdown .dropdown-menu {
   margin: 5px !important;
   box-shadow: var(--shadow-1);
   min-width: 180px;
   border: 0;
   padding-top: 10px;
   padding-bottom: 10px;
   border-radius: 6px;
   max-height: 68vh;
   isolation: isolate;
   overscroll-behavior-y: contain;
   overflow-y: auto;
 }

 .tf-variant-dropdown .dropdown-menu::-webkit-scrollbar {
   width: 5px;
 }

 .tf-variant-dropdown .dropdown-menu::-webkit-scrollbar-track {
   background-color: var(--bg-scrollbar-track);
 }

 .tf-variant-dropdown .dropdown-menu::-webkit-scrollbar-thumb {
   background: var(--bg-scrollbar-thumb);
   border-radius: 4px;
 }

 .tf-variant-dropdown .select-item {
   position: relative;
   font-size: 14px;
   font-weight: 500;
   text-transform: capitalize;
   color: var(--text);
   padding: 0 20px;
   line-height: 30px;
   width: 100%;
   transition: all 0.3s ease-in-out;
 }

 .tf-variant-dropdown .select-item::after {
   height: 100%;
   content: "";
   width: 6px;
   position: absolute;
   z-index: 2;
   left: 3px;
   top: 0;
   background-color: var(--white);
 }

 .tf-variant-dropdown .select-item::before {
   left: 0;
   width: 3px;
   height: 100%;
   content: "";
   position: absolute;
   z-index: 1;
   top: 0;
   background-color: var(--line);
   border-radius: 0 3px 3px 0;
 }

 .tf-variant-dropdown .select-item.active {
   background-color: var(--line);
   color: var(--dark);
 }

 .tf-variant-dropdown .select-item.active::before {
   background-color: var(--dark);
 }

 .tf-variant-dropdown .select-item:hover {
   background-color: var(--line);
   color: var(--dark);
 }

 .tf-variant-dropdown:hover {
   border-color: var(--dark);
 }

 .tf-variant-dropdown.full .dropdown-menu {
   width: 100%;
   margin-left: 0 !important;
   margin-right: 0 !important;
 }

 .tf-variant-dropdown.full .select-item {
   line-height: 40px;
 }

 .tf-variant-dropdown.has-color .select-item {
   display: flex;
   gap: 6px;
   align-items: center;
 }

 .tf-variant-dropdown.has-color .box-color {
   width: 15px;
   height: 15px;
   display: inline-block;
   border-radius: 50%;
 }

 .tf-dropdown-sort {
   border-radius: 27px;
   padding: 8px 14px;
   min-width: 100px;
   border: 1px solid var(--line);
   cursor: pointer;
   transition: all 0.3s ease-in-out;
 }

 .tf-dropdown-sort .icon {
   font-size: 12px;
   display: inline-block;
   transition: all 0.3s ease-in-out;
   margin-top: 2px;
 }

 .tf-dropdown-sort .btn-select {
   text-wrap: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   font-size: 16px;
   line-height: 20px;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 6px;
 }

 .tf-dropdown-sort.show .btn-select .icon {
   transform: rotate(180deg);
 }

 .tf-dropdown-sort .text-sort-value {
   text-wrap: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   font-size: 14px;
   line-height: 20px;
   font-weight: 400;
   text-transform: capitalize;
 }

 .tf-dropdown-sort .dropdown-menu {
   margin: 5px !important;
   box-shadow: var(--shadow-1);
   min-width: 180px;
   border: 1px solid var(--line);
   padding: 10px 5px;
   border-radius: 8px;
   max-height: 68vh;
   isolation: isolate;
   overscroll-behavior-y: contain;
   overflow-y: auto;
   z-index: 99;
 }

 .tf-dropdown-sort .dropdown-menu::-webkit-scrollbar {
   width: 5px;
 }

 .tf-dropdown-sort .dropdown-menu::-webkit-scrollbar-track {
   background-color: var(--bg-scrollbar-track);
 }

 .tf-dropdown-sort .dropdown-menu::-webkit-scrollbar-thumb {
   background: var(--bg-scrollbar-thumb);
   border-radius: 4px;
 }

 .tf-dropdown-sort .select-item {
   position: relative;
   font-size: 14px;
   font-weight: 400;
   text-transform: capitalize;
   color: var(--dark);
   padding: 0 15px;
   line-height: 30px;
   width: 100%;
   transition: all 0.3s ease-in-out;
 }

 .tf-dropdown-sort .select-item:hover,
 .tf-dropdown-sort .select-item.active {
   color: var(--dark);
   background-color: var(--line);
 }

 .tf-dropdown-sort:hover {
   border-color: var(--dark);
 }

 .dropdown-filter .dropdown-toggle {
   min-width: 91px;
   border-radius: 27px;
   padding: 8px 14px;
   border: 1px solid var(--line);
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 6px;
   transition: all 0.3s ease-in-out;
 }

 .dropdown-filter .dropdown-toggle::after {
   display: none;
 }

 .dropdown-filter .dropdown-toggle.show .icon {
   transform: rotate(180deg);
 }

 .dropdown-filter .dropdown-toggle:hover {
   border-color: var(--dark);
 }

 .dropdown-filter .icon {
   font-size: 12px;
   display: inline-block;
   transition: all 0.3s ease-in-out;
   margin-top: 2px;
 }

 .dropdown-filter .text-value {
   text-wrap: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   font-size: 14px;
   line-height: 20px;
   font-weight: 400;
   text-transform: capitalize;
 }

 .dropdown-filter .dropdown-menu {
   margin-top: -2px !important;
   min-width: 200px;
   box-shadow: var(--shadow-1);
   border: 1px solid var(--line);
   border-radius: 8px;
   padding: 15px 10px;
   max-height: 68vh;
   isolation: isolate;
   overscroll-behavior-y: contain;
   overflow-y: auto;
   z-index: 99;
 }

 .dropdown-filter .dropdown-menu::-webkit-scrollbar {
   width: 5px;
 }

 .dropdown-filter .dropdown-menu::-webkit-scrollbar-track {
   background-color: var(--bg-scrollbar-track);
 }

 .dropdown-filter .dropdown-menu::-webkit-scrollbar-thumb {
   background: var(--bg-scrollbar-thumb);
   border-radius: 4px;
 }

 .dropdown-filter .dropdown-menu .widget-price {
   gap: 8px;
 }

 .dropdown-filter .dropdown-menu .widget-price .box-value-price {
   margin-top: 6px;
 }

 
 /*------------ carousel ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .swiper {
   --swiper-theme-color: var(--primary);
   --swiper-pagination-progressbar-bg-color: #d9d9d9;
 }

 .swiper-pagination-progressbar {
   border-radius: 34px;
   overflow: hidden;
 }

 .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,
 .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
   margin: 0px;
 }

 .sw-dots {
   display: flex;
   gap: 10px;
 }

 .sw-dots .swiper-pagination-bullet {
   background: #373737;
   position: relative;
   opacity: 1;
   transition: all 0.25s cubic-bezier(0, 0, 0.76, 1);
 }

 .sw-dots .swiper-pagination-bullet::after {
   content: "";
   width: 26px;
   height: 26px;
   position: absolute;
   top: 50%;
   left: 50%;
   border-radius: 50%;
   border: 1px solid #ff4747;
   border-top-color: transparent;
   transition: all 0.25s cubic-bezier(0, 0, 0.76, 1);
   opacity: 0;
   animation: spin-border 1.5s linear infinite;
 }

 .sw-dots .swiper-pagination-bullet.swiper-pagination-bullet-active {
   margin: 0px 10px;
 }

 .sw-dots .swiper-pagination-bullet.swiper-pagination-bullet-active::after {
   opacity: 1;
   transform: translate(-50%, -50%) rotate(45deg);
 }

 .sw-dots.style-dark .swiper-pagination-bullet::after {
   border: 1px solid var(--dark);
   border-top-color: transparent;
 }

 .sw-dots.style-white .swiper-pagination-bullet {
   background: var(--white);
 }

 .sw-dots.style-white .swiper-pagination-bullet::after {
   border-color: var(--white);
   border-top-color: transparent;
 }

 .sw-dots.style-white.border-red .swiper-pagination-bullet::after {
   border: 1px solid #ff4747;
   border-top-color: transparent;
 }

 .sw-dots.style-grey .swiper-pagination-bullet {
   background: #b4b4b4;
 }

 .sw-dots.style-grey .swiper-pagination-bullet::after {
   border: 1px solid var(--white);
   transform: translate(-50%, -50%);
   width: 16px;
   height: 16px;
 }

 .sw-dots.style-grey .swiper-pagination-bullet.swiper-pagination-bullet-active {
   background: var(--white);
   border-color: var(--white);
   margin: 0px 4px;
 }

 .sw-dots.style-2 {
   gap: 12px;
 }

 .sw-dots.style-2 .swiper-pagination-bullet {
   background-color: #1b1b1b;
 }

 .sw-dots.style-2 .swiper-pagination-bullet::after {
   transform: translate(-50%, -50%);
   border: unset;
   height: 18px;
   width: 18px;
   border: 5px solid var(--primary-3);
 }

 .sw-dots.style-2 .swiper-pagination-bullet.swiper-pagination-bullet-active {
   margin: 0px 5px !important;
   background-color: var(--white);
 }

 .sw-dots.style-2.type-2 {
   gap: 10px;
 }

 .sw-dots.style-2.type-2 .swiper-pagination-bullet {
   background-color: #bababa;
 }

 .sw-dots.style-2.type-2 .swiper-pagination-bullet::after {
   transform: translate(-50%, -50%);
   border: unset;
   height: 26px;
   width: 26px;
   border: 9px solid rgba(238, 238, 238, 0.6980392157);
 }

 .sw-dots.style-2.type-2 .swiper-pagination-bullet.swiper-pagination-bullet-active {
   margin: 0px 9px !important;
   background-color: var(--dark);
 }

 .sw-dots.style-2.dot-white .swiper-pagination-bullet {
   width: 8px;
   height: 8px;
 }

 .sw-dots.style-2.dot-white .swiper-pagination-bullet-active::after {
   border: 9px solid rgba(255, 255, 255, 0.4);
   width: 26px;
   height: 26px;
 }

 .sw-dots.dot-white .swiper-pagination-bullet {
   background: var(--white);
 }

 .sw-dots.border-white .swiper-pagination-bullet {
   background-color: var(--white);
 }

 .sw-dots.border-white .swiper-pagination-bullet::after {
   border: 1px solid var(--white);
 }

 .sw-dots.medium .swiper-pagination-bullet::after {
   width: 22px;
   height: 22px;
 }

 .sw-dots.small {
   height: 15px;
   align-items: center;
 }

 .sw-dots.small .swiper-pagination-bullet {
   height: 6px;
   width: 6px;
 }

 .sw-dots.small .swiper-pagination-bullet::after {
   animation: unset;
 }

 .sw-dots.small .swiper-pagination-bullet.swiper-pagination-bullet-active::after {
   width: 15px;
   height: 15px;
 }

 .sw-dot-default {
   display: flex;
   gap: 4px;
   margin-top: 20px;
 }

 .sw-dot-default .swiper-pagination-bullet {
   width: 16px;
   height: 16px;
   display: flex;
   align-items: center;
   justify-content: center;
   transition: all 0.3s ease-in-out;
   background-color: transparent;
   border: 1px solid transparent;
   position: relative;
   opacity: 1;
 }

 .sw-dot-default .swiper-pagination-bullet:before {
   content: "";
   display: inline-block;
   width: 6px;
   height: 6px;
   border-radius: 999px;
   background-color: #b1b1b1;
   transition: all 0.3s ease-in-out;
 }

 .sw-dot-default .swiper-pagination-bullet-active {
   border-color: var(--dark);
 }

 .sw-dot-default .swiper-pagination-bullet-active::before {
   background-color: var(--dark);
 }

 .sw-dot-default.style-white .swiper-pagination-bullet::before {
   background-color: var(--white);
 }

 .sw-dot-default.style-white .swiper-pagination-bullet-active {
   border-color: var(--white);
 }

 .sw-dot-default.style-white .swiper-pagination-bullet-active::before {
   background-color: var(--white);
 }

 .sw-dot-default.style-sm {
   gap: 2px;
 }

 .sw-dot-default.style-sm .swiper-pagination-bullet {
   width: 14px;
   height: 14px;
 }

 .sw-dot-default.style-sm .swiper-pagination-bullet:before {
   width: 4px;
   height: 4px;
 }

 .sw-dot-default.style-lg .swiper-pagination-bullet {
   width: 22px;
   height: 22px;
 }

 .sw-dot-default.style-lg .swiper-pagination-bullet:before {
   width: 8px;
   height: 8px;
 }

 .sw-dot-default.style-pos {
   position: absolute;
   z-index: 1;
 }

 .sw-auto .swiper-wrapper {
   align-items: center;
 }

 .sw-auto .swiper-slide {
   width: auto;
   transition-timing-function: linear;
 }

 .sw-auto.tf-sw-iconbox-row .swiper-wrapper {
   justify-content: space-between;
 }

 .nav-swiper {
   background-color: var(--white);
   border-radius: 999px;
   transition: all 0.3s ease-in-out;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 44px;
   height: 44px;
   border: 1px solid var(--line);
   color: var(--dark);
   cursor: pointer;
 }

 .nav-swiper::after {
   font-size: 12px;
   color: var(--dark);
   font-weight: 600;
   transition: all 0.3s ease-in-out;
 }

 .nav-swiper:hover {
   background-color: var(--rgba-dark-2);
   border-color: var(--rgba-dark-2);
 }

 .nav-swiper:hover::after {
   color: var(--white);
 }

 .nav-swiper.style-1 {
   width: 48px;
   height: 48px;
   border: 0 !important;
   background-color: transparent !important;
 }

 .nav-swiper.style-1.swiper-button-prev {
   transform: rotate(180deg);
 }

 .nav-swiper.style-1.swiper-button-prev::after {
   font-family: "icomoon";
   font-size: 18px;
   content: "\e904";
   font-weight: 400;
 }

 .nav-swiper.style-1.swiper-button-next::after {
   font-family: "icomoon";
   font-size: 18px;
   content: "\e904";
   font-weight: 400;
 }

 .nav-swiper.style-1:hover::after {
   color: var(--primary) !important;
 }

 .nav-swiper.swiper-button-disabled {
   background-color: rgba(0, 0, 0, 0.4);
   border-color: transparent;
   cursor: text;
 }

 .nav-swiper.arrow-1.swiper-button-prev {
   transform: rotate(180deg);
 }

 .nav-swiper.arrow-1.swiper-button-prev::after {
   font-family: "icomoon";
   content: "\e904";
   font-weight: 400;
 }

 .nav-swiper.arrow-1.swiper-button-next::after {
   font-family: "icomoon";
   content: "\e904";
   font-weight: 400;
 }

 .nav-swiper.size-30 {
   width: 30px;
   height: 30px;
 }

 .nav-swiper.size-30::after {
   font-size: 10px;
 }

 .nav-swiper.size-36 {
   width: 36px;
   height: 36px;
 }

 .nav-swiper.size-36::after {
   font-size: 10px;
 }

 .nav-swiper.size-48 {
   width: 48px;
   height: 48px;
 }

 .nav-swiper.size-48::after {
   font-size: 14px;
 }

 .nav-swiper.style-line {
   background-color: transparent;
   border-color: var(--dark);
   color: var(--dark);
 }

 .nav-swiper.style-line::after {
   transition: all 0.3s ease-in-out;
 }

 .nav-swiper.style-line:hover:not(.swiper-button-disabled) {
   background-color: var(--dark);
   border-color: var(--dark);
 }

 .nav-swiper.style-line.swiper-button-disabled {
   border-color: rgba(0, 0, 0, 0.4);
   cursor: text;
 }

 .nav-swiper.style-line.swiper-button-disabled::after {
   color: rgba(0, 0, 0, 0.4);
 }

 .nav-swiper.line-white {
   background-color: transparent;
   border-color: var(--white);
 }

 .nav-swiper.line-white::after {
   color: var(--white);
   transition: all 0.3s ease-in-out;
 }

 .nav-swiper.line-white:hover:not(.swiper-button-disabled) {
   background-color: var(--white);
   border-color: var(--white);
 }

 .nav-swiper.line-white:hover:not(.swiper-button-disabled)::after {
   color: var(--dark);
 }

 .nav-swiper.line-white.swiper-button-disabled {
   border-color: rgba(255, 255, 255, 0.4);
   cursor: text;
 }

 .nav-swiper.line-white.swiper-button-disabled::after {
   color: rgba(255, 255, 255, 0.4);
 }

 .hover-sw-nav {
   position: relative;
 }

 .fl-control-sw {
   position: relative;
 }

 .fl-control-sw .nav-swiper {
   margin-top: 0;
   top: 50%;
   transform: translateY(-50%);
 }

 .fl-control-sw.pos1 .nav-swiper {
   top: 45%;
 }

 .fl-control-sw.pos2 .nav-swiper {
   top: 38%;
 }

 .fl-control-sw.pos3 .nav-swiper {
   top: 43%;
 }

 .fl-control-sw2 {
   position: relative;
 }

 .fl-control-sw2 .nav-swiper {
   margin-top: 0;
   top: 50%;
   transform: translateY(-50%);
 }

 .fl-control-sw2.pos1 .nav-swiper {
   top: 42%;
 }

 .fl-control-sw2.pos2 .nav-swiper {
   top: 38%;
 }

 .wrap-pos-nav {
   position: relative;
 }

 .wrap-pos-nav .nav-swiper {
   position: absolute;
   margin-top: 3px;
   top: 50%;
   transform: translateY(-50%);
 }

 .wrap-pos-nav.sw-over-product .nav-swiper {
   margin-top: -10px;
 }

 .box-nav-swiper {
   display: flex;
   gap: 8px;
 }

 .box-nav-swiper .nav-swiper {
   position: unset;
   margin: 0;
 }

 .box-nav-swiper.style-2 {
   gap: 12px;
 }

 .tab-content .swiper-pagination-progressbar {
   margin-top: 30px;
 }

 .sw-height .swiper-slide {
   height: auto;
 }

 .sw-height .swiper-slide .tf-icon-box,
 .sw-height .swiper-slide .card-product {
   width: 100%;
   height: 100%;
 }

 /*------------ pop up ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .offcanvas {
   border: none !important;
   color: var(--dark);
   z-index: 1600;
 }

 .offcanvas .icon-close-popup {
   transition: all 0.3s ease-in-out;
   cursor: pointer;
   background: transparent;
   font-size: 16px;
   padding: 10px;
   border: none;
   color: var(--dark);
   z-index: 10;
 }

 .offcanvas .icon-close-popup:hover {
   color: var(--primary);
 }

 .offcanvas .offcanvas-content {
   height: 100%;
 }

 .offcanvas-backdrop {
   background-color: var(--backdrop);
   z-index: 1500;
   cursor: url(../images/cursor-close.svg), auto;
 }

 .offcanvas-backdrop.show {
   opacity: 1;
 }

 .overflow-x-auto::-webkit-scrollbar,
 .overflow-y-auto::-webkit-scrollbar {
   width: 0px;
 }

 .modal-backdrop {
   background-color: var(--backdrop);
 }

 .modal-backdrop.show {
   opacity: 1;
 }

 .modal-dialog-centered {
   min-height: calc(100% - 60px);
 }

 .modal {
   cursor: url(../images/cursor-close.svg), auto;
 }

 .modal .icon-close,
 .modal .icon-close-popup {
   transition: all 0.3s ease-in-out;
   cursor: pointer;
   background: transparent;
   font-size: 16px;
   padding: 10px;
   border: none;
   z-index: 10;
   color: var(--dark);
 }

 .modal .icon-close:hover,
 .modal .icon-close-popup:hover {
   color: var(--primary);
 }

 .modal.fullRight .modal-dialog {
   transform: translate(100%, 0);
   min-width: 100%;
   height: 100%;
   margin: 0;
   transition: transform 1s ease-out;
 }

 .modal.fullRight .modal-dialog .modal-content {
   border-radius: 0;
   border: 0;
   margin: auto;
   overflow: hidden;
   position: absolute;
   right: 0;
   bottom: 0;
   top: 0;
   padding: 0;
 }

 .modal.fullRight .modal-dialog .modal-content .modal-body {
   overflow: auto;
   padding: 0;
   padding-bottom: 30px;
 }

 .modal.fullRight.show .modal-dialog {
   transform: none;
   transition: transform 0.4s ease-out;
 }

 .modal.fullLeft .modal-dialog {
   transform: translate(-100%, 0) !important;
   min-width: 100%;
   height: 100%;
   margin: 0;
   transition: all 0.3s !important;
 }

 .modal.fullLeft .modal-dialog .modal-content {
   border-radius: 0;
   border: 0;
   margin: auto;
   overflow: hidden;
   position: absolute;
   left: 0;
   bottom: 0;
   top: 0;
   padding: 0;
 }

 .modal.fullLeft .modal-dialog .modal-content .modal-body {
   overflow: auto;
   padding: 0;
   padding-bottom: 30px;
 }

 .modal.fullLeft.show .modal-dialog {
   transform: translate(0, 0) !important;
 }

 .modal.fullBottom .modal-dialog {
   transform: translate(0, 100%);
   min-width: 100%;
   height: 100%;
   max-height: unset;
   margin: 0;
   transition: transform 0.3s linear !important;
 }

 .modal.fullBottom .modal-dialog .modal-content {
   border-radius: 0;
   border: 0;
   margin: auto;
   overflow: hidden;
   position: absolute;
   right: 0;
   bottom: 0;
   padding: 0;
   max-height: max-content;
 }

 .modal.fullBottom .modal-dialog .modal-content .modal-body {
   overflow: auto;
   padding: 0;
   padding-bottom: 30px;
 }

 .modal.fullBottom.show .modal-dialog {
   transform: translate(0, 0);
 }

 .modal.fade:not(.show) {
   opacity: 0;
 }

 .modal .modal-content {
   cursor: default;
   border: 0;
   overflow: hidden;
   border-radius: 16px;
 }

 .modalCentered .modal-dialog {
   margin: 30px auto;
   padding-left: 15px;
   padding-right: 15px;
 }
  
 
 .tf-product-modal .modal-dialog {
   max-width: min(625px, 90vw);
 }

 .tf-product-modal .modal-dialog .modal-content {
   padding: 38px 36px 40px;
   margin-left: 0;
   margin-right: 0;
   border: 0;
 }

 .tf-product-modal .modal-dialog .modal-content .header {
   margin-bottom: 24px;
   display: flex;
   justify-content: space-between;
   align-items: center;
 }

 .tf-product-modal .modal-dialog .modal-content .header .demo-title {
   margin: 0;
   text-align: start;
   font-size: 26px;
   font-weight: 400;
   line-height: 31px;
 }

 .tf-product-modal .modal-dialog .modal-content .header span {
   position: unset;
   color: var(--dark);
   cursor: pointer;
   transition: all 0.3s ease-in-out;
 }

 .tf-product-modal .modal-dialog .modal-content .header span:hover {
   color: var(--primary);
 }

 .tf-product-modal .modal-dialog .modal-content h6 {
   font-weight: 600;
   line-height: 24px;
   margin-bottom: 25px;
 }

 .tf-product-modal .modal-dialog .modal-content .title {
   font-size: 18px;
   font-weight: 600;
   line-height: 22px;
   margin-top: 15px;
 }

 .tf-product-modal .modal-dialog .modal-content p {
   margin-top: 15px;
   margin-bottom: 20px;
 }

 .tf-product-modal .tf-social-icon .box-icon {
   width: 40px;
   height: 40px;
   border-radius: 999px;
   font-size: 16px;
   color: var(--white);
 }

 .tf-product-modal .tf-social-icon .box-icon.social-x {
   font-size: 12px;
   background: var(--twitter-cl);
 }

 .tf-product-modal .tf-social-icon .box-icon.social-facebook {
   background: var(--facebook-cl);
 }

 .tf-product-modal .tf-social-icon .box-icon.social-instagram {
   background: var(--instagram-cl);
 }

 .tf-product-modal .tf-social-icon .box-icon.social-tiktok {
   background: var(--tiktok-cl);
 }

 .tf-product-modal .tf-social-icon .box-icon.social-pinterest {
   background: var(--pinterest-cl);
 }

 .tf-product-modal .form-share {
   margin-top: 20px;
   position: relative;
 }

 .tf-product-modal .form-share .button-submit {
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   right: 0px;
 }

 .tf-product-modal .form-share .button-submit .tf-btn {
   padding: 10px 18px;
 }

 .tf-product-modal .form-share input {
   padding-right: 80px;
 }

 #ask_question fieldset {
   margin-bottom: 15px;
 }

 #ask_question fieldset label {
   margin-bottom: 5px;
   font-weight: 400;
   color: var(--text);
 }

 #ask_question fieldset input {
   height: 50px;
 }

 #ask_question textarea {
   height: 176px;
 }

 #ask_question button {
   border-radius: 4px;
 }

 #delivery_return .tf-product-popup-delivery .title {
   font-size: 20px;
   font-weight: 400;
   line-height: 36px;
   margin-bottom: 25px;
   margin-top: 0;
 }

 #delivery_return .tf-product-popup-delivery p {
   color: rgb(134, 134, 134);
   line-height: 22.4px;
   margin-bottom: 10px;
 }

 #delivery_return .tf-product-popup-delivery p a {
   color: rgb(134, 134, 134);
   text-decoration: underline;
   text-underline-offset: 3px;
 }

 #delivery_return .tf-product-popup-delivery p a:hover {
   color: var(--dark);
   text-decoration-thickness: 2px;
 }

 #delivery_return .tf-product-popup-delivery:not(:last-child) {
   margin-bottom: 20px;
 }

 .canvas-wrapper {
   padding: 0;
   isolation: isolate;
   height: 100%;
   width: 100%;
   max-height: none;
   display: grid;
   grid-auto-rows: auto minmax(0, 1fr) auto;
   align-content: start;
 }

 .canvas-body {
   background-color: var(--white);
   padding: 15px 20px;
   overscroll-behavior-y: contain;
   overflow-y: auto;
 }

 .canvas-body::-webkit-scrollbar {
   width: 5px;
 }

 .canvas-body::-webkit-scrollbar-track {
   background-color: var(--bg-scrollbar-track);
 }

 .canvas-body::-webkit-scrollbar-thumb {
   background: var(--bg-scrollbar-thumb);
   border-radius: 4px;
 }

 .canvas-sidebar {
   max-width: 320px;
   width: 100%;
 }

 .canvas-sidebar .canvas-header {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 15px;
   position: relative;
   text-transform: capitalize;
   font-size: 20px;
   line-height: 30px;
   font-weight: 500;
   color: var(--dark);
 }

 .canvas-sidebar .canvas-header .icon-close-popup {
   font-size: 12px;
   height: 32px;
   width: 32px;
   display: flex;
   justify-content: end;
   align-items: center;
   cursor: pointer;
 }

 .canvas-sidebar .canvas-header::after {
   position: absolute;
   content: "";
   bottom: 0;
   left: 15px;
   right: 15px;
   height: 1px;
   background-color: var(--line);
 }

 .canvas-sidebar .list-icon-box .tf-icon-box:not(:last-child) {
   margin-bottom: 24px;
 }

 .canvas-sidebar .list-recent li:not(:last-child) {
   margin-bottom: 20px;
 }

 .canvas-sidebar .mega-box:not(:last-child) {
   margin-bottom: 32px;
 }

 .canvas-compare {
   height: max-content !important;
   z-index: 5000;
 }

 .canvas-compare .close-popup {
   position: absolute;
   top: 30px;
   right: 30px;
   width: 30px;
   height: 30px;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 16px;
   cursor: pointer;
 }

 .canvas-compare .canvas-body {
   padding: 28px 0;
 }

 .popup-quickadd .modal-content {
   padding: 30px 15px;
 }

 .popup-quickadd .main-product-quickadd .item-product-info {
   display: flex;
   align-items: center;
   margin-bottom: 32px;
   gap: 20px;
   padding: 0;
 }

 .popup-quickadd .main-product-quickadd .price-wrap {
   display: flex;
   gap: 6px;
 }

 .popup-quickadd .main-product-quickadd .price-new {
   margin-right: 0;
   font-weight: 500;
 }

 .popup-quickadd .main-product-quickadd .product-img {
   max-width: 112px;
   border-radius: 6px;
   overflow: hidden;
   flex-shrink: 0;
 }

 .popup-quickadd .main-product-quickadd .content-box {
   display: grid;
   gap: 8px;
 }

 .popup-quickadd .main-product-quickadd .price-show-badge {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
   gap: 6px;
 }

 .popup-quickadd .main-product-quickadd .quickadd-variant-color {
   margin-bottom: 24px;
 }

 .popup-quickadd .main-product-quickadd .variant-label {
   margin-bottom: 12px;
   font-family: "DM Sans", sans-serif;
 }

 .popup-quickadd .main-product-quickadd .variant-value {
   font-weight: 600;
   text-transform: capitalize;
 }

 .popup-quickadd .main-product-quickadd .list-size {
   display: flex;
   flex-wrap: wrap;
   gap: 12px;
 }

 .popup-quickadd .main-product-quickadd .size-btn {
   width: 38px;
   height: 38px;
   border-radius: 50%;
   background-color: var(--white);
   border: 1px solid var(--line);
   font-weight: 500;
   font-size: 16px;
   line-height: 120%;
   color: var(--dark);
   padding: 12px;
 }

 .popup-quickadd .main-product-quickadd .size-btn.active {
   border: 1px solid var(--dark);
 }

 .popup-quickadd .main-product-quickadd .item-product-variant {
   margin-bottom: 24px;
 }

 .main-product-quickadd .item-product-quantity {
   margin-bottom: 32px;
 }

 .main-product-quickadd .item-product-quantity .label {
   font-family: "DM Sans", sans-serif;
   margin-bottom: 10px;
 }

 .main-product-quickadd .wg-quantity {
   display: inline-flex;
 }

 .main-product-quickadd .item-product-group-btn {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
   row-gap: 15px;
   column-gap: 12px;
   margin-bottom: 32px;
 }

 .main-product-quickadd .item-product-group-btn .atc {
   flex-grow: 1;
 }

 .main-product-quickadd .item-product-group-btn .box-icon {
   border: 1px solid var(--line);
   font-size: 14px;
   width: 42px;
   height: 42px;
   padding: 12px;
 }

 .main-product-quickadd .payment-link {
   font-size: 14px;
   line-height: 120%;
   color: var(--text);
   font-weight: 400;
   display: flex;
   justify-content: center;
   margin: auto;
 }

 .main-product-quickadd .payment-link::after {
   background-color: var(--text);
 }

 .modal-quick-view .modal-dialog {
   max-width: 1130px;
 }

 .modal-quick-view .modal-content {
   border-radius: 16px;
 }

 .modal-quick-view .tf-product-media-wrap {
   padding: 0;
 }

 .modal-quick-view .tf-product-media-wrap .item {
   width: 100%;
   height: 100%;
 }

 .modal-quick-view .tf-product-media-wrap .item img {
   width: 100%;
   height: 100%;
   max-height: 650px;
   object-fit: cover;
 }

 .modal-quick-view .tf-product-info-wrap {
   flex: 0 0 auto;
   max-width: 100%;
   flex-grow: 1;
   position: relative;
   margin: 0;
 }

 .modal-quick-view .tf-product-info-wrap .tf-product-info-inner {
   padding: 15px;
 }

 .modal-quick-view .tf-product-info-wrap .tf-product-info-inner::-webkit-scrollbar {
   width: 6px;
 }

 .modal-quick-view .tf-product-info-wrap .tf-product-info-inner::-webkit-scrollbar-thumb {
   background: var(--primary);
 }

 .modal-quick-view .tf-product-info-wrap .tf-product-info-inner::-webkit-scrollbar-track {
   background: var(--line);
 }

 .modal-quick-view .tf-product-info-wrap .tf-product-heading {
   padding-bottom: 0;
   border: 0;
   margin-bottom: 20px;
 }

 .modal-quick-view .tf-product-info-wrap .tf-product-heading .product-name {
   line-height: 29px;
   margin-bottom: 14px;
 }

 .modal-quick-view .tf-product-info-wrap .tf-product-heading .product-price {
   margin-bottom: 14px;
   gap: 6px;
 }

 .modal-quick-view .tf-product-info-wrap .tf-product-heading .product-price .price-old,
 .modal-quick-view .tf-product-info-wrap .tf-product-heading .product-price .price-new {
   line-height: 29px;
 }

 .modal-quick-view .tf-product-info-wrap .tf-product-heading .text {
   font-size: 14px;
   line-height: 22.4px;
 }

 .modal-quick-view .tf-product-info-wrap .tf-product-variant {
   gap: 20px;
   margin-bottom: 30px;
 }

 .modal-quick-view .tf-product-info-wrap .tf-product-variant .variant-picker-label {
   font-family: "DM Sans";
   font-size: 16px;
   font-weight: 700;
   line-height: 19.2px;
   letter-spacing: -0.03em;
   margin-bottom: 12px;
 }

 .modal-quick-view .tf-product-info-wrap .tf-product-variant .variant-picker-label-value {
   font-weight: 700;
 }

 .modal-quick-view .tf-product-info-wrap .tf-product-variant .variant-color .color-btn {
   width: 34px;
   height: 34px;
   padding: 2px;
 }

 .modal-quick-view .tf-product-info-wrap .tf-product-variant .variant-color .color-btn .check-color {
   width: 28px;
   height: 28px;
 }

 .modal-quick-view .tf-product-info-wrap .tf-btn {
   font-family: "DM Sans", sans-serif;
   font-size: 16px;
   font-weight: 700;
   line-height: 24px;
   letter-spacing: -0.03em;
 }

 .modal-quick-view .tf-product-info-wrap .tf-product-total-quantity {
   margin-bottom: 30px;
 }

 .modal-quick-view .tf-product-info-wrap .tf-product-total-quantity .group-btn {
   margin-bottom: 17px;
 }

 .modal-quick-view .tf-product-info-wrap .tf-product-total-quantity .more-choose-payment {
   margin-top: 7px;
 }

 .modal-quick-view .tf-product-info-wrap .view-details {
   display: inline-flex;
   gap: 4px;
   align-items: center;
   font-size: 14px;
   font-weight: 500;
   line-height: 16.8px;
 }

 .modal-quick-view .tf-product-info-wrap .view-details .icon {
   font-size: 12px;
 }

 .modal-find-size .modal-dialog {
   max-width: 780px;
 }

 .modal-find-size .modal-dialog .modal-content {
   padding: 24px 15px;
 }

 .modal-find-size .header {
   display: flex;
   justify-content: space-between;
   padding-bottom: 10px;
   border-bottom: 1px solid rgba(161, 161, 161, 0.2);
   margin-bottom: 30px;
 }

 .modal-find-size .header .heading {
   font-size: 20px;
   font-weight: 500;
   line-height: 24px;
 }

 .modal-find-size .header span {
   font-size: 16px;
 }

 .modal-find-size .title {
   font-size: 16px;
   font-weight: 500;
   line-height: 19.2px;
   margin-bottom: 24px;
 }

 .modal-find-size .tf-sizeguide-table {
   border: 1px solid var(--line);
   border-radius: 5px;
   width: 100%;
   margin-bottom: 24px;
 }

 .modal-find-size .tf-sizeguide-table th {
   border: 1px solid var(--line);
   padding: 10px;
   font-weight: 500;
   line-height: 17px;
 }

 .modal-find-size .tf-sizeguide-table td {
   border: 1px solid var(--line);
   border-width: 0 1px 1px 0;
   padding: 10px;
   line-height: 17px;
 }

 .modal-find-size .tf-page-size-chart-content ul {
   display: flex;
   flex-direction: column;
   gap: 15px;
   margin-bottom: 15px;
 }

 .modal-find-size .tf-page-size-chart-content ul .text {
   font-size: 14px;
   font-weight: 500;
   line-height: 16.8px;
 }

 .popup-pickup-available .pickup-available-list {
   display: flex;
   flex-direction: column;
   gap: 24px;
 }

 .popup-pickup-available .pickup-available-item .title {
   margin-bottom: 8px;
 }

 .popup-pickup-available .pickup-available-item .desc {
   margin-bottom: 12px;
 }

 .popup-pickup-available .pickup-available-item ul {
   display: flex;
   flex-direction: column;
   gap: 4px;
   margin-bottom: 12px;
 }

 .popup-pickup-available .pickup-available-item a {
   display: flex;
   align-items: center;
   gap: 8px;
 }

 .popup-pickup-available .pickup-available-item a .icon {
   font-size: 10px;
 }

 .modal-before-you-leave .modal-content {
   max-width: 485px;
 }

 .modal-before-you-leave .modal-inner {
   position: relative;
   flex-grow: 1;
   display: flex;
   flex-direction: column;
 }

 .modal-before-you-leave .modal-inner .icon-close {
   font-size: 16px;
   position: absolute;
   top: 20px;
   right: 20px;
 }

 .modal-before-you-leave .image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .modal-before-you-leave .content {
   margin: 0 32px;
   padding: 32px 0;
   border-bottom: 1px solid var(--line);
   margin-bottom: 32px;
 }

 .modal-before-you-leave .content>.heading {
   margin-bottom: 24px;
 }

 .modal-before-you-leave .content>p {
   font-size: 16px;
   font-weight: 400;
   line-height: 19.2px;
   margin-bottom: 10px;
 }

 .modal-before-you-leave .content>p span {
   font-size: 24px;
   font-weight: 500;
   line-height: 28.8px;
 }

 .modal-before-you-leave .content .wrap-code {
   margin-bottom: 24px;
 }

 .modal-before-you-leave .tf-mini-cart-sroll {
   padding: 0 32px 32px;
 }

 .modal-before-you-leave .tf-mini-cart-sroll .tf-minicart-recommendations-title {
   margin-bottom: 18px;
 }

 .wrap-code {
   display: flex;
 }

 .wrap-code .text {
   font-size: 14px;
   font-weight: 400;
   line-height: 16.8px;
   place-content: center;
 }

 .wrap-code .coppyText {
   font-size: 16px;
   font-weight: 500;
   line-height: 19.2px;
   color: var(--primary);
   margin-left: 4px;
 }

 .wrap-code .btn-coppy-text {
   font-size: 12px;
   color: #868686;
   cursor: pointer;
   transition: all 0.3s ease-in-out;
   margin-left: 4px;
 }

 .wrap-code .btn-coppy-text:hover {
   color: var(--primary) !important;
 }

 .wrap-code.style-1 {
   border-radius: 6px;
   border: 1px solid var(--line);
   padding: 14px 11px;
   display: block;
   position: relative;
   padding-right: 112px;
 }

 .wrap-code.style-1 .coppyText {
   font-size: 14px;
   font-weight: 400;
   line-height: 20px;
   color: #667085;
   margin: 0;
   overflow-x: auto;
 }

 .wrap-code.style-1 .coppyText::-webkit-scrollbar {
   height: 0;
 }

 .wrap-code.style-1 .coppyText::-webkit-scrollbar-thumb {
   background: var(--primary);
 }

 .wrap-code.style-1 .coppyText::-webkit-scrollbar-track {
   background: var(--line);
 }

 .wrap-code.style-1 .btn-coppy-text {
   position: absolute;
   top: 3px;
   right: 3px;
   bottom: 3px;
   border-radius: 3px;
   cursor: pointer;
   padding: 12px 33.5px;
   font-size: 14px;
   font-weight: 500;
   line-height: 20px;
   color: var(--white);
 }

 .popup-style-1 {
   width: 100% !important;
   max-width: 340px;
 }

 .popup-style-1 .modal-content {
   cursor: default;
   max-width: 520px;
 }

 .popup-style-1 .popup-header {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 32px;
   padding-bottom: 10px;
   position: relative;
   text-transform: capitalize;
   font-size: 20px;
   line-height: 30px;
   font-weight: 500;
   color: var(--dark);
   border-bottom: 0;
   border-radius: 0;
 }

 .popup-style-1 .popup-header::after {
   position: absolute;
   content: "";
   bottom: 0;
   height: 1px;
   background-color: var(--line);
   left: 32px;
   right: 32px;
 }

 .popup-style-1 .popup-inner {
   display: flex;
   flex-direction: column;
   gap: 32px;
   padding: 32px;
   overflow-y: auto;
 }

 .form-login {
   display: flex;
   flex-direction: column;
   gap: 32px;
 }

 .form-login .text {
   margin-bottom: 24px;
 }

 .form-login .button-wrap {
   display: flex;
   gap: 10px;
 }

 .form-login .bot a {
   text-decoration: underline;
 }

 .form-login .bot a:hover {
   color: var(--primary) !important;
 }

 .popup-login {
   width: 100%;
 }

 .popup-login .other-login p {
   margin-bottom: 24px;
 }

 .popup-login .other-login a {
   padding: 14px;
   position: relative;
   text-align: center;
   background-color: #3b5998;
   border-radius: 99px;
   color: var(--white);
 }

 .popup-login .other-login a .icon {
   position: absolute;
   left: 16px;
   top: 50%;
   transform: translateY(-50%);
 }

 .modal-dialog-centered .icon-close {
   position: absolute;
   top: 0px;
   right: 0px;
   font-size: 14px;
   padding: 15px;
   z-index: 123;
 }

 .modal-newsletter .modal-dialog {
   max-width: 674px;
 }

 .modal-newsletter .modal-content {
   border-radius: 16px;
 }

 .modal-newsletter .form-newsletter input {
   background-color: transparent;
 }

 .modal-newsletter .modal-top img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .modal-newsletter .modal-bottom {
   padding: 32px;
   max-width: 448px;
   margin: 0 auto;
 }

 .modal-newsletter .modal-bottom .title {
   margin-bottom: 10px;
 }

 .modal-newsletter .modal-bottom .text {
   margin-bottom: 32px;
 }

 .modal-newsletter .modal-bottom .form-newsletter,
 .modal-newsletter .modal-bottom .tf-social-icon {
   margin-bottom: 20px;
 }

 .modal-newsletter.style-absolute .modal-dialog {
   max-width: 1030px;
 }

 .modal-newsletter.style-absolute .modal-bottom {
   position: absolute;
   max-width: 450px;
   width: 100%;
   padding: 15px;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
 }

 .modal-newsletter.style-row .modal-dialog {
   max-width: 1030px;
 }

 .modal-newsletter.style-row .modal-top {
   width: 44.8%;
   flex-shrink: 0;
 }

 .modal-newsletter.style-row .modal-bottom {
   width: 55.2%;
   max-width: unset;
   place-content: center;
 }

 .modal-newsletter.style-row .modal-content {
   border-radius: 20px;
 }

 .modal-newsletter .form-newsletter fieldset input {
   padding-left: 66px;
 }

 .modal-newsletter .form-newsletter fieldset .icon {
   position: absolute;
   left: 20px;
   top: 50%;
   transform: translateY(-50%);
   font-size: 17px;
 }

 .popup-search .header {
   position: fixed;
   padding: 8px 15px;
   display: flex;
   justify-content: flex-end;
   z-index: 50;
   top: 0;
   left: 0;
   right: 0;
   background-color: var(--white);
 }

 .popup-search .modal-content {
   overflow-y: auto;
   padding: 68px 0;
   height: 100%;
   border-radius: 0;
 }

 .popup-search .looking-for-wrap {
   text-align: center;
   margin-bottom: 50px;
 }

 .popup-search .heading {
   font-size: 32px;
   font-weight: 500;
   line-height: 38.4px;
   margin-bottom: 42px;
 }

 .popup-search .form-search {
   margin-bottom: 32px;
 }

 .popup-search .form-search input {
   border-radius: 99px;
   font-size: 16px;
   line-height: 120%;
 }

 .popup-search .form-search input::placeholder {
   color: #000000;
 }

 .popup-search .form-search button {
   right: 20px;
 }

 .popup-search .popular-searches {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
   gap: 20px;
   font-size: 16px;
   line-height: 120%;
 }

 .popup-search .popular-searches ul {
   display: flex;
   align-items: center;
   gap: 10px;
   flex-wrap: wrap;
 }

 .popup-search .popular-searches ul a {
   padding: 9px 19px;
   border-radius: 10px;
   background-color: #f9f9f9;
   border: 1px solid rgba(161, 161, 161, 0.2);
 }

 .popup-search .featured-product .featured-product-heading {
   margin-bottom: 30px;
 }

 .popup-search.type-search-product .top-title {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding-bottom: 10px;
   border-bottom: 1px solid rgba(161, 161, 161, 0.2);
   margin-bottom: 42px;
 }

 .popup-search.type-search-product .top-title .title {
   font-size: 20px;
   font-weight: 500;
   line-height: 32px;
 }

 .popup-search.type-search-product .top-title a {
   font-size: 14px;
   font-weight: 500;
   line-height: 22.4px;
   text-decoration-line: underline;
 }

 .popup-search.type-search-product .wrapper-shop {
   row-gap: 42px;
 }

 .popup-search.type-search-product .list-articals {
   display: flex;
   flex-direction: column;
   gap: 20px;
 }

 .popup-search.type-search-product .list-articals .item {
   display: flex;
   gap: 11px;
 }

 .popup-search.type-search-product .list-articals .item .img-box {
   border-radius: 8px;
   overflow: hidden;
   width: 128px;
   height: 128px;
   flex-shrink: 0;
 }

 .popup-search.type-search-product .list-articals .item .content {
   display: flex;
   flex-direction: column;
   gap: 6px;
 }

 .popup-search.type-search-product .list-articals .item .title {
   font-size: 16px;
   font-weight: 500;
   line-height: 25.6px;
 }

 .popup-search.type-search-product .list-articals .item .date-post {
   font-size: 14px;
   line-height: 16.8px;
 }

 .modal-compare .modal-dialog {
   max-width: 1194px;
 }

 .modal-compare .modal-content {
   border-radius: 16px;
   padding: 48px 30px 29px 30px;
 }

 .modal-compare .title {
   line-height: 29px;
   margin-bottom: 45px;
 }

 .modal-compare .tf-compare-inner {
   overflow-x: auto;
   margin-bottom: 22px;
   padding-bottom: 20px;
 }

 .modal-compare .tf-compare-inner::-webkit-scrollbar {
   height: 8px;
 }

 .modal-compare .tf-compare-inner::-webkit-scrollbar-thumb {
   background: var(--primary);
 }

 .modal-compare .tf-compare-inner::-webkit-scrollbar-track {
   background: var(--line);
 }

 .modal-compare .tf-compare-list {
   display: flex;
   gap: 24px;
   width: max-content;
   margin-left: auto;
   margin-right: auto;
 }

 .modal-compare .tf-compare-item {
   width: 232px;
   min-width: 232px;
   position: relative;
   display: flex;
   flex-direction: column;
   gap: 10px;
   padding: 0;
 }

 .modal-compare .tf-compare-item .icon-close {
   position: absolute;
   z-index: 5;
   top: 12px;
   right: 12px;
   width: 48px;
   height: 48px;
   font-size: 12px;
   border: 1px solid var(--line);
   background-color: var(--white);
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
 }

 .modal-compare .tf-compare-item .image {
   border-radius: 16px;
   max-height: 328px;
   overflow: hidden;
 }

 .modal-compare .tf-compare-item .content {
   display: flex;
   flex-direction: column;
   gap: 10px;
 }

 .modal-compare .tf-compare-item .content .text-title {
   font-size: 16px;
   font-weight: 500;
   line-height: 26px;
 }

 .modal-compare .tf-compare-item .content .price-wrap {
   font-weight: 500;
   font-size: 16px;
 }

 .modal-compare .tf-compare-buttons {
   display: flex;
   gap: 20px;
 }

 .modal-compare .tf-compare-buttons .tf-btn {
   font-family: "DM Sans", sans-serif;
   max-width: 190px;
   width: 100%;
   font-weight: 600;
 }

 .modal-share-social .wrap-code {
   margin-bottom: 32px;
 }

 .popup-style-2 .modal-dialog {
   max-width: 596px;
 }

 .popup-style-2 .modal-content {
   padding: 32px 32px 41px;
 }

 .popup-style-2 .modal-header {
   margin-bottom: 32px;
   padding: 0;
   padding-bottom: 10px;
 }

 .popup-style-2 .modal-header .icon-close {
   font-size: 16px;
 }

 .modal-order-detail .modal-dialog {
   max-width: 1226px;
 }

 .modal-order-detail .modal-dialog .modal-content {
   padding: 24px 15px;
 }

 .modal-order-detail .header {
   display: flex;
   justify-content: space-between;
   padding-bottom: 10px;
   border-bottom: 1px solid rgba(161, 161, 161, 0.2);
   margin-bottom: 30px;
 }

 .modal-order-detail .header .heading {
   font-size: 20px;
   font-weight: 500;
   line-height: 24px;
 }

 .modal-order-detail .header .icon-close {
   position: unset;
   display: flex;
   align-items: center;
   font-size: 16px;
   padding: 0px 15px;
 }

 .modal-order-detail .list-infor {
   display: flex;
   gap: 15px 24px;
   justify-content: center;
   align-items: center;
   flex-wrap: wrap;
   margin-bottom: 44px;
 }

 .modal-order-detail .list-infor li {
   font-size: 16px;
   font-weight: 400;
   line-height: 19px;
 }

 .modal-order-detail .list-infor li:not(:last-child) {
   position: relative;
   padding-right: 24px;
 }

 .modal-order-detail .list-infor li:not(:last-child)::after {
   content: "";
   position: absolute;
   display: block;
   right: 0px;
   top: 1.5px;
   bottom: 1.5px;
   width: 1px;
   height: 100%;
   background-color: var(--line);
 }

 .modal-order-detail table {
   margin-bottom: 42px;
   text-align: center;
 }

 .modal-order-detail table td,
 .modal-order-detail table th {
   font-size: 16px;
   font-weight: 500;
   line-height: 19px;
 }

 .modal-order-detail table thead,
 .modal-order-detail table th {
   padding: 15px 0px;
 }

 .modal-order-detail table thead tr {
   border-top: 1px solid var(--line);
   border-bottom: 1px solid var(--line);
 }

 .modal-order-detail table tbody {
   overflow: auto;
 }

 .modal-order-detail table tbody::-webkit-scrollbar {
   width: 3px;
   height: 3px;
 }

 .modal-order-detail table tbody::-webkit-scrollbar-thumb {
   background: var(--surface);
   border-radius: 999px;
 }

 .modal-order-detail table tbody tr:not(:last-child) {
   border-bottom: 1px solid var(--line);
 }

 .modal-order-detail table td:first-child,
 .modal-order-detail table th:first-child {
   text-align: start;
 }

 .modal-order-detail table .infor-content {
   display: flex;
   gap: 10px;
   align-items: center;
   padding: 30px 0;
 }

 .modal-order-detail table .infor-content .image {
   width: 98px;
   height: 130px;
   border-radius: 4px;
   overflow: hidden;
 }

 .modal-order-detail table .infor-content .image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .modal-order-detail table .infor-content .size {
   font-size: 12px;
   font-weight: 400;
   line-height: 14px;
   color: rgba(0, 0, 0, 0.6);
   margin-top: 10px;
 }

 .modal-order-detail table .subtotal-text,
 .modal-order-detail table .subtotal-price {
   padding: 30px 15px;
 }

 .modal-order-detail .tb-order-detail {
   margin-bottom: 42px;
 }

 .modal-order-detail .tb-order-detail .title {
   padding: 15px 0px;
 }

 .modal-order-detail .tb-order-detail .item {
   font-size: 16px;
   font-weight: 500;
   line-height: 19px;
   width: 225px;
   text-align: center;
 }

 .modal-order-detail .tb-order-detail .item:first-child {
   width: unset;
   text-align: start;
   flex-grow: 1;
 }

 .modal-order-detail .tb-order-detail .top {
   border-top: 1px solid var(--line);
   border-bottom: 1px solid var(--line);
   display: flex;
   align-items: center;
   justify-content: space-between;
 }

 .modal-order-detail .tb-order-detail .order-detail-item {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 30px 0;
 }

 .modal-order-detail .tb-order-detail .order-detail-item:not(:last-child) {
   border-bottom: 1px solid var(--line);
 }

 .modal-order-detail .tb-order-detail .tb-content {
   overflow: auto;
   height: 461px;
 }

 .modal-order-detail .tb-order-detail .tb-content::-webkit-scrollbar {
   width: 5px;
   height: 5px;
 }

 .modal-order-detail .tb-order-detail .tb-content::-webkit-scrollbar-thumb {
   background: #b4b4b4;
   border-radius: 999px;
 }

 .modal-order-detail .tb-order-detail .tb-content .subtotal {
   position: sticky;
   bottom: 0;
   background-color: var(--white);
   padding: 0;
 }

 .modal-order-detail .tb-order-detail .infor-content {
   display: flex;
   gap: 10px;
   align-items: center;
 }

 .modal-order-detail .tb-order-detail .infor-content .image {
   width: 98px;
   height: 130px;
   border-radius: 4px;
   overflow: hidden;
 }

 .modal-order-detail .tb-order-detail .infor-content .image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .modal-order-detail .tb-order-detail .infor-content a {
   -webkit-line-clamp: 1;
   -webkit-box-orient: vertical;
   display: -webkit-box;
   overflow: hidden;
 }

 .modal-order-detail .tb-order-detail .infor-content .size {
   font-size: 12px;
   font-weight: 400;
   line-height: 14px;
   color: rgba(0, 0, 0, 0.6);
   margin-top: 10px;
 }

 .modal-order-detail .tb-order-detail .subtotal-text,
 .modal-order-detail .tb-order-detail .subtotal-price {
   padding: 30px 15px;
 }

 .modal-order-detail .bottom {
   font-size: 16px;
   line-height: 19px;
 }

 .cookie-banner {
   position: fixed;
   bottom: 20px;
   left: 20px;
   border-radius: 20px;
   right: 20px;
   max-width: 368px;
   background-color: var(--dark);
   z-index: 1000;
 }

 .cookie-banner .overplay {
   position: fixed;
   inset: 0;
   background-color: rgba(0, 0, 0, 0.4);
 }

 .cookie-banner .content {
   position: relative;
   padding: 20px;
 }

 .cookie-banner p {
   margin-bottom: 20px;
   color: var(--white);
 }

 .cookie-banner .button-group {
   display: flex;
   gap: 10px;
   align-items: center;
 }

 .cookie-banner .button-group .tf-btn {
   font-size: 14px;
   font-weight: 500;
   line-height: 24px;
   width: 100%;
   padding: 7px 7px;
 }

 .tf-toolbar-bottom {
   display: none;
   padding: 11px 15px 12px;
   position: fixed;
   z-index: 200;
   bottom: 0;
   right: 0;
   left: 0;
   border-top: 1px solid #eeeeee;
   background-color: var(--white);
   box-shadow: 0px 4px 20px 0px rgba(163, 163, 163, 0.2784313725);
 }

 .tf-toolbar-bottom .toolbar-item {
   flex: 1 0 20%;
   position: relative;
 }

 .tf-toolbar-bottom .toolbar-item a {
   width: 100%;
   padding-right: 10px;
   padding-left: 10px;
   gap: 5px;
   display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: column;
 }

 .tf-toolbar-bottom .toolbar-item a .toolbar-icon {
   width: 20px;
   height: 20px;
   position: relative;
 }

 .tf-toolbar-bottom .toolbar-item a .toolbar-count {
   position: absolute;
   top: -6px;
   right: -6px;
   width: 16px;
   height: 16px;
   display: flex;
   align-items: center;
   justify-content: center;
   background-color: var(--primary);
   border-radius: 50%;
   font-size: 10px;
   font-weight: 500;
   line-height: 15px;
   color: var(--white);
 }

 .tf-toolbar-bottom .toolbar-item a .toolbar-label {
   font-size: 13px;
   font-weight: 500;
   line-height: 18px;
 }

 .popup-product .modal-dialog {
   max-width: 1243px;
 }

 .popup-product .modal-content {
   padding: 24px 15px 32px;
 }

 .popup-product .modal-header {
   flex-direction: column;
   gap: 8px;
   justify-content: center;
   padding: 0;
   border: 0;
   margin-bottom: 40px;
 }

 .popup-product .modal-header .countdown__timer {
   display: flex;
   gap: 6px;
   align-items: center;
   font-size: 18px;
   line-height: 26px;
   font-weight: 500;
 }

 .popup-product .modal-header .countdown__timer .countdown__value {
   color: var(--primary);
   margin-right: 6px;
 }

 .popup-product .modal-header .countdown__timer .countdown__item:first-child {
   display: none;
 }

 .popup-product .modal-body {
   padding: 0;
 }

 .popup-product .box-hurry-up {
   display: flex;
   gap: 8px;
   align-items: center;
 }

 .popup-product .tf-swiper .sw-dot-default {
   margin-top: 5px;
 }

 /*------------ box icon ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .box-icon {
   display: flex;
   align-items: center;
   justify-content: center;
   transition: all 0.3s ease-in-out;
   cursor: pointer;
 }

 .box-icon .icon-cart2 {
   margin-top: -2px;
 }

 .tf-social-icon {
   --facebook-cl: rgb(59, 89, 152);
   --twitter-cl: rgb(85, 85, 85);
   --instagram-cl: linear-gradient(#8a3ab9, #e95950, #fccc63);
   --threads-cl: rgb(224, 53, 102);
   --youtube-cl: rgb(205, 32, 31);
   --tiktok-cl: linear-gradient(#25f4ee, #000, #fe2c55);
   --tiktok-cl2: rgb(254, 44, 85);
   --pinterest-cl: rgb(203, 32, 39);
   --tumblr-cl: rgb(55, 69, 92);
   --vimeo-cl: rgb(26, 183, 234);
   --snapchat-cl: rgb(255, 221, 0);
   --whatsapp-cl: rgb(0, 230, 118);
   --linked_in-cl: rgb(23, 106, 255);
   --wechat-cl: rgb(26, 173, 24);
   --reddit-cl: rgb(255, 69, 0);
   --line-cl: rgb(0, 195, 77);
   --spotify-cl: rgb(30, 125, 96);
   display: flex;
   gap: 8px;
   flex-wrap: wrap;
 }

 .tf-social-icon .social-item {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 28px;
   height: 28px;
   font-size: 12px;
   color: var(--dark);
   border: 1px solid var(--dark);
   color: var(--dark);
   border-radius: 50%;
   background-color: var(--white);
   transition: all 0.3s ease-in-out;
 }

 .tf-social-icon .social-facebook:hover {
   background-color: transparent;
   color: var(--facebook-cl);
   border-color: var(--facebook-cl);
 }

 .tf-social-icon .social-instagram:hover {
   background-color: transparent;
   color: var(--threads-cl);
   border-color: var(--threads-cl);
 }

 .tf-social-icon .social-x {
   font-size: 10px;
 }

 .tf-social-icon .social-x:hover {
   background-color: transparent;
   color: var(--twitter-cl);
   border-color: var(--twitter-cl);
 }

 .tf-social-icon .social-snapchat:hover {
   background-color: transparent;
   color: var(--snapchat-cl);
   border-color: var(--snapchat-cl);
 }

 .tf-social-icon .social-youtube:hover {
   background-color: transparent;
   color: var(--youtube-cl);
   border-color: var(--youtube-cl);
 }

 .tf-social-icon .social-linkedin:hover {
   background-color: transparent;
   color: var(--linked_in-cl);
   border-color: var(--linked_in-cl);
 }

 .tf-social-icon.style-fill .social-item {
   background-color: var(--line);
   border: none;
 }

 .tf-social-icon.style-fill .social-facebook:hover {
   background: var(--facebook-cl);
   color: var(--white);
   border: none;
 }

 .tf-social-icon.style-fill .social-x:hover {
   background: var(--twitter-cl);
   color: var(--white);
   border: none;
 }

 .tf-social-icon.style-fill .social-instagram:hover {
   background: var(--instagram-cl);
   color: var(--white);
   border: none;
 }

 .tf-social-icon.style-fill .social-tiktok:hover {
   background: var(--tiktok-cl);
   color: var(--white);
   border: none;
 }

 .tf-social-icon.style-fill .social-pinterest:hover {
   background: var(--pinterest-cl);
   color: var(--white);
   border: none;
 }

 .tf-social-icon.style-fill .social-amazon:hover {
   background: var(--dark);
   color: var(--white);
   border: none;
 }

 .tf-social-icon.style-fill .social-youtube:hover {
   background: var(--youtube-cl);
   color: var(--white);
   border: none;
 }

 .tf-social-icon.style-fill .social-linkedin {
   background: var(--linked_in-cl);
   color: var(--white);
   border: none;
 }

 .tf-social-icon.style-large {
   gap: 15px;
 }

 .tf-social-icon.style-large .social-item {
   width: 38px;
   height: 38px;
   border-color: var(--line);
   font-size: 16px;
   color: #383d38;
 }

 .tf-social-icon.style-large .social-facebook {
   font-size: 18px;
 }

 .tf-social-icon.style-large .social-facebook:hover {
   background: var(--facebook-cl);
   color: var(--white);
   border: transparent;
 }

 .tf-social-icon.style-large .social-x:hover {
   background: var(--twitter-cl);
   color: var(--white);
   border: transparent;
 }

 .tf-social-icon.style-large .social-instagram:hover {
   background: var(--instagram-cl);
   color: var(--white);
   border: transparent;
 }

 .tf-social-icon.style-large .social-snapchat:hover {
   background-color: var(--snapchat-cl);
   color: var(--white);
   border: transparent;
 }

 .tf-social-icon.style-large .social-linkedin:hover {
   background: var(--linked_in-cl);
   color: var(--white);
   border: transparent;
 }

 .tf-social-icon.style-large.style-2 a {
   border: 1px solid var(--line);
   width: 52px;
   height: 52px;
   font-size: 22px;
 }

 .tf-social-icon.style-default {
   gap: 20px;
 }

 .tf-social-icon.style-default a {
   display: flex;
   font-size: 16px;
 }

 .tf-social-icon.style-1 a {
   border: 2px solid #cacaca;
   width: 48px;
   height: 48px;
   font-size: 18px;
 }

 .tf-social-icon.style-white li a {
   width: 47px;
   height: 47px;
   border: 0;
   font-size: 12px;
   background-color: var(--white) !important;
   color: #1F1F1F;
 }

 .tf-social-icon.style-white li a:hover {
   color: var(--white);
   background-color: #1F1F1F !important;
 }

 .tf-icon-box {
   display: flex;
   flex-direction: column;
   gap: 20px;
   align-items: center;
   text-align: center;
   padding: 20px;
   border: 1px solid var(--line);
   border-radius: 8px;
 }

 .tf-icon-box .icon {
   font-size: 28px;
 }

 .tf-icon-box .content {
   display: grid;
   gap: 8px;
 }

 .tf-icon-box .content .title {
   font-weight: 500;
   font-size: 16px;
   line-height: 16px;
 }

 .tf-icon-box .content .desc {
   font-size: 15px;
   line-height: 24px;
   color: var(--text);
 }

 .tf-icon-box.style-2 {
   padding: 0;
   border: 0;
 }

 .tf-icon-box.style-2 .box-icon {
   width: 64px;
   height: 64px;
   border: 1px solid var(--line);
   border-radius: 50%;
 }

 .tf-icon-box.style-2 .title {
   font-size: 18px;
   line-height: 18px;
 }

 .tf-icon-box.style-3 {
   padding: 0;
   border: 0;
   flex-direction: row;
   text-align: left;
 }

 .tf-icon-box.style-3 .title {
   font-size: 18px;
   line-height: 18px;
 }

 .tf-icon-box.style-3 .box-icon {
   width: 64px;
   height: 64px;
   border: 1px solid var(--line);
   border-radius: 50%;
   flex-shrink: 0;
 }

 .tf-icon-box.style-3 .content {
   gap: 12px;
 }

 .tf-icon-box.style-4 {
   padding: 24px;
   border: 0;
 }

 .tf-icon-box.style-4 .title {
   font-size: 18px;
   line-height: 18px;
 }

 .tf-icon-box.style-4 .content {
   gap: 12px;
 }

 .tf-icon-box.style-border .box-icon {
   width: 74px;
   height: 74px;
   border: 1px solid var(--line);
   border-radius: 50%;
 }

 .tf-icon-box.style-lg {
   border-radius: 16px;
 }

 .tf-icon-box.style-lg .title {
   font-size: 18px;
   line-height: 18px;
 }

 .tf-icon-box.w56 .box-icon {
   width: 56px;
   height: 56px;
 }

 .tf-icon-box.w56 .box-icon .icon {
   font-size: 22px;
 }

 .tf-icon-box-v2 {
   display: flex;
   align-items: center;
   gap: 12px;
 }

 .tf-icon-box-v2 .icon {
   font-size: 24px;
   color: #ff8e8e;
 }

 .tf-icon-box-v2 .title {
   font-size: 16px;
   line-height: 20.8px;
   letter-spacing: -0.02em;
 }

 .flat-wrapper-iconbox {
   border: 1px solid #2a4528;
   border-radius: 20px;
   padding: 77px 30px 49px;
   position: relative;
 }

 .flat-wrapper-iconbox>.title {
   position: absolute;
   left: 50%;
   top: -8%;
   transform: translateX(-50%);
   padding: 0px 20px;
   z-index: 1;
   background-color: #fffcf6;
   text-align: center;
   text-wrap: nowrap;
 }

 .flat-wrapper-iconbox .tf-icon-box .box-icon {
   border: 1px solid #4D8036;
 }

 .flat-wrapper-iconbox .tf-icon-box .title {
   font-size: 20px;
   line-height: 26px;
 }

 /*------------ tabs ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .flat-animate-tab .tab-content {
   position: relative;
 }

 .flat-animate-tab .tab-pane {
   display: block;
   pointer-events: none;
   opacity: 0;
   visibility: hidden;
   position: absolute;
   z-index: 1;
   top: 0;
   left: 0;
   right: 0;
   transform: translateY(30px);
   transition-timing-function: ease-in;
   transition-duration: 0.2s;
 }

 .flat-animate-tab .tab-pane.active {
   pointer-events: auto;
   opacity: 1;
   visibility: visible;
   position: relative;
   z-index: 2;
   transform: none;
   transition-timing-function: ease-out;
   transition-duration: 0.3s;
   transition-delay: 0.3s;
 }

 .tab-vertical-product-desc {
   display: grid;
   grid-template-columns: 2fr 10fr;
   gap: 30px;
 }

 .tab-vertical-product-desc .menu-tab {
   border-left: 1px solid var(--line);
   height: max-content;
 }

 .tab-vertical-product-desc .tab-link {
   padding: 20px;
   font-weight: 500;
   font-size: 16px;
   line-height: 24px;
   display: block;
   position: relative;
 }

 .tab-vertical-product-desc .tab-link::after {
   position: absolute;
   content: "";
   background-color: var(--dark);
   transition: all 0.3s ease-in-out;
   top: 0;
   left: -1px;
   width: 1px;
   height: 0;
   top: 50%;
   transform: translateY(-50%);
 }

 .tab-vertical-product-desc .tab-link.active::after {
   height: 100%;
 }

 .tab-vertical-product-desc .tab-content {
   border-radius: 16px;
   border: 1px solid var(--line);
   overflow: hidden;
 }

 .tab-vertical-product-desc .wd-product-descriptions {
   padding: 30px 64px;
   height: 100%;
 }

 .tab-vertical-product-desc .wd-vertical-addInformation {
   padding-top: 65px;
   padding-bottom: 65px;
 }

 .tab-vertical-product-desc .wd-vertical-review {
   padding: 42px 40px;
 }

 .tab-product-desc {
   overflow: hidden;
   padding-bottom: 5px;
 }

 .tab-product-desc .menu-tab {
   border-bottom: 1px solid var(--line);
   display: flex;
   align-items: center;
   overflow: auto;
 }

 .tab-product-desc .tab-link {
   padding: 10px 15px;
   font-weight: 500;
   font-size: 16px;
   line-height: 24px;
   display: block;
   position: relative;
   text-align: center;
   white-space: nowrap;
 }

 .tab-product-desc .tab-link::after {
   position: absolute;
   content: "";
   bottom: 0;
   height: 1px;
   width: 0;
   left: 50%;
   transform: translateX(-50%);
   background-color: var(--dark);
   transition: all 0.3s ease-in-out;
 }

 .tab-product-desc .tab-link.active::after {
   width: 100%;
 }

 .tab-product-desc .tab-content {
   margin-top: 30px;
 }

 .flat-title-tab-categories {
   margin-bottom: 30px;
   display: grid;
   gap: 20px;
 }

 .flat-title-tab {
   margin-bottom: 32px;
   display: grid;
   gap: 20px;
 }

 .flat-title-tab .box-title {
   display: grid;
   gap: 10px;
 }

 .flat-title-tab .menu-tab-line .tab-link {
   color: rgba(0, 0, 0, 0.39);
 }

 .flat-title-tab-2 {
   margin-bottom: 32px;
 }

 .menu-tab-line {
   display: flex;
   gap: 20px;
   overflow-x: auto;
   overflow-y: hidden;
 }

 .menu-tab-line .tab-link {
   padding: 4px;
   font-weight: 500;
   font-size: 22px;
   line-height: 26px;
   color: var(--text);
   display: block;
   position: relative;
   white-space: nowrap;
 }

 .menu-tab-line .tab-link:hover,
 .menu-tab-line .tab-link.active {
   color: var(--primary);
 }

 .menu-tab-line .tab-link:hover::after,
 .menu-tab-line .tab-link.active::after {
   width: 100%;
 }

 .menu-tab-line .tab-link::after {
   position: absolute;
   content: "";
   bottom: 0;
   height: 1px;
   width: 0;
   left: 50%;
   transform: translateX(-50%);
   background-color: var(--primary);
   transition: all 0.3s ease-in-out;
 }

 .menu-tab-line.style-cl-main .tab-link {
   color: var(--dark);
 }

 .menu-tab-line.style-cl-main .tab-link:hover,
 .menu-tab-line.style-cl-main .tab-link.active {
   color: var(--primary);
 }

 .menu-tab-line.style-lg .tab-link {
   font-size: 24px;
   line-height: 27.2px;
 }

 .menu-tab-line.style-lg2 .tab-link {
   color: #727272;
   padding: 0 !important;
 }

 .menu-tab-line.style-lg2 .tab-link::after {
   background-color: #df3c01;
 }

 .menu-tab-line.style-lg2 .tab-link:hover,
 .menu-tab-line.style-lg2 .tab-link.active {
   color: #df3c01;
 }

 .menu-tab-line.style-md3 .tab-link,
 .menu-tab-line.style-md2 .tab-link {
   padding: 4px 0px;
   font-weight: 500;
 }

 .menu-tab-line.style2 .tab-link {
   color: var(--text);
   font-weight: 500;
 }

 .menu-tab-line.style2 .tab-link::after {
   content: none;
 }

 .menu-tab-line.style2 .tab-link:hover,
 .menu-tab-line.style2 .tab-link.active {
   color: var(--primary);
 }

 .menu-tab-line.type-active-1 {
   width: max-content;
   border-bottom: 1px solid rgba(37, 37, 37, 0.2);
 }

 .menu-tab-line.type-active-1 .tab-link {
   color: #252525;
 }

 .menu-tab-line.type-active-1 .tab-link::after {
   background-color: #bb8f60;
 }

 .menu-tab-line.type-active-1 .tab-link:hover,
 .menu-tab-line.type-active-1 .tab-link.active {
   color: #bb8f60;
 }

 .menu-tab-fill {
   display: flex;
   overflow-x: auto;
   overflow-y: hidden;
 }

 .menu-tab-fill .tab-link {
   padding: 10px 24px;
   min-width: 120px;
   font-weight: 500;
   color: var(--rgba-dark);
   border-radius: 33px;
 }

 .menu-tab-fill .tab-link.active {
   color: var(--white);
   background-color: #92a9ff;
 }

 .menu-tab-fill .item-slide-effect {
   background-color: #92a9ff;
 }

 .menu-tab-fill.style-primary .tab-link {
   min-width: 100%;
 }

 .menu-tab-fill.style-primary .tab-link.active {
   background-color: var(--primary);
 }

 .menu-tab-fill.style-primary .item-slide-effect {
   background-color: var(--primary);
 }

 .menu-tab-fill-lg {
   display: flex;
   overflow-x: auto;
   overflow-y: hidden;
   gap: 20px;
 }

 .menu-tab-fill-lg .tab-link {
   color: var(--text);
   white-space: nowrap;
   font-weight: 500;
 }

 .menu-tab-fill-lg .tab-link.active {
   color: var(--primary);
 }

 .item-slide-effect {
   position: absolute;
   height: 100%;
   z-index: -1;
   background-color: var(--primary);
   border-radius: 33px;
   transition: all 0.5s;
   left: 0%;
 }

 .tab-slide .menu-tab-fill {
   position: relative;
 }

 .flat-controltab-nav {
   position: relative;
 }

 .flat-controltab-nav .box-nav-swiper {
   position: absolute;
   right: 0;
   top: -90px;
   transform: none;
 }

 .menu-tab-btn {
   display: flex;
   gap: 12px;
   overflow-x: auto;
   overflow-y: hidden;
 }

 .menu-tab-btn .tab-link {
   padding: 10px 20px;
   color: var(--dark-5);
   border: 1px solid var(--line);
   border-radius: 30px;
   white-space: nowrap;
 }

 .menu-tab-btn .tab-link:hover,
 .menu-tab-btn .tab-link.active {
   color: var(--white);
   background-color: var(--dark-5);
   border-color: var(--dark-5);
 }

 /*------------ accordion ---------------- */
 .widget-accordion {
   border-bottom: 1px solid var(--line);
 }

 .widget-accordion .accordion-title {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 20px;
   padding: 20px 0px;
   font-weight: 500;
   font-size: 16px;
   line-height: 24px;
   cursor: pointer;
 }

 .widget-accordion .accordion-title .icon {
   font-size: 8px;
   transition: transform 0.35s linear;
 }

 .widget-accordion .accordion-title:not(.collapsed) .icon {
   transform: rotate(180deg);
 }

 .widget-accordion .accordion-body {
   padding: 10px 0px 20px;
 }

 .widget-accordion:first-child {
   border-top: 1px solid var(--line);
 }

 /*------------ header ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .tf-topbar {
   padding: 7px 0px;
   border-bottom: 1px solid var(--line);
 }

 .tf-topbar .marquee-wrapper {
   display: flex;
   animation: infiniteScroll 30s linear infinite;
   align-items: center;
   transition: animation-duration 300ms;
 }

 .tf-topbar .marquee-wrapper:hover {
   animation-play-state: paused;
 }

 .tf-topbar .marquee-wrapper .marquee-child-item {
   margin: 0 10px;
   display: flex;
   color: var(--dark);
 }

 .tf-topbar .marquee-wrapper .marquee-child-item p {
   font-size: 14px;
   line-height: 18px;
   font-family: "DM Sans", sans-serif;
 }

 .tf-topbar .marquee-wrapper .marquee-child-item .dot {
   width: 4px;
   height: 4px;
   border-radius: 50%;
   background-color: var(--dark);
 }

 .tf-topbar .marquee-wrapper .marquee-child-item.mx-20 {
   margin: 0 20px;
 }

 .tf-topbar .topbar-right {
   display: flex;
   justify-content: flex-end;
   align-items: center;
   gap: 16px;
 }

 

 .tf-topbar .mail {
   text-decoration: underline;
   font-weight: 600;
 }

 .tf-topbar .store {
   font-weight: 600;
 }

 .tf-topbar.topbar-md .topbar-left,
 .tf-topbar.topbar-md .topbar-right,
 .tf-topbar.topbar-md .marquee-child-item,
 .tf-topbar.topbar-md .mail,
 .tf-topbar.topbar-md .store {
   font-size: 12px;
   line-height: 131%;
 }

 .tf-topbar.topbar-bg {
   border: none;
 }

 .tf-topbar.topbar-bg .marquee-child-item {
   color: var(--white);
 }

 .tf-topbar.topbar-bg .marquee-child-item .dot {
   background-color: var(--white);
 }

 .tf-topbar.topbar-bg .tf-social-icon .social-item {
   background-color: transparent;
   border-color: var(--line);
   color: var(--white);
 }

 .tf-topbar.topbar-bg .tf-social-icon .social-item:hover {
   color: var(--primary);
   border-color: var(--primary);
 }

 .tf-topbar.topbar-bg .image-select .filter-option-inner-inner {
   color: var(--white-2);
 }

 .tf-topbar.topbar-bg .image-select>.dropdown-menu {
   margin-top: 12px !important;
   margin-bottom: 12px !important;
 }

 .tf-topbar.topbar-bg .image-select>.dropdown-toggle::after {
   color: var(--white-2);
 }

 .tf-topbar.topbar-bg .mail {
   color: var(--white);
 }

 .tf-topbar.topbar-bg .store {
   color: var(--white);
 }

 .tf-topbar.topbar-space .topbar-left,
 .tf-topbar.topbar-space .topbar-right {
   display: flex;
   gap: 30px;
 }

 .tf-topbar .overflow-hidden {
   position: relative;
 }

 .tf-topbar .overflow-hidden::before,
 .tf-topbar .overflow-hidden::after {
   content: "";
   position: absolute;
   top: 0;
   bottom: 0;
   width: 30px;
   z-index: 5;
   pointer-events: none;
 }

 .tf-topbar .overflow-hidden::before {
   left: 0;
   background: linear-gradient(to right, #ffffff, transparent);
 }

 .tf-topbar .overflow-hidden::after {
   right: 0;
   background: linear-gradient(to left, #ffffff, transparent);
 }

 .tf-topbar.bg-dark-5 .overflow-hidden::before {
   left: 0;
   background: linear-gradient(to right, #313030, transparent);
 }

 .tf-topbar.bg-dark-5 .overflow-hidden::after {
   right: 0;
   background: linear-gradient(to left, #313030, transparent);
 }

 .tf-topbar.bg-light-green .overflow-hidden::before {
   background: linear-gradient(to right, #7c8c47, transparent);
 }

 .tf-topbar.bg-light-green .overflow-hidden::after {
   background: linear-gradient(to left, #7c8c47, transparent);
 }

 .tf-topbar.bg-light-purple .overflow-hidden::before {
   background: linear-gradient(to right, #8f4a58, transparent);
 }

 .tf-topbar.bg-light-purple .overflow-hidden::after {
   background: linear-gradient(to left, #8f4a58, transparent);
 }

 .tf-topbar.bg-light-pink-2 .overflow-hidden::before {
   background: linear-gradient(to right, #d47b62, transparent);
 }

 .tf-topbar.bg-light-pink-2 .overflow-hidden::after {
   background: linear-gradient(to left, #d47b62, transparent);
 }

 .tf-topbar.bg-light-purple-2 .overflow-hidden::before {
   background: linear-gradient(to right, #a95354, transparent);
 }

 .tf-topbar.bg-light-purple-2 .overflow-hidden::after {
   background: linear-gradient(to left, #a95354, transparent);
 }

 .tf-topbar.bg-green .overflow-hidden::before {
   background: linear-gradient(to right, #3f7b25, transparent);
 }

 .tf-topbar.bg-green .overflow-hidden::after {
   background: linear-gradient(to left, #3f7b25, transparent);
 }

 .tf-topbar.bg-light-blue .overflow-hidden::before {
   background: linear-gradient(to right, #5192f4, transparent);
 }

 .tf-topbar.bg-light-blue .overflow-hidden::after {
   background: linear-gradient(to left, #5192f4, transparent);
 }

 .tf-topbar.bg-dark .overflow-hidden::before {
   background: linear-gradient(to right, #000000, transparent);
 }

 .tf-topbar.bg-dark .overflow-hidden::after {
   background: linear-gradient(to left, #000000, transparent);
 }

 .tf-topbar.bg-violet-3 .overflow-hidden::before {
   background: linear-gradient(to right, #591399, transparent);
 }

 .tf-topbar.bg-violet-3 .overflow-hidden::after {
   background: linear-gradient(to left, #591399, transparent);
 }

 .tf-topbar.bg-dark-green-7 .overflow-hidden::before {
   background: linear-gradient(to right, #219913, transparent);
 }

 .tf-topbar.bg-dark-green-7 .overflow-hidden::after {
   background: linear-gradient(to left, #219913, transparent);
 }

 .tf-topbar.bg-dark-green-8 .overflow-hidden::before {
   background: linear-gradient(to right, #246b64, transparent);
 }

 .tf-topbar.bg-dark-green-8 .overflow-hidden::after {
   background: linear-gradient(to left, #246b64, transparent);
 }

 .tf-topbar.bg-brown-18 .overflow-hidden::before {
   background: linear-gradient(to right, #995413, transparent);
 }

 .tf-topbar.bg-brown-18 .overflow-hidden::after {
   background: linear-gradient(to left, #995413, transparent);
 }

 .tf-topbar.bg-purple-7 .overflow-hidden::before {
   background: linear-gradient(to right, #a52c69, transparent);
 }

 .tf-topbar.bg-purple-7 .overflow-hidden::after {
   background: linear-gradient(to left, #a52c69, transparent);
 }

 .tf-topbar.bg-green-5 .overflow-hidden::before {
   background: linear-gradient(to right, #2ca554, transparent);
 }

 .tf-topbar.bg-green-5 .overflow-hidden::after {
   background: linear-gradient(to left, #2ca554, transparent);
 }

 .tf-topbar.bg-dark-brown .overflow-hidden::before {
   background: linear-gradient(to right, #502424, transparent);
 }

 .tf-topbar.bg-dark-brown .overflow-hidden::after {
   background: linear-gradient(to left, #502424, transparent);
 }

 .tf-topbar .js-countdown .countdown__value {
   min-width: 17px;
   display: inline-block;
   text-align: end;
 }

 .topbar-wraper {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 50px;
 }

 .topbar-wraper .tf-social-icon {
   flex-wrap: nowrap;
 }

 .marquee-topbar {
   overflow: hidden;
   padding: 12px 0px;
 }

 .marquee-topbar .marquee-wrapper p {
   text-transform: uppercase;
   font-weight: 600;
 }

 .marquee-sale {
   padding: 15px 0px;
   overflow: hidden;
 }

 .marquee-sale.marquee-border {
   border-top: 1px solid var(--dark);
   border-bottom: 1px solid var(--dark);
 }

 .marquee-sale .marquee-wrapper {
   display: flex;
   animation: infiniteScroll 20s linear infinite;
   align-items: center;
   transition: animation-duration 300ms;
 }

 .marquee-sale .marquee-wrapper:hover {
   animation-play-state: paused;
 }

 .marquee-sale .marquee-wrapper.scrollRight {
   animation: infiniteScrollRight 20s linear infinite;
 }

 .marquee-sale .marquee-wrapper.scrollRight:hover {
   animation-play-state: paused;
 }

 .marquee-sale .marquee-child-item {
   margin: 0 20px;
   display: flex;
   color: var(--dark);
 }

 .marquee-sale .icon-flash-star {
   font-size: 20px;
 }

 .marquee-sale.bg-dark .marquee-child-item {
   color: var(--white);
 }

 .header-default .wrapper-header {
   min-height: 64px;
 }

 .header-default .box-nav-menu {
   gap: 32px;
   display: flex;
   align-items: center;
   justify-content: center;
 }

 .header-default .box-nav-menu .item-link {
   font-size: 14px;
   line-height: 21px;
   font-weight: 500;
   font-family: var(--Montserrat);
   text-transform: uppercase;
   display: flex;
   align-items: center;
   gap: 4px;
   transition: all 0.3s ease-in-out;
   position: relative;
   color: var(--dark);
 }

 .header-default .box-nav-menu .item-link .icon {
   font-size: 10px;
   transition: all 0.3s ease-in-out;
 }

 .header-default .box-nav-menu .item-link::after {
   position: absolute;
   content: "";
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: calc(100% + 40px);
   height: 86px;
   display: none;
   background: transparent;
 }

 .header-default .box-nav-menu .menu-item {
   padding: 33px 0px;
 }

 .header-default .box-nav-menu .menu-item.active .item-link,
 .header-default .box-nav-menu .menu-item:hover .item-link {
   color: var(--primary);
 }

 .header-default .box-nav-menu .menu-item.active .menu-link-text.active {
   color: var(--primary);
 }

 .header-default .box-nav-menu .menu-item:hover .item-link .icon {
   transform: rotate(180deg);
   color: var(--primary);
 }

 .header-default .box-nav-menu .menu-item:hover .item-link::after {
   display: block;
 }

 .header-default .box-nav-menu .menu-item .label {
   line-height: 17px;
   height: 17px;
   font-size: 11px;
   padding: 0px 8px;
   color: var(--white);
   margin-left: 6px;
   border-radius: 5px;
 }

 .header-default .box-nav-menu .menu-item .label.hot {
   background-color: #ff4a5f;
 }

 .header-default .box-nav-menu .menu-item .label.new {
   background-color: #3eb516;
 }

 .header-default .nav-icon {
   gap: 16px;
 }

 .header-default .nav-icon .nav-icon-item {
   font-size: 24px;
   position: relative;
   display: inline-flex;
   align-items: center;
 }

 .header-default .nav-icon .nav-icon-item:hover {
   color: var(--primary);
 }

 .header-default .nav-icon .nav-icon-item .count-box {
   font-family: var(--Poppins);
   position: absolute;
   height: 16px;
   width: 16px;
   padding: 0 5px;
   font-size: 10px;
   font-weight: 500;
   border-radius: 50%;
   line-height: 16px;
   z-index: 2;
   top: 0;
   right: 0;
   transform: translate(50%, -50%);
   color: var(--white);
   background-color: var(--primary);
   text-align: center;
   white-space: nowrap;
   margin-top: 3px;
   margin-right: 3px;
   display: block;
 }

 .header-default .nav-icon .nav-icon-item .text {
   font-size: 14px;
   line-height: 21px;
   margin-left: 8px;
   font-weight: 500;
 }

 .header-default .nav-icon .nav-icon-item.value-box {
   padding: 6px 10px;
   border-radius: 4px;
   background-color: var(--surface-3);
 }

 .header-default .nav-icon .nav-wishlist .count-box {
   padding-left: 4px;
 }

 .header-default .nav-icon .nav-wishlist.style-2 .count-box {
   position: unset;
   background-color: #4a7e4b;
   margin: 0;
   width: 21px;
   height: 21px;
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 0;
   transform: none;
 }

 .header-default .nav-icon .nav-cart.pl .count-box {
   padding-left: 5px;
 }

 .header-default .mobile-menu {
   display: inline-flex;
 }

 .header-default .mobile-menu .icon {
   font-size: 24px;
 }

 .header-default .header-language {
   display: flex;
   gap: 16px;
 }

 .header-default .header-bottom .menu-item {
   padding: 22px 0px;
 }

 .header-default .header-bottom .item-link::after {
   height: 64px;
 }

 .header-default .box-phone {
   display: flex;
   align-items: center;
   gap: 4px;
 }

 .header-default .box-phone .icon {
   font-size: 20px;
   color: var(--dark);
 }

 .header-default .box-phone .phone {
   font-size: 16px;
   line-height: 100%;
   font-weight: 500;
   color: var(--primary);
 }

 .header-default .box-phone .box-icon {
   width: 48px;
   height: 48px;
   background-color: var(--primary-green);
   border-radius: 50%;
 }

 .header-default .box-phone .box-icon .icon {
   color: var(--white);
   font-size: 24px;
 }

 .header-default.header-style-2 .header-bottom .menu-item {
   padding: 36px 0px;
 }

 .header-default.header-style-2 .header-bottom .item-link::after {
   height: 94px;
 }

 .header-dark {
   background-color: var(--dark);
 }

 .header-dark .box-nav-menu .item-link {
   color: var(--white);
 }

 .header-dark .mobile-menu,
 .header-dark .nav-icon .nav-icon-item {
   color: var(--white);
 }

 .header-search .tf-form-search {
   max-width: 413px;
   margin: auto;
   margin-left: 70px;
   position: relative;
 }

 .header-search .tf-form-search input {
   border-radius: 42px;
 }

 .header-search .tf-form-search .search-suggests-results::after {
   content: "";
   position: absolute;
   left: 0;
   right: 0;
   top: -12px;
   background-color: transparent;
   height: 15px;
 }

 .header-search .tf-form-search.mw-613 {
   max-width: 613px;
 }

 .header-search .tf-form-search.mw-613 .tf-select {
   width: 35%;
   border-right: 0;
 }

 .header-search .tf-form-search.mw-613 .tf-select select {
   padding: 12px 20px;
   padding-right: 32px;
   width: 100%;
 }

 .header-search .tf-form-search.mw-613 .tf-select::after {
   right: 20px;
 }

 .header-search .tf-form-search.mw-613 .tf-select::before {
   content: "";
   right: 0;
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   display: block;
   width: 1px;
   background-color: var(--line);
   height: 24px;
 }

 .header-absolute {
   margin-bottom: -64px;
   background-color: transparent;
   z-index: 999;
 }

 .header-absolute-2 {
   margin-bottom: -70px;
   background-color: transparent;
   z-index: 999;
 }

 .header-absolute-2 .menu-item {
   color: var(--white);
 }

 .header-absolute-2 .menu-item .item-link {
   color: var(--white);
 }

 .header-absolute-2 .menu-item .item-link .icon {
   color: var(--white);
 }

 .header-absolute-2 .menu-item.active .icon {
   color: var(--primary) !important;
 }

 .header-absolute-2 .header-bottom .menu-item {
   padding: 24px 0px;
 }

 .header-absolute-2.header-bg .menu-item .item-link {
   color: var(--dark);
 }

 .header-absolute-2.header-bg .menu-item .item-link .icon {
   color: var(--dark);
 }

 .header-absolute-2 .logo-header .logo-white {
   display: none;
 }

 .header-lg .box-nav-menu .item-link {
   font-size: 16px;
   line-height: 100%;
 }

 .wrapper-header-left {
   display: flex;
   align-items: center;
 }

 .wrapper-header-left .box-navigation {
   padding-left: 40px;
 }

 .wrapper-header-bottom {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 30px;
 }

 .wrapper-header-bottom .inner-left {
   display: flex;
   align-items: center;
 }

 .wrapper-header-bottom .inner-right {
   display: flex;
   align-items: center;
   gap: 8px;
 }

 .wrapper-header-bottom .call-us {
   display: flex;
   align-items: center;
   gap: 4px;
   color: #9148ff;
   border-bottom: 1px solid #9148ff;
 }

 .wrapper-header-bottom .call-us .icon {
   font-size: 10px;
 }

 .wrapper-header-bottom .tf-mega-categories {
   position: relative;
 }

 .wrapper-header-bottom .tf-mega-categories .categories-title {
   min-width: 294px;
   height: 54px;
   font-size: 16px;
   line-height: 24px;
   padding: 0px 24px;
   margin-right: 42px;
   background-color: var(--purple);
   color: var(--white);
   border-radius: 8px;
   font-weight: 500;
   display: inline-flex;
   align-items: center;
   gap: 4px;
   text-transform: uppercase;
 }

 .wrapper-header-bottom .tf-mega-categories .categories-title .icon {
   font-size: 20px;
   margin-top: -2px;
 }

 .wrapper-header-bottom .tf-mega-categories .mega-categories {
   left: 0;
   border-radius: 16px;
   position: absolute;
   background-color: var(--white);
   min-width: 294px;
   z-index: 3;
   opacity: 0;
   visibility: hidden;
   transform: translateY(15px);
   transition: 0.4s ease 0.1s;
   text-align: left;
   box-shadow: var(--shadow-1);
   top: 100%;
   pointer-events: none;
 }

 .wrapper-header-bottom .tf-mega-categories:hover .mega-categories {
   opacity: 1;
   visibility: visible;
   transform: none;
   pointer-events: all;
 }

 .wrapper-header-bottom .tf-mega-categories.style-market .categories-title {
   background-color: var(--primary-green);
 }

 .wrapper-header-bottom .tf-mega-categories.style-market .cate-item:hover,
 .wrapper-header-bottom .tf-mega-categories.style-market .cate-item.active {
   background-color: rgba(57, 174, 82, 0.2);
 }

 .wrapper-header-bottom.style-2 .categories-title {
   min-width: unset;
   background: transparent;
   color: var(--dark);
   margin-right: 40px;
 }

 .wrapper-header-bottom.style-2 .tf-mega-categories::before {
   position: absolute;
   content: "";
   display: block;
   height: 26px;
   width: 1px;
   background-color: #d4d4d4;
   right: 0;
   top: 50%;
   transform: translateY(-50%);
 }

 .wrapper-header-bottom.style-2 .box-phone {
   gap: 10px;
 }

 .wrapper-header-bottom.style-2 .box-navigation {
   padding-left: 40px;
 }

 .header-white .mobile-menu,
 .header-white .nav-icon .nav-icon-item,
 .header-white .box-nav-menu .item-link {
   color: var(--white);
 }

 .header-white.header-bg {
   background-color: var(--dark);
 }

 .header-uppercase .box-nav-menu .item-link {
   text-transform: uppercase;
 }

 .slider-fashion-2 {
   padding: 0 15px;
   margin-top: 13px;
 }

 .logo-header img {
   width: 128px;
 }

 .header-medium .header-bottom .menu-item {
   padding: 20px 0px;
 }

 .header-medium .image-select.style-default .filter-option-inner-inner,
 .header-medium .image-select.style-default .dropdown-menu a .text {
   font-size: 12px;
   line-height: 18px;
 }

 .box-nav-menu .sub-menu.sub-menu-style-4 {
   min-width: 200px;
   max-width: 270px;
   padding: 25px 0;
   width: max-content;
   border: 1px solid #dddddd;
   border-top: none;
   padding-left: 25px;
   padding-right: 40px;
   border-radius: 0px 0px 5px 5px;
 }

 .box-nav-menu .sub-menu.sub-menu-style-4:before {
   content: "";
   position: absolute;
   bottom: 100%;
   left: 0;
   background: #1c1b1b;
   width: 100%;
   height: 2px;
   transform: scaleX(0);
   transform-origin: left center;
   transition: transform .3s;
 }

 .box-nav-menu .sub-menu {
   pointer-events: none;
   position: absolute;
   background-color: var(--white);
   min-width: 300px;
   z-index: 999;
   visibility: hidden;
   text-align: left;
   padding: 32px 60px;
   top: 100%;
   left: 0;
   opacity: 0;
   visibility: hidden;
   border-radius: 16px;
   transform: translateX(0px) translateY(10px);
   box-shadow: var(--shadow1);
   transition: all 0.3s ease-in-out;
   box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.1019607843);
 }

 .box-nav-menu .mega-menu {
   background-color: var(--white);
   margin: auto;
   left: 24px;
   right: 24px;
   max-height: calc(100vh - 71px);
   overflow: hidden auto;
 }

 .box-nav-menu .mega-menu .menu-heading {
   font-size: 14px;
   line-height: 22.4px;
   padding-bottom: 10px;
   margin-bottom: 15px;
   border-bottom: 1px solid rgba(161, 161, 161, 0.2);
   font-weight: 500;
   color: var(--dark);
   text-transform: uppercase;
   text-align: start;
 }

 .box-nav-menu .mega-menu.mega-tab {
   padding: 0;
 }

 .box-nav-menu .mega-menu.mega-tab .tab-content {
   flex-grow: 1;
 }

 .box-nav-menu .mega-home {
   max-width: 1440px;
   max-height: calc(100vh - 70px);
 }

 .box-nav-menu .mega-home::-webkit-scrollbar {
   width: 5px;
 }

 .box-nav-menu .mega-home::-webkit-scrollbar-track {
   background-color: var(--bg-scrollbar-track);
 }

 .box-nav-menu .mega-home::-webkit-scrollbar-thumb {
   background: var(--bg-scrollbar-thumb);
   border-radius: 4px;
 }

 .box-nav-menu .mega-shop {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 24px;
   max-width: 1763px;
 }

 .box-nav-menu .mega-shop .wrapper-sub-menu {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 20px;
 }

 .box-nav-menu .mega-shop .wrapper-sub-collection {
   width: 100%;
   min-width: 0;
 }

 .box-nav-menu .mega-shop .wg-cls {
   border-radius: 20px;
 }

 .box-nav-menu .mega-shop .wg-cls .image {
   aspect-ratio: 1;
 }

 .box-nav-menu .mega-shop .wg-cls .cls-btn {
   bottom: 32px;
 }

 .box-nav-menu .mega-shop .wg-cls .tf-btn {
   padding: 8px 30px;
   font-size: 20px;
   line-height: 24px;
 }

 .box-nav-menu .mega-product {
   display: flex;
   gap: 24px;
   max-width: 1720px;
 }

 .box-nav-menu .mega-product .wrapper-sub-menu {
   width: 67%;
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 20px;
 }

 .box-nav-menu .mega-product .wrapper-sub-product {
   width: 33%;
 }

 .box-nav-menu .mega-product .sw-dot-default {
   margin-top: 10px;
 }

 .box-nav-menu .card-product .box-icon {
   width: 36px;
   height: 36px;
 }

 .box-nav-menu .card-product .card-product-wrapper {
   aspect-ratio: 0.7837837838;
 }

 .box-nav-menu .mega-tab {
   display: flex;
   gap: 24px;
   min-height: 500px;
   max-width: 1440px;
 }

 .box-nav-menu .mega-tab .menu-tab {
   max-width: 235px;
   flex-shrink: 0;
   height: 100%;
   border-right: 1px solid var(--line);
 }

 .box-nav-menu .mega-tab .tab-link {
   padding: 14px 12px;
   font-size: 14px;
   line-height: 20px;
   font-weight: 500;
   display: flex;
   align-items: center;
   justify-content: space-between;
 }

 .box-nav-menu .mega-tab .tab-link .icon {
   font-size: 14px;
 }

 .box-nav-menu .mega-tab .tab-link.active,
 .box-nav-menu .mega-tab .tab-link:hover {
   color: var(--white);
   background-color: var(--primary);
 }

 .box-nav-menu .mega-tab .wrapper-sub-menu-tab {
   width: 62%;
   display: flex;
 }

 .box-nav-menu .mega-tab .wrapper-sub-menu-tab .tab-pane {
   display: flex;
   padding: 32px;
   gap: 40px;
   transform: translateY(15px);
   pointer-events: none;
 }

 .box-nav-menu .mega-tab .wrapper-sub-menu-tab .tab-pane.active {
   transform: none;
 }

 .box-nav-menu .mega-tab .wrapper-sub-product {
   width: 38%;
   padding: 32px;
   padding-left: 0;
 }

 .box-nav-menu .menu-item:hover>.sub-menu {
   pointer-events: all;
   opacity: 1;
   visibility: visible;
   transform: translateX(0px) translateY(0px);
 }

 .box-nav-menu .menu-item:hover .wrapper-sub-menu-tab .tab-pane.active {
   pointer-events: all;
 }

 .box-nav-menu .menu-list li:not(:last-child) {
   margin-bottom: 10px;
 }

 .box-nav-menu .menu-list .menu-link-text {
   font-size: 14px;
   line-height: 21px;
   color: #5d5d5d;
   display: flex;
   align-items: center;
   font-weight: 400;
   text-align: start;
 }
 

 .box-nav-menu .sub-menu-style-2 {
   display: flex;
   gap: 25px;
   min-width: 750px;
   left: -30px;
 }

 .box-nav-menu .sub-menu-style-2 .menu-list {
   width: 23%;
 }

 .box-nav-menu .sub-menu-style-2 .banner {
   width: 52%;
   border-radius: 16px;
   position: relative;
   max-height: 262px;
 }

 .box-nav-menu .sub-menu-style-2 .banner .img-style {
   width: 100%;
   height: 100%;
   display: block;
   border-radius: 16px;
 }

 .box-nav-menu .sub-menu-style-2 .banner .content {
   position: absolute;
   z-index: 1;
   bottom: 16px;
   left: 16px;
   right: 16px;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 20px;
 }

 .box-nav-menu .sub-menu-style-2 .banner .title {
   font-size: 20px;
   line-height: 24px;
   color: var(--dark);
   text-align: start;
 }

 .box-nav-menu .sub-menu-style-2 .banner .box-icon {
   width: 44px;
   height: 44px;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 50%;
   background-color: var(--primary);
   font-size: 12px;
   color: var(--white);
   flex-shrink: 0;
 }

 .box-nav-menu .sub-menu-style-2 .banner .box-icon::after {
   animation-duration: 0.5s;
 }

 .box-nav-menu .sub-menu-style-2 .banner::after {
   position: absolute;
   content: "";
   left: -2px;
   right: -2px;
   bottom: -2px;
   height: 137px;
   background: var(--gradient-1);
   border-bottom-left-radius: 16px;
   border-bottom-right-radius: 16px;
 }

 .box-nav-menu .sub-menu-style-3 {
   display: flex;
   gap: 25px;
   min-width: 552px;
   padding: 16px 24px 40px 32px;
   left: -100px;
 }

 .box-nav-menu .sub-menu-style-3 .menu-list {
   margin-top: 16px;
   width: 45%;
 }

 .box-nav-menu .sub-menu-style-3 .menu-heading {
   margin-bottom: 16px;
   font-weight: 500;
   color: var(--dark);
   font-size: 16px;
   line-height: 24px;
   text-align: start;
 }

 .box-nav-menu .list-recent-blog .item {
   display: flex;
   gap: 12px;
 }

 .box-nav-menu .list-recent-blog .item:not(:last-child) {
   margin-bottom: 16px;
 }

 .box-nav-menu .list-recent-blog .item .img-box {
   width: 64px;
   height: 64px;
   border-radius: 4px;
   overflow: hidden;
   flex-shrink: 0;
 }

 .box-nav-menu .list-recent-blog .item .content {
   display: grid;
   align-content: flex-start;
   gap: 4px;
   text-align: start;
 }

 .mega-menu .box-search {
   display: flex;
   gap: 10px;
   max-width: 635px;
   margin: 0px auto 20px;
 }

 .mega-menu .box-search .tf-select select {
   min-width: 192px;
   height: 48px;
   padding: 12px 20px;
   padding-right: 32px;
 }

 .mega-menu .box-search .tf-select::after {
   right: 20px;
 }

 .mega-menu .box-search .form-search {
   flex-grow: 1;
   width: 100%;
 }

 .mega-menu .box-search .form-search input {
   padding: 12px 20px;
   height: 48px;
   padding-right: 42px;
   border-radius: 43px;
   font-size: 16px;
   line-height: 24px;
   color: var(--text);
   border-color: var(--line);
 }

 .mega-menu .box-search .form-search input::placeholder {
   color: var(--text);
 }

 .mega-menu .box-search .form-search input:focus {
   border-color: var(--dark);
 }

 .mega-menu .box-search .form-search .icon {
   font-size: 24px;
 }

 .mega-menu .box-search .form-search button {
   right: 20px;
 }
 
 
 

 

 header {
   position: sticky;
   position: -webkit-sticky;
   left: 0;
   right: 0;
   transition: 0.2s ease-out;
   z-index: 888;
   background-color: var(--white);
   font-family: var(--Poppins);
 }

 header.header-bg {
   background-color: var(--white);
   box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
 }

 header.header-bg.header-dark {
   background-color: var(--dark);
 }

 .canvas-mb {
   width: 100% !important;
   max-width: min(90%, 320px);
   border-right: 0 !important;
   font-family: var(--Poppins);
 }

 .canvas-mb .mb-canvas-content {
   padding-top: 60px;
   min-width: 100%;
   max-width: min(90%, 320px);
   grid-auto-rows: minmax(0, 1fr) auto;
   isolation: isolate;
   height: 100%;
   width: 100%;
   display: grid;
   align-content: start;
 }

 .canvas-mb .mb-body {
   padding-right: 20px;
   padding-left: 20px;
   padding-bottom: 20px;
   border-bottom: 1px solid var(--line);
   overscroll-behavior-y: contain;
   overflow-y: auto;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
 }

 .canvas-mb .icon-close-popup {
   position: absolute;
   font-size: 16px;
   z-index: 3;
   top: 15px;
   left: 15px;
   background-color: transparent;
   border: none;
   height: 30px;
   width: 30px;
   padding: 7px;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   cursor: pointer;
   color: var(--dark);
 }

 
  
 
 .canvas-mb .site-nav-icon {
   padding: 0 10px;
   line-height: 40px;
   border: solid 1px var(--line);
   gap: 6px;
   background-color: var(--line);
   color: var(--dark);
   border-radius: 3px;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   font-size: 14px;
   font-weight: 500;
 }

 .canvas-mb .site-nav-icon .icon {
   font-size: 18px;
 }

 .canvas-mb .site-nav-icon:hover {
   color: var(--white);
   background-color: var(--dark);
   border-color: var(--dark);
 }

 .canvas-mb .mb-other-content .group-icon {
   margin-top: 10px;
   display: flex;
   flex-wrap: wrap;
   gap: 10px;
   margin-bottom: 20px;
 }

 .canvas-mb .mb-other-content .text-need {
   font-weight: 500;
   margin-bottom: 12px;
   font-size: 14px;
   line-height: 22px;
 }

 .canvas-mb .mb-other-content .mb-info li {
   font-size: 14px;
   line-height: 22px;
   display: flex;
   align-items: center;
   color: var(--text);
   gap: 4px;
 }

 .canvas-mb .mb-other-content .mb-info li:not(:last-child) {
   margin-bottom: 8px;
 }

 .canvas-mb .mb-other-content .mb-contact {
   display: grid;
   gap: 8px;
   margin-bottom: 12px;
 }

 .canvas-mb .mb-other-content .mb-contact p {
   font-size: 14px;
   line-height: 22px;
   color: var(--text);
 }

 .canvas-mb .form-search {
   margin-bottom: 8px;
   position: relative;
 }

 .canvas-mb .form-search input {
   padding-right: 44px;
   color: var(--dark-2);
 }

 .nav-ul-mb .nav-mb-item {
   padding: 2px 0px;
 }

 .nav-ul-mb .nav-mb-item:not(:last-child) {
   border-bottom: 1px solid var(--line);
 }

 .nav-ul-mb .nav-mb-item .mb-menu-link {
   min-height: 40px;
   font-weight: 500;
   font-size: 14px;
   line-height: 40px;
   color: var(--dark);
   display: flex;
   align-items: center;
   justify-content: space-between;
 }

 .nav-ul-mb .nav-mb-item .mb-menu-link:not(.collapsed) .btn-open-sub::before {
   transform: rotate(90deg);
 }

 .nav-ul-mb .nav-mb-item.active .mb-menu-link {
   color: var(--primary);
 }

 .nav-ul-mb .nav-mb-item.active .mb-menu-link .btn-open-sub::after,
 .nav-ul-mb .nav-mb-item.active .mb-menu-link .btn-open-sub::before {
   background-color: var(--primary);
 }

 .nav-ul-mb .nav-mb-item.active .sub-nav-link.active {
   color: var(--primary);
 }

 .nav-ul-mb .nav-mb-item.active .sub-nav-link.active .btn-open-sub::after,
 .nav-ul-mb .nav-mb-item.active .sub-nav-link.active .btn-open-sub::before {
   background-color: var(--primary);
 }

 .nav-ul-mb .btn-open-sub {
   position: relative;
   width: 20px;
   height: 30px;
   display: inline-flex;
   align-items: center;
   justify-content: center;
 }

 .nav-ul-mb .btn-open-sub:after,
 .nav-ul-mb .btn-open-sub::before {
   content: "";
   position: absolute;
   z-index: 1;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
   background-color: var(--dark);
   transition: 0.4s ease 0.1s;
   margin: auto;
 }

 .nav-ul-mb .btn-open-sub::before {
   width: 2px;
   height: 12px;
 }

 .nav-ul-mb .btn-open-sub::after {
   width: 12px;
   height: 2px;
 }

  
 .nav-ul-mb .sub-nav-menu {
   padding-left: 10px;
   margin-bottom: 15px;
 }

 .nav-ul-mb .sub-menu-level-2 {
   margin-bottom: 5px;
 }

 .nav-ul-mb .sub-menu-level-2 .sub-nav-link {
   position: relative;
   max-width: max-content;
 }

 .nav-ul-mb .sub-nav-link {
   display: flex;
   align-items: center;
   justify-content: space-between;
   min-height: 32px;
   line-height: 22px;
   font-size: 14px;
   color: var(--dark);
   text-transform: capitalize;
 }

 .nav-ul-mb .sub-nav-link:not(.collapsed) .btn-open-sub::before {
   transform: rotate(90deg);
 }

 .nav-ul-mb .sub-nav-link .btn-open-sub::after,
 .nav-ul-mb .sub-nav-link .btn-open-sub::before {
   background-color: var(--dark);
 }

 .nav-ul-mb .sub-nav-link.line-clamp {
   position: relative;
   display: inline-flex;
 }

 

 /*------------ footer ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .footer-default {
   font-family: var(--Poppins);
   font-size: 16px;
   line-height: 24px;
   font-weight: 400;
   color: var(--text);
   background-color: var(--white);
 }

 .footer-default a {
   color: var(--text);
 }

 .footer-default .form-newsletter {
   max-width: 401px;
 }

 .footer-default .form-newsletter .subscribe-button {
   padding: 13px;
   border-radius: 50%;
 }

 .footer-default .form-newsletter .subscribe-button .icon {
   font-size: 17px;
 }

 .footer-default .form-newsletter .subscribe-button.bg-purple-1 {
   background-color: #A304FF;
   border: 0;
   padding-left: 30px;
   padding-right: 30px;
 }

 .footer-default .footer-bottom {
   border-top: 1px solid var(--line);
 }

 .footer-default .footer-body {
   padding-top: 40px;
   padding-bottom: 40px;
 }

 .footer-default .btn-line-dark {
   color: #444444;
 }

 .footer-default .btn-line-dark::after {
   background-color: #444444;
 }

 .footer-default .form-newsletter .subscribe-button.h56 {
   height: 50px;
 }

 .footer-logo {
   max-width: 108px;
   margin-bottom: 28px;
   width: 100%;
 }

 .footer-logo>a {
   width: 100%;
   display: block;
 }

 .footer-logo>a img {
   width: 100%;
 }

 .footer-wrap {
   border-top: 1px solid var(--line);
 }

 .footer-info {
   margin-bottom: 15px;
   display: grid;
   gap: 15px;
 }

 .footer-info a.infor_address {
   font-weight: 400;
 }

 .footer-info a.infor_address span {
   transition: all 0.3s ease-in-out;
 }

 .footer-info a.infor_address:hover {
   color: inherit;
 }

 .footer-info .item {
   display: flex;
   align-items: center;
   gap: 10px;
   color: #0d0d0d;
 }

 .footer-info .item a {
   color: #0d0d0d;
 }

 .footer-info .item a:hover {
   color: var(--primary);
 }

 .footer-info .box-icon {
   width: 32px;
   height: 32px;
   border-radius: 50%;
   border: 1px solid var(--line);
   font-size: 14px;
   color: var(--dark);
   background-color: var(--white);
   flex-shrink: 0;
 }

 .footer-info .box-icon:hover {
   background-color: var(--primary);
   color: var(--white);
   border-color: var(--primary);
 }

 .footer-info .box-icon:hover svg path {
   fill: var(--white);
 }

 .footer-heading {
   margin-bottom: 15px;
   color: #0d0d0d;
 }

 .footer-menu-list {
   display: grid;
   gap: 15px;
 }

 .footer-menu-list a:hover {
   color: var(--primary);
 }

 .footer-newsletter {
   display: grid;
   gap: 20px;
 }

 .footer-bottom-wrap {
   display: flex;
   align-items: center;
   justify-content: space-between;
   flex-wrap: wrap;
   padding: 32px 0px;
   position: relative;
   gap: 15px;
 }

 .footer-bottom-wrap p,
 .footer-bottom-wrap a {
   font-size: 14px;
   line-height: 20px;
 }

 .footer-bottom-wrap .image-select.style-default {
   border-radius: 4px !important;
   border: 1px solid rgba(46, 46, 46, 0.1490196078) !important;
   width: 184px !important;
   padding: 8px 10px;
 }

 .footer-bottom-wrap .image-select.style-default .filter-option-inner-inner {
   font-size: 14px;
   font-weight: 400;
   line-height: 20px;
   color: var(--dark);
 }

 .footer-bottom-wrap .image-select.style-default>.dropdown-toggle {
   background-color: transparent !important;
   border: 1px solid var(--line);
   outline: none !important;
   color: var(--dark);
   position: relative;
 }

 .footer-bottom-wrap .image-select.style-default>.dropdown-toggle::after {
   display: none;
 }

 .footer-bottom-wrap .image-select.style-default>.dropdown-toggle::before {
   position: absolute;
   content: "\e905";
   font-family: "icomoon";
   right: 0px;
   font-size: 6px;
   top: 50%;
   transform: translateY(-50%);
 }

 .footer-bottom-wrap .image-select.style-default>.dropdown-menu a .text {
   font-size: 14px;
   line-height: 20px;
 }

 .footer-bottom-wrap .tf-payment {
   display: flex;
   gap: 8px;
   align-items: center;
   flex-wrap: wrap;
 }

 .footer-bottom-wrap .tf-payment .item {
   max-width: 40px;
 }

 .footer-bottom-wrap .box-right {
   display: flex;
   align-items: center;
   gap: 30px;
 }

 .footer-default .subscribe-email,
 .footer-default .tf-social-icon .social-item {
   background-color: transparent;
 }


 .footer-pb-2 {
   padding-bottom: 100px;
 }

 .footer-bg {
   color: var(--white);
 }


 .footer-bg .row-footer .s1,
 .footer-bg .row-footer .s2 {
   border-color: #7f7f7f;
 }

 .footer-bg .footer-bottom {
   border-color: #7f7f7f;
 }

 .footer-bg .tf-social-icon .social-item:not(:hover) {
   border-color: #989898;
   color: var(--white);
 }

 .footer-bg .footer-info .box-icon {
   border-color: transparent;
 }

 .footer-bg a,
 .footer-bg .item,
 .footer-bg .item a,
 .footer-bg .footer-heading {
   color: var(--white);
 }

 .footer-bg .subscribe-email {
   border-color: var(--white) !important;
   background-color: var(--white);
 }

 .footer-bg .footer-heading-mobile::before,
 .footer-bg .footer-heading-mobile::after {
   background-color: var(--white);
 }

 .cloud-footer {
   margin-bottom: -2px;
 }

 .cloud-footer img {
   width: 100%;
   height: auto;
   animation: floating 5s infinite ease-in-out alternate;
 }

 .footer-cloud {
   background-color: #d1d6ff;
   position: relative;
 }



 .footer-cloud .row-footer .s1,
 .footer-cloud .row-footer .s2 {
   border-color: var(--white);
 }

 .footer-cloud .row-footer .form-newsletter input {
   background-color: var(--white);
   border-color: var(--white);
 }

 .footer-cloud .row-footer .form-newsletter input:focus {
   border-color: var(--dark);
 }

 .footer-cloud .footer-bottom {
   border-color: var(--white);
 }

 .footer-cloud .footer-info .box-icon {
   background-color: transparent;
   border-color: var(--white);
 }

 /*------------ blog ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .blog-item {
   display: grid;
   gap: 24px;
 }

 .blog-item .entry_image {
   border-radius: 16px;
   overflow: hidden;
 }

 .blog-item .entry_image a {
   display: block;
   height: 100%;
 }

 .blog-item .blog-content {
   display: grid;
   gap: 15px;
 }

 .blog-item .entry-meta {
   display: flex;
   gap: 10px 20px;
   align-items: center;
   flex-wrap: wrap;
 }

 .blog-item .br-line {
   width: 1px;
   height: 16px;
   background-color: var(--line);
 }

 .blog-item .entry_author {
   display: flex;
   align-items: center;
   gap: 10px;
 }

 .blog-item .avatar {
   max-width: 38px;
   border-radius: 50%;
   overflow: hidden;
 }

 .blog-item.style-2 {
   display: flex;
   gap: 24px;
 }

 .blog-item.style-2 .entry_image {
   max-width: 342px;
   flex-shrink: 0;
   width: 100%;
 }

 .blog-item.style-2 .blog-content {
   display: flex;
   flex-direction: column;
   gap: 15px;
 }

 .entry-tag {
   display: flex;
   align-items: center;
   gap: 15px;
 }

 .entry-tag>p {
   font-size: 16px;
   font-weight: 500;
   line-height: 25px;
 }

 .entry-tag .style-list {
   display: flex;
   align-items: center;
   gap: 10px;
   flex-wrap: wrap;
 }

 .entry-tag .style-list a {
   padding: 9px 23px;
   display: inline-block;
   border-radius: 22px;
   border: 1px solid var(--line);
   font-weight: 500;
   line-height: 17px;
   background-color: transparent;
 }

 .entry-tag .style-list a:hover {
   background-color: var(--primary);
   border-color: var(--primary);
   color: var(--white);
 }

 .entry-tag .style-list .type-life {
   background-color: #ffe1e1;
   border-color: #ffe1e1;
 }

 .entry-tag .style-list .type-design {
   background-color: #ede2ff;
   border-color: #ede2ff;
 }

 .entry-tag .style-list .type-bag {
   background-color: #c5ffbb;
   border-color: #c5ffbb;
 }

 .entry-tag .style-list .type-trick {
   background-color: #c3dbff;
   border-color: #c3dbff;
 }

 .recent-blog-list {
   display: grid;
   gap: 24px;
 }

 .recent-blog-list li {
   display: flex;
   gap: 20px;
 }

 .recent-blog-list .image {
   border-radius: 8px;
   max-width: 98px;
   width: 100%;
   overflow: hidden;
 }

 .recent-blog-list .post-content {
   display: flex;
   flex-direction: column;
   gap: 10px;
 }

 .sidebar-blog {
   display: grid;
   gap: 32px;
 }

 .sidebar-blog .sb-title {
   margin-bottom: 24px;
 }

 .sidebar-blog .sb-content {
   padding-bottom: 32px;
   border-bottom: 1px solid var(--line);
 }

 .sb-banner {
   position: relative;
 }

 .sb-banner .image {
   border-radius: 16px;
   overflow: hidden;
 }

 .sb-banner .title {
   font-size: 26px;
   font-weight: 500;
   line-height: 33.2px;
   color: var(--white);
   text-align: center;
   margin-bottom: 16px;
 }

 .sb-banner .banner-content {
   position: absolute;
   bottom: 84px;
   left: 20px;
   right: 20px;
   display: flex;
   flex-direction: column;
   align-items: center;
 }

 .sb-banner .tf-btn {
   font-family: "DM Sans", sans-serif;
   font-weight: 600;
   line-height: 19px;
   letter-spacing: -0.03em;
   padding: 12px 33px;
   width: max-content;
 }

 .wg-pagination {
   display: flex;
   justify-content: center;
   gap: 10px;
   grid-column: 1/-1;
   width: 100%;
   margin-top: 18px;
 }

 .wg-pagination .pagination-item {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 44px;
   height: 44px;
   border-radius: 50%;
   border: 1px solid var(--rgba-dark-3);
   font-size: 16px;
   font-weight: 500;
   line-height: 19px;
 }

 .wg-pagination .pagination-item:hover {
   background-color: var(--dark);
   border-color: var(--dark);
   color: var(--white);
 }

 .wg-pagination .active .pagination-item {
   background-color: var(--dark);
   border-color: var(--dark);
   color: var(--white);
 }

 .category-blog-list {
   display: grid;
   gap: 5px;
 }

 .leave-comment-wrap .title {
   font-size: 32px;
   font-weight: 500;
   line-height: 38px;
   color: var(--dark);
   margin-bottom: 48px;
   text-align: center;
 }

 .blog-item-v2 {
   border: 1px solid var(--line);
   border-radius: 16px;
   overflow: hidden;
 }

 .blog-item-v2 .image-box {
   display: block;
 }

 .blog-item-v2 .img-style {
   display: block;
 }

 .blog-item-v2 .entry-image {
   position: relative;
 }

 .blog-item-v2 .entry-tag {
   position: absolute;
   left: 12px;
   bottom: 12px;
   display: flex;
   gap: 10px;
   flex-wrap: wrap;
 }

 .blog-item-v2 .tag {
   font-size: 14px;
   line-height: 20px;
   padding: 6px 10px;
   background-color: var(--white);
   border-radius: 4px;
   color: var(--dark);
   transition: all 0.3s ease-in-out;
   cursor: pointer;
 }

 .blog-item-v2 .tag:hover {
   background-color: var(--primary);
   color: var(--white);
 }

 .blog-item-v2 .entry-content {
   padding: 15px;
 }

 .blog-item-v2 .entry-content .info-box {
   margin-bottom: 20px;
   display: grid;
   gap: 10px;
 }

 .blog-item-v2 .entry-content .meta-list {
   display: flex;
   flex-wrap: wrap;
   gap: 10px;
 }

 .blog-item-v2 .entry-content .meta-list .item {
   padding: 4px 14px;
   padding-right: 0;
   position: relative;
   color: var(--text);
   font-weight: 500;
   font-size: 12px;
   line-height: 20px;
 }

 .blog-item-v2 .entry-content .meta-list .item::before {
   content: "";
   position: absolute;
   top: 50%;
   left: 0;
   transform: translateY(-50%);
   display: block;
   width: 4px;
   height: 4px;
   border-radius: 50%;
   background-color: var(--text);
 }

 .blog-item-v2 .entry-content .btn-readmore {
   display: inline-flex;
   align-items: center;
   gap: 4px;
   font-size: 15px;
   line-height: 24px;
   color: #404cb7;
   font-weight: 500;
 }

 .blog-item-v2 .entry-content .btn-readmore .icon {
   font-size: 15px;
 }

 .s-blog-single {
   padding-top: 100px;
   padding-bottom: 60px;
 }

 .s-blog-single .leave-comment-wrap {
   max-width: 952px;
   margin: auto;
 }

 .sec-blog {
   padding-top: 80px;
   padding-bottom: 176px;
 }

 .sec-blog.space-blog {
   padding-top: 56px;
 }

 /*------------ slider banner ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .slider-default {
   position: relative;
 }

 .slider-default .swiper-slide {
   height: auto;
 }

 .slider-default .swiper-slide>* {
   height: 100%;
 }

 .slider-default .box-content {
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   left: 0;
   right: 0;
 }

 .slider-default .box-title-slider {
   display: grid;
   gap: 10px;
 }

 .slider-default .content-slider {
   display: grid;
   gap: 34px;
 }

 .slider-default .content-slider.style-2 {
   border-radius: 16px;
   background-color: var(--white);
   padding: 30px 15px;
   overflow: hidden;
 }

 .slider-default .slider-wrap .image {
   height: 100%;
 }

 .slider-default .slider-wrap .image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .slider-default .slider-wrap.bg-type-1 {
   background: linear-gradient(256.55deg, #ffd1bb 0%, #fffedb 100%);
 }

 .slider-default .slider-wrap.bg-type-2 {
   background: linear-gradient(256.55deg, #f4e7fb 0%, #ffe9e9 25%, #ffedec 50%, #ffe9fd 100%);
 }

 .slider-default .slider-wrap.bg-type-3 {
   background: linear-gradient(256.55deg, #dcfaff 0%, #dbe3ff 100%);
 }

 .slider-default .slider-wrap.bg-type-4 {
   background: #d4edff;
 }

 .slider-default .slider-wrap.bg-type-5 {
   background: #eef0ff;
 }

 .slider-default .slider-wrap.bg-type-6 {
   background: #fff0f6;
 }

 .slider-default .slider-wrap.bg-type-7 {
   background: linear-gradient(-90deg, #ffe8e6 0%, #fff7d6 100%);
 }

 .slider-default .slider-wrap.bg-type-8 {
   background: linear-gradient(-90deg, #e6f4ff 0%, #ffecd6 100%);
 }

 .slider-default .slider-wrap.bg-type-9 {
   background: linear-gradient(-90deg, #f5e6ff 0%, #f1ffec 100%);
 }

 .tf-slideshow {
   position: relative;
   overflow: hidden;
 }

 .tf-slideshow .wrap-pagination {
   position: absolute;
   bottom: 41px;
   left: 0;
   right: 0;
   z-index: 1;
 }

 .slider-style-2 .slider-wrap {
   display: flex;
 }

 .slider-style-2 .image {
   width: 50%;
   margin-left: auto;
 }

 .slider-style-2 .image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .slider-style-2 .box-content-left {
   background: #ba9272;
   position: absolute;
   left: 0;
   right: 50%;
   top: 0;
   bottom: 0;
   display: flex;
 }

 .slider-style-2 .box-btn-slider {
   display: flex;
   justify-content: center;
 }

 .slider-style-2 .box-title-slider {
   display: grid;
   gap: 15px;
 }

 .slider-style-2 .content-slider {
   display: grid;
   gap: 36px;
 }

 .slider-style-2 .wrap-pagination {
   bottom: 30px;
 }

 .slider-style-3 .slider-wrap {
   border-radius: 20px;
   overflow: hidden;
 }

 .slider-style-3 .wrap-pagination {
   margin-top: 30px;
 }

 .slider-effect-fade .swiper-slide .fade-item {
   transform: translateY(100px);
   opacity: 0;
   visibility: hidden;
   transition: all 0.3s ease-in-out;
 }

 .slider-effect-fade .swiper-slide .fade-item.fade-box {
   transition-delay: 0.4s;
 }

 .slider-effect-fade .swiper-slide .fade-item.fade-item-1 {
   transition-delay: 0.5s;
 }

 .slider-effect-fade .swiper-slide .fade-item.fade-item-2 {
   transition-delay: 0.6s;
 }

 .slider-effect-fade .swiper-slide .fade-item.fade-item-3 {
   transition-delay: 0.7s;
 }

 .slider-effect-fade .swiper-slide .fade-item.fade-item-4 {
   transition-delay: 0.8s;
 }

 .slider-effect-fade .swiper-slide.swiper-slide-active .fade-item {
   transform: translateY(0);
   opacity: 1;
   visibility: visible;
 }

 @keyframes spin-border {
   0% {
     transform: translate(-50%, -50%) rotate(0deg);
   }

   100% {
     transform: translate(-50%, -50%) rotate(360deg);
   }
 }

 .slider-fashion-2 .fs-cls {
   background-color: var(--surface);
   height: 100%;
 }

 .slider-fashion-2 .image {
   height: 100%;
 }

 .slider-electronic .slider-wrap.type-image-right {
   display: flex;
   justify-content: end;
   align-items: center;
 }

 .slider-electronic .box-title-slider {
   gap: 16px;
 }

 .slider-electronic .content-slider {
   gap: 32px;
 }

 .slider-fashion-3 .box-title-slider {
   gap: 17px;
 }

 .slider-fashion-3 .content-slider {
   gap: 40px;
 }

 .slider-fashion-3 .type {
   font-size: 16px;
   font-weight: 600;
   line-height: 20px;
   letter-spacing: -0.02em;
 }

 .slider-fashion-3 .wrap-pagination {
   bottom: 33px;
 }

 .slider-skincare .box-title-slider {
   gap: 10px;
 }

 .slider-skincare .content-slider {
   gap: 40px;
 }

 .slider-skincare .wrap-pagination {
   bottom: 31px;
 }

 .slider-bicycle .box-title-slider {
   gap: 16px;
 }

 .slider-bicycle .box-content {
   top: unset;
   transform: unset;
   bottom: 40px;
 }

 .slider-phonecase {
   margin: 27px 15px 0px;
   border-radius: 16px;
 }

 .slider-phonecase .wrap-pagination {
   bottom: 25px;
 }

 .slider-phonecase .tf-btn .icon {
   font-size: 12px;
 }

 .slider-phonecase .content-slider {
   gap: 40px;
 }

 .slider-pet .wrap-pagination {
   bottom: 25px;
 }

 .slider-electric-access .swiper {
   border-radius: 16px;
 }

 .slider-electric-access .wrap-pagination {
   bottom: 29px;
 }

 .slider-electric-access .box-title-slider {
   gap: 16px;
 }

 .slider-electric-access .content-slider {
   gap: 32px;
 }

 .slider-baby .wrap-pagination {
   bottom: 29px;
 }

 .slider-baby .content-slider {
   gap: 40px;
 }

 .slider-baby .box-title-slider {
   gap: 24px;
 }

 .slider-baby .box-content {
   top: 44%;
 }

 .slider-baby .clouds {
   position: absolute;
   bottom: -2px;
   width: 100%;
   left: 0;
   right: 0;
   overflow: hidden;
   z-index: 1;
 }

 .slider-baby .clouds img {
   width: 100%;
   height: auto;
   animation: floating 5s infinite ease-in-out alternate;
   right: 0;
 }

 @keyframes floating {
   0% {
     transform: translateY(0px);
   }

   100% {
     transform: translateY(20px);
   }
 }

 .slider-pod .box-title-slider {
   gap: 24px;
 }

 .slider-pod .content-slider {
   gap: 42px;
   max-width: 300px;
   margin: auto;
 }

 .slider-btn-thumbs {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 42px;
 }

 .slider-btn-thumbs .btn-thumbs {
   opacity: 0.2;
   cursor: pointer;
   transition: all 0.3s ease-in-out;
 }

 .slider-btn-thumbs .btn-thumbs:hover,
 .slider-btn-thumbs .btn-thumbs.active {
   opacity: 1;
 }

 .slider-thumb-wrap {
   display: flex;
   flex-direction: column;
   gap: 30px;
 }

 .tes-jewelry-wrap {
   max-width: 994px;
   margin: 0 auto;
 }

 .slider-effect-zoom {
   position: relative;
 }

 .slider-effect-zoom img {
   transition: all 15s linear;
   object-fit: cover;
 }

 .slider-effect-zoom .swiper-slide-active img {
   transform: scale(1.25);
 }

 .slider-default .parallax-wrap {
   padding: 100px 0px;
   background-position: center;
   background-size: cover;
   background-repeat: no-repeat;
 }

 .slider-default .parallax-wrap .box-content {
   position: unset;
   transform: none;
 }

 .banner-group-img {
   display: block;
   position: relative;
 }

 .banner-group-img .banner-img {
   width: 100%;
   height: 350px;
   object-fit: cover;
 }

 .banner-group-img .box-content {
   position: absolute;
   left: 15px;
   right: 15px;
   top: 50%;
   transform: translateY(-50%);
   background-color: var(--white);
   max-width: 638px;
   margin: auto;
   padding: 30px 15px;
   z-index: 5;
 }

 .banner-group-img .box-content .subheading {
   margin-bottom: 12px;
   display: block;
 }

 .banner-group-img .box-content .heading {
   margin-bottom: 20px;
 }

 .banner-group-img .box-content .tf-btn {
   margin-top: 32px;
 }

 .slider-jewelry {
   padding-left: 30px;
   padding-right: 30px;
 }

 .slider-jewelry .heading {
   font-weight: 400;
   font-size: 80px;
   line-height: 110%;
   text-transform: capitalize;
 }

 .slider-supplement .wrap-pagination {
   bottom: 25px;
 }

 .slider-supplement .tf-btn .icon {
   font-size: 12px;
 }

 .slider-supplement .content-slider {
   gap: 40px;
 }

 .slider-container .slider-wrap {
   position: relative;
 }

 .slider-container .swiper {
   border-radius: 20px;
   overflow: hidden;
 }

 .slider-container .box-content {
   left: 5%;
   right: 5%;
 }

 .slider-space3 .box-content .tf-btn {
   max-width: 244px;
   width: 100%;
 }

 /*------------ collection ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .grid-cls {
   display: grid;
   gap: 12px;
 }

 .grid-cls-v1 {
   grid-template-columns: 1fr;
 }

 .grid-cls-v2 {
   grid-template-columns: 1fr 1fr;
 }

 .grid-cls-v4 {
   grid-template-columns: 1fr;
 }

 .grid-cls-v5 {
   grid-template-columns: 1fr 1fr;
 }

 .grid-cls-v6 {
   grid-template-columns: 1fr;
 }

 .grid-cls-v7 {
   grid-template-areas: "bb bb" "aa cc";
   grid-template-columns: repeat(2, 1fr);
 }

 .grid-cls-v7 .item1 {
   grid-area: aa;
 }

 .grid-cls-v7 .item2 {
   grid-area: bb;
 }

 .grid-cls-v7 .item3 {
   grid-area: cc;
 }

 .grid-cls-v7 .s-cls {
   border-radius: 14px;
 }

 .grid-cls-v7 .s-cls .img-style {
   width: 100%;
   height: 100%;
 }

 .grid-cls-v7 .s-cls.style-absolute .content {
   gap: 10px;
 }

 .grid-cls-v8 {
   grid-template-areas: "cc cc" "aa bb";
   grid-template-columns: repeat(2, 1fr);
 }

 .grid-cls-v8 .item1 {
   grid-area: aa;
 }

 .grid-cls-v8 .item2 {
   grid-area: bb;
 }

 .grid-cls-v8 .item3 {
   grid-area: cc;
 }

 .wg-cls {
   display: grid;
   gap: 20px;
   position: relative;
 }

 .wg-cls .cls-content {
   display: grid;
   gap: 4px;
 }

 .wg-cls.style-circle {
   width: 100%;
 }

 .wg-cls.style-circle .image {
   border-radius: 50%;
   aspect-ratio: 1;
 }

 .wg-cls.style-circle-md {
   width: 100%;
   gap: 16px;
 }

 .wg-cls.style-circle-md .image {
   border-radius: 50%;
   width: 99px;
   height: 99px;
   margin-left: auto;
   margin-right: auto;
   display: block;
 }

 .wg-cls.style-circle-md .shop-all {
   display: flex;
   align-items: center;
   justify-content: center;
   border: 1px solid var(--dark);
 }

 .wg-cls.style-circle-md .shop-all img {
   width: 64px;
   height: 17px;
 }

 .wg-cls.style-circle2 {
   padding: 24px;
   border-radius: 16px;
   overflow: hidden;
 }

 .wg-cls.style-square {
   width: 100%;
 }

 .wg-cls.style-square .image {
   border-radius: 8px;
   background-color: var(--surface);
 }

 .wg-cls.style-abs {
   border-radius: 16px;
   overflow: hidden;
 }

 .wg-cls.style-abs .cls-content,
 .wg-cls.style-abs .cls-btn {
   position: absolute;
   bottom: 12px;
   left: 12px;
   right: 12px;
 }

 .wg-cls.style-abs .cls-content {
   display: grid;
   gap: 12px;
 }

 .wg-cls.style-abs2 {
   gap: 10px;
 }

 .wg-cls.style-abs2 .image-wrap {
   position: relative;
   overflow: hidden;
 }

 .wg-cls.style-abs2 .image {
   border-radius: 20px;
   overflow: hidden;
 }

 .wg-cls.style-abs2 .cls-btn {
   text-align: center;
   position: absolute;
   bottom: 12px;
   left: 12px;
   right: 12px;
   z-index: 2;
   opacity: 0;
   transform: translateY(30px);
   transition: all 0.3s ease-in-out;
 }

 .wg-cls.style-abs2 .tf-btn {
   font-size: 14px;
   line-height: 17px;
   padding: 12px 25px;
 }

 .wg-cls.style-abs2 .tf-overlay {
   background: var(--dark);
   border-radius: 20px;
   opacity: 0;
   transition: all 0.3s ease-in-out;
 }

 .wg-cls.style-abs2:hover .cls-btn {
   opacity: 1;
   transform: translateY(0px);
 }

 .wg-cls.style-abs2:hover .tf-overlay {
   opacity: 0.2;
 }

 .wg-cls.style-abs2 .cls-content {
   display: grid;
   gap: 5px;
 }

 .wg-cls.style-abs2.style-lg {
   gap: 20px;
 }

 .wg-cls.style-02 .btn-cls {
   font-size: 18px;
   line-height: 100%;
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding-right: 3px;
 }

 .wg-cls.style-02 .btn-cls .icon {
   font-size: 10px;
   transition: all 0.3s ease-in-out;
   color: var(--dark);
 }

 .wg-cls.style-02 .btn-cls span {
   position: relative;
 }

 .wg-cls.style-02 .btn-cls span::after {
   content: "";
   position: absolute;
   bottom: 2px;
   left: auto;
   right: 0;
   width: 0%;
   height: 1px;
   background-color: var(--primary);
   transition: all 0.3s ease-in-out;
 }

 .wg-cls.style-02 .btn-cls:hover .icon {
   transform: rotate(45deg);
   color: var(--primary);
 }

 .wg-cls.style-02 .btn-cls:hover span::after {
   left: 0;
   right: auto;
   width: 100%;
 }

 .wg-cls.asp-1 .image {
   aspect-ratio: 0.9009708738;
 }

 .wg-cls-2 {
   display: grid;
   gap: 24px;
 }

 .wg-cls-2 .img-box {
   display: block;
   border-radius: 16px;
   overflow: hidden;
 }

 .wg-cls-2 .box-title {
   display: grid;
   gap: 8px;
   margin-bottom: 20px;
 }

 .wg-cls-2 .content {
   text-align: center;
 }

 .cls-video {
   height: 449px;
   border-radius: 16px;
   overflow: hidden;
   position: relative;
   font-family: var(--Poppins);
 }

 .cls-video img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .cls-video .poster {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   object-fit: cover;
   z-index: 2;
   transition: opacity 0.5s ease;
   cursor: pointer;
 }

 .cls-video .poster.hide {
   opacity: 0;
   pointer-events: none;
 }

 .cls-video video {
   cursor: pointer;
   border-radius: 16px;
 }

 .cls-video .hover-video {
   height: 449px;
 }

 .cls-video:hover video {
   pointer-events: auto;
 }

 .cls-video .cls-content {
   position: absolute;
   bottom: 12px;
   right: 10px;
   left: 10px;
   z-index: 3;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 12px;
   border-radius: 61px;
   background-color: rgba(63, 63, 63, 0.8);
   padding: 10px;
   transition: all 0.3s ease-in-out;
 }

 .cls-video .box-product {
   display: flex;
   align-items: center;
   gap: 12px;
 }

 .cls-video .box-product .price-old {
   color: rgba(158, 158, 147, 0.6);
 }

 .cls-video .box-product .price-old::after {
   background-color: rgba(158, 158, 147, 0.6);
 }

 .cls-video .img-product {
   border-radius: 50%;
   overflow: hidden;
   max-width: 78px;
 }

 .cls-video .icon {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 45px;
   height: 45px;
   background-color: var(--white);
   border-radius: 50%;
   flex-shrink: 0;
   font-size: 17px;
 }

 .cls-video .info-product {
   display: grid;
   gap: 10px;
 }

 .cls-video .price-wrap {
   display: flex;
   align-items: center;
   gap: 6px;
 }

 .btn-cls-shop {
   display: flex;
   align-items: center;
   gap: 8px;
 }

 .btn-cls-shop:hover {
   color: var(--primary) !important;
 }

 .fs-cls .content {
   position: absolute;
   bottom: 24px;
   left: 12px;
   right: 12px;
   display: flex;
   justify-content: center;
 }

 .grid-jewelry .wg-cls .tf-btn {
   font-size: 18px;
   line-height: 22px;
 }

 .wg-cls-text {
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   background-color: #e9e4dc;
   padding: 40px;
   gap: 30px;
 }

 .wg-cls-text .heading {
   margin-bottom: 16px;
 }

 .banner-shop {
   position: relative;
   border-radius: 16px;
   overflow: hidden;
 }

 .banner-shop .img-style {
   display: block;
   width: 100%;
   height: 100%;
 }

 .banner-shop .img-style img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .banner-shop .tag {
   padding: 10px 20px;
   background-color: #ff7676;
   border-radius: 45px;
 }

 .banner-shop.style-left-center .content {
   position: absolute;
   left: 24px;
   top: 50%;
   transform: translateY(-50%);
   display: grid;
   justify-items: start;
   gap: 24px;
 }

 .banner-shop.style-left-center .box-title {
   display: grid;
   gap: 12px;
   justify-items: start;
 }

 .banner-shop.style-left-center .box-title .title {
   font-weight: 500;
 }

 .banner-shop.style-left-center .box-title .box-price {
   display: flex;
   align-items: center;
   gap: 6px;
 }

 .banner-shop.style-left-center .box-title .price-old {
   font-weight: 500;
   font-size: 16px;
   line-height: 24px;
   color: var(--rgba-dark);
   text-decoration: line-through;
 }

 .banner-shop.style-bottom .content {
   position: absolute;
   bottom: 20px;
   left: 15px;
   right: 15px;
   display: grid;
   justify-items: center;
   gap: 16px;
 }

 .banner-shop.style-bottom .box-title {
   display: grid;
   gap: 8px;
 }

 .banner-shop.style-top .content {
   top: 30px;
   position: absolute;
   right: 15px;
   left: 15px;
   display: grid;
   gap: 16px;
 }

 .banner-shop.style-top .box-title {
   display: grid;
   gap: 10px;
 }

 .banner-shop .box {
   padding: 20px;
   right: auto !important;
 }

 .s-cls {
   border-radius: 16px;
   position: relative;
   overflow: hidden;
 }

 .s-cls .offer {
   display: inline-block;
   border-radius: 22px;
   padding: 5px 12px;
 }

 .s-cls .box-title {
   display: grid;
   gap: 8px;
 }

 .s-cls .image {
   width: 100%;
   height: 100%;
 }

 .s-cls .image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .s-cls.style-absolute .content {
   display: grid;
   gap: 16px;
   position: absolute;
   bottom: 15px;
   left: 15px;
   right: 15px;
 }

 .s-cls.abs-left-center .image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .s-cls.abs-left-center .content {
   bottom: auto !important;
   right: auto;
   left: 15px;
   top: 50%;
   transform: translateY(-50%);
 }

 .s-cls.abs-left-bottom .content {
   right: auto;
   left: 15px;
   bottom: 15px;
 }

 .s-cls.abs-top-center .content {
   bottom: unset !important;
   right: 15px;
   left: 15px;
   top: 15px;
   gap: 15px;
 }

 .s-cls.abs-tb-center .content {
   display: flex;
   flex-direction: column;
   gap: 15px;
   justify-content: space-between;
   align-items: center;
   text-align: center;
   top: 15px;
   right: 15px;
 }

 .s-cls.abs-tb-center .box-title {
   display: grid;
   gap: 5px;
 }

 .s-cls.abs-tb-center .tf-btn {
   width: max-content;
 }

 .s-cls.abs-right-center .content {
   display: flex;
   flex-direction: column;
   justify-content: center;
   right: 15px;
   left: auto !important;
   top: 15px;
   bottom: 15px;
 }

 .s-cls.abs-right-center .tf-btn {
   width: max-content;
 }

 .s-cls.abs-bottom-center .content {
   text-align: center;
 }

 .s-cls.abs-bottom-center .tf-btn {
   margin-left: auto;
   margin-right: auto;
 }

 .grid-mega .image {
   width: 100%;
   height: 100%;
 }

 .grid-mega .item1 {
   min-height: 400px;
 }

 .grid-mega .item2,
 .grid-mega .item3 {
   min-height: 287px;
 }

 .grid-vegetable .image {
   width: 100%;
   height: 100%;
 }

 .grid-vegetable .item3 {
   min-height: 400px;
 }

 .grid-vegetable .item3 .content {
   max-width: 351px;
 }

 .grid-vegetable .item1,
 .grid-vegetable .item2 {
   min-height: 287px;
 }

 .section-cls-tabs {
   display: flex;
   gap: 64px;
 }

 .section-cls-tabs .left {
   width: 43%;
 }

 .section-cls-tabs .right {
   width: 52.7%;
   padding: 78px 72px;
   border-radius: 40px;
   border: 1px solid #252525;
 }

 .section-cls-tabs .tab-content .tab-pane {
   height: 100%;
 }

 .section-cls-tabs .tab-content img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   border-radius: 40px;
 }

 .section-cls-tabs .menu-tab-line {
   flex-direction: column;
   gap: 0;
   overflow: unset;
 }

 .section-cls-tabs .nav-tab-item {
   border-bottom: 1px solid #ebebeb;
 }

 .section-cls-tabs .nav-tab-item .tab-link {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 20px 0;
   font-size: 40px;
   line-height: 34px;
   color: rgba(31, 31, 31, 0.6);
 }

 .section-cls-tabs .nav-tab-item .tab-link .icon {
   font-size: 18px;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 90px;
   height: 60px;
   color: var(--white);
   background-color: #f3ca54;
   border-radius: 99px;
   opacity: 0;
   visibility: hidden;
   transition: all 0.3s ease-in-out;
   flex-shrink: 0;
 }

 .section-cls-tabs .nav-tab-item .tab-link .icon:hover {
   color: var(--dark);
 }

 .section-cls-tabs .nav-tab-item .tab-link.active {
   padding: 32px 0;
 }

 .section-cls-tabs .nav-tab-item .tab-link::after {
   background-color: #282828;
 }

 .section-cls-tabs .nav-tab-item .tab-link:hover,
 .section-cls-tabs .nav-tab-item .tab-link.active {
   color: #073c4e;
 }

 .section-cls-tabs .nav-tab-item .tab-link:hover .icon,
 .section-cls-tabs .nav-tab-item .tab-link.active .icon {
   opacity: 1;
   visibility: visible;
 }

 /*------------ product ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .flat-single-product {
   padding: 0px 0px 100px;
 }

 .stagger-wrap .stagger-item {
   transition: 0.3s ease-in-out;
   transform: scale(0.5) rotate(90deg) skew(15deg);
   opacity: 0;
 }

 .stagger-wrap .stagger-item.stagger-finished {
   transform: scale(1) rotate(0deg) skew(0deg);
   opacity: 1;
 }

 .slider-scroll,
 .product-thumbs-slider {
   display: flex;
   gap: 10px;
 }

 .thumbs-bottom {
   flex-direction: column;
 }

 .thumbs-bottom .tf-product-media-thumbs {
   order: 1;
   width: 100%;
 }

 .thumbs-bottom .flat-wrap-media-product {
   width: 100%;
 }

 .thumbs-bottom .flat-wrap-media-product .tf-product-media-main .item {
   max-height: none;
 }

 .tf-product-media-thumbs {
   width: 122px;
   flex-shrink: 0;
   max-height: 758px;
 }

 .tf-product-media-thumbs .swiper-slide {
   height: max-content;
   width: auto;
 }

 .tf-product-media-thumbs .swiper-slide .item {
   position: relative;
   height: 100%;
 }

 .tf-product-media-thumbs .swiper-slide .item img {
   border-radius: 8px;
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .tf-product-media-thumbs .swiper-slide .item::after {
   position: absolute;
   content: "";
   top: 0;
   right: 0;
   left: 0;
   bottom: 0;
   border: 1px solid transparent;
   transition: all 0.3s ease-in-out;
   border-radius: 8px;
 }

 .tf-product-media-thumbs .swiper-slide:not(.swiper-slide-thumb-active) .item {
   opacity: 0.6;
 }

 .tf-product-media-thumbs .swiper-slide.swiper-slide-thumb-active .item::after {
   border-color: rgba(0, 0, 0, 0.4);
 }

 .wrap-btn-viewer {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 36px;
   height: 36px;
   border-radius: 50%;
   background-color: var(--white);
   display: flex;
   align-items: center;
   justify-content: center;
   z-index: 5;
 }

 .wrap-btn-viewer .icon {
   font-size: 20px;
 }

 .tf-model-viewer-ui-button .wrap-btn-viewer {
   width: 44px;
   height: 44px;
 }

 .flat-wrap-media-product {
   width: calc(100% - 132px);
   position: relative;
 }

 .flat-wrap-media-product .tf-product-media-main {
   border-radius: 12px;
   height: 100%;
 }

 .flat-wrap-media-product .tf-product-media-main .item {
   display: flex;
   width: 100%;
   height: 100%;
   overflow: hidden;
   max-height: 758px;
 }

 .flat-wrap-media-product .tf-product-media-main .item img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .flat-wrap-media-product .tf-product-media-main .slide-3d,
 .flat-wrap-media-product .tf-product-media-main .slide-video {
   height: auto;
 }

 .tf-product-info-wrap {
   display: grid;
   gap: 32px;
 }

 .tf-product-info-wrap .tf-product-info-list {
   display: grid;
   gap: 24px;
 }

 .tf-product-info-wrap .tf-product-heading {
   border-bottom: 1px solid var(--line);
   padding-bottom: 24px;
   display: grid;
   gap: 12px;
 }

 .tf-product-info-wrap .brand-product {
   font-weight: 500;
   color: var(--text);
   font-size: 14px;
   line-height: 20px;
 }

 .tf-product-info-wrap .product-rate {
   display: flex;
   align-items: center;
 }

 .tf-product-info-wrap .product-rate .list-star {
   margin-right: 6px;
   display: flex;
   align-items: center;
 }

 .tf-product-info-wrap .product-rate .icon {
   font-size: 16px;
   color: #98ab23;
 }

 .tf-product-info-wrap .product-rate .icon:not(:last-child) {
   margin-right: 5px;
 }

 .tf-product-info-wrap .product-rate .count-review {
   font-family: "DM Sans", sans-serif;
   font-weight: 500;
   font-size: 16px;
   line-height: 22.4px;
   letter-spacing: -3%;
   color: var(--text);
 }

 .tf-product-info-wrap .product-price {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
   gap: 12px;
   font-weight: 500;
 }

 .tf-product-info-wrap .product-price .price-new {
   color: var(--primary);
 }

 .tf-product-info-wrap .product-price .price-old {
   color: var(--rgba-dark);
   text-decoration: line-through;
 }

 .tf-product-info-wrap .badge-sale {
   font-size: 14px;
   line-height: 20px;
   font-weight: 400;
   background-color: var(--primary);
   border-radius: 22px;
   padding: 5px 10px;
   color: var(--white);
 }

 .tf-product-info-wrap .product-stock {
   display: flex;
   align-items: center;
   gap: 6px;
   flex-wrap: wrap;
   margin-top: 4px;
 }

 .tf-product-info-wrap .product-stock .icon {
   animation: tf-ani-flash 2s infinite;
 }

 .tf-product-info-wrap .product-stock .stock {
   padding: 5px 10px;
   border-radius: 5px;
   margin-right: 8px;
   font-weight: 500;
 }

 .tf-product-info-wrap .product-stock .in-stock {
   background-color: rgba(44, 163, 21, 0.1);
   color: #1d770b;
 }

 .tf-product-info-wrap .product-stock .out-stock {
   background-color: rgba(37, 37, 37, 0.1);
   color: #252525;
 }

 .tf-product-info-wrap .progress-sold {
   width: 100%;
   background-color: var(--line-4);
   height: 5px;
   position: relative;
   border-radius: 5px;
 }

 .tf-product-info-wrap .progress-sold .value {
   position: relative;
   height: 100%;
   background-color: var(--primary);
   transition: width 2s ease;
   border-radius: 5px;
 }

 .tf-product-info-wrap .product-progress-sale {
   margin-top: 8px;
 }

 .tf-product-info-wrap .product-progress-sale .title-hurry-up {
   margin-bottom: 10px;
   font-size: 12px;
   line-height: 14.4px;
   color: var(--dark);
 }

 .tf-product-info-wrap .product-progress-sale .count {
   font-size: 20px;
   line-height: 24px;
   font-weight: 500;
   color: var(--primary);
 }

 .tf-product-info-wrap .tf-product-variant {
   display: grid;
   gap: 24px;
 }

 .tf-product-info-wrap .tf-product-variant .variant-picker-label {
   margin-bottom: 8px;
   font-size: 16px;
   line-height: 24px;
   color: var(--dark);
 }

 .tf-product-info-wrap .tf-product-variant .variant-picker-label-value {
   text-transform: capitalize;
   margin-left: 4px;
   font-weight: 500;
 }

 .tf-product-info-wrap .variant-color .variant-picker-values {
   display: flex;
   gap: 12px;
 }

 .tf-product-info-wrap .variant-color .color-btn:not(.select-item) {
   position: relative;
   width: 38px;
   height: 38px;
   flex-shrink: 0;
   display: flex;
   align-items: center;
   justify-content: center;
   text-align: center;
   border: 1px solid transparent;
   cursor: pointer;
   transition: all 0.3s ease-in-out;
   border-radius: 50%;
 }

 .tf-product-info-wrap .variant-color .color-btn:not(.select-item) .check-color {
   width: 32px;
   height: 32px;
   display: flex;
   flex-shrink: 0;
   border-radius: 50%;
   border: 1px solid #dcdcdc;
   transition: all 0.3s ease-in-out;
 }

 .tf-product-info-wrap .variant-color .color-btn:not(.select-item).active {
   border-color: var(--dark-2);
 }

 .tf-product-info-wrap .variant-color .color-btn.style-image {
   width: 56px;
   height: 56px;
   padding: 5px;
   border: 1px solid var(--line);
 }

 .tf-product-info-wrap .variant-color .color-btn.style-image .img {
   width: 100%;
   height: 100%;
   border-radius: 50%;
   overflow: hidden;
 }

 .tf-product-info-wrap .variant-color .color-btn.style-image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .tf-product-info-wrap .variant-color .color-btn.style-image-square {
   width: 80px;
   height: 100px;
   padding: 6px;
   border: 1px solid var(--line);
   border-radius: 6px;
 }

 .tf-product-info-wrap .variant-color .color-btn.style-image-square .img {
   width: 100%;
   height: 100%;
   border-radius: 6px;
   overflow: hidden;
 }

 .tf-product-info-wrap .variant-color .color-btn.style-image-square img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .tf-product-info-wrap .variant-size .variant-picker-label {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 15px;
 }

 .tf-product-info-wrap .variant-size .size-guide {
   font-size: 14px;
   line-height: 16.8px;
   text-decoration: underline;
 }

 .tf-product-info-wrap .variant-size .variant-picker-values {
   display: flex;
   gap: 16px;
   flex-wrap: wrap;
 }

 .tf-product-info-wrap .variant-size .size-btn:not(.select-item) {
   width: 48px;
   height: 48px;
   border-radius: 50%;
   border: 1px solid var(--line);
   font-size: 20px;
   line-height: 30px;
   color: var(--dark);
   font-weight: 500;
   transition: all 0.3s ease-in-out;
   display: flex;
   align-items: center;
   justify-content: center;
   cursor: pointer;
 }

 .tf-product-info-wrap .variant-size .size-btn:not(.select-item).active {
   border-color: var(--dark);
 }

 .tf-product-info-wrap .product-info-countdown {
   margin-top: 8px;
   padding: 20px;
   display: inline-block;
   width: max-content;
   border: 1px solid var(--primary);
   border-radius: 8px;
 }

 .tf-product-info-wrap .product-info-countdown .countdown-title {
   display: flex;
   align-items: center;
   gap: 4px;
   margin-bottom: 12px;
 }

 .tf-product-info-wrap .product-info-countdown .countdown__timer {
   display: flex;
   gap: 12px;
 }

 .tf-product-info-wrap .product-info-countdown .countdown__item {
   width: 48px;
   height: 32px;
   font-size: 16px;
   line-height: 24px;
   color: var(--white);
   background-color: var(--primary);
   border-radius: 4px;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   position: relative;
 }

 .tf-product-info-wrap .product-info-countdown .countdown__item:not(:last-child)::after {
   position: absolute;
   content: ":";
   top: 50%;
   transform: translateY(-50%);
   right: -8px;
   color: var(--dark);
 }

 .tf-product-info-wrap .product-info-countdown.type-1 {
   min-width: 276px;
 }

 .tf-product-info-wrap .product-info-countdown.type-1 .countdown__timer {
   justify-content: center;
 }

 .tf-product-info-wrap .product-info-countdown.type-1 .countdown__item {
   width: unset;
   background-color: transparent;
   color: #e83524;
   font-weight: 500;
   font-size: 12px;
   line-height: 120%;
 }

 .tf-product-info-wrap .product-info-countdown.type-1 .countdown__item::after {
   color: #e83524;
 }

 .tf-product-info-wrap .tf-product-total-quantity .group-btn {
   margin-bottom: 12px;
   display: flex;
   align-items: center;
   gap: 12px;
 }

 .tf-product-info-wrap .tf-product-total-quantity .group-btn .tf-btn {
   flex-grow: 1;
 }

 .tf-product-info-wrap .tf-product-total-quantity .group-btn .product-btns {
   width: 52px;
   height: 52px;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 15px;
   border: 1px solid #ebebeb;
   border-radius: 50%;
   color: #252525;
 }

 .tf-product-info-wrap .tf-product-total-quantity .group-btn .product-btns:hover {
   background-color: #252525;
   color: var(--white);
 }

 .tf-product-info-wrap .tf-product-total-quantity .tf-btn {
   text-transform: none;
 }

 .tf-product-info-wrap .tf-product-total-quantity .btn-out-stock {
   background-color: var(--text);
   border-color: var(--text);
   cursor: not-allowed;
 }

 .tf-product-info-wrap .tf-product-total-quantity .more-choose-payment {
   margin-top: 12px;
   display: block;
   text-align: center;
   text-decoration: underline;
 }

 .tf-product-info-wrap .tf-product-extra-link {
   display: flex;
   align-items: center;
   gap: 30px;
   flex-wrap: wrap;
 }

 .tf-product-info-wrap .tf-product-extra-link .product-extra-icon {
   display: flex;
   align-items: center;
   gap: 6px;
   font-weight: 500;
 }

 .tf-product-info-wrap .tf-product-extra-link .product-extra-icon .icon {
   font-size: 18px;
 }

 .tf-product-info-wrap .tf-product-trust-seal .list-card {
   margin-top: 12px;
   display: flex;
   gap: 10px;
   flex-wrap: wrap;
   justify-content: center;
 }

 .tf-product-info-wrap .tf-product-trust-seal .card-item {
   width: 45px;
   height: 32px;
   border: 1px solid #d9d9d9;
   border-radius: 2.5px;
 }

 .tf-product-info-wrap .tf-product-delivery-return {
   border-radius: 16px;
   border: 1px solid var(--line);
   padding: 20px;
   display: flex;
 }

 .tf-product-info-wrap .tf-product-delivery-return .product-delivery {
   display: grid;
   gap: 10px;
   text-align: center;
   padding: 0px 25px;
 }

 .tf-product-info-wrap .tf-product-delivery-return .product-delivery .icon {
   font-size: 23px;
   color: var(--dark);
 }

 .tf-product-info-wrap .tf-product-delivery-return .product-delivery:not(:last-child) {
   border-right: 1px solid var(--line);
 }

 .tf-product-info-wrap .tf-product-pickup-available {
   display: flex;
   margin: 8px 0px;
   gap: 8px;
 }

 .tf-product-info-wrap .tf-product-pickup-available .icon {
   font-size: 21px;
   color: var(--light-green);
 }

 .tf-product-info-wrap .tf-product-pickup-available .content {
   display: grid;
   gap: 4px;
 }

 .tf-product-info-wrap .tf-product-pickup-available .check-availability {
   font-size: 12px;
   line-height: 18px;
   color: var(--text);
   text-decoration: underline;
 }

 .tf-product-info-wrap .form-group-product {
   margin-bottom: 8px;
 }

 .btn-add-wishlist .added {
   display: none;
 }

 .btn-add-wishlist.added-wishlist .add {
   display: none;
 }

 .btn-add-wishlist.added-wishlist .added {
   display: block;
 }

 .wg-quantity {
   display: flex;
   justify-content: space-between;
   background-color: #f1f1f1;
   border-radius: 43px;
   overflow: hidden;
 }

 .wg-quantity .quantity-product {
   width: 42px;
   height: 42px;
   padding: 0;
   background-color: transparent;
   border: 0;
   text-align: center;
   font-size: 20px;
   font-weight: 500;
   line-height: 30px;
   color: var(--dark);
   pointer-events: none;
 }

 .wg-quantity .btn-quantity {
   width: 42px;
   height: 42px;
   padding: 0;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 22px;
   color: #011624;
   cursor: pointer;
   background-color: transparent;
   border: 1px solid transparent;
   transition: all 0.3s ease-in-out;
 }

 .wg-quantity .btn-quantity:hover {
   color: var(--primary);
 }

 .wg-quantity.small .btn-quantity,
 .wg-quantity.small .quantity-product {
   height: 30px;
   width: 30px;
   font-size: 18px;
 }

 .wg-quantity.small .quantity-product {
   font-size: 14px;
   font-weight: 700;
   line-height: 16.8px;
   letter-spacing: -0.03em;
 }

 .tf-product-fbt {
   padding: 20px;
   border-radius: 16px;
   border: 1px solid var(--line);
 }

 .tf-product-fbt .title {
   margin-bottom: 16px;
 }

 .tf-product-fbt .tf-bundle-product-item {
   padding: 16.35px 0px;
 }

 .tf-product-fbt .tf-product-form-bundle {
   display: grid;
   gap: 24px;
 }

 .tf-product-fbt .btn-submit-total {
   font-family: "DM Sans", sans-serif;
   font-weight: 600;
   text-transform: none;
 }

 .tf-product-fbt .bundle-total-submit {
   display: flex;
   align-items: center;
   font-size: 20px;
   line-height: 32px;
   font-weight: 500;
 }

 .tf-product-fbt .bundle-total-submit .text {
   margin-right: 10px;
 }

 .tf-product-fbt .bundle-total-submit .total-price {
   margin-right: 5px;
   color: var(--primary);
 }

 .tf-product-fbt .bundle-total-submit .total-price-old {
   color: var(--line-3);
   text-decoration: line-through;
 }

 .tf-product-fbt-wrap {
   padding: 15px;
   border-radius: 16px;
   border: 1px solid var(--line);
 }

 .tf-product-fbt-wrap .list-fbt {
   display: flex;
   gap: 25px;
   align-items: center;
   overflow-x: auto;
   min-width: 100%;
 }

 .tf-product-fbt-wrap .list-fbt::-webkit-scrollbar {
   width: 4px;
   height: 4px;
 }

 .tf-product-fbt-wrap .list-fbt::-webkit-scrollbar-track {
   background-color: var(--bg-scrollbar-track);
 }

 .tf-product-fbt-wrap .list-fbt::-webkit-scrollbar-thumb {
   background: var(--bg-scrollbar-thumb);
   border-radius: 4px;
 }

 .tf-product-fbt-wrap .fbt-image {
   width: 129px;
   min-width: 129px;
   border-radius: 8px;
   overflow: hidden;
 }

 .tf-product-fbt-wrap .fbt-swatches {
   display: grid;
   gap: 8px;
 }

 .tf-product-fbt-wrap .fbt-info {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
   gap: 8px;
 }

 .tf-product-fbt-wrap .fbt-info .bundle-variant,
 .tf-product-fbt-wrap .fbt-info .bundle-title {
   margin-right: 10px;
 }

 .tf-product-fbt-wrap .fbt-info .bundle-price {
   display: flex;
   gap: 6px;
 }

 .tf-product-fbt-wrap .fbt-info .new-price {
   color: var(--primary);
 }

 .tf-product-fbt-wrap .fbt-info .old-price {
   color: #bfbfbf;
 }

 .tf-product-fbt-wrap .tf-product-form-fbt {
   display: flex;
   flex-direction: column;
   gap: 20px;
 }

 .tf-product-fbt-wrap .list-fbt {
   margin-bottom: 15px;
 }

 .tf-product-fbt-wrap .fbt-total-price {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 10px;
 }

 .tf-product-fbt-wrap .fbt-total-price .price-new {
   color: var(--primary);
 }

 .tf-product-fbt-wrap .fbt-total-price .price-old {
   color: #bfbfbf;
   text-decoration: line-through;
   font-size: 14px;
   line-height: 22.4px;
   margin-left: 5px;
 }

 .tf-bundle-product-item {
   display: flex;
   gap: 20px;
 }

 .tf-bundle-product-item .bundle-check {
   align-self: center;
 }

 .tf-bundle-product-item .bundle-image {
   width: 129px;
   min-width: 129px;
   border-radius: 8px;
   overflow: hidden;
 }

 .tf-bundle-product-item .bundle-image img {
   width: 100%;
   height: 100%;
 }

 .tf-bundle-product-item .bundle-info {
   display: grid;
   gap: 8px;
   align-content: flex-start;
 }

 .tf-bundle-product-item .bundle-price .new-price {
   color: var(--primary);
 }

 .tf-bundle-product-item .bundle-price .old-price {
   color: var(--rgba-dark);
   text-decoration: line-through;
 }

 .tf-bundle-product-item .tf-select {
   width: max-content;
 }

 .item-has-checkbox {
   opacity: 0.4;
 }

 .item-has-checkbox.check {
   opacity: 1;
 }

 .wd-product-descriptions .item .title {
   margin-bottom: 5px;
 }

 .wd-product-descriptions .item:not(:last-child) {
   margin-bottom: 20px;
 }

 .wd-product-descriptions .item p,
 .wd-product-descriptions .item li {
   font-size: 14px;
   line-height: 22.4px;
 }

 .wd-product-descriptions .item ul li {
   position: relative;
   padding-left: 20px;
 }

 .wd-product-descriptions .item ul li::before {
   position: absolute;
   content: "";
   left: 5px;
   top: 50%;
   transform: translateY(-50%);
   background-color: var(--dark);
   width: 4px;
   height: 4px;
   border-radius: 50%;
 }

 .wd-product-descriptions .list-policies {
   display: flex;
   align-items: center;
   justify-content: center;
   margin-bottom: 15px;
 }

 .wd-product-descriptions .accordion-body {
   padding: 10px 0px 30px;
 }

 .tf-product-side-accordions {
   margin-bottom: 42px;
 }

 .tf-product-side-accordions .wd-customer-review {
   flex-direction: column;
   gap: 42px;
 }

 .flat-single-grid {
   width: 100%;
 }

 .flat-single-grid .tf-product-media-main .item {
   overflow: hidden;
   width: 100%;
   height: 100%;
   display: block;
   max-height: 100%;
 }

 .recent-blog-item {
   display: flex;
   gap: 20px;
 }

 .recent-blog-item .img-product {
   width: 75px;
   height: 112px;
   border-radius: 4px;
   overflow: hidden;
   display: block;
 }

 .recent-blog-item .img-product img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .recent-blog-item .content {
   display: grid;
   gap: 8px;
   align-content: flex-start;
 }

 .recent-blog-item .content .old-price {
   margin-left: 6px;
   color: #5c5c5c;
 }

 .recent-blog-item .content .new-price {
   color: var(--primary);
 }

 .flat-wrap-frequently-bought-together .product-thumbs-slider {
   margin-bottom: 30px;
 }

 .tf-product-volume-discount {
   padding: 30px 15px;
   border-radius: 16px;
   border: 1px solid var(--line);
 }

 .tf-product-volume-discount .title-discount {
   margin-bottom: 24px;
 }

 .tf-product-volume-discount .tf-btn {
   margin-top: 42px;
 }

 .list-volume-discount .volume-discount-item {
   padding: 15px;
   gap: 14px;
   border-radius: 8px;
   border: 1px solid var(--line);
   display: flex;
   align-items: center;
   position: relative;
   transition: all 0.3s ease-in-out;
 }

 .list-volume-discount .volume-discount-item:not(:last-child) {
   margin-bottom: 16px;
 }

 .list-volume-discount .volume-discount-item .content-discount {
   flex-grow: 1;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 8px;
   flex-wrap: wrap;
 }

 .list-volume-discount .volume-discount-item .name span {
   color: var(--primary);
 }

 .list-volume-discount .volume-discount-item .info-discount,
 .list-volume-discount .volume-discount-item .discount-price {
   opacity: 0.8;
 }

 .list-volume-discount .volume-discount-item .check {
   border-radius: 50%;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   width: 12px;
   height: 12px;
   border: 1px solid #9a9a9a;
   background-color: transparent;
   flex-shrink: 0;
 }

 .list-volume-discount .volume-discount-item .check span {
   width: 6px;
   height: 6px;
   border-radius: 50%;
   display: block;
   background-color: var(--white);
 }

 .list-volume-discount .volume-discount-item .discount-price {
   display: flex;
   align-items: center;
   gap: 4px;
 }

 .list-volume-discount .volume-discount-item .discount-price .price-new {
   color: var(--primary);
 }

 .list-volume-discount .volume-discount-item .discount-price .price-old {
   color: var(--text);
   font-size: 12px;
   line-height: 18px;
   text-decoration: line-through;
 }

 .list-volume-discount .volume-discount-item .tag-shipping {
   border: 1px solid #22ae45;
   border-radius: 4px;
   padding: 4px 10px;
   color: rgba(34, 174, 69, 0.8);
   text-transform: uppercase;
   transition: all 0.3s ease-in-out;
 }

 .list-volume-discount .volume-discount-item .tag-sale {
   position: absolute;
   padding: 6px 10px;
   font-size: 12px;
   line-height: 18px;
   font-weight: 500;
   display: flex;
   align-items: center;
   gap: 4px;
   color: var(--rgba-white);
   top: -2px;
   right: -15px;
   border-radius: 4px;
   border-radius: 4px;
   animation: pulse-rotate 1s infinite;
 }

 .list-volume-discount .volume-discount-item .tag-sale .icon {
   font-size: 14px;
   color: var(--white);
 }

 .list-volume-discount .volume-discount-item .tag-sale.pos2 {
   right: -15px;
   animation-delay: 0.5s;
 }

 .list-volume-discount .volume-discount-item.active,
 .list-volume-discount .volume-discount-item:hover {
   background-color: #22ae45;
   border-color: #22ae45;
 }

 .list-volume-discount .volume-discount-item.active .check,
 .list-volume-discount .volume-discount-item:hover .check {
   border-color: var(--white);
 }

 .list-volume-discount .volume-discount-item.active .discount-price .price-new,
 .list-volume-discount .volume-discount-item.active .discount-price .price-old,
 .list-volume-discount .volume-discount-item.active .info-discount,
 .list-volume-discount .volume-discount-item.active span,
 .list-volume-discount .volume-discount-item:hover .discount-price .price-new,
 .list-volume-discount .volume-discount-item:hover .discount-price .price-old,
 .list-volume-discount .volume-discount-item:hover .info-discount,
 .list-volume-discount .volume-discount-item:hover span {
   color: var(--white);
 }

 .list-volume-discount .volume-discount-item.active .tag-shipping,
 .list-volume-discount .volume-discount-item:hover .tag-shipping {
   border-color: var(--white);
   color: var(--white);
 }

 .tf-product-volume-discount-thumbnail {
   padding: 15px;
   border-radius: 16px;
   border: 1px solid var(--line);
   overflow-x: auto;
   padding: 20px 15px 30px;
 }

 .tf-product-volume-discount-thumbnail .title-discount {
   margin-bottom: 30px;
 }

 .tf-product-volume-discount-thumbnail .list-volume-discount-thumbnail {
   margin-bottom: 20px;
   padding-bottom: 10px;
 }

 .list-volume-discount-thumbnail {
   gap: 12px;
   width: 100%;
   max-width: 100%;
   overflow-x: auto;
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   margin-top: -15px;
   padding-top: 15px;
 }

 .list-volume-discount-thumbnail::-webkit-scrollbar {
   width: 4px;
   height: 4px;
 }

 .list-volume-discount-thumbnail::-webkit-scrollbar-track {
   background-color: var(--bg-scrollbar-track);
 }

 .list-volume-discount-thumbnail::-webkit-scrollbar-thumb {
   background: var(--bg-scrollbar-thumb);
   border-radius: 4px;
 }

 .volume-discount-thumbnail-item {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   gap: 10px;
   padding: 24px 10px;
   transition: all 0.3s ease-in-out;
   border-radius: 8px;
   border: 2px solid var(--line);
   position: relative;
 }

 .volume-discount-thumbnail-item .content-discount {
   text-align: center;
 }

 .volume-discount-thumbnail-item .content-discount .price-new,
 .volume-discount-thumbnail-item .content-discount .price-old,
 .volume-discount-thumbnail-item .content-discount .count {
   opacity: 0.8;
 }

 .volume-discount-thumbnail-item .content-discount .price-new {
   font-weight: 500;
   color: var(--primary);
 }

 .volume-discount-thumbnail-item .content-discount .price-old {
   font-weight: 500;
   font-size: 14px;
   line-height: 20px;
   color: #b0b0b0;
 }

 .volume-discount-thumbnail-item .content-discount .tag-sold {
   padding: 3px 8px;
   border-radius: 4px;
   background-color: #ff9148;
   font-weight: 700;
   font-size: 10px;
   line-height: 14px;
   height: 20px;
   color: var(--white);
   margin-left: 4px;
 }

 .volume-discount-thumbnail-item .image-box {
   width: 140px;
   height: 160px;
   border-radius: 8px;
 }

 .volume-discount-thumbnail-item:hover,
 .volume-discount-thumbnail-item.active {
   border-color: #22ae45;
   background-color: #e9ffee;
 }

 .volume-discount-thumbnail-item .tag-sale {
   animation: pulse2 1s infinite;
   top: 0;
   margin-top: -15px;
   position: absolute;
   padding: 6px;
   font-size: 12px;
   line-height: 18px;
   font-weight: 500;
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 8px;
   color: var(--rgba-white);
   left: 15px;
   right: 15px;
   border-radius: 4px;
 }

 .volume-discount-thumbnail-item .tag-sale .icon {
   font-size: 14px;
   color: var(--white);
 }

 @keyframes pulse-rotate {
   0% {
     transform: scale(1) rotate(12deg);
   }

   50% {
     transform: scale(1.05) rotate(12deg);
   }

   100% {
     transform: scale(1) rotate(12deg);
   }
 }

 .card-product.style-wishlist {
   position: relative;
 }

 .card-product.style-wishlist>.icon {
   position: absolute;
   z-index: 25;
   top: 10px;
   right: 10px;
   width: 32px;
   height: 32px;
   font-size: 10px;
   border: 0;
   background-color: var(--white);
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   cursor: pointer;
   transition: all 0.3s ease-in-out;
 }

 .card-product.style-wishlist>.icon:hover {
   color: var(--primary);
 }

 .card-product.style-wishlist.style-3 .list-product-btn {
   bottom: 24px;
 }

 .card-product.style-2 .list-product-btn {
   top: unset;
   right: unset;
   left: 50%;
   transform: translateX(-50%);
   bottom: 8px;
   gap: 0;
   flex-direction: row;
 }

 .card-product.style-2 .list-product-btn li {
   transition-delay: unset !important;
 }

 .card-product.style-2 .list-product-btn li:first-child .box-icon {
   border: 1px solid var(--line);
   border-radius: 30px 0px 0px 30px;
 }

 .card-product.style-2 .list-product-btn li:last-child .box-icon {
   border-radius: 0px 30px 30px 0px;
 }

 .card-product.style-2 .list-product-btn li:not(:first-child) .box-icon {
   border: 1px solid var(--line);
   border-left-color: var(--white);
 }

 .card-product.style-2 .list-product-btn .box-icon {
   border-radius: unset;
 }

 .card-product.style-2 .list-product-btn .box-icon:hover {
   border-color: var(--dark) !important;
 }

 .card-product.style-2 .list-product-btn .box-icon .icon-cart2 {
   margin-left: 2px;
 }

 .card-product.style-3 .list-product-btn {
   top: unset;
   right: unset;
   left: 50%;
   transform: translateX(-50%);
   bottom: 50px;
   flex-direction: row;
 }

 .card-product.style-3 .list-product-btn .box-icon:hover {
   border-color: var(--dark) !important;
 }

 .card-product.out-of-stock .card-product-info {
   opacity: 0.6;
 }

 .card-product.out-of-stock .card-product-wrapper::before {
   content: "Sold Out";
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   display: flex;
   align-items: center;
   justify-content: center;
   width: 92px;
   height: 92px;
   border-radius: 50%;
   background-color: var(--dark);
   color: var(--white);
   font-family: var(--Poppins);
   font-size: 12px;
   font-weight: 500;
   line-height: 14px;
   opacity: 1;
   z-index: 5;
 }

 .card-product.out-of-stock .card-product-wrapper>* {
   opacity: 0.6;
 }

 

 .card-product .product-btn-main {
   position: absolute;
   z-index: 5;
   bottom: 8px;
   right: 8px;
   left: 8px;
   transition: all 0.3s ease-in-out;
   display: inline-flex;
   gap: 4px;
 }

 .card-product .product-btn-main .btn-main-product {
   background-color: var(--white);
   border-radius: 54px;
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 10px;
   padding: 6px;
   width: 100%;
 }

 .card-product .product-btn-main .btn-main-product:hover {
   background-color: var(--dark);
   color: var(--white);
 }

 .card-product .product-btn-main .btn-main-product.add-to-cart {
   -webkit-line-clamp: 1;
   -webkit-box-orient: vertical;
   display: -webkit-box;
   overflow: hidden;
   white-space: nowrap;
   text-align: center;
 }

 .card-product .product-btn-main .btn-main-product.quickview {
   height: 36px;
   width: 36px;
   flex-shrink: 0;
   display: none;
 }

 .card-product .product-btn-main .icon {
   font-size: 17px;
 }

 .card-product .list-product-btn {
   bottom: 10px;
 }

 .card-product .on-sale-wrap {
   position: absolute;
   top: 10px;
   right: 10px;
   left: 10px;
   z-index: 5;
   display: flex;
   gap: 6px;
 }

 .card-product .on-sale-wrap.pos2 {
   top: 10px;
   right: 10px;
   left: 10px;
 }

 .card-product .on-sale-wrap.type-2 .on-sale-item {
   width: max-content;
 }

 .card-product .on-sale-item {
   display: inline-flex;
   justify-content: center;
   align-items: center;
   word-break: break-word;
   padding: 0px 10px;
   min-width: 50px;
   width: max-content;
   font-size: 13px;
   font-weight: 500;
   line-height: 26px;
   height: 26px;
   text-align: center;
   text-transform: capitalize;
   position: relative;
   background-color: var(--primary);
   color: var(--white);
   border-radius: 22px;
 }

 .card-product .on-sale-item.trending {
   background-color: #a474ff;
 }

 .card-product .on-sale-item.limited {
   background-color: #ff9c39;
 }

 .card-product .on-sale-item.new {
   background-color: #00bc29;
 }

 .card-product .price-wrap {
   font-size: 16px;
   line-height: 24px;
   color: var(--dark);
 }

 .card-product .price-wrap .price-new {
   margin-right: 2px;
   font-size: 15px; font-weight: 400;
 }

 .card-product .card-product-wrapper {
   aspect-ratio: 0.7037037037;
   position: relative;
   border-radius: 16px;
   overflow: hidden;
   z-index: 20;
   background-color: #f1f1f1;
 }

 .card-product .card-product-wrapper img {
   display: block;
   height: 100%;
   width: 100%;
   object-fit: cover;
   object-position: center;
   transition-duration: 700ms;
 }

 .card-product .card-product-wrapper:hover .product-img .img-product {
   opacity: 0;
 }

 .card-product .card-product-wrapper:hover .product-img .img-hover {
   display: block;
   z-index: 1;
   opacity: 1;
   transform: scale(1.05);
 }

 .card-product .product-img {
   display: flex;
   width: 100%;
   height: 100%;
   position: relative;
   align-items: stretch;
   overflow: hidden;
 }

 .card-product .product-img .img-hover {
   position: absolute;
   inset: 0;
   opacity: 0;
 }

 .card-product.none-hover-img .card-product-wrapper:hover .product-img .img-product {
   opacity: 1;
   transform: scale(1.05);
 }

 .card-product .list-product-btn {
   position: absolute;
   display: flex;
   align-items: center;
   flex-direction: column;
   gap: 8px;
   top: 8px;
   right: 8px;
   z-index: 6;
 }

 .card-product .box-icon {
   width: 35px;
   height: 35px;
   border-radius: 3px;
   background-color: var(--white);
   color: var(--dark);
   position: relative;
   border-radius: 50%;
 }

 .card-product .box-icon .icon {
   font-size: 14px;
 }

 .card-product .box-icon svg {
   width: 18px;
 }

 .card-product .box-icon svg path {
   transition: all 0.4s ease-in-out;
 }

 .card-product .box-icon:hover {
   background-color: var(--dark) !important;
   color: var(--white);
   border-color: var(--dark);
 }

 .card-product .countdown-box {
   display: none;
   bottom: 24px;
   position: absolute;
   z-index: 3;
   left: 0px;
   right: 0px;
   pointer-events: none;
   transition: 0.3s ease-out 0s;
   text-align: center;
   overflow: hidden;
   margin: 0 auto;
   justify-content: center;
   align-items: center;
   flex-wrap: wrap;
   padding: 10px 20px;
   max-height: 40px;
   background-color: var(--white);
   width: max-content;
   border-radius: 22px;
   color: var(--primary);
 }

 .card-product .countdown-box .countdown__timer {
   display: flex;
   gap: 4px;
 }

 .card-product .countdown-box .countdown__item {
   font-size: 12px;
   font-weight: 500;
   line-height: 14px;
 }

 .card-product .countdown-box.style-2 {
   background-color: #ffeded;
 }

 .card-product .countdown-box.style-3 {
   padding: 10px 30px;
   background-color: var(--primary);
   color: var(--white);
   gap: 10px;
 }

 .card-product .countdown-box.style-3 .icon {
   font-size: 18px;
 }

 .card-product .countdown-box.pos1 {
   bottom: 16px;
 }

 .card-product .card-product-info {
   padding-top: 15px;
   padding-bottom: 15px;
   gap: 6px;
   display: grid;
 }

 .card-product .card-product-info .inner-info-product {
   display: grid;
   gap: 6px;
 }

 .card-product .card-product-info .list-infor {
   display: grid;
   text-align: left;
   gap: 10px;
   padding-top: 10px;
   padding-bottom: 10px;
   margin-left: auto;
   margin-right: auto;
 }

 .card-product .card-product-info .list-infor .item {
   display: flex;
   gap: 10px;
   align-items: center;
 }

 .card-product .card-product-info .list-infor .item svg {
   flex-shrink: 0;
 }

 .card-product .card-product-info .list-infor.pb-30 {
   padding-bottom: 30px;
 }

 .card-product .name-product {
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   display: -webkit-box;
   overflow: hidden;
   text-transform: capitalize;
   letter-spacing: .2em;
    text-transform: uppercase;
    font-weight: 400;
    font-style: normal;
   font-family: var(--Montserrat);
 }

 .card-product .list-color-product {
   margin-top: 2px;
 }

 .card-product .marquee-product {
   position: absolute;
   transition: all 0.3s ease-in-out;
   left: 0;
   bottom: 0;
   overflow-x: hidden;
   display: flex;
   flex-direction: row;
   width: 100%;
   transform: none;
   z-index: 5;
   padding: 5px 0px;
   background-color: #957127;
   backdrop: blur(4px);
 }

 .card-product .marquee-product .infiniteslide {
   gap: 24px;
 }

 .card-product .marquee-product .infiniteslide .brand-item {
   height: unset;
   opacity: 1 !important;
 }

 .card-product.style-list {
   display: flex;
   gap: 12px;
 }

 .card-product.style-list .product-img {
   max-width: 342px;
 }

 .card-product.style-list .card-product-info {
   gap: 12px;
   display: grid;
   align-content: flex-start;
   width: 60%;
   padding: 0;
   flex-shrink: 0;
 }

 .card-product.style-list .info-list {
   display: grid;
   gap: 8px;
   width: 100%;
 }

 .card-product.style-list .list-product-btn {
   display: flex;
   position: unset;
   flex-direction: unset;
   justify-content: flex-start;
   gap: 10px;
 }

 .card-product.style-list .btn-main-product.add-to-cart {
   max-width: 331px;
   width: 100%;
   text-transform: none;
 }

 .card-product.style-list .box-icon {
   border: 1px solid var(--line);
   flex-shrink: 0;
 }

 .card-product.style-list .box-icon:hover {
   border-color: var(--line);
 }

 

 .card-product.style-center {
   border-radius: 16px;
   background-color: var(--white);
 }

 .card-product.style-center .card-product-wrapper {
   aspect-ratio: 0.95;
 }

 .card-product.style-center .card-product-info {
   padding: 20px 12px;
 }

 .card-product.style-center .list-color-product {
   margin-top: 5px;
 }

 .card-product.style-center .countdown-box {
   bottom: 0;
 }

 .card-product.style-center .swatch-value::before {
   content: "";
   position: absolute;
   border-radius: 50%;
   top: 1px;
   left: 1px;
   right: 1px;
   bottom: 1px;
   border: 1px solid #dcdcdc;
 }

 .card-product.style-border-3 {
   border: 1px solid var(--line);
 }

 .card-product.style-border-3 .card-product-wrapper {
   padding: 20px 12px;
   padding-bottom: 0px;
 }

 .card-product.style-book .card-product-wrapper {
   padding-left: 20px;
   padding-right: 20px;
 }

 .card-product .product-progress-sale {
   display: grid;
   gap: 6px;
   margin-top: 5px;
 }

 .card-product .product-progress-sale .box-quantity {
   gap: 4px;
 }

 .card-product .product-progress-sale .box-quantity .text-sold {
   text-align: left;
 }

 .card-product .product-progress-sale .box-quantity .text-avaiable {
   text-align: right;
 }

 .card-product .progress-sold {
   width: 100%;
   background-color: var(--line);
   height: 6px;
   position: relative;
   border-radius: 6px;
 }

 .card-product .progress-bar {
   position: relative;
   height: 100%;
   background-color: var(--primary);
   transition: width 2s ease;
   border-radius: 5px;
 }

 .card-product.style-4 .card-product-info {
   padding: 20px 12px;
 }

 .card-product.style-4 .list-color-product {
   gap: 4px;
   margin-top: 4px;
 }

 .card-product.style-3 .product-btn-main .icon {
   margin-top: -3px;
 }

 .card-product .stock {
   font-size: 16px;
   font-weight: 400;
   line-height: 26px;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }

 .card-product .stock .dot {
   display: inline-block;
   width: 10px;
   height: 10px;
   border-radius: 50%;
   position: relative;
 }

 .card-product .stock .dot::after {
   content: "";
   position: absolute;
   top: 2px;
   right: 2px;
   left: 2px;
   bottom: 2px;
   border-radius: 50%;
   z-index: 2;
 }

 .card-product .stock.in-stock {
   color: #59a33b;
 }

 .card-product .stock.in-stock .dot {
   background-color: rgba(120, 203, 87, 0.3411764706);
 }

 .card-product .stock.in-stock .dot::after {
   background-color: #78cb57;
 }

 .card-product .stock.out-stock {
   color: #ef5757;
 }

 .card-product .stock.out-stock .dot {
   background-color: rgba(203, 87, 87, 0.3411764706);
 }

 .card-product .stock.out-stock .dot::after {
   background-color: #ef5757;
 }

 .card-product .list-capacity-product .list-color-item {
   width: unset;
   height: unset;
   border-radius: 35px;
   border: 1px solid rgba(142, 142, 142, 0.2);
 }

 .card-product .list-capacity-product .list-color-item .text-quantity {
   padding: 2px 12px;
 }

 .card-product .list-capacity-product .list-color-item.active {
   border-color: var(--dark);
 }

 .card-product.style-5 {
   border-radius: 16px;
   background-color: var(--white);
 }

 .card-product.style-5 .card-product-info {
   padding: 20px 12px 22px;
 }

 .card-product.style-5 .card-product-info .tf-btn {
   width: 100%;
 }

 .card-product.style-5 .btn-addcart,
 .card-product.style-5 .stock {
   margin-top: 10px;
 }

 .card-product.style-border {
   border: 1px solid var(--line);
   border-radius: 16px;
   position: relative;
   background-color: var(--white);
 }

 .card-product.style-border .card-product-wrapper {
   padding: 20px 12px;
 }

 .card-product.style-border .card-product-wrapper img {
   height: auto;
 }

 .card-product.style-border .card-product-wrapper .list-product-btn {
   bottom: 16px;
 }

 .card-product.style-border .countdown-box {
   bottom: 16px;
 }

 .card-product.style-border .card-product-info {
   padding: 0px 12px 20px;
 }

 .card-product.style-border .card-product-info .type {
   opacity: 0.6;
 }

 .card-product.style-border-2 {
   border: 1px solid var(--line);
   border-radius: 16px;
   background-color: var(--white);
 }

 .card-product.style-border-2 .card-product-wrapper {
   padding: 12px;
   padding-bottom: 20px;
 }

 .card-product.style-border-2 .product-img {
   border-radius: 16px;
   overflow: hidden;
 }

 .card-product.style-border-2 .card-product-info {
   padding: 0px 12px 20px;
 }

 .card-product.style-border-2 .product-progress-sale {
   margin: 6px 0px;
 }

 .card-product.style-border-2 .countdown-box {
   bottom: 12px;
 }

 .card-product.style-border-2.border-type-3 .tf-btn {
   margin-top: 8px;
 }

 .card-product.style-border-2.border-type-4 .card-product-wrapper {
   padding: 12px 11px 8px;
 }

 .card-product.style-border-2.border-type-4 .card-product-info {
   padding: 0px 12px 16px;
 }

 .card-product.style-border-2.border-type-4 .list-product-btn {
   bottom: 8px;
 }

 .card-product.style-border-2.border-type-4 .list-product-btn .box-icon:hover {
   background-color: var(--purple) !important;
   border-color: var(--purple) !important;
 }

 .card-product.style-border-2.border-type-4 .tooltip,
 .card-product.style-border-2.border-type-4 .tooltip::before {
   background-color: var(--purple) !important;
 }

 .card-product.style-border-2.border-type-5 .product-progress-sale {
   margin: 0;
 }

 .card-product.style-border-2.border-type-5 .card-product-info {
   gap: 12px;
 }

 .card-product.style-border-2.style-box-bg .list-product-btn {
   bottom: 14px;
 }

 .card-product.style-border-2.style-box-bg .list-product-btn .box-icon:hover {
   background-color: var(--purple) !important;
   border-color: var(--purple) !important;
 }

 .card-product.style-border-2.style-box-bg .tooltip,
 .card-product.style-border-2.style-box-bg .tooltip::before {
   background-color: var(--purple) !important;
 }

 .card-product.line-purple .countdown-box {
   bottom: 14px;
 }

 .card-product.style-space .card-product-wrapper {
   padding: 12px 10px 20px;
 }

 .card-product.style-space .card-product-info {
   padding: 0px 10px 20px;
 }

 .card-product.style-space-2 .card-product-wrapper {
   padding: 12px 10px 20px;
 }

 .card-product.style-space-2 .card-product-info {
   padding: 0px 10px 20px;
 }

 .card-product.btn-brown .list-product-btn .box-icon:hover {
   background-color: #bb8f60 !important;
   border-color: #bb8f60 !important;
 }

 .card-product.btn-brown .list-product-btn .box-icon .tooltip {
   background-color: #bb8f60;
 }

 .card-product.btn-brown .list-product-btn .box-icon .tooltip::before {
   background-color: #bb8f60;
 }

 .card-product.style-primary .list-product-btn .box-icon:hover {
   background-color: var(--primary) !important;
   border-color: var(--primary) !important;
 }

 .card-product.style-primary .list-product-btn .box-icon .tooltip {
   background-color: var(--primary);
 }

 .card-product.style-primary .list-product-btn .box-icon .tooltip::before {
   background-color: var(--primary);
 }

 .card-product.style-primary .tf-btn {
   background-color: rgb(var(--primary-rgb)/0.15);
   border: none;
   color: var(--primary);
 }

 .card-product.style-primary:hover .tf-btn {
   background-color: var(--primary);
   color: var(--white);
 }

 .card-product.style-primary.style-3 .list-product-btn {
   bottom: 10px;
 }

 .card-product.style-bg {
   border-radius: 20px;
   overflow: hidden;
 }

 .card-product.style-bg .card-product-wrapper {
   border-radius: 0;
 }

 .card-product.style-bg .card-product-info {
   transition: all 0.3s ease-in-out;
   background-color: var(--surface-2);
   padding-left: 15px;
   padding-right: 15px;
 }

 .card-product.style-bg .item .text,
 .card-product.style-bg .price-old,
 .card-product.style-bg .sub,
 .card-product.style-bg .price-wrap {
   transition: all 0.3s ease-in-out;
 }

 .card-product.style-bg .dir {
   max-width: 342px;
   width: 100%;
   background-color: var(--line);
   height: 1px;
   margin: auto;
   transition: all 0.3s ease-in-out;
 }

 .card-product.style-bg .tf-btn {
   max-width: 226px;
   width: 100%;
   margin: auto;
   background-color: var(--dark-5);
   text-transform: uppercase;
   font-weight: 600;
   border: 0;
 }

 .card-product.style-bg:hover .card-product-info {
   background-color: var(--dark);
   color: var(--white);
 }

 .card-product.style-bg:hover .card-product-info .item .text,
 .card-product.style-bg:hover .card-product-info .price-old,
 .card-product.style-bg:hover .card-product-info .price-wrap,
 .card-product.style-bg:hover .card-product-info .name-product,
 .card-product.style-bg:hover .card-product-info .sub {
   color: var(--white) !important;
 }

 .card-product.style-bg:hover .dir {
   background-color: #515151;
 }

 .card-product.style-bg:hover .tf-btn {
   background-color: var(--white);
   color: var(--dark);
 }

 .card-product .rgb-primary {
   background-color: rgb(var(--primary-rgb)/0.15);
   border: none;
   color: var(--primary);
 }

 .card-product:hover .rgb-primary {
   background-color: var(--primary);
   color: var(--white);
 }

 .list-color-product {
   display: flex;
   flex-wrap: wrap;
   gap: 3px;
   align-items: center;
 }

 .list-color-product .list-color-item {
   width: 20px;
   height: 20px;
   border: 1px solid transparent;
   background-color: transparent;
   transition: all 0.4s ease-in-out;
   border-radius: 50%;
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: center;
   position: relative;
 }

 .list-color-product .list-color-item .swatch-value {
   width: 100%;
   height: 100%;
   border: 2px solid var(--white);
   display: inline-block;
   border-radius: 50%;
   transition: all 0.3s ease-in-out;
 }

 .list-color-product .list-color-item img {
   visibility: hidden;
   width: 18px;
   height: 18px;
   position: absolute;
 }

 .list-color-product .list-color-item.style-img {
   width: 40px;
   height: 40px;
 }

 .list-color-product .list-color-item.style-img img {
   width: 32px;
   height: 32px;
   border-radius: 50%;
   visibility: visible;
   object-fit: cover;
 }

 .list-color-product .list-color-item.line {
   border: 1px solid transparent !important;
 }

 .list-color-product .list-color-item.line .swatch-value {
   position: relative;
 }

 .list-color-product .list-color-item.line .swatch-value::before {
   content: "";
   position: absolute;
   width: 100%;
   height: 100%;
   border: 1px solid var(--rgba-dark-3);
   top: 0;
   left: 0;
   z-index: 1;
   border-radius: 50%;
   transition: all 0.3s ease-in-out;
 }

 .list-color-product .list-color-item.white.active,
 .list-color-product .list-color-item.white:hover {
   border-color: var(--white) !important;
 }

 .list-color-product .list-color-item.active,
 .list-color-product .list-color-item:hover {
   border-color: var(--dark) !important;
 }

 .list-color-product .list-color-item.active .swatch-value,
 .list-color-product .list-color-item:hover .swatch-value {
   border-color: var(--white);
 }

 .list-color-product .list-color-item.active .swatch-value::before,
 .list-color-product .list-color-item:hover .swatch-value::before {
   border-color: var(--line);
 }

 .list-color-product .list-color-item.active.border-color-black,
 .list-color-product .list-color-item:hover.border-color-black {
   border-color: #252525 !important;
 }

 .list-color-product.style-2 .list-color-item.active .swatch-value,
 .list-color-product.style-2 .list-color-item:hover .swatch-value {
   border-color: #e7ecd2;
 }

 .list-color-product.style-2 .swatch-value {
   border: 2px solid #e7ecd2;
 }

 .price-wrap .price-old {
   color: var(--dark);
   opacity: 0.6;
   position: relative;
 }

 .price-wrap .price-old::after {
   content: "";
   position: absolute;
   width: 100%;
   height: 0.5px;
   background-color: var(--dark);
   opacity: 0.6;
   top: 50%;
   left: 0;
   transform: translateY(-50%);
 }

 .price-wrap .price-old.old-line {
   color: var(--line-3);
   opacity: 1;
 }

 .price-wrap .price-old.old-line::after {
   background-color: var(--line-3);
 }

 .tf-sticky-btn-atc {
   position: fixed;
   width: 100%;
   bottom: 0;
   z-index: 70;
   box-shadow: 4px -4px 5px rgba(0, 0, 0, 0.03);
   background-color: var(--white);
   transition: all 0.3s linear;
   transform: translateY(100%);
 }

 .tf-sticky-btn-atc .tf-height-observer {
   padding: 14px 0;
   column-gap: 5px;
 }

 .tf-sticky-btn-atc .tf-sticky-atc-product {
   flex: 1 0 0%;
   gap: 15px;
 }

 .tf-sticky-btn-atc .tf-sticky-atc-img {
   width: 72px;
   height: 72px;
   flex-shrink: 0;
 }

 .tf-sticky-btn-atc .tf-sticky-atc-img img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   border-radius: 50%;
 }

 .tf-sticky-btn-atc .tf-sticky-atc-variant-price {
   min-width: 249px;
 }

 .tf-sticky-btn-atc .tf-sticky-atc-title {
   font-size: 16px;
   line-height: 19px;
 }

 .tf-sticky-btn-atc .tf-sticky-atc-btns,
 .tf-sticky-btn-atc .tf-sticky-atc-infos form {
   display: flex;
   gap: 12px;
   align-items: center;
 }

 .tf-sticky-btn-atc .tf-btn {
   min-width: 190px;
 }

 .tf-sticky-btn-atc.show {
   transform: translateY(0);
 }

 .product-skincare .tf-product-media-thumbs-1 .swiper-slide {
   width: 109px !important;
   height: 109px !important;
 }

 .product-skincare .tf-product-media-thumbs-1 img {
   width: 109px !important;
   height: 109px !important;
 }

 .form-group-product .tf-product-total-quantity {
   display: grid;
   gap: 12px;
 }

 .form-group-product .table-group-product {
   margin-bottom: 24px;
   overflow: auto;
 }

 .form-group-product .item-product {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 24px;
 }

 .form-group-product .item-product:not(:last-child) {
   margin-bottom: 16px;
 }

 .form-group-product .item-product .img-product {
   width: 83px;
   height: 83px;
   border-radius: 4px;
 }

 .form-group-product .item-product .item-product-name {
   display: flex;
   align-items: center;
   gap: 16px;
   max-width: 265px;
   width: 100%;
   flex-shrink: 0;
 }

 .form-group-product .item-product .item-product-content {
   flex-grow: 1;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 24px;
 }

 .form-group-product .item-product .item-product-price {
   max-width: 150px;
   width: 100%;
   flex-shrink: 0;
 }

 .form-group-product .item-product .price-new {
   color: var(--primary);
 }

 .form-group-product .item-product .price-old {
   color: var(--rgba-dark);
   text-decoration: line-through;
 }

 .form-group-product .item-product .note {
   margin-top: 6px;
   font-size: 12px;
   line-height: 18px;
 }

 .form-group-product .item-product .available {
   color: var(--primary);
 }

 .form-group-product .item-product .in-stock {
   color: #34a853;
 }

 .form-group-product .item-product .tf-btn,
 .form-group-product .item-product .wg-quantity {
   flex-shrink: 0;
 }

 .form-group-product .item-product .item-product-action {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 12px;
 }

 .tf-product-cate-sku {
   display: grid;
   gap: 12px;
 }

 .tf-product-cate-sku .item-cate-sku {
   display: flex;
   align-items: center;
   gap: 10px;
 }

 .tf-product-cate-sku .label {
   color: var(--text);
 }

 .tf-product-heading .btn-out-stock {
   margin-top: 8px;
 }

 .form-out-stock {
   border-radius: 10px;
   border: 1px solid var(--dark);
   padding: 30px 15px;
   display: grid;
   gap: 24px;
 }

 .form-out-stock .box-title-out-stock {
   display: grid;
   gap: 12px;
 }

 .form-out-stock .group-form-field {
   display: grid;
   gap: 15px;
 }

 .tf-product-payment-shipping {
   display: grid;
   gap: 24px;
 }

 .form-buyX-getY {
   border-radius: 16px;
   border: 1px solid #272727;
   padding: 30px 20px;
 }

 .form-buyX-getY .title-buyX-getY {
   text-align: center;
   margin-bottom: 32px;
 }

 .form-buyX-getY .tf-btn {
   width: 100%;
 }

 .form-buyX-getY .item-product {
   text-align: center;
   padding: 12px;
   border: 1px solid var(--line);
   border-radius: 10px;
   transition: all 0.3s ease-in-out;
   position: relative;
 }

 .form-buyX-getY .item-product:hover {
   box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.1019607843);
 }

 .form-buyX-getY .item-product img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .form-buyX-getY .item-product .img-product {
   border-radius: 8px;
   overflow: hidden;
 }

 .form-buyX-getY .item-product select {
   padding-top: 7px;
   padding-bottom: 7px;
   font-size: 14px;
   line-height: 20px;
   color: rgba(102, 112, 133, 0.8);
   border-radius: 6px;
 }

 .form-buyX-getY .item-product .info-product {
   padding-top: 20px;
 }

 .form-buyX-getY .item-product .name-product {
   margin-bottom: 10px;
   display: block;
 }

 .form-buyX-getY .item-product .price-product {
   display: inline-flex;
   gap: 6px;
 }

 .form-buyX-getY .item-product .variant-product {
   margin-top: 14px;
 }

 .form-buyX-getY .item-product .new-price {
   color: var(--primary);
 }

 .form-buyX-getY .item-product .old-price {
   text-decoration: line-through;
   color: rgba(0, 0, 0, 0.6);
 }

 .form-buyX-getY .item-product .ribbon {
   position: absolute;
   top: -7px;
   left: -7px;
   background-color: #a78bfa;
   color: var(--white);
   padding: 5px;
   padding-left: 14px;
   padding-right: 28px;
   text-transform: uppercase;
   font-weight: 500;
   clip-path: polygon(100% 0%, 86% 50%, 100% 100%, 0 100%, 0% 50%, 0 0);
   z-index: 2;
 }

 .form-buyX-getY .item-product::before {
   content: "";
   position: absolute;
   top: 26px;
   left: -7px;
   border-top: 7px solid #7154b4;
   border-right: 7px solid transparent;
   transform: rotate(90deg);
 }

 .form-buyX-getY .group-item-product {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 6px;
   margin-bottom: 32px;
 }

 .form-buyX-getY .group-item-product .arrow {
   width: 52px;
   height: 52px;
   margin-left: -12px;
 }

 .tb-info-product {
   border-spacing: 0;
   border-collapse: collapse;
   width: 100%;
   border-radius: 5px;
   border-style: hidden;
   box-shadow: 0 0 0 1px var(--line);
   color: #1f1f1f;
 }

 .tb-info-product tr {
   border: 1px solid var(--line);
   vertical-align: middle;
 }

 .tb-info-product tr th {
   padding: 10px 20px;
   border-right: 1px solid var(--line);
   font-weight: 500;
   background-color: #f3f3f3;
 }

 .tb-info-product tr td {
   padding: 10px 20px;
 }

 .wd-customer-review {
   display: flex;
   align-items: flex-start;
   gap: 32px;
 }

 .wd-customer-review .review-heading {
   max-width: 289px;
   width: 100%;
   display: grid;
   justify-items: flex-start;
   gap: 32px;
 }

 .wd-customer-review .review-heading .icon-star {
   font-size: 15px;
   color: #ff6f61;
 }

 .wd-customer-review .box-rate-review {
   display: grid;
   gap: 16px;
   width: 100%;
 }

 .wd-customer-review .rating-summary {
   display: flex;
   justify-content: space-between;
   align-items: center;
 }

 .wd-customer-review .rating-summary .list-star {
   display: flex;
   align-items: center;
   gap: 5px;
 }

 .wd-customer-review .rating-breakdown-item {
   display: flex;
   align-items: center;
   gap: 10px;
 }

 .wd-customer-review .rating-breakdown-item:not(:last-child) {
   margin-bottom: 6px;
 }

 .wd-customer-review .rating-breakdown-item .rating-score {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 5px;
   width: 34px;
   flex-shrink: 0;
 }

 .wd-customer-review .rating-breakdown-item .rating-bar {
   width: 100%;
   height: 4px;
   background-color: var(--line);
 }

 .wd-customer-review .rating-breakdown-item .value {
   background-color: var(--dark);
   height: 100%;
 }

 .wd-customer-review .review-section {
   flex-grow: 1;
 }

 .wd-customer-review .review-item {
   display: flex;
   gap: 15px;
 }

 .wd-customer-review .review-item:not(:last-child) {
   margin-bottom: 24px;
 }

 .wd-customer-review .review-item .review-avt {
   width: 48px;
   height: 48px;
   border-radius: 50%;
   overflow: hidden;
   flex-shrink: 0;
 }

 .wd-customer-review .review-item .review-avt img {
   width: 100%;
   height: 100%;
 }

 .wd-customer-review .review-item .review-content {
   display: grid;
   gap: 15px;
 }

 .wd-customer-review .review-item .review-meta {
   display: flex;
   align-items: center;
   gap: 10px;
 }

 .wd-customer-review .review-item .review-info {
   display: flex;
   align-items: center;
   justify-content: space-between;
   flex-wrap: wrap;
   gap: 10px;
 }

 .wd-customer-review .review-item .review-author {
   padding-right: 10px;
   position: relative;
 }

 .wd-customer-review .review-item .review-author::after {
   content: "";
   position: absolute;
   right: 0;
   top: 50%;
   transform: translateY(-50%);
   height: 14px;
   width: 1px;
   background-color: var(--line);
 }

 .wd-customer-review .review-item .list-star {
   display: flex;
   gap: 5px;
   align-items: center;
 }

 .wd-customer-review .review-item .list-star .icon {
   font-size: 15px;
   color: var(--dark);
 }

 .wd-customer-review .review-item .star-4 .icon {
   color: #d2d2d2;
 }

 .wd-customer-review .review-item .star-4 .icon:nth-child(1),
 .wd-customer-review .review-item .star-4 .icon:nth-child(2),
 .wd-customer-review .review-item .star-4 .icon:nth-child(3),
 .wd-customer-review .review-item .star-4 .icon:nth-child(4) {
   color: var(--dark);
 }

 .wd-customer-review .review-item .star-3 .icon {
   color: #d2d2d2;
 }

 .wd-customer-review .review-item .star-3 .icon:nth-child(1),
 .wd-customer-review .review-item .star-3 .icon:nth-child(2),
 .wd-customer-review .review-item .star-3 .icon:nth-child(3) {
   color: var(--dark);
 }

 .wd-customer-review .review-item .star-2 .icon {
   color: #d2d2d2;
 }

 .wd-customer-review .review-item .star-2 .icon:nth-child(1),
 .wd-customer-review .review-item .star-2 .icon:nth-child(2) {
   color: var(--dark);
 }

 .wd-customer-review .review-item .star-1 .icon {
   color: #d2d2d2;
 }

 .wd-customer-review .review-item .star-1 .icon:nth-child(1) {
   color: var(--dark);
 }

 .wd-customer-review .review-list {
   padding-bottom: 32px;
   margin-bottom: 32px;
   border-bottom: 1px solid var(--line);
 }

 .form-review .box-rating {
   display: flex;
   align-items: center;
   gap: 20px;
   margin-bottom: 24px;
 }

 .form-review .note,
 .form-review .title {
   margin-bottom: 24px;
 }

 .form-review .group-2-ip {
   margin-bottom: 10px;
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 10px;
 }

 .form-review .check-save {
   display: flex;
   align-items: center;
   gap: 8px;
   margin-top: 24px;
 }

 .form-review .tf-btn {
   margin-top: 32px;
   max-width: 171px;
   width: 100%;
 }

 /* custom rating */
 .list-rating-check {
   display: flex;
   flex-direction: row-reverse;
   justify-content: left;
   gap: 5px;
 }

 .list-rating-check:not(:checked)>input {
   position: absolute;
   opacity: 0;
 }

 .list-rating-check:not(:checked)>label {
   font-size: 15px;
   cursor: pointer;
   white-space: nowrap;
   width: 15px;
   color: #d2d2d2;
   transition: all 0.2s ease-in-out;
 }

 .list-rating-check:not(:checked)>label:before {
   font-family: "icomoon";
   content: "\e95b";
 }

 .list-rating-check>input:checked~label {
   color: var(--dark);
 }

 .list-rating-check:not(:checked)>label:hover,
 .list-rating-check:not(:checked)>label:hover~label {
   color: var(--dark);
 }

 .list-rating-check>input:checked+label:hover,
 .list-rating-check>input:checked+label:hover~label,
 .list-rating-check>input:checked~label:hover,
 .list-rating-check>input:checked~label:hover~label,
 .list-rating-check>label:hover~input:checked~label {
   color: var(--dark);
 }

 /*------------ testimonial ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .wg-testimonial {
   border-radius: 16px;
   overflow: hidden;
   border: 1px solid var(--line);
 }

 .wg-testimonial .content-top {
   padding: 12px;
   display: grid;
   gap: 10px;
 }

 .wg-testimonial .br-line {
   width: 100%;
   height: 1px;
   background-color: var(--line);
 }

 .wg-testimonial .box-avt {
   padding: 12px;
   display: flex;
   align-items: center;
   gap: 6px;
 }

 .wg-testimonial .box-avt .avatar {
   flex-shrink: 0;
   width: 64px;
   height: 64px;
   border-radius: 50%;
   overflow: hidden;
 }

 .wg-testimonial .box-avt .name-item {
   display: flex;
   gap: 4px;
   align-items: center;
   flex-wrap: wrap;
 }

 .wg-testimonial .box-author {
   display: flex;
   align-items: center;
   gap: 8px;
 }

 .wg-testimonial .box-price {
   display: grid;
   gap: 3px;
 }

 .wg-testimonial.style-row {
   display: flex;
 }

 .wg-testimonial.style-row .image {
   flex-shrink: 0;
   width: 30%;
 }

 .wg-testimonial.style-2 .box-author .avt {
   max-width: 28px;
   border-radius: 50%;
   overflow: hidden;
 }

 .wg-testimonial.style-2 .box-avt .avatar {
   width: 72px;
   height: 72px;
 }

 .wg-testimonial.style-2 .list-star-default i {
   color: #edcb23;
 }

 .wg-testimonial.style-2.type-2 {
   padding: 20px;
 }

 .wg-testimonial.style-2.type-2 .br-line {
   margin: 15px 0px;
 }

 .wg-testimonial.style-2.type-2 .content-top {
   padding: 0px;
 }

 .wg-testimonial.style-2.type-2 .box-avt {
   padding: 0px;
 }

 .wg-testimonial.style-2.type-2 .bot {
   display: flex;
   align-items: center;
   justify-content: space-between;
 }

 .wg-testimonial.style-2 .box-btn .icon {
   font-size: 12px;
 }

 .box-verified {
   display: flex;
   align-items: center;
   gap: 4px;
 }

 .list-star-default {
   display: flex;
   align-items: center;
   gap: 5px;
 }

 .list-star-default i {
   color: #98ab23;
   font-size: 14px;
 }

 .wrapper-thumbs-tes {
   background-color: #b99272;
   border-radius: 16px;
   overflow: hidden;
 }

 .wrapper-thumbs-tes .box-right {
   padding: 24px;
   place-content: center;
 }

 .wrapper-thumbs-tes .box-left {
   display: none;
 }

 .wrapper-thumbs-tes .box-testimonial-main .list-star-default i {
   color: #e3ff34;
 }

 .flat-thumbs-tes .img-sw-thumb,
 .flat-thumbs-tes .tf-thumb-tes {
   height: 100%;
 }

 .flat-thumbs-tes .img-sw-thumb img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .flat-thumbs-tes .sw-dot-default,
 .flat-thumbs-tes .box-nav-swiper {
   margin-top: 24px;
 }

 .flat-thumbs-tes .box-left .img-sw-thumb {
   background-color: var(--white);
 }

 .wrapper-thumbs-tes-2 .box-right {
   display: none;
 }

 .wrapper-thumbs-tes-2 .box-left {
   place-content: center;
 }

 .wrapper-thumbs-tes-2 .img-sw-thumb {
   border-radius: 16px;
   overflow: hidden;
 }

 .wrapper-thumbs-tes-4 .box-left {
   display: none;
 }

 .wrapper-thumbs-tes-4 .box-right {
   place-content: center;
 }

 .wrapper-thumbs-tes-4 .img-sw-thumb {
   border-radius: 16px;
   overflow: hidden;
 }

 .wrapper-thumbs-tes-4 .box-testimonial-main .box-content {
   display: grid;
   gap: 12px;
 }

 .wrapper-thumbs-tes-3 .box-right {
   display: none;
 }

 .wrapper-thumbs-tes-3 .box-left {
   place-content: center;
 }

 .wrapper-thumbs-tes-3 .img-sw-thumb {
   border-radius: 16px;
   overflow: hidden;
   height: auto;
 }

 .box-testimonial-main {
   display: grid;
   gap: 24px;
 }

 .box-testimonial-main .content {
   display: grid;
   gap: 20px;
 }

 .box-testimonial-main .content .title-review {
   font-size: 14px;
   line-height: 20px;
   font-weight: 500;
   text-transform: uppercase;
 }

 .box-testimonial-main .box-author {
   display: flex;
   align-items: center;
   gap: 12px;
 }

 .box-testimonial-main .box-author .img {
   width: 70px;
   height: auto;
   border-radius: 10px;
   overflow: hidden;
   flex-shrink: 0;
 }

 .box-testimonial-main .box-author .img img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .box-testimonial-main .box-author .info {
   display: grid;
   gap: 4px;
 }

 .box-testimonial-main .quote {
   font-size: 32px;
 }

 .wrapper-thumbs-tes-3 .box-testimonial-main .list-star-default .icon-star {
   color: #ffaa47;
 }

 .wrapper-thumbs-tes-3 .box-testimonial-main .text-review {
   font-size: 20px;
   line-height: 32px;
 }

 .wg-testimonial-2 .icon {
   font-size: 40px;
 }

 .wg-testimonial-2 .text {
   margin-top: 24px;
   line-height: 140%;
 }

 .wg-testimonial-3 {
   border-radius: 16px;
   display: grid;
   gap: 20px;
   margin-bottom: 20px;
 }

 .wg-testimonial-3 .box-top {
   display: grid;
   gap: 12px;
 }

 .wg-testimonial-3 .box-top .icon {
   font-size: 42px;
 }

 .wg-testimonial-3 .box-title-desc {
   display: grid;
   gap: 16px;
 }

 .wg-testimonial-3 .box-author {
   display: grid;
   gap: 4px;
 }

 .flat-wrapper-testimonial {
   overflow: hidden;
   padding: 30px;
   position: relative;
   border-radius: 16px;
 }

 .flat-wrapper-testimonial .img-item-1 {
   right: 0px;
   top: 40px;
   animation: swing 10s infinite ease-in-out;
 }

 .flat-wrapper-testimonial .img-item-2 {
   left: 16px;
   bottom: 30px;
   animation: swing 10s infinite ease-in-out;
 }

 .flat-wrapper-testimonial .sw-dot-default {
   margin-top: 0;
 }

 .flat-wrapper-testimonial .tf-swiper {
   max-width: 929px;
   margin: auto;
 }

 /*------------ lookbook ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .tf-pin-btn {
   cursor: pointer;
   transition: all 0.3s ease-in-out;
   position: relative;
 }

 .tf-pin-btn span {
   display: block;
   width: 25px;
   height: 25px;
   border: 9px solid var(--white);
   border-radius: 50%;
   background-color: var(--dark);
   transition: all 0.3s ease-in-out;
 }

 .tf-pin-btn span:hover::after,
 .tf-pin-btn span:hover::before {
   position: absolute;
   content: "";
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   border: solid 1px var(--white);
   border-radius: 50%;
 }

 .tf-pin-btn span:hover::before {
   animation: ripple-line 2s linear infinite;
 }

 .tf-pin-btn span:hover::after {
   animation: ripple-line 2s 1s linear infinite;
 }

 .tf-pin-btn.style-lg span {
   width: 28px;
   height: 28px;
 }

 .tf-pin-btn.style-hover:hover span {
   background-color: var(--primary);
 }

 .tf-pin-btn.style-dark {
   width: 28px;
   height: 28px;
   background-color: var(--white);
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 50%;
 }

 .tf-pin-btn.style-dark span {
   background-color: var(--dark);
   width: 12px;
   height: 12px;
   border: 0;
   transition: all 0.3s ease-in-out;
 }

 .tf-pin-btn.style-dark:hover {
   background-color: rgba(255, 255, 255, 0.7);
 }

 .tf-pin-btn.style-dark:hover span {
   background-color: var(--primary);
 }

 .tf-pin-btn2 {
   cursor: pointer;
   width: 27px;
   height: 27px;
   border-radius: 50%;
   position: relative;
   display: flex;
   align-items: center;
   justify-content: center;
   z-index: 1;
   background-color: rgba(255, 255, 255, 0.6);
   transition: all 0.3s ease-in-out;
 }

 .tf-pin-btn2 span {
   width: 9px;
   height: 9px;
   background-color: var(--dark);
   border-radius: 50%;
 }

 .tf-pin-btn2::after,
 .tf-pin-btn2::before {
   position: absolute;
   content: "";
   top: 0;
   bottom: 0;
   right: 0;
   left: 0;
   border-radius: 9999px;
   animation: ripple-fill 3s infinite;
 }

 .tf-pin-btn2::after {
   animation-delay: 0.5s;
 }

 .tf-pin-btn2::before {
   animation-delay: 0.9s;
 }

 .tf-pin-btn2.active {
   width: 32px;
   height: 32px;
 }

 .tf-pin-btn2.active span {
   width: 12px;
   height: 12px;
 }

 .collection-position-3 {
   position: relative;
 }

 .cls-lookbook {
   overflow: unset;
   position: relative;
 }

 .cls-lookbook .img-style {
   border-radius: 20px;
   display: block;
 }

 .cls-lookbook .lookbook-item {
   position: absolute;
   left: 30%;
   bottom: 32%;
 }

 .cls-lookbook .lookbook-item.position1 {
   left: 40%;
   bottom: 12%;
 }

 .cls-lookbook .lookbook-item.position2 {
   left: 32%;
   bottom: 18%;
 }

 .cls-lookbook .lookbook-item.position3 {
   left: 58%;
   bottom: 10%;
 }

 .cls-lookbook .lookbook-item.position4 {
   left: 36%;
   bottom: 45%;
 }

 .cls-lookbook .lookbook-item.position5 {
   left: 70%;
   bottom: 16%;
 }

 .tf-sw-lookbook .cls-lookbook {
   width: 100%;
   height: 100%;
 }

 .lookbook-item .dropdown-menu {
   border: none;
   border-radius: 0;
   background: transparent;
   padding: 0;
   z-index: 99;
 }

 .loobook-product {
   padding: 14px;
   background-color: var(--white);
   border-radius: 8px;
   display: flex;
   align-items: center;
   gap: 24px;
   position: relative;
 }

 .loobook-product .content {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 12px;
   width: 100%;
 }

 .loobook-product .info {
   display: grid;
   gap: 4px;
   text-align: start;
 }

 .loobook-product .price-wrap {
   display: flex;
   align-items: center;
   gap: 6px;
 }

 .loobook-product .img-style {
   border-radius: 0;
   flex-shrink: 0;
   border-radius: 4px;
   overflow: hidden;
 }

 .loobook-product .btn-lookbook {
   width: 45px;
   height: 45px;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   background-color: var(--dark);
   flex-shrink: 0;
   font-size: 17px;
 }

 .loobook-product .btn-lookbook i {
   color: var(--white);
 }

 .loobook-product .btn-lookbook:hover {
   background-color: var(--primary);
 }

 .loobook-product .price-old {
   color: #c9c9c9;
   opacity: 1;
 }

 .loobook-product .price-old::after {
   background-color: #c9c9c9;
 }

 .loobook-product::before {
   content: "";
   position: absolute;
   border-width: 8px;
   border-style: solid;
 }

 .loobook-product.style-row {
   flex-direction: row;
 }

 .loobook-product.style-row .img-style {
   max-width: 72px;
 }

 .dropup .loobook-product {
   margin-bottom: 20px;
   margin-top: 20px;
 }

 .dropup .loobook-product::before {
   border-color: var(--white) transparent transparent transparent;
   bottom: -4%;
   left: 50%;
   transform: translateX(-50%);
 }

 .lookbook-item .dropend .dropdown-menu {
   --bs-dropdown-min-width: max-content;
   margin-left: 15px !important;
 }

 .lookbook-item .dropend .loobook-product {
   margin: -36px 0px;
 }

 .sw-lookbook-wrap {
   padding-top: 70px;
   margin-top: -70px;
 }

 .banner-lookbook {
   position: relative;
   border-radius: 16px;
   overflow: hidden;
 }

 .banner-lookbook img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .banner-lookbook .lookbook-item {
   position: absolute;
   left: 52%;
   bottom: 32%;
 }

 .banner-lookbook .lookbook-item.position1 {
   left: 58%;
   bottom: 27%;
 }

 .banner-lookbook .lookbook-item.position2 {
   left: 32%;
   bottom: 14%;
 }

 .banner-lookbook .lookbook-item.position3 {
   left: 41%;
   bottom: 82%;
 }

 .dropdown-custom .dropdown-menu {
   --bs-dropdown-min-width: max-content;
 }

 .flat-with-text-lookbook {
   align-items: center;
 }

 .flat-with-text-lookbook .banner-img {
   position: relative;
 }

 .flat-with-text-lookbook .banner-img img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .flat-with-text-lookbook .banner-img .tf-pin-btn {
   position: absolute;
 }

 .flat-with-text-lookbook .banner-img .tf-pin-btn.pin-1 {
   top: 40%;
   left: 43%;
 }

 .flat-with-text-lookbook .banner-img .tf-pin-btn.pin-2 {
   top: 85%;
   left: 43%;
 }

 .flat-with-text-lookbook .lookbook-content .box-title {
   display: grid;
   gap: 12px;
   margin-bottom: 20px;
 }

 .flat-with-text-lookbook .lookbook-content .swiper {
   width: 100%;
 }

 .flat-with-text-lookbook .lookbook-content .total-lb {
   margin-top: 20px;
 }

 .flat-with-text-lookbook-v2 .banner-img {
   position: relative;
   width: 100%;
 }

 .flat-with-text-lookbook-v2 .banner-img img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .flat-with-text-lookbook-v2 .banner-img .tf-pin-btn {
   position: absolute;
 }

 .flat-with-text-lookbook-v2 .banner-img .tf-pin-btn.pin-1 {
   top: 42%;
   left: 25%;
 }

 .flat-with-text-lookbook-v2 .banner-img .tf-pin-btn.pin-2 {
   top: 30%;
   left: 44%;
 }

 .flat-with-text-lookbook-v2 .banner-img .tf-pin-btn.pin-3 {
   top: 62%;
   left: 80%;
 }

 .flat-with-text-lookbook-v2 .lookbook-content {
   padding: 0px 15px 40px;
   width: 100%;
 }

 .flat-with-text-lookbook-v2 .lookbook-content .box-title {
   display: grid;
   gap: 12px;
   margin-bottom: 20px;
 }

 .flat-with-text-lookbook-v2 .lookbook-content .swiper {
   width: 100%;
 }

 .flat-with-text-lookbook-v2 .lookbook-content .total-lb {
   margin-top: 20px;
 }

 .flat-wrapper-lookbook {
   display: block;
 }

 .flat-wrapper-lookbook .image-lookbook {
   width: 100%;
   height: 100%;
   position: relative;
   overflow: hidden;
 }

 .flat-wrapper-lookbook .image-lookbook img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .flat-wrapper-lookbook .image-lookbook .tf-pin-btn2 {
   position: absolute;
 }

 .flat-wrapper-lookbook .image-lookbook .pin-1 {
   left: 18%;
   bottom: 35%;
 }

 .flat-wrapper-lookbook .image-lookbook .pin-2 {
   left: 50%;
   bottom: 30%;
 }

 .flat-wrapper-lookbook .image-lookbook .pin-3 {
   right: 2%;
   top: 47%;
 }

 .flat-wrapper-lookbook .col-left {
   padding-top: 24px;
   padding-bottom: 24px;
 }

 .flat-wrapper-lookbook .card-product .tf-btn {
   font-size: 18px;
   line-height: 22px;
   text-transform: none;
 }

 .slider-wrap-lb {
   position: relative;
 }

 .slider-wrap-lb .title {
   margin-bottom: 24px;
 }

 .slider-wrap-lb .swiper-button-prev {
   left: 0;
 }

 .slider-wrap-lb .swiper-button-next {
   right: 0;
 }

 .slider-wrap-lb .nav-swiper {
   top: 50%;
 }

 .slider-wrap-lb .card-product .card-product-info {
   padding: 20px 2px;
 }

 @keyframes ripple-line {
   to {
     transform: scale(2);
     opacity: 0;
   }
 }

 @keyframes ripple-fill {
   0% {
     box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.5);
   }

   50% {
     box-shadow: 0 0 0 20px rgba(255, 255, 255, 0);
   }

   100% {
     box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
   }
 }

 .wrapper-lookbook-1 .image-lookbook .pin-1 {
   left: 63% !important;
   bottom: 30% !important;
 }

 .wrapper-lookbook-1 .image-lookbook .pin-2 {
   left: 49%;
   bottom: 49%;
 }

 /*------------ brand ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .brand-item {
   max-width: 240px;
   transition: all 0.3s ease-in-out;
 }

 .brand-item img {
   transition: all 0.3s ease-in-out;
 }

 .tf-brand:hover .brand-item {
   opacity: 0.4;
 }

 .tf-brand .brand-item:hover {
   opacity: 1;
 }

 .tf-brand.style-2 {
   padding: 24px 0;
   gap: 64px;
 }

 .tf-brand.style-2 .brand-item {
   max-width: unset;
   height: unset;
 }

 .fade-edge .infiniteslide_wrap {
   position: relative;
 }

 .fade-edge .infiniteslide_wrap::before,
 .fade-edge .infiniteslide_wrap::after {
   content: "";
   position: absolute;
   top: 0;
   bottom: 0;
   width: 40px;
   z-index: 5;
   pointer-events: none;
 }

 .fade-edge .infiniteslide_wrap::before {
   left: 0;
   background: linear-gradient(to right, #ffffff, transparent);
 }

 .fade-edge .infiniteslide_wrap::after {
   right: 0;
   background: linear-gradient(to left, #ffffff, transparent);
 }

 .sw-brand {
   border: 1px solid var(--line);
 }

 .sw-brand .brand-item {
   max-width: 100%;
   height: 100%;
 }

 .sw-brand:hover .swiper-slide img {
   opacity: 0.4;
 }

 .sw-brand .swiper-slide:hover img {
   opacity: 1;
 }

 .sw-brand .swiper-slide:not(:last-child) .brand-item {
   border-right: 1px solid var(--line);
 }

 .gallery-item {
   position: relative;
   border-radius: 8px;
   overflow: hidden;
 }

 .gallery-item .box-icon {
   width: 32px;
   height: 32px;
   border-radius: 50%;
   background-color: var(--white);
   position: absolute;
   z-index: 2;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   display: flex;
   align-items: center;
   justify-content: center;
   color: var(--dark);
   font-size: 12px;
 }

 .gallery-item .box-icon:hover {
   background-color: var(--dark);
   color: var(--white);
 }

 .wrap-gallery {
   position: relative;
 }

 .wrap-gallery .wrap-gallery-icon {
   display: flex;
   align-items: center;
   justify-content: center;
   background-color: #252525;
   color: var(--white);
   width: 64px;
   height: 64px;
   font-size: 20px;
   position: absolute;
   top: 55%;
   left: 50%;
   transform: translate(-50%, -50%);
   border-radius: 50%;
   z-index: 5;
   opacity: 0;
   visibility: hidden;
 }

 .wrap-gallery .wrap-gallery-icon:hover {
   color: #252525;
   background-color: var(--white);
 }

 .wrap-gallery:hover .wrap-gallery-icon {
   top: 50%;
   opacity: 1;
   visibility: visible;
 }

 /*------------ zoom ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .tf-zoom-main {
   position: sticky;
   top: 30px;
   z-index: 60;
 }

 .tf-zoom-main .drift-zoom-pane {
   top: 0;
   left: 0;
   height: 520px;
   max-width: 520px;
   width: 100%;
   background: #fff;
   -webkit-transform: translate3d(0, 0, 0);
   box-shadow: 0 1px 5px rgba(127, 127, 127, 0.0196078431), 0 5px 18px rgba(127, 127, 127, 0.2);
   z-index: 3;
 }

 .drift-bounding-box.drift-open {
   background: rgba(255, 255, 255, 0.2509803922);
   box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.4) inset;
   z-index: 5000;
 }

 .drift-zoom-pane {
   z-index: 5000;
 }

 .other-image-zoom {
   transition: all 0.3s ease-in-out;
 }

 .pswp__bg {
   background: var(--white);
 }

 .pswp__icn {
   fill: rgb(34, 34, 34);
   color: var(--white);
 }

 .pswp__icn .pswp__icn-shadow {
   stroke: var(--white);
   stroke-width: 1px;
   fill: none;
 }

 .pswp__counter {
   color: #222;
   text-shadow: 1px 1px 3px #ffffff;
 }

 .tf-model-viewer {
   width: 100%;
   height: 100%;
   position: relative;
 }

 .tf-model-viewer model-viewer {
   display: block;
   position: relative;
   z-index: 5;
   width: 100%;
   height: 100%;
 }

 .tf-model-viewer model-viewer.disabled {
   pointer-events: none;
 }

 .tf-model-viewer.active model-viewer {
   pointer-events: all;
 }

 .tf-model-viewer.active .wrap-btn-viewer {
   display: none;
 }

 /*------------ shop ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .noUi-target,
 .noUi-target * {
   -webkit-touch-callout: none;
   -webkit-tap-highlight-color: transparent;
   -webkit-user-select: none;
   -ms-touch-action: none;
   touch-action: none;
   -ms-user-select: none;
   -moz-user-select: none;
   user-select: none;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
 }

 .noUi-target {
   position: relative;
   direction: ltr;
 }

 .noUi-base,
 .noUi-connects {
   width: 100%;
   height: 100%;
   position: relative;
   z-index: 1;
 }

 .noUi-connects {
   overflow: hidden;
   z-index: 0;
 }

 .noUi-connect,
 .noUi-origin {
   will-change: transform;
   position: absolute;
   z-index: 1;
   top: 0;
   left: 0;
   height: 100%;
   width: 100%;
   transform-origin: 0 0;
 }

 html:not([dir=rtl]) .noUi-horizontal .noUi-origin {
   left: auto;
   right: 0;
 }

 .noUi-vertical .noUi-origin {
   width: 0;
 }

 .noUi-horizontal .noUi-origin {
   height: 0;
 }

 .noUi-handle {
   position: absolute;
 }

 .noUi-state-tap .noUi-connect,
 .noUi-state-tap .noUi-origin {
   transition: transform 0.3s;
 }

 .noUi-state-drag * {
   cursor: inherit !important;
 }

 .noUi-horizontal {
   height: 18px;
 }

 .noUi-horizontal .noUi-handle {
   width: 34px;
   height: 28px;
   left: -17px;
   top: -5px;
 }

 .noUi-vertical {
   width: 18px;
 }

 .noUi-vertical .noUi-handle {
   width: 28px;
   height: 34px;
   left: -6px;
   top: -17px;
 }

 html:not([dir=rtl]) .noUi-horizontal .noUi-handle {
   right: -17px;
   left: auto;
 }

 .noUi-draggable {
   cursor: ew-resize;
 }

 .noUi-vertical .noUi-draggable {
   cursor: ns-resize;
 }

 .noUi-handle:after {
   left: 17px;
 }

 .noUi-vertical .noUi-handle:after,
 .noUi-vertical .noUi-handle:before {
   width: 14px;
   height: 1px;
   left: 6px;
   top: 14px;
 }

 .noUi-vertical .noUi-handle:after {
   top: 17px;
 }

 [disabled] .noUi-connect {
   background: #b8b8b8;
 }

 [disabled] .noUi-handle,
 [disabled].noUi-handle,
 [disabled].noUi-target {
   cursor: not-allowed;
 }

 .noUi-pips,
 .noUi-pips * {
   box-sizing: border-box;
 }

 .noUi-pips {
   position: absolute;
   color: #999;
 }

 .noUi-value {
   position: absolute;
   white-space: nowrap;
   text-align: center;
 }

 .noUi-value-sub {
   color: #ccc;
   font-size: 10px;
 }

 .noUi-marker {
   position: absolute;
   background: #ccc;
 }

 .noUi-marker-sub {
   background: #aaa;
 }

 .noUi-marker-large {
   background: #aaa;
 }

 .noUi-pips-horizontal {
   padding: 10px 0;
   height: 80px;
   top: 100%;
   left: 0;
   width: 100%;
 }

 .noUi-value-horizontal {
   transform: translate(-50%, 50%);
 }

 .noUi-rtl .noUi-value-horizontal {
   transform: translate(50%, 50%);
 }

 .noUi-marker-horizontal.noUi-marker {
   margin-left: -1px;
   width: 2px;
   height: 5px;
 }

 .noUi-marker-horizontal.noUi-marker-sub {
   height: 10px;
 }

 .noUi-marker-horizontal.noUi-marker-large {
   height: 15px;
 }

 .noUi-pips-vertical {
   padding: 0 10px;
   height: 100%;
   top: 0;
   left: 100%;
 }

 .noUi-value-vertical {
   transform: translate(0, -50%, 0);
   padding-left: 25px;
 }

 .noUi-rtl .noUi-value-vertical {
   transform: translate(0, 50%);
 }

 .noUi-marker-vertical.noUi-marker {
   width: 5px;
   height: 2px;
   margin-top: -1px;
 }

 .noUi-marker-vertical.noUi-marker-sub {
   width: 10px;
 }

 .noUi-marker-vertical.noUi-marker-large {
   width: 15px;
 }

 .noUi-tooltip {
   display: block;
   position: absolute;
   border: 1px solid #d9d9d9;
   border-radius: 3px;
   background: #fff;
   color: #000;
   padding: 5px;
   text-align: center;
   white-space: nowrap;
 }

 .noUi-horizontal .noUi-tooltip {
   transform: translate(-50%, 0);
   left: 50%;
   bottom: 120%;
 }

 .noUi-vertical .noUi-tooltip {
   transform: translate(0, -50%);
   top: 50%;
   right: 120%;
 }

 .noUi-horizontal {
   height: 2px;
 }

 .noUi-target {
   border: 0;
 }

 .noUi-base .noUi-connects {
   border-radius: 999px;
   background-color: var(--rgba-dark-3);
 }

 .noUi-connect {
   background-color: var(--primary);
 }

 .noUi-horizontal .noUi-handle,
 .noUi-vertical .noUi-handle {
   height: 12px;
   width: 12px;
   border-radius: 50px;
   background-color: var(--primary);
   box-shadow: unset;
   cursor: pointer;
 }

 .noUi-horizontal .noUi-handle::before,
 .noUi-horizontal .noUi-handle::after,
 .noUi-vertical .noUi-handle::before,
 .noUi-vertical .noUi-handle::after {
   content: none;
 }

 html:not([dir=rtl]) .noUi-horizontal .noUi-handle {
   right: -5px;
 }

 .tf-btn-filter {
   display: inline-flex;
   align-items: center;
   cursor: pointer;
   gap: 5px;
   color: var(--dark);
   border: solid 1px var(--line);
   border-radius: 27px;
   text-transform: capitalize;
   padding: 8px 14px;
   font-weight: 400;
   background-color: var(--white);
   max-width: 100%;
   text-wrap: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   min-width: 84px;
 }

 .tf-btn-filter .icon {
   font-size: 14px;
 }

 .tf-btn-filter:hover {
   border-color: var(--dark);
 }

 .tf-btn-filter.active {
   background-color: var(--dark);
   border-color: var(--dark);
   color: var(--white);
 }

 .tf-btn-filter .text {
   font-size: 14px;
   line-height: 20px;
 }

 .btn-filterDropdown .icon-close {
   font-size: 12px;
 }

 .widget-facet:not(:last-child) {
   border-bottom: 1px solid var(--line);
   margin-bottom: 24px;
   padding-bottom: 24px;
 }

 .widget-facet .facet-title {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 10px 0px;
   margin-bottom: 24px;
   cursor: pointer;
   color: var(--dark);
 }

 .widget-facet .facet-title .icon {
   transition: transform 0.35s linear;
   font-size: 8px;
 }

 .widget-facet .facet-title.collapsed .icon {
   transform: rotate(180deg);
 }

 .widget-facet .cate-item:not(:last-child) {
   margin-bottom: 12px;
 }

 .canvas-filter .widget-facet .facet-title {
   margin-bottom: 0;
 }

 .canvas-filter .widget-facet .collapse-body {
   padding-top: 20px;
 }

 .canvas-filter .sb-banner .image {
   height: 429px;
 }

 .canvas-filter .sb-banner .banner-content {
   bottom: 24px;
 }

 .current-scrollbar {
   max-height: 200px;
   overflow-y: auto;
   margin-right: 5px;
 }

 .current-scrollbar::-webkit-scrollbar {
   width: 2px;
 }

 .current-scrollbar::-webkit-scrollbar-track {
   background-color: var(--bg-scrollbar-thumb);
 }

 .current-scrollbar::-webkit-scrollbar-thumb {
   background: var(--dark);
 }

 .filter-group-check .list-item {
   display: flex;
   gap: 10px;
   align-items: center;
   cursor: pointer;
 }

 .filter-group-check .list-item .label {
   font-size: 14px;
   line-height: 20px;
   color: var(--dark);
   cursor: pointer;
 }

 .filter-group-check .list-item .tf-check:checked~.label {
   opacity: 1;
 }

 .filter-group-check .list-item:not(:last-child) {
   margin-bottom: 10px;
 }

 .filter-color-box {
   display: flex;
   flex-wrap: wrap;
   row-gap: 10px;
   column-gap: 12px;
 }

 .filter-color-box .color-item {
   width: 32px;
   height: 32px;
   display: block;
   border-radius: 50%;
   border: 1px solid transparent;
   overflow: hidden;
   transition: all 0.3s ease-in-out;
   background-color: var(--white);
   cursor: pointer;
 }

 .filter-color-box .color-item .color {
   width: 100%;
   height: 100%;
   display: block;
   border-radius: 50%;
 }

 .filter-color-box .color-item.line {
   border-color: var(--rgba-dark-3);
 }

 .filter-color-box .color-item.active {
   padding: 4px;
   border-color: var(--dark) !important;
 }

 .filter-color-box .color-text {
   display: none;
 }

 
 

 .widget-price {
   display: grid;
   gap: 16px;
 }

 .widget-price .price-val-range {
   padding: 0px 8px;
 }

 .widget-price .reset-price {
   font-size: 12px;
   line-height: 19.2px;
   text-decoration: underline;
   cursor: pointer;
   transition: all 0.3s ease-in-out;
 }

 .widget-price .reset-price:hover {
   color: var(--primary);
 }

 .widget-price .price-box,
 .widget-price .box-value-price {
   display: flex;
   gap: 8px;
 }

 .widget-price .price-box {
   color: var(--primary);
 }

 .widget-price .price-val {
   font-size: 14px;
   line-height: 20px;
   color: var(--primary);
   position: relative;
 }

 .widget-price .price-val::before {
   content: attr(data-currency);
 }

 .tf-shop-control {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 8px;
   margin-bottom: 30px;
 }

 .tf-shop-control.mb1 {
   margin-bottom: 24px;
 }

 .tf-filter-dropdown {
   margin-bottom: 30px;
   display: flex;
   align-items: center;
   gap: 15px;
   flex-wrap: wrap;
 }

 .tf-filter-dropdown .meta-dropdown-filter {
   display: flex;
   align-items: center;
   gap: 8px;
   flex-wrap: wrap;
 }

 .tf-filter-dropdown .title-filter {
   font-weight: 500;
   font-size: 16px;
   line-height: 19.2px;
   color: var(--dark);
 }

 .tf-group-filter {
   display: flex;
   align-items: center;
   gap: 10px;
 }

 .tf-control-layout {
   display: flex;
   align-items: center;
 }

 .tf-control-layout .tf-view-layout-switch {
   width: 32px;
   height: 32px;
   display: flex;
   align-items: center;
   justify-content: center;
   transition: all 0.3s ease-in-out;
   cursor: pointer;
 }

 .tf-control-layout .tf-view-layout-switch:hover .item span,
 .tf-control-layout .tf-view-layout-switch.active .item span {
   background-color: var(--dark);
 }

 .icon-list {
   display: grid;
   gap: 2px;
 }

 .icon-list span {
   display: inline-block;
   width: 18px;
   height: 3px;
   border-radius: 2px;
   background-color: var(--rgba-dark-3);
   transition: all 0.3s ease-in-out;
 }

 .icon-grid-2 {
   display: grid;
   gap: 2px;
   grid-template-columns: 1fr 1fr;
 }

 .icon-grid-2 span {
   display: inline-block;
   width: 3px;
   height: 18px;
   border-radius: 2px;
   background-color: var(--rgba-dark-3);
   transition: all 0.3s ease-in-out;
 }

 .icon-grid-3 {
   display: grid;
   gap: 2px;
   grid-template-columns: 1fr 1fr 1fr;
 }

 .icon-grid-3 span {
   display: inline-block;
   width: 3px;
   height: 18px;
   border-radius: 2px;
   background-color: var(--rgba-dark-3);
   transition: all 0.3s ease-in-out;
 }

 .icon-grid-4 {
   display: grid;
   gap: 2px;
   grid-template-columns: repeat(4, 1fr);
 }

 .icon-grid-4 span {
   display: inline-block;
   width: 3px;
   height: 18px;
   border-radius: 2px;
   background-color: var(--rgba-dark-3);
   transition: all 0.3s ease-in-out;
 }

 .icon-grid-5 {
   display: grid;
   gap: 2px;
   grid-template-columns: repeat(5, 1fr);
 }

 .icon-grid-5 span {
   display: inline-block;
   width: 3px;
   height: 18px;
   border-radius: 2px;
   background-color: var(--rgba-dark-3);
   transition: all 0.3s ease-in-out;
 }

 .icon-grid-6 {
   display: grid;
   gap: 2px;
   grid-template-columns: repeat(6, 1fr);
 }

 .icon-grid-6 span {
   display: inline-block;
   width: 3px;
   height: 18px;
   border-radius: 2px;
   background-color: var(--rgba-dark-3);
   transition: all 0.3s ease-in-out;
 }

 .wrapper-control-shop {
   position: relative;
 }

 .wrapper-control-shop .wg-pagination {
   margin-top: 15px;
 }

 

 .wrapper-control-shop.loading-shop * {
   display: none;
 }

 .wrapper-control-shop.loading-shop::after {
   content: "";
   position: absolute;
   display: block;
   top: 50%;
   left: 50%;
   width: 30px;
   height: 30px;
   border: 2px solid transparent;
   border-top: 2px solid var(--dark);
   border-right: 2px solid var(--dark);
   border-radius: 50%;
   animation: spin 0.5s linear infinite;
   transform: translate(-50%, -50%);
   z-index: 10000;
 }

 .wrapper-shop {
   transition: all 0.3s ease-in-out;
   animation: fadeShop 0.5s ease-in-out;
 }

 @keyframes fadeShop {
   0% {
     opacity: 0;
     transform: translateY(30px);
   }

   100% {
     opacity: 1;
     transform: translateY(0);
   }
 }

 .listLayout-wrapper #product-count-grid {
   display: none;
 }

 .listLayout-wrapper #product-count-list {
   display: block;
 }

 .gridLayout-wrapper #product-count-grid {
   display: block;
 }

 .gridLayout-wrapper #product-count-list {
   display: none;
 }

 .meta-filter-shop {
   display: flex;
   gap: 10px;
   flex-wrap: wrap;
   align-items: center;
   margin-bottom: 24px;
 }

 .meta-filter-shop .count-text {
   font-size: 14px;
   line-height: 22.4px;
   color: var(--dark);
   position: relative;
 }

 .meta-filter-shop .count-text .count {
   display: inline-block;
   margin-right: 4px;
 }

 .meta-filter-shop #applied-filters {
   display: flex;
   align-items: center;
   gap: 10px;
   flex-wrap: wrap;
 }

 .meta-filter-shop .filter-tag {
   font-size: 14px;
   line-height: 22.4px;
   display: flex;
   align-items: center;
   gap: 4px;
   padding: 5px 14px;
   border: 1px solid var(--line);
   border-radius: 11px;
   transition: all 0.3s ease-in-out;
   cursor: pointer;
 }

 .meta-filter-shop .filter-tag .icon-close {
   font-size: 10px;
   width: 15px;
   height: 15px;
   display: flex;
   align-items: center;
   justify-content: left;
 }

 .meta-filter-shop .filter-tag:hover {
   border-color: var(--dark);
 }

 .meta-filter-shop .remove-all-filters {
   padding: 5px 14px;
   display: flex;
   align-items: center;
   gap: 10px;
   font-size: 14px;
   line-height: 22.4px;
   border-color: transparent;
   background-color: transparent;
   color: var(--dark);
   font-weight: 400;
   border-radius: 11px;
 }

 .meta-filter-shop .remove-all-filters .icon {
   font-size: 10px;
 }

 .meta-filter-shop .remove-all-filters:hover {
   border-color: var(--dark);
 }

 .sidebar-filter {
   background-color: var(--white);
   transition: all 0.3s ease-in-out;
 }

 .overlay-filter {
   position: fixed;
   top: 0;
   left: 0;
   z-index: 2000;
   width: 100vw;
   height: 100vh;
   background-color: var(--backdrop);
   visibility: hidden;
   opacity: 0;
   transition: opacity 0.15s linear;
 }

 .overlay-filter.show {
   opacity: 1;
   visibility: visible;
 }

 .loadItem.hidden {
   display: none;
 }

 #description p:not(:first-child) {
   margin-top: 20px;
 }

 .wrapper-filter-dropdown {
   position: relative;
 }

 /*------------ shop ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .popup-shopping-cart .modal-content {
   flex-direction: column;
 }

 .popup-shopping-cart .wrap {
   display: flex;
   flex-direction: column;
   flex-grow: 1;
 }

 .popup-shopping-cart .tf-mini-cart-threshold {
   padding: 24px 32px 21px;
 }

 .popup-shopping-cart .tf-mini-cart-threshold .text {
   font-size: 14px;
   line-height: 22.4px;
   margin-bottom: 31px;
 }

 .popup-shopping-cart .tf-mini-cart-threshold .tf-progress-bar {
   margin-top: 12px;
   margin-bottom: 16px;
 }

 .popup-shopping-cart .tf-mini-cart-wrap {
   display: flex;
   flex-direction: column;
   flex-grow: 1;
   position: relative;
 }

 .popup-shopping-cart .tf-minicart-recommendations {
   padding: 57px 32px 24px 32px;
 }

 .popup-shopping-cart .tf-minicart-recommendations .tf-minicart-recommendations-heading {
   margin-bottom: 24px;
 }

 .popup-shopping-cart .tf-minicart-recommendations .tf-minicart-recommendations-heading .nav-swiper {
   position: unset;
 }

 .popup-shopping-cart .tf-minicart-recommendations .tf-mini-cart-item {
   padding: 9px;
 }

 .popup-shopping-cart .tf-minicart-recommendations .tf-mini-cart-item .tf-mini-cart-image {
   border-radius: 8px;
 }

 .popup-shopping-cart .tf-minicart-recommendations .tf-mini-cart-item .tf-mini-cart-image a {
   width: 100%;
 }

 .popup-shopping-cart .tf-minicart-recommendations .tf-mini-cart-item .tf-mini-cart-info .price-wrap {
   display: flex;
   gap: 6px;
   align-items: center;
 }

 .popup-shopping-cart .tf-minicart-recommendations .tf-mini-cart-item .tf-mini-cart-info .new-price {
   font-weight: 500;
   font-size: 18px;
   line-height: 28px;
 }

 .popup-shopping-cart .tf-minicart-recommendations .tf-mini-cart-item .tf-btn {
   padding: 9px 20px;
   font-size: 14px;
   font-weight: 500;
   line-height: 16.8px;
 }

 .popup-shopping-cart .tf-mini-cart-bottom {
   box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.1019607843);
   flex-shrink: 0;
 }

 .popup-shopping-cart .tf-mini-cart-tool {
   padding: 12px 32px;
   height: 70px;
   display: flex;
   justify-content: center;
   border-bottom: 1px solid rgba(161, 161, 161, 0.2);
 }

 .popup-shopping-cart .tf-mini-cart-tool .tf-mini-cart-tool-btn {
   display: flex;
   flex-direction: column;
   gap: 6px;
   width: 100%;
   height: 100%;
   text-align: center;
   cursor: pointer;
   place-content: center;
   transition: all 0.3s ease-in-out;
   color: rgba(0, 0, 0, 0.8);
 }

 .popup-shopping-cart .tf-mini-cart-tool .tf-mini-cart-tool-btn .icon {
   font-size: 22px;
   color: #98a2b3;
 }

 .popup-shopping-cart .tf-mini-cart-bottom-wrap {
   padding: 24px 32px 34px;
 }

 .popup-shopping-cart .tf-mini-cart-bottom-wrap .tf-cart-totals-discounts {
   display: flex;
   align-items: center;
   justify-content: space-between;
   margin-bottom: 10px;
 }

 .popup-shopping-cart .tf-mini-cart-bottom-wrap .tf-cart-tax {
   opacity: 0.8;
   padding-bottom: 14px;
   border-bottom: 1px solid var(--line);
   margin-bottom: 15px;
 }

 .popup-shopping-cart .tf-mini-cart-bottom-wrap .tf-cart-checkbox {
   margin-bottom: 32px;
 }

 .popup-shopping-cart .tf-mini-cart-bottom-wrap .tf-cart-checkbox a:hover {
   color: var(--primary) !important;
 }

 .popup-shopping-cart .tf-mini-cart-bottom-wrap .tf-mini-cart-view-checkout {
   display: flex;
   gap: 10px;
 }

 .popup-shopping-cart .tf-mini-cart-bottom-wrap .tf-mini-cart-view-checkout .tf-btn {
   text-transform: none;
 }

 .popup-shopping-cart .popup-header .icon-close-popup {
   padding-right: 0;
 }

 .popup-shopping-cart.style-2 {
   max-width: 100% !important;
 }

 .popup-shopping-cart.style-2 .modal-content {
   max-width: 748px !important;
 }

 .popup-shopping-cart.style-2 .canvas-wrapper {
   display: flex;
   flex-direction: column;
 }

 .popup-shopping-cart.style-2 .also-like-product {
   position: relative;
 }

 .popup-shopping-cart.style-2 .also-like-product .also-like-product-wrap {
   display: flex;
   gap: 24px;
   overflow-x: auto;
   padding: 15px 15px 5px;
 }

 .popup-shopping-cart.style-2 .also-like-product .also-like-product-wrap::-webkit-scrollbar {
   height: 4px;
 }

 .popup-shopping-cart.style-2 .also-like-product .also-like-product-wrap::-webkit-scrollbar-thumb {
   background: var(--primary);
 }

 .popup-shopping-cart.style-2 .also-like-product .also-like-product-wrap::-webkit-scrollbar-track {
   background: var(--line);
 }

 .popup-shopping-cart.style-2 .also-like-product .tf-mini-cart-item {
   padding: 0;
   gap: 12px;
   min-width: 225px;
 }

 .popup-shopping-cart.style-2 .also-like-product .tf-mini-cart-item .tf-mini-cart-image {
   width: 95px;
   height: 126px;
   border-radius: 8px;
   position: relative;
 }

 .popup-shopping-cart.style-2 .also-like-product .tf-mini-cart-item .tf-mini-cart-image a {
   width: 100%;
 }

 .popup-shopping-cart.style-2 .also-like-product .tf-mini-cart-item .on-sale-wrap {
   position: absolute;
   top: 6px;
   left: 6px;
   padding: 5px 10px;
   border-radius: 99px;
   background-color: var(--primary);
   color: var(--white);
 }

 .popup-shopping-cart.style-2 .also-like-product .tf-mini-cart-item .tf-mini-cart-info {
   gap: 4px;
   align-items: center;
 }

 .popup-shopping-cart.style-2 .also-like-product .tf-mini-cart-item .tf-mini-cart-info .title {
   -webkit-line-clamp: 1;
   -webkit-box-orient: vertical;
   display: -webkit-box;
   overflow: hidden;
 }

 .popup-shopping-cart.style-2 .also-like-product .tf-mini-cart-item .price-wrap {
   margin-bottom: 4px;
 }

 .popup-shopping-cart.style-2 .also-like-product .tf-mini-cart-item .tf-btn {
   padding: 9px 19px;
   font-size: 14px;
   font-weight: 500;
   line-height: 16.8px;
 }

 .popup-shopping-cart.style-2 .popup-shopping-cart-main {
   display: flex;
   flex-direction: column;
   flex-grow: 1;
   border-left: 1px solid var(--line);
   overflow: hidden;
 }

 .popup-shopping-cart.style-2 .popup-shopping-cart-main .tf-mini-cart-sroll {
   padding-bottom: 15px;
 }

 .popup-shopping-cart.style-empty .popup-header .icon-close-popup {
   padding-right: 10px;
   font-size: 18px;
 }

 .popup-shopping-cart.style-empty .tf-mini-cart-threshold .tf-progress-bar {
   height: 5px;
 }

 .popup-shopping-cart.style-empty .cart-empty-wrap {
   text-align: center;
   padding: 0 15px;
 }

 .popup-shopping-cart.style-empty .cart-empty-wrap img {
   width: 100px;
 }

 .popup-shopping-cart.style-empty .cart-empty-wrap p,
 .popup-shopping-cart.style-empty .cart-empty-wrap img {
   margin-bottom: 15px;
 }

 .popup-shopping-cart.style-empty .tf-mini-cart-wrap {
   padding-top: 57px;
 }

 .popup-shopping-cart.style-empty .tf-mini-cart-wrap .tf-minicart-recommendations {
   padding-top: 0;
 }

 .popup-shopping-cart.style-empty .tf-mini-cart-items {
   display: flex;
   flex-direction: column;
   gap: 16px;
 }

 .popup-shopping-cart.style-empty .tf-mini-cart-items .tf-mini-cart-info .new-price {
   font-size: 16px;
   line-height: 24px;
 }

 .tf-mini-cart-main {
   flex: 1 1 auto;
   position: relative;
 }

 .tf-mini-cart-sroll {
   position: absolute;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   overflow: auto;
 }

 .tf-mini-cart-sroll::-webkit-scrollbar {
   width: 4px;
 }

 .tf-mini-cart-sroll::-webkit-scrollbar-thumb {
   background: var(--primary);
 }

 .tf-mini-cart-sroll::-webkit-scrollbar-track {
   background: var(--line);
 }

 .tf-mini-cart-items {
   display: flex;
   gap: 12px;
   flex-direction: column;
 }

 .tf-mini-cart-item {
   padding: 0 32px;
   display: flex;
   gap: 10px;
 }

 .tf-mini-cart-item .tf-mini-cart-image {
   display: block;
   width: 95px;
   height: auto;
   flex-shrink: 0;
   border-radius: 8px;
   overflow: hidden;
 }

 .tf-mini-cart-item .tf-mini-cart-image a {
   width: 100%;
   height: 100%;
   display: block;
 }

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

 .tf-mini-cart-item .tf-mini-cart-info {
   flex-grow: 1;
   display: flex;
   flex-direction: column;
   gap: 8px;
 }

 .tf-mini-cart-item .tf-mini-cart-info .info-variant {
   display: flex;
   gap: 10px;
   position: relative;
   width: max-content;
 }

 .tf-mini-cart-item .tf-mini-cart-info .info-variant select {
   appearance: none;
   background: transparent;
   border: 0;
   padding-left: 5px;
   margin-left: -5px;
   padding-right: 20px;
   cursor: pointer !important;
   z-index: 1;
 }

 .tf-mini-cart-item .tf-mini-cart-info .info-variant select option {
   padding: 5px;
 }

 .tf-mini-cart-item .tf-mini-cart-info .info-variant .edit {
   position: absolute;
   right: 0;
   top: 0;
   display: flex;
   font-size: 10px;
   line-height: 10px;
   transition: all 0.3s ease-in-out;
 }

 .tf-mini-cart-item .tf-mini-cart-info .info-variant:hover .edit {
   color: var(--primary) !important;
 }

 .tf-mini-cart-item .tf-mini-cart-info .wg-quantity {
   width: 90px;
 }

 .tf-mini-cart-item .remove {
   padding: 0;
   cursor: pointer;
   transition: all 0.3s ease-in-out;
 }

 .tf-mini-cart-item .remove:hover {
   color: var(--primary);
 }

 .tf-mini-cart-tool-openable {
   position: absolute;
   bottom: 0;
   left: 0;
   right: 0;
   transform: translateY(100%);
   transition: transform 0.25s ease-in-out;
   z-index: 70;
 }

 .tf-mini-cart-tool-openable.open {
   transform: translateY(0);
 }

 .tf-mini-cart-tool-openable.open>.overplay {
   opacity: 1;
   visibility: visible;
 }

 .tf-mini-cart-tool-openable.open .tf-mini-cart-tool-content {
   box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.1);
 }

 .tf-mini-cart-tool-openable>.overplay {
   position: absolute;
   left: 0;
   bottom: 0;
   height: 200vh;
   right: 0;
   background-color: rgba(5, 5, 5, 0.4);
   opacity: 0;
   visibility: hidden;
   transition: all 0.3s ease-in-out;
 }

 .tf-mini-cart-tool-openable .tf-mini-cart-tool-close {
   cursor: pointer;
 }

 .tf-mini-cart-tool-openable .tf-btn {
   height: 47px;
 }

 .tf-mini-cart-tool-openable .tf-mini-cart-tool-content {
   position: relative;
   z-index: 80;
   padding: 32px 36px;
   background-color: var(--white);
 }

 .tf-mini-cart-tool-openable .tf-mini-cart-tool-content .tf-mini-cart-tool-text {
   display: flex;
   align-items: center;
   gap: 8px;
   margin-bottom: 12px;
   color: #101828;
 }

 .tf-mini-cart-tool-openable .tf-mini-cart-tool-content .tf-mini-cart-tool-text .icon {
   width: 33px;
   height: 33px;
   border: 1px solid var(--dark);
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 16px;
   color: var(--dark);
 }

 .tf-mini-cart-tool-openable .tf-mini-cart-tool-content .tf-cart-tool-btns {
   display: flex;
   gap: 30px;
   align-items: center;
 }

 .tf-mini-cart-tool-openable .tf-mini-cart-tool-content .tf-cart-tool-btns .tf-btn {
   font-weight: 500;
   font-size: 16px;
   line-height: 24px;
   height: 52px;
   text-transform: none;
 }

 .tf-mini-cart-tool-openable.add-note textarea {
   height: 148px;
   margin-bottom: 24px;
 }

 .tf-mini-cart-tool-openable.coupon .tf-mini-cart-tool-text1 {
   margin-bottom: 7px;
   color: #475467;
 }

 .tf-mini-cart-tool-openable.coupon input {
   margin-bottom: 90px;
 }

 .tf-mini-cart-tool-openable.add-gift .tf-mini-cart-tool-text1 {
   margin-bottom: 127px;
   color: rgb(71, 84, 103);
 }

 .tf-mini-cart-tool-openable.estimate-shipping select {
   height: 49px;
   border-radius: 6px;
   font-size: 14px;
   color: #667085;
 }

 .tf-mini-cart-tool-openable.estimate-shipping .field {
   margin-bottom: 14px;
 }

 .tf-mini-cart-tool-openable.estimate-shipping .field p {
   margin-bottom: 8px;
   color: #101828;
 }

 .tf-mini-cart-tool-openable.estimate-shipping .tf-cart-tool-btns {
   margin-top: 30px;
 }

 .tf-mini-cart-tool-openable.estimate-shipping .error {
   margin-top: 20px;
   color: #ff5757;
 }

 .tf-mini-cart-tool-openable.estimate-shipping .success {
   margin-top: 20px;
 }

 .tf-mini-cart-tool-openable.estimate-shipping .success .standard {
   color: #46ba4c;
   margin-top: 10px;
 }

 .tf-progress-ship {
   width: 100%;
   background-color: var(--line-3);
   height: 8px;
   position: relative;
   border-radius: 16px;
 }

 .tf-progress-ship .value {
   height: 100%;
   background: var(--primary);
   position: relative;
   transition: width 2s ease;
   border-radius: 16px;
 }

 .tf-progress-ship .icon {
   position: absolute;
   left: 95%;
   top: 50%;
   transform: translateY(-50%);
   width: 35px;
   height: 35px;
   border: 3px solid #ffb5b5;
   display: flex;
   align-items: center;
   justify-content: center;
   background-color: var(--primary);
   border-radius: 50%;
   font-size: 16px;
   color: var(--white);
 }

 .tf-cart-head .title {
   margin-bottom: 35px;
 }

 .tf-cart-head .tf-progress-ship {
   background-color: var(--line-4);
 }

 .tf-cart-head .tf-progress-ship .value {
   background-color: #ff9752;
 }

 .tf-cart-head .tf-progress-ship .icon {
   background-color: #ff9752;
   border-color: #ffd1b3;
   font-size: 18px;
   width: 38px;
   height: 38px;
 }

 .table-page-cart {
   border-spacing: 0;
   border-collapse: collapse;
   margin-bottom: 24px;
   width: 100%;
   line-height: 1.4;
 }

 .table-page-cart thead tr {
   border-top: 1px solid var(--line);
   border-bottom: 1px solid var(--line);
 }

 .table-page-cart thead tr th {
   font-weight: 500;
   font-size: 16px;
   line-height: 24px;
   padding-top: 15px;
   padding-bottom: 15px;
   text-align: center;
 }

 .table-page-cart td {
   padding: 18px 9px;
 }

 .table-page-cart .tf-cart-item {
   border-bottom: 1px solid var(--line);
 }

 .table-page-cart .tf-cart-item td:first-child {
   text-align: start;
   padding-left: 0;
 }

 .table-page-cart .tf-cart-item .wg-quantity {
   padding: 9px 6px;
   margin: auto;
 }

 .table-page-cart .tf-cart-item .wg-quantity .quantity-product {
   width: 30px;
   height: 30px;
   font-size: 14px;
   line-height: 16.8px;
   font-weight: 700;
   font-family: "DM Sans", sans-serif;
 }

 .table-page-cart .tf-cart-item .wg-quantity .btn-quantity {
   width: 30px;
   height: 30px;
   align-items: flex-start;
   font-size: 20px;
 }

 .table-page-cart .tf-cart-item .tf-cart-item_total {
   width: 18%;
 }

 .table-page-cart .tf-cart-item_product {
   display: flex;
   align-items: center;
 }

 .table-page-cart .tf-cart-item_product .img-box {
   max-width: 98px;
   max-height: 130px;
   margin-right: 10px;
   border-radius: 4px;
   overflow: hidden;
   flex-shrink: 0;
 }

 .table-page-cart .tf-cart-item_product .cart-info .name {
   margin-bottom: 10px;
 }

 .table-page-cart .tf-cart-item_product .cart-info .variants {
   margin-bottom: 32px;
   font-size: 12px;
   line-height: 14.4px;
   color: var(--rgba-dark);
 }

 .table-page-cart .tf-cart-item_product .cart-info .remove-cart {
   font-size: 12px;
   line-height: 14.4px;
   color: var(--rgba-dark);
   text-decoration: underline;
 }

 .tf-page-cart-main .check-gift {
   display: flex;
   gap: 8px;
 }

 .tf-page-cart-main .check-gift .tf-check {
   margin-top: 2px;
 }

 .tf-page-cart-main .check-gift .label {
   font-size: 14px;
   line-height: 22.4px;
 }

 .tf-page-cart-main .box-ip-discount {
   margin: 24px 0px;
   max-width: 443px;
 }

 .tf-page-cart-main .box-ip-discount .discount-ip {
   display: flex;
   gap: 6px;
 }

 .tf-page-cart-main .box-ip-discount .tf-btn {
   padding-top: 12px;
   padding-bottom: 12px;
 }

 .tf-page-cart-main .box-ip-discount input {
   padding-left: 12px;
   padding-right: 12px;
 }

 .tf-page-cart-main .box-ip-discount .discount-message {
   margin-top: 10px;
 }

 .tf-page-cart-main .box-ip-discount .discount-message.error {
   color: #ff5757;
 }

 .tf-page-cart-main .box-ip-discount .discount-message.success {
   color: #46ba4c;
 }

 .tf-page-cart-main .cart-note label {
   margin-bottom: 10px;
 }

 .tf-page-cart-main .cart-note textarea {
   height: 206px;
 }

 .tf-page-cart-main .form-cart {
   margin-bottom: 32px;
 }

 .tf-page-cart-main .fl-iconbox .tf-swiper {
   padding: 24px;
   border: 1px solid var(--line);
   border-radius: 16px;
 }

 .tf-page-cart-main .fl-iconbox .tf-icon-box .box-icon {
   width: 48px;
   height: 48px;
 }

 .tf-page-cart-main .fl-iconbox .tf-icon-box .icon {
   font-size: 18px;
   color: var(--primary);
 }

 .tf-page-cart-main .fl-iconbox .tf-icon-box .title {
   font-size: 16px;
   line-height: 24px;
 }

 .tf-page-cart-main .fl-iconbox .sw-dot-default {
   margin-top: 12px;
 }

 .tf-page-cart-sidebar .cart-box {
   padding: 24px 15px;
   border: 1px solid var(--line);
   border-radius: 16px;
 }

 .tf-page-cart-sidebar .cart-box:not(:last-child) {
   margin-bottom: 24px;
 }

 .tf-page-cart-sidebar .cart-box .feedback-message {
   margin-top: 10px;
   text-align: center;
 }

 .tf-page-cart-sidebar .cart-box .feedback-message.error {
   color: #ff5757;
 }

 .tf-page-cart-sidebar .cart-box .feedback-message.success {
   color: #46ba4c;
 }

 .tf-page-cart-sidebar .shipping-cart-box .title {
   margin-bottom: 24px;
 }

 .tf-page-cart-sidebar .shipping-cart-box .field label {
   margin-bottom: 8px;
 }

 .tf-page-cart-sidebar .shipping-cart-box .field:not(:last-child) {
   margin-bottom: 20px;
 }

 .tf-page-cart-sidebar .shipping-cart-box input {
   padding-left: 10px;
   padding-right: 10px;
 }

 .tf-page-cart-sidebar .shipping-cart-box input::placeholder {
   opacity: 1;
 }

 .tf-page-cart-sidebar .shipping-cart-box .tf-btn {
   margin-top: 8px;
 }

 .tf-page-cart-sidebar .shipping-cart-box .shipping-message {
   margin-top: 10px;
   text-align: center;
 }

 .tf-page-cart-sidebar .shipping-cart-box .shipping-message.error {
   color: #ff5757;
 }

 .tf-page-cart-sidebar .shipping-cart-box .shipping-message.success {
   color: #46ba4c;
 }

 .tf-page-cart-sidebar .checkout-cart-box .cart-head {
   padding-bottom: 15px;
   margin-bottom: 15px;
   border-bottom: 1px solid rgba(161, 161, 161, 0.2);
 }

 .tf-page-cart-sidebar .checkout-cart-box .total-discount {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 8px;
   margin-bottom: 10px;
 }

 .tf-page-cart-sidebar .checkout-cart-box .check-agree {
   display: flex;
   gap: 8px;
   align-items: center;
 }

 .tf-page-cart-sidebar .checkout-cart-box .check-agree label {
   font-size: 14px;
   line-height: 22.4px;
 }

 .tf-page-cart-sidebar .checkout-cart-box .check-agree label a {
   text-decoration: underline;
 }

 .tf-page-cart-sidebar .checkout-cart-box .checkout-btn {
   margin-top: 32px;
   margin-bottom: 20px;
 }

 .tf-page-cart-sidebar .checkout-cart-box .cart-list-social {
   display: flex;
   justify-content: center;
   gap: 10px;
   margin-top: 12px;
 }

 .tf-page-cart-sidebar .checkout-cart-box .payment-card {
   border: 1px solid #d9d9d9;
   border-radius: 2.5px;
   width: 45px;
   height: 31.3px;
 }

 .tf-page-cart-sidebar .testimonial-cart-box {
   border-color: transparent;
   background: linear-gradient(113.78deg, #fff6d4 0%, #ffe3e3 100%);
 }

 .tf-page-cart-sidebar .testimonial-cart-box .box-testimonial-main {
   gap: 24px;
 }

 .tf-page-cart-sidebar .testimonial-cart-box .box-testimonial-main .quote {
   font-size: 42px;
 }

 .tf-page-cart-sidebar .testimonial-cart-box .box-testimonial-main .icon-star {
   color: #ecb100;
 }

 .tf-page-cart-sidebar .testimonial-cart-box .box-author {
   gap: 5px;
 }

 .tf-page-cart-sidebar .testimonial-cart-box .box-author .img {
   width: 32px;
   height: 32px;
   border-radius: 50%;
 }

 .tf-page-cart-sidebar .testimonial-cart-box .box-nav-swiper {
   gap: 10px;
   margin-top: 24px;
 }

 .tf-page-cart-sidebar .testimonial-cart-box .nav-swiper {
   width: 32px;
   height: 32px;
 }

 .tf-page-cart-sidebar .testimonial-cart-box .nav-swiper::after {
   font-size: 10px;
 }

 .tf-page-cart-sidebar .order-box .title {
   margin-bottom: 24px;
 }

 .tf-page-cart-sidebar .order-box .list-order-product {
   padding-bottom: 24px;
   margin-bottom: 24px;
   border-bottom: 1px solid rgba(161, 161, 161, 0.2);
 }

 .tf-page-cart-sidebar .order-box .order-item {
   display: flex;
   gap: 10px;
   align-items: center;
 }

 .tf-page-cart-sidebar .order-box .order-item:not(:last-child) {
   margin-bottom: 16px;
 }

 .tf-page-cart-sidebar .order-box .order-item .img-product {
   width: 72px;
   height: 94px;
   position: relative;
 }

 .tf-page-cart-sidebar .order-box .order-item .img-product img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   border-radius: 4px;
 }

 .tf-page-cart-sidebar .order-box .order-item .img-product .quantity {
   position: absolute;
   width: 24px;
   height: 24px;
   right: -12px;
   top: -12px;
   border-radius: 999px;
   background-color: var(--primary);
   color: var(--white);
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 14px;
   line-height: 20px;
   font-weight: 500;
 }

 .tf-page-cart-sidebar .order-box .order-item .content {
   flex-grow: 1;
   display: flex;
   justify-content: space-between;
   align-items: center;
   gap: 6px;
 }

 .tf-page-cart-sidebar .order-box .order-item .info {
   display: flex;
   flex-direction: column;
   gap: 10px;
 }

 .tf-page-cart-sidebar .order-box .order-item .info .variant {
   font-size: 12px;
   line-height: 14.4px;
   color: var(--rgba-dark);
 }

 .tf-page-cart-sidebar .order-box .list-total {
   padding-bottom: 24px;
   margin-bottom: 24px;
   border-bottom: 1px solid rgba(161, 161, 161, 0.2);
 }

 .tf-page-cart-sidebar .order-box .list-total .total-item:not(:last-child) {
   margin-bottom: 12px;
 }

 .tf-page-cart-sidebar .order-box .btn-order {
   margin-top: 32px;
 }

 .tf-page-cart-sidebar .feedback-box .title {
   margin-bottom: 24px;
 }

 .tf-page-cart-sidebar .feedback-box .text {
   margin-bottom: 24px;
 }

 .tf-page-cart-sidebar .feedback-box .list-exp {
   display: flex;
   gap: 20px;
 }

 .tf-page-cart-sidebar .feedback-box .check-exp {
   display: flex;
   align-items: center;
   gap: 8px;
   transition: all 0.3s ease-in-out;
   border: 1px solid transparent;
   border-radius: 6px;
   cursor: pointer;
 }

 .tf-page-cart-sidebar .feedback-box .check-exp:has(.tf-check-rounded:checked) .text-exp {
   color: var(--dark);
 }

 .tf-page-cart-sidebar .feedback-box .check-exp .text-exp {
   color: rgba(102, 112, 133, 0.8);
 }

 .tf-page-cart-sidebar .box-share-social {
   margin-top: 56px;
 }

 .tf-page-cart-sidebar .box-share-social .title {
   margin-bottom: 24px;
 }

 .tf-page-cart-sidebar .social-item {
   color: var(--primary);
 }

 .tf-checkout-cart-main {
   padding: 24px 15px 40px;
   border-radius: 16px;
   border: 1px solid var(--line);
 }

 .tf-checkout-cart-main .title {
   margin-bottom: 24px;
 }

 .tf-checkout-cart-main .grid-3,
 .tf-checkout-cart-main .grid-2 {
   gap: 16px;
 }

 .tf-checkout-cart-main .box-ip-shipping,
 .tf-checkout-cart-main .box-ip-contact,
 .tf-checkout-cart-main .box-ip-checkout {
   margin-bottom: 32px;
 }

 .tf-checkout-cart-main .box-ip-contact .title {
   display: flex;
   align-items: center;
   justify-content: space-between;
 }

 .tf-checkout-cart-main .box-ip-contact .title .link {
   padding: 2px 0px;
   border-bottom: 1px solid;
 }

 .tf-checkout-cart-main .check-ship {
   display: flex;
   gap: 8px;
   padding: 14px 16px;
   border-radius: 6px;
   border: 1px solid var(--line);
   transition: all 0.3s ease-in-out;
   cursor: pointer;
 }

 .tf-checkout-cart-main .check-ship:has(.tf-check-rounded:checked) {
   border-color: var(--primary);
 }

 .tf-checkout-cart-main .check-ship:has(.tf-check-rounded:checked) .text {
   color: var(--rgba-dark-2);
 }

 .tf-checkout-cart-main .check-ship .tf-check-rounded {
   flex-shrink: 0;
   margin-top: 5px;
 }

 .tf-checkout-cart-main .check-ship .text {
   flex-grow: 1;
   display: flex;
   justify-content: space-between;
   flex-wrap: wrap;
   gap: 12px;
   color: rgba(102, 112, 133, 0.8);
 }

 .tf-checkout-cart-main .check-payment {
   display: flex;
   gap: 8px;
   padding: 14px 16px;
   border-radius: 6px;
   border: 1px solid var(--line);
 }

 .tf-checkout-cart-main .check-payment .tf-check-rounded {
   flex-shrink: 0;
   margin-top: 5px;
 }

 .tf-checkout-cart-main .check-payment .text-payment {
   color: rgba(102, 112, 133, 0.8);
 }

 .tf-checkout-cart-main .payment-method-box {
   margin-bottom: 32px;
 }

 .payment-item {
   border: 1px solid var(--line);
   border-radius: 6px;
 }

 .payment-item .payment-header {
   display: flex;
   gap: 8px;
   align-items: center;
   padding: 14px 16px;
   color: var(--text-3);
 }

 .payment-item .payment-body {
   padding: 4px 16px 22px;
 }

 .payment-item .ip-card {
   position: relative;
 }

 .payment-item .ip-card input {
   padding-right: 55px;
 }

 .payment-item .ip-card .card-logo {
   position: absolute;
   right: 12px;
   top: 50%;
   transform: translateY(-50%);
   width: 41px;
   height: 12px;
 }

 .payment-item .cb-ship {
   display: flex;
   gap: 8px;
 }

 .payment-item .cb-ship input {
   margin-top: 2px;
 }

 .paypal-payment .payment-header {
   position: relative;
   padding-right: 95px;
 }

 .paypal-payment .payment-header .card-logo {
   position: absolute;
   right: 12px;
   top: 50%;
   transform: translateY(-50%);
   width: 78px;
   height: 20px;
 }

 .title-success-order .icon {
   width: 132px;
   height: 132px;
   margin-bottom: 32px;
 }

 .title-success-order .box-title {
   display: grid;
   gap: 24px;
 }

 .tf-main-success .box-progress-order {
   border: 1px solid var(--line);
   padding: 24px;
   border-radius: 16px;
   display: grid;
   grid-template-columns: repeat(4, 1fr);
 }

 .tf-main-success .box-progress-order .order-progress-item {
   display: grid;
   gap: 12px;
 }

 .tf-main-success .box-progress-order .order-progress-item:not(:last-child) {
   border-right: 1px solid var(--line);
 }

 .tf-main-success .box-timeline-order {
   max-width: 618px;
   margin: 64px auto 42px;
   display: flex;
   justify-content: space-between;
 }

 .tf-main-success .box-timeline-order .line-time {
   display: flex;
   height: 1px;
   width: 100%;
   max-width: 208px;
   background-color: #efefef;
   margin: 25px -10px 0px;
 }

 .tf-main-success .timeline-item {
   position: relative;
   flex-shrink: 0;
 }

 .tf-main-success .timeline-item .box-icon {
   width: 48px;
   height: 48px;
   font-size: 28px;
   color: var(--dark);
   background-color: #efefef;
   border-radius: 50%;
   margin: 0px auto 12px;
 }

 .tf-main-success .timeline-item .content {
   display: grid;
   gap: 4px;
 }

 .tf-main-success .timeline-item.active .box-icon {
   background-color: var(--primary);
   color: var(--white);
 }

 .tf-main-success .timeline-item.active .title {
   color: var(--primary);
 }

 .tf-main-success .map-order {
   height: 500px;
   border-radius: 8px;
   overflow: hidden;
   margin-bottom: 24px;
 }

 .tf-main-success .box-ship-address {
   border: 1px solid var(--line);
   padding: 24px;
   border-radius: 16px;
   margin-bottom: 24px;
 }

 .tf-main-success .ship-address-item .title {
   margin-bottom: 24px;
 }

 .tf-main-success .ship-address-item .list-address li:not(:last-child) {
   margin-bottom: 8px;
 }

 .fl-order-testimonial {
   padding: 24px;
   background-color: #ffeded;
   border-radius: 16px;
 }

 .fl-order-testimonial .box-order-tes {
   display: grid;
   justify-items: center;
   gap: 24px;
 }

 .fl-order-testimonial .box-order-tes .content {
   display: grid;
   gap: 16px;
 }

 .fl-order-testimonial .box-order-tes .icon {
   font-size: 32px;
   color: var(--primary);
 }

 .fl-order-testimonial .sw-dot-default {
   margin-top: 24px;
 }

 .sidebar-order-success .order-box {
   padding-bottom: 60px;
 }

 .tf-cart-checkbox {
   display: flex;
   align-items: center;
   gap: 8px;
   cursor: pointer;
 }

 .tf-cart-checkbox .tf-checkbox-wrapp {
   place-items: center;
   position: relative;
   overflow: hidden;
   display: flex;
 }

 .tf-cart-checkbox .tf-checkbox-wrapp input {
   cursor: pointer;
   display: block;
   width: 14px;
   height: 14px;
   transition: 0.2s ease-in-out;
   background-color: var(--white);
   opacity: 0;
 }

 .tf-cart-checkbox .tf-checkbox-wrapp input:checked+div {
   background-color: var(--primary);
 }

 .tf-cart-checkbox .tf-checkbox-wrapp input:checked+div i {
   transform: scale(1);
 }

 .tf-cart-checkbox .tf-checkbox-wrapp div {
   position: absolute;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 14px;
   height: 14px;
   transition: 0.25s ease-in-out;
   z-index: 5;
   border: 1px solid rgba(0, 0, 0, 0.2);
   border-radius: 2px;
   background-color: var(--white);
   color: var(--white);
   pointer-events: none;
 }

 .tf-cart-checkbox .tf-checkbox-wrapp div i {
   font-size: 6px;
   transform: scale(0);
 }

 .tf-cart-checkbox label {
   font-weight: 400;
   cursor: pointer;
 }

 .tf-cart-checkbox label a {
   text-decoration: underline;
   text-underline-offset: 2px;
 }

 .tf-cart-checkbox .wrap-content {
   display: none;
 }

 .tf-cart-checkbox.check .wrap-content {
   display: block;
 }

 /*------------ account ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .main-content-account {
   display: flex;
   gap: 30px;
 }

 .main-content-account .my-acount-content {
   width: 100%;
 }

 .sidebar-account-wrap {
   border-radius: 8px;
   border: 1px solid var(--line);
   max-width: 244px;
   width: 100%;
   height: max-content;
 }

 .sidebar-account-wrap .my-account-nav-item {
   padding: 15px 12px;
   display: block;
 }

 .sidebar-account-wrap .my-account-nav-item:hover {
   background-color: var(--primary-4);
 }

 .sidebar-account-wrap .my-account-nav-item.active {
   color: var(--primary);
   background-color: var(--primary-4);
 }

 .sidebar-account-wrap li:not(:first-child) {
   border-top: 1px solid var(--line);
 }

 .canvas-sidebar .sidebar-account-wrap {
   max-width: unset;
 }

 .my-acount-content .box-account-title {
   display: grid;
   gap: 16px;
   margin-bottom: 30px;
 }

 .account-orders .title {
   margin-bottom: 42px;
 }

 .account-orders .wrap-account-order {
   overflow-x: auto;
   border: 1px solid var(--line);
   border-radius: 8px;
 }

 .account-orders .wrap-account-order::-webkit-scrollbar {
   height: 3px;
 }

 .account-orders .wrap-account-order::-webkit-scrollbar-thumb {
   background: var(--surface);
   border-radius: 999px;
 }

 .account-orders table {
   width: 100%;
   min-width: 700px;
   text-align: center;
   border-radius: 8px;
 }

 .account-orders table thead,
 .account-orders table td,
 .account-orders table th {
   padding: 15px 20px;
 }

 .account-orders table thead tr {
   border-bottom: 1px solid var(--line);
 }

 .account-orders table tbody tr:not(:last-child) {
   border-bottom: 1px solid var(--line);
 }

 .account-orders table td:first-child,
 .account-orders table th:first-child {
   text-align: start;
 }

 .account-orders table .view-detail {
   font-size: 14px;
   font-weight: 500;
   line-height: 21px;
   padding: 5px 19px;
   border: 1px solid var(--dark);
   border-radius: 99px;
 }

 .account-orders table .view-detail:hover {
   background-color: var(--dark);
   color: var(--white);
 }

 .account-orders .account-no-orders-wrap {
   display: none;
   text-align: center;
 }

 .account-orders .account-no-orders-wrap img {
   margin-bottom: 42px;
 }

 .account-orders .account-no-orders-wrap .title {
   margin-bottom: 16px;
 }

 .account-orders .account-no-orders-wrap .text {
   margin-bottom: 32px;
 }

 .account-orders.no-orders .account-no-orders-wrap {
   display: block;
 }

 .account-orders.no-orders .account-orders-wrap {
   display: none;
 }

 .account-dashboard .content-account {
   display: grid;
   gap: 15px;
 }

 .account-dashboard .hello-name span {
   font-size: 14px;
   font-weight: 400;
   line-height: 17px;
 }

 .account-dashboard .hello-name .name {
   font-weight: 500;
 }

 .account-dashboard .hello-name a {
   font-size: 14px;
   font-weight: 400;
   line-height: 17px;
 }

 .account-dashboard .box-check {
   border-radius: 16px;
   border: 1px solid var(--line);
   padding: 45px 15px;
   height: 100%;
   display: block;
 }

 .account-dashboard .box-check .text {
   display: grid;
   gap: 6px;
 }

 .account-dashboard .icon {
   position: relative;
   display: inline-flex;
   margin-bottom: 24px;
 }

 .account-dashboard .icon i {
   font-size: 44px;
 }

 .account-dashboard .count-number {
   position: absolute;
   display: inline-flex;
   background-color: #ff6f61;
   border-radius: 50%;
   width: 32px;
   height: 32px;
   align-items: center;
   justify-content: center;
   top: -18px;
   right: -30px;
 }

 .account-dashboard .box-check-list {
   display: flex;
   flex-wrap: wrap;
   gap: 24px;
 }

 .account-dashboard .box-check-list>* {
   width: 100%;
 }

 .banner-account {
   border-radius: 16px;
   overflow: hidden;
   position: relative;
 }

 .banner-account.bg-linear {
   background: linear-gradient(270deg, #efe7ff 0%, #eaf3ff 100%);
 }

 .banner-account .banner-content-right {
   position: absolute;
   right: 15px;
   top: 50%;
   transform: translateY(-50%);
   display: grid;
   gap: 16px;
 }

 .banner-account .banner-title {
   display: grid;
   gap: 6px;
 }

 .banner-account.banner-acc-countdown {
   padding: 30px;
   justify-content: space-between;
   gap: 15px;
   flex-wrap: wrap;
 }

 .banner-account.banner-acc-countdown .banner-content-left {
   display: grid;
   gap: 8px;
 }

 .account-address-item {
   border-radius: 16px;
   border: 1px solid var(--line);
 }

 .account-address-item .title {
   padding: 15px;
   border-bottom: 1px solid var(--line);
 }

 .account-address-item .info-detail {
   padding: 15px;
   display: grid;
   gap: 24px;
   color: var(--text);
 }

 .account-address-item .box-infor {
   display: grid;
   gap: 12px;
 }

 .account-address-item .box-btn {
   display: flex;
   gap: 12px;
 }

 .account-address-item.editing {
   background-color: #fafafa;
 }

 .account-address .btn-add-address {
   margin-bottom: 42px;
 }

 .account-address .show-form-address {
   margin-bottom: 24px;
 }

 .form-edit-account {
   text-align: center;
 }

 .form-edit-account .form-name {
   margin-bottom: 28px;
   text-align: left;
 }

 .form-edit-account .form-pass {
   text-align: left;
 }

 .form-edit-account .title-form {
   margin-bottom: 32px;
   text-align: left;
 }

 .form-edit-account .title-pass {
   margin-bottom: 24px;
 }

 .form-edit-account .tf-field:not(:last-child) {
   margin-bottom: 15px;
 }

 .form-edit-account .tf-btn {
   margin-top: 32px;
 }

 /*------------ sections ---------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 .s-blog-list-v1 .blog-item,
 .s-blog-list-v2 .blog-item {
   margin-bottom: 40px;
 }

 .s-blog-list-v1 .blog-item:last-of-type,
 .s-blog-list-v2 .blog-item:last-of-type {
   margin-bottom: 60px;
 }

 .s-blog-list-grid {
   gap: 42px 24px;
 }

 .s-blog-list-grid.grid-2 .blog-item .entry_image {
   aspect-ratio: 464/395;
 }

 .s-blog-single .heading {
   gap: 20px;
   text-align: center;
   margin-bottom: 48px;
 }

 .s-blog-single .heading>.entry-tag,
 .s-blog-single .heading>.entry-meta {
   justify-content: center;
 }

 .s-blog-single .content {
   margin-bottom: 80px;
 }

 .s-blog-single .content .entry_image {
   border-radius: 16px;
   overflow: hidden;
   margin-bottom: 42px;
 }

 .s-blog-single .content .text {
   font-size: 16px;
   line-height: 24px;
   color: var(--text);
   max-width: 1008px;
   width: 100%;
   margin: 0px auto;
   margin-bottom: 42px;
   text-align: center;
 }

 .s-blog-single .group-image {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 24px;
   margin-bottom: 65px;
 }

 .s-blog-single .group-image .entry_image {
   margin-bottom: 0 !important;
 }

 .s-blog-single .entry-social {
   display: flex;
   align-items: center;
   gap: 15px;
 }

 .s-blog-single .entry-social>p {
   font-size: 16px;
   font-weight: 500;
   line-height: 25px;
 }

 .s-blog-single .bot {
   margin-bottom: 42px;
 }

 .s-blog-single .bot .entry-tag {
   margin-bottom: 20px;
 }

 .s-blog-single .related-post {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 32px 0px 42px;
   border-top: 1px solid var(--line);
   border-bottom: 1px solid var(--line);
   gap: 30px;
 }

 .s-blog-single .related-post .post {
   display: flex;
   gap: 20px;
   align-items: center;
 }

 .s-blog-single .related-post .post:hover .icon {
   background-color: var(--primary);
   color: var(--white);
 }

 .s-blog-single .related-post .post:hover .name-post {
   color: var(--primary);
 }

 .s-blog-single .related-post p {
   font-size: 14px;
   font-weight: 500;
   line-height: 22px;
   margin-bottom: 15px;
 }

 .s-blog-single .related-post p.name-post {
   font-size: 16px;
   line-height: 19px;
   margin-bottom: 0px;
   transition: all 0.3s ease-in-out;
 }

 .s-blog-single .related-post .icon {
   width: 44px;
   height: 44px;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 50%;
   border: 1px solid var(--line);
   transition: all 0.3s ease-in-out;
   flex-shrink: 0;
 }

 .s-blog-single .related-post .text-wrap-left {
   text-align: left;
 }

 .s-blog-single .related-post .text-wrap-right {
   text-align: right;
 }

 .block-quote {
   padding: 30px;
   border-radius: 16px;
   background-color: #eeffde;
   min-height: 230px;
   display: flex;
   align-items: center;
   margin-bottom: 42px;
 }

 .block-quote p {
   font-size: 16px;
   font-weight: 500;
   line-height: 24px;
   max-width: 1008px;
   width: 100%;
   margin: 0px auto;
   text-align: center;
 }

 .sb-contact {
   border-radius: 16px;
   background-color: var(--surface);
   padding: 40px;
 }

 .sb-contact .title {
   font-size: 24px;
   font-weight: 500;
   line-height: 29px;
   margin-bottom: 30px;
 }

 .sb-contact .sub {
   color: var(--text);
   line-height: 22px;
   margin-bottom: 28px;
 }

 .sb-contact .btn-group {
   display: flex;
   flex-direction: column;
   gap: 10px;
   max-width: 252px;
   width: 100%;
   margin: 0px auto;
 }

 .sb-contact .tf-btn {
   text-transform: none;
   font-family: "DM Sans", sans-serif;
   font-weight: 600;
 }

 .s-faq .faq-item:not(:last-child) {
   margin-bottom: 52px;
 }

 .s-faq .name-faq {
   font-size: 24px;
   font-weight: 500;
   line-height: 29px;
   margin-bottom: 32px;
 }

 .s-term-user .content {
   display: grid;
   gap: 52px;
   max-width: 1008px;
   width: 100%;
   margin: 0px auto;
 }

 .s-term-user .term-title {
   font-size: 24px;
   font-weight: 500;
   line-height: 29px;
   color: var(--dark);
   margin-bottom: 24px;
 }

 .s-term-user .term-text span {
   font-weight: 500;
   color: var(--dark);
 }

 .s-term-user .text-wrap {
   display: grid;
   gap: 24px;
 }

 .tf-page-title {
   padding: 52px 0px;
   background-position: center;
   background-repeat: no-repeat;
   background-size: cover;
   background: linear-gradient(90deg,
              #fff8d6 0%,
              #ffecd6 45%,
              #f7d2cf 100%);
 }

 .tf-page-title .box-title {
   display: grid;
   gap: 12px;
   max-width: 560px;
   margin: auto;
 }

 .tf-page-title .breadcrumb-list {
   justify-content: center;
 }

 .breadcrumb-list {
   display: flex;
   gap: 8px;
   align-items: center;
 }

 .breadcrumb-list .breadcrumb-item {
   color: #757575;
 }

 .breadcrumb-list .breadcrumb-item::before {
   content: none;
 }

 .breadcrumb-list .dot {
   width: 16px;
   height: 16px;
   display: flex;
   align-items: center;
   justify-content: center;
 }

 .breadcrumb-list .dot span {
   width: 4px;
   height: 4px;
   display: inline-block;
   background-color: #757575;
   border-radius: 50%;
 }

 .breadcrumb-list .current {
   color: var(--dark);
 }

 .breadcrumb-wrap {
   padding: 32px 0px 27px;
   display: flex;
   align-items: center;
   justify-content: space-between;
 }

 .breadcrumb-prev-next {
   display: flex;
   align-items: center;
   gap: 10px;
   color: var(--dark);
 }

 .breadcrumb-prev-next .breadcrumb-back {
   font-size: 20px;
 }

 .breadcrumb-prev-next .breadcrumb-next,
 .breadcrumb-prev-next .breadcrumb-prev {
   width: 18px;
   height: 18px;
   font-size: 14px;
   display: flex;
   align-items: center;
   justify-content: center;
 }

 .s-404 {
   padding: 100px 0px;
 }

 .wg-404 {
   display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: column;
 }

 .wg-404 .image {
   max-width: 236px;
   width: 100%;
   margin-bottom: 12px;
 }

 .wg-404 .title {
   margin-bottom: 12px;
 }

 .wg-404 .sub {
   margin-bottom: 32px;
 }

 .wg-countdown .countdown__timer {
   display: flex;
   gap: 20px;
 }

 .wg-countdown .countdown__item {
   display: inline-flex;
   flex-direction: column;
   position: relative;
   width: 90px;
   height: 90px;
   text-align: center;
   justify-content: center;
   border-radius: 6px;
   border: 1px solid var(--primary);
 }

 .wg-countdown .countdown__value {
   display: inline-block;
   font-size: 36px;
   font-weight: 500;
   line-height: 44px;
   letter-spacing: -0.02em;
 }

 .wg-countdown .countdown__value .countdown__value--3 {
   width: 100%;
   max-width: 90px;
 }

 .wg-countdown-2 {
   width: max-content;
   padding: 16px 32px;
   border-radius: 8px;
   border: 1px solid var(--line);
   background-color: var(--white);
 }

 .wg-countdown-2.color-1 .countdown__value {
   color: #8f6dff;
 }

 .wg-countdown-2.gap-15 .countdown__timer {
   gap: 15px;
 }

 .wg-countdown-2.gap-15 .countdown__item:not(:last-child) .countdown__value::after {
   right: -8px;
 }

 .wg-countdown-2 .countdown__value {
   padding-top: 0px;
   font-family: "Be Vietnam Pro", serif;
   font-size: 40px;
   font-weight: 500;
   line-height: 50px;
   color: var(--primary);
 }

 .wg-countdown-2 .countdown__timer {
   display: flex;
   gap: 29px;
 }

 .wg-countdown-2 .countdown__item {
   display: flex;
   flex-direction: column;
   text-align: center;
   gap: 4px;
   min-width: 56px;
 }

 .wg-countdown-2 .countdown__item:not(:last-child) .countdown__value {
   position: relative;
 }

 .wg-countdown-2 .countdown__item:not(:last-child) .countdown__value::after {
   content: ":";
   position: absolute;
   top: 50%;
   transform: translate(50%, -50%);
   right: -14px;
   font-family: var(--Poppins);
   font-size: 20px;
   font-weight: 500;
   line-height: 30px;
   color: var(--dark);
 }

 .wg-countdown-2 .countdown__item:first-child {
   min-width: 30px;
 }

 .wg-coming-soon {
   display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: column;
   padding-top: 80px;
   padding-bottom: 100px;
 }

 .wg-coming-soon .title {
   margin-bottom: 18px;
 }

 .wg-coming-soon .sub {
   margin-bottom: 48px;
 }

 .wg-coming-soon .wg-countdown {
   margin-bottom: 48px;
 }

 .wg-coming-soon .form-email-wrap {
   max-width: 482px;
   width: 100%;
   margin-bottom: 64px;
 }

 .wg-coming-soon .form-email-wrap .button-submit {
   right: 5px;
 }

 .wg-map.style-absolute {
   position: relative;
 }

 .wg-map.style-absolute .box-store {
   position: absolute;
   left: 30px;
   top: 50%;
   transform: translateY(-50%);
   right: 15px;
   max-width: 419px;
 }

 .wg-map.style-absolute .box-store:hover {
   background-color: var(--white);
 }

 .wg-map .map {
   border-radius: 16px;
   overflow: hidden;
   height: 389px;
   width: 100%;
 }

 .s-contact .content-right,
 .s-contact .content-left {
   display: grid;
   gap: 20px;
 }

 .s-contact .wg-map {
   margin-bottom: 91px;
 }

 .s-contact .sub-title {
   font-size: 16px;
   line-height: 26px;
 }

 .s-contact.style-2 {
   display: flex;
   justify-content: center;
   flex-wrap: wrap-reverse;
   gap: 15px;
 }

 .s-contact.style-2 .content-left {
   padding: 30px;
   border-radius: 16px;
   position: relative;
   z-index: 2;
   gap: 15px;
   margin-bottom: 0;
   justify-items: flex-start;
 }

 .s-contact.style-2 .content-left .tf-btn {
   padding: 10px 24px;
   text-transform: none;
   margin-top: 20px;
 }

 .s-contact.style-2 .content-left .tf-social-icon .social-item:not(:hover) {
   background-color: transparent;
   border-color: var(--white);
 }

 .s-contact.style-2 .image-right {
   border-radius: 16px;
   overflow: hidden;
 }

 .s-contact.style-2 .image-right img {
   height: 100%;
   width: 100%;
   object-fit: cover;
 }

 .contact-list {
   display: grid;
   gap: 10px;
 }

 .contact-list p {
   font-size: 16px;
   font-weight: 500;
   line-height: 26px;
 }

 .contact-list a,
 .contact-list span {
   font-weight: 400;
   color: var(--text);
 }

 .box-store {
   padding: 40px 24px 20px;
   border-radius: 16px;
   border: 1px solid var(--line);
   background: var(--white);
   transition: all 0.3s ease-in-out;
 }

 .box-store .title {
   font-size: 16px;
   font-weight: 500;
   line-height: 25.6px;
   margin-bottom: 8px;
 }

 .box-store .contact-list {
   gap: 5px;
   margin-bottom: 20px;
 }

 .box-store:hover {
   background: var(--primary-4);
 }

 .box-store.style-2 {
   display: grid;
   gap: 15px;
   padding: 30px;
   border-color: var(--white);
 }

 .grid-box-store {
   gap: 24px;
 }

 .s-store-location .wg-map {
   margin-bottom: 24px;
 }

 .s-banner-colection .banner-content {
   overflow: hidden;
   border-radius: 16px;
   gap: 0px;
   background-color: #f7f7f7;
   position: relative;
 }

 .s-banner-colection .banner-content .image {
   width: 100%;
   height: 100%;
 }

 .s-banner-colection .image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .s-banner-colection .box-content {
   display: flex;
   flex-direction: column;
   justify-content: center;
   margin: 0px auto;
   gap: 42px;
   padding: 30px;
 }

 .s-banner-colection .box-title-banner {
   display: grid;
   gap: 24px;
 }

 .s-banner-colection.style-abs .box-content {
   position: absolute;
   left: 15px;
   bottom: 15px;
   right: 15px;
   padding: 0;
 }

 .s-banner-colection.style-abs-2 .box-content {
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   left: 15px;
   right: 15px;
   padding: 0;
 }

 .s-banner-colection.style-abs-2 .image img {
   min-height: 350px;
   object-fit: cover;
 }

 .s-banner-colection.style-lg .banner-content {
   height: 300px;
 }

 .banner-cls-bicycle .banner-content {
   height: 400px;
   width: 100%;
 }

 .banner-cls-electric .banner-content {
   background: linear-gradient(67.69deg, #eeefff 11.66%, #f6f0f0 47.21%, #ffeff6 82.77%);
   padding: 16px 0px;
 }

 .banner-cls-electric .banner-content .box-title-banner {
   gap: 12px;
 }

 .banner-cls-mega-electric.style-abs-2 .image img {
   min-height: 296px;
   object-fit: cover;
 }

 .banner-cls-phonecase .banner-content {
   background-color: unset;
   border-radius: unset;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 24px;
 }

 .banner-cls-phonecase .banner-content>* {
   width: 100%;
 }

 .banner-cls-phonecase .box-content {
   margin: unset;
   padding: 0;
 }

 .banner-cls-phonecase .image {
   border-radius: 16px;
   overflow: hidden;
 }

 .banner-cls-petaccess .banner-content {
   background-color: #ffecce;
 }

 .banner-space-1 .box-content {
   margin: 0;
   padding: 24px 86px;
 }

 .banner-cls-electric-acc.style-abs-2 .box-content {
   background-color: var(--white);
   border-radius: 16px;
   left: 15px;
   right: 15px;
   margin: unset;
   padding: 30px 15px;
 }

 .banner-cls-mega-electric .new {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   background-color: #d2a40c;
   border-radius: 22px;
   padding: 5px 12px;
 }

 .banner-cls-mega-electric .box-title-banner {
   justify-items: center;
 }

 .btn-sidebar-mb {
   position: fixed;
   top: 200px;
   left: 0;
   z-index: 50;
 }

 .btn-sidebar-mb button {
   width: 40px;
   height: 40px;
   border-radius: 0;
   border: 1px solid var(--dark);
   padding: 0;
   justify-content: center;
 }

 .btn-sidebar-mb button:hover {
   background-color: var(--white);
   color: var(--dark);
 }

 .btn-sidebar-mb.right {
   left: unset;
   right: 0;
   transform: rotate(180deg);
 }

 .s-banner-countdown {
   position: relative;
   border-radius: 16px;
   overflow: hidden;
 }

 .s-banner-countdown .image img {
   min-height: 488px;
   width: 100%;
   object-fit: cover;
 }

 .s-banner-countdown .banner-content {
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   display: grid;
   gap: 12px;
 }

 .s-banner-countdown .box-title {
   display: grid;
   gap: 4px;
 }

 .banner-cd-phonecase {
   border-radius: 16px;
   overflow: hidden;
   margin: 0px 12px;
 }

 .banner-cd-phonecase .banner-wrap {
   position: relative;
 }

 .banner-cd-phonecase .banner-content {
   z-index: 2;
   background-color: var(--white);
   border-radius: 16px;
   padding: 30px 15px;
   left: 50%;
   transform: translate(-50%, -50%);
   display: grid;
   gap: 24px;
 }

 .banner-cd-phonecase .countdown__timer {
   gap: 12px;
 }

 .banner-cd-phonecase .countdown__timer .countdown__label {
   font-size: 14px;
   line-height: 20px;
   font-weight: 500;
 }

 .banner-cd-phonecase .box-title {
   display: grid;
   gap: 8px;
 }

 .banner-cd-phonecase .image img {
   width: 100%;
 }

 .s-banner-cd-baby .banner-container {
   display: flex;
   align-items: center;
   justify-content: space-between;
   border-radius: 16px;
   background-color: #f3f2ee;
   padding: 50px;
   gap: 20px;
 }

 .s-banner-cd-baby .box-title {
   display: grid;
   gap: 12px;
 }

 .s-banner-cd-baby .content {
   display: grid;
   gap: 24px;
 }

 .s-banner-cd-baby .wg-countdown .countdown__item {
   background-color: var(--white);
   border-radius: 50%;
   width: 70px;
   height: 70px;
 }

 .s-banner-cd-baby .wg-countdown .countdown__item .countdown__value {
   font-family: "Grandstander", cursive;
   font-weight: 700;
   color: #f6620c;
 }

 .s-banner-product .content-banner {
   display: flex;
   gap: 42px;
   justify-content: center;
 }

 .s-banner-product .image-wrap {
   position: relative;
 }

 .s-banner-product .image {
   max-width: 512px;
   border-radius: 16px;
   overflow: hidden;
 }

 .s-banner-product .image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .s-banner-product .content-right {
   display: flex;
   flex-direction: column;
   gap: 42px;
   justify-content: center;
 }

 .s-banner-product .content-right .box-title {
   display: grid;
   gap: 10px;
 }

 .s-banner-product .loobook-product {
   position: absolute;
   left: 24px;
   right: 24px;
   bottom: 24px;
   padding: 12px;
   gap: 12px;
 }

 .s-banner-with-text .content-banner {
   display: flex;
   justify-content: center;
   flex-direction: column;
   gap: 24px;
 }

 .s-banner-with-text .box-title-banner {
   display: grid;
   gap: 10px;
 }

 .s-banner-with-text br {
   display: none;
 }

 .s-banner-with-text .image-banner {
   position: relative;
   overflow: hidden;
 }

 .s-banner-with-text .image {
   border-radius: 16px;
   overflow: hidden;
   width: 100%;
 }

 .s-banner-with-text .image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
 }

 .s-banner-with-text .image-1:hover {
   position: relative;
   z-index: 2;
 }

 .banner-text-fashion .image-1 {
   max-width: 531px;
   margin-left: auto;
 }

 .banner-text-fashion .image-2 {
   position: absolute;
   max-width: 316px;
   z-index: 2;
   left: 71px;
   bottom: 44px;
 }

 .banner-text-fashion .image-2 .img-style {
   height: 100%;
 }

 .banner-text-skincare.type-2 .image-1 {
   width: 85%;
 }

 .banner-text-skincare.type-2 .image-2 {
   position: absolute;
   width: 44%;
   bottom: 5%;
   right: 0;
 }

 .banner-text-jewelry .image-1 {
   width: 85%;
 }

 .banner-text-jewelry .image-2 {
   width: 39%;
   position: absolute;
   z-index: 2;
   right: 0;
   bottom: 5%;
 }

 .banner-tagline-phonecase {
   display: flex;
   gap: 50px;
   position: relative;
 }

 .banner-tagline-phonecase .image {
   border-radius: 16px;
   overflow: hidden;
 }

 .banner-tagline-phonecase .content {
   display: flex;
   flex-direction: column;
   gap: 24px;
 }

 .banner-tagline-phonecase .list-tagline li {
   display: flex;
   gap: 10px;
   padding: 15px;
 }

 .banner-tagline-phonecase .list-tagline li .box-text {
   display: grid;
   gap: 5px;
 }

 .banner-tagline-phonecase .list-tagline li:not(:last-child) {
   border-bottom: 1px solid rgba(89, 89, 89, 0.2);
 }

 .banner-tagline-phonecase .icon i {
   font-size: 35px;
   color: #c596ff;
 }

 .flat-title {
   display: grid;
   gap: 12px;
   text-align: center;
   margin-bottom: 30px;
 }

 .flat-title.style-between {
   display: flex;
   align-items: center;
   justify-content: space-between;
   text-align: start;
   flex-wrap: wrap;
 }

 .flat-title .box-title {
   display: grid;
   gap: 12px;
 }

 .flat-title.mb_1 {
   margin-bottom: 33px;
 }

 .flat-title.style-2 {
   gap: 10px;
 }

 .flat-title.style-line {
   display: flex;
   justify-content: space-between;
   align-items: flex-end;
   gap: 12px;
 }

 .flat-title.style-line .line-title {
   flex-grow: 1;
   display: block;
   border-bottom: 1px solid var(--line);
 }

 .flat-title-2 {
   display: grid;
   gap: 20px;
   margin-bottom: 30px;
 }

 .flat-title-2 .box-title {
   display: grid;
   gap: 5px;
 }

 .simpleParallax {
   height: 100%;
   width: 100%;
 }

 .simpleParallax img {
   height: 100%;
   width: 100%;
   object-fit: cover;
 }

 .wg-offer .image {
   border-radius: 16px;
   margin-bottom: 20px;
 }

 .wg-offer .content {
   display: grid;
   gap: 12px;
 }

 .wg-offer .box-title {
   display: grid;
   gap: 8px;
 }

 .flat-title-v2 {
   display: grid;
   gap: 12px;
   margin-bottom: 30px;
 }

 .tab-content .box-btn {
   margin-top: 24px;
 }

 .swiper .box-btn-viewall {
   margin-top: 24px;
 }

 .s-banner-bundle .bundle-wrap {
   display: flex;
   flex-direction: column;
   gap: 20px;
 }

 .s-banner-bundle .tf-swiper {
   width: 100%;
 }

 .s-banner-bundle .image-banner {
   width: 100%;
   height: 100%;
 }

 .s2-banner-bundle .bundle-wrap {
   position: relative;
   padding: 0px 30px 30px;
   border: 1px solid #f3a24b;
   border-radius: 16px;
 }

 .s2-banner-bundle .flat-title {
   background-color: var(--white);
   width: fit-content;
   margin: -25px auto 8px;
 }

 .s2-banner-bundle .banner-bundle {
   position: relative;
   width: 100%;
   height: 100%;
 }

 .s2-banner-bundle .banner-bundle .item {
   position: absolute;
   display: none;
   bottom: -77px;
   animation: swing2 10s infinite ease-in-out;
 }

 .bundle-wrap .nav-swiper {
   width: 34px;
   height: 34px;
 }

 .bundle-wrap .nav-swiper.swiper-button-prev {
   left: -40px;
 }

 .bundle-wrap .nav-swiper.swiper-button-next {
   right: -40px;
 }

 @keyframes swing2 {
   20% {
     transform: rotate(5deg);
   }

   40% {
     transform: rotate(-4deg);
   }

   60% {
     transform: rotate(3deg);
   }

   80% {
     transform: rotate(-2deg);
   }

   100% {
     transform: rotate(0);
   }
 }

 .s-banner-bundle .content-list {
   display: grid;
   gap: 12px;
   padding: 24px 15px;
   border-radius: 0px 0px 16px 16px;
   border: 1px solid var(--line);
 }

 .s-banner-bundle .list-recipe {
   display: flex;
   align-items: center;
   gap: 12px;
   flex-wrap: wrap;
 }

 .s-banner-bundle .list-recipe .br--line {
   display: block;
   height: 16px;
   width: 1px;
   background-color: var(--line);
 }

 .flat-iconbox {
   padding: 33px 0px;
 }

 .tf-compare-table {
   border: 1px solid var(--line);
   border-radius: 16px;
   overflow-x: scroll;
 }

 .tf-compare-table::-webkit-scrollbar {
   height: 4px;
 }

 .tf-compare-table::-webkit-scrollbar-thumb {
   border-radius: 33px;
   background: #d9d9d9;
   cursor: grab;
 }

 .tf-compare-row {
   display: flex;
 }

 .tf-compare-col {
   max-width: 240px;
   min-width: 240px;
   border-right: 1px solid var(--line);
   border-bottom: 1px solid var(--line);
   position: relative;
 }

 .tf-compare-col .tf-compare-item {
   text-align: center;
 }

 .tf-compare-col .tf-compare-item .tf-compare-image {
   aspect-ratio: 0.7862407862;
 }

 .tf-compare-item {
   display: grid;
   gap: 15px;
   padding: 20px 15px;
 }

 .tf-compare-item .tf-compare-image {
   border-radius: 16px;
   overflow: hidden;
   width: 100%;
 }

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

 .tf-compare-item .icon-close {
   font-size: 8px;
 }

 .tf-compare-item .tf-compare-remove .tf-btn-icon {
   width: 48px;
   height: 48px;
   cursor: pointer;
 }

 .tf-compare-item .tf-compare-remove .tf-btn-icon:hover {
   border-color: var(--primary);
 }

 .tf-compare-item .tf-compare-remove .tf-btn-icon:hover i {
   color: var(--primary);
   transform: unset;
 }

 .tf-compare-item .content {
   display: grid;
   gap: 10px;
 }

 .tf-compare-item .price-wrap .price-new {
   color: var(--primary);
 }

 .tf-compare-field,
 .tf-compare-value {
   padding: 15px;
 }

 .tf-compare-value {
   display: flex;
   align-items: center;
   justify-content: center;
 }

 .tf-compare-stock {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 10px;
   color: #48b02c;
 }

 .list-esd .item {
   display: grid;
   gap: 10px;
   padding: 20px 0px;
 }

 .list-esd .item:not(:last-child) {
   border-bottom: 1px solid var(--line);
 }

 .wrapper-wishlist .tf-wishlist-empty {
   grid-column: 1/-1;
   width: 100%;
 }

 .wrapper-wishlist .tf-wishlist-empty .text-noti {
   margin-bottom: 32px;
 }

 .wrapper-wishlist .tf-wishlist-empty .btn-back-shop {
   max-width: 228px;
   font-family: "DM Sans", sans-serif;
   line-height: 120%;
   font-weight: 600;
   width: 100%;
 }

 .box-testimonial-quote {
   background-color: #eeffde;
   border-radius: 16px;
   padding: 30px 15px;
   display: grid;
   gap: 20px;
 }

 .box-testimonial-quote .box-author {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 8px;
 }

 .box-testimonial-quote .box-author .avt {
   max-width: 32px;
   border-radius: 50%;
   overflow: hidden;
 }

 .box-testimonial-quote .icon-star {
   font-size: 20px;
 }

 .mega-categories {
   background-color: var(--white);
   text-align: left;
   color: var(--dark);
   padding: 12px 4px 22px;
 }

 .mega-categories li:not(:last-child) {
   margin-bottom: 4px;
 }

 .mega-categories .cate-item {
   display: flex;
   align-items: center;
   gap: 12px;
   font-weight: 500;
   color: var(--dark);
   border-radius: 4px;
   padding: 10px;
   font-size: 16px;
   line-height: 24px;
 }

 .mega-categories .cate-item .img {
   width: 42px;
   height: 42px;
   border-radius: 50%;
   background-color: var(--surface);
   overflow: hidden;
 }

 .mega-categories .cate-item:hover,
 .mega-categories .cate-item.active {
   background-color: var(--purple-2);
 }

 .mega-categories.rgb-primary .cate-item:hover,
 .mega-categories.rgb-primary .cate-item.active {
   background-color: rgb(var(--primary-rgb)/0.15);
 }

 .mega-cate-box {
   border-radius: 16px;
   overflow: hidden;
   border: 1px solid var(--purple);
 }

 .mega-cate-box .categories-title {
   display: flex;
   background-color: var(--purple);
   padding: 15px 24px;
   color: var(--white);
   display: flex;
   align-items: center;
   gap: 4px;
   font-weight: 500;
   font-size: 16px;
   line-height: 24px;
   text-transform: uppercase;
 }

 .mega-cate-box .categories-title .icon {
   font-size: 20px;
 }

 .mega-box .mega-title-box {
   display: flex;
   justify-content: space-between;
   align-items: center;
   gap: 12px;
   margin-bottom: 12px;
 }

 .mega-iconbox {
   border-radius: 16px;
   border: 1px solid var(--line);
   padding: 32px 12px;
 }

 .mega-iconbox .tf-icon-box:not(:last-child) {
   margin-bottom: 32px;
 }

 .image-compare {
   border-radius: 16px;
 }

 .image-compare .icv__arrow-wrapper {
   display: none;
 }

 .image-compare .icv__circle {
   width: 60px;
   height: 60px;
   background-color: rgba(255, 255, 255, 0.3);
   position: relative;
   border-color: transparent !important;
 }

 .image-compare .icv__circle::after {
   position: absolute;
   content: "";
   display: block;
   width: 48px;
   height: 48px;
   border-radius: 999px;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   background-color: var(--white);
 }

 .image-compare .icv__circle::before {
   position: absolute;
   font-family: "icomoon";
   content: "\e901";
   top: 50%;
   left: 50%;
   z-index: 1;
   transform: translate(-50%, -50%);
   font-size: 14px;
 }

 .image-compare .icv__label {
   padding: 9px 24px;
   color: var(--dark);
   font-family: "Albert Sans", sans-serif;
   border-radius: 40px;
   background-color: var(--white);
   font-weight: 500;
   font-size: 16px;
   line-height: 24px;
   bottom: 24px;
 }

 .image-compare .icv__label-before {
   left: 24px;
 }

 .image-compare .icv__label-after {
   right: 24px;
 }

 .img-viewer-compare-wrap {
   margin-bottom: 40px;
 }

 .banner-why-shop {
   padding-left: 15px;
   padding-right: 15px;
 }

 .s2-banner-with-text {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   gap: 30px;
   max-width: 1143px;
   margin: auto;
 }

 .s2-banner-with-text .content-with-text {
   display: grid;
   gap: 20px;
   justify-items: left;
 }

 .s2-banner-with-text .box-title-content {
   display: grid;
   gap: 12px;
 }

 .s3-banner-with-text {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   gap: 30px;
 }

 .s3-banner-with-text .content-with-text {
   gap: 20px;
   display: grid;
   justify-items: left;
 }

 .s3-banner-with-text .image-banner {
   position: relative;
   overflow: hidden;
   width: 100%;
   flex-shrink: 0;
 }

 .s3-banner-with-text .image-banner .image {
   border-radius: 16px;
   overflow: hidden;
   width: 100%;
 }

 .s3-banner-with-text .image-banner .image-1 {
   position: absolute;
   width: 41.6%;
   z-index: 2;
   left: 0px;
   bottom: 0px;
 }

 .s3-banner-with-text .image-banner .image-2 {
   width: 74%;
   margin-left: auto;
 }

 .s3-banner-with-text .box-title-content .subtitle {
   margin-bottom: 10px;
   display: inline-block;
 }

 .s3-banner-with-text .box-title-content .title {
   margin-bottom: 12px;
 }

 .banner-cls-baby .item {
   max-width: 217px;
   position: absolute;
   animation: moveRight 10s infinite linear alternate;
   right: -69px;
   bottom: -35px;
   display: none;
 }

 .grid-cls-suppermarket .s-cls .img-style {
   width: 100%;
   height: 100%;
 }

 @keyframes moveRight {
   0% {
     transform: translateX(-20px);
   }

   100% {
     transform: translateX(20px);
   }
 }

 .section-results .results-item {
   margin-bottom: 83px;
 }

 .section-bought-together {
   position: relative;
 }

 .section-bought-together h3.title {
   position: absolute;
   top: 0;
   left: 50%;
   transform: translate(-50%, -50%);
   background-color: var(--white);
   z-index: 2;
   padding: 0 34px;
 }

 .section-bought-together .wrapper {
   border-radius: 16px;
   padding: 103px 15px 62px;
   position: relative;
   z-index: 1;
   overflow: hidden;
 }

 .section-bought-together .wrapper::before {
   content: "";
   position: absolute;
   inset: 0;
   padding: 1px;
   background: linear-gradient(180deg, #f2bd7b 0%, #8575ea 100%);
   -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
   -webkit-mask-composite: xor;
   mask-composite: exclude;
   border-radius: 16px;
   z-index: -1;
 }

 .section-bought-together .swiper {
   max-width: 1154px;
   margin-left: auto;
   margin-right: auto;
 }

 .section-asked-questions .content {
   display: flex;
   flex-direction: column;
   gap: 34px;
 }

 .section-asked-questions .content .bot {
   display: flex;
   flex-direction: column;
   gap: 10px;
 }

 .section-asked-questions .content .bot a {
   width: 229px;
 }

 .section-asked-questions .faq-wrap {
   background-color: var(--white);
   padding: 64px 48px;
   border-radius: 20px;
 }

 .section-asked-questions .faq-wrap .widget-accordion:first-child {
   border-top: 0;
 }

 .section-asked-questions .faq-wrap .widget-accordion:last-child {
   border-bottom: 0;
 }

 .pickleball-product .tf-product-media-thumbs .swiper-slide.swiper-slide-thumb-active .item::after {
   border-color: rgb(0, 0, 0);
 }

 .skincare-product .tf-product-media-thumbs .swiper-slide.swiper-slide-thumb-active .item::after {
   border-color: rgb(0, 0, 0);
 }

 .flat-control-layout .box-title {
   display: grid;
   gap: 12px;
   text-align: center;
   margin-bottom: 30px;
 }

 .banner-coundownt {
   border-radius: 20px;
   overflow: hidden;
   gap: 0px;
   position: relative;
   overflow: hidden;
 }

 .banner-coundownt .banner-coundownt {
   gap: 32px;
 }

 .banner-coundownt .box-title-banner {
   gap: 16px;
 }

 .banner-coundownt .tf-btn {
   width: max-content;
 }

 .banner-coundownt .wg-countdown-2 {
   background-color: transparent;
   padding: 8px 0px;
   border: 0;
 }

 .banner-coundownt .wg-countdown-2 .countdown__value {
   line-height: 100%;
   color: #a00e00;
 }

 .banner-coundownt .wg-countdown-2 .countdown__label {
   font-weight: 500;
 }

 .banner-coundownt .countdown__item:not(:last-child) .countdown__value::after {
   top: 20%;
   transform: translateY(-50%);
 }

 /*-------------- Responsive ----------------- */
 /* ---------------------------------------------------------
    * Name: Vineta - Multipurpose eCommerce
    * Version: 1.0.3
    * Author: Themesflat
    * Author URI: http://themesflat.com 

	* Abstracts variable

    * Reset css styles

    * Components

        * header
        * footer
        * tabs
        * slider banner
        * button
        * form
        * drop down
        * carousel
        * avatar
        * pop up
        * box icon
        * hover
        * collection
        * product
        * blog
        * testimonial
        * lookbook
        * accordion
        * brand
        * zoom
        * shop
        * cart
        * account

    * section

    * Responsive

    * RTL
 ------------------------------------------------------------------------------ */
 /*--------- Abstracts variable ---------- */
 /* Media Queries
-------------------------------------------------------------- */
 @media (min-width: 768px) and (max-width: 1200px) {
   .flat-wrapper-lookbook .image-lookbook .pin-1 {
     left: 2%;
     bottom: 38%;
   }
 }

 @media (min-width: 992px) and (max-width: 1200px) {
   .sb-contact {
     padding: 30px 15px;
   }

   .form-buyX-getY .group-item-product {
     flex-direction: column;
     align-items: unset;
   }

   .form-buyX-getY .group-item-product .arrow {
     margin-top: -12px;
     margin-left: auto;
     margin-right: auto;
     transform: rotate(90deg);
   }
 }

 @media (min-width: 576px) {
   .tf-grid-layout.sm-col-2 {
     grid-template-columns: 1fr 1fr;
   }

   .tf-grid-layout.sm-col-3 {
     grid-template-columns: repeat(3, 1fr);
   }

   .tf-grid-layout.sm-col-4 {
     grid-template-columns: repeat(4, 1fr);
   }

   .tf-grid-layout.sm-col-5 {
     grid-template-columns: repeat(5, 1fr);
   }

   .tf-grid-layout.sm-col-6 {
     grid-template-columns: repeat(6, 1fr);
   }

   .tf-grid-layout.sm-col-7 {
     grid-template-columns: repeat(7, 1fr);
   }

   .dropdown-filter .dropdown-menu {
     min-width: 250px;
   }

   .popup-style-1 {
     max-width: 520px;
   }

   .footer-default .footer-body {
     padding-top: 60px;
     padding-bottom: 60px;
     border-top: 1px solid var(--line);
   }

   .row-footer {
     display: grid;
     grid-template-columns: 1fr 1fr;
     row-gap: 32px;
     column-gap: 24px;
   }

   .row-footer .s3 {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 24px;
     grid-column: 1/-1;
   }

   .slider-default .content-slider.style-2 {
     padding: 30px 24px;
   }

   .slider-default .parallax-wrap {
     padding: 150px 0px;
   }

   .s-banner-cd-baby .wg-countdown .countdown__timer {
     gap: 10px;
   }

   .s-banner-cd-baby .wg-countdown .countdown__item {
     width: 90px;
     height: 90px;
   }

   .slider-pod .content-slider {
     max-width: 550px;
   }
 }

 @media (min-width: 768px) {
   .tf-page-title {
     padding: 64px 0px;
   }

   .tf-page-title .box-title {
     gap: 24px;
   }

   .s-banner-colection.style-lg .banner-content {
     height: 400px;
   }

   .form-out-stock {
     padding: 30px;
   }

   .form-buyX-getY {
     padding: 30px;
   }

   .md-radius-80 {
     border-radius: 80px;
   }

   .px-30 {
     padding-left: 30px;
     padding-right: 30px;
   }

   .footer-info,
   .footer-heading {
     margin-bottom: 24px;
   }



   #goTop.pos1 {
     bottom: 210px;
   }

   .wrapper-wishlist.wrapper-wishlist {
     row-gap: 40px;
   }

   .flat-wrapper-iconbox>.title {
     top: -12%;
   }

   .s2-banner-with-text {
     gap: 60px;
     flex-direction: row;
   }

   .s3-banner-with-text {
     flex-direction: row;
     gap: 14px;
   }

   .s3-banner-with-text .image-banner {
     width: 59.4%;
   }

   .slider-style-2 .wrap-pagination {
     right: 50%;
   }

   .popup-search .header {
     padding: 15px 30px;
   }

   .popup-search .form-search input {
     height: 60px;
   }

   .popup-product .modal-content {
     padding: 32px 60px 40px;
   }

   .popup-product .modal-header .countdown__timer {
     font-size: 24px;
     line-height: 32px;
   }

   .fl-order-testimonial {
     padding: 32px 60px;
   }

   .tf-compare-col {
     min-width: 300px;
   }

   .table-page-cart .tf-cart-item .wg-quantity {
     width: 102px;
     height: 48px;
   }

   .tf-main-success .box-ship-address {
     padding: 32px;
   }

   .modal-quick-view .modal-content {
     flex-direction: row;
   }

   .modal-quick-view .tf-product-media-wrap {
     width: 43.4%;
   }

   .modal-quick-view .tf-product-info-wrap .tf-product-info-inner {
     position: absolute;
     inset: 0;
     overflow-y: auto;
     padding: 32px;
   }

   .modal-quick-view .tf-product-info-wrap .tf-product-variant {
     margin-bottom: 34px;
   }

   .modal-quick-view .tf-product-info-wrap .tf-product-total-quantity {
     margin-bottom: 32px;
   }

   .popup-shopping-cart.style-2 .modal-content,
   .popup-shopping-cart.style-2 .canvas-wrapper {
     flex-direction: row;
   }

   .popup-shopping-cart.style-2 .also-like-product {
     width: 228px;
     flex-shrink: 0;
     position: relative;
   }

   .popup-shopping-cart.style-2 .also-like-product .also-like-product-wrap {
     padding: 33px 28px 33px 36px;
     position: absolute;
     top: 0;
     left: 0;
     bottom: 0;
     right: 0;
     overflow: auto;
     flex-direction: column;
   }

   .popup-shopping-cart.style-2 .also-like-product .also-like-product-wrap::-webkit-scrollbar {
     width: 4px;
   }

   .popup-shopping-cart.style-2 .also-like-product .also-like-product-wrap::-webkit-scrollbar-thumb {
     background: var(--primary);
   }

   .popup-shopping-cart.style-2 .also-like-product .also-like-product-wrap::-webkit-scrollbar-track {
     background: var(--line);
   }

   .popup-shopping-cart.style-2 .also-like-product .tf-mini-cart-item {
     flex-direction: column;
     min-width: unset;
   }

   .popup-shopping-cart.style-2 .also-like-product .tf-mini-cart-item .tf-mini-cart-image {
     width: 156px;
     height: 222px;
   }

   .popup-shopping-cart.style-empty .cart-empty-wrap {
     padding: 27px 15px;
   }

   .popup-shopping-cart.style-empty .cart-empty-wrap img {
     margin-bottom: 32px;
     width: auto;
   }

   .popup-shopping-cart.style-empty .cart-empty-wrap p {
     margin-bottom: 24px;
   }

   .popup-pickup-available .modal-inner {
     padding: 40px 32px;
   }

   .popup-pickup-available .pickup-available-list {
     gap: 40px;
   }

   .modal-find-size .header {
     margin-bottom: 40px;
   }

   .modal-find-size .tf-sizeguide-table {
     margin-bottom: 42px;
   }

   .modal-find-size .modal-dialog .modal-content {
     padding: 32px;
   }

   .modal-find-size .tf-page-size-chart-content {
     display: grid;
     gap: 10px;
     grid-template-columns: 6fr 6fr;
   }

   .modal-find-size .tf-page-size-chart-content ul {
     margin-bottom: unset;
   }

   .modal-order-detail .header {
     margin-bottom: 50px;
   }

   .modal-order-detail .modal-dialog .modal-content {
     padding: 32px;
   }

   .slider-layout-right .swiper {
     margin-right: -24px;
     padding-right: 24px;
   }

   .modal-newsletter.style-row .modal-content {
     flex-direction: row;
   }

   .banner-why-shop,
   .container-7,
   .container-6,
   .container-5,
   .container-4,
   .container-3,
   .container-2,
   .slider-layout-right,
   .container-full,
   .container {
     padding-left: 24px;
     padding-right: 24px;
   }

   .list-color-product {
     gap: 5px;
   }

   .list-color-product .list-color-item {
     width: 24px;
     height: 24px;
   }

   .tf-pin-btn span {
     width: 33px;
     height: 33px;
     border: 12px solid var(--white);
   }

   .card-product .on-sale-wrap {
     top: 20px;
     right: 20px;
     left: 20px;
   }

   .card-product .on-sale-wrap.pos1 {
     top: 16px;
     left: 16px;
   }

   .card-product.card-product-size .list-product-btn {
     bottom: 40px;
   }

   .card-product.style-3.card-product-size .product-btn-main {
     bottom: 40px;
   }

   .card-product.style-3.card-product-size .list-product-btn {
     bottom: 84px;
   }

   .card-product.style-border-2.border-type-4 .on-sale-wrap {
     top: 16px;
     right: auto;
     left: 16px;
   }

   .card-product .card-product-info {
     gap: 8px;
   }

   .card-product.style-book .card-product-wrapper {
     padding-left: 40px;
     padding-right: 40px;
   }

   .grid-cls {
     gap: 24px;
   }

   .grid-cls .item1 {
     grid-area: aa;
   }

   .grid-cls .item2 {
     grid-area: bb;
   }

   .grid-cls .item3 {
     grid-area: cc;
   }

   .grid-cls .item4 {
     grid-area: dd;
   }

   .grid-cls-v1 {
     grid-template-areas: "aa bb" "aa cc";
     grid-template-columns: 1fr 1fr;
     gap: 12px;
   }

   .grid-cls-v2 {
     grid-template-areas: "aa bb dd" "aa cc dd";
     grid-template-columns: 1fr 1fr 1fr;
   }

   .grid-cls-v3 {
     grid-template-areas: "aa aa " "bb cc";
     grid-template-columns: 1fr 1fr;
   }

   .grid-cls-v3 .image {
     height: 100%;
   }

   .grid-cls-v4 {
     grid-template-areas: "cc cc" "aa bb";
     grid-template-columns: 1fr 1fr;
   }

   .grid-cls-v5 {
     grid-template-areas: "aa bb cc" "aa bb dd";
     grid-template-columns: 1fr 1fr 1fr;
   }

   .grid-cls-v5 .item3,
   .grid-cls-v5 .item4 {
     height: 320px;
   }

   .grid-cls-v6 {
     grid-template-areas: "aa aa" "aa aa" "bb cc" "dd dd";
     grid-template-columns: 1fr 1fr;
   }

   .grid-cls-v7 {
     gap: 22px;
   }

   .grid-cls-v7 .s-cls.style-absolute .content {
     left: 24px;
     right: 24px;
     bottom: 24px;
     gap: 20px;
   }

   .s-banner-with-text .content-banner {
     height: 100%;
   }

   .banner-cd-phonecase .banner-content {
     gap: 32px;
     padding: 32px 60px;
   }

   .banner-cd-fashion .banner-content {
     left: 100px;
   }

   .banner-cd-fashion .box-title {
     margin-bottom: 12px;
   }

   .banner-cd-fashion .season {
     margin-bottom: 4px;
   }

   .banner-account .banner-content-right {
     right: 144px;
     gap: 32px;
   }

   .banner-account .banner-title {
     gap: 12px;
   }

   .banner-account.banner-acc-countdown {
     padding: 40px 88px 40px 64px;
   }

   .banner-account.banner-acc-countdown .banner-title {
     gap: 4px;
   }

   .banner-account.banner-acc-countdown .banner-content-left {
     gap: 16px;
   }

   .banner-cls-baby .box-title-banner {
     gap: 16px;
   }

   .banner-cls-baby .box-content {
     gap: 32px;
   }

   .banner-cls-mega-electric .box-title-banner {
     gap: 8px;
   }

   .banner-cls-mega-electric .box-content {
     gap: 24px;
   }

   .banner-cls-electric-acc .box-content {
     gap: 33px;
   }

   .banner-cls-electric-acc .box-title-banner {
     gap: 16px;
   }

   .banner-cls-electric-acc.style-abs-2 .box-content {
     max-width: 477px;
     padding: 30px 64px;
     left: 64px;
     right: 64px;
   }

   .banner-cls-electric-acc.style-abs-2 .box-content br {
     display: block;
   }

   .banner-cls-sportwear.style-abs-2 .box-content {
     left: 84px;
   }

   .banner-cls-sportwear .box-content {
     gap: 24px;
   }

   .banner-cls-sportwear .box-title-banner {
     gap: 24px;
   }

   .banner-cls-petacces .box-content {
     gap: 42px;
   }

   .banner-cls-petacces .box-title-banner {
     gap: 24px;
   }

   .banner-cls-electric .image {
     order: 1;
   }

   .s-banner-colection.style-abs .box-content {
     left: 64px;
     bottom: 64px;
     right: 64px;
     gap: 32px;
   }

   .s-banner-colection.style-abs .box-title-banner {
     gap: 16px;
   }

   .slider-bicycle .box-content {
     bottom: 103px;
   }

   .slider-bicycle .content-slider {
     max-width: 576px;
     width: 100%;
   }

   .tf-grid-layout.md-col-2 {
     grid-template-columns: 1fr 1fr;
   }

   .tf-grid-layout.md-col-3 {
     grid-template-columns: repeat(3, 1fr);
   }

   .tf-grid-layout.md-col-4 {
     grid-template-columns: repeat(4, 1fr);
   }

   .tf-grid-layout.md-col-5 {
     grid-template-columns: repeat(5, 1fr);
   }

   .tf-grid-layout.md-col-6 {
     grid-template-columns: repeat(6, 1fr);
   }

   .tf-grid-layout.md-col-7 {
     grid-template-columns: repeat(7, 1fr);
   }

   .flat-single-grid .swiper-wrapper {
     transform: none !important;
     display: grid;
     gap: 10px;
   }

   .flat-single-grid .swiper-wrapper .item {
     border-radius: 8px;
   }

   .flat-single-grid.single-grid-2 .swiper-wrapper {
     grid-template-columns: 1fr 1fr;
   }

   .flat-single-grid.single-grid-2 .swiper-slide {
     width: 100% !important;
   }

   .flat-single-grid.single-grid-stacked .swiper-wrapper {
     grid-template-columns: 1fr 1fr;
   }

   .flat-single-grid.single-grid-stacked .swiper-slide {
     height: auto;
     width: 100% !important;
   }

   .flat-single-grid.single-grid-stacked .swiper-slide:first-child {
     grid-column: 1/-1;
     width: 100%;
   }

   .canvas-sidebar {
     max-width: 406px;
   }

   .canvas-sidebar .canvas-header {
     padding: 20px 32px;
   }

   .canvas-sidebar .canvas-header::after {
     left: 32px;
     right: 32px;
   }

   .canvas-sidebar .canvas-body {
     padding: 32px;
     padding-top: 24px;
   }

   .tf-product-fbt-wrap {
     padding: 30px;
   }

   .wrap-sw-over {
     margin-left: -12px;
     padding-left: 12px;
     margin-bottom: -20px;
     padding-bottom: 20px;
   }

   .menu-tab-line {
     gap: 24px;
   }

   .menu-tab-line.style-lg {
     gap: 48px;
   }

   .menu-tab-line.style-lg .tab-link {
     font-size: 28px;
     line-height: 29.2px;
   }

   .menu-tab-line.style-lg3,
   .menu-tab-line.style-lg2 {
     gap: 41px;
   }

   .menu-tab-line.style-md {
     gap: 0;
   }

   .menu-tab-line.style-md .tab-link {
     padding: 10px;
     font-size: 20px;
     line-height: 24px;
     min-width: 148px;
   }

   .menu-tab-line.style-md .tab-link::after {
     height: 2px;
   }

   .menu-tab-line.style-md2 .tab-link {
     font-size: 20px;
     line-height: 30px;
   }

   .menu-tab-line.style-md3 .tab-link {
     font-size: 24px;
     line-height: 50px;
   }

   .gallery-item .box-icon {
     height: 40px;
     width: 40px;
     font-size: 14px;
   }

   .blog-item-v2 .entry-content {
     padding: 24px;
   }

   .blog-item-v2 .entry-content .info-box {
     margin-bottom: 24px;
   }

   .blog-item-v2 .entry-tag {
     left: 14px;
     bottom: 14px;
   }

   .wrapper-thumbs-tes {
     display: flex;
   }

   .wrapper-thumbs-tes .box-right {
     padding: 40px 36px;
     width: 57.7%;
   }

   .wrapper-thumbs-tes .box-left {
     width: 42.3%;
     display: block;
   }

   .wrapper-thumbs-tes-2 {
     display: flex;
   }

   .wrapper-thumbs-tes-2 .box-right {
     width: 35%;
     display: block;
   }

   .wrapper-thumbs-tes-2 .box-left {
     width: 65%;
     padding: 40px 46px 40px 0px;
   }

   .wrapper-thumbs-tes-3 {
     display: flex;
   }

   .wrapper-thumbs-tes-3 .box-right {
     width: 36%;
     display: block;
   }

   .wrapper-thumbs-tes-3 .box-left {
     width: 63%;
     padding: 40px 46px 40px 0px;
   }

   .wrapper-thumbs-tes-4 {
     display: flex;
   }

   .wrapper-thumbs-tes-4 .box-left {
     width: 35%;
     display: block;
   }

   .wrapper-thumbs-tes-4 .box-right {
     width: 65%;
     padding: 40px 0px 40px 46px;
   }

   .fs-cls .content {
     bottom: 32px;
   }

   .fs-cls.lg .tf-btn {
     font-size: 18px;
     line-height: 26px;
   }

   .tab-content .swiper-pagination-progressbar {
     margin-top: 50px;
   }

   .tf-icon-box-v2 .title {
     font-size: 18px;
     line-height: 22.8px;
   }

   .flat-title .wg-countdown-2 .countdown__value {
     font-size: 32px;
     line-height: 40px;
   }

   .flat-title.style-line {
     gap: 25px;
   }

   .mega-box .mega-title-box {
     margin-bottom: 24px;
   }

   .banner-cd-phonecase {
     margin: 0px 24px;
   }

   .cls-video {
     height: 549px;
   }

   .cls-video .hover-video {
     height: 549px;
   }

   .flat-wrapper-lookbook {
     display: flex;
   }

   .flat-wrapper-lookbook .col-left,
   .flat-wrapper-lookbook .col-right {
     width: 50%;
   }

   .flat-wrapper-lookbook .col-left {
     padding: 32px 50px 27px;
   }

   .flat-wrapper-lookbook .slider-wrap-lb .title {
     margin-bottom: 32px;
   }

   .flat-wrapper-lookbook .card-product .tf-btn {
     font-size: 20px;
     line-height: 24px;
   }

   .s-cls.abs-left-center .content {
     left: 24px;
   }

   .s-cls.style-absolute .content {
     bottom: 24px;
     left: 24px;
     right: 24px;
     gap: 24px;
   }

   .s-cls.abs-tb-center .content {
     top: 24px;
     bottom: 24px;
   }

   .s-cls.abs-right-center .content {
     top: 24px;
     bottom: 24px;
     gap: 24px;
     right: 24px;
   }

   .wg-cls.style-abs .cls-btn {
     bottom: 24px;
     left: 24px;
     right: 24px;
   }

   .wg-cls.style-abs2 .cls-btn {
     bottom: 24px;
     left: 24px;
     right: 24px;
   }

   .wg-cls.style-abs2.style-lg .cls-btn {
     bottom: 32px;
   }

   .tf-page-cart-sidebar .cart-box {
     padding: 24px;
   }

   .tf-checkout-cart-main {
     padding: 27px 24px 50px;
   }

   .menu-tab-fill-lg {
     gap: 32px;
   }

   .slider-fashion-2 {
     padding: 0px 24px;
   }

   .slider-baby .clouds {
     bottom: -20px;
   }

   .cloud-footer {
     margin-bottom: -20px;
   }

   .wg-quantity .quantity-product,
   .wg-quantity .btn-quantity {
     height: 46px;
   }

   .modal-dialog-centered .icon-close {
     font-size: 16px;
     top: 5px;
     right: 5px;
   }

   .popup-quickadd .modal-content {
     padding: 30px;
   }

   .popup-quickadd .main-product-quickadd .list-size {
     gap: 16px;
   }

   .popup-quickadd .main-product-quickadd .size-btn {
     font-size: 20px;
     line-height: 120%;
     width: 48px;
     height: 48px;
   }

   .main-product-quickadd .item-product-group-btn .tf-btn {
     padding: 11px 24px;
   }

   .main-product-quickadd .item-product-group-btn .box-icon {
     width: 48px;
     height: 48px;
   }
 }

 @media (min-width: 992px) {
   .grid-cls-v6 {
     grid-template-areas: "aa aa bb cc" "aa aa dd dd";
     grid-template-columns: 1fr 1fr 1fr 1fr;
   }

   .grid-cls-v7 {
     grid-template-areas: "aa bb bb cc";
     grid-template-columns: repeat(4, 1fr);
   }

   .grid-cls-v8 {
     grid-template-areas: "aa bb cc cc";
     grid-template-columns: repeat(4, 1fr);
   }

   .fade-edge .infiniteslide_wrap::before,
   .fade-edge .infiniteslide_wrap::after {
     width: 80px;
   }

   .form-newsletter fieldset input {
     font-size: 16px;
     line-height: 25.6px;
   }

   .form-newsletter fieldset input::placeholder {
     font-size: 16px;
     line-height: 25.6px;
   }

   .form-default fieldset label {
     font-size: 16px;
     line-height: 19px;
     margin-bottom: 10px;
   }

   .slider-style-3 .content-slider {
     padding: 0px 60px;
   }

   .slider-default .content-slider.style-2 {
     padding: 40px;
   }

   .slider-fashion-women .content-slider.style-2 {
     width: max-content;
     padding: 40px 60px;
   }

   .slider-bicycle .content-slider.style-2 {
     padding: 42px;
   }

   .wg-coming-soon .tf-btn {
     padding: 9px 32px;
   }

   .modal-compare .tf-compare-buttons .tf-btn {
     padding: 11px 24px;
   }

   .modal-quick-view .tf-product-info-wrap .tf-btn {
     height: 48px;
   }

   .wg-quantity .quantity-product,
   .wg-quantity .btn-quantity {
     height: 48px;
   }

   .s2-banner-with-text .content-with-text {
     gap: 40px;
   }

   .s2-banner-with-text .box-title-content {
     gap: 16px;
   }

   .s3-banner-with-text .content-with-text {
     gap: 40px;
   }

   .s3-banner-with-text .box-title-content .title {
     margin-bottom: 24px;
   }

   .banner-group-img {
     display: flex;
     height: 642px;
   }

   .banner-group-img .banner-img {
     width: 50%;
     height: 100%;
   }

   .banner-group-img .box-content {
     margin: auto;
     padding: 40px 30px;
     left: 0;
     top: 50%;
     transform: translateY(-50%);
   }

   .banner-group-img .box-content .tf-btn {
     margin-top: 42px;
   }

   .banner-group-img .box-content .heading {
     margin-bottom: 24px;
   }

   .footer-bottom-wrap .box-right {
     gap: 49px;
   }

   .grid-jewelry .wg-cls .tf-btn {
     font-size: 20px;
     line-height: 24px;
   }

   .wg-cls.style-space .cls-content {
     gap: 12px;
   }

   .footer-newsletter {
     gap: 32px;
   }

   .footer-default .form-newsletter input {
     height: 56px;
   }

   .footer-default .form-newsletter .subscribe-button {
     padding: 16px;
   }



   .tf-btn.btn-lg {
     padding: 14px 35px;
   }

   .tf-btn.btn-md {
     padding: 11px 30px;
   }

   .banner-cls-electric .banner-content .box-content {
     gap: 32px;
   }

   .flat-title-2 {
     gap: 30px;
     margin-bottom: 52px;
   }

   .flat-title-2 .box-title {
     gap: 10px;
   }

   .grid-cls-v3 {
     grid-template-areas: "aa aa bb" "aa aa cc";
     grid-template-columns: 1fr 1fr 1fr;
   }

   .grid-cls-v4 {
     grid-template-areas: "aa cc cc" "bb cc cc";
     grid-template-columns: 1fr 1fr 1fr;
   }

   .banner-cd-phonecase .countdown__item {
     width: 109px;
     height: 112px;
   }

   .banner-cd-phonecase .countdown__item .countdown__value {
     font-size: 48px;
     line-height: 60px;
   }

   .wg-testimonial .content-top {
     padding: 40px 24px 22px;
     gap: 20px;
   }

   .wg-testimonial .box-avt {
     padding: 24px;
     gap: 12px;
   }

   .wg-testimonial .box-price {
     gap: 6px;
   }

   .wg-testimonial.style-row .image {
     max-width: 244px;
     width: 100%;
   }

   .wg-testimonial.type-1 .content-top {
     padding-top: 24px;
   }

   .card-product.style-wishlist>.icon {
     top: 20px;
     right: 20px;
     width: 45px;
     height: 45px;
   }

   .card-product .card-product-info {
     padding-top: 20px;
     gap: 10px;
     padding-bottom: 20px;
   }

   .card-product .card-product-info.pt-35 {
     padding-top: 35px;
   }

   .card-product .card-product-info .list-infor {
     padding-top: 14px;
     padding-bottom: 30px;
   }

   .card-product.style-3 .list-product-btn {
     bottom: 60px;
   }

   .card-product.style-bg .card-product-info {
     padding-left: 30px;
     padding-right: 30px;
   }

   .gallery-item .box-icon {
     opacity: 0;
     visibility: hidden;
   }

   .gallery-item:hover .box-icon {
     opacity: 1;
     visibility: visible;
   }

   .b-md-20 {
     bottom: 20px !important;
   }

   .wg-cls.style-abs .cls-btn {
     bottom: 40px;
   }

   .wg-cls.style-abs.type-2 .cls-content {
     bottom: 24px;
   }

   .wg-cls.style-abs.type-2 .cls-btn {
     bottom: 40px;
   }

   .wg-cls.style-abs.type-2 .cls-content {
     gap: 24px;
     left: 24px;
     right: 24px;
   }

   .wg-cls.style-abs.type-2 .tf-btn {
     font-size: 24px;
     line-height: 34px;
   }

   .wg-cls.style-abs.type-3 .cls-btn {
     bottom: 20px;
   }

   .banner-text-skincare .content-banner {
     padding-left: 50px;
   }

   .s-banner-with-text .content-banner {
     gap: 42px;
   }

   .s-banner-with-text .box-title-banner {
     gap: 24px;
   }

   .s-banner-with-text.banner-text-skincare .hover-shine {
     max-width: 619px;
   }

   .s-banner-with-text.banner-text-skincare .content-banner {
     gap: 32px;
   }

   .s-banner-with-text.banner-text-skincare .box-title-banner {
     gap: 12px;
   }

   .s-banner-with-text.banner-text-skincare.type-2 .box-title-banner {
     gap: 10px;
   }

   .s-banner-with-text.banner-text-skincare.space-1 .content-banner {
     gap: 60px;
   }

   .s-banner-with-text.banner-text-skincare.space-1 .content-banner .box-title-banner {
     gap: 6px;
   }

   .s-banner-with-text.banner-text-skincare.space-1 .content-banner h3 {
     font-size: 64px;
     line-height: 72px;
     margin-bottom: 20px;
   }

   .s-banner-with-text.banner-text-jewelry .box-title-banner,
   .s-banner-with-text.banner-text-pet .box-title-banner {
     gap: 16px;
   }

   .s-banner-with-text.banner-text-jewelry .content-banner,
   .s-banner-with-text.banner-text-pet .content-banner {
     gap: 33px;
   }

   .s-banner-with-text.banner-text-plant .box-title-banner {
     gap: 16px;
   }

   .s-banner-with-text.banner-text-plant .content-banner {
     gap: 33px;
     margin-right: 24px;
     margin-left: auto;
     max-width: 588px;
     width: 100%;
   }

   .s-banner-with-text.banner-text-plant.type-2 .content-banner {
     margin-left: 24px;
     margin-right: unset;
     max-width: unset;
   }

   .banner-cd-fashion .banner-content {
     left: 203px;
   }

   .account-dashboard .box-account-title {
     margin-bottom: 64px;
   }

   .banner-cls-phonecase .box-content {
     gap: 40px;
   }

   .banner-cls-phonecase .box-title-banner {
     gap: 10px;
   }

   .marquee-sale {
     padding: 23px 0px;
     height: 78px;
     display: flex;
   }

   .marquee-sale .marquee-wrapper {
     animation: infiniteScroll 60s linear infinite;
   }

   .marquee-sale .marquee-wrapper.scrollRight {
     animation: infiniteScrollRight 60s linear infinite;
   }

   .marquee-sale .marquee-child-item {
     margin: 0 40px;
   }

   .slider-baby .content-slider.style-2 {
     padding: 40px 60px;
   }

   .sidebar-blog {
     max-width: 366px;
     width: 100%;
     margin-left: auto;
   }

   .sidebar-blog.type-left {
     margin-left: unset;
     margin-right: auto;
   }

   .tab-content .tf-grid-layout {
     column-gap: 18px;
     row-gap: 40px;
   }

   .tab-content .box-btn {
     margin-top: 32px;
   }

   .tf-grid-layout {
     column-gap: 24px;
     row-gap: 24px;
   }

   .tf-grid-layout.lg-col-2 {
     grid-template-columns: 1fr 1fr;
   }

   .tf-grid-layout.lg-col-3 {
     grid-template-columns: repeat(3, 1fr);
   }

   .tf-grid-layout.lg-col-4 {
     grid-template-columns: repeat(4, 1fr);
   }

   .tf-grid-layout.lg-col-5 {
     grid-template-columns: repeat(5, 1fr);
   }

   .tf-grid-layout.lg-col-6 {
     grid-template-columns: repeat(6, 1fr);
   }

   .tf-grid-layout.lg-col-7 {
     grid-template-columns: repeat(7, 1fr);
   }

   .tf-grid-layout.style-1 {
     row-gap: 40px;
   }

   .tf-grid-layout.style-1 .wg-pagination {
     margin-top: 20px;
   }

   .tf-grid-layout.lg-col-gap-24 {
     column-gap: 24px;
   }

   .tf-grid-layout.lg-gap-24 {
     gap: 24px;
   }

   .marquee-topbar .marquee-wrapper {
     animation: infiniteScroll 60s linear infinite;
   }

   .marquee-topbar .marquee-wrapper .marquee-child-item {
     margin: 0 20px;
   }

   .zoom-active .other-image-zoom {
     opacity: 0.3;
   }

   .sb-banner .title {
     font-size: 36px;
     line-height: 43.2px;
   }

   .tf-product-fbt-wrap {
     padding: 30px;
   }

   .list-volume-discount .volume-discount-item {
     padding: 16px 30px 16px 20px;
   }

   .tf-product-volume-discount-thumbnail {
     padding: 30px;
   }

   .card-product .box-icon {
     width: 40px;
     height: 40px;
   }

   .card-product .box-icon .icon {
     font-size: 16px;
   }

   .card-product .product-btn-main .btn-main-product {
     padding: 10px 15px;
   }

   .card-product.style-3.card-product-size .list-product-btn {
     bottom: 94px;
   }

   .card-product.style-list .box-icon {
     width: 51px;
     height: 51px;
   }

   .tf-icon-box.style-2 {
     gap: 25px;
   }

   .tf-icon-box.style-2 .content {
     gap: 15px;
   }

   .tf-icon-box.style-2 .title {
     font-size: 20px;
     line-height: 20px;
   }

   .tf-icon-box.style-3 .title {
     font-size: 20px;
     line-height: 20px;
   }

   .tf-icon-box.style-3 .fs-24 {
     font-size: 24px;
     line-height: 34px;
   }

   .tf-icon-box.style-4 {
     padding: 32px 24px;
     gap: 24px;
   }

   .tf-icon-box.style-4 .title {
     font-size: 20px;
     line-height: 20px;
   }

   .tf-icon-box.style-border {
     padding: 29px 20px;
     gap: 30px;
   }

   .tf-icon-box.style-border .content {
     gap: 20px;
   }

   .tf-icon-box.style-border .content h6 {
     line-height: 29px;
   }

   .tf-icon-box.style-border .content p {
     line-height: 22px;
   }

   .tf-icon-box.style-lg {
     gap: 25px;
   }

   .tf-icon-box.style-lg .title {
     font-size: 20px;
     line-height: 20px;
   }

   .tf-icon-box.style-lg .content {
     gap: 15px;
   }

   .tf-icon-box.style-space {
     gap: 30px;
   }

   .flat-wrap-iconbox .tf-icon-box {
     gap: 20px;
   }

   .flat-wrap-iconbox .tf-icon-box .content {
     gap: 10px;
   }

   .flat-wrapper-testimonial {
     padding: 64px 30px 37px;
   }

   .banner-cls-bicycle .banner-content {
     height: 631px;
   }

   .mega-iconbox {
     padding: 40px 20px;
   }

   .mega-iconbox .tf-icon-box:not(:last-child) {
     margin-bottom: 40px;
   }

   .mega-iconbox .tf-icon-box {
     gap: 24px;
   }

   .cls-video {
     height: 649px;
   }

   .cls-video .hover-video {
     height: 649px;
   }

   .modal-share-social .modal-content {
     padding: 32px;
     padding-bottom: 48px;
   }

   .popup-quickadd .modal-content {
     padding: 48px;
   }

   .banner-shop.style-bottom .content {
     bottom: 24px;
     gap: 24px;
   }

   .banner-shop.style-bottom2 .content {
     gap: 20px;
   }

   .banner-shop.style-bottom2 .box-title {
     display: grid;
     gap: 16px;
   }

   .swiper .box-btn-viewall {
     margin-top: 36px;
   }
 }

 @media (min-width: 1025px) {
   .banner-shop.style-left-center .box-title .title {
     font-size: 36px;
     font-weight: 500;
     line-height: 43.2px;
   }

   .slider-pod .content-slider {
     max-width: 691px;
   }

   .form-edit-account .title-form {
     margin-bottom: 42px;
   }
 }

 @media (min-width: 1200px) {
   .mt-xl-40 {
     margin-top: 40px;
   }

   .s-banner-colection.style-lg .banner-content {
     height: 530px;
   }

   .s-banner-colection.style-lg .banner-content .box-content {
     gap: 48px;
   }

   .s-banner-colection.style-lg .banner-content .box-content .box-title-banner {
     gap: 24px;
   }

   .footer-heading.mb-46 {
     margin-bottom: 46px;
   }

   .skincare-product .tf-product-media-wrap {
     padding-right: 8px;
   }

   .skincare-product .tf-product-media-wrap .product-thumbs-slider {
     gap: 11px;
   }

   .skincare-product .tf-product-media-wrap .product-thumbs-slider .tf-product-media-thumbs {
     width: 109px;
     height: 588px;
   }

   .skincare-product .tf-product-media-wrap .product-thumbs-slider .tf-product-media-thumbs .item {
     height: 109px;
   }

   .skincare-product .tf-product-media-wrap .product-thumbs-slider .flat-wrap-media-product {
     width: calc(100% - 109px);
   }

   .pickleball-product .product-thumbs-slider {
     gap: 15px;
   }

   .pickleball-product .product-thumbs-slider .tf-product-media-thumbs {
     width: 139px;
   }

   .pickleball-product .product-thumbs-slider .flat-wrap-media-product {
     width: calc(100% - 139px);
   }

   .xl-radius-40 {
     border-radius: 40px !important;
   }

   .xl-radius-50 {
     border-radius: 50px !important;
   }

   .form-out-stock {
     padding: 48px;
     gap: 32px;
   }

   .form-out-stock .box-title-out-stock {
     gap: 24px;
   }

   .volume-discount-thumbnail-item .tag-sale {
     left: 28px;
     right: 28px;
   }

   .form-buyX-getY {
     padding: 36px 32px;
   }

   .form-buyX-getY .title-buyX-getY {
     margin-bottom: 47px;
   }

   .form-buyX-getY .group-item-product {
     margin-bottom: 55px;
   }

   .wd-customer-review {
     gap: 119px;
   }

   .wd-customer-review .review-heading {
     gap: 40px;
   }

   .wd-customer-review .box-rate-review {
     gap: 24px;
   }

   .wd-customer-review .review-list {
     padding-bottom: 48px;
     margin-bottom: 48px;
   }

   .form-review .tf-btn {
     margin-top: 40px;
   }

   .wd-product-descriptions .accordion-body {
     padding: 10px 0px 42px;
   }

   .modal.modalCentered:not(.show) .modal-dialog {
     transform: translate(-50px, 0px);
   }

   .modalCentered:not(.show) .modal-dialog {
     transform: translate(-50px, 0px);
   }

   #description p:not(:first-child) {
     margin-top: 32px;
   }



   .s-banner-with-text br {
     display: block;
   }

   .tf-icon-box-v2 {
     gap: 20px;
   }

   .tf-icon-box-v2 .icon {
     font-size: 32px;
   }

   .tf-icon-box-v2 .title {
     font-size: 24px;
     line-height: 28.8px;
   }

   .slider-default .parallax-wrap {
     padding: 279px 0px 304px;
   }

   .slider-style-3 .content-slider {
     padding: 0px 100px;
   }

   .popup-search .featured-product {
     padding: 0px 90px;
   }

   .s2-banner-with-text {
     gap: 101px;
   }

   .s2-banner-with-text .banner {
     min-width: 600px;
   }

   .banner-group-img .box-content {
     padding: 40px 55px;
   }

   .banner-cls-baby .banner-content {
     position: relative;
     overflow: unset;
   }

   .banner-cls-baby .image {
     border-top-left-radius: 16px;
     border-bottom-left-radius: 16px;
   }

   .banner-cls-baby .item {
     display: block;
     right: 0;
   }

   .s-banner-cd-baby .wg-countdown .countdown__item {
     width: 120px;
     height: 120px;
   }

   .s-banner-cd-baby .wg-countdown .countdown__item .countdown__value {
     font-size: 40px;
     line-height: 44px;
   }

   .banner-cd-phonecase .box-title {
     gap: 16px;
   }

   .tf-topbar {
     display: flex;
     height: 42px;
   }

   .tf-topbar.topbar-md {
     height: 40px;
   }

   .footer-default .footer-body {
     padding: 0;
   }

   .footer-default .footer-info .item:not(:last-child) .box-icon {
     margin-top: -3px;
   }

   .row-footer {
     display: flex;
     gap: 0;
   }

   .row-footer .s1 {
     width: 29%;
     padding: 60px 24px;
     padding-left: 0;
     border-right: 1px solid var(--line);
   }

   .row-footer .s2 {
     width: 41%;
     padding: 60px 32px;
     padding-right: 0;
   }

   .row-footer .s3 {
     width: 30%;
     display: flex;
     justify-content: space-between;
     padding: 60px 32px;
     border-right: 1px solid var(--line);
   }

   .footer-cloud .row-footer .s1 {
     padding-bottom: 75px;
   }

   .banner-cls-phonecase .banner-content {
     gap: 42px;
   }





   .space-abs-header .content-slider {
     margin-top: 87px;
   }

   .popup-product .modal-content {
     padding: 32px 85px 86px;
   }

   .popup-product .modal-header {
     gap: 16px;
   }

   .tf-checkout-cart-main {
     padding: 37px 32px 62px;
   }

   .tf-checkout-cart-main .box-ip-shipping,
   .tf-checkout-cart-main .box-ip-contact,
   .tf-checkout-cart-main .box-ip-checkout {
     margin-bottom: 42px;
   }

   .fl-order-testimonial {
     padding: 42px 119px;
   }

   .tf-page-cart-main .cart-note {
     padding-right: 27px;
   }

   .tf-page-cart-main .form-cart {
     margin-bottom: 40px;
   }

   .tf-page-cart-main .fl-iconbox {
     padding-right: 27px;
   }

   .tf-page-cart-main .fl-iconbox .tf-swiper {
     padding: 32px;
   }

   .tf-page-cart-sidebar {
     position: sticky;
     top: 100px;
     transition: top 0.3s ease;
   }

   .tf-page-cart-sidebar .cart-box {
     padding: 32px;
   }

   .sidebar-order-success .order-box {
     padding-bottom: 117px;
   }

   .box-testimonial-quote {
     padding: 64px 15px 58px;
     gap: 42px;
   }

   .lh-xl-32 {
     line-height: 32px;
   }

   .lh-xl-26 {
     line-height: 26px;
   }

   .list-esd {
     max-width: 645px;
     width: 100%;
   }

   .list-esd .item {
     gap: 20px;
     padding: 30px 0px;
   }

   .tf-compare-item {
     gap: 20px;
     padding: 30px 20px;
   }

   .tf-compare-table::-webkit-scrollbar {
     height: 11px;
   }

   .tf-compare-table .text-md {
     line-height: 19px;
   }

   .tf-compare-table .text-sm {
     line-height: 17px;
   }

   .tf-compare-field,
   .tf-compare-value {
     padding: 19px 20px;
   }

   .tf-compare-col {
     min-width: 360px;
   }

   .wg-testimonial.style-2.type-2 .box-btn {
     opacity: 0;
     transition: all 0.3s ease-in-out;
   }

   .wg-testimonial.style-2.type-2:hover .box-btn {
     opacity: 1;
   }

   .mb-xl-8 {
     margin-bottom: 8px;
   }

   .mb-xl-4 {
     margin-bottom: 4px !important;
   }

   .s-banner-bundle .bundle-wrap {
     gap: 40px;
     max-width: 708px;
     width: 100%;
     margin: auto;
   }

   .s-banner-bundle .list-recipe {
     gap: 24px;
   }

   .s-banner-bundle .content-list {
     gap: 24px;
     padding: 24px;
   }

   .s2-banner-bundle .bundle-wrap {
     gap: 40px;
     max-width: 806px;
     margin-left: auto;
     margin-right: 0;
     padding: 0px 49px 41px;
   }

   .s2-banner-bundle .banner-bundle .item {
     display: block;
     left: 0;
   }

   .s-cls.style-absolute .content {
     bottom: 32px;
     gap: 24px;
   }

   .s-cls.abs-left-center .content {
     left: 24px;
   }

   .s-cls.abs-left-center.type-large .content {
     left: 42px;
   }

   .s-cls.abs-left-bottom .content {
     left: 40px;
     bottom: 34px;
   }

   .s-cls.abs-left-bottom2 .content {
     left: 32px;
     bottom: 42px;
   }

   .s-cls.abs-top-center .content {
     right: 20px;
     left: 20px;
     top: 20px;
     gap: 15px;
   }

   .s-cls.abs-tb-center .content {
     top: 32px;
     bottom: 32px;
   }

   .s-cls.abs-right-center .content {
     top: 32px;
     bottom: 32px;
     gap: 32px;
     right: 75px;
   }

   .s-cls.abs-bottom-center .content {
     bottom: 32px;
     gap: 20px;
   }

   .grid-mega .item1.s-cls.abs-left-center .content {
     left: 64px;
   }

   .slider-thumb-wrap {
     gap: 40px;
   }

   .wg-map.style-absolute .box-store {
     left: 73px;
   }

   .box-store .contact-list {
     margin-bottom: 44px;
     gap: 8px;
   }

   .box-store.style-2 {
     gap: 24px;
   }

   .cls-video .cls-content {
     bottom: 24px;
     right: 24px;
     left: 24px;
     padding: 16px;
   }

   .wg-offer .image {
     margin-bottom: 34px;
   }

   .wg-offer .box-title {
     gap: 12px;
   }

   .wg-offer .content {
     gap: 24px;
   }

   .wg-offer.style-2 .image {
     margin-bottom: 24px;
   }

   .flat-title-v2 {
     margin-bottom: 48px;
     gap: 24px;
   }

   .flat-title-v2.style-2 {
     margin-bottom: 64px;
   }

   .s-contact .content-right,
   .s-contact .content-left {
     gap: 32px;
   }
 .s-contact .content-right{
     border: 4px solid #f2f2f2;padding: 50px;box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;}
   .s-contact.style-2 {
     gap: 0px;
     align-items: end;
   }

   .s-contact.style-2 .content-left {
     padding: 52px 62px;
     margin-bottom: 24px;
     gap: 19px;
   }

   .s-contact.style-2 .content-left .tf-btn {
     margin-top: 30px;
   }

   .s-contact.style-2 .image-right {
     margin-left: -120px;
   }

   .s-contact.style-2 .image-right img {
     border-radius: 16px;
   }

   .flat-title {
     margin-bottom: 48px;
   }

   .flat-title .btn-underline {
     font-size: 18px;
     line-height: 28px;
   }

   .flat-title.style-2 {
     margin-bottom: 42px;
   }

   .flat-title.mb_2 {
     margin-bottom: 60px;
   }

   .flat-title.mb_3 {
     margin-bottom: 40px;
   }

   .flat-title.mb_4 {
     margin-bottom: 63px;
   }

   .flat-title.mb_5 {
     margin-bottom: 52px;
   }

   .flat-title.mb_6 {
     margin-bottom: 72px;
   }

   .flat-title-tab-categories {
     margin-bottom: 42px;
     gap: 32px;
   }

   .flat-title-tab {
     gap: 27px;
   }

   .flat-title-tab-2 {
     margin-bottom: 64px;
   }

   .menu-tab-fill-lg {
     gap: 41px;
   }

   .banner-why-shop,
   .container-full {
     padding-left: 40px;
     padding-right: 40px;
   }

   .sidebar-filter .canvas-body {
     padding: 0;
   }

   .widget-facet .filter-color-box {
     padding-right: 60px;
   }

   .banner-tagline-phonecase {
     gap: 100px;
   }

   .banner-tagline-phonecase .list-tagline li {
     padding: 24px 20px;
   }

   .banner-tagline-phonecase .list-tagline li .box-text {
     gap: 10px;
   }

   .banner-tagline-phonecase .content {
     gap: 48px;
   }

   .banner-tagline-phonecase .icon i {
     font-size: 40px;
   }

   .card-product.style-border-2 .card-product-wrapper {
     padding: 16px 15px 32px;
   }

   .card-product.style-border-2 .card-product-info {
     padding: 0px 16px 32px;
     gap: 16px;
   }

   .card-product.style-border-2 .on-sale-wrap {
     top: 26px;
     left: 26px;
     right: 26px;
   }

   .card-product.style-border-2.border-type-2 .card-product-info {
     padding: 0px 16px 42px;
   }

   .card-product.style-border-2.border-type-3 .card-product-info {
     padding: 0px 16px 24px;
   }

   .card-product.style-border-2.border-type-2 .card-product-wrapper,
   .card-product.style-border-2.border-type-3 .card-product-wrapper {
     padding: 15px;
     padding-bottom: 20px;
   }

   .card-product.style-border-2.border-type-5 .card-product-wrapper {
     padding: 20px;
     padding-bottom: 32px;
   }

   .card-product.style-border-2.border-type-5 .card-product-info {
     padding: 0px 20px 20px;
     gap: 24px;
   }

   .card-product.style-border .card-product-wrapper {
     padding: 20px;
     padding-top: 42px;
     padding-bottom: 64px;
   }

   .card-product.style-border .card-product-info {
     padding: 0px 20px 40px;
   }

   .card-product.style-2.card-product-size .list-product-btn {
     bottom: 62px;
   }

   .card-product.style-2 .list-product-btn {
     bottom: 20px;
   }

   .card-product.style-2 .list-product-btn li {
     transform: translateY(20px);
   }

   .card-product.style-2:hover .list-product-btn li {
     transform: translateY(0px);
   }

   .card-product.card-product-size .list-product-btn {
     bottom: 20px;
   }

   .card-product.style-3.card-product-size .product-btn-main {
     bottom: 50px;
   }

   .card-product.style-3.card-product-size .list-product-btn {
     bottom: 114px;
   }

   .card-product.style-3 .list-product-btn {
     bottom: 84px;
   }

   .card-product.style-3 .list-product-btn li {
     transform: translateY(20px);
   }

   .card-product.style-3:hover .list-product-btn li {
     transform: translateY(0px);
   }

   .card-product.style-3:hover .product-btn-main {
     transform: translateY(0px);
     opacity: 1;
     visibility: visible;
     transition-delay: 0.1s;
   }

   .card-product .product-btn-main {
     right: 24px;
     left: 24px;
     bottom: 20px;
     transform: translateY(20px);
     opacity: 0;
     visibility: hidden;
   }

   .card-product .product-btn-main .btn-main-product {
     padding: 14px 15px;
   }

   .card-product .tooltip {
     display: block;
   }

   .card-product .card-product-info .inner-info-product {
     gap: 10px;
   }

   .card-product .variant-box {
     padding: 10px 6px;
   }

   .card-product .countdown-box {
     display: flex;
   }

   .card-product .countdown-box.style-2 {
     padding-left: 35px;
     padding-right: 35px;
   }

   .card-product .list-product-btn {
     top: 20px;
     right: 20px;
     gap: 16px;
   }

   .card-product .list-product-btn li {
     opacity: 0;
     visibility: hidden;
     transform: translateX(20px);
     transition: all 0.3s ease-in-out;
   }

   .card-product .box-icon {
     width: 45px;
     height: 45px;
   }

   .card-product .product-progress-sale {
     gap: 8px;
   }

   
   .card-product:hover .list-product-btn li {
     opacity: 1;
     visibility: visible;
   }

   .card-product:hover .list-product-btn li:nth-child(1) {
     transform: translateX(0px);
   }

   .card-product:hover .list-product-btn li:nth-child(2) {
     transform: translateX(0px);
     transition-delay: 0.1s;
   }

   .card-product:hover .list-product-btn li:nth-child(3) {
     transform: translateX(0px);
     transition-delay: 0.2s;
   }

   .card-product:hover .list-product-btn li:nth-child(4) {
     transform: translateX(0px);
     transition-delay: 0.3s;
   }

  

   .card-product.card-product-size:hover .countdown-box,
   .card-product.style-2:hover .countdown-box,
   .card-product.style-3:hover .countdown-box {
     transform: translateY(100%);
     bottom: -1px;
   }

   .card-product.style-list {
     gap: 24px;
   }

   .card-product.style-list .card-product-wrapper {
     aspect-ratio: 1/1.42;
   }

   .card-product.style-list .card-product-info {
     gap: 24px;
   }

   .card-product.style-list .info-list {
     gap: 15px;
   }

   .card-product.style-center .card-product-info {
     padding: 20px 20px 35px;
   }

   .card-product.style-center .list-color-item {
     width: 38px;
     height: 38px;
     gap: 7px;
   }

   .card-product.style-border-3 .card-product-info {
     padding: 30px 20px;
   }

   .card-product.style-border-3 .card-product-wrapper {
     padding: 20px;
     padding-bottom: 0;
   }

   .card-product.style-primary.style-3 .list-product-btn {
     bottom: 16px;
   }

   .card-product.style-book .card-product-wrapper {
     padding-left: 70px;
     padding-right: 70px;
   }

   .card-product.style-4 .card-product-info {
     padding: 24px 16px;
     gap: 12px;
   }

   .card-product.style-5 .card-product-info .btn-addcart {
     padding: 0px 27px;
   }

   .card-product.style-space .card-product-wrapper {
     padding: 15px 16px 32px;
   }

   .card-product.style-space .card-product-info {
     padding: 0px 16px 32px;
     gap: 16px;
   }

   .card-product.style-space-2 .card-product-wrapper {
     padding: 15px 16px 20px;
   }

   .card-product.style-space-2 .card-product-info {
     padding: 0px 16px 20px;
     gap: 16px;
   }

   .card-product.style-bg .card-product-info {
     padding-bottom: 60px;
   }

   .card-product .list-capacity-product .list-color-item .text-quantity {
     font-size: 16px;
     font-weight: 400;
     line-height: 26px;
   }

   .bundle-wrap .card-product:not(.style-2, .style-3) .list-product-btn {
     gap: 12px;
     top: 12px;
     right: 12px;
   }

   .bundle-wrap .card-product:not(.style-2, .style-3) .box-icon {
     width: 40px;
     height: 40px;
   }

   .bundle-suppermarket .image-wrap {
     margin-left: 33px;
   }

   .banner-text-skincare .content-banner {
     padding-left: 90px;
   }

   .tf-filter-dropdown,
   .tf-shop-control {
     margin-bottom: 40px;
   }

   .tf-filter-dropdown {
     gap: 20px;
   }

   .tf-filter-dropdown .meta-dropdown-filter {
     gap: 10px;
   }

   .tf-btn-filter {
     gap: 8px;
     padding: 13px 20px;
     min-width: 108px;
   }

   .tf-btn-filter .icon {
     font-size: 18px;
   }

   .tf-btn-filter .text {
     font-size: 16px;
   }

   .btn-filterDropdown .icon-close {
     font-size: 14px;
   }

   .tf-dropdown-sort {
     padding: 13px 20px;
     min-width: 244px;
   }

   .tf-dropdown-sort .text-sort-value {
     font-size: 16px;
   }

   .tf-dropdown-sort .icon {
     font-size: 14px;
   }

   .tf-dropdown-sort .dropdown-menu {
     min-width: 244px;
   }

   .dropdown-filter .dropdown-toggle {
     padding: 13px 20px;
   }

   .dropdown-filter .dropdown-menu {
     min-width: 300px;
     padding: 25px 15px;
   }

   .dropdown-filter .text-value {
     font-size: 16px;
   }

   .tf-control-layout .tf-view-layout-switch {
     width: 48px;
     height: 48px;
   }

   .lookbook-item .dropdown-menu {
     --bs-dropdown-min-width: 14rem;
   }

   .lookbook-item .dropend .dropdown-menu {
     --bs-dropdown-min-width: 367px;
   }

   .tf-grid-layout.xl-col-2 {
     grid-template-columns: 1fr 1fr;
   }

   .tf-grid-layout.xl-col-3 {
     grid-template-columns: repeat(3, 1fr);
   }

   .tf-grid-layout.xl-col-4 {
     grid-template-columns: repeat(4, 1fr);
   }

   .tf-grid-layout.xl-col-5 {
     grid-template-columns: repeat(5, 1fr);
   }

   .tf-grid-layout.xl-col-6 {
     grid-template-columns: repeat(6, 1fr);
   }

   .tf-grid-layout.xl-col-7 {
     grid-template-columns: repeat(7, 1fr);
   }

   .xl-px-26 {
     padding-left: 26px;
     padding-right: 26px;
   }

   .header-default .wrapper-header {
     min-height: 87px;
   }

   .header-default .wrapper-header .nav-icon {
     gap: 20px;
   }

   .header-default .header-top {
     border-bottom: 1px solid var(--line);
   }

   .header-medium .wrapper-header {
     min-height: 70px;
   }

   .header-absolute {
     margin-bottom: -87px;
     background: rgb(0 0 0 / 43%);
     backdrop-filter: blur(21px);
   }

   .header-absolute-2:not(.header-bg) .header-top {
     border: 0;
   }

   .tf-product-info-wrap {
     gap: 42px;
   }

   .tf-product-info-wrap:not(.style-2) .tf-product-heading {
     padding-bottom: 32px;
     margin-bottom: 8px;
   }

   .tf-product-info-wrap .product-info-countdown,
   .tf-product-info-wrap .product-progress-sale {
     margin-top: 12px;
   }

   .tf-product-info-wrap .tf-product-extra-link {
     gap: 42px;
   }

   .tf-product-info-wrap .product-stock .stock {
     margin-right: 14px;
   }

   .tf-product-info-wrap .form-group-product {
     margin-bottom: 18px;
   }

   .tf-product-info-wrap .tf-product-cate-sku {
     margin: 8px 0px;
   }

   .form-group-product .item-product {
     gap: 70px;
   }

   .form-group-product .item-product:not(:last-child) {
     margin-bottom: 24px;
   }

   .form-group-product .item-product-content {
     gap: 30px;
   }

   .form-group-product .table-group-product {
     margin-bottom: 32px;
   }

   .flat-wrap-frequently-bought-together .product-thumbs-slider {
     margin-bottom: 42px;
   }

   .tf-product-fbt {
     padding: 32px;
   }

   .tf-product-fbt .tf-btn {
     padding: 16px 32px;
   }

   .tf-variant-dropdown {
     padding: 14px 12px;
   }

   .tab-product-desc .tab-link {
     min-width: 154px;
   }

   .widget-facet:not(:last-child) {
     margin-bottom: 24px;
     padding-bottom: 32px;
   }

   .canvas-sidebar .list-icon-box .tf-icon-box:not(:last-child) {
     margin-bottom: 32px;
   }

   .canvas-sidebar .mega-box:not(:last-child) {
     margin-bottom: 40px;
   }

   .filter-drawer-wrap {
     max-width: 100%;
     position: absolute;
     z-index: 90;
     padding: 32px 32px 42px;
     top: 100%;
     left: 0;
     right: 0;
     opacity: 0;
     visibility: hidden;
     box-shadow: var(--shadow-1);
     border-radius: 16px;
   }

   .filter-drawer-wrap .widget-facet {
     margin-bottom: 0;
     padding-bottom: 0;
     border: 0;
   }

   .filter-drawer-wrap .widget-facet .collapse:not(.show) {
     display: block;
   }

   .filter-drawer-wrap .widget-facet .collapsing {
     height: auto;
     transition: unset;
   }

   .filter-drawer-wrap .facet-title {
     padding: 0px;
   }

   .filter-drawer-wrap .facet-title .icon {
     display: none;
   }

   .filter-drawer-wrap .filter-color-box {
     padding-right: 0;
   }

   .filter-drawer-wrap .canvas-body {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     overflow-y: unset;
     column-gap: 32px;
     row-gap: 40px;
   }

   .filter-drawer-wrap.show {
     margin-top: 10px;
     opacity: 1;
     visibility: visible;
   }

   .tf-product-fbt-wrap {
     padding: 32px 80px 36px;
   }

   .tf-product-fbt-wrap .fbt-info {
     gap: 16px;
   }

   .tf-product-fbt-wrap .fbt-info .bundle-variant,
   .tf-product-fbt-wrap .fbt-info .bundle-title {
     margin-right: 16px;
   }

   .tf-product-fbt-wrap .tf-product-form-fbt {
     gap: 32px;
   }

   .tf-product-fbt-wrap .list-fbt {
     margin-bottom: 24px;
   }

   .tf-product-fbt-wrap .fbt-swatches {
     gap: 16px;
   }

   .tf-product-volume-discount {
     padding: 32px 70px 42px;
   }

   .list-volume-discount .volume-discount-item .tag-sale {
     right: -40px;
   }

   .tf-product-volume-discount-thumbnail .title-discount {
     margin-bottom: 45px;
   }

   .tf-product-volume-discount-thumbnail .list-volume-discount-thumbnail {
     margin-bottom: 40px;
   }

   .tf-product-media-wrap {
     padding-right: 24px;
   }

   .list-color-product .list-color-item {
     width: 30px;
     height: 30px;
   }

   .tf-loading {
     height: 48px;
     min-width: 138px;
   }

   .hover-sw-nav {
     position: relative;
   }

   .hover-sw-nav .nav-swiper {
     visibility: hidden;
   }

   .hover-sw-nav .swiper-button-next {
     margin-right: 20px;
   }

   .hover-sw-nav .swiper-button-prev {
     margin-left: 20px;
   }

   .hover-sw-nav:hover .nav-swiper {
     visibility: visible;
     margin-left: 0;
     margin-right: 0;
   }

   .gallery-item .box-icon {
     height: 48px;
     width: 48px;
     font-size: 19px;
   }

   .tf-sw-iconbox-row .swiper-slide:not(:last-child) .tf-icon-box {
     position: relative;
     padding-right: 59px;
   }

   .tf-sw-iconbox-row .swiper-slide:not(:last-child) .tf-icon-box::after {
     position: absolute;
     content: "";
     right: 0;
     width: 1px;
     top: 9px;
     bottom: 9px;
     background-color: var(--line);
   }

   .flat-wrapper-iconbox {
     padding: 97px 60px 69px;
   }

   .flat-wrapper-iconbox .tf-icon-box .title {
     font-size: 24px;
     line-height: 30px;
   }

   .grid-cls-v1 {
     gap: 24px;
   }

   .grid-cls-v1 .wg-cls .cls-btn {
     bottom: 32px;
   }

   .grid-cls-v1 .wg-cls .tf-btn {
     font-size: 24px;
     line-height: 32px;
     min-width: 180px;
   }

   .grid-cls-v1 .item3 .btn-cls {
     min-width: 232px;
   }

   .grid-cls-sport .wg-cls .tf-btn {
     padding-top: 10px;
     padding-bottom: 10px;
     min-width: 169px;
   }

   .grid-cls-sport .item3 .tf-btn {
     min-width: 209px;
   }

   .wg-cls-2 {
     gap: 32px;
   }

   .wg-cls-2 .box-title {
     margin-bottom: 24px;
   }

   .wg-cls.style-02 .btn-cls {
     font-size: 24px;
   }

   .wg-cls.style-02 .btn-cls .icon {
     font-size: 14px;
   }

   .wrapper-thumbs-tes .box-right {
     padding: 60px 49px 60px 64px;
   }

   .wrapper-thumbs-tes .box-testimonial-main .quote {
     font-size: 39px;
   }

   .wrapper-thumbs-tes-2 .box-left {
     padding: 60px 200px 60px 0px;
   }

   .wrapper-thumbs-tes-2 .box-testimonial-main .quote {
     font-size: 48px;
   }

   .wrapper-thumbs-tes-3 .box-left {
     padding: 60px 99px 60px;
   }

   .wrapper-thumbs-tes-3 .box-testimonial-main .content {
     gap: 32px;
   }

   .wrapper-thumbs-tes-3 .box-testimonial-main .quote {
     font-size: 68px;
   }

   .wrapper-thumbs-tes-4 .box-right {
     padding: 60px 0px 60px 100px;
   }

   .wrapper-thumbs-tes-4 .box-testimonial-main {
     gap: 42px;
   }

   .wrapper-thumbs-tes-4 .box-testimonial-main .box-content {
     gap: 24px;
   }

   .flat-thumbs-tes .sw-dot-default,
   .flat-thumbs-tes .box-nav-swiper {
     margin-top: 32px;
   }

   .box-testimonial-main {
     gap: 32px;
   }

   .fs-cls .content {
     bottom: 42px;
   }

   .fs-cls .content .tf-btn {
     font-size: 20px;
     line-height: 30px;
     min-width: 200px;
   }

   .fs-cls.lg .tf-btn {
     font-size: 24px;
     line-height: 30px;
     min-width: 248px;
     padding-top: 20px;
     padding-bottom: 20px;
   }

  

   .wrapper-control-shop .tf-grid-layout {
     row-gap: 40px;
   }

   .wrapper-control-shop .tf-grid-layout .wg-pagination {
     margin-top: 20px;
   }

   .flat-wrap-cls {
     row-gap: 42px;
   }

   .flat-wrap-cls .wg-pagination {
     margin-top: 18px;
   }

   .menu-tab-line.style-lg .tab-link {
     padding: 10px 4px;
     font-size: 36px;
     line-height: 43.2px;
   }

   .menu-tab-line.style-lg .tab-link::after {
     height: 2px;
   }

   .menu-tab-line.style-lg3 .tab-link {
     font-size: 48px;
     line-height: 60px;
     padding: 0px;
   }

   .menu-tab-line.style-lg3 .tab-link::after {
     height: 3px;
   }

   .menu-tab-line.style-lg4 {
     gap: 70px;
   }

   .menu-tab-line.style-lg4 .tab-link {
     padding: 14px 0;
   }

   .menu-tab-line.style-md3 {
     gap: 48px;
   }

   .banner-shop.style-left-center .content {
     gap: 32px;
     left: 64px;
   }

   .banner-shop.style-left-center .box-title {
     gap: 20px;
   }

   .banner-shop.style-left-center .tf-btn {
     padding: 14px 37px;
   }

   .banner-shop.style-top .content {
     top: 82px;
     gap: 32px;
   }

   .banner-shop.style-top .box-title {
     gap: 20px;
   }

   .banner-shop.style-lg-bottom .content {
     bottom: 40px;
     left: 32px;
     right: 32px;
   }

   .banner-shop .box {
     padding: 20px 73px 20px 32px;
   }

   .tab-content .swiper-pagination-progressbar {
     margin-top: 112px;
   }

   .banner-cd-phonecase {
     margin: 0px 40px;
   }

   .tf-btn.btn-large {
     padding: 14px 38px;
   }

   .flat-wrapper-lookbook .col-left {
     width: 48.6%;
     padding: 48px 102px 27px;
   }

   .flat-wrapper-lookbook .col-right {
     width: 51.4%;
   }

   .flat-wrapper-lookbook .slider-wrap-lb {
     padding-left: 68px;
     padding-right: 68px;
   }

   .flat-wrapper-lookbook .slider-wrap-lb .title {
     margin-bottom: 64px;
   }

   .wg-testimonial-2 .text {
     margin-top: 40px;
   }

   .table-page-cart td {
     padding: 30px 9px;
   }



   .fl-control-sw2 .swiper-button-prev,
   .fl-control-sw .swiper-button-prev {
     left: -22px;
   }

   .fl-control-sw2 .swiper-button-next,
   .fl-control-sw .swiper-button-next {
     right: -22px;
   }

   .wg-testimonial-3 {
     margin-bottom: 55px;
     gap: 40px;
   }

   .wg-testimonial-3 .box-top {
     gap: 24px;
   }

   .wg-testimonial-3 .box-author {
     gap: 8px;
   }

   .wg-testimonial-3 .box-title-desc {
     gap: 24px;
   }

   .slider-baby .clouds {
     bottom: -65px;
   }

   .cloud-footer {
     margin-bottom: -60px;
   }

   .flat-control-layout {
     display: flex;
     gap: 60px;
     align-items: center;
   }

   .flat-control-layout .box-title {
     max-width: 480px;
     width: 100%;
     gap: 24px;
     text-align: left;
   }

   .banner-coundownt .wg-countdown-2 {
     padding: 16px 0px;
   }

   .banner-coundownt .countdown__value {
     font-size: 60px;
   }

   .s-banner-colection .box-content {
     padding: 40px 60px;
   }
 }

 @media (min-width: 1440px) {
   .banner-coundownt .countdown__value {
     font-size: 70px;
   }

   .wrapper-lookbook-1.type-2 .col-left {
     width: 50.4%;
     padding: 48px 46px 27px 182px;
   }

   .section-results .tf-grid-layout {
     gap: 122px;
   }

   .flat-control-layout {
     gap: 130px;
   }

   .slider-skincare2 .content-slider {
     gap: 48px;
   }

   .slider-skincare2 .content-slider .box-title-slider {
     gap: 32px;
   }

   .slider-space1 .content-slider {
     gap: 48px;
   }

   .slider-space1 .content-slider .box-title-slider {
     gap: 20px;
   }

   .slider-space2 .content-slider {
     gap: 40px;
   }

   .slider-space2 .content-slider .box-title-slider {
     gap: 20px;
   }

   .slider-space3 .content-slider {
     gap: 42px;
   }

   .slider-space3 .content-slider .box-title-slider {
     gap: 32px;
   }

   .slider-container .box-content {
     left: 10%;
     right: 10%;
   }

   .footer-default.spacing-1 .row-footer .s3,
   .footer-default.spacing-1 .row-footer .s2,
   .footer-default.spacing-1 .row-footer .s1 {
     padding-top: 100px;
     padding-bottom: 89px;
   }

   .footer-default.spacing-1 .row-footer .s1 {
     width: 34.375%;
   }

   .footer-default.spacing-1 .row-footer .s2 {
     width: 36.875%;
     padding-right: 0;
     padding-left: 132px;
   }

   .footer-default.spacing-1 .row-footer .s3 {
     padding-left: 0;
     gap: 0;
     justify-content: space-between;
     width: 25.41%;
   }

   .footer-default.spacing-1 .footer-heading {
     margin-bottom: 32px;
   }

   .footer-default.spacing-1 .footer-bottom-wrap {
     padding: 24px 0;
   }

   .footer-default.spacing-1 .footer-bottom-wrap p,
   .footer-default.spacing-1 .footer-bottom-wrap a {
     font-size: 16px;
     line-height: 24px;
   }

   .footer-default.spacing-1 .form-newsletter .subscribe-button.h56 {
     height: 56px;
   }

   .wrapper-thumbs-tes.type-2 .box-right {
     padding-left: 120px;
   }

   .wrapper-thumbs-tes.type-2 .box-testimonial-main {
     gap: 20px;
   }

   .wrapper-thumbs-tes.type-2 .box-testimonial-main .content {
     gap: 32px;
   }

   .wrapper-lookbook-1 .col-right {
     width: 49.31%;
   }

   .wrapper-lookbook-1.type-1 .slider-wrap-lb {
     max-width: 474px;
     margin-left: auto;
     margin-right: auto;
   }

   .banner-furniture2 .banner-content {
     padding: 48px 64px;
     gap: 60px;
   }

   .grid-cls-v2.type-1 .item3 {
     min-height: 435px;
   }

   .slider-furniture2 .content-slider {
     padding: 48px 64px !important;
     gap: 60px;
   }

   .slider-furniture2 .content-slider .box-title {
     gap: 16px;
   }

   .slider-furniture2 .content-slider .box-title .title {
     margin-bottom: 8px;
   }

   .slider-pickleball .content-slider {
     gap: 60px;
   }

   .slider-pickleball .box-title-slider .heading {
     font-size: 94px;
     line-height: 104px;
   }

   .s-cls.abs-top-center .content {
     right: 40px;
     left: 40px;
     top: 40px;
     gap: 20px;
   }

   .topbar-wraper {
     gap: 150px;
   }

   .topbar-md .topbar-wraper {
     gap: 200px;
   }

   .topbar-space .topbar-wraper {
     gap: 150px;
   }

   .slider-fashion-2 {
     padding: 0px 30px;
   }

   .banner-why-shop {
     padding-left: 115px;
     padding-right: 115px;
   }

   .row-footer .s2 {
     padding: 60px 74px 60px 80px;
   }

   .row-footer .s3 {
     padding: 60px 40px;

   }

   .tf-main-success .box-progress-order {
     padding: 32px 64px;
   }

   .tf-product-volume-discount-thumbnail {
     padding: 32px 70px 32px 45px;
   }

   .wg-testimonial.style-2.type-2 {
     padding: 40px 32px 24px;
   }

   .wg-testimonial.style-2.type-2 .br-line {
     margin: 24px 0px;
   }

   .s-banner-bundle .content-list {
     padding: 24px 48px;
   }

   .lh-19 {
     line-height: 19px;
   }

   .flat-wrap-testimonial {
     padding: 64px 0px 37px;
   }

   .main-content-account {
     gap: 64px;
   }

   .account-dashboard .content-account {
     gap: 24px;
   }

   .banner-text-jewelry .image-1 {
     max-width: 517px;
   }

   .banner-text-jewelry .image-2 {
     max-width: 275px;
     right: 48px;
     bottom: 27px;
   }

   .banner-text-skincare.type-2 .image-1 {
     max-width: 663px;
   }

   .banner-text-skincare.type-2 .image-2 {
     max-width: 361px;
     bottom: 44px;
   }

   .banner-cls-phonecase .box-content {
     padding-left: 100px;
     flex-shrink: 0;
     width: unset;
   }

   .banner-cls-phonecase .image {
     max-width: 1007px;
     width: 100%;
   }

   .slider-phonecase {
     margin: 27px 40px 0px;
   }

   .slider-electric-access .content-slider {
     margin-left: 52px;
   }

   .tf-grid-layout.xxl-col-2 {
     grid-template-columns: 1fr 1fr;
   }

   .tf-grid-layout.xxl-col-3 {
     grid-template-columns: repeat(3, 1fr);
   }

   .tf-grid-layout.xxl-col-4 {
     grid-template-columns: repeat(4, 1fr);
   }

   .tf-grid-layout.xxl-col-5 {
     grid-template-columns: repeat(5, 1fr);
   }

   .tf-grid-layout.xxl-col-6 {
     grid-template-columns: repeat(6, 1fr);
   }

   .tf-grid-layout.xxl-col-7 {
     grid-template-columns: repeat(7, 1fr);
   }

   .header-default .box-nav-menu .item-link::after {
     width: calc(100% + 80px);
   }

   .header-default .style-space .box-nav-menu {
     gap: 36px;
   }

   .box-nav-menu .mega-menu {
     left: 100px;
     right: 100px;
     padding: 32px 104px 60px;
   }

   .box-nav-menu .mega-shop {
     left: 76px;
     right: 80px;
     padding: 32px 123px 60px;
   }

   .box-nav-menu .mega-home {
     padding: 36px 160px;
   }

   .box-nav-menu .mega-tab .wrapper-sub-menu-tab .tab-pane {
     gap: 60px;
   }

   .box-nav-menu.justify-content-start .mega-home {
     left: 0;
   }

   .flat-wrap-media-product .swiper-button-next {
     right: -20px;
   }

   .flat-wrap-media-product .swiper-button-prev {
     left: -20px;
   }

   .flat-wrap-iconbox .tf-swiper {
     padding: 0px 65px;
   }
 }

 @media (min-width: 1600px) {
   .header-default .box-nav-menu {
     gap: 40px;
   }



   .s-banner-product .content-right {
     max-width: 791px;
     width: 100%;
   }

   .s-banner-product .content-banner {
     justify-content: unset;
     padding-left: 90px;
   }

   .banner-cls-baby .item {
     right: -69px;
   }

   .s2-banner-bundle .banner-bundle .item {
     left: -66px;
   }

   .tf-btn.btn-cls:hover .icon {
     margin-left: 16px;
   }

   .fl-control-sw2 .swiper-button-prev {
     left: -54px;
   }

   .fl-control-sw2 .swiper-button-next {
     right: -54px;
   }
 }

 @media (max-width: 1440px) {
   .mw-xxl-round-0 {
     border-radius: 0 !important;
   }

   .section-cls-tabs {
     gap: 30px;
   }

   .section-cls-tabs .tab-content img {
     border-radius: 16px;
   }

   .section-cls-tabs .right {
     padding: 20px 20px;
     border-radius: 16px;
   }

   .section-cls-tabs .menu-tab-line .tab-link {
     padding: 15px 0;
     font-size: 20px;
     line-height: 30px;
   }

   .section-cls-tabs .menu-tab-line .tab-link .icon {
     font-size: 14px;
     width: 70px;
     height: 50px;
   }

   .section-cls-tabs .menu-tab-line .tab-link.active {
     padding: 30px 0;
   }

   .box-nav-menu .sub-menu-style-2 {
     left: -300px;
   }

   .slider-fashion-1 .slider-wrap {
     height: 700px;
   }

   .leave-comment-wrap .title {
     font-size: 30px;
     line-height: 42px;
     margin-bottom: 36px;
   }
 }

 @media (max-width: 1399px) {

   .tf-control-layout .sw-layout-5,
   .tf-control-layout .sw-layout-6 {
     display: none;
   }
 }

 @media (min-width: 767px) and (max-width: 1199px) {
   .row-footer .s3.border-0 {
     grid-column: unset;
   }

   .row-footer .s2.border-0 {
     grid-column: 1/-1;
   }

   .row-footer .s2.border-0 .form-newsletter {
     max-width: unset;
   }
 }

 @media (max-width: 1199px) {
   .mw-pb-60 {
     padding-bottom: 60px;
   }

   .slider-layout-right.mr-xl .swiper {
     margin-right: 0;
     padding-right: 0;
   }

   .slider-jewelry {
     padding-left: 15px;
     padding-right: 15px;
   }

   .wrapper-thumbs-tes-3.type-1 .box-left {
     padding-right: 0;
     padding-left: 40px;
   }

   .pb_xl-0 {
     padding-bottom: 0 !important;
   }

   .footer-pb-2 {
     padding-bottom: 165px;
   }


   .tf-sticky-btn-atc {
     bottom: 66px;
   }

   .title-success-order .icon {
     width: 100px;
     height: 100px;
   }

   .tf-page-cart-sidebar {
     margin-top: 60px;
   }

   .tf-toolbar-bottom {
     display: flex;
   }

   .xl-pb-70 {
     padding-bottom: 65px;
   }

   .popup-search.type-search-product .wrapper-shop {
     grid-template-columns: repeat(3, 1fr);
     margin-bottom: 30px;
   }

   .popup-search.type-search-product .top-title {
     margin-bottom: 20px;
   }

   .sidebar-filter {
     position: fixed;
     bottom: 0;
     z-index: 3000;
     display: flex;
     flex-direction: column;
     background-clip: padding-box;
     outline: 0;
   }

   .sidebar-filter.left {
     top: 0;
     left: 0;
     transform: translateX(-100%);
   }

   .sidebar-filter.right {
     top: 0;
     right: 0;
     transform: translateX(100%);
   }

   .sidebar-filter.show {
     transform: none;
   }

   .banner-text-fashion .image-1 {
     width: 80%;
   }

   .banner-text-fashion .image-2 {
     left: 0%;
     bottom: 5%;
     top: 35%;
     width: 50%;
   }

   .logo-header-2,
   .logo-header {
     display: flex;
     justify-content: center;
   }

   .header-default .wrapper-header .nav-icon {
     gap: 10px;
   }

   .header-absolute-2 {
     margin-bottom: -64px;
   }

   .header-absolute-2:not(.header-bg) .logo-header .logo-white {
     display: block;
   }

   .header-absolute-2:not(.header-bg) .logo-header .logo-dark {
     display: none;
   }

   .header-absolute-2:not(.header-bg) .nav-icon .nav-icon-item {
     color: var(--white);
   }

   .header-absolute-2:not(.header-bg) .mobile-menu {
     color: var(--white);
   }

   .slider-scroll,
   .product-thumbs-slider {
     flex-direction: column;
   }

   .slider-scroll .flat-wrap-media-product,
   .product-thumbs-slider .flat-wrap-media-product {
     width: 100%;
   }

   .slider-scroll .tf-product-media-thumbs,
   .product-thumbs-slider .tf-product-media-thumbs {
     order: 1;
     width: 100%;
   }

   .tab-vertical-product-desc {
     display: block;
   }

   .tab-vertical-product-desc .menu-tab {
     display: flex;
     overflow: auto;
     gap: 20px;
     border-left: 0;
     border-bottom: 1px solid var(--line);
   }

   .tab-vertical-product-desc .tab-link {
     white-space: nowrap;
     padding: 12px 0px;
   }

   .tab-vertical-product-desc .tab-link::after {
     top: auto;
     bottom: 0;
     height: 1px;
     width: 0;
     left: 50%;
     transform: translateX(-50%);
   }

   .tab-vertical-product-desc .tab-link.active::after {
     width: 100%;
     height: 1px;
   }

   .tab-vertical-product-desc .tab-content {
     margin-top: 20px;
   }

   .tab-vertical-product-desc .wd-product-descriptions {
     padding: 30px;
   }

   .tf-control-layout .sw-layout-4 {
     display: none;
   }

   .card-product.card-product-size .countdown-box {
     bottom: 40px;
   }

   .mx_40 {
     margin-left: 24px;
     margin-right: 24px;
   }

   .flat-controltab-nav .box-nav-swiper {
     display: none;
   }
 }

 @media (max-width: 1024px) {
   .section-results .results-item {
     margin-bottom: 30px;
   }

   h1,
   .display-2xl {
     font-size: 52px;
     line-height: 70px;
   }

   .fs-84,
   .display-2xl-2 {
     font-size: 52px;
     line-height: 62px;
   }

   h2,
   .display-xl,
   .display-xl-2 {
     font-size: 40px;
     line-height: 52px;
   }

   h3,
   .display-lg,
   .display-lg-2,
   .display-lg-3 {
     font-size: 38px;
     line-height: 50px;
   }

   .display-lg-7,
   .display-lg-6,
   .display-lg-5,
   .display-lg-4 {
     font-size: 38px;
     line-height: 48px;
   }

   h4,
   .display-md,
   .display-md-2,
   .display-md-3 {
     font-size: 30px;
     line-height: 38px;
   }

   h5,
   .display-sm {
     font-size: 28px;
     line-height: 36px;
   }

   h6,
   .display-xs {
     font-size: 22px;
     line-height: 30px;
   }

   .display-xs-2 {
     font-size: 22px;
     line-height: 32px;
   }

   .flat-spacing-35,
   .flat-spacing-33,
   .flat-spacing-3 {
     padding-top: 75px;
     padding-bottom: 75px;
   }

   .flat-spacing-6,
   .flat-spacing {
     padding-top: 80px;
     padding-bottom: 80px;
   }

   .flat-spacing-11 {
     padding-top: 80px;
     padding-bottom: 80px;
   }

   .flat-spacing-14 {
     padding-top: 73px;
     padding-bottom: 88px;
   }

   .flat-spacing-15 {
     padding-top: 80px;
     padding-bottom: 80px;
   }

   .flat-spacing-16 {
     padding-top: 80px;
     padding-bottom: 80px;
   }

   .flat-spacing-17 {
     padding-top: 80px;
     padding-bottom: 80px;
   }

   .flat-spacing-19 {
     padding-top: 87px;
     padding-bottom: 100px;
   }

   .flat-spacing-21 {
     padding-top: 80px;
     padding-bottom: 80px;
   }

   .flat-spacing-22 {
     padding-top: 80px;
     padding-bottom: 80px;
   }

   .flat-spacing-23 {
     padding-top: 100px;
     padding-bottom: 100px;
   }

   .flat-spacing-28,
   .flat-spacing-26 {
     padding-top: 100px;
     padding-bottom: 80px;
   }

   .flat-spacing-27 {
     padding-top: 125px;
     padding-bottom: 100px;
   }

   .flat-spacing-29 {
     padding-top: 73px;
     padding-bottom: 88px;
   }

   .flat-spacing-30 {
     padding-top: 60px;
     padding-bottom: 60px;
   }

   .tf-product-info-wrap .tf-product-delivery-return {
     display: block;
   }

   .tf-product-info-wrap .tf-product-delivery-return .product-delivery:not(:last-child) {
     padding-bottom: 25px;
     margin-bottom: 25px;
     border-right: 0;
     border-bottom: 1px solid var(--line);
   }

   .banner-shop .box-title .title {
     font-size: 30px;
     line-height: 36px;
   }
 }

 @media (max-width: 991px) {
   .slider-jewelry {
     padding-left: 15px;
     padding-right: 15px;
   }

   .slider-jewelry .heading {
     font-size: 40px;
     line-height: 52px;
   }

   .tf-product-info-wrap .tf-product-total-quantity .group-btn.type-1 {
     flex-wrap: wrap;
   }

   .tf-product-info-wrap .tf-product-total-quantity .group-btn.type-1 .btn-add-to-cart {
     order: 1;
   }

   .banner-space-1 .box-content {
     padding: 24px 30px;
   }

   .mt-lg-40 {
     margin-top: 40px !important;
   }

   .section-asked-questions .content {
     margin-bottom: 40px;
     gap: 24px;
   }

   .section-asked-questions .faq-wrap {
     padding: 24px 15px;
     border-radius: 8px;
   }

   .wd-customer-review {
     flex-direction: column;
   }

   .wg-cls-text {
     padding: 15px;
   }

   .flat-wrapper-testimonial>img {
     width: 150px;
   }

   .flat-wrapper-testimonial .img-item-2 {
     left: 0;
     bottom: 0;
   }

   .flat-wrapper-testimonial .img-item-1 {
     top: 0;
   }

   .grid-cls-suppermarket .s-cls {
     height: 400px;
   }

   @keyframes floating {
     0% {
       transform: translateY(0px);
     }

     100% {
       transform: translateY(10px);
     }
   }

   .banner-text-skincare .text-xl-2 {
     font-size: 18px;
     line-height: 22px;
   }

   .s-contact .content-left {
     margin-bottom: 42px;
   }

   .s-blog-single {
     padding-top: 80px;
     padding-bottom: 60px;
   }

   .popup-search.type-search-product .wrapper-shop {
     row-gap: 30px;
   }

   .banner-tagline-phonecase {
     flex-wrap: wrap;
     gap: 30px;
   }

   .banner-tagline-phonecase .image {
     width: 100%;
     height: 450px;
   }

   .banner-tagline-phonecase .content {
     gap: 5px;
   }

   .banner-tagline-phonecase .list-tagline li {
     padding-left: 0px;
   }

   .card-product.style-list .box-icon {
     width: 46px;
     height: 46px;
   }

   .wg-pagination {
     gap: 8px;
   }

   .wg-pagination .pagination-item {
     width: 36px;
     height: 36px;
     font-size: 14px;
   }

   .banner-lookbook {
     height: 500px;
   }

   .banner-container-wrap {
     margin-bottom: 60px;
   }

   .s-banner-cd-baby .banner-container {
     flex-wrap: wrap-reverse;
     justify-content: center;
     text-align: center;
     padding: 30px 15px;
   }

   .banner-cls-phonecase .banner-content {
     flex-wrap: wrap-reverse;
   }

   .s-banner-colection .box-content {
     gap: 20px;
   }

   .s-banner-colection .box-title-banner {
     gap: 8px;
   }

   .s-banner-colection br {
     display: none;
   }

   .slider-fashion-3 .image {
     margin-left: 100px;
   }

   .slider-default .box-title-slider,
   .slider-style-2 .box-title-slider {
     gap: 10px;
   }

   .slider-default .content-slider,
   .slider-style-2 .content-slider {
     gap: 20px;
   }

   .slider-default .slider-wrap {
     height: 500px;
   }

   .sb-contact {
     margin-bottom: 50px;
   }

   .sb-banner .image {
     max-height: 600px;
   }

   .flat-single-product {
     padding-bottom: 80px;
   }

   .nav-swiper {
     width: 40px;
     height: 40px;
   }

   .tf-btn {
     padding: 10px 24px;
     gap: 8px;
   }

   .tf-product-info-wrap .tf-product-extra-link {
     gap: 15px;
   }

   .tf-bundle-product-item {
     gap: 15px;
   }

   .tf-bundle-product-item .bundle-image {
     width: 100px;
     min-width: 100px;
   }

   .tf-product-fbt-wrap .fbt-image {
     width: 100px;
     min-width: 100px;
   }

   .tf-product-fbt-wrap .list-fbt {
     gap: 20px;
   }

   .wg-cls {
     gap: 12px;
   }

   .main-content-account {
     flex-wrap: wrap;
   }

   #goTop {
     right: 20px;
     width: 32px;
     height: 32px;
   }

   .sec-blog {
     padding-top: 80px;
     padding-bottom: 100px;
   }
 }

 @media (max-width: 767px) {
   .slider-control-img .slider-wrap {
     overflow: hidden;
   }

   .slider-control-img .slider-wrap img {
     position: absolute;
     top: 0;
     right: 0;
     width: 700px;
     min-width: max(100%, 700px);
   }

   .slider-control-img .slider-wrap .image {
     position: relative;
   }

   .slider-control-img .slider-wrap .image::after {
     position: absolute;
     content: "";
     width: 100%;
     height: 100%;
     background-color: rgba(0, 0, 0, 0.4);
     top: 0;
     left: 0;
   }

   .wrapper-thumbs-tes.type-2 .box-right {
     padding-left: 0;
     padding-right: 0;
   }

   .wrapper-lookbook-1.type-1 .col-left {
     padding-top: 24px;
   }

   .wrapper-thumbs-tes-3.type-1 .box-left {
     padding-left: 0px;
   }

   .box-store .bot .tf-btn {
     font-size: 16px;
   }

   .md-px-0 {
     padding-left: 0 !important;
     padding-right: 0 !important;
   }

   .form-buyX-getY .item-product::before {
     top: 24px;
   }

   .form-buyX-getY .group-item-product .arrow {
     width: 42px;
     height: 42px;
   }

   .sec-blog {
     padding-top: 60px;
     padding-bottom: 80px;
   }

   .s-blog-single {
     padding-top: 60px;
     padding-bottom: 60px;
   }

   .section-results .tf-grid-layout {
     row-gap: 34px;
   }

   .section-results .results-item {
     margin-bottom: 20px;
   }

   .section-cls-tabs {
     flex-direction: column;
   }

   .section-cls-tabs .left,
   .section-cls-tabs .right {
     width: 100%;
   }

   .leave-comment-wrap .title {
     font-size: 24px;
     line-height: 36px;
     margin-bottom: 32px;
   }

   .s-term-user .term-title {
     font-size: 20px;
     line-height: 28px;
     margin-bottom: 20px;
   }

   .modal-compare .title {
     margin-bottom: 24px;
   }

   .s-contact .wg-map {
     margin-bottom: 60px;
   }

   .sidebar-order-success .order-box {
     padding-bottom: 24px;
   }

   .logo-header img {
     width: 110px;
   }

   .form-default fieldset label {
     font-size: 14px;
     line-height: 22px;
   }

   .s-blog-single .group-image {
     margin-bottom: 30px;
     flex-wrap: wrap;
   }

   .tf-social-icon.style-1 a {
     width: 38px;
     height: 38px;
     font-size: 14px;
   }

   .flat-wrapper-testimonial>img {
     width: 120px;
   }

   .flat-wrapper-iconbox {
     padding: 60px 24px 24px;
   }

   .footer-default {
     font-size: 14px;
     line-height: 22px;
   }

   .grid-cls-suppermarket .s-cls {
     height: 350px;
   }

   .grid-cls-suppermarket .s-cls .content {
     right: 100px;
   }

   .banner-lookbook .lookbook-item.position3 {
     left: 37%;
   }

   .grid-cls-v5 .item1,
   .grid-cls-v5 .item2,
   .grid-cls-v5 .item3,
   .grid-cls-v5 .item4 {
     height: 400px;
   }

   .footer-logo {
     max-width: 108px;
   }

   .s3-banner-with-text .content-with-text,
   .s2-banner-with-text .content-with-text {
     text-align: center;
     justify-items: center;
   }

   .flat-title.style-between {
     justify-content: center;
     text-align: center;
     flex-direction: column;
     align-items: center !important;
   }

   .image-compare .icv__img-a {
     height: 300px;
     object-fit: cover;
   }

   .image-compare .icv__label {
     padding: 6px 20px;
     font-size: 14px;
     line-height: 22px;
     bottom: 12px;
   }

   .image-compare .icv__label-before {
     left: 12px;
   }

   .image-compare .icv__label-after {
     right: 12px;
   }

   .image-compare .icv__circle {
     width: 42px;
     height: 42px;
   }

   .image-compare .icv__circle::after {
     width: 32px;
     height: 32px;
   }

   .image-compare .icv__circle::before {
     font-size: 12px;
   }

   .tf-main-success .box-progress-order {
     gap: 12px;
     text-wrap: nowrap;
     overflow-x: auto;
   }

   .tf-main-success .box-progress-order .order-progress-item {
     border: 0 !important;
     padding: 0px 8px;
     gap: 8px;
   }

   .tf-main-success .box-timeline-order {
     margin: 42px auto 32px;
   }

   .title-success-order .icon {
     width: 80px;
     height: 80px;
   }

   .tf-checkout-cart-main .grid-2,
   .tf-checkout-cart-main .grid-3 {
     grid-template-columns: 1fr;
   }

   .table-page-cart thead {
     display: none;
   }

   .table-page-cart .tf-cart-item {
     margin-bottom: 15px;
     padding-inline-start: 94px;
     min-height: 140px;
     display: block;
     font-size: 12px;
     font-weight: 500;
     position: relative;
   }

   .table-page-cart .tf-cart-item .wg-quantity {
     padding: 2px 4px;
   }

   .table-page-cart .tf-cart-item .tf-cart-item_total {
     width: 100%;
   }

   .table-page-cart .tf-cart-item .img-box {
     position: absolute;
     top: 0;
     left: 0;
     overflow: hidden;
     margin-bottom: 0;
     padding-bottom: 0;
     border-bottom: none;
     width: 80px;
     max-height: 110px;
   }

   .table-page-cart .tf-cart-item td {
     display: flex;
     align-items: center;
     flex-direction: row;
     flex-wrap: wrap;
     padding: 10px 0;
     margin: 0;
   }

   .table-page-cart .tf-cart-item td:not(:last-child) {
     border-bottom: 1px solid var(--line);
   }

   .table-page-cart .tf-cart-item td[data-cart-title]:before {
     content: attr(data-cart-title);
     color: var(--dark);
     text-align: start;
     flex: 1 1 auto;
   }

   .table-page-cart .tf-cart-item_product .cart-info .variants {
     margin-bottom: 15px;
   }

   .tf-sticky-btn-atc .tf-sticky-atc-product {
     display: none !important;
   }

   .tf-sticky-btn-atc .tf-sticky-atc-infos {
     width: 100%;
   }

   .tf-sticky-btn-atc .tf-sticky-atc-infos form {
     flex-direction: column;
   }

   .wd-form-address {
     padding: 20px 15px;
   }

   .account-orders .account-no-orders-wrap img {
     margin-bottom: 30px;
   }

   .account-orders .account-no-orders-wrap .text {
     margin-bottom: 24px;
   }

   .modal-compare .modal-content {
     padding: 24px 15px;
   }

   .modal-order-detail .list-infor {
     gap: 15px;
     margin-bottom: 32px;
   }

   .modal-order-detail .list-infor li:not(:last-child) {
     padding-right: 15px;
   }

   .modal-order-detail .tb-order-detail [data-title]:before {
     content: attr(data-title);
     text-align: start;
     flex: 1 1 auto;
   }

   .modal-order-detail .tb-order-detail .item {
     font-size: 14px;
   }

   .modal-order-detail .tb-order-detail .order-detail-item:not(.subtotal) {
     padding: 15px;
     padding-left: 90px;
     position: relative;
     flex-direction: column;
     align-items: start;
     gap: 10px;
   }

   .modal-order-detail .tb-order-detail .order-detail-item:not(.subtotal) .image {
     position: absolute;
     top: 15px;
     left: 0;
     width: 80px;
     height: 111.7px;
   }

   .modal-order-detail .tb-order-detail .order-detail-item:not(.subtotal) .item {
     width: 100%;
     display: flex;
     justify-content: space-between;
   }

   .modal-order-detail .tb-order-detail .subtotal .item {
     width: max-content;
   }

   .modal-share-social .wrap-code {
     margin-bottom: 20px;
   }

   .popup-style-2 .modal-content {
     padding: 26px 20px;
   }

   .popup-style-2 .modal-header {
     margin-bottom: 20px;
   }

   .form-ask-question button {
     margin-top: 20px;
   }

   .popup-search.type-search-product .wrapper-shop {
     grid-template-columns: repeat(2, 1fr);
   }

   .wg-map .map {
     height: 350px;
   }

   .wg-map.style-absolute .box-store {
     position: unset;
     transform: unset;
     max-width: 100%;
     text-align: center;
   }

   .wg-map.style-absolute .box-store:not(.box-store-bg) {
     padding: 30px 0px 0px;
   }

   .wg-map.style-absolute .box-store.box-store-bg {
     margin-top: 24px;
   }

   .banner-account.banner-acc-countdown {
     padding: 15px;
   }

   .account-dashboard .box-check-list {
     gap: 15px;
   }

   .account-dashboard .banner-account .image img {
     height: 250px;
     object-fit: cover;
   }

   .popup-style-1 .popup-header {
     padding: 15px;
     padding-bottom: 10px;
   }

   .popup-style-1 .popup-header::after {
     left: 15px;
     right: 15px;
   }

   .popup-style-1 .popup-inner {
     padding: 15px;
   }

   .modal-before-you-leave .content {
     margin: 0 15px;
     padding: 20px 0;
     margin-bottom: 20px;
   }

   .modal-before-you-leave .content .heading {
     margin-bottom: 16px;
   }

   .modal-before-you-leave .tf-mini-cart-sroll {
     padding-left: 15px;
     padding-right: 15px;
   }

   .popup-shopping-cart .tf-minicart-recommendations,
   .popup-shopping-cart .tf-mini-cart-tool-content,
   .popup-shopping-cart .tf-mini-cart-bottom-wrap,
   .popup-shopping-cart .tf-mini-cart-tool,
   .popup-shopping-cart .tf-mini-cart-threshold,
   .popup-shopping-cart .tf-mini-cart-item {
     padding-left: 15px;
     padding-right: 15px;
   }

   .popup-shopping-cart .tf-mini-cart-tool-content .tf-cart-tool-btns .tf-btn {
     padding-left: 10px;
     padding-right: 10px;
     font-size: 14px;
     height: 48px;
   }

   .popup-shopping-cart.style-2 .also-like-product .tf-mini-cart-item .tf-mini-cart-info {
     align-items: flex-start;
   }

   .popup-search .modal-content {
     padding: 50px 0;
   }

   .popup-search .looking-for-wrap {
     margin-bottom: 30px;
   }

   .popup-search .heading {
     font-size: 20px;
     font-weight: 500;
     line-height: 30px;
     margin-bottom: 24px;
   }

   .popup-search .form-search {
     margin-bottom: 24px;
   }

   .modal-newsletter.style-absolute .modal-content img {
     min-height: 500px;
   }

   .modal-newsletter.style-row .modal-top {
     width: 100%;
     height: 300px;
   }

   .modal-newsletter.style-row .modal-bottom {
     width: 100%;
   }

   .card-product .tooltip  {
     display: none !important;
   }

   .card-product .price-wrap {
     font-size: 14px;
     line-height: 20px;
   }

   .card-product .list-product-btn li.wishlist,
   .card-product .list-product-btn li.compare {
     display: none;
   }

   .card-product .list-product-btn .box-icon.wishlist,
   .card-product .list-product-btn .box-icon.compare {
     display: none;
   }

   .card-product.style-2 .list-product-btn {
     border-radius: 30px;
     overflow: hidden;
   }

   .card-product.style-2 .list-product-btn .box-icon {
     border: none;
   }

   .card-product.style-2 .list-product-btn li .quickview {
     border-radius: 0 30px 30px 0 !important;
   }

   .card-product.style-2 .list-product-btn li:first-child .box-icon {
     border-right: 1px solid var(--line);
   }

   .card-product.style-3 .product-btn-main .btn-main-product {
     padding: 6px;
   }

   .card-product.style-3 .product-btn-main .btn-main-product span {
     font-size: 12px;
     line-height: 20px;
   }

   .card-product.style-3 .product-btn-main .btn-main-product .icon {
     display: none;
   }

   .card-product.style-3 .product-btn-main .btn-main-product.quickview {
     display: flex;
   }

   .card-product.out-of-stock .card-product-wrapper::before {
     content: "Sold Out";
     width: 60px;
     height: 60px;
     font-size: 10px;
   }

   .card-product.style-list .add-to-cart {
     padding: 6px 24px;
     font-size: 14px;
   }

   .card-product.style-list .box-icon {
     width: 38px;
     height: 38px;
   }

   .card-product.style-list .list-product-btn {
     gap: 8px;
   }

   .grid-cls-v1 .wg-cls .image {
     height: 400px;
   }

   .banner-text-plant .image img {
     max-height: 500px;
   }

   .s-banner-with-text .content-banner {
     text-align: center;
     gap: 15px;
     margin-top: 30px;
   }

   .s-banner-with-text .banner-container-wrap {
     margin-bottom: 50px;
   }

   .s-banner-with-text .box-title-banner {
     gap: 5px;
   }

   .s-banner-product .image-wrap {
     width: 100%;
   }

   .s-banner-product .content-banner {
     gap: 20px;
     flex-wrap: wrap;
   }

   .s-banner-product .content-right {
     gap: 20px;
   }

   .s-banner-product .content-right .box-title {
     gap: 5px;
   }

   .s-banner-product .image {
     max-width: unset;
     height: 600px;
   }

   .wg-countdown-2 .countdown__item {
     gap: 0px;
     min-width: 40px;
   }

   .wg-countdown-2 .countdown__value {
     font-size: 30px;
     line-height: 40px;
   }

   .s-banner-countdown .banner-content {
     left: 15px;
     right: 15px;
     transform: translateY(-50%);
   }

   .s-banner-countdown .image img {
     min-height: 400px;
   }

   .s-banner-colection .tf-col-2 {
     grid-template-columns: repeat(1, 1fr);
   }

   .s-banner-colection .box-content {
     margin: 0px;
     text-align: center;
   }

   .s-banner-colection .image img {
     width: 100%;
     object-fit: cover;
   }

   .banner-coundownt .tf-btn {
     margin: 0 auto;
   }

   .banner-coundownt .box-content {
     order: 2;
   }

   .sw-dots .swiper-pagination-bullet {
     width: 6px;
     height: 6px;
   }

   .sw-dots .swiper-pagination-bullet::after {
     width: 20px;
     height: 20px;
   }

   .slider-pod br {
     display: none;
   }

   .slider-style-2 .slider-wrap {
     flex-wrap: wrap-reverse;
   }

   .slider-style-2 .box-content-left {
     padding: 70px 0px 80px;
     position: unset;
     width: 100%;
   }

   .slider-style-2 .box-content-left br {
     display: none;
   }

   .slider-style-2 .image {
     width: 100%;
     height: 300px;
   }

   .slider-default .slider-wrap {
     height: 400px;
   }

   .slider-default .wrap-pagination {
     bottom: 20px;
   }

   .wg-coming-soon {
     padding-top: 60px;
     padding-bottom: 60px;
   }

   .s-faq .name-faq {
     margin-bottom: 20px;
   }

   .s-faq .faq-item:not(:last-child) {
     margin-bottom: 40px;
   }

   .sb-contact {
     padding: 30px 15px;
     margin-bottom: 30px;
   }

   .sb-contact .title {
     margin-bottom: 15px;
   }

   .sb-contact .sub {
     margin-bottom: 15px;
   }

   .s-blog-single .heading {
     gap: 10px;
     margin-bottom: 30px;
   }

   .s-blog-single .heading .entry-meta {
     gap: 5px 10px;
   }

   .s-blog-single .content .entry_image {
     margin-bottom: 30px;
   }

   .s-blog-single .content>.text {
     margin-bottom: 30px;
     font-size: 14px;
     line-height: 22px;
   }

   .s-blog-single .group-image {
     margin-bottom: 30px;
   }

   .s-blog-single .block-quote {
     margin-bottom: 20px;
   }

   .s-blog-single .block-quote p {
     font-size: 14px;
     line-height: 22px;
   }

   .s-blog-single .bot {
     margin-bottom: 30px;
   }

   .s-blog-single .bot .entry-tag {
     margin-bottom: 10px;
   }

   .s-blog-single .related-post {
     gap: 15px;
     padding: 30px 0px;
   }

   .s-blog-single .related-post p {
     margin-bottom: 5px;
     font-size: 12px;
   }

   .s-blog-single .related-post p.name-post {
     font-size: 14px;
   }

   .s-blog-single .related-post .post {
     gap: 10px;
   }

   .modal-before-you-leave .modal-content {
     max-width: 320px;
   }

   h1,
   .display-2xl {
     font-size: 42px;
     line-height: 60px;
   }

   .fs-84,
   .display-2xl-2 {
     font-size: 42px;
     line-height: 52px;
   }

   h2,
   .display-xl,
   .display-xl-2 {
     font-size: 30px;
     line-height: 42px;
   }

   h3,
   .display-lg,
   .display-lg-2,
   .display-lg-3 {
     font-size: 28px;
     line-height: 40px;
   }

   .display-lg-7,
   .display-lg-6,
   .display-lg-5,
   .display-lg-4 {
     font-size: 28px;
     line-height: 38px;
   }

   h4,
   .display-md,
   .display-md-2,
   .display-md-3 {
     font-size: 24px;
     line-height: 32px;
   }

   h5,
   .display-sm {
     font-size: 22px;
     line-height: 30px;
   }

   .display-sm-2 {
     font-size: 22px;
     line-height: 32px;
   }

   h6,
   .display-xs {
     font-size: 20px;
     line-height: 28px;
   }

   .display-xs-2 {
     font-size: 20px;
     line-height: 30px;
   }

   .text-xl {
     font-size: 18px;
     line-height: 28px;
   }

   .text-xl-2 {
     font-size: 18px;
     line-height: 22px;
   }

   .text-xl-3 {
     font-size: 18px;
     line-height: 30px;
   }

   .text-lg {
     font-size: 16px;
     line-height: 26px;
   }

   .text-md {
     font-size: 14px;
     line-height: 22px;
   }

   .body-text {
     font-size: 14px;
     line-height: 22.6px;
   }

   .body-text-2 {
     font-size: 14px;
     line-height: 16.2px;
   }

   .s-banner-bundle .bundle-wrap {
     margin-top: 32px;
   }

   .s2-banner-bundle .bundle-wrap {
     margin-top: 60px;
   }

   .banner-about {
     height: 300px;
   }

   #header .nav-icon .nav-account,
   #header .nav-icon .nav-wishlist,
   #header .nav-icon .nav-compare {
     display: none;
   }

   .footer .footer-heading-mobile {
     display: block;
     position: relative;
   }

   .footer .footer-heading-mobile::after {
     position: absolute;
     content: "";
     right: 10px;
     top: 50%;
     transform: translateY(-50%);
     width: 12px;
     height: 1px;
     background-color: var(--dark);
     transition: 0.25s ease-in-out;
   }

   .footer .footer-heading-mobile::before {
     position: absolute;
     content: "";
     right: 15px;
     top: 50%;
     transform: translate(-50%, -50%);
     width: 1px;
     height: 12px;
     background-color: var(--dark);
     transition: 0.25s ease-in-out;
   }

   .footer .footer-col-block.open .footer-heading-mobile::before {
     opacity: 0;
   }

   .footer .footer-col-block.open .footer-heading-mobile::after {
     transform: translate(0%, -50%) rotate(180deg);
   }

   .footer .footer-col-block .tf-collapse-content {
     display: none;
   }

   .footer .footer-menu {
     flex-direction: column;
     gap: 18px;
     margin-bottom: 18px;
   }

   .footer .footer-menu>div {
     width: 100%;
   }

   .flat-spacing-6,
   .flat-spacing-2,
   .flat-spacing {
     padding-top: 60px;
     padding-bottom: 60px;
   }

   .flat-spacing-35,
   .flat-spacing-33,
   .flat-spacing-3 {
     padding-top: 60px;
     padding-bottom: 60px;
   }

   .flat-spacing-9,
   .flat-spacing-4 {
     padding-top: 40px;
     padding-bottom: 40px;
   }

   .flat-spacing-5 {
     padding-top: 30px;
     padding-bottom: 30px;
   }

   .flat-spacing-8 {
     padding-top: 60px;
     padding-bottom: 60px;
   }

   .flat-spacing-10 {
     padding-top: 40px;
     padding-bottom: 50px;
   }

   .flat-spacing-11 {
     padding-top: 60px;
     padding-bottom: 80px;
   }

   .flat-spacing-12 {
     padding-top: 60px;
     padding-bottom: 44px;
   }

   .flat-spacing-13 {
     padding-top: 60px;
     padding-bottom: 80px;
   }

   .flat-spacing-14 {
     padding-top: 63px;
     padding-bottom: 78px;
   }

   .flat-spacing-15 {
     padding-top: 60px;
     padding-bottom: 60px;
   }

   .flat-spacing-16 {
     padding-top: 60px;
     padding-bottom: 60px;
   }

   .flat-spacing-17 {
     padding-top: 60px;
     padding-bottom: 60px;
   }

   .flat-spacing-19 {
     padding-top: 67px;
     padding-bottom: 80px;
   }

   .flat-spacing-20 {
     padding-top: 66px;
     padding-bottom: 66px;
   }

   .flat-spacing-21 {
     padding-top: 60px;
     padding-bottom: 60px;
   }

   .flat-spacing-22 {
     padding-top: 80px;
     padding-bottom: 80px;
   }

   .flat-spacing-23 {
     padding-top: 60px;
     padding-bottom: 60px;
   }

   .flat-spacing-25 {
     padding-top: 60px;
     padding-bottom: 80px;
   }

   .flat-spacing-26 {
     padding-top: 80px;
     padding-bottom: 60px;
   }

   .flat-spacing-28 {
     padding-top: 60px;
     padding-bottom: 60px;
   }

   .flat-spacing-27 {
     padding-top: 60px;
     padding-bottom: 60px;
   }

   .flat-spacing-29 {
     padding-top: 63px;
     padding-bottom: 78px;
   }

   .flat-single-product {
     padding-bottom: 60px;
   }

   .tf-product-info-wrap {
     margin-top: 40px;
   }

   .tf-product-fbt {
     padding: 15px;
   }

   .tf-product-fbt .bundle-total-submit {
     font-size: 16px;
     line-height: 26px;
   }

   .tf-bundle-product-item .bundle-image {
     width: 80px;
     min-width: 80px;
   }

   .tab-vertical-product-desc .wd-product-descriptions {
     padding: 30px 15px;
   }

   .tf-control-layout .sw-layout-3 {
     display: none;
   }

   .tf-group-filter {
     gap: 6px;
   }

   .brand-item {
     max-width: 200px;
   }

   .mx_40 {
     margin-left: 15px;
     margin-right: 15px;
   }

   .banner-shop {
     height: 500px;
   }

   .banner-shop .box-title .title {
     font-size: 26px;
     line-height: 28px;
   }

   .cls-video .img-product {
     max-width: 68px;
   }

   .cls-video .icon {
     width: 35px;
     height: 35px;
   }

   .menu-tab-fill .tab-link {
     min-width: 100px;
     padding: 5px 15px;
   }

   .slider-wrap-lb .card-product {
     display: flex;
     align-items: flex-start;
     gap: 12px;
     text-align: left;
   }

   .slider-wrap-lb .card-product .card-product-info {
     padding: 0;
     justify-items: flex-start;
   }

   .slider-wrap-lb .card-product .tf-btn {
     padding: 6px 14px;
     font-size: 14px;
     line-height: 22px;
   }

   .slider-wrap-lb .card-product .card-product-wrapper {
     max-width: 140px;
   }

   .slider-wrap-lb .card-product .box-icon {
     border-radius: 50% !important;
   }

   .footer-pb-2 {
     padding-bottom: 197px;
   }

   .tf-btn {
     font-size: 14px;
     line-height: 24px;
     padding: 6px 20px;
   }

   .s-contact.style-2 .content-left {
     width: 100%;
   }

   .popup-product .modal-header {
     margin-bottom: 32px;
     margin-top: 20px;
   }

   .s-cls .image img {
     max-height: 400px;
   }
 }

 @media (max-width: 575px) {
   .grid-cls-v2 {
     grid-template-columns: 1fr;
   }

   .grid-cls-v2>* {
     height: 330px;
   }

   .tf-main-success .ship-address-item {
     margin-bottom: 24px;
   }

   .tf-main-success .ship-address-item .title {
     margin-bottom: 15px;
   }

   .text-xl {
     font-size: 16px;
     line-height: 26px;
   }

   .text-xl-2 {
     font-size: 16px;
     line-height: 20px;
   }

   .text-xl-3 {
     font-size: 16px;
     line-height: 28px;
   }

   .card-product.style-list .card-product-info .desc {
     display: none;
   }

   .card-product .on-sale-item {
     font-size: 12px;
     line-height: 24px;
     height: 24px;
   }

   .banner-lookbook .lookbook-item.position3 {
     left: 24%;
   }

   .wg-testimonial-2 .text {
     font-size: 20px;
   }

   .grid-cls-v5 .item1,
   .grid-cls-v5 .item2,
   .grid-cls-v5 .item3,
   .grid-cls-v5 .item4 {
     height: 300px;
   }

   .grid-cls-v5 .wg-cls .tf-btn {
     padding: 8px 15px;
   }

   .grid-cls-v5 .wg-cls .tf-btn .icon {
     display: none;
   }

   .slider-default .content-slider .sub {
     display: none;
   }

   .slider-electronic .reverse-slide img {
     position: absolute;
     top: 0;
     left: 0;
     width: 630px;
     min-width: max(100%, 630px);
   }

   .image-compare .icv__img-a {
     height: 200px;
   }

   .form-login .button-wrap {
     flex-wrap: wrap;
   }

   .loobook-product {
     padding: 12px;
     gap: 10px;
   }

   .loobook-product .zero {
     display: none;
   }

   .loobook-product .btn-lookbook {
     width: 32px;
     height: 32px;
     font-size: 12px;
   }

   .loobook-product .content {
     gap: 8px;
   }

   .s-banner-product .image {
     height: 450px;
   }

   .s-banner-product .loobook-product {
     left: 15px;
     right: 15px;
     bottom: 15px;
   }

   .wg-countdown-2 {
     padding: 15px;
   }

   .wg-countdown-2 .countdown__timer {
     gap: 29px !important;
   }

   .wg-countdown .countdown__timer {
     gap: 10px;
   }

   .wg-countdown .countdown__item {
     width: 70px;
     height: 70px;
   }

   .wg-countdown .countdown__value {
     font-size: 24px;
     line-height: 32px;
   }

   .s-coming-soon br {
     display: none;
   }

   .s-coming-soon .sub {
     margin-bottom: 25px;
   }

   .s-coming-soon .wg-countdown {
     margin-bottom: 25px;
   }

   .s-coming-soon .form-email-wrap {
     margin-bottom: 25px;
   }

   .blog-item.style-2 {
     flex-wrap: wrap;
   }

   .blog-item.style-2 .entry_image {
     max-width: unset;
     min-height: 350px;
     max-height: 400px;
   }

   .s-blog-single .related-post .icon {
     display: none;
   }

   .s-blog-list-grid {
     grid-template-columns: repeat(1, 1fr);
   }

   .footer-default .footer-contact,
   .footer-default .s3 .footer-col-block:first-child .footer-menu-list,
   .footer-default .footer-newsletter {
     margin-bottom: 30px;
   }

   .footer-default .footer-heading {
     margin-bottom: 20px;
   }

   .footer-default .s3 .footer-col-block:last-child .footer-menu-list {
     margin-top: 20px;
   }

   .footer-default .s3 .footer-col-block:last-child .footer-heading {
     margin-bottom: 0px;
   }




   .footer-heading-mobile {
     display: block;
     position: relative;
     padding-right: 20px;
     line-height: 24px;
   }

   .footer-heading-mobile::after {
     position: absolute;
     content: "";
     right: 10px;
     top: 50%;
     transform: translateY(-50%);
     width: 14px;
     height: 2px;
     background-color: var(--dark);
     transition: 0.25s ease-in-out;
   }

   .footer-heading-mobile::before {
     position: absolute;
     content: "";
     right: 15px;
     top: 50%;
     transform: translate(-50%, -50%);
     width: 2px;
     height: 14px;
     background-color: var(--dark);
     transition: 0.25s ease-in-out;
   }

   .footer-col-block.open .footer-heading-mobile::before {
     opacity: 0;
   }

   .footer-col-block.open .footer-heading-mobile::after {
     transform: translate(0%, -50%) rotate(180deg);
   }

   .footer-col-block .tf-collapse-content {
     display: none;
   }

   .flat-single-grid .item {
     width: 350px;
     height: 450px;
     flex-shrink: 0;
   }

   .form-default .cols {
     flex-wrap: wrap;
   }

   .wg-testimonial.style-row {
     flex-direction: column-reverse;
   }

   .wg-testimonial.style-row .image {
     width: 60%;
     margin: 12px auto 0px;
   }

   .tf-icon-box.style-3 {
     justify-content: center;
   }

   .cls-bn-content .img-product {
     max-width: 62px;
     max-height: 75px;
   }

   .banner-shop {
     height: 400px;
   }

   .modal-order-detail .list-infor li:not(:last-child) {
     padding-right: 0;
   }

   .modal-order-detail .list-infor li:not(:last-child)::after {
     display: none;
   }

   .form-buyX-getY .group-item-product {
     flex-direction: column;
     align-items: unset;
   }

   .form-buyX-getY .group-item-product .arrow {
     margin-top: -12px;
     margin-left: auto;
     margin-right: auto;
     transform: rotate(90deg);
   }

   .form-review .group-2-ip {
     grid-template-columns: 1fr;
   }

   .flat-title.style-between .menu-tab-line,
   .flat-title.style-between .menu-tab-btn {
     flex-wrap: wrap;
     justify-content: center;
   }

   .menu-tab-btn .tab-link {
     padding: 8px 16px;
   }
 }

 @media (max-width: 425px) {
   .js-countdown .countdown__timer {
     gap: 5px;
   }
 }