
:root {
  --satyam-bg-light: #ffffff;
  --satyam-primary: #6a1b9a;
  --satyam-danger: #e53935;
  --satyam-text-dark: #333333;
  --satyam-text-muted: #757575;
  --satyam-text-light: #9e9e9e;
  --satyam-shadow: rgba(0, 0, 0, 0.1);
  --satyam-shadow-lg: rgba(0, 0, 0, 0.15);
  --satyam-radius-sm: 8px;
  --satyam-radius-md: 12px;
  --satyam-transition: 0.25s ease;
}


/* Satyam Plugin Styles */
.product-title {
    font-size: 2rem;
    margin-bottom: 10px;
}
.product-price {
    font-size: 1.5rem;
    color: #333;
    margin-bottom: 20px;
}








/* Product Gallary Css */

/* ===== Product Image Gallery - Wireframe Layout ===== */
/* ===== Product Image Gallery - Enhanced ===== */
.satyam-product-gallery {
    display: flex;
    gap: 20px;
    margin-bottom: 30px;
    align-items: flex-start;
}

/* ===== Thumbnails (LEFT) ===== */
.satyam-gallery-thumbs {
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex-shrink: 0;
}

/* Thumbnail */
.satyam-gallery-thumb {
    width: 90px;
    height: 90px;
    cursor: pointer;
    border: 2px solid transparent;
    border-radius: 14px;
    overflow: hidden;
    transition: all 0.25s ease;
    opacity: 0.7;
    background: #f5f5f5;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* FIX: prevent awkward cropping */
.satyam-gallery-thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain; /* changed from cover */
    padding: 6px; /* breathing space */
    transition: transform 0.25s ease;
}

/* Hover + Active */
.satyam-gallery-thumb:hover,
.satyam-gallery-thumb.active {
    opacity: 1;
    border-color: #7b1fa2;
    transform: translateY(-3px);
}

.satyam-gallery-thumb:hover img {
    transform: scale(1.05);
}

/* ===== Main Image (RIGHT) ===== */
.satyam-gallery-main {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    border-radius: 16px;
    padding: 0;
    min-height: unset !important;
    border: 1px solid #eaeaea;
    overflow: hidden;
}

/* Wrapper */
.satyam-main-image-wrapper {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Full width image, no extra space */
.satyam-main-image-wrapper img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: unset !important;
    object-fit: cover;
    border-radius: 0;
    transition: transform 0.3s ease;
    display: block;
}

/* subtle zoom on hover */
.satyam-gallery-main:hover img {
    transform: scale(1.02);
}

/* ===== Empty State ===== */
.satyam-product-gallery-empty {
    text-align: center;
    padding: 80px 20px;
    background: #fafafa;
    border-radius: 12px;
    color: #aaa;
    font-size: 16px;
}

