/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 21 2026 | 17:51:18 */
/* Stepper Styles */
.checkout-stepper {
    display: flex;
    justify-content: space-between;
    margin-bottom: 40px;
    border-bottom: 2px solid #F2F5F8;
    max-width: 860px;
}
.checkout-main-content {
	padding-right: 40px;
	padding-bottom: 48px;
}
.checkout-stepper .step {
   padding: 24px 0;
    color: #99B4C8;
    font-weight: 400;
    position: relative;
    cursor: default;
    width: -webkit-fill-available;
    text-align: center;
    margin-top: 24px;
	font-size: 14px;
	font-family: "Inter", sans-serif;

}

.checkout-stepper .step.active {
    color: #004376; /* Dark Blue */
    font-weight: 700;
}

.checkout-stepper .step.active::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #004376;
}

/* Titles */
h2.form-title {
   color: #004376;
font-size: 40px;
font-style: normal;
font-weight: 400;
line-height: 112%; /* 44.8px */

    margin-bottom: 48px;
}

/* Footer Navigation Buttons */
.checkout-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 190px;
/*     padding-top: 20px; */
}

.back-to-cart, .back-step {
    background: none!important;
    border: none!important;
    color:  #004376!important;
/* 💻 Desktop/Button/L */
font-family: Inter!important;
font-size: 14px!important;
font-weight: 500;
line-height: 150%; /* 21px */
text-transform: uppercase;
	
}

.button.next-step {
   border-radius: 666px!important;
background: #f08200!important;
height: 48px!important;
padding: 12px 32px!important;
	color: #FFF!important;
font-family: Inter!important;
font-size: 14px!important;
font-weight: 500!important;
line-height: 150%!important; /* 21px */
text-transform: uppercase!important;
}

.button.next-step:hover {
/*     background-color: #1a3b5d; */
	background: #F39B33!important;
}

/* Sidebar Styling */
.checkout-sidebar {
    background-color: #f4f6f8;
    padding: 48px 40px;
    border-radius: 0px;
}

#order_review_heading {
    margin-top: 0;
   color: #004376!important;
font-family: Inter!important;
font-size: 24px!important;
font-weight: 500!important;
line-height: 130%!important; /* 31.2px */
}

.order-summary-card {
/*     position: sticky; */
/*     top: 20px; */
}

/* Hide the default place order button inside the Payment method area 
   if you strictly want to use the Sidebar button. 
   Otherwise, keep it visible. */
#payment #place_order {
    /* display: none; */ /* Uncomment if you only want the sidebar button */
}
/* --- STEP 1 LAYOUT (2 Columns) --- */
/* Matches:
   Row 1: First Name | Last Name
   Row 2: Email | Phone 
*/
.step-1-grid-wrapper .woocommerce-billing-fields__field-wrapper {
       display: flex;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    flex-wrap: wrap;
    flex-direction: row;
	justify-content: space-between;
}

/* Force fields to respect the grid */
.step-1-grid-wrapper .form-row {
 width: 50% !important;
    float: none !important;
    margin: 0 !important;
	max-width: 48%;
}

/* Specific field targeting if needed (usually automatic order is fine) */
#billing_first_name_field { order: 1; }
#billing_last_name_field  { order: 2; }
#billing_email_field      { order: 3; }
#billing_phone_field      { order: 4; }


/* --- STEP 2 LAYOUT (Complex Grid) --- */
/* Matches:
   Row 1: Country | Street Address
   Row 2: Address 2 | (Empty or Company)
   Row 3: State | City | Zip 
*/
.step-2-grid-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr; /* Create 3 columns for the bottom row */
    gap: 20px;
}

.step-2-grid-wrapper .form-row {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
	max-width: 48%;
}

/* Row 1: Country (Span 1.5 or just half?) -> Let's use Span 3 approach */
/* To mix 2 columns and 3 columns easily, we span the 3-column grid */

/* Country: Takes up half (1.5 of 3? No, let's span the whole row or split visually) */
/* Easier approach: Define areas */

#billing_country_field { 
    grid-column: span 3; /* Mobile fallback */
}
#billing_address_1_field {
    grid-column: span 3; 
}
#billing_address_2_field {
    grid-column: span 3; 
}

