/**
 * RNH PC - Stock & Promo Badges Pro
 * Version: 5.2.4 - Surgical fix - badges go INSIDE thumbnail, not card
 * No more breaking swiper carousels!
 */

/* ==========================================================================
   ONLY make thumbnails relative for absolute positioning of badges.
   Do NOT mess with card-level or carousel-level overflow.
   ========================================================================== */

.jet-woo-product-thumbnail,
.jet-woo-builder-product-thumbnail,
.jet-woo-thumb-with-effect,
.woocommerce-loop-product__link,
.woocommerce-LoopProduct-link,
.product-thumbnail,
.product-image {
    position: relative !important;
}

/* Single product page - gallery container needs to be relative for badges */
.woocommerce-product-gallery,
.elementor-widget-woocommerce-product-images,
.jet-single-product-images {
    position: relative !important;
}

/* ==========================================================================
   Badges wrapper
   ========================================================================== */

.rnh-badges-wrapper {
    position: absolute !important;
    z-index: 5 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 5px !important;
    pointer-events: none;
    max-width: calc(100% - 24px);
    width: auto !important;
    height: auto !important;
    direction: ltr !important;
    box-sizing: border-box !important;
}

.rnh-badges-wrapper.rnh-position-top-left,
.rnh-badges-wrapper.rnh-position-top-right,
.rnh-badges-wrapper.rnh-position-bottom-left,
.rnh-badges-wrapper.rnh-position-bottom-right {
    align-items: flex-end !important;
}

.rnh-badges-wrapper.rnh-position-top-left {
    top: 12px !important;
    left: 12px !important;
    right: auto !important;
    bottom: auto !important;
}

.rnh-badges-wrapper.rnh-position-top-right {
    top: 12px !important;
    right: 12px !important;
    left: auto !important;
    bottom: auto !important;
}

.rnh-badges-wrapper.rnh-position-bottom-left {
    bottom: 12px !important;
    left: 12px !important;
    right: auto !important;
    top: auto !important;
}

.rnh-badges-wrapper.rnh-position-bottom-right {
    bottom: 12px !important;
    right: 12px !important;
    left: auto !important;
    top: auto !important;
}

/* ==========================================================================
   Base badge styles
   ========================================================================== */

.rnh-stock-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px;
    color: #ffffff !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    letter-spacing: 0.3px;
    text-align: center;
    white-space: nowrap;
    font-family: inherit;
    pointer-events: auto;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    text-decoration: none !important;
    visibility: visible !important;
    opacity: 1 !important;
    box-sizing: border-box !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
    direction: rtl !important;
    flex-shrink: 0;
}

.rnh-stock-badge .rnh-badge-icon {
    font-size: 1em;
    line-height: 1;
}

/* ==========================================================================
   Sizes
   ========================================================================== */

.rnh-stock-badge.rnh-size-small {
    font-size: 10px !important;
    padding: 3px 8px !important;
}

.rnh-stock-badge.rnh-size-medium {
    font-size: 12px !important;
    padding: 5px 12px !important;
}

.rnh-stock-badge.rnh-size-large {
    font-size: 14px !important;
    padding: 7px 16px !important;
}

.rnh-stock-badge.rnh-size-custom {
    font-size: var(--rnh-badge-fs, 12px) !important;
    padding: var(--rnh-badge-pv, 5px) var(--rnh-badge-ph, 12px) !important;
}

/* ==========================================================================
   Shapes
   ========================================================================== */

.rnh-stock-badge.rnh-shape-pill { border-radius: 100px !important; }
.rnh-stock-badge.rnh-shape-rounded { border-radius: 6px !important; }
.rnh-stock-badge.rnh-shape-square { border-radius: 0 !important; }

.rnh-stock-badge.rnh-shape-ribbon {
    border-radius: 0 !important;
    position: relative !important;
    clip-path: polygon(0 0, 100% 0, calc(100% - 10px) 50%, 100% 100%, 0 100%);
    padding-left: 18px !important;
}

