.erdi-wishlist-wrapper { position: absolute; top: 10px; right: 10px; z-index: 10; }
.erdi-wishlist-icon { background: rgba(107,142,35,0.2); width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; transition: background 0.3s ease; }
.erdi-wishlist-wrapper.is-in-wishlist .erdi-wishlist-icon { background: #6B8E23; }
.erdi-wishlist-icon i { font-size: 18px; color: #6B8E23; transition: color 0.3s ease; }
.erdi-wishlist-wrapper.is-in-wishlist .erdi-wishlist-icon i { color: #ffffff; }

.erdi-spinner { border: 3px solid #f3f3f3; border-top: 3px solid #6B8E23; border-radius: 50%; width: 18px; height: 18px; animation: spin 1s linear infinite; display: none; position: absolute; }
.erdi-wishlist-wrapper.is-loading .erdi-spinner { display: block; }
.erdi-wishlist-wrapper.is-loading .erdi-wishlist-icon i { display: none; }
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

.erdi-popup-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); z-index: 999998; display: none; opacity: 0; transition: opacity 0.25s ease; }
.erdi-popup { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #ffffff; box-shadow: 0 5px 18px rgba(0,0,0,0.15); padding: 22px 26px; border-radius: 12px; z-index: 999999; width: 340px; max-width: 90%; text-align: center; font-family: 'Inter', sans-serif; opacity: 0; visibility: hidden; transition: all 0.25s ease; }
.erdi-popup.show { opacity: 1; visibility: visible; transform: translate(-50%, -50%); }
.erdi-popup-overlay.show { display: block; opacity: 1; }
.erdi-popup .popup-icon { font-size: 28px; margin-bottom: 8px; }
.erdi-popup .popup-title { font-weight: 500; font-size: 14px; margin-bottom: 6px; color: #333; }
.erdi-popup.success .popup-icon { color: #4CAF50; }
.erdi-popup.success .popup-progress-bar { background: #4CAF50; }
.erdi-popup.warning .popup-icon { color: #6B8E23; }
.erdi-popup.warning .popup-progress-bar { background: #6B8E23; }
.erdi-popup.error .popup-icon { color: #F44336; }
.erdi-popup.error .popup-progress-bar { background: #F44336; }
.erdi-popup .popup-progress { width: 100%; height: 5px; background: #dcdcdc; border-radius: 20px; overflow: hidden; margin-top: 12px; }
.erdi-popup .popup-progress-bar { height: 100%; width: 0%; transition: background 0.3s ease; }
.erdi-popup.show .popup-progress-bar-animate { width: 100%; animation: toastProgress 2.5s linear forwards; }
@keyframes toastProgress { from { width: 100%; } to { width: 0%; } }