/* =========================================
   Yavcode Add to Cart - Core Structure
   ========================================= */

.elementor-widget-yavcode-add-to-cart .yavcode-atc-wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 15px;
    width: 100%;
}

/* Ensure Form is flex to align children (qty, btn, extra) */
.elementor-widget-yavcode-add-to-cart form.cart {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin: 0;
    width: 100%;
    /* Form takes full width */
}

/* The holder inside the form (wrapping button + extra + qty usually) */
.elementor-widget-yavcode-add-to-cart .e-atc-qty-button-holder {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    /* Ensure it takes remaining space or appropriate width */
}

/* Base Quantity Input Style */
.elementor-widget-yavcode-add-to-cart .quantity {
    display: inline-block;
    margin: 0;
    vertical-align: middle;
}

/* HIDE QUANTITY IF DISABLED */
.elementor-widget-yavcode-add-to-cart.yavcode-hide-quantity .quantity {
    display: none !important;
}

.elementor-widget-yavcode-add-to-cart .quantity .qty {
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    width: 60px;
    text-align: center;
    font-size: 1rem;
    min-height: 40px;
    box-sizing: border-box;
    transition: all 0.3s ease;
}

.elementor-widget-yavcode-add-to-cart .quantity .qty::-webkit-inner-spin-button,
.elementor-widget-yavcode-add-to-cart .quantity .qty::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Icons and images */
.elementor-widget-yavcode-add-to-cart .elementor-button i,
.elementor-widget-yavcode-add-to-cart .elementor-button svg,
.elementor-widget-yavcode-add-to-cart .yavcode-extra-button i,
.elementor-widget-yavcode-add-to-cart .yavcode-extra-button svg {
    margin-right: 8px;
    fill: currentColor;
    width: 1em;
    height: 1em;
}

.rtl .elementor-widget-yavcode-add-to-cart .elementor-button i,
.rtl .elementor-widget-yavcode-add-to-cart .elementor-button svg,
.rtl .elementor-widget-yavcode-add-to-cart .yavcode-extra-button i,
.rtl .elementor-widget-yavcode-add-to-cart .yavcode-extra-button svg {
    margin-right: 0;
    margin-left: 8px;
}

/* =========================================
   UI Style Variants
   ========================================= */

.yavcode-ui-style-boxed .yavcode-atc-wrapper {
    box-sizing: border-box;
    padding: 20px;
    border: 1px solid #eee;
}

.yavcode-ui-style-minimal .quantity .qty {
    border: none;
    border-bottom: 2px solid #ddd;
    border-radius: 0;
    background: transparent;
}

.yavcode-ui-style-minimal .quantity .qty:focus {
    border-bottom-color: #333;
    outline: none;
}

/* =========================================
   Items Layout Structure
   ========================================= */

/* Use the Holder for structure since Extra Btn is now inside it */
.yavcode-items-layout-inline .e-atc-qty-button-holder {
    flex-direction: row;
}

/* STACKED */
.yavcode-items-layout-stacked .yavcode-atc-wrapper,
.yavcode-items-layout-stacked form.cart,
.yavcode-items-layout-stacked .e-atc-qty-button-holder {
    flex-direction: column;
    align-items: stretch;
}

.yavcode-items-layout-stacked .quantity,
.yavcode-items-layout-stacked .elementor-button,
.yavcode-items-layout-stacked .yavcode-extra-button {
    width: 100%;
    margin: 5px 0;
    text-align: center;
    justify-content: center;
}

/* SPLIT: Qty left, Buttons Right */
.yavcode-items-layout-split .e-atc-qty-button-holder {
    justify-content: space-between;
    width: 100%;
}

/* =========================================
   Button Skins
   ========================================= */

.elementor-widget-yavcode-add-to-cart .elementor-button,
.elementor-widget-yavcode-add-to-cart .yavcode-extra-button {
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    cursor: pointer;
    min-height: 40px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

/* Modern */
.yavcode-btn-skin-modern .elementor-button,
.yavcode-btn-skin-modern .yavcode-extra-button {
    border-radius: 50px;
    padding-left: 30px;
    padding-right: 30px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.yavcode-btn-skin-modern .elementor-button:hover,
.yavcode-btn-skin-modern .yavcode-extra-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 7px 14px rgba(0, 0, 0, 0.12);
}

/* Outline */
.yavcode-btn-skin-outline .elementor-button,
.yavcode-btn-skin-outline .yavcode-extra-button {
    background: transparent;
    border: 2px solid;
}

/* Soft */
.yavcode-btn-skin-soft .elementor-button,
.yavcode-btn-skin-soft .yavcode-extra-button {
    border: none;
    box-shadow: 0 10px 20px -5px rgba(0, 0, 0, 0.15);
}

.yavcode-btn-skin-soft .elementor-button:hover,
.yavcode-btn-skin-soft .yavcode-extra-button:hover {
    box-shadow: 0 15px 25px -5px rgba(0, 0, 0, 0.2);
    transform: translateY(-1px);
}

/* =========================================
   Price Style
   ========================================= */
.woocommerce-variation-price,
.single_variation_wrap .price {
    display: block;
    margin-bottom: 10px;
    /* Typography & Color controlled by settings */
}

/* =========================================
   Alignment Overrides
   ========================================= */

/* Left */
.elementor-align-left .yavcode-atc-wrapper,
.elementor-align-left .e-atc-qty-button-holder,
.elementor-align-left form.cart {
    justify-content: flex-start;
}

/* Center */
.elementor-align-center .yavcode-atc-wrapper,
.elementor-align-center .e-atc-qty-button-holder,
.elementor-align-center form.cart {
    justify-content: center;
}

/* Right */
.elementor-align-right .yavcode-atc-wrapper,
.elementor-align-right .e-atc-qty-button-holder,
.elementor-align-right form.cart {
    justify-content: flex-end;
}

/* Justify */
.elementor-align-justify .yavcode-atc-wrapper,
.elementor-align-justify .e-atc-qty-button-holder,
.elementor-align-justify form.cart {
    justify-content: space-between;
}