/* ===== Responsive ===== */
/* ===== Responsive ===== */
@media (max-width: 768px) {
    .satyam-product-gallery {
        flex-direction: column;
        gap: 0;
    }

    /* Main image UPAR */
    .satyam-gallery-main {
        order: 1;
        width: 100%;
        padding: 0;
        min-height: 300px;
        border-radius: 12px 12px 0 0;
        border-bottom: none;
    }

    /* Thumbnails NEECHE — 4 column fit */
    .satyam-gallery-thumbs {
        order: 2;
        flex-direction: row;
        overflow-x: auto;
        gap: 6px;
        padding: 8px;
        width: 100%;
        background: #fff;
        border: 1px solid #eaeaea;
        border-top: none;
        border-radius: 0 0 12px 12px;
        box-sizing: border-box;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .satyam-gallery-thumbs::-webkit-scrollbar {
        display: none;
    }

    /* Har thumb = screen width ka ~23% → 4 columns visible */
    .satyam-gallery-thumb {
        flex-shrink: 0;
        width: calc(23vw - 10px);
        height: calc(23vw - 10px);
        max-width: 75px;
        max-height: 75px;
    }

    .satyam-main-image-wrapper img {
        width: 100% !important;
        max-width: 100% !important;
        height: 100% !important;
        max-height: unset !important;
        border-radius: 0;
    }
}

@media (max-width: 480px) {
    .satyam-gallery-thumb {
        width: calc(23vw - 8px);
        height: calc(23vw - 8px);
        max-width: 68px;
        max-height: 68px;
    }
}

/* ===== Smooth Image Change ===== */
@keyframes fadeIn {
    from { opacity: 0; transform: scale(0.98); }
    to { opacity: 1; transform: scale(1); }
}

.satyam-main-image-wrapper img {
    animation: fadeIn 0.2s ease-in-out;
}



/* ===== Sale Badge Widget ===== */
.satyam-sale-badge {
    display: inline-block;
    padding: 6px 16px;
    font-size: 14px;
    font-weight: 700;
    color: #d32f2f !important;
    background-color: #ffffff !important ;
    border: 2px solid #d32f2f !important;
    border-radius: 25px;
    text-align: center;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

/* ===== Product Reviews Widget ===== */
.satyam-product-reviews {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
}

.satyam-review-stars {
    display: flex;
    gap: 2px;
}

.satyam-review-stars span {
    font-size: 16px;
    line-height: 1;
}

.satyam-review-stars .star-filled {
    color: #601050;
}

.satyam-review-stars .star-half {
    color: #601050;
}

.satyam-review-stars .star-empty {
    color: #e0e0e0;
}

.satyam-review-count {
    color: #601050;
    font-weight: 500;
}

/* Hover effect for reviews (if linking) */
.satyam-product-reviews:hover {
    cursor: pointer;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .satyam-sale-badge {
        padding: 5px 12px;
        font-size: 12px;
    }
    
    .satyam-product-reviews {
        font-size: 13px;
    }
    
    .satyam-review-stars span {
        font-size: 14px;
    }
}



/* ===== Product Category Widget ===== */
.satyam-product-category {
    font-size: 16px;
    margin-bottom: 8px;
}

.satyam-product-category a {
    color: inherit;
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.satyam-product-category a:hover {
    opacity: 0.75;
    text-decoration: underline;
}

/* ===== Product Price + Tax Notice Widget ===== */
.satyam-product-price-tax {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.satyam-price-wrapper {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 18px;
}

/* Regular Price (Strikethrough) */
.satyam-regular-price del {
    color: #9e9e9e;
    font-size: 18px;
    font-weight: 400;
}

/* Sale Price (Bold) */
.satyam-sale-price {
    color: #1a237e;
    font-size: 22px;
    font-weight: 700;
}

/* Single Price (when not on sale) */
.satyam-single-price {
    color: #1a237e;
    font-size: 22px;
    font-weight: 700;
}

/* Tax Notice */
.satyam-tax-notice {
    color: #757575;
    font-size: 12px;
    font-weight: 400;
    text-align: right;
    font-style: italic;
}

/* Responsive */
@media (max-width: 768px) {
    .satyam-product-price-tax {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    
    .satyam-tax-notice {
        text-align: left;
        font-size: 11px;
    }
    
    .satyam-regular-price del {
        font-size: 16px;
    }
    
    .satyam-sale-price,
    .satyam-single-price {
        font-size: 20px;
    }
}
/* ===== Variation Selector ===== */
.satyam-variation-selector {
    margin-bottom: 18px;
}

.satyam-variation-options {
    display: flex;
    gap: 2px;
    flex-wrap: wrap;
}

.satyam-variation-option {
    padding: 10px 28px;
    border: 1px solid #FFA51F;
    border-radius: 30px;
    background: #ffffff;
    color: #601050;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.25s ease;
    outline: none;
    min-width: 70px;
    text-align: center;
    line-height: 1.2;
}

.satyam-variation-option:hover {
    border-color: #ff9800;
    background-color: #fff8e1;
    transform: translateY(-1px);
}

.satyam-variation-option.active {
    background: #ff9800;
    color: #ffffff;
    border-color: #ff9800;
}

.satyam-variation-option:disabled {
    opacity: 0.3;
    cursor: not-allowed;
    transform: none;
}
/* ===== Quantity Selector ===== */
.satyam-quantity-selector {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 0;
}

.satyam-qty-btn {
    width: 50px ;
    height: 50px ;
    border: 1px solid #FFA51F ;
    background: #ffffff ;
    color: #6a1b9a ;
    font-size: 28px ;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    outline: none;
    padding: 0;
    line-height: 1;
    border-radius: 50%;
}

.satyam-qty-btn:hover {
    background: #fff8e1;
    border-color: #ff9800;
    transform: scale(1.05);
}

.satyam-qty-btn:active {
    background: #ffecb3;
    transform: scale(0.95);
}

.satyam-qty-number {
    width: 50px ;
    height: 50px;
    border: none ;
    text-align: center;
    font-size: 20px ;
    font-weight: 600;
    color: #6a1b9a;
    background: transparent;
    outline: none;
    -moz-appearance: textfield;
    margin: 0;
    padding: 0;
    line-height: 50px;
}

.satyam-qty-number::-webkit-outer-spin-button,
.satyam-qty-number::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* ===== Buy Now Button ===== */
.satyam-buy-now-btn {
    display: inline-block;
    padding: 16px 60px;
    background: #601050;
    color: #ffffff;
    border: none;
    border-radius: 35px;
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 3px;
    cursor: pointer;
    transition: all 0.3s ease;
    outline: none;
    line-height: 1.4;
}

.satyam-buy-now-btn:hover {
    background: #5a188a;
    transform: translateY(-2px);
}

.satyam-buy-now-btn:active {
    transform: translateY(0);
}

.satyam-buy-now-btn.loading {
    opacity: 0.7;
    cursor: wait;
    pointer-events: none;
}

/* ===== Layout Container ===== */
.satyam-purchase-container {
    display: flex;
    align-items: center;
    gap: 25px;
    flex-wrap: wrap;
}

.satyam-purchase-left {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}

/* ===== Price Widget (Optional) ===== */
.satyam-product-price-tax {
    margin-bottom: 25px;
}

.satyam-price-wrapper {
    display: flex;
    align-items: baseline;
    gap: 10px;
    font-size: 18px;
}

.satyam-price-from {
    font-size: 14px;
    color: #757575;
    font-weight: 400;
    margin-right: 5px;
}

.satyam-regular-price del {
    color: #9e9e9e;
    font-size: 16px;
    font-weight: 400;
    text-decoration: line-through;
}

.satyam-sale-price {
    color: #1a237e;
    font-size: 24px;
    font-weight: 700;
}

.satyam-single-price {
    color: #1a237e;
    font-size: 24px;
    font-weight: 700;
}

.satyam-price-range {
    color: #757575;
    font-weight: 400;
    margin: 0 2px;
}

.satyam-tax-notice {
    color: #757575;
    font-size: 12px;
    font-weight: 400;
    font-style: italic;
    margin-top: 5px;
}

/* ===== Responsive Design ===== */
@media (max-width: 768px) {
    .satyam-variation-option {
        padding: 9px 24px;
        font-size: 13px;
        min-width: 65px;
    }
    
    .satyam-qty-btn {
        width: 45px;
        height: 45px;
        font-size: 24px;
    }
    
    .satyam-qty-number {
        width: 50px;
        height: 45px;
        font-size: 16px;
        line-height: 45px;
    }
    
    .satyam-purchase-container {
        flex-direction: column;
        align-items: stretch;
        gap: 20px;
    }
    
    .satyam-purchase-left {
        justify-content: space-between;
    }
    
    .satyam-buy-now-btn {
        width: 100%;
        padding: 16px 40px;
        text-align: center;
    }
}

@media (max-width: 480px) {
    .satyam-variation-options {
        gap: 8px;
    }
    
    .satyam-variation-option {
        padding: 8px 20px;
        font-size: 12px;
        min-width: 60px;
    }
    
    .satyam-quantity-selector {
        margin: 0 auto;
    }
    
    .satyam-qty-btn {
        width: 42px;
        height: 42px;
        font-size: 22px;
    }
    
    .satyam-qty-number {
        width: 45px;
        height: 42px;
        font-size: 15px;
        line-height: 42px;
    }
}

/* ===== Animation for Price Update ===== */
@keyframes pricePulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

.satyam-price-wrapper.price-updated {
    animation: pricePulse 0.3s ease;
}

/* ===== Loading Spinner for Buy Now Button ===== */
.satyam-buy-now-btn.loading::after {
    content: "";
    position: absolute;
    width: 18px;
    height: 18px;
    top: 50%;
    left: 50%;
    margin: -9px 0 0 -9px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* ===== Notification Toast (Optional) ===== */
.satyam-notification {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 9999;
    background: #ffffff;
    border-left: 4px solid #4caf50;
    padding: 14px 24px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 12px;
    max-width: 400px;
    animation: slideInRight 0.3s ease;
}

.satyam-notification-error {
    border-left-color: #f44336;
}

.satyam-notification-success {
    border-left-color: #4caf50;
}

.satyam-notification-close {
    background: none;
    border: none;
    font-size: 20px;
    cursor: pointer;
    color: #999;
    padding: 0;
    line-height: 1;
    margin-left: 10px;
}

.satyam-notification-close:hover {
    color: #333;
}

@keyframes slideInRight {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

/* ===== Shake Animation for Validation ===== */
@keyframes shake {
    0%, 100% { transform: translateX(0); }
    20%, 60% { transform: translateX(-5px); }
    40%, 80% { transform: translateX(5px); }
}

.satyam-variation-selector.shake {
    animation: shake 0.5s ease;
}




/* Product carousel */

/* ======================================================================
   SATYAM ELEMENTOR WIDGETS - COMPLETE STYLES
   Version: 1.4
   Includes: Product Grid + Product Carousel + Shared Components
====================================================================== */

/* =========================
   SHARED VARIABLES & RESET
========================= */
:root {
  --satyam-primary: #6a1b9a;
  --satyam-primary-dark: #5a188a;
  --satyam-accent: #FFA51F;
  --satyam-accent-light: #ffb74d;
  --satyam-accent-hover: #ff9800;
  --satyam-danger: #e53935;
  --satyam-text-dark: #333333;
  --satyam-text-muted: #757575;
  --satyam-text-light: #9e9e9e;
  --satyam-bg-light: #ffffff;
  --satyam-bg-off: #f6f2ee;
  --satyam-border: #e0e0e0;
  --satyam-shadow: rgba(0, 0, 0, 0.1);
  --satyam-shadow-lg: rgba(0, 0, 0, 0.15);
  --satyam-radius-sm: 8px;
  --satyam-radius-md: 12px;
  --satyam-radius-lg: 30px;
  --satyam-radius-pill: 50px;
  --satyam-transition: 0.25s ease;
}

/* =========================
   PRODUCT GRID STYLES (Existing)
========================= */

/* ROOT WRAPPER & LAYOUT */
.satyam-shop {
  padding: 24px;
  background: var(--satyam-bg-off);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  box-sizing: border-box;
}

.satyam-shop *,
.satyam-shop *::before,
.satyam-shop *::after {
  box-sizing: inherit;
}

.satyam-shop .shop-layout {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
  align-items: flex-start;
}

.satyam-shop .shop-products-wrapper {
  flex: 1 1 600px;
  min-width: 0;
}

/* HEADER */
.satyam-shop .shop-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  flex-wrap: wrap;
  gap: 8px;
}

.satyam-shop .shop-title {
  font-size: 28px;
  color: #6b2d2d;
  font-weight: 500;
  margin: 0;
}

.satyam-shop .product-count {
  font-size: 13px;
  color: #666;
  margin: 0;
}

/* PRODUCTS GRID */
.satyam-shop .shop-products {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.satyam-shop .shop-products:empty::before,
.satyam-shop .shop-products p:only-child,
.satyam-shop .no-products {
  grid-column: 1 / -1;
  text-align: center;
  padding: 32px 16px;
  color: #666;
  font-size: 13px;
  background: #fff;
  border-radius: 8px;
  margin: 0;
}

/* PRODUCT CARD */
.satyam-shop .product-card {
  background: var(--satyam-bg-light);
  border-radius: 10px;
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: column;
  transition: transform var(--satyam-transition), box-shadow var(--satyam-transition);
  height: 100%;
  padding: 0;
}

.satyam-shop .product-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px var(--satyam-shadow-lg);
}

/* DISCOUNT BADGE */
.satyam-shop .badge {
  position: absolute;
  top: 10px;
  left: 10px;
  background: var(--satyam-bg-light);
  color: var(--satyam-danger);
  font-size: 11px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 18px;
  border: 1px solid var(--satyam-danger);
  z-index: 10;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  pointer-events: none;
}

/* PRODUCT IMAGE */
.satyam-shop .product-image {
  width: 100%;
  height: 260px;
  background: #f8f8f8;
  display: block;
  padding: 0;
  margin: 0;
  overflow: hidden;
  position: relative;
}

.satyam-shop .product-image a {
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
}

.satyam-shop .product-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  transition: transform var(--satyam-transition);
  display: block;
}

.satyam-shop .product-card:hover .product-image img {
  transform: scale(1.04);
}

/* WEIGHT VARIANTS */
.satyam-shop .weight-variants {
  font-size: 11px;
  color: #601050;
  padding: 8px 12px 4px;
  font-weight: 500;
  line-height: 1.3;
}

/* PRODUCT TITLE */
.satyam-shop .product-title {
  font-size: 13px;
  font-weight: 500;
  margin: 0;
  padding: 0 12px 6px;
  color: #601050;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 36px;
}

.satyam-shop .product-title a {
  text-decoration: none;
  color: inherit;
  transition: color 0.2s ease;
}

.satyam-shop .product-title a:hover {
  color: var(--satyam-danger);
}

/* PRICE DISPLAY */
.satyam-shop .price {
  padding: 0 12px 12px;
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: auto;
}

.satyam-shop .price .old {
  text-decoration: line-through;
  color: var(--satyam-text-light);
  font-size: 12px;
  font-weight: 400;
}

.satyam-shop .price .new {
  font-weight: 600;
  color: var(--satyam-text-dark);
  font-size: 14px;
}

/* SIDEBAR FILTERS */
.satyam-shop .satyam-sidebar {
  width: 220px;
  flex-shrink: 0;
  background: var(--satyam-bg-light);
  padding: 16px;
  border-radius: 8px;
  box-shadow: 0 2px 8px var(--satyam-shadow);
}

.satyam-shop .satyam-filter-block {
  border-bottom: 1px solid var(--satyam-border);
  padding: 10px 0;
}

.satyam-shop .satyam-filter-block:last-child {
  border-bottom: none;
}

.satyam-shop .satyam-filter-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.3px;
  cursor: pointer;
  color: #050A3A;
  padding: 3px 0;
  user-select: none;
}

.satyam-shop .satyam-filter-header span {
  transition: transform 0.2s ease;
  font-size: 9px;
  line-height: 1;
  color: #050A3A;
}

.satyam-shop .satyam-filter-block.active .satyam-filter-header span {
  transform: rotate(180deg);
}

.satyam-shop .satyam-filter-content {
  margin-top: 8px;
  display: none;
  flex-direction: column;
  gap: 6px;
  animation: slideDown 0.18s ease;
}

@keyframes slideDown {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}

.satyam-shop .satyam-filter-block.active .satyam-filter-content {
  display: flex;
}

.satyam-shop .satyam-filter-content label {
  font-size: 12px;
  color: #050A3A;
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  transition: color 0.15s ease;
}

.satyam-shop .satyam-filter-content label:hover {
  color: #601050;
}

.satyam-shop .satyam-filter-content input[type="checkbox"] {
  width: 14px;
  height: 14px;
  accent-color: #601050;
  cursor: pointer;
  margin: 0;
}

.satyam-shop .satyam-clear-btn {
  margin-top: 16px;
  width: 100%;
  padding: 8px 12px;
  font-size: 11px;
  font-weight: 500;
  border: 1px solid #c5c5c5;
  background: #f5f5f5;
  border-radius: 5px;
  cursor: pointer;
  color: #5a5a5a;
  transition: all 0.15s ease;
  text-align: center;
}

.satyam-shop .satyam-clear-btn:hover {
  background: #e8e8e8;
  border-color: #a0a0a0;
  color: #333;
}

.satyam-shop .satyam-clear-btn:active {
  transform: scale(0.99);
}

/* PRICE RANGE INPUTS */
.satyam-shop .price-range-inputs {
  display: flex;
  gap: 6px;
  align-items: center;
}

.satyam-shop .price-range-inputs input[type="number"] {
  width: 100%;
  padding: 6px 8px;
  border: 1px solid #ddd;
  border-radius: 4px;
  font-size: 12px;
  transition: border-color 0.15s ease;
  color: #050A3A;
}

.satyam-shop .price-range-inputs input[type="number"]::placeholder {
  color: #999;
}

.satyam-shop .price-range-inputs input[type="number"]:focus {
  outline: none;
  border-color: #601050;
}

/* FILTER LOADING */
.satyam-shop .filter-loading {
  z-index: 10;
  font-size: 12px;
  color: #666;
}

/* =========================
   PRODUCT CAROUSEL STYLES (NEW)
========================= */


/* =========================
   SWIPER OVERRIDES
========================= */
.satyam-carousel-wrapper .swiper {
  overflow: visible;
  padding: 10px 0;
}

.satyam-carousel-wrapper .swiper-slide {
  width: 280px;
  margin-left: 24px;
  height: auto;
}

/* First slide adjustment */
.satyam-carousel-wrapper .swiper-slide:first-child {
  margin-left: 0;
}

/* =========================
   CAROUSEL WRAPPER
========================= */
.satyam-carousel-wrapper {
  position: relative;
  padding: 0 50px;
  max-width: 100%;
}

/* =========================
   CAROUSEL CARD
========================= */
.satyam-carousel-card {
  background: var(--satyam-bg-light);
  border-radius: var(--satyam-radius-md);
  padding: 15px;
  position: relative;
  transition: all var(--satyam-transition);
  height: 380px;
  display: flex;
  flex-direction: column;
  box-shadow: 0 2px 8px var(--satyam-shadow);
  width: 100%;
  box-sizing: border-box;
}

.satyam-carousel-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 30px var(--satyam-shadow-lg);
}

/* =========================
   DISCOUNT BADGE
========================= */
.satyam-carousel-badge {
  position: absolute;
  top: 15px;
  left: 15px;
  background: var(--satyam-bg-light);
  color: var(--satyam-danger);
  border: 2px solid var(--satyam-danger);
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 700;
  z-index: 2;
  display: inline-block;
  white-space: nowrap;
}

/* =========================
   PRODUCT IMAGE
========================= */
.satyam-carousel-image {
  margin-bottom: 15px;
  overflow: hidden;
  border-radius: var(--satyam-radius-sm);
  background: #f8f8f8;
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
  flex-shrink: 0;
}

.satyam-carousel-image a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.satyam-carousel-image img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  transition: transform var(--satyam-transition);
  display: block;
  margin: auto;
}

.satyam-carousel-card:hover .satyam-carousel-image img {
  transform: scale(1.05);
}

/* =========================
   PRODUCT INFO
========================= */
.satyam-carousel-variants {
  font-size: 12px;
  color: var(--satyam-text-muted);
  margin-bottom: 8px;
  font-weight: 500;
}

.satyam-carousel-title {
  font-size: 16px;
  font-weight: 600;
  margin: 0 0 10px 0;
  line-height: 1.3;
  color: var(--satyam-primary);
}

.satyam-carousel-title a {
  color: inherit;
  text-decoration: none;
  display: block;
  transition: opacity 0.2s ease;
}

.satyam-carousel-title a:hover {
  opacity: 0.8;
}

/* =========================
   PRICE
========================= */
.satyam-carousel-price {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 15px;
  font-weight: 600;
  margin-top: auto;
}

.satyam-carousel-price .old {
  color: var(--satyam-text-light);
  text-decoration: line-through;
  font-size: 14px;
}

.satyam-carousel-price .new {
  color: var(--satyam-text-dark);
  font-size: 18px;
}

/* =========================
   ADD TO CART BUTTON
========================= */
.satyam-carousel-add-to-cart {
  position: absolute;
  bottom: 15px;
  right: 15px;
  width: 48px;
  height: 48px;
  background: #FFA51F;
  border: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(255, 165, 31, 0.3);
  z-index: 2;
  padding: 0;
}

.satyam-carousel-add-to-cart:hover {
  background: #ff9800;
  transform: scale(1.1);
  box-shadow: 0 6px 16px rgba(255, 165, 31, 0.4);
}

.satyam-carousel-add-to-cart:active {
  transform: scale(0.95);
}

.satyam-carousel-add-to-cart svg,
.satyam-carousel-add-to-cart img {
  width: 20px;
  height: 20px;
  display: block;
}

.satyam-carousel-add-to-cart img {
  object-fit: contain;
}

/* =========================
   NAVIGATION ARROWS
========================= */
.satyam-carousel-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  background: var(--satyam-bg-light);
  border: 2px solid #ffb74d;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
  transition: all var(--satyam-transition);
  color: var(--satyam-primary);
}

.satyam-carousel-nav:hover {
  background: #ff9800;
  border-color: #ff9800;
  color: var(--satyam-bg-light);
}

.satyam-carousel-prev {
  left: 0;
}

.satyam-carousel-next {
  right: 0;
}

.satyam-carousel-nav svg {
  width: 20px;
  height: 20px;
}

/* =========================
   PAGINATION DOTS
========================= */
.satyam-carousel-dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 20px;
}

