/* =========================================
   ProBadge for WooCommerce - Frontend Styles
   ========================================= */

/* Container */
.probadge-container {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    z-index: 10;
}

/* Base Badge */
.probadge {
    position: absolute;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    padding: 5px 9px;
    pointer-events: none;
    white-space: nowrap;
    max-width: 90%;
    z-index: 11;
    letter-spacing: 0.02em;
}

/* ---- Positions ---- */
.probadge-pos-top-left     { top: 10px; left: 10px; }
.probadge-pos-top-right    { top: 10px; right: 10px; left: auto; }
.probadge-pos-top-center   { top: 10px; left: 50%; transform: translateX(-50%); }
.probadge-pos-bottom-left  { bottom: 10px; top: auto; left: 10px; }
.probadge-pos-bottom-right { bottom: 10px; top: auto; right: 10px; left: auto; }
.probadge-pos-center       { top: 50%; left: 50%; transform: translate(-50%, -50%); }

/* ---- Styles ---- */
.probadge-style-rounded {
    border-radius: 5px;
}
.probadge-style-pill {
    border-radius: 999px;
    padding: 4px 12px;
}
.probadge-style-sharp {
    border-radius: 0;
}
.probadge-style-outline {
    background-color: transparent !important;
    border: 2px solid currentColor;
    border-radius: 5px;
}
.probadge-style-gradient {
    border-radius: 5px;
    background-image: linear-gradient(135deg, var(--badge-color1, #1D9E75), var(--badge-color2, #378ADD)) !important;
}
.probadge-style-dashed {
    background-color: transparent !important;
    border: 2px dashed currentColor;
    border-radius: 5px;
}

/* ---- Animations ---- */
.probadge-anim-pulse {
    animation: probadge-pulse 2s ease-in-out infinite;
}
@keyframes probadge-pulse {
    0%, 100% { transform: scale(1); opacity: 1; }
    50%       { transform: scale(1.07); opacity: 0.85; }
}

.probadge-anim-blink {
    animation: probadge-blink 2.5s ease-in-out infinite;
}
@keyframes probadge-blink {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.4; }
}

.probadge-anim-shake {
    animation: probadge-shake 0.6s ease-out;
}
@keyframes probadge-shake {
    0%, 100% { transform: translateX(0); }
    20%       { transform: translateX(-4px); }
    40%       { transform: translateX(4px); }
    60%       { transform: translateX(-3px); }
    80%       { transform: translateX(3px); }
}

.probadge-anim-fade-in {
    animation: probadge-fade-in 0.8s ease-in;
}
@keyframes probadge-fade-in {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ---- Countdown ---- */
.probadge-countdown {
    font-weight: 400;
    font-size: 10px;
    opacity: 0.9;
    margin-right: 3px;
    direction: ltr;
    display: inline-block;
}

/* Ensure product image wrapper is relative */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    position: relative;
}
.woocommerce ul.products li.product .probadge-container,
.woocommerce div.product .probadge-container {
    position: absolute;
}
.woocommerce ul.products li.product img,
.woocommerce div.product .woocommerce-product-gallery {
    position: relative;
}
.woocommerce ul.products li.product {
    overflow: hidden;
}

/* RTL fixes */
[dir="rtl"] .probadge-pos-top-left   { right: 10px; left: auto; }
[dir="rtl"] .probadge-pos-top-right  { left: 10px;  right: auto; }
[dir="rtl"] .probadge-pos-bottom-left  { right: 10px; left: auto; bottom: 10px; top: auto; }
[dir="rtl"] .probadge-pos-bottom-right { left: 10px;  right: auto; bottom: 10px; top: auto; }

/* =========================================
   Injection mode — badge inside <a> tag
   ========================================= */

/* الـ <a> الذي يلف صورة المنتج يجب يكون relative */
.woocommerce ul.products li.product a.woocommerce-loop-product__link,
.woocommerce ul.products li.product .product-image-wrapper,
.woocommerce ul.products li.product .product-element-top,
.woocommerce ul.products li.product figure.product-image,
.woocommerce ul.products li.product .product-img-wrp,
.woocommerce div.product div.images,
.woocommerce div.product .woocommerce-product-gallery,
.woocommerce div.product .woocommerce-product-gallery__image,
/* XStore specific */
.products .product .product-image,
.products .product .product-image-wrap,
.products .product .product-img,
.xstore-product-image-container,
.et_product_image_wrapper {
    position: relative !important;
    overflow: visible !important;
}

/* container داخل <a> */
.probadge-on-image {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    z-index: 99;
    display: block;
}

/* منع تضاعف البادج */
.probadge-on-image ~ .probadge-container {
    display: none !important;
}

/* Single product page */
.woocommerce div.product .woocommerce-product-gallery { position: relative !important; }
.woocommerce div.product .woocommerce-product-gallery figure { position: relative !important; }
.woocommerce div.product .woocommerce-product-gallery figure a { position: relative; display: block; }

.probadge-wrap-loop,
.probadge-wrap-single {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    pointer-events: none;
    z-index: 99;
    display: block;
}