.elementor-396 .elementor-element.elementor-element-81b86b3{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:40px;--padding-bottom:80px;--padding-left:0px;--padding-right:0px;}.elementor-widget-woocommerce-checkout-page .product-name .variation{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-396 .elementor-element.elementor-element-c60f46b{--additional-information-display:block;--sections-border-color:var( --e-global-color-0d6b285 );--sections-border-radius:25px 25px 25px 25px;}.elementor-396 .elementor-element.elementor-element-c60f46b .e-woocommerce-login-section, .elementor-396 .elementor-element.elementor-element-c60f46b .woocommerce-checkout #customer_details .col-1, .elementor-396 .elementor-element.elementor-element-c60f46b .woocommerce-additional-fields, .elementor-396 .elementor-element.elementor-element-c60f46b .e-checkout__order_review, .elementor-396 .elementor-element.elementor-element-c60f46b .e-coupon-box, .elementor-396 .elementor-element.elementor-element-c60f46b .woocommerce-checkout #payment, .elementor-396 .elementor-element.elementor-element-c60f46b .woocommerce-shipping-fields .shipping_address{border-width:1px 1px 1px 1px;}.elementor-396 .elementor-element.elementor-element-c60f46b > .elementor-widget-container{padding:10px 10px 10px 10px;}body.elementor-page-396:not(.elementor-motion-effects-element-type-background), body.elementor-page-396 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-94b8dbe );}/* Start custom CSS for woocommerce-checkout-page, class: .elementor-element-c60f46b *//* ======================================================
   MEDSHOP PREMIUM CHECKOUT OVERRIDES
   ====================================================== */

/* --- 1. THE LEFT CARD (BILLING DETAILS) --- */
.elementor-396 .elementor-element.elementor-element-c60f46b .elementor-checkout__billing {
    background: #FFFFFF !important;
    border-radius: 24px !important;
    border: 1px solid #EEF2F6 !important;
    box-shadow: 0 10px 40px -10px rgba(0,0,0,0.05) !important;
    padding: 40px 30px !important;
}

/* Titles */
.elementor-396 .elementor-element.elementor-element-c60f46b h3 {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 900 !important;
    font-size: 22px !important;
    color: #0B132B !important;
    border-bottom: 2px solid #F1F5F9 !important;
    padding-bottom: 15px !important;
    margin-bottom: 25px !important;
}

/* Labels */
.elementor-396 .elementor-element.elementor-element-c60f46b .form-row label {
    font-family: 'Inter', sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #64748B !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin-bottom: 8px !important;
}

/* Input Boxes & Dropdowns */
.elementor-396 .elementor-element.elementor-element-c60f46b .form-row input[type="text"], 
.elementor-396 .elementor-element.elementor-element-c60f46b .form-row input[type="email"], 
.elementor-396 .elementor-element.elementor-element-c60f46b .form-row input[type="tel"], 
.elementor-396 .elementor-element.elementor-element-c60f46b .form-row input[type="password"], 
.elementor-396 .elementor-element.elementor-element-c60f46b .form-row select,
.elementor-396 .elementor-element.elementor-element-c60f46b .form-row textarea {
    background: #F8FAFC !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 12px !important;
    padding: 16px 20px !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #0B132B !important;
    width: 100% !important;
    transition: all 0.3s ease !important;
    box-shadow: none !important;
}

/* Input Focus Glow */
.elementor-396 .elementor-element.elementor-element-c60f46b .form-row input:focus, 
.elementor-396 .elementor-element.elementor-element-c60f46b .form-row select:focus, 
.elementor-396 .elementor-element.elementor-element-c60f46b .form-row textarea:focus {
    border-color: #0B132B !important; /* Navy Border on focus */
    outline: none !important;
    background: #FFFFFF !important;
}

/* --- WOOCOMMERCE TOGGLE FORMS (LOGIN & COUPON) --- */

/* The "Have a coupon? Click here" Notice Box */
.elementor-396 .elementor-element.elementor-element-c60f46b .woocommerce-form-coupon-toggle .woocommerce-info,
.elementor-396 .elementor-element.elementor-element-c60f46b .woocommerce-form-login-toggle .woocommerce-info {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    border-left: 6px solid #14B8A6 !important; /* Teal accent line */
    border-radius: 12px !important;
    color: #0B132B !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 600 !important;
    box-shadow: 0 10px 25px -5px rgba(0,0,0,0.05) !important;
    margin-bottom: 20px !important;
}
.elementor-396 .elementor-element.elementor-element-c60f46b .showlogin, .elementor-396 .elementor-element.elementor-element-c60f46b .showcoupon {
    color: #FF2A6D !important; /* Turns the clickable link Pink */
    font-weight: 800 !important;
    text-decoration: none !important;
}

/* The actual expanded Login and Coupon boxes */
.elementor-396 .elementor-element.elementor-element-c60f46b .woocommerce-form-login,
.elementor-396 .elementor-element.elementor-element-c60f46b .checkout_coupon,
.elementor-396 .elementor-element.elementor-element-c60f46b form.login,
.elementor-396 .elementor-element.elementor-element-c60f46b form.checkout_coupon {
    background: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
    border-radius: 16px !important;
    padding: 24px !important;
    margin-bottom: 30px !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.02) !important;
}