.satyam-carousel-dots .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  background: #e0e0e0;
  border-radius: 50%;
  opacity: 1;
  cursor: pointer;
  transition: all var(--satyam-transition);
}

.satyam-carousel-dots .swiper-pagination-bullet-active {
  background: #ff9800;
  width: 24px;
  border-radius: 5px;
}

/* =========================
   NO PRODUCTS MESSAGE
========================= */
.satyam-carousel-wrapper .no-products {
  text-align: center;
  padding: 40px;
  color: var(--satyam-text-muted);
  font-size: 16px;
  background: var(--satyam-bg-light);
  border-radius: var(--satyam-radius-md);
}

/* =========================
   RESPONSIVE ADJUSTMENTS
========================= */
@media (max-width: 1024px) {
  .satyam-carousel-wrapper {
    padding: 0 35px;
  }
  
  .satyam-carousel-nav {
    width: 32px;
    height: 32px;
  }
  
  .satyam-carousel-nav svg {
    width: 18px;
    height: 18px;
  }
}

@media (max-width: 768px) {
  .satyam-carousel-wrapper {
    padding: 0 30px;
  }
  
  .satyam-carousel-card {
    height: auto;
    min-height: 350px;
  }
  
  .satyam-carousel-image {
    height: 180px;
  }
  
  .satyam-carousel-title {
    font-size: 14px;
  }
  
  .satyam-carousel-price .new {
    font-size: 16px;
  }
  
  .satyam-carousel-add-to-cart {
    width: 42px;
    height: 42px;
    bottom: 12px;
    right: 12px;
  }
  
  .satyam-carousel-add-to-cart svg,
  .satyam-carousel-add-to-cart img {
    width: 18px;
    height: 18px;
  }
}

