.rkfvs-product {
    position: relative;
    overflow: visible;
}

.rkfvs-product__cart-wrap {
    position:       absolute;
    bottom:         0;
    right:          0;
    padding:        0 6px 6px;
    opacity:        0;
    transform:      translateY(4px);
    transition:     opacity .16s ease, transform .16s ease;
    pointer-events: none;
    z-index:        3;
}

.rkfvs-product:hover .rkfvs-product__cart-wrap,
.rkfvs-product:focus-within .rkfvs-product__cart-wrap {
    width: auto;
    bottom: 11px;
    opacity:        1;
    transform:      translateY(0);
    pointer-events: auto;
}

@media (max-width: 767px) {
    .rkfvs-product__cart-wrap {
        width: auto;
        position:   relative;
        opacity:    1;
        transform:  none;
        pointer-events: auto;
        padding:    0 0 4px;
    }
}

.rkfvs-product__cart-btn {
    display:         flex;
    align-items:     center;
    justify-content: center;
    gap:             4px;
    width:           100%;
    padding:         5px 6px;
    border:          none;
    border-radius:   var(--rkfvs-radius-sm);
    background:      var(--rkfvs-primary);
    color:           #fff;
    font-size:       .68rem;
    font-weight:     600;
    line-height:     1.2;
    cursor:          pointer;
    white-space:     nowrap;
    overflow:        hidden;
    text-overflow:   ellipsis;
    transition:      background var(--rkfvs-transition), box-shadow var(--rkfvs-transition), transform var(--rkfvs-transition);
}

.rkfvs-product__cart-btn:hover:not(:disabled) {
    background: var(--rkfvs-accent);
    box-shadow: 0 2px 6px rgba(0,0,0,.12);
    transform:  translateY(-1px);
}

.rkfvs-product__cart-btn:active:not(:disabled) {
    transform:  translateY(0);
    box-shadow: none;
}

.rkfvs-cart-icon {
    font-size:   13px;
    line-height: 1;
    flex-shrink: 0;
}

.rkfvs-product__cart-btn:disabled {
    background:     #c0c0c0;
    cursor:         not-allowed;
    transform:      none !important;
    box-shadow:     none !important;
}

.rkfvs-product__cart-btn--loading .rkfvs-cart-icon {
    animation: rkfvs-cart-spin .5s linear infinite;
}

.rkfvs-product__cart-btn--success {
    background:     #28a745 !important;
    pointer-events: none;
}

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

.rkfvs-cart-chevron {
    font-size:   11px;
    margin-left: 1px;
    opacity:     .8;
    flex-shrink: 0;
}

.rkfvs-combos-backdrop {
    display:    none;
    position:   fixed;
    inset:      0;
    background: rgba(0,0,0,.5);
    z-index:    calc(var(--rkfvs-overlay-z) + 10);
}

.rkfvs-combos-backdrop--open {
    display: block;
    animation: rkfvs-fade-in .15s ease;
}

.rkfvs-combos-modal {
    display:        none;
    position:       fixed;
    z-index:        calc(var(--rkfvs-overlay-z) + 11);
    background:     var(--rkfvs-bg);
    color:          var(--rkfvs-text);
    border-radius:  var(--rkfvs-radius);
    box-shadow:     0 12px 28px rgba(0,0,0,.2), 0 2px 4px rgba(0,0,0,.08);
    width:          320px!important;
    max-width:      calc(100vw - 24px);
    flex-direction: column;
    max-height:     35vh;
    overflow:       hidden;
}

.rkfvs-combos-modal--open {
    display:   flex;
    animation: rkfvs-slide-up-in .2s cubic-bezier(.22,.61,.36,1);
}

.rkfvs-combos-modal__header {
    display:       flex;
    align-items:   center;
    gap:           8px;
    padding:       6px 10px;
    border-bottom: 1px solid var(--rkfvs-border);
    flex-shrink:   0;
}

.rkfvs-combos-modal__thumb {
    width:         32px;
    height:        32px;
    border-radius: var(--rkfvs-radius-sm);
    object-fit:    cover;
    flex-shrink:   0;
    border:        1px solid var(--rkfvs-border);
    background:    #f5f5f5;
}