/* DESKTOP LAYOUT OVERRIDE */
@media (min-width: 768px) {
    /* Row 1 */
    #billing_country_field { grid-column: span 1; } /* Wait, grid is 3 cols.. 1 is too small. */
    
    /* REVISING GRID STRATEGY FOR MIXED ROWS: Use Flexbox wrap generally safer or specialized grid */
    .step-2-grid-wrapper {
        display: flex;
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    /* Row 1: Country & Street (Half each) */
    #billing_country_field   { grid-column: span 3; } /* 3/6 = 50% */
    #billing_address_1_field { grid-column: span 3; } /* 3/6 = 50% */

    /* Row 2: Address 2 (Half) & Empty space */
    #billing_address_2_field { grid-column: span 3; } 
    /* The empty space is automatic */

    /* Row 3: State, City, Zip (Third each) */
    #billing_state_field    { grid-column: span 2; } /* 2/6 = 33% */
    #billing_city_field     { grid-column: span 2; } /* 2/6 = 33% */
    #billing_postcode_field { grid-column: span 2; } /* 2/6 = 33% */
}

/* General Input Styling to match screenshot */
.woocommerce-input-wrapper {
    width: 100%;
}
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout select {
    padding: 16px!important;
    border: 1px solid #CCD9E4!important;
    border-radius: 666px!important; /* Rounded corners like screenshot */
    width: 100%;
    background-color: #fff;
    height: 56px!important;
	color: #004376!important;
	line-height: 1.3!important;
}

/* Label Styling */
.woocommerce-checkout label {
   color: #004376!important;

font-family: Inter!important;
font-size: 14px!important;
font-weight: 500!important;
line-height: 130%!important; /* 18.2px */
	margin-bottom: 8px!important;
	padding-left: 16px!important;
}
.woocommerce form .form-row .required {
	 color: #004376!important;
}

#billing_company_field,
.woocommerce-billing-fields h3
/* .e-coupon-box,
.e-checkout__order_review-2,
.terms-container,
#sidebar-place-order */
{
	display: none!important;
}
.woocommerce-checkout-review-order .product-name,
.woocommerce-checkout-review-order .product-total{
	padding: 0 0 24px 0!important;
	color:  #004376!important;

font-family: Inter!important;
font-size: 14px!important;
font-weight: 500!important;
line-height: 130%!important; /* 18.2px */
}
.woocommerce-checkout-review-order .product-total {
	padding-left: 40px!important;
		text-align: right;

}
.elementor-widget-woocommerce-checkout-page .woocommerce .woocommerce-checkout-review-order-table tfoot th {
	color:  #668EAD;
/* 💻 Desktop/Body/M/Medium */
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 130%; /* 20.8px */
letter-spacing: -0.32px;
	padding: 8px!important;
}
.elementor-widget-woocommerce-checkout-page .woocommerce .woocommerce-checkout-review-order-table tfoot td {
	padding: 8px!important;
	color: var(--neutral-700, #004376);

/* 💻 Desktop/Body/M/Medium */
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 130%; /* 20.8px */
letter-spacing: -0.32px;
	text-align: right;
}
.elementor-widget-woocommerce-checkout-page .woocommerce .shop_table tr.order-total td {
	color:  #004376!important;
font-family: Inter!important;
font-size: 24px!important;
font-weight: 500!important;
line-height: 130%; /* 31.2px */
		text-align: right;

}
.elementor-widget-woocommerce-checkout-page .woocommerce .shop_table tr.order-total td strong {
	font-weight: 500!important;
}
.elementor-widget-woocommerce-checkout-page .woocommerce .shop_table tr.order-total th {
	color: #004376!important;

font-family: Inter!important;
font-size: 16px!important;
font-weight: 500!important;
line-height: 130%; /* 20.8px */
}
.elementor-widget-woocommerce-checkout-page .woocommerce-checkout #payment #place_order {
	border-radius:  666px!important;
	background: #f08200!important;
	color: #ffffff!important;

	font-family: Inter!important;
	font-size: 14px!important;
	font-weight: 500!important;
	line-height: 150%; /* 21px */
	text-transform: uppercase;
}
.woocommerce-checkout-review-order .shop_table thead th {
	border-bottom: none!important;
}
.woocommerce-checkout-review-order .order-total th, .woocommerce-checkout-review-order .order-total td {
	border-top: none!important;
}
.woocommerce-password-strength {
	margin-top: 20px;
    margin-left: 0px;
	border-radius: 50px;
	padding: 10px;
	
	color:  #004376;

font-family: Inter;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 130%; /* 18.2px */
}
.woocommerce-checkout .checkout .create-account small {
	margin-top: 10px;
	margin-left: 5px;
	color:  #99B4C8;

/* 💻 Desktop/Body/S/Regular */
font-family: Inter;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 130%; /* 18.2px */
}
#checkout-step-2 .select2-selection__rendered {
	line-height: 2.7 !important;
    min-height: 52px;
	color: #004376!important;
}
#checkout-step-2 .select2-selection {
	border-color: #CCD9E4!important;
	min-height: 54px;
}
#checkout-step-2 .select2-selection__arrow b {
	    border-color: #004376 transparent transparent transparent!important;
}
@media (min-width: 768px) and (max-width: 1024px) {
	.woocommerce-checkout-review-order-table .product-name {
		min-width: 220px;
	}
	.checkout-stepper .step .checkout__tab--text{
		display: none;
	}
	.checkout-stepper .step.active .checkout__tab--text{
		display: inline;
	}
	.checkout-main-content {
		padding: 0px 25px 40px 32px;
	}
	.checkout-sidebar {
		padding: 40px 24px;
	}
	.checkout-stepper .step {
		margin-top: 0;
		padding: 24px;
		width: auto;
	}
	.step-1-grid-wrapper .form-row {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    max-width: 100%;
	
}
	.step-2-grid-wrapper .form-row {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    max-width: 100%;
}
	.checkout-footer {
		margin-top: 45px;
	}
		.step-2-grid-wrapper {
    display: flex;
		flex-direction: column;
/*     grid-template-columns: 1fr 1fr 1fr; /* Create 3 columns for the bottom row */ */
    gap: 20px;
}
}
@media (max-width: 767px)  {
	.step-2-grid-wrapper {
    display: flex;
		flex-direction: column;
/*     grid-template-columns: 1fr 1fr 1fr; /* Create 3 columns for the bottom row */ */
    gap: 20px;
}
	.checkout-stepper .step .checkout__tab--text{
		display: none;
	}
	.checkout-stepper .step.active .checkout__tab--text{
		display: inline;
	}
	.checkout-main-content {
		padding: 0px 25px 40px 32px;
	}
	.checkout-sidebar {
		padding: 40px 24px;
	}
	.checkout-stepper .step {
		margin-top: 0;
		padding: 24px;
		width: auto;
	}
	.step-1-grid-wrapper .form-row {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    max-width: 100%;
	
}
	.step-2-grid-wrapper .form-row {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    max-width: 100%;
}
	.checkout-footer {
		margin-top: 45px;
	}
}