@media (max-width: 480px) {
  .satyam-carousel-wrapper {
    padding: 0 25px;
  }
  
  .satyam-carousel-card {
    padding: 12px;
  }
  
  .satyam-carousel-badge {
    top: 10px;
    left: 10px;
    font-size: 10px;
    padding: 3px 8px;
  }
  
  .satyam-carousel-image {
    height: 160px;
  }
}
/* Carousel Add to Cart Button */
/* Carousel Add to Cart Button - Clean Version */
.satyam-carousel-add-to-cart {
    width: 48px;
    height: 48px;
    background: var(--satyam-accent); /* #FFA51F */
    color: var(--satyam-bg-light); /* #ffffff */
    border: none;
    border-radius: 50%; /* Keeps the circular button shape */
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all var(--satyam-transition);
    margin-top: auto;
    align-self: flex-end;
    flex-shrink: 0;
    padding: 0;
}

.satyam-carousel-add-to-cart:hover {
    background: var(--satyam-accent-hover); /* #ff9800 */
    transform: scale(1.1);
}

.satyam-carousel-add-to-cart:active {
    transform: scale(0.95);
}

.satyam-carousel-add-to-cart svg,
.satyam-carousel-add-to-cart img,
.satyam-carousel-add-to-cart i {
    width: 20px;
    height: 20px;
    display: block;
}

