/*
Theme Name: Twenty Twenty-Five
Theme URI: https://wordpress.org/themes/twentytwentyfive/
Author: the WordPress team
Author URI: https://wordpress.org
Description: Twenty Twenty-Five emphasizes simplicity and adaptability. It offers flexible design options, supported by a variety of patterns for different page types, such as services and landing pages, making it ideal for building personal blogs, professional portfolios, online magazines, or business websites. Its templates cater to various blog styles, from text-focused to image-heavy layouts. Additionally, it supports international typography and diverse color palettes, ensuring accessibility and customization for users worldwide.
Requires at least: 6.7
Tested up to: 6.8
Requires PHP: 7.2
Version: 1.3
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyfive
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news
*/

/*
 * Link styles
 * https://github.com/WordPress/gutenberg/issues/42319
 */
a {
	text-decoration-thickness: 1px !important;
	text-underline-offset: .1em;
}

/* Focus styles */
:where(.wp-site-blocks *:focus) {
	outline-width: 2px;
	outline-style: solid;
}

/* Increase the bottom margin on submenus, so that the outline is visible. */
.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation-item:not(:last-child) {
	margin-bottom: 3px;
}

/* Increase the outline offset on the parent menu items, so that the outline does not touch the text. */
.wp-block-navigation .wp-block-navigation-item .wp-block-navigation-item__content {
	outline-offset: 4px;
}

/* Remove outline offset from the submenus, otherwise the outline is visible outside the submenu container. */
.wp-block-navigation .wp-block-navigation-item ul.wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	outline-offset: 0;
}

/*
 * Progressive enhancement to reduce widows and orphans
 * https://github.com/WordPress/gutenberg/issues/55190
 */
h1, h2, h3, h4, h5, h6, blockquote, caption, figcaption, p {
	text-wrap: pretty;
}

/*
 * Change the position of the more block on the front, by making it a block level element.
 * https://github.com/WordPress/gutenberg/issues/65934
*/
.more-link {
	display: block;
}

/*
 * اضافاتي
*/
/* الزر الأساسي */
.wp-element-button,
.woocommerce button.button,
.woocommerce a.button,
.wc-block-components-button,
.wc-block-cart__submit-button,
.wc-block-checkout__submit-button {
    background-color: #0cc5c5 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 6px;
    position: relative;
    overflow: hidden;
    transition: transform 0.15s ease, box-shadow 0.3s ease, background-color 0.3s ease;
}

/* shine مستمر */
.wp-element-button::before,
.woocommerce button.button::before,
.wc-block-cart__submit-button::before,
.wc-block-checkout__submit-button::before {
    content: "";
    position: absolute;
    top: 0; left: -150%;
    width: 50%; height: 100%;
    background: linear-gradient(120deg, rgba(255,255,255,0.25), rgba(255,255,255,0.05), rgba(255,255,255,0.25));
    transform: skewX(-25deg);
    animation: shine-loop 2s linear infinite;
}

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

/* الزر أثناء التحميل */
.wp-element-button.loading,
.woocommerce button.button.loading,
.wc-block-cart__submit-button.loading,
.wc-block-checkout__submit-button.loading {
    pointer-events: none;
    color: transparent !important;
    transform: scale(1);
}

/* دائرة تحميل متقدمة - الطبقة الداخلية */
.wp-element-button.loading::after,
.woocommerce button.button.loading::after,
.wc-block-cart__submit-button.loading::after,
.wc-block-checkout__submit-button.loading::after {
    content: "";
    position: absolute;
    top: 50%; left: 50%;
    width: 28px; height: 28px;
    margin: -14px 0 0 -14px;
    border-radius: 50%;
    border: 4px solid rgba(255,255,255,0.15);
    border-top-color: #0cc5c5;
    border-right-color: #0aa0a0;
    border-bottom-color: #088888;
    border-left-color: #0cc5c5;
    animation: spin-inner 0.8s linear infinite;
    box-shadow: 0 0 10px rgba(12,197,197,0.6), 0 0 15px rgba(12,197,197,0.3) inset;
}