.rkfvs-combos-modal__title {
    flex:        1;
    min-width:   0;
    font-size:   .75rem;
    font-weight: 700;
    line-height: 1.3;
    overflow:    hidden;
    text-overflow: ellipsis;
    display:     -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.rkfvs-combos-modal__close {
    display:         flex;
    align-items:     center;
    justify-content: center;
    width:           24px;
    height:          24px;
    border:          none;
    background:      none;
    cursor:          pointer;
    border-radius:   var(--rkfvs-radius-sm);
    color:           var(--rkfvs-text-muted);
    font-size:       16px;
    line-height:     1;
    flex-shrink:     0;
    transition:      background var(--rkfvs-transition), color var(--rkfvs-transition);
}

.rkfvs-combos-modal__close:hover {
    background: var(--rkfvs-border);
    color:      var(--rkfvs-text);
}

.rkfvs-combos-modal__body {
    overflow-y:  auto;
    padding:     4px 6px;
    flex:        1;
    scrollbar-width: thin;
    scrollbar-color: var(--rkfvs-border) transparent;
    max-height: calc(55vh - 80px);
}

.rkfvs-combos-modal__body::-webkit-scrollbar {
    width: 3px;
}

.rkfvs-combos-modal__body::-webkit-scrollbar-track {
    background: transparent;
}

.rkfvs-combos-modal__body::-webkit-scrollbar-thumb {
    background: var(--rkfvs-border);
    border-radius: 2px;
}

.rkfvs-combos-loading {
    display:         flex;
    align-items:     center;
    justify-content: center;
    padding:         16px 10px;
    gap:             6px;
    color:           var(--rkfvs-text-muted);
    font-size:       .75rem;
}

.rkfvs-combos-spinner {
    width:         16px;
    height:        16px;
    border:        2px solid var(--rkfvs-border);
    border-top-color: var(--rkfvs-accent);
    border-radius: 50%;
    animation:     rkfvs-spin .55s linear infinite;
    flex-shrink:   0;
}

.rkfvs-combo-row {
    display:       flex;
    align-items:   center;
    gap:           6px;
    padding:       5px 4px;
}

.rkfvs-combo-row + .rkfvs-combo-row {
    border-top: 1px solid var(--rkfvs-border);
}

.rkfvs-combo-row:hover {
    background: rgba(0,0,0,.02);
    border-radius: var(--rkfvs-radius-sm);
}

.rkfvs-combo-row__img {
    width:         28px;
    height:        28px;
    border-radius: var(--rkfvs-radius-sm);
    object-fit:    cover;
    border:        1px solid var(--rkfvs-border);
    flex-shrink:   0;
    background:    #f5f5f5;
}

.rkfvs-combo-row__img--empty {
    display:         flex;
    align-items:     center;
    justify-content: center;
    font-size:       12px;
    color:           var(--rkfvs-text-muted);
}

.rkfvs-combo-row__info {
    flex:    1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap:     1px;
}

.rkfvs-combo-row__label {
    font-size:     .7rem;
    font-weight:   600;
    white-space:   nowrap;
    overflow:      hidden;
    text-overflow: ellipsis;
    line-height:   1.3;
}

.rkfvs-combo-row__price {
    font-size:   .68rem;
    font-weight: 700;
    color:       var(--rkfvs-primary);
}

.rkfvs-combo-row__ref {
    font-size: .58rem;
    color:     var(--rkfvs-text-muted);
    line-height: 1.2;
}

.rkfvs-combo-row__stock {
    font-size:      .56rem;
    font-weight:    700;
    text-transform: uppercase;
    letter-spacing: .04em;
    line-height:    1.2;
}

.rkfvs-combo-row__stock--in  { color: #28a745; }
.rkfvs-combo-row__stock--out { color: #dc3545; }

.rkfvs-combo-row__meta {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: .65rem;
    flex-wrap: wrap;
}

.rkfvs-combo-row__btn {
    display:         flex;
    align-items:     center;
    justify-content: center;
    gap:             2px;
    padding:         3px 6px;
    border:          none;
    border-radius:   var(--rkfvs-radius-sm);
    background:      var(--rkfvs-primary);
    color:           #fff;
    font-size:       .62rem;
    font-weight:     600;
    cursor:          pointer;
    flex-shrink:     0;
    white-space:     nowrap;
    min-width:       48px;
    transition:      background var(--rkfvs-transition), box-shadow var(--rkfvs-transition), transform var(--rkfvs-transition);
}

.rkfvs-combo-row__btn:hover:not(:disabled) {
    background: var(--rkfvs-accent);
    box-shadow: 0 2px 4px rgba(0,0,0,.1);
    transform:  translateY(-1px);
}

.rkfvs-combo-row__btn:active:not(:disabled) {
    transform:  translateY(0);
    box-shadow: none;
}

.rkfvs-combo-row__btn:disabled {
    background: #bbb;
    cursor:     not-allowed;
}

.rkfvs-combo-row__btn--loading .material-icons {
    animation: rkfvs-cart-spin .5s linear infinite;
}

.rkfvs-combo-row__btn--success {
    background: #28a745 !important;
    pointer-events: none;
}

.rkfvs-combo-row__btn .material-icons {
    font-size:   12px;
    line-height: 1;
}

.rkfvs-combos-modal__footer {
    padding:       5px 10px 6px;
    border-top:    1px solid var(--rkfvs-border);
    text-align:    center;
    flex-shrink:   0;
}

.rkfvs-combos-modal__product-link {
    font-size:   .65rem;
    color:       var(--rkfvs-text-muted);
    text-decoration: none;
    transition:  color var(--rkfvs-transition);
}

.rkfvs-combos-modal__product-link:hover {
    color:           var(--rkfvs-accent);
    text-decoration: underline;
}

.rkfvs-cart-toast {
    position:      fixed;
    bottom:        20px;
    right:         20px;
    z-index:       calc(var(--rkfvs-overlay-z) + 20);
    background:    #1a7a38;
    color:         #fff;
    padding:       6px 12px;
    border-radius: var(--rkfvs-radius);
    font-size:     .75rem;
    font-weight:   600;
    box-shadow:    0 3px 10px rgba(0,0,0,.2);
    display:       flex;
    align-items:   center;
    gap:           5px;
    opacity:       0;
    transform:     translateY(8px);
    transition:    opacity .2s ease, transform .2s ease;
    pointer-events: none;
    max-width:     260px;
}

.rkfvs-cart-toast--error {
    background: #b71c1c;
}

.rkfvs-cart-toast--visible {
    opacity:   1;
    transform: translateY(0);
}

.rkfvs-cart-toast .material-icons {
    font-size:  14px;
    flex-shrink: 0;
}

@media (prefers-reduced-motion: reduce) {
    .rkfvs-product__cart-wrap,
    .rkfvs-product__cart-btn,
    .rkfvs-combo-row__btn,
    .rkfvs-combos-modal,
    .rkfvs-cart-toast {
        animation:  none !important;
        transition: none !important;
        transform:  none !important;
    }
}

@media (max-width: 767px) {
    .rkfvs-combos-modal {
        width: calc(100vw - 20px);
        bottom: 10px;
        left: 10px;
        right: 10px;
        top: auto;
        position: fixed;
        max-height: 55vh;
        max-width: calc(100vw - 20px);
    }
    
    .rkfvs-combos-modal__body {
        max-height: calc(55vh - 70px);
    }
    
    .rkfvs-combo-row {
        flex-wrap: wrap;
        gap: 4px;
    }
    
    .rkfvs-combo-row__info {
        flex: 1 1 100%;
        order: 2;
    }
    
    .rkfvs-combo-row__btn {
        order: 3;
        margin-left: auto;
    }
    
    .rkfvs-cart-toast {
        right: 10px;
        left: 10px;
        bottom: 10px;
        max-width: unset;
        text-align: center;
        justify-content: center;
    }

    .rkfvs-product__cart-btn {
        min-height: 44px;
        padding: 10px 8px;
    }
    
    .rkfvs-product__cart-wrap {
        position: relative !important;
        margin-top: 6px;
        padding: 4px 0;
    }
    
    .rkfvs-product__cart-container {
        flex-direction: row !important;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
    }
    
    .rkfvs-product__cart-container .rkfvs-product__cart-btn {
        flex: 2;
        min-height: 44px;
    }
    
    .rkfvs-product__cart-container .rkfvs-quantity-control {
        flex: 1;
        min-height: 44px;
    }
    
    .rkfvs-quantity-btn {
        min-width: 36px !important;
        min-height: 36px !important;
    }
    
    .rkfvs-quantity-input {
        min-height: 36px !important;
    }
    
    .rkfvs-product__cart-btn .material-icons {
        font-size: 18px !important;
    }
}

@media (min-width: 768px) {
    .rkfvs-combos-modal {
        width: 320px!important;
        max-height: 35vh;
    }
    
    .rkfvs-combos-modal__body {
        max-height: calc(55vh - 70px);
    }
}

.rkfvs-product__stock--variants {
    background: rgba(0,0,0,.05);
    color: var(--rkfvs-text-muted);
    display: inline-flex;
    align-items: center;
    gap: 3px;
}

.rkfvs-quantity-control {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: #f5f5f5;
    border-radius: var(--rkfvs-radius-sm);
    padding: 2px;
}

.rkfvs-quantity-btn {
    width: 26px;
    height: 26px;
    border: none;
    background: #fff;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all var(--rkfvs-transition);
}

.rkfvs-quantity-btn:hover:not(:disabled) {
    background: var(--rkfvs-accent);
    color: #fff;
}

.rkfvs-quantity-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.rkfvs-quantity-input {
    width: 45px;
    text-align: center;
    border: none;
    background: #fff;
    border-radius: 4px;
    padding: 4px 0;
    font-size: 0.8rem;
    font-weight: 600;
}

.rkfvs-quantity-input:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(255,0,0,0.2);
}

.rkfvs-combo-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
}

@media (max-width: 767px) {
    .rkfvs-combo-row {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .rkfvs-combo-actions {
        width: 100%;
        justify-content: space-between;
    }
    
    .rkfvs-quantity-control {
        flex: 1;
        justify-content: center;
    }
    
    .rkfvs-combo-row__btn {
        flex: 1;
    }
}

.rkfvs-product__cart-container {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.rkfvs-product__cart-container .rkfvs-product__cart-btn {
    width: 100%;
}

@media (max-width: 767px) {
    .rkfvs-product__cart-container {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
    
    .rkfvs-product__cart-container .rkfvs-product__cart-btn {
        flex: 2;
    }
    
    .rkfvs-product__cart-container .rkfvs-quantity-control {
        flex: 1;
    }
}

.rkfvs-product__cart-container .rkfvs-quantity-btn:hover:not(:disabled) {
    background: var(--rkfvs-accent);
    color: #fff;
    transform: scale(1.05);
}

.rkfvs-product__cart-container .rkfvs-quantity-btn:active:not(:disabled) {
    transform: scale(0.95);
}

.rkfvs-quantity-control {
    transition: all 0.2s ease;
}

.rkfvs-quantity-control:hover {
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}