.rnh-stock-badge.rnh-shape-corner {
    border-radius: 0 !important;
    transform: rotate(-45deg) !important;
    transform-origin: center !important;
    padding: 3px 30px !important;
    font-size: 10px !important;
}

/* ==========================================================================
   Custom images
   ========================================================================== */

.rnh-stock-badge.rnh-has-image.rnh-image-replace {
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    clip-path: none !important;
}

.rnh-stock-badge .rnh-badge-image {
    display: block;
    max-width: 100%;
    height: auto;
    width: auto;
}

.rnh-stock-badge.rnh-size-small .rnh-badge-image { max-height: 24px; }
.rnh-stock-badge.rnh-size-medium .rnh-badge-image { max-height: 32px; }
.rnh-stock-badge.rnh-size-large .rnh-badge-image { max-height: 44px; }
.rnh-stock-badge.rnh-size-custom .rnh-badge-image {
    max-height: calc(var(--rnh-badge-fs, 12px) * 2.5);
}

.rnh-stock-badge.rnh-has-image.rnh-image-background {
    text-shadow: 0 1px 2px rgba(0,0,0,0.5);
    background-color: transparent !important;
}

/* ==========================================================================
   Animations
   ========================================================================== */

.rnh-stock-badge.rnh-badge-lowstock {
    animation: rnh-pulse 2s ease-in-out infinite;
}

@keyframes rnh-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

@keyframes rnh-shake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-2px) rotate(-2deg); }
    75% { transform: translateX(2px) rotate(2deg); }
}

@keyframes rnh-glow {
    0%, 100% {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15), 0 0 8px rgba(255, 255, 255, 0.3);
    }
    50% {
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2), 0 0 18px rgba(255, 255, 255, 0.6);
    }
}

@keyframes rnh-sparkle {
    0%, 100% { transform: scale(1) rotate(0); filter: brightness(1); }
    25% { transform: scale(1.05) rotate(-2deg); filter: brightness(1.2); }
    75% { transform: scale(1.05) rotate(2deg); filter: brightness(1.2); }
}

.rnh-stock-badge.rnh-anim-pulse   { animation: rnh-pulse 2s ease-in-out infinite; }
.rnh-stock-badge.rnh-anim-shake   { animation: rnh-shake 0.6s ease-in-out infinite; }
.rnh-stock-badge.rnh-anim-glow    { animation: rnh-glow 2s ease-in-out infinite; }
.rnh-stock-badge.rnh-anim-sparkle { animation: rnh-sparkle 2.5s ease-in-out infinite; }

/* ==========================================================================
   Mobile Responsive
   ========================================================================== */

@media (max-width: 768px) {
    .rnh-badges-wrapper {
        gap: 4px !important;
        max-width: calc(100% - 16px) !important;
    }

    .rnh-badges-wrapper.rnh-position-top-left,
    .rnh-badges-wrapper.rnh-position-bottom-left {
        left: 8px !important;
    }
    .rnh-badges-wrapper.rnh-position-top-right,
    .rnh-badges-wrapper.rnh-position-bottom-right {
        right: 8px !important;
    }
    .rnh-badges-wrapper.rnh-position-top-left,
    .rnh-badges-wrapper.rnh-position-top-right {
        top: 8px !important;
    }
    .rnh-badges-wrapper.rnh-position-bottom-left,
    .rnh-badges-wrapper.rnh-position-bottom-right {
        bottom: 8px !important;
    }

    .rnh-stock-badge.rnh-size-small {
        font-size: 9px !important;
        padding: 2px 6px !important;
    }
    .rnh-stock-badge.rnh-size-medium {
        font-size: 10px !important;
        padding: 3px 8px !important;
    }
    .rnh-stock-badge.rnh-size-large {
        font-size: 11px !important;
        padding: 4px 10px !important;
    }

    .rnh-stock-badge.rnh-size-small .rnh-badge-image { max-height: 18px; }
    .rnh-stock-badge.rnh-size-medium .rnh-badge-image { max-height: 24px; }
    .rnh-stock-badge.rnh-size-large .rnh-badge-image { max-height: 32px; }
}