/* OVERRIDES THE UGLY BLUE BORDERED BUTTONS (Nuclear Specificity) */
.elementor-396 .elementor-element.elementor-element-c60f46b .woocommerce-form-login .button,
.elementor-396 .elementor-element.elementor-element-c60f46b .checkout_coupon .button,
.elementor-396 .elementor-element.elementor-element-c60f46b form.login button[type="submit"],
.elementor-396 .elementor-element.elementor-element-c60f46b form.checkout_coupon button[type="submit"],
.elementor-396 .elementor-element.elementor-element-c60f46b button[name="login"],
.elementor-396 .elementor-element.elementor-element-c60f46b button[name="apply_coupon"] {
    background: #0B132B !important; /* Dark Navy Base */
    color: #FFFFFF !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 12px 10px !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.2px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1) !important;
    min-height: 42px !important;
    line-height: 1 !important;
}

.elementor-396 .elementor-element.elementor-element-c60f46b .woocommerce-form-login .button:hover,
.elementor-396 .elementor-element.elementor-element-c60f46b .checkout_coupon .button:hover,
.elementor-396 .elementor-element.elementor-element-c60f46b form.login button[type="submit"]:hover,
.elementor-396 .elementor-element.elementor-element-c60f46b form.checkout_coupon button[type="submit"]:hover,
.elementor-396 .elementor-element.elementor-element-c60f46b button[name="login"]:hover,
.elementor-396 .elementor-element.elementor-element-c60f46b button[name="apply_coupon"]:hover {
    background: #FF2A6D !important; /* Turns Pink on Hover */
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 15px rgba(255, 42, 109, 0.2) !important;
    border: none !important; /* Forces the blue outline away */
}


/* --- 2. THE RIGHT CARD (YOUR ORDER) --- */
.elementor-396 .elementor-element.elementor-element-c60f46b .elementor-checkout__order {
    background: #FFFFFF !important;
    border-radius: 24px !important;
    border: 1px solid #EEF2F6 !important;
    box-shadow: 0 10px 40px -10px rgba(0,0,0,0.05) !important;
    padding: 40px 30px !important;
}

/* Order Table */
.elementor-396 .elementor-element.elementor-element-c60f46b .shop_table {
    border: none !important;
    border-radius: 0 !important;
}
.elementor-396 .elementor-element.elementor-element-c60f46b .shop_table th {
    font-family: 'Inter', sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #64748B !important;
    border-bottom: 1px solid #EEF2F6 !important;
    padding: 15px 0 !important;
}
.elementor-396 .elementor-element.elementor-element-c60f46b .shop_table td {
    font-family: 'Inter', sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #0B132B !important;
    border-bottom: 1px solid #EEF2F6 !important;
    padding: 15px 0 !important;
}
.elementor-396 .elementor-element.elementor-element-c60f46b .shop_table .order-total th, 
.elementor-396 .elementor-element.elementor-element-c60f46b .shop_table .order-total td {
    border-bottom: none !important;
    padding-top: 25px !important;
}
.elementor-396 .elementor-element.elementor-element-c60f46b .shop_table .order-total .amount {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 24px !important;
    font-weight: 900 !important;
    color: #E11D48 !important; /* Rose Total */
}

/* --- 3. PAYMENT METHODS BOX --- */
.elementor-396 .elementor-element.elementor-element-c60f46b #payment {
    background: transparent !important;
    
    padding: 20px !important;
    margin-top: 30px !important;
}
.elementor-396 .elementor-element.elementor-element-c60f46b #payment ul.payment_methods,
.elementor-396 .elementor-element.elementor-element-c60f46b .wc_payment_methods {
    border-bottom: none !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
}

/* Force Payment Options into White Rounded Cards */
.elementor-396 .elementor-element.elementor-element-c60f46b #payment ul.payment_methods li,
.elementor-396 .elementor-element.elementor-element-c60f46b .wc_payment_methods li.wc_payment_method {
    background: #FFFFFF !important; 
    border: 1px solid #E2E8F0 !important;
    border-radius: 12px !important;
    padding: 18px 20px !important;
    margin-bottom: 12px !important;
    transition: all 0.2s ease !important;
    font-family: 'Inter', sans-serif !important;
    color: #0B132B !important;
    display: flex !important;
}
.elementor-396 .elementor-element.elementor-element-c60f46b #payment ul.payment_methods li:hover,
.elementor-396 .elementor-element.elementor-element-c60f46b .wc_payment_methods li.wc_payment_method:hover {
    border-color: #9D4EDD !important; /* Purple border on hover */
}