/* If using custom icon sizes */
.satyam-carousel-add-to-cart svg {
    stroke: currentColor; /* Ensures icon inherits button text color */
    fill: none; /* For outline-style icons */
}

/* Carousel Navigation */
.satyam-carousel-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  background: var(--satyam-bg-light);
  border: 2px solid var(--satyam-accent-light);
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
  transition: all var(--satyam-transition);
  color: var(--satyam-primary);
}

.satyam-carousel-nav:hover {
  background: var(--satyam-accent-hover);
  border-color: var(--satyam-accent-hover);
  color: var(--satyam-bg-light);
}

.satyam-carousel-prev { left: 0; }
.satyam-carousel-next { right: 0; }

.satyam-carousel-nav svg {
  width: 20px;
  height: 20px;
}

/* Carousel Dots/Pagination */
.satyam-carousel-dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 20px;
}

.satyam-carousel-dots .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  background: var(--satyam-border);
  border-radius: 50%;
  opacity: 1;
  cursor: pointer;
  transition: all var(--satyam-transition);
}

.satyam-carousel-dots .swiper-pagination-bullet-active {
  background: var(--satyam-accent-hover);
  width: 24px;
  border-radius: 5px;
}

/* Carousel No Products */
.satyam-carousel-wrapper .no-products {
  text-align: center;
  padding: 40px;
  color: var(--satyam-text-muted);
  font-size: 16px;
  background: var(--satyam-bg-light);
  border-radius: var(--satyam-radius-md);
}

/* =========================
   SHARED WIDGET STYLES
========================= */

/* Variation Selector */
.satyam-variation-selector { margin-bottom: 25px; }
.satyam-variation-options { display: flex; gap: 10px; flex-wrap: wrap; }

