.hidden-container {
    display: none;
}

.diamond-product-variables {
    padding-top: 0;
    padding-right: 10px;
    padding-left: 10px;
}

.diamond-product-variables .variable-item {
    border-radius: 0 !important;
    width: 22px !important;
    height: 22px !important;
    font-size: 12px !important;
}

.diamond-product-variables .variable-item-contents .variable-item-span {
    border-radius: 0;
}

.diamond-product-variables .variable-items-wrapper {
    gap: 3px !important;
}

.lds-ripple {
    /* change color here */
    color: #1c4c5b
}

.lds-ripple,
.lds-ripple div {
    box-sizing: border-box;
}

.lds-ripple {
    display: none;
    position: relative;
    width: 80px;
    height: 80px;
}

.lds-ripple div {
    position: absolute;
    border: 4px solid currentColor;
    opacity: 1;
    border-radius: 50%;
    animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}

.lds-ripple div:nth-child(2) {
    animation-delay: -0.5s;
}

@keyframes lds-ripple {
    0% {
        top: 36px;
        left: 36px;
        width: 8px;
        height: 8px;
        opacity: 0;
    }
    4.9% {
        top: 36px;
        left: 36px;
        width: 8px;
        height: 8px;
        opacity: 0;
    }
    5% {
        top: 36px;
        left: 36px;
        width: 8px;
        height: 8px;
        opacity: 1;
    }
    100% {
        top: 0;
        left: 0;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}

@media (min-width: 768px) {
    .diamond-product-variables {
        padding-top: 0;
        padding-right: 18px;
        padding-left: 18px;
    }
}
/* Shortcode mode - hide tab navigation */
.nivoda-shortcode-mode .nav-pills {
    display: none !important;
}

.nivoda-shortcode-mode .diamonds-tabset {
    display: none !important;
}

.nivoda-shortcode-mode .diamonds-filters-tabs {
    display: none !important;
}

/* Force gemstone tab content to be visible in shortcode mode */
.nivoda-shortcode-mode #gemstone.tab-panel {
    display: block !important;
}

/* Gemstone Icon Glossy CSS Circles */
.gem-icon {
    width: 26px; /* Fit the container */
    height: 26px;
    border-radius: 50%;
    display: block; /* Fix vertical align */
    margin: 0 auto; /* Center */
    box-shadow: inset -2px -2px 6px rgba(0,0,0,0.4), inset 2px 2px 6px rgba(255,255,255,0.7);
    border: 1px solid rgba(0,0,0,0.1);
}

/* Add "Shine" */
.gem-icon::after {
    content: ''; 
    display: block; 
    width: 10px; 
    height: 5px; 
    background: rgba(255,255,255,0.6); 
    border-radius: 50%; 
    position: relative; 
    top: 4px; 
    left: 4px; 
    transform: rotate(-45deg);
}

