/* This file will contain the override styles specific to the "Add to Cart" buttons on the index.html */

/* Limits the width for the "view cart" button  */
paypal-cart-button[data-id="pp-view-cart"],
paypal-cart-button.viewCartButtonContainer {
    width: auto !important;
    max-width: max-content !important;
    display: inline-flex !important;
    justify-content: center !important;
    align-self: center !important;
}

/* Changes the size and bold settings for the "Single Membership" and "Family Membership" 
   titles as well as their corresponding prices to look more like other similar text.*/
h3 {
    font-size: inherit;
    font-weight: bolder;
}

h3 #price-text {
    font-size: inherit;
    font-weight:bold;
}


/************************************************/
/* Single Membership only form style overrides  */
/************************************************/

/* Lets the "Single Membership" content expand to the entire width of the table cell */
#paypal-form-fields-container-7U6PAV852XC6U,
.css-178qcrb {
    max-width: 100% !important;
    width: 100% !important;
}

/* Puts the "Single Membership" text and price on the same line */
#paypal-form-fields-container-7U6PAV852XC6U .item-header,
#paypal-form-fields-container-7U6PAV852XC6U .item-header .item-title,
#paypal-form-fields-container-7U6PAV852XC6U .item-header .price-container {
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap !important;
}

/* Resizes the view of the text area for the "Single Membership" form to be height of a text field.*/
#paypal-form-fields-container-7U6PAV852XC6U textarea {
    min-height: 3rem !important;
    height: 3rem !important;
    max-height: 3rem !important;
    line-height: 1.5rem !important;
    overflow: auto !important; 
}

/* Part 1 of 3 - Make "Enter your Call Sign" and textarea be on same line*/
#paypal-form-fields-container-7U6PAV852XC6U textarea {
    display: inline-block !important;
    vertical-align: middle !important;  
    max-width: 70% !important;        
}

/* Part 2 of 3 - Make "Enter your Call Sign" and textarea be on same line*/
#paypal-form-fields-container-7U6PAV852XC6U .input-label {
    display: inline-block !important;
    max-width: 30% !important;
    vertical-align: middle !important;
    margin-right: 1rem !important;    
}

/* Part 3 of 3 - Make "Enter your Call Sign" and textarea be on same line*/
/*NOTE: This is added to ensure responsive behavior, but this may not be needed due to Bootstrap.*/
@media(max-width: 768px) {
    #paypal-form-fields-container-7U6PAV852XC6U .input-label,
    #paypal-form-fields-container-7U6PAV852XC6U textarea {
        display: block !important;
        max-width: 100% !important;
        width: 100% !important;
        margin-right: 0 !important;
    }
}


/* Resizes the "Add to Cart" button for the "Single Membership" form.*/
#add-to-cart-btn_7U6PAV852XC6U {
    width: fit-content !important;
    min-width: 150px !important;
    max-width: 300px !important;
}

/************************************************/
/* Family Membership only form style overrides  */
/************************************************/

/* Lets the "Family Membership" content expand to the entire width of the table cell */
#paypal-form-fields-container-6CYJ8AXZW5ACC,
.css-178qcrb {
    max-width: 100% !important;
    width: 100% !important;
}

/* Puts the "Family Membership" text and price on the same line */
#paypal-form-fields-container-6CYJ8AXZW5ACC .item-header,
#paypal-form-fields-container-6CYJ8AXZW5ACC .item-header .item-title,
#paypal-form-fields-container-6CYJ8AXZW5ACC .item-header .price-container {
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap !important;
}


/* Resizes the view of the text area for the "Family Membership" form to be height of a text field.*/
#paypal-form-fields-container-6CYJ8AXZW5ACC textarea {
    min-height: 3rem !important;
    height: 3rem !important;
    max-height: 3rem !important;
    line-height: 1.5rem !important;
    overflow: auto !important;
}

/* Part 1 of 5 - Make "Quantity" and select be on same line*/
#paypal-form-fields-container-6CYJ8AXZW5ACC .input-label[for="quantity"] {
    display: inline-block !important;
    max-width: 30% !important;
    vertical-align: top !important;
    margin-right: 1rem !important;
    line-height: 3rem !important;
}

/* Part 2 of 5 - Make "Quantity" and select be on same line*/
#paypal-form-fields-container-6CYJ8AXZW5ACC .selectContainer {
    display: inline-block !important;
    width: calc(70% - 1rem) !important;
    vertical-align: top !important;
}

/* Part 3 of 5 - Make "Quantity" and select be on same line*/
#paypal-form-fields-container-6CYJ8AXZW5ACC .selectContainer  select{
    width: 100% !important;
    min-height: 3rem !important;
    height: 3rem !important;
    max-height: 3rem !important;
    line-height: 1.5rem !important;
    overflow: auto !important;
    display: inline-block !important;
}

/* Part 4 of 5 - Make "Quantity" and select be on same line*/
/* Preseves the down arrow positioning*/
#paypal-form-fields-container-6CYJ8AXZW5ACC .selectContainer::after {
    top: 1.25rem !important; /* Adjusted to align with the new height */
    right: 1rem !important;
}


/* Part 5 of 5 - Make "Quantity" and select be on same line*/
/*NOTE: This is added to ensure responsive behavior, but this may not be needed due to Bootstrap.*/
@media(max-width: 768px) {
    #paypal-form-fields-container-6CYJ8AXZW5ACC .input-label,
    #paypal-form-fields-container-6CYJ8AXZW5ACC textarea {
        display: block !important;
        max-width: 100% !important;
        width: 100% !important;
        margin-right: 0 !important;
    }
}


/* Part 1 of 3 - Make "Enter Regular Membership Call Sign AND Enter Family Member Call Sign" and textarea be on same line*/
#paypal-form-fields-container-6CYJ8AXZW5ACC textarea {
    display: inline-block !important;
    vertical-align: middle !important;  
    max-width: 70% !important;        
}

/* Part 2 of 3 - Make "Enter Regular Membership Call Sign AND Enter Family Member Call Sign" and textarea be on same line*/
#paypal-form-fields-container-6CYJ8AXZW5ACC .input-label[for="memo"] {
    display: inline-block !important;
    max-width: 30% !important;
    vertical-align: middle !important;
    margin-right: 1rem !important;    
}

/* Part 3 of 3 - Make "Enter Regular Membership Call Sign AND Enter Family Member Call Sign" and textarea be on same line*/
/*NOTE: This is added to ensure responsive behavior, but this may not be needed due to Bootstrap.*/
@media(max-width: 768px) {
    #paypal-form-fields-container-6CYJ8AXZW5ACC .input-label,
    #paypal-form-fields-container-6CYJ8AXZW5ACC textarea {
        display: block !important;
        max-width: 100% !important;
        width: 100% !important;
        margin-right: 0 !important;
    }
}


/* Resizes the "Add to Cart" button for the "Family Membership" form.*/
#add-to-cart-btn_6CYJ8AXZW5ACC {
    width: fit-content !important;
    min-width: 150px !important;
    max-width: 300px !important;
}