.elementor-998 .elementor-element.elementor-element-28610b20{--display:flex;}/* Start custom CSS for container, class: .elementor-element-28610b20 */.quantity .minus,
.woocommerce-js .quantity .plus {
width: 38px;
display: flex;
justify-content: center;
align-items: center;
background-color: transparent;
border: 1px solid var(--ast-border-color);
color: var(--ast-global-color-3);
outline: 0;
font-weight: 400;
z-index: 3;
padding-bottom: 5px;
font-size: 16px;
}

/* ✅ Default: side-by-side layout on desktop and tablet */
.woocommerce-cart table.cart td.actions .coupon,
.woocommerce table.cart td.actions .coupon,
.woocommerce-page table.cart td.actions .coupon {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
gap: 20px;
}

/* ✅ Input and Button width by default */
.woocommerce-cart table.cart td.actions .coupon .input-text,
.woocommerce table.cart td.actions .coupon .input-text,
.woocommerce-page table.cart td.actions .coupon .input-text,
.woocommerce-cart table.cart td.actions .coupon .button,
.woocommerce table.cart td.actions .coupon .button,
.woocommerce-page table.cart td.actions .coupon .button {
width: 48%;
}

/* ✅ Placeholder styling */
.woocommerce table.cart td.actions .coupon .input-text::placeholder {
text-align: center;
white-space: pre-line;
line-height: 1.2;
}

/* ✅ Style for the input field */
.woocommerce-cart table.cart td.actions .coupon .input-text,

.woocommerce table.cart td.actions .coupon .input-text,
.woocommerce-page table.cart td.actions .coupon .input-text {
font-size: 14px;
font-weight: 600;
text-align: center;
padding: 0 10px;
min-height: 48px;
height: 48px;
line-height: 48px;
box-sizing: border-box;
white-space: normal;
text-transform: uppercase;
letter-spacing: 1px;
border-radius: 0px;
font-family: inherit;
}

/* ✅ Style for the Apply Coupon button */
.woocommerce table.cart td.actions .coupon .button {
min-height: 48px;
padding: 0 16px;
font-size: 14px;
font-weight: 600;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
}

/* ✅ Tablet narrow view (545px–600px): side-by-side and centered */
@media (min-width: 545px) and (max-width: 600px) {
.woocommerce-cart table.cart td.actions .coupon,
.woocommerce table.cart td.actions .coupon,
.woocommerce-page table.cart td.actions .coupon {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
gap: 10px;
flex-wrap: wrap;
}

.woocommerce-cart table.cart td.actions .coupon .input-text,
.woocommerce table.cart td.actions .coupon .input-text,
.woocommerce-page table.cart td.actions .coupon .input-text {
flex: 1 1 60%;
min-width: 150px;
}

.woocommerce-cart table.cart td.actions .coupon .button,
.woocommerce table.cart td.actions .coupon .button,
.woocommerce-page table.cart td.actions .coupon .button {

flex: 0 0 auto;
white-space: nowrap;
}
}

/* ✅ Mobile view (≤600px): improved visual match */
@media (max-width: 600px) {
.woocommerce-cart table.cart td.actions .coupon,
.woocommerce table.cart td.actions .coupon,
.woocommerce-page table.cart td.actions .coupon {
flex-direction: column;
align-items: center;
gap: 12px;
width: 100%;
}

.woocommerce-cart table.cart td.actions .coupon .input-text,
.woocommerce table.cart td.actions .coupon .input-text,
.woocommerce-page table.cart td.actions .coupon .input-text {
width: 100% !important;
max-width: 320px;
height: 50px;
border: 1px solid #ccc;
font-size: 14px;
font-weight: 600;
text-align: center;
text-transform: uppercase;
letter-spacing: 1px;
color: #6e6e6e;
box-sizing: border-box;
font-family: inherit;
}

.woocommerce-cart table.cart td.actions .coupon .input-text::placeholder,
.woocommerce table.cart td.actions .coupon .input-text::placeholder,
.woocommerce-page table.cart td.actions .coupon .input-text::placeholder {
color: #6e6e6e;
font-weight: 600;
text-align: center;
}

.woocommerce-cart table.cart td.actions .coupon .button,
.woocommerce table.cart td.actions .coupon .button,
.woocommerce-page table.cart td.actions .coupon .button {
width: 100% !important;
max-width: 320px;
height: 50px;
background-color: #002ddc; /* exact blue from your screenshot */
color: #fff;
font-weight: 600;
font-size: 14px;
border: none;

text-transform: uppercase;
text-align: center;
display: block;
cursor: pointer;
box-sizing: border-box;
font-family: inherit;
}
}

@media (max-width: 600px) {
.woocommerce-cart table.cart td.actions .coupon .button,
.woocommerce table.cart td.actions .coupon .button,
.woocommerce-page table.cart td.actions .coupon .button {
padding-left: 40px; /* Increase or decrease as needed */
padding-right: 40px;
}
}

@media (max-width: 921px) {
.woocommerce #content table.cart td.actions .coupon .button,
.woocommerce-page #content table.cart td.actions .coupon .button,
.woocommerce table.cart td.actions .coupon .button {
margin-left: -4px !important;
}
}

/* ✅ Proceed to checkout button */
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
line-height: 6px !important;
}

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
#add_payment_method .wc-proceed-to-checkout a.checkout-button,
.woocommerce-checkout .wc-proceed-to-checkout a.checkout-button {
display: flex !important;
align-items: center;
justify-content: center;
padding-top: 1.2em;
padding-bottom: 1.44em;
padding-left: 1.2em;
padding-right: 1.2em;
font-size: 1.2em;
line-height: 1.2;
text-align: center;
}

@media (max-width: 600px) {

.woocommerce-cart-form .coupon-error-notice {
top: 65px !important;
}

}

@media (max-width: 600px) {

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button, #add_payment_method .wc-proceed-to-
checkout a.checkout-button, .woocommerce-checkout .wc-proceed-to-checkout a.checkout-button {

font-size: 14px;
}
}

@media (min-width: 601px) and (max-width: 921px) {
.woocommerce-cart-form .coupon {
position: relative;
display: flex;
align-items: flex-start;
}

.woocommerce-cart-form .coupon-error-notice {
position: absolute;
top: 60px;
left: 0; /* aligns under input */
margin-top: 4px;
transform: none !important;
width: auto;
}

/* Optional: Scope more tightly if needed */
.woocommerce-cart-form .coupon input + .coupon-error-notice {
left: 0;
}
}

@media (min-width: 601px) and (max-width: 921px) {
.woocommerce-cart-form .coupon-error-notice {
left: 22px !important;
}

}

@media only screen and (max-width: 600px) {
.woocommerce #content table.cart td.actions .coupon,
.woocommerce table.cart td.actions .coupon,
.woocommerce-page #content table.cart td.actions .coupon,
.woocommerce-page table.cart td.actions .coupon {
gap: 20px !important;
}
}/* End custom CSS */