/* Specific gemstone colors with richer glossy gradients */
.gem-icon-sapphire { background: radial-gradient(circle at 30% 30%, #4a90e2, #083d77); } /* Blue */
.gem-icon-ruby { background: radial-gradient(circle at 30% 30%, #ff6b6b, #8a1c1c); } /* Red - Richer */
.gem-icon-emerald { background: radial-gradient(circle at 30% 30%, #50e3a1, #145a32); } /* Green - Richer */
.gem-icon-tourmaline { background: radial-gradient(circle at 30% 30%, #ff85c8, #c71585); } /* Pink */
.gem-icon-tanzanite { background: radial-gradient(circle at 30% 30%, #8a7acd, #483d8b); } /* Purple-Blue */
.gem-icon-aquamarine { background: radial-gradient(circle at 30% 30%, #9fffd4, #20b2aa); } /* Aqua */
.gem-icon-alexandrite { background: radial-gradient(circle at 30% 30%, #b390db, #4b0082); } /* Purple-Green */
.gem-icon-spinel { background: radial-gradient(circle at 30% 30%, #ff4363, #8b0000); } /* Deep Red */
.gem-icon-opal { background: radial-gradient(circle at 30% 30%, #f8ffff, #add8e6); } /* Iridescent White */
.gem-icon-topaz { background: radial-gradient(circle at 30% 30%, #ffe44d, #daa520); } /* Golden */
.gem-icon-garnet { background: radial-gradient(circle at 30% 30%, #a83232, #4b0000); } /* Dark Red */
.gem-icon-morganite { background: radial-gradient(circle at 30% 30%, #ffc6d1, #ff69b4); } /* Pink */
.gem-icon-peridot { background: radial-gradient(circle at 30% 30%, #b4e352, #6b8e23); } /* Yellow-Green */
.gem-icon-amethyst { background: radial-gradient(circle at 30% 30%, #b98ecc, #663399); } /* Purple */
.gem-icon-citrine { background: radial-gradient(circle at 30% 30%, #ffc76f, #ff8c00); } /* Orange-Yellow */
.gem-icon-quartz { background: radial-gradient(circle at 30% 30%, #f0f0f0, #b0b0b0); } /* Clear/Gray */
.gem-icon-kunzite { background: radial-gradient(circle at 30% 30%, #ffd0d8, #ff1493); } /* Light Pink */
.gem-icon-ametrine { background: radial-gradient(circle at 30% 30%, #b98ecc, #ffc76f); } /* Purple-Yellow */
.gem-icon-jade { background: radial-gradient(circle at 30% 30%, #20a86b, #013220); } /* Jade Green */
.gem-icon-grandidierite { background: radial-gradient(circle at 30% 30%, #6aa2c4, #1e3a5f); } /* Blue-Green */
.gem-icon-moonstone { background: radial-gradient(circle at 30% 30%, #f8ffff, #dcdcdc); } /* White-Iridescent */
.gem-icon-sodalite { background: radial-gradient(circle at 30% 30%, #6189f1, #00008b); } /* Blue */
.gem-icon-zircon { background: radial-gradient(circle at 30% 30%, #a7deff, #4682b4); } /* Sky Blue */
.gem-icon-chrysoberyl { background: radial-gradient(circle at 30% 30%, #f0c548, #b8860b); } /* Golden */
.gem-icon-beryl { background: radial-gradient(circle at 30% 30%, #9fffd4, #3cb371); } /* Aqua-Green */
.gem-icon-apatite { background: radial-gradient(circle at 30% 30%, #60f0e0, #008080); } /* Turquoise */
.gem-icon-sphene { background: radial-gradient(circle at 30% 30%, #b4e352, #6b8e23); } /* Yellow-Green */
.gem-icon-heliodor { background: radial-gradient(circle at 30% 30%, #ffff4d, #ffd700); } /* Golden Yellow */
.gem-icon-prehnite { background: radial-gradient(circle at 30% 30%, #c7ff2f, #7cfc00); } /* Lime Green */
.gem-icon-spectrolite { background: radial-gradient(circle at 30% 30%, #3949a0, #000080); } /* Dark Blue */
.gem-icon-default { background: radial-gradient(circle at 30% 30%, #e0e0e0, #888888); } /* Default Gray */

/* Text-Only Filter Styling (Shapes, Colors, etc.) - Added for v2.1.32 */
.filters-selection-item {
    border: 1px solid #e0e0e0;
    padding: 8px 12px;
    border-radius: 4px;
    text-align: center;
    transition: all 0.3s ease;
    background: #fff;
    cursor: pointer;
    min-width: 60px;
    display: inline-block;
}

/* Hover Effect for Text Filters */
.filters-selection-item:hover {
    border-color: #333;
    background-color: #f9f9f9;
}

/* Active State for Selected Filters */
.filters-selection-item--active {
    background-color: #333;
    color: #fff;
    border-color: #333;
}

/* 1. Force Button Style for Gemstone Types */
.diamonds-filters-list[data-filter="gemstone_type"] .filters-selection-item {
    border: 1px solid #e0e0e0 !important;
    background-color: #fff !important;
    border-radius: 4px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    min-height: 40px;
}

/* 2. Hover Effect */
.diamonds-filters-list[data-filter="gemstone_type"] .filters-selection-item:hover {
    border-color: #333 !important;
    background-color: #f9f9f9 !important;
}

/* 3. Active State */
.diamonds-filters-list[data-filter="gemstone_type"] .filters-selection-item.active {
    background-color: #333 !important;
    color: #fff !important;
    border-color: #333 !important;
}

/* 4. HIDE THE ICON DIV ONLY */
.diamonds-filters-list[data-filter="gemstone_type"] .filter-item-icon,
.diamonds-filters-list[data-filter="gemstone_type"] .gem-icon {
    display: none !important;
}

/* Ensure empty gem-icon divs don't take up space */
.gem-icon:empty {
    display: none;
}

/*Hide text in final step */
.product-multistep-wrapper:has( .multi-step-item.current[data-step-value="final"] ) ~ .diamond-builder-wrapper {
display: none;
}