/* Decorish WhatsApp floating button styles */
#decorish-wa {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 99999;
}

.decorish-wa-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #25D366;
    color: #fff;
    box-shadow: 0 6px 18px rgba(37,211,102,0.2);
    text-decoration: none;
    outline: none;
}

.decorish-wa-btn svg { display:block; }

.decorish-wa-visuallyhidden { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }

/* Bounce animation toggled by JS */
.decorish-bounce {
    animation: decorish-bounce 600ms ease;
}

@keyframes decorish-bounce {
    0% { transform: translateY(0) scale(1); }
    30% { transform: translateY(-12px) scale(1.03); }
    50% { transform: translateY(0) scale(0.99); }
    100% { transform: translateY(0) scale(1); }
}

/* Small screen adjustments */
@media (max-width: 480px) {
    .decorish-wa-btn { width: 48px; height: 48px; right: 12px; bottom: 12px; }
}

/* Inline button displayed under Add to cart */
.decorish-inline-wa {
    margin-top: 12px;
}
.decorish-inline-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: #25D366;
    color: #fff;
    border-radius: 6px;
    text-decoration: none;
    font-weight: 600;
}
.decorish-inline-btn:hover,
.decorish-inline-btn:focus {
    box-shadow: 0 6px 18px rgba(37,211,102,0.18);
}
.decorish-inline-icon svg { display:block; }
.decorish-inline-text { line-height:1; }

/* Shake animations: rotate around center so left goes down, right goes up */
.decorish-inline-btn { transform-origin: center center; }
.decorish-shake-left {
    animation: decorish-shake-left 600ms ease-in-out;
}
.decorish-shake-right {
    animation: decorish-shake-right 600ms ease-in-out;
}
.decorish-shiny-border {
    position: relative;
    z-index: 0;
    padding: 8px 12px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    color: #fff;
    background: transparent; /* inner fill provided by ::after */
    border: 2px solid transparent; /* keep layout but visual border comes from gradient */
    display: inline-block;
    overflow: visible;
}

/* Animated gradient border implemented with two pseudo-elements:
   ::before = animated gradient ring behind the button
   ::after  = inner fill that matches the original button background */
.decorish-shiny-border::before {
    content: "";
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    border-radius: calc(50px + 2px);
    background: linear-gradient(90deg, #EF8D69, #fcff54, #f3836f);
    background-size: 300% 300%;
    z-index: -2;
    transform-origin: center center;
    will-change: transform, background-position;
    animation: decorish-gradient 3s linear infinite;
}

.decorish-shiny-border::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 2px; /* thickness of the visible border */
    border-radius: 50px;
    background: #4BAAE1; /* original button background */
    z-index: -1;
}

@keyframes decorish-gradient {
    0% {
        
        background-position: 0% 50%;
    }
    50% {
        
        background-position: 100% 50%;
    }
    100% {
        
        background-position: 0% 50%;
    }
}

@keyframes decorish-shake-left {
    0% { transform: rotate(0deg); }
    25% { transform: rotate(7deg); }
    50% { transform: rotate(0deg); }
    100% { transform: rotate(0deg); }
}

@keyframes decorish-shake-right {
    0% { transform: rotate(0deg); }
    25% { transform: rotate(-7deg); }
    50% { transform: rotate(0deg); }
    100% { transform: rotate(0deg); }
}

/* Sales ticker under product title */
.decorish-sales-ticker {
    color: #333;
    font-size: 13px;
    margin-top: 6px;
    font-weight: 600;
}
.decorish-sales-ticker { color: #444; font-size: 20px; font-weight: normal; }

/* Urgency countdown banner */
.decorish-urgency-banner {
    
    color: #fff;
    border-radius: 20px;
    padding: 8px 20px;
    display: block;
    margin: 8px 0;
    font-weight: 700;
}
.decorish-urgency-inner { display:flex; align-items:center; gap:12px; justify-content:space-between; }
.decorish-urgency-text { font-weight:700; }
.decorish-urgency-count {  }
.decorish-urgency-count span { display:inline-block; min-width:28px; text-align:center; }
.du-sep { margin: 0 10px; }
.decorish-urgency-count span.du-label { font-size:14px; display:block; font-weight:400; }
.decorish-urgency-count span {font-size: 26px;}
div.decorish-urgency-count {display: flex;}

.decorish-product-cats { display:grid; gap:16px; }
.decorish-product-cats.columns-1 { grid-template-columns: repeat(1,1fr); }
.decorish-product-cats.columns-2 { grid-template-columns: repeat(2,1fr); }
.decorish-product-cats.columns-3 { grid-template-columns: repeat(3,1fr); }
.decorish-product-cats.columns-4 { grid-template-columns: repeat(4,1fr); }

.decorish-cat-item { text-align:center; display:block; color:inherit; text-decoration:none; }
.decorish-cat-image img { width:100%; height:160px; object-fit:cover; border-radius:8px; display:block; }
.decorish-cat-placeholder { width:100%; height:160px; background:#eee; border-radius:8px; }
.decorish-cat-name { margin-top:8px; font-weight:600; color:#222; }
@media (max-width:600px) { .decorish-product-cats { grid-template-columns: repeat(2,1fr); } }