.satyam-variation-option {
  padding: 10px 28px;
  border: 2px solid var(--satyam-accent-light);
  border-radius: var(--satyam-radius-lg);
  background: var(--satyam-bg-light);
  color: var(--satyam-primary);
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  transition: all 0.25s ease;
  outline: none;
  min-width: 70px;
  text-align: center;
  line-height: 1.2;
}

.satyam-variation-option:hover {
  border-color: var(--satyam-accent-hover);
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(255, 152, 0, 0.15);
}

.satyam-variation-option.active {
  background: var(--satyam-accent-hover);
  color: var(--satyam-bg-light);
  border-color: var(--satyam-accent-hover);
  box-shadow: 0 3px 10px rgba(255, 152, 0, 0.3);
}

.satyam-variation-option:disabled {
  opacity: 0.3;
  cursor: not-allowed;
  transform: none;
}

/* Quantity Selector */
.satyam-quantity-selector {
  display: inline-flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 0;
}

.satyam-qty-btn {
  width: 50px;
  height: 50px;
  border: 2px solid var(--satyam-accent);
  background: var(--satyam-bg-light);
  color: var(--satyam-primary);
  font-size: 28px;
  font-weight: 300;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  outline: none;
  padding: 0;
  line-height: 1;
  border-radius: 50%;
}

.satyam-qty-btn:hover {
  background: #fff8e1;
  border-color: var(--satyam-accent-hover);
  transform: scale(1.05);
}

.satyam-qty-btn:active {
  background: #ffecb3;
  transform: scale(0.95);
}

.satyam-qty-number {
  width: 30px;
  height: 50px;
  border: none;
  text-align: center;
  font-size: 18px;
  font-weight: 600;
  color: var(--satyam-primary);
  background: transparent;
  outline: none;
  -moz-appearance: textfield;
  margin: 0;
  padding: 0;
  line-height: 50px;
}

.satyam-qty-number::-webkit-outer-spin-button,
.satyam-qty-number::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Buy Now Button */
.satyam-buy-now-btn {
  display: inline-block;
  padding: 16px 60px;
  background: var(--satyam-primary);
  color: var(--satyam-bg-light);
  border: none;
  border-radius: 35px;
  font-size: 15px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 3px;
  cursor: pointer;
  transition: all 0.3s ease;
  outline: none;
  box-shadow: 0 4px 15px rgba(106, 27, 154, 0.3);
  line-height: 1.4;
}

.satyam-buy-now-btn:hover {
  background: var(--satyam-primary-dark);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(106, 27, 154, 0.4);
}

.satyam-buy-now-btn:active {
  transform: translateY(0);
  box-shadow: 0 3px 10px rgba(106, 27, 154, 0.3);
}

.satyam-buy-now-btn.loading {
  opacity: 0.7;
  cursor: wait;
  pointer-events: none;
}

