/* Hoppa Kids – ستايل الألوان واللوجو (ستيكر: إطار كحلي + ظل مزاح) */
:root{--hk-ink:#2D3A5C;--hk-y:#FDB913;--hk-t:#2BB5B0;--hk-r:#FF5F6D;--hk-b:#4A9BE8;--hk-g:#8BC34A}

/* الخطوط على العناوين والأزرار والأسعار فقط (النص العادي يفضل بخط القالب) */
h1,h2,h3,h4,.woocommerce-loop-product__title,.product_title,.elementor-heading-title,.price,.button,.elementor-button,.single_add_to_cart_button{font-family:"Baloo Bhaijaan 2","Segoe UI",Tahoma,sans-serif}
h1,h2,h3{color:var(--hk-ink);font-weight:800}

/* الأزرار */
a.button,button.button,.button,.elementor-button,.ast-button,#place_order,.single_add_to_cart_button{border-radius:999px!important;border:3px solid var(--hk-ink)!important;font-weight:800!important;box-shadow:0 4px 0 var(--hk-ink);transition:transform .1s,box-shadow .1s}
a.button:active,.button:active,.elementor-button:active,.single_add_to_cart_button:active{transform:translateY(3px);box-shadow:0 1px 0 var(--hk-ink)}
.add_to_cart_button,.single_add_to_cart_button,.checkout-button,#place_order,.elementor-button{background:var(--hk-r)!important;color:#fff!important}
.add_to_cart_button:hover,.single_add_to_cart_button:hover,.elementor-button:hover{background:var(--hk-t)!important;color:#fff!important}

/* كروت المنتجات */
.woocommerce ul.products li.product{background:#fff;border:4px solid var(--hk-ink);border-radius:26px;box-shadow:0 6px 0 var(--hk-ink);padding:12px 12px 16px;transition:transform .15s}
.woocommerce ul.products li.product:hover{transform:translateY(-4px) rotate(-.6deg)}
.woocommerce ul.products li.product img{border-radius:18px}
.woocommerce ul.products li.product .woocommerce-loop-product__title{font-weight:800;color:var(--hk-ink);line-height:1.3}
.woocommerce .price del{opacity:.55}
.woocommerce .price ins{color:var(--hk-r);font-weight:800;text-decoration:none;background:none}

/* شارة الخصم */
.woocommerce span.onsale,.hkf-badge{background:var(--hk-y)!important;color:var(--hk-ink)!important;border:3px solid var(--hk-ink);border-radius:999px;min-width:0;min-height:0;line-height:1.2;padding:5px 14px 7px;font:800 16px/1.2 "Baloo Bhaijaan 2","Segoe UI",Tahoma,sans-serif;transform:rotate(-6deg);box-shadow:0 3px 0 var(--hk-ink)}

/* عنوان صفحة المتجر والمنتج */
.woocommerce-products-header{background:var(--hk-t);border:4px solid var(--hk-ink);border-radius:26px;box-shadow:0 6px 0 var(--hk-ink);padding:12px 20px;margin-bottom:24px;text-align:center}
.woocommerce-products-header .page-title{margin:0;color:#fff;text-shadow:0 3px 0 var(--hk-ink)}
.single-product .product_title{font-weight:800}
.single-product div.product p.price{font-size:1.6em}
.single-product .woocommerce-tabs{border:4px solid var(--hk-ink);border-radius:22px;padding:12px 16px}
.woocommerce-cart table.cart,.woocommerce-checkout #order_review{border:4px solid var(--hk-ink);border-radius:20px}

/* الهيدر والفوتر */
.main-header-bar,.ast-primary-header-bar{border-bottom:4px solid var(--hk-ink)}
.site-footer,.site-footer .site-primary-footer-wrap,.site-footer .site-below-footer-wrap{background:var(--hk-ink)!important;color:#fff}
.site-footer a{color:var(--hk-y)}

/* ===== كلاسات جاهزة تحطها في Elementor (Advanced ← CSS Classes) ===== */
.hk-sec-yellow{background:var(--hk-y)!important}.hk-sec-teal{background:var(--hk-t)!important}.hk-sec-blue{background:var(--hk-b)!important}
.hk-sec-coral{background:var(--hk-r)!important}.hk-sec-green{background:var(--hk-g)!important}
.hk-sec-yellow,.hk-sec-teal,.hk-sec-blue,.hk-sec-coral,.hk-sec-green{background-image:radial-gradient(rgba(255,255,255,.28) 3px,transparent 3.5px)!important;background-size:30px 30px!important}
/* حافة متموجة أسفل القسم (تتلاشى في الأبيض) */
.hk-wave{position:relative;padding-bottom:48px!important}
.hk-wave::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:24px;background:radial-gradient(circle at 20px -4px,transparent 18px,#fff 19px) 0 0/40px 24px repeat-x;pointer-events:none}
/* عنوان بشكل ستيكر */
.hk-title .elementor-heading-title{display:inline-block;background:#fff;color:var(--hk-ink);border:4px solid var(--hk-ink);border-radius:24px;box-shadow:0 5px 0 var(--hk-ink);padding:4px 24px 8px;transform:rotate(-1.5deg)}
/* كارت ستيكر لأي حاوية */
.hk-card{background:#fff;border:4px solid var(--hk-ink)!important;border-radius:26px!important;box-shadow:0 6px 0 var(--hk-ink)}
/* فقاعات فئات العمر: حط الكلاس على قسم فئات العمر */
.hk-ages img{border-radius:50%!important;border:4px solid var(--hk-ink);box-shadow:0 5px 0 var(--hk-ink);background:#fff;transition:transform .15s}
.hk-ages a:hover img{transform:translateY(-4px) rotate(-3deg)}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