/* الطبقة الخارجية - دوران أبطأ glow */
.wp-element-button.loading::before,
.woocommerce button.button.loading::before,
.wc-block-cart__submit-button.loading::before,
.wc-block-checkout__submit-button.loading::before {
    content: "";
    position: absolute;
    top: 50%; left: 50%;
    width: 40px; height: 40px;
    margin: -20px 0 0 -20px;
    border-radius: 50%;
    border: 3px solid rgba(255,255,255,0.1);
    border-top-color: #0cc5c5;
    border-right-color: #0aa0a0;
    border-bottom-color: #088888;
    border-left-color: #0cc5c5;
    animation: spin-outer 1.5s linear infinite;
    box-shadow: 0 0 12px rgba(12,197,197,0.4), 0 0 20px rgba(12,197,197,0.2) inset;
}

/* دوران الطبقة الداخلية */
@keyframes spin-inner {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* دوران الطبقة الخارجية */
@keyframes spin-outer {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(-360deg); }
}

/* تأثير النقر أثناء التحميل */
.wp-element-button.loading:active,
.woocommerce button.button.loading:active {
    transform: scale(0.97);
}

/* hover glow ونمو طفيف */
.wp-element-button:hover,
.woocommerce button.button:hover,
.wc-block-cart__submit-button:hover,
.wc-block-checkout__submit-button:hover {
    box-shadow: 0 0 20px rgba(12,197,197,0.7), 0 0 30px rgba(12,197,197,0.35) inset;
    transform: scale(1.03);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}



/* تغيير لون السعر في سلة WooCommerce Blocks */
.wc-block-components-formatted-money-amount,
.wc-block-components-product-price__value,
.wc-block-components-totals-item__value,
.wc-block-cart-item__prices {
    color: #e63946 !important;
    font-weight: bold;
}

/* اللون الأساسي */
.wp-element-button,
.woocommerce button.button,
.woocommerce a.button,
.wc-block-components-button,
.wc-block-cart__submit-button,
.wc-block-checkout__submit-button {
    background-color: #0cc5c5 !important;
    color: #fff !important;
    border: none !important;
    transition: background-color 0.3s ease, transform 0.1s ease;
}

/* عند التأشير (Hover) */
.wp-element-button:hover,
.woocommerce button.button:hover,
.woocommerce a.button:hover,
.wc-block-components-button:hover,
.wc-block-cart__submit-button:hover,
.wc-block-checkout__submit-button:hover {
    background-color: #099e9e !important;
    transform: scale(1.02);
}

/* عند الضغط (Active) */
.wp-element-button:active,
.woocommerce button.button:active,
.woocommerce a.button:active,
.wc-block-components-button:active,
.wc-block-cart__submit-button:active,
.wc-block-checkout__submit-button:active {
    background-color: #088888 !important;
    transform: scale(0.98);
}



/* 💻 الأجهزة الإلكترونية - صور مربعة */
body.term-electronic-devices .wc-block-components-product-image img,
body.term-networks-internet .wc-block-components-product-image img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
}

/* 🔹 جعل صور المنتجات مربعة بدون حواف دائرية */
.woocommerce ul.products li.product img,
.wc-block-components-product-image img {
    border-radius: 5% 
}



/* البطاقة الأساسية */
.wc-block-product {
    text-align: center;
    background: #fff;
    border-radius: 12px;
    padding: 15px;
    box-shadow: 0 6px 15px rgba(0,0,0,0.1);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
    position: relative;
    overflow: hidden;
    perspective: 1000px; /* لتأثير 3D */
}

/* حركة shine ثلاثي الأبعاد على البطاقة */
.wc-block-product::before {
    content: "";
    position: absolute;
    top: -150%;
    left: -150%;
    width: 400%;
    height: 400%;
    background: radial-gradient(circle at 30% 30%, rgba(255,255,255,0.4), rgba(255,255,255,0) 60%);
    opacity: 0;
    transform: rotate(45deg);
    transition: opacity 0.3s ease;
}

.wc-block-product:hover::before {
    opacity: 1;
    animation: shine-3d 2s linear infinite;
}

/* تحريك shine 3D */
@keyframes shine-3d {
    0% { transform: translate(-100%, -100%) rotate(45deg); }
    50% { transform: translate(50%, 50%) rotate(45deg); }
    100% { transform: translate(-100%, -100%) rotate(45deg); }
}

