{
"id": "b6b8ed55-fabe-4e71-a53d-68e842421f92",
"is_default": true,
"theme_setting": {
"store_settings": {
"is_coupon_visible": false,
"currencyPrecision": false,
"header": {
"notice": {
"mobile": {
"above": true,
"enabled": true,
"content": "<p>تخفيضات لن تجدها في أي مكان آخر : التوصيل بالمجان 🚛</p>",
"color": "#ffffff",
"bgColor": "#00FFC6FF"
},
"desktop": {
"above": true,
"enabled": true,
"content": "<p>تخفيضات لن تجدها في أي مكان آخر : التوصيل بالمجان 🚛</p>",
"color": "#ffffff",
"bgColor": "#50E3C2FF"
}
},
"mobile": {
"left": [
"burger_menu"
],
"center": [
"store_logo"
],
"right": [
"user_button",
"search_icon"
],
"color": {
"background": "#DEF7FFFF",
"icons": "#FFFFFFFF"
},
"border": {
"exists": true,
"color": "#00000000"
}
},
"desktop": {
"left": [
"burger_menu",
"menu"
],
"center": [
"store_logo"
],
"right": [
"user_button",
"search_icon"
],
"color": {
"background": "#DEF7FFFF",
"icons": "#37D0FFFF"
},
"border": {
"exists": false,
"color": "#50E3C2FF"
}
}
},
"footer": {
"custom": false,
"style": {
"color": {
"background": "#50E3C2FF",
"text": "#FFFFFFFF"
},
"border": {
"exists": true,
"color": "#50E3C2FF"
}
},
"content": null
},
"font": {
"menu": {
"text": "Cairo",
"value": "Cairo",
"category": "sans-serif"
},
"body": {
"text": "Cairo",
"value": "Cairo",
"category": "sans-serif"
}
},
"breadcrumbs": {
"global": false,
"checkout": false
}
},
"checkout_settings": {
"one_page_checkout": true
},
"product_settings": {
"enable_reviews": true,
"skip_to_checkout": true,
"sticky_on_mobile": true,
"sticky_on_desktop": false,
"read_more": false,
"enable_facebook_share": false,
"enable_twitter_share": false,
"enable_whatssap_share": false,
"enable_product_quantity_selector": false,
"related_products_section": true,
"direct_add_to_cart": false,
"cart_text": "اضغط هنا للطلب",
"sections": [
{
"key": "title",
"show": true
},
{
"key": "preview",
"show": true
},
{
"key": "price",
"show": true
},
{
"key": "variants",
"show": true
},
{
"key": "scarcity",
"show": true
},
{
"key": "visitors",
"show": true
},
{
"key": "countdown",
"show": true
},
{
"key": "express-checkout",
"show": true
},
{
"key": "add_to_cart",
"show": true
},
{
"key": "description",
"show": true
}
],
"visitors": {
"max": 10,
"min": 5
},
"fakeStock": {
"max": 10,
"min": 5
},
"time": {
"days": 0,
"hours": 1,
"minutes": 0,
"seconds": 0
},
"style": {
"padding": {
"top": 30,
"bottom": 30
},
"background": {
"color": "#00000000"
},
"text": {
"color": "#000000FF"
},
"link": {
"color": "#37D0FFFF"
},
"title": {
"color": "#000000"
},
"price": {
"before": {
"color": "#747474"
},
"after": {
"color": "#000000FF"
}
},
"addToCart": {
"text": {
"color": "#ffffff"
},
"background": {
"color": "#37D0FFFF"
},
"border": {
"color": "#00000000"
},
"hover": {
"text": {
"color": "#FFFFFFFF"
},
"background": {
"color": "#37D0FFFF"
},
"border": {
"color": "#00000000"
}
}
},
"quantityButtons": {
"text": {
"color": "#FFFFFFFF"
},
"background": {
"color": "#00000000"
},
"border": {
"color": "#00000000"
},
"hover": {
"text": {
"color": "#FFFFFFFF"
},
"background": {
"color": "#00000000"
},
"border": {
"color": "#00000000"
}
}
},
"primary": {
"color": "#37D0FFFF"
},
"secondary": {
"color": "#9AE7FFFF"
},
"option": {
"border": {
"color": "#1CB9E9FF"
}
}
},
"cart_safe_badges": null
},
"pages_settings": {
"home": [
{
"type": 4,
"settings": {
"format": "horizontal",
"size": "medium",
"textsize": "medium",
"frequency": 5,
"images": [
{
"image": {
"name": "stores/e1b16de9e80d08b2ec28a32466c4cdc4/others/sCDmYmH2lTa1O8MjsjIkMsjTJRl47T84wRUU4LQ1.png",
"link": "https://cdn.youcan.shop/stores/e1b16de9e80d08b2ec28a32466c4cdc4/others/sCDmYmH2lTa1O8MjsjIkMsjTJRl47T84wRUU4LQ1.png"
},
"mobileImage": {
"name": "stores/e1b16de9e80d08b2ec28a32466c4cdc4/others/5yu1rWaGsvJt7Oqe3eFuv2w4AdWYsfCqyXOy4d9k.png",
"link": "https://cdn.youcan.shop/stores/e1b16de9e80d08b2ec28a32466c4cdc4/others/5yu1rWaGsvJt7Oqe3eFuv2w4AdWYsfCqyXOy4d9k.png"
},
"heading": {
"text": null,
"color": "#000000"
},
"subheading": {
"text": null,
"color": "#000000"
},
"position": "middle",
"link": null
}
],
"height": null,
"image_shadow": false,
"style": []
},
"id": "section-1"
},
{
"id": "section-yjy89c1726150136601",
"type": 5,
"settings": {
"content": "<p><img src=\"https://cdn.youcan.shop/stores/e1b16de9e80d08b2ec28a32466c4cdc4/others/SZdpxCXml8Uy4TUFFPvL1f7HAfT41qivUh3reLiQ.png\" style=\"width: 1075px;\" class=\"fr-fic fr-dib\" data-name=\"stores/e1b16de9e80d08b2ec28a32466c4cdc4/others/SZdpxCXml8Uy4TUFFPvL1f7HAfT41qivUh3reLiQ.png\"></p>",
"style": {
"padding": {
"top": 30,
"bottom": 30
},
"background": {
"color": "#ffffff"
}
}
}
},
{
"id": "section-ge7ncc1726146943241",
"type": 3,
"settings": {
"title": "تصنيفات الموقع",
"subtitle": "تسوق الآن و احصل على تخفيضات كبيرا",
"categories": [],
"style": {
"padding": {
"top": 30,
"bottom": 30
},
"background": {
"color": "#ffffff"
},
"title": {
"color": "#FFFFFFFF"
},
"subtitle": {
"color": "#9B9B9BFF"
},
"item": {
"title": {
"color": "#000000FF"
}
}
}
}
},
{
"id": "section-mtkzvt1726147091714",
"type": 1,
"settings": {
"categoryId": null,
"title": "أحسن العروض",
"subtitle": null,
"type": "grid",
"limit": "4",
"showLoadMore": true,
"style": {
"padding": {
"top": 30,
"bottom": 30
},
"background": {
"color": "#ffffff"
},
"text": {
"color": "#FFFFFFFF"
},
"title": {
"color": "#FFFFFFFF"
},
"subtitle": {
"color": "#37D0FFFF"
},
"item": {
"price": {
"before": {
"color": "#747474"
},
"after": {
"color": "#37D0FFFF"
}
},
"title": {
"color": "#000000FF"
},
"border": {
"color": "#37D0FFFF",
"hover": {
"color": "#37D0FFFF"
}
},
"background": {
"color": "#ffffff00"
},
"button": {
"text": {
"color": "#FFFFFFFF"
},
"background": {
"color": "#37D0FFFF"
},
"border": {
"color": "#37D0FFFF"
},
"hover": {
"text": {
"color": "#FFFFFFFF"
},
"background": {
"color": "#37D0FFFF"
},
"border": {
"color": "#37D0FFFF"
}
}
}
},
"button": {
"text": {
"color": "#FFFFFFFF"
},
"background": {
"color": "#37D0FFFF"
},
"border": {
"color": "#37D0FFFF"
},
"hover": {
"text": {
"color": "#FFFFFFFF"
},
"background": {
"color": "#37D0FFFF"
},
"border": {
"color": "#37D0FFFF"
}
}
}
}
}
}
]
},
"colors_settings": {
"primary": "#37D0FFFF",
"light-primary": "#37D0FFFF",
"dark-primary": "#4A90E2FF",
"secondary": "#37D0FFFF",
"body-background": "#EDFAF7FF",
"success": "#09C5FFFF",
"info": "#37D0FFFF",
"warning": "#79E0FFFF",
"danger": "#4A4A4AFF"
}
}
}<style>
.notice-bar {
position: relative;
background: linear-gradient(270deg, #00c3ff, #37D0FF, #77dfff);
background-size: 600% 600%;
color: rgb(255, 255, 255);
border-bottom: 1px solid rgb(80, 227, 194);
animation: gradientAnimation 10s ease infinite;
padding: 10px 0;
overflow: hidden;
}
@keyframes gradientAnimation {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
.notice-bar::before {
content: '';
position: absolute;
bottom: -20px;
left: 0;
width: 100%;
height: 20px;
background-color: rgb(80, 227, 194);
border-radius: 50% 50% 0 0;
z-index: 1;
animation: rollEffect 2s ease-in-out infinite alternate;
}
@keyframes rollEffect {
0% {
transform: translateY(0);
}
100% {
transform: translateY(10px);
}
}
.notice-bar .container {
position: relative;
z-index: 2;
}
.notice-bar p {
text-align: center;
margin: 0;
}
.notice-bar span {
color: rgb(65, 65, 65);
font-family: sans-serif;
font-size: 14px;
background-color: rgb(255, 255, 255);
padding: 5px;
border-radius: 5px;
}
</style>
<style>
@media (max-width: 991px) {
.header-switcher {
background: linear-gradient(270deg, #00c3ff, #37D0FF, #77dfff);
background-size: 600% 600%;
border-radius: 20%;
display: inline-flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
padding: 5px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
transition: transform 0.3s ease, box-shadow 0.3s ease;
text-decoration: none;
cursor: pointer;
animation: gradientAnimation 10s ease infinite;
}
.header-switcher:hover {
transform: scale(1.05);
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
}
.header-switcher i {
font-size: 24px;
color: #ffffff;
}
}
@media (min-width: 992px) {
.header-switcher {
background-color: transparent;
border-radius: 0;
display: inline-flex;
align-items: center;
justify-content: center;
width: auto;
height: auto;
padding: 0;
box-shadow: none;
text-decoration: none;
}
.header-switcher i {
font-size: 24px;
color: #000000;
}
}
@keyframes gradientAnimation {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
</style>
<style>
@media (max-width: 991px) {
.cart-icon {
background-color: #37d0ff;
display: inline-flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
padding: 5px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.cart-icon:hover {
transform: scale(1.1);
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
}
.cart-icon i {
font-size: 24px;
color: #ffffff;
}
}
</style>
<style>
@media (max-width: 991px) {
.header-switcher {
background-color: #37d0ff;
border-radius: 20%;
display: inline-flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
padding: 5px;
border: none;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
transition: transform 0.3s ease, box-shadow 0.3s ease;
cursor: pointer;
}
.header-switcher:hover {
transform: scale(1.05);
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
}
.header-switcher i {
font-size: 24px;
color: #ffffff;
}
}
</style>
<style>
.slide {
border-radius: 0 0 20px 20px;
background-color: #fff;
box-shadow: #fff;
overflow: hidden;
position: relative;
animation: zoom 20s infinite;
}
@keyframes zoom {
0% {
transform: scale(1);
}
50% {
transform: scale(1.05);
}
100% {
transform: scale(1);
}
}
.mobile-image, .desktop-image {
width: 100%;
height: auto;
display: block;
}
.hidden-desktop {
display: none;
}
</style>
<style>
.app-heading {
position: relative;
overflow: hidden;
padding: 20px;
text-align: center;
margin-bottom: 20px;
}
.heading-primary {
background: linear-gradient(270deg, #00c3ff, #37D0FF, #77dfff);
background-size: 600% 600%;
color: #fff;
display: inline-block;
padding: 10px 20px;
border-radius: 10px;
font-size: 1.5em;
font-weight: bold;
position: relative;
animation: gradientMove 10s linear infinite;
}
.heading-description {
font-size: 1.2em;
color: #333;
position: relative;
padding-top: 10px;
animation: gradientMove 10s linear infinite, move 10s linear infinite;
}
@keyframes gradientMove {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
@keyframes move {
0% {
transform: translateX(-10px);
}
50% {
transform: translateX(10px);
}
100% {
transform: translateX(-10px);
}
}
.categories-list-section {
padding: 20px;
}
.heading-primary {
font-size: 24px;
font-weight: bold;
}
.heading-description {
font-size: 16px;
color: #555;
}
.categories-style-1 {
display: flex;
flex-wrap: wrap;
gap: 10px;
}
.category-item {
flex: 1 1 calc(25% - 10px);
box-sizing: border-box;
position: relative;
overflow: hidden;
transition: transform 0.3s, box-shadow 0.3s;
margin-bottom: 10px;
animation: zoomAnimation 10s infinite;
border-radius: 20px;
background-color: #fff;
}
.category-item img {
width: 100%;
height: auto;
display: block;
object-fit: cover;
}
.category-item:hover {
transform: scale(1.05);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
@keyframes zoomAnimation {
0% {
transform: scale(1);
}
50% {
transform: scale(1.02);
}
100% {
transform: scale(1);
}
}
@media (max-width: 768px) {
.category-item {
flex: 1 1 calc(50% - 10px);
}
}
@media (max-width: 480px) {
.category-item {
flex: 1 1 calc(50% - 10px);
}
}
</style>
<style>
.products-style-1 {
display: flex;
flex-wrap: wrap;
gap: 10px;
justify-content: center;
width: 100%;
}
.product-item {
flex: 1 1 calc(25% - 10px);
box-sizing: border-box;
position: relative;
overflow: hidden;
background-color: #d6f5ff;
padding: 10px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
border-radius: 15px;
transition: background-color 0.3s ease;
}
@keyframes border-bounce {
0% {
border: 3px solid #00c3ff;
}
50% {
border: 3px solid #37D0FF;
}
100% {
border: 3px solid #77dfff;
}
}
.product-thumbnail {
display: block;
overflow: hidden;
border-radius: 15px;
}
.product-thumbnail img {
width: 100%;
height: auto;
display: block;
border-radius: 15px;
object-fit: cover;
}
.product-details {
margin-top: 10px;
}
.product-info {
text-align: center;
}
.product-title {
font-size: 18px;
margin-bottom: 10px;
line-height: 1.4;
}
.product-price {
font-size: 14px;
color: #333;
}
.currency-value {
font-weight: bold;
}
.currency-value.before {
text-decoration: line-through;
color: #888;
}
.product-actions {
text-align: center;
margin-top: 10px;
}
.button.small-button {
padding: 8px 16px;
font-size: 14px;
border-radius: 5px;
margin-left: 15px;
margin-right: 15px;
}
.button.secondary-button {
background-color: #00c3ff;
color: #fff;
border: none;
}
.button.secondary-button:hover {
background-color: #00c3ff;
}
@media (max-width: 768px) {
.product-item {
flex: 1 1 calc(50% - 10px);
}
.product-title {
font-size: 16px;
}
}
@media (max-width: 480px) {
.product-item {
flex: 1 1 calc(50% - 10px);
}
.product-title {
font-size: 16px;
}
}
@keyframes move-horizontal {
0% {
transform: translateX(0);
}
50% {
transform: translateX(20px);
}
100% {
transform: translateX(0);
}
}
.load-more {
text-align: center;
margin: 20px 0;
animation: move-horizontal 4s ease-in-out infinite;
}
.load-more .button {
background: linear-gradient(270deg, #00c3ff, #37D0FF, #77dfff);
color: #fff;
padding: 10px 20px;
border-radius: 5px;
text-decoration: none;
font-size: 16px;
font-weight: bold;
display: inline-block;
transition: background 0.3s ease, color 0.3s ease;
animation: gradientMove 10s linear infinite, move 10s linear infinite;
}
@keyframes gradientMove {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
</style>
<style>
.footer {
position: relative;
background: linear-gradient(270deg, #00c3ff, #37D0FF, #77dfff);
background-size: 600% 600%;
color: rgb(255, 255, 255);
border-top: 1px solid rgb(80, 227, 194);
animation: gradientAnimation 10s ease infinite, fadeIn 2s ease-out;
padding: 20px 0;
overflow: hidden;
}
@keyframes gradientAnimation {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
@keyframes fadeIn {
from {
opacity: 0;
transform: translateY(50px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.footer::before {
content: '';
position: absolute;
top: -20px;
left: 0;
width: 100%;
height: 20px;
background-color: rgb(55, 208, 255);
border-radius: 0 0 50% 50%;
z-index: 1;
}
</style>
<style>
.footer-container {
display: flex;
justify-content: center;
align-items: center;
height: 100%;
}
.footer-brand {
background-color: #ffffff;
border-radius: 20px;
padding: 30px;
display: center;
transition: transform 0.3s ease, box-shadow 0.3s ease;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
.footer-brand:hover {
transform: scale(1.05);
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
}
</style>
<script>
document.addEventListener('DOMContentLoaded', function() {
var signatureDiv = document.createElement('div');
signatureDiv.className = 'hamzon-tech-signature';
signatureDiv.innerHTML = '© 2024 حقوق الطبع والنشر - <a href="https://www.youtube.com/@HamzonTech" target="_blank">Hamzon Tech</a> | للتواصل معنا: <a href="https://www.instagram.com/hamzon_tech/" target="_blank">انستكرام</a>';
// إضافة نمط CSS لتصغير حجم الكتابة
signatureDiv.style.fontSize = '12px';
signatureDiv.style.textAlign = 'center';
signatureDiv.style.color = '#555'; // لتغيير لون النص إذا أردت
document.body.appendChild(signatureDiv);
var additionalSignature = signatureDiv.cloneNode(true);
});
</script>
<style>
.product-slider .slick-slide img {
transition: transform 5s ease;
}
.product-slider .slick-slide:hover img {
transform: scale(1.1);
}
</style>
<style>
.checkout {
border: 5px solid #37d0ff;
border-radius: 20px;
margin: 0 0 10px;
box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.25), 0px 0px 15px rgba(0, 0, 0, 0.3);
transition: all 0.5s ease-in-out;
background: linear-gradient(270deg, #00c3ff, #37D0FF, #77dfff);
background-size: 600% 600%;
animation: gradientAnimation 10s ease infinite;
}
.checkout-heading {
animation: zoom 3s infinite linear;
text-align: center;
font-weight: bold !important;
font-size: 5rem;
background: linear-gradient(270deg, #00c3ff, #37D0FF, #77dfff);
background-size: 600% 600%;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
animation: gradientAnimation 10s ease infinite;
text-transform: uppercase;
letter-spacing: 2px;
text-shadow: none;
}
@keyframes gradientAnimation {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
@keyframes zoom {
0%, 100% {
transform: scale(1);
}
50% {
transform: scale(1.1);
}
}
.checkout-form {
padding: 30px;
border-radius: 15px;
background-color: rgba(255, 255, 255, 0.9);
box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);
transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}
.checkout-form:hover {
background-color: rgba(255, 255, 255, 0.9);
box-shadow: 0px 0px 25px rgba(0, 0, 0, 0.2);
}
.checkout-form input[type="text"],
.checkout-form input[type="email"],
.checkout-form input[type="url"],
.checkout-form input[type="search"],
.checkout-form input[type="number"],
.checkout-form input[type="tel"],
.checkout-form input[type="password"],
.checkout-form textarea {
border-color: #50e3c2;
border-radius: 15px;
padding: 12px 18px;
background-color: #ffffff;
border: 2px solid;
transition: all 2s ease-in-out;
}
.checkout-form input:focus,
.checkout-form textarea:focus {
border-color: #28a091;
transform: scale(1.02);
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
}
.checkout-form input[type="text"],
.checkout-form input[type="email"],
.checkout-form input[type="url"],
.checkout-form input[type="search"],
.checkout-form input[type="number"],
.checkout-form input[type="tel"],
.checkout-form input[type="password"],
.checkout-form textarea {
border-radius: 15px;
padding: 12px 18px;
background-color: #ffffff;
background:linear-gradient(270deg, #00c3ff, #37D0FF, #77dfff);
background-size: 600% 600%;
color: #ffffff;
font-weight: bold;
border: none;
animation: gradientBorder 10s ease infinite;
transition: all 2s ease-in-out;
}
.checkout-form input::placeholder,
.checkout-form textarea::placeholder {
color: #FFFF;
font-weight: bold;
}
@keyframes gradientBorder {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
.checkout-form input:focus,
.checkout-form textarea:focus {
background: linear-gradient(270deg, #00c3ff, #37D0FF, #77dfff);
background-size: 600% 600%;
color: #ffffff;
font-weight: bold;
transform: scale(1.02);
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
animation: gradientBorder 10s ease infinite;
</style>
<style>
.product-section .quantity {
display: inline-flex;
align-items: center;
color: #fff;
justify-content: center;
background: linear-gradient(270deg, #00c3ff, #37D0FF, #77dfff);;
background-size: 600% 600%;
animation: gradientAnimation 10s ease infinite;
padding: 5px 10px; /* Adjust padding */
border-radius: 10px; /* Rounded corners */
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
transition: transform 0.3s ease, box-shadow 0.3s ease;
/* Removed border */
}
/* Gradient animation keyframes */
@keyframes gradientAnimation {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
</style>
<style>
.button.single-submit {
display: inline-flex;
align-items: center;
justify-content: center;
background: linear-gradient(270deg, #00c3ff, #37D0FF, #77dfff);
background-size: 600% 600%;
animation: gradientAnimation 10s ease infinite;
padding: 10px 20px;
border-radius: 10px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
transition: transform 0.3s ease, box-shadow 0.3s ease;
border: none;
color: white;
font-size: 16px;
cursor: pointer;
}
@keyframes gradientAnimation {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
.button.single-submit:hover {
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
transform: translateY(-2px);
}
</style>
<style>
.product-section.single-visitors b {
background: linear-gradient(270deg, #00c3ff, #37D0FF, #77dfff);
background-size: 600% 600%;
animation: gradientAnimation 10s ease infinite;
border-radius: 5px;
padding: 2px 5px;
color: white;
}
@keyframes gradientAnimation {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
</style>
<style>
.textual-buttons-container {
display: flex;
gap: 10px;
}
.textual-button {
display: inline-block;
border-radius: 5px;
padding: 2px 5px;
border: 2px solid transparent;
color: black;
cursor: pointer;
}
input[type="radio"]:checked + label {
background: linear-gradient(270deg, #00c3ff, #37D0FF, #77dfff);
background-size: 600% 600%;
animation: gradientAnimation 10s ease infinite;
border-radius: 5px;
border: none;
color: white;
}
@keyframes gradientAnimation {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
.textual-button input[type="radio"] {
display: none;
}
.textual-button label {
display: block;
padding: 10px 15px;
cursor: pointer;
text-align: center;
border-radius: 5px;
}
</style>
<style>
.single-countdown {
display: flex;
padding: 10px;
background: linear-gradient(270deg, #00c3ff, #37D0FF, #77dfff);
background-size: 300% 300%;
animation: gradientAnimation 10s ease infinite;
border-radius: 10px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
color: #ffffff;
}
@keyframes gradientAnimation {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
</style>
<style>
.sticky-cart-bar .single-submit {
position: relative;
background: linear-gradient(270deg, #00c3ff, #37D0FF, #77dfff);
background-size: 600% 600%;
color: #fff;
border: none;
padding: 10px 20px;
border-radius: 5px;
font-size: 16px;
font-weight: bold;
cursor: pointer;
animation: gradientAnimation 10s ease infinite;
}
@keyframes gradientAnimation {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
.sticky-cart-bar .single-submit:hover {
box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
transform: scale(1.05);
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
</style>
<style>
.product-details {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
}
.product-actions {
margin-top: 10px;
text-align: center;
}
@media (max-width: 768px) {
.button {
padding: 6px 12px;
font-size: 12px;
}
}
@keyframes gradientButton {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
.product-actions .button {
position: relative;
background: linear-gradient(270deg, #00c3ff, #37D0FF, #77dfff);
background-size: 600% 600%;
color: #fff;
border: none;
padding: 8px 16px;
border-radius: 5px;
font-size: 14px;
font-weight: bold;
cursor: pointer;
animation: gradientButton 10s ease-in-out infinite;
max-width: 100%;
box-sizing: border-box;
}
.product-actions .button:hover {
box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
transform: scale(1.05);
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
}</style>
<style>
.product-details {
direction: rtl;
}
.product-section {
box-sizing: border-box;
width: 100%;
}
.single-title {
width: 100%;
text-align: right;
}
.thumbnail img {
width: 100%;
height: auto;
}
.single-price {
width: 100%;
text-align:right;
}
.countdown-section {
width: 100%;
text-align: center;
}
.single-progress {
width: 100%;
background-color: #f1f1f1;
}
.single-countdown {
display: flex;
justify-content: space-between;
}
.quantity {
display: flex;
align-items: center;
justify-content: center;
}
.single-quantity {
width: 60px;
text-align: center;
}
```.single-title {
text-align: right;
}
</style>
<style>
.single-progress {
display: none;
}
</style>
<style>
.single-hurry-section {
background: #c9f2ff;
padding: 20px;
border-radius: 10px;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
position: relative;
overflow: hidden;
text-align: center;
color: #000;
font-size: 1.2em;
font-weight: bold;
transition: background-color 0.3s ease;
}
.single-hurry-section:hover {
background: #e2e6ea;
}
.single-hurry {
position: relative;
z-index: 1;
animation: textGlow 1.5s infinite;
}
@keyframes textGlow {
0% {
text-shadow: 0 0 5px rgba(255,255,255,0.8), 0 0 10px rgba(255,255,255,0.6);
}
50% {
text-shadow: 0 0 15px rgba(255,255,255,1), 0 0 30px rgba(255,255,255,0.8);
}
100% {
text-shadow: 0 0 5px rgba(255,255,255,0.8), 0 0 10px rgba(255,255,255,0.6);
}
}
</style>
<style>
.footer-body {
color: white;
padding: 20px 0;
}
.is-grid {
display: flex;
justify-content: space-between;
gap: 30px;
}
.footer-item {
flex: 1;
}
.footer-item h3 {
margin-bottom: 10px;
}
.footer-list {
padding: 0;
list-style: none;
}
.footer-list li {
margin-bottom: 8px;
}
.footer-list a {
text-decoration: none;
color: rgb(255, 255, 255);
transition: color 0.3s ease;
}
.footer-list a:hover {
color: #ff9900;
}
@media (max-width: 768px) {
.is-grid {
flex-direction: row;
}
}
</style>
<style>
.products-grid {
display: flex;
flex-wrap: wrap;
gap: 16px;
}
.product-item {
flex: 1 1 23%;
box-sizing: border-box;
}
@media (max-width: 1024px) {
.product-item {
flex: 1 1 40%;
}
}
@media (max-width: 480px) {
.product-item {
flex: 1 1 40%;
}
}
.product-thumbnail img {
width: 100%;
height: auto;
}
.product-actions {
display: flex;
justify-content: center;
align-items: center;
height: 50px;
padding: 10px 0;
}
.product-actions .button {
font-size: 18px;
padding: 10px 20px;
border-radius: 10px;
background-color: #007bff;
color: #fff;
border: none;
cursor: pointer;
transition: background-color 0.3s;
}
.product-actions .button:hover {
background-color: #0056b3;
}
.product-item .product-actions .button {
font-weight: 400%;
min-width: 120px;
}
</style>