/* Price + Tax Widget */
.satyam-product-price-tax { margin-bottom: 25px; }
.satyam-price-wrapper { display: flex; align-items: baseline; gap: 10px; font-size: 18px; }
.satyam-price-from { font-size: 14px; color: var(--satyam-text-muted); font-weight: 400; margin-right: 5px; }
.satyam-regular-price del { color: var(--satyam-text-light); font-size: 16px; font-weight: 400; text-decoration: line-through; }
.satyam-sale-price { color: #1a237e; font-size: 24px; font-weight: 700; }
.satyam-single-price { color: #1a237e; font-size: 24px; font-weight: 700; }
.satyam-price-range { color: var(--satyam-text-muted); font-weight: 400; margin: 0 2px; }
.satyam-tax-notice { color: var(--satyam-text-muted); font-size: 12px; font-weight: 400; font-style: italic; margin-top: 5px; }

/* Sale Badge */
.satyam-sale-badge {
  display: inline-block;
  padding: 6px 16px;
  background: var(--satyam-bg-light);
  color: var(--satyam-danger);
  border: 2px solid var(--satyam-danger);
  border-radius: 20px;
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 15px;
}

.satyam-sale-badge.badge-square { border-radius: 4px; }
.satyam-sale-badge.badge-corner {
  position: absolute;
  top: 0;
  right: 0;
  border-radius: 0 4px 0 4px;
  transform: rotate(45deg) translate(25%, -50%);
  transform-origin: top right;
}

/* Product Reviews */
.satyam-product-reviews {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 15px;
}

.satyam-review-stars { display: flex; gap: 2px; }
.satyam-star-filled { color: #fbc02d; }
.satyam-star-half { color: #fbc02d; position: relative; }
.satyam-star-empty { color: var(--satyam-border); }

.satyam-average-rating {
  font-weight: 600;
  color: var(--satyam-text-dark);
  font-size: 14px;
}

.satyam-review-count {
  color: var(--satyam-text-muted);
  font-size: 13px;
}

.satyam-product-reviews.satyam-empty {
  color: var(--satyam-text-muted);
  font-style: italic;
  font-size: 13px;
}

/* Product Category */
.satyam-product-category {
  font-size: 13px;
  color: var(--satyam-primary);
  margin-bottom: 15px;
}

.satyam-product-category a {
  color: inherit;
  text-decoration: none;
}

.satyam-product-category a:hover {
  text-decoration: underline;
}

/* Image Gallery */
.satyam-product-gallery {
  display: flex;
  gap: 15px;
  align-items: flex-start;
}

.satyam-gallery-thumbs {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.satyam-gallery-thumb {
  width: 90px;
  height: 90px;
  border-radius: 12px;
  overflow: hidden;
  cursor: pointer;
  border: 2px solid transparent;
  transition: all 0.2s ease;
  opacity: 0.7;
}

.satyam-gallery-thumb.active,
.satyam-gallery-thumb:hover {
  border-color: var(--satyam-accent);
  opacity: 1;
}

.satyam-gallery-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.satyam-gallery-main {
  flex: 1;
}

.satyam-main-image-wrapper {
  border-radius: 12px;
  overflow: hidden;
  background: #f8f8f8;
}

.satyam-main-image-wrapper img {
  width: 100%;
  height: auto;
  display: block;
}

.satyam-product-gallery-empty {
  text-align: center;
  padding: 40px;
  color: var(--satyam-text-muted);
  background: var(--satyam-bg-light);
  border-radius: var(--satyam-radius-md);
}

/* =========================
   ANIMATIONS & UTILITIES
========================= */

/* Loading Spinner */
@keyframes spin {
  to { transform: rotate(360deg); }
}

.loading-spinner {
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 2px solid rgba(255,255,255,0.3);
  border-top-color: #fff;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

/* Notification Toast */
.satyam-notification {
  position: fixed;
  top: 20px;
  right: 20px;
  z-index: 9999;
  background: var(--satyam-bg-light);
  border-left: 4px solid #4caf50;
  padding: 14px 24px;
  border-radius: 8px;
  box-shadow: 0 4px 15px var(--satyam-shadow-lg);
  display: flex;
  align-items: center;
  gap: 12px;
  max-width: 400px;
  animation: slideInRight 0.3s ease;
}

.satyam-notification-error { border-left-color: var(--satyam-danger); }
.satyam-notification-success { border-left-color: #4caf50; }

.satyam-notification-close {
  background: none;
  border: none;
  font-size: 20px;
  cursor: pointer;
  color: #999;
  padding: 0;
  line-height: 1;
  margin-left: 10px;
}

.satyam-notification-close:hover { color: #333; }

@keyframes slideInRight {
  from { transform: translateX(100%); opacity: 0; }
  to { transform: translateX(0); opacity: 1; }
}

@keyframes shake {
  0%, 100% { transform: translateX(0); }
  20%, 60% { transform: translateX(-5px); }
  40%, 80% { transform: translateX(5px); }
}

.satyam-variation-selector.shake { animation: shake 0.5s ease; }

@keyframes pricePulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.05); }
  100% { transform: scale(1); }
}

.satyam-price-wrapper.price-updated { animation: pricePulse 0.3s ease; }

/* =========================
   RESPONSIVE BREAKPOINTS
========================= */

/* Tablet: Product Grid */
@media (max-width: 1024px) {
  .satyam-shop { padding: 18px; }
  .satyam-shop .shop-layout { flex-direction: column; gap: 20px; }
  .satyam-shop .satyam-sidebar { width: 100%; max-width: 100%; }
  .satyam-shop .shop-products { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  
  /* Carousel */
  .satyam-carousel-wrapper { padding: 0 35px; }
  .satyam-carousel-nav { width: 32px; height: 32px; }
  .satyam-carousel-nav svg { width: 18px; height: 18px; }
}

/* Mobile: Product Grid */
@media (max-width: 768px) {
  .satyam-shop { padding: 12px; }
  .satyam-shop .shop-products { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .satyam-shop .product-image { height: 180px; }
  .satyam-shop .product-title { font-size: 12px; min-height: 32px; padding: 0 10px 4px; }
  .satyam-shop .price { padding: 0 10px 10px; gap: 4px; }
  .satyam-shop .price .new { font-size: 13px; }
  .satyam-shop .price .old { font-size: 11px; }
  .satyam-shop .weight-variants { font-size: 10px; padding: 6px 10px 2px; }
  .satyam-shop .badge { font-size: 10px; padding: 2px 8px; }
  
  /* Carousel */
  .satyam-carousel-wrapper { padding: 0 30px; }
  .satyam-carousel-card { padding: 15px; }
  .satyam-carousel-title { font-size: 14px; }
  .satyam-carousel-price .new { font-size: 16px; }
  .satyam-carousel-add-to-cart { width: 42px; height: 42px; }
  .satyam-carousel-add-to-cart svg { width: 18px; height: 18px; }
  
  /* Shared Widgets */
  .satyam-variation-option { padding: 9px 24px; font-size: 13px; min-width: 65px; }
  .satyam-qty-btn { width: 45px; height: 45px; font-size: 24px; }
  .satyam-qty-number { width: 50px; height: 45px; font-size: 16px; line-height: 45px; }
  .satyam-buy-now-btn { width: 100%; padding: 16px 40px; text-align: center; }
  .satyam-product-gallery { flex-direction: column; }
  .satyam-gallery-thumbs { flex-direction: row; flex-wrap: wrap; justify-content: center; }
  .satyam-gallery-thumb { width: 70px; height: 70px; }
}

/* Small Mobile */
@media (max-width: 480px) {
  .satyam-shop .shop-products { grid-template-columns: 1fr; }
  .satyam-shop .product-image { height: 220px; }
  .satyam-shop .product-title { font-size: 13px; min-height: auto; }
  .satyam-shop .price .new { font-size: 14px; }
  .satyam-shop .badge { font-size: 9px; padding: 2px 6px; }
  .satyam-shop .satyam-filter-header { font-size: 13px; }
  .satyam-shop .satyam-filter-content label { font-size: 13px; }
  .satyam-shop .price-range-inputs { flex-direction: column; }
  .satyam-shop .price-range-inputs input[type="number"] { width: 100%; }
  
  /* Carousel */
  .satyam-carousel-wrapper { padding: 0 25px; }
  .satyam-carousel-card { padding: 12px; }
  .satyam-carousel-badge { top: 10px; left: 10px; font-size: 10px; padding: 3px 8px; }
  
  /* Shared Widgets */
  .satyam-variation-options { gap: 8px; }
  .satyam-variation-option { padding: 8px 20px; font-size: 12px; min-width: 60px; }
  .satyam-quantity-selector { margin: 0 auto; }
  .satyam-qty-btn { width: 42px; height: 42px; font-size: 22px; }
  .satyam-qty-number { width: 45px; height: 42px; font-size: 15px; line-height: 42px; }
}

/* =========================
   ACCESSIBILITY & UX
========================= */

/* Focus States */
.satyam-shop a:focus,
.satyam-shop button:focus,
.satyam-shop input:focus,
.satyam-carousel-wrapper a:focus,
.satyam-carousel-wrapper button:focus {
  outline: 2px solid var(--satyam-primary);
  outline-offset: 2px;
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
  .satyam-shop .product-card,
  .satyam-shop .product-image img,
  .satyam-shop .satyam-filter-header span,
  .satyam-shop .satyam-clear-btn,
  .satyam-carousel-card,
  .satyam-carousel-image img,
  .satyam-carousel-add-to-cart,
  .satyam-variation-option,
  .satyam-qty-btn,
  .satyam-buy-now-btn {
    transition: none !important;
    animation: none !important;
  }
}

/* High Contrast */
@media (prefers-contrast: high) {
  .satyam-shop .product-card,
  .satyam-carousel-card {
    border: 1px solid #000;
  }
  .satyam-shop .badge,
  .satyam-carousel-badge {
    border: 2px solid var(--satyam-danger);
  }
}

/* Print Styles */
@media print {
  .satyam-shop .satyam-sidebar,
  .satyam-shop .badge,
  .satyam-carousel-wrapper .satyam-carousel-nav,
  .satyam-carousel-wrapper .satyam-carousel-dots {
    display: none;
  }
  .satyam-shop .shop-products,
  .satyam-carousel-wrapper .swiper-wrapper {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px;
  }
  .satyam-shop .product-card,
  .satyam-carousel-card {
    break-inside: avoid;
    box-shadow: none;
    border: 1px solid var(--satyam-border);
  }
}





/* ======================================================================
   SATYAM MINIMAL PRODUCT GRID - UNIQUE CLASSES (NO CONFLICTS)
====================================================================== */

/* Grid Wrapper */
.satyam-minimal-grid-wrapper {
padding: 24px;
background: #ffffff;
}

.satyam-minimal-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 20px;
}

/* Responsive Grid */
@media (max-width: 1024px) {
.satyam-minimal-grid {
grid-template-columns: repeat(3, 1fr);
}
}

@media (max-width: 768px) {
.satyam-minimal-grid {
grid-template-columns: repeat(2, 1fr);
gap: 15px;
}
.satyam-minimal-grid-wrapper {
padding: 15px;
}
}

@media (max-width: 480px) {
.satyam-minimal-grid {
grid-template-columns: repeat(2, 1fr);
gap: 12px;
}
}

/* Product Card */
.satyam-minimal-card {
background: #FFF5E6;
border-radius: 16px;
position: relative;
overflow: hidden;
transition: transform 0.3s ease, box-shadow 0.3s ease;
display: flex;
flex-direction: column;
height: 100%;
}

.satyam-minimal-card:hover {
transform: translateY(-5px);
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

/* Image Wrapper */
.satyam-minimal-image-wrapper {
position: relative;
width: 100%;
aspect-ratio: 3/4;
overflow: hidden;
background: #f8f8f8;
}

.satyam-minimal-product-image {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
transition: transform 0.3s ease;
}

.satyam-minimal-card:hover .satyam-minimal-product-image {
transform: scale(1.05);
}

.satyam-minimal-image-wrapper a {
display: block;
width: 100%;
height: 100%;
}

/* Variation Square */
.satyam-minimal-variation-square {
position: absolute;
bottom: 15px;
left: 15px;
width: 40px;
height: 40px;
background: rgba(255, 255, 255, 0.9);
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: all 0.2s ease;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.satyam-minimal-variation-square:hover {
background: #ffffff;
transform: scale(1.1);
}

.satyam-minimal-variant-icon {
font-size: 20px;
color: #601050;
line-height: 1;
}

/* Product Info */
.satyam-minimal-info {
padding: 15px;
flex: 1;
display: flex;
flex-direction: column;
}

.satyam-minimal-title {
font-size: 14px;
font-weight: 600;
margin: 0 0 5px 0;
line-height: 1.3;
color: #601050;
}

.satyam-minimal-title a {
color: inherit;
text-decoration: none;
transition: opacity 0.2s ease;
}

.satyam-minimal-title a:hover {
opacity: 0.8;
}

.satyam-minimal-variants {
font-size: 11px;
color: #757575;
margin-bottom: 8px;
font-weight: 500;
}

.satyam-minimal-price-row {
display: flex;
align-items: center;
gap: 8px;
margin-top: auto;
}

.satyam-minimal-price-new {
font-weight: 700;
font-size: 16px;
color: #333333;
}

.satyam-minimal-price-old {
text-decoration: line-through;
color: #9e9e9e;
font-size: 13px;
font-weight: 400;
}

/* Add to Cart Button */
.satyam-minimal-add-cart {
position: absolute;
bottom: 15px;
right: 15px;
width: 48px;
height: 48px;
background: #FFA51F;
border: none;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: all 0.3s ease;
box-shadow: 0 4px 12px rgba(255, 165, 31, 0.3);
z-index: 2;
}

.satyam-minimal-add-cart:hover {
background: #ff9800;
transform: scale(1.1) rotate(-5deg);
box-shadow: 0 6px 16px rgba(255, 165, 31, 0.4);
}

.satyam-minimal-add-cart:active {
transform: scale(0.95);
}

.satyam-minimal-add-cart svg {
width: 20px;
height: 20px;
color: #ffffff;
stroke: currentColor;
}

/* No Products Message */
.satyam-minimal-no-products {
text-align: center;
padding: 40px;
color: #757575;
font-size: 16px;
grid-column: 1 / -1;
}

/* Tablet Adjustments */
@media (max-width: 768px) {
.satyam-minimal-image-wrapper {
aspect-ratio: 1;
}

.satyam-minimal-title {
font-size: 13px;
}

.satyam-minimal-price-new {
font-size: 15px;
}

.satyam-minimal-add-cart {
width: 42px;
height: 42px;
bottom: 12px;
right: 12px;
}

.satyam-minimal-add-cart svg {
width: 18px;
height: 18px;
}

.satyam-minimal-variation-square {
width: 35px;
height: 35px;
bottom: 12px;
left: 12px;
}
}

/* Mobile Adjustments */
@media (max-width: 480px) {
.satyam-minimal-info {
padding: 12px;
}

.satyam-minimal-title {
font-size: 12px;
}

.satyam-minimal-variants {
font-size: 10px;
}

.satyam-minimal-price-new {
font-size: 14px;
}

.satyam-minimal-price-old {
font-size: 12px;
}
}