/* رفع البطاقة وخفة الحركة عند hover */
.wc-block-product:hover {
    transform: translateY(-8px) rotateX(2deg) rotateY(2deg);
    box-shadow: 0 15px 35px rgba(0,0,0,0.18);
}

/* overlay الصورة مع perspective */
.wc-block-product:hover .wc-block-components-product-image img {
    transform: scale(1.07) rotateX(1deg) rotateY(1deg);
    transition: transform 0.4s ease;
}

/* العنوان */
.wc-block-product h2.wp-block-post-title a {
    color: #333;
    font-weight: 600;
    transition: color 0.3s ease;
}
.wc-block-product:hover h2.wp-block-post-title a {
    color: #0cc5c5;
}

/* السعر */
.wc-block-product .wc-block-components-product-price {
    color: #e63946;
    font-weight: 800;
    margin: 10px 0;
    font-size: 18px;
}

/* زر Add to Cart */
.wc-block-product .wp-block-woocommerce-product-button .wp-element-button {
    background-color: #0cc5c5;
    color: #fff;
    padding: 8px 20px;
    border-radius: 6px;
    transition: background-color 0.3s ease, transform 0.2s ease, box-shadow 0.3s ease;
    text-align: center;
    display: inline-block;
    position: relative;
    overflow: hidden;
}

/* shine متزامن على الزر */
.wc-block-product:hover .wp-block-woocommerce-product-button .wp-element-button::before {
    content: "";
    position: absolute;
    top: -150%;
    left: -150%;
    width: 400%;
    height: 400%;
    background: radial-gradient(circle at 30% 30%, rgba(255,255,255,0.4), rgba(255,255,255,0) 60%);
    opacity: 1;
    animation: shine-3d 2s linear infinite;
}

/* hover للزر */
.wc-block-product .wp-block-woocommerce-product-button .wp-element-button:hover {
    background-color: #09a9a9;
    transform: scale(1.05);
    box-shadow: 0 0 15px rgba(12,197,197,0.5), 0 0 25px rgba(12,197,197,0.3) inset;
}

/* زر Add to Cart أثناء التحميل */
.wc-block-product .wp-block-woocommerce-product-button .wp-element-button.loading {
    color: transparent !important;
    pointer-events: none;
}

/* spinner متعدد الألوان */
.wc-block-product .wp-block-woocommerce-product-button .wp-element-button.loading::after {
    content: "";
    position: absolute;
    top: 50%; left: 50%;
    width: 26px; height: 26px;
    margin: -13px 0 0 -13px;
    border-radius: 50%;
    border: 3px solid rgba(255,255,255,0.2);
    border-top-color: #0cc5c5;
    border-right-color: #09a9a9;
    border-bottom-color: #088888;
    border-left-color: #0cc5c5;
    animation: spin-color 1s linear infinite;
    box-shadow: 0 0 12px rgba(12,197,197,0.6), 0 0 18px rgba(12,197,197,0.3) inset;
}

/* دوران متعدد الألوان */
@keyframes spin-color {
    0% { transform: rotate(0deg); border-top-color: #0cc5c5; border-right-color: #09a9a9; border-bottom-color: #088888; border-left-color: #0cc5c5; }
    25% { border-top-color: #09a9a9; border-right-color: #088888; border-bottom-color: #0cc5c5; border-left-color: #0aa0a0; }
    50% { border-top-color: #088888; border-right-color: #0cc5c5; border-bottom-color: #09a9a9; border-left-color: #0aa0a0; }
    75% { border-top-color: #0cc5c5; border-right-color: #0aa0a0; border-bottom-color: #088888; border-left-color: #09a9a9; }
    100% { transform: rotate(360deg); border-top-color: #0cc5c5; border-right-color: #09a9a9; border-bottom-color: #088888; border-left-color: #0cc5c5; }
}

/* ظهور النص بحركة bounce بعد انتهاء التحميل */
.wc-block-product .wp-block-woocommerce-product-button .wp-element-button span {
    display: inline-block;
    transition: transform 0.4s ease, opacity 0.4s ease;
}

.wc-block-product .wp-block-woocommerce-product-button .wp-element-button:not(.loading) span {
    transform: translateY(0);
    opacity: 1;
}

.wc-block-product .wp-block-woocommerce-product-button .wp-element-button.loading span {
    transform: translateY(-10px);
    opacity: 0;
}