.fwd-cart {
position: relative;
display: inline-flex;
align-items: center;
}

.fwd-add-btn {


}

.fwd-qty {
    gap: 0;
display: flex;
align-items: center;
/*  border: 1px solid #ddd;*/
/*  border-radius: 6px;*/
overflow: hidden;
}

.fwd-cart .fwd-qty button {
background-color: #fff;
border:  1px solid var( --e-global-color-primary );
cursor: pointer;
font-size: 24px;
color:var( --e-global-color-primary );
padding: 10px;
height: 60px;
width: 40px;
box-sizing:border-box;
}

.fwd-qty .fwd-minus {
border-radius: 5px 0 0 5px;
}


.fwd-qty .fwd-plus {
border-radius: 0 5px 5px 0;
}
.fwd-cart .fwd-qty button:hover {
background-color: var(--e-global-color-primary);
color: #fff;
}

.fwd-cart .fwd-qty button:active {

}

/* INPUT */

.fwd-qty .fwd-count {

text-align: center;
border:  1px solid var( --e-global-color-primary );

color: var( --e-global-color-919fb51 );
background-color: var( --e-global-color-primary )!important;

border-left: none;
border-right: none;
font-weight: bold;
outline: none;
padding: 10px;
height: 60px;
width: 60px;
box-sizing:border-box;
}

.fwd-qty .fwd-count:focus {
color: #F5F5F1;
}

/* hide arrows */
.fwd-count::-webkit-outer-spin-button,
.fwd-count::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
.fwd-count {
-moz-appearance: textfield;
}

/* popup stack */
.fwd-popup-stack {
position: absolute;
top: 50%;
left: 100%;
transform: translateY(-50%);
margin-left: 8px;
z-index: 999;
}

.fwd-popup {
  background: var(--e-global-color-primary);
  color: #fff;
  font-size: 12px;
  padding: 6px 10px;
  border-radius: 20px;
  white-space: nowrap;
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
}

/* fly */
.fwd-fly-img {
object-fit: cover;
pointer-events: none;
}


.fwd-cart.out-of-stock {
/*  padding: 10px 14px;
  border: 1px solid #ccc;*/
  color: #999;
/*  border-radius: 5px;
  font-size: 14px;*/
}




/* bounce */
.fwd-cart-bounce {
animation: fwdBounce 0.35s ease;
}

@keyframes fwdBounce {
0% { transform: scale(1); }
40% { transform: scale(1.3); }
70% { transform: scale(0.95); }
100% { transform: scale(1); }
}


.fwd-cart .fwd-read-more {
  display: inline-block;
  padding: 10px 14px;
  border: 1px solid var(--e-global-color-primary);
  color: #fff;
  text-decoration: none;
  border-radius: 5px;
  height: 60px;
  line-height: 40px;
  background: var(--e-global-color-primary);
  box-sizing: border-box;
}

.fwd-cart .fwd-read-more:hover {
  background: #fff;

    color: var(--e-global-color-primary);
}


/*.elementor-loop-container.elementor-grid  .e-loop-item  .fwd-cart.out-of-stock {
    display:none!important;
}*/

/*hide instock label in loop grid*/
.stock-status-box:has(.in-stock) {
  display: none !important;
}


/* disabled class */
.fwd-cart  .fwd-qty .btn-disable {
  opacity: 0.4;
  cursor: not-allowed;
  pointer-events: auto;
}

/* tooltip */
.fwd-max-tooltip {
  background: var(--e-global-color-primary);
  color: #fff;
  font-size: 11px;
  padding: 4px 8px;
  border-radius: 4px;
  white-space: nowrap;
  pointer-events: none;
  z-index: 999;
}



/* =========================
   🔥 VARIATION UI (NEW)
========================= */

.fwd-variations {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 10px;
}

.fwd-variations select {
  width: 100%;
  height: 50px;
  padding: 8px 12px;
  border: 1px solid var(--e-global-color-primary);
  border-radius: 5px;
  font-size: 14px;
  outline: none;
  background-color: #fff;
  color: var(--e-global-color-919fb51);
  cursor: pointer;
  box-sizing: border-box;
}

/* hover */
.fwd-variations select:hover {
  border-color: var(--e-global-color-primary);
}

/* focus */
.fwd-variations select:focus {
  box-shadow: 0 0 0 1px var(--e-global-color-primary);
}

/* disabled state (future use if needed) */
.fwd-variations select:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* spacing when qty appears */
.fwd-variations + .fwd-cart {
  margin-top: 10px;
}




/* =========================
   🔥 VARIATION BUTTON UI
========================= */

.fwd-attr-group {
  margin-bottom: 12px;
}

.fwd-label {
  font-size: 13px;
  margin-bottom: 6px;
  color: #666;
}

.fwd-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.fwd-option {
  padding: 8px 14px;
  border: 1px solid var(--e-global-color-primary);
  border-radius: 6px;
  cursor: pointer;
  font-size: 13px;
  transition: 0.2s;
  user-select: none;
}

/* hover */
.fwd-option:hover {
  background: var(--e-global-color-primary);
  color: #fff;
}

/* selected */
.fwd-option.active {
  background: var(--e-global-color-primary);
  color: #fff;
  border-color: var(--e-global-color-primary);
}

/* disabled future */
.fwd-option.disabled {
  opacity: 0.4;
  cursor: not-allowed;
  pointer-events: none;
}