/* Aligns and styles the radio buttons */
.elementor-396 .elementor-element.elementor-element-c60f46b #payment ul.payment_methods li input[type="radio"],
.elementor-396 .elementor-element.elementor-element-c60f46b .wc_payment_methods li.wc_payment_method input[type="radio"] {
    margin-right: 12px !important;
    transform: scale(1.3) !important;
    accent-color: #0B132B !important;
    position: relative !important;
    top: 2px !important;
}

/* Bolds the payment title */
.elementor-396 .elementor-element.elementor-element-c60f46b #payment ul.payment_methods li label,
.elementor-396 .elementor-element.elementor-element-c60f46b .wc_payment_methods li.wc_payment_method label {
    display: inline-block !important;
    width: auto !important;
    color: #0B132B !important;
    font-weight: 800 !important;
}

/* The expandable description box underneath the selected payment */
.elementor-396 .elementor-element.elementor-element-c60f46b #payment div.payment_box,
.elementor-396 .elementor-element.elementor-element-c60f46b .wc_payment_methods div.payment_box {
    background: #F8FAFC !important;
    border: 1px solid #EEF2F6 !important;
    border-radius: 8px !important;
    color: #64748B !important;
    font-size: 13px !important;
    margin-top: 15px !important;
    padding: 15px !important;
    width: 100% !important;
}
.elementor-396 .elementor-element.elementor-element-c60f46b #payment div.payment_box::before,
.elementor-396 .elementor-element.elementor-element-c60f46b .wc_payment_methods div.payment_box::before {
    display: none !important; /* Hides ugly default triangle */
}

/* --- 4. PLACE ORDER BUTTON --- */
.elementor-396 .elementor-element.elementor-element-c60f46b #place_order {
    background: #E11D48 !important;
    color: white !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 1.5px !important;
    padding: 20px !important;
    border-radius: 12px !important;
    width: 100% !important;
    margin-top: 20px !important;
    transition: all 0.3s ease !important;
    border: none !important;
}
.elementor-396 .elementor-element.elementor-element-c60f46b #place_order:hover {
    background: #BE123C !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 10px 20px rgba(225, 29, 72, 0.25) !important;
}

/* --- WOOCOMMERCE NOTICES (Fixed Error Overlap) --- */
.elementor-396 .elementor-element.elementor-element-c60f46b .woocommerce-message, 
.elementor-396 .elementor-element.elementor-element-c60f46b .woocommerce-info, 
.elementor-396 .elementor-element.elementor-element-c60f46b .woocommerce-error {
    background: #FFFFFF !important;
    border-radius: 12px !important;
    border: 1px solid #EEF2F6 !important;
    color: #0B132B !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    padding: 18px 24px !important;
    box-shadow: 0 10px 25px -5px rgba(0,0,0,0.05) !important;
    margin-bottom: 30px !important;
}

/* Info and Message can stay flex */
.elementor-396 .elementor-element.elementor-element-c60f46b .woocommerce-message, 
.elementor-396 .elementor-element.elementor-element-c60f46b .woocommerce-info {
    display: flex !important;
    align-items: center !important;
}

/* Errors are lists, they must be blocks to prevent horizontal squishing */
.elementor-396 .elementor-element.elementor-element-c60f46b .woocommerce-error { 
    border-left: 6px solid #E11D48 !important; 
    display: block !important; 
    list-style: none !important;
}

/* Move the flex alignment to the individual error items */
.elementor-396 .elementor-element.elementor-element-c60f46b .woocommerce-error li {
    display: flex !important; 
    align-items: flex-start !important; 
    margin-bottom: 12px !important;
    line-height: 1.5 !important;
}
.elementor-396 .elementor-element.elementor-element-c60f46b .woocommerce-error li:last-child {
    margin-bottom: 0 !important;
}

/* Red "!" Badge for each error item */
.elementor-396 .elementor-element.elementor-element-c60f46b .woocommerce-error li::before { 
    content: '!' !important; 
    background: #E11D48 !important; 
    font-family: 'Montserrat', sans-serif !important;
    font-weight: bold !important; 
    font-size: 14px !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    width: 24px !important; height: 24px !important; border-radius: 50% !important;
    color: white !important; margin-right: 15px !important; flex-shrink: 0 !important;
    margin-top: -2px !important;
}/* End custom CSS */