/*
 * Woodmart Sample Orders Plugin Stylesheet v4.1
 */

/* Create a flexbox container for both buttons on variable products */
.woocommerce-variation-add-to-cart {
    display: flex;
    gap: 10px;
    /* Adds a nice space between the buttons */
}

/* Make both the original cart form and our sample form flexible */
.woocommerce-variation-add-to-cart .cart,
.woocommerce-variation-add-to-cart .wso-sample-form {
    flex: 1;
    /* This makes them share the space equally */
}

/* --- Styles for Simple Products --- */

/* We need a container for simple products too */
.product-type-simple .summary form.cart,
.product-type-simple .summary form.wso-sample-form {
    display: inline-block;
    vertical-align: top;
    width: calc(50% - 5px);
    /* 50% width minus half the gap */
}

.product-type-simple .summary form.cart {
    margin-right: 10px;
}

/* General styling for our sample button */
.wso-sample-button {
    width: 100%;
    /* The button itself should be 100% of its form container */
    background-color: #f9f9f9 !important;
    color: #333 !important;
    border: 1px solid #ddd;
}

.wso-sample-button:hover {
    background-color: #efefef !important;
    color: #000 !important;
}