.card-inner { perspective:1200px; position:relative; width:100%; max-width:280px; margin:0 auto; border-radius:10px; display:flex; flex-direction:column; height: 420px; transition:transform 0.6s ease; }
.product-card a { text-decoration:none !important; }
.card-front { display:flex; flex-direction:column; justify-content:space-between; align-items:center; height:100%; box-sizing: border-box; border-radius:10px; overflow:hidden; backface-visibility:hidden; transition:transform 0.6s ease, box-shadow 0.3s ease; background:#fff; box-shadow:0 6px 18px rgba(0,0,0,0.05); border:2px solid rgba(0,0,0,0.08); padding:10px; }.card-back { flex:1 1 auto; position:absolute; top:0; left:0; width:100%; height:100%;  box-sizing: border-box; transform:rotateY(180deg); box-shadow:6px 8px 8px rgba(0,0,0,0.15); background:#f7f7f7; display:flex; flex-direction:column; justify-content:center; align-items:center; border-radius:10px; overflow:hidden; backface-visibility:hidden; transition:transform 0.6s ease, box-shadow 0.3s ease; padding:20px; }
.product-card.flipped .card-front { transform:rotateY(180deg); }
.product-card.flipped .card-back { transform:rotateY(0deg); }
.product-card .product-image { width:100%; height: 230px;;  display:flex; justify-content:center; align-items:center; overflow:hidden; border-radius:16px; transition:transform 0.3s ease; }
.product-card:hover .product-image { transform:scale(1.05); }
.product-card .product-image img { max-width:100%; max-height:95%; object-fit:contain; display:block; margin:0 auto; transition:transform 0.3s ease; }
.product-title { font-weight:700; font-size:14px; color:#222; text-align:center; margin:6px 2px; min-height:40px; line-height:1.4; overflow:hidden; }
.product-sku { font-size:12px; color:#777; text-align:right; margin-bottom:20px; margin-right:10px; }
.product-price { color:#e63946; font-weight:700; font-size:14px; text-align:left; margin-top:auto; margin-bottom:10px; margin-left:10px; }
.product-price .line-through { text-decoration:line-through !important; color:#777; font-weight:500; font-size:13px; margin-left:10px; }
.product-price .sale-price { color:#e63946; font-weight:700; font-size:14px; background:#ffe6e9; padding:4px 8px; border-radius:8px; display:inline-flex; align-items:center; gap:6px; transition:transform 0.2s, background 0.3s; }
.product-divider { border:none; height:2px; width:100%; margin:12px 0 16px 0; border-radius:2px; background:linear-gradient(90deg, rgba(230,57,70,0) 0%, rgba(230,57,70,0.8) 50%, rgba(230,57,70,0) 100%); }
.product-info-row { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.product-discount { background:#e63946; color:#fff; font-weight:700; padding:2px 6px; border-radius:4px; font-size:12px; margin-left:10px; margin-bottom:20px; min-width:35px; text-align:center; }
.card-front .cart-icon { position:absolute; bottom:10px; right:10px; width:48px; height:48px; background:#e63946; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; cursor:pointer; transition:transform 0.3s ease, background 0.3s ease; }
.card-front .cart-icon:hover { transform:scale(1.1) rotate(-10deg); background:#d6333f; }
.back-flip-btn { background:#444; color:#fff; border:none; padding:8px 16px; border-radius:12px; cursor:pointer; font-weight:600; margin-bottom:15px; box-shadow:0 3px 8px rgba(0,0,0,0.15); transition:background 0.3s, transform 0.3s; }
.back-flip-btn:hover { background:#222; transform:translateY(-2px); }
.quantity-wrapper { display:flex; align-items:center; justify-content:center; margin:12px 0; gap:5px; }
.quantity-wrapper input { width:50px; text-align:center; border-radius:8px; border:1px solid #ccc; font-size:14px; }
.quantity-wrapper button { width:32px; height:32px; border:none; background:#e63946; color:#fff; font-weight:bold; border-radius:8px; cursor:pointer; transition:transform 0.2s; }
.quantity-wrapper button:hover { transform:scale(1.1); }
.add-to-cart-btn { background:#e63946; color:#fff; border:none; padding:10px 20px; border-radius:12px; cursor:pointer; font-weight:700; text-transform:uppercase; transition:0.3s; }
.add-to-cart-btn:hover { background:#d6333f; transform:translateY(-2px); }
.variation-wrapper { display:flex; flex-direction:column; align-items:center; gap:10px; margin-bottom:15px; }
.variation-label { font-weight:600; color:#333; font-size:14px; text-align:center; margin-bottom:6px; }
.color-options, .size-options { display:flex; flex-wrap:wrap; gap:8px; justify-content:center; }
.color-options .color-circle { width:28px; height:28px; border-radius:50%; border:2px solid #ccc; cursor:pointer; transition:0.2s; }
.color-options .color-circle.selected { border-color:#e63946; transform:scale(1.2); }
.size-options .size-btn { padding:6px 12px; border:1px solid #ccc; border-radius:8px; cursor:pointer; background:#fff; transition:0.2s; }
.size-options .size-btn.selected { border-color:#e63946; background:#e63946; color:#fff; }
.unavailable-message {
    font-size: 13px;
    color: #dc3545;
    text-align: center;
    margin-top: 5px;
    font-weight: 600;
    display: none;
}

.toast-message {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.9);
    padding: 16px 30px;
    border-radius: 14px;
    font-weight: 600;
    font-size: 15px;
    color: #fff;
    z-index: 9999;
    opacity: 0;
    pointer-events: none;
    transition: all 0.4s ease;
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
    backdrop-filter: blur(6px);
    max-width: 90%;
    text-align: center;
}
.toast-message.show { 
    opacity: 1; 
    transform: translate(-50%, -50%) scale(1); 
    pointer-events: auto; 
}


.toast-success { 
    background: linear-gradient(135deg, #28a745, #198754); 
}

.toast-error { 
    background: linear-gradient(135deg, #dc3545, #b02a37); 
}

/* ریسپانسیو موبایل و تبلت */
@media (max-width: 768px) {
    .toast-message {
        font-size: 14px;
        padding: 12px 24px;
    }
}