.woocommerce-account .entry-content .woocommerce {
		max-width: 100% !important;
	}

	.woocommerce-account input {
		background: white !important;
	}

	.woocommerce-account .ast-container {
		padding-left: 0px;
		padding-right: 0px;
		max-width: 100%;
		margin-bottom: -28px;
	}

	.woocommerce-account .woocommerce {
		max-width: 100%;
		border: none;
		padding: 0px;
		margin: 0px;
	}

	.woocommerce-account .ast-container .woocommerce #customer_login {
		display: flex;
		align-items: center;
		width: 100%;
		justify-content: center;
		padding-top: 40px;
		padding-bottom: 80px;
	}

	.woocommerce-account .ast-container .woocommerce .customer-login-section {
		width: 50% !important;
	}

	.woocommerce-account .ast-container .woocommerce .customer-register-section {
		width: 50% !important;
	}

	.woocommerce-account .ast-container .woocommerce .customer-login-section .woocommerce-form-login {
		padding: 0 20%;
	}

	.woocommerce-account .ast-container .woocommerce .customer-register-section .woocommerce-form-register {
		padding: 0 20%;
	}

	@media (max-width: 1029px) {
		.custom-my-account-left-section {
			display: none;
		}

		.customer-login-section,
		.customer-register-section {
			margin: 30px 0;
		}

		.woocommerce-account .ast-container .woocommerce .customer-login-section {
			width: 100% !important;
		}

		.woocommerce-account .ast-container .woocommerce .customer-register-section {
			width: 100% !important;
		}
	}

	@media (max-width: 1024px) {

		.woocommerce-account .ast-container .woocommerce .customer-login-section .woocommerce-form-login,
		.woocommerce-account .ast-container .woocommerce .customer-register-section .woocommerce-form-register {
			padding: 0 10%;
			/* Adjust padding for tablet */
		}
	}

	@media (max-width: 767px) {

		.woocommerce-account .ast-container .woocommerce .customer-login-section .woocommerce-form-login,
		.woocommerce-account .ast-container .woocommerce .customer-register-section .woocommerce-form-register {
			padding: 0 5%;
			/* Adjust padding for mobile */
		}
	}

	.woocommerce-account.logged-in .ast-container {
		max-width: 80%;
		margin: 50px auto;

	}

	@media (max-width: 1024px) {
		.woocommerce-account.logged-in .ast-container {
			max-width: 90%;
			margin: 50px auto;
		}

	}

	/* ─── Woo My-Account auth – match WPForms Modern look ───────────── */
	.vi-auth label,
	.vi-auth legend {
		color: #021B32;
		font: 500 14px/1.4 "Inter", sans-serif;
		margin-bottom: 4px;
	}

	.vi-auth input[type="text"],
	.vi-auth input[type="email"],
	.vi-auth input[type="url"],
	.vi-auth input[type="password"],
	.vi-auth input[type="tel"],
	.vi-auth textarea,
	.vi-auth select {
		width: 100%;
		background: #E9EBED;
		padding: 12px;
		border: 1px solid transparent;
		/* keeps WC error border */
		border-radius: 12px;
		font-size: 14px;
		line-height: 1.4;
	}

	.vi-auth ::placeholder {
		color: #5E636E;
		opacity: 1;
	}

	.vi-auth :-ms-input-placeholder {
		color: #5E636E;
	}

	.vi-auth ::-ms-input-placeholder {
		color: #5E636E;
	}

	/* checked state */
	/* ─── vi-auth checkbox – no pseudo-elements ───────────────────── */
	.vi-auth input[type="checkbox"] {
		/* neutral starting point */
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		accent-color: initial;
		/* kill purple Chrome accent      */

		/* box */
		width: 18px;
		height: 18px;
		margin: 0 6px 0 0;
		padding: 0 !important;
		border: 2px solid #021B32;
		border-radius: 4px;
		background: #E9EBED;
		cursor: pointer;
		display: inline-block;
		vertical-align: middle;

		/* we’ll drop the tick in here later */
		background-repeat: no-repeat;
		background-position: center;
		background-size: 12px 12px;
	}

	/* ─── Kill WooCommerce’s built-in checkbox pseudo-element ───────── */
	.vi-auth input[type="checkbox"]::before,
	.vi-auth input[type="checkbox"]:checked::before {
		/* nuke it so our custom styles can take over */
		content: none !important;
		display: none !important;
		background: none !important;
		color: inherit !important;
		width: auto !important;
		height: auto !important;
	}

	/* checked state (tick via inline SVG) */
	.vi-auth input[type="checkbox"]:checked {
		background-color: #021B32;
		background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10'><polyline points='1 5 4 8 11 1' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");
	}

	/* keyboard focus ring */
	.vi-auth input[type="checkbox"]:focus-visible {
		outline: 2px solid #021B32;
		outline-offset: 2px;
	}


	/* Submit button full-width */
	.vi-auth .vi-auth-btn {
		width: 100%;
		max-width: 100%;
		background: #021B32;
		color: #fff;
		padding: 12px;
		border-radius: 12px;
		font: 600 14px/1.4 "Inter", sans-serif;
		cursor: pointer;
	}

	.vi-auth .vi-auth-btn:hover {
		opacity: .9
	}

	/* Layout tweaks (no side image, responsive stack) */
	#customer_login {
		display: flex;
		align-items: flex-start;
		gap: 2rem;
	}

	@media(max-width:1024px) {
		#customer_login {
			display: block
		}
	}

	.customer-login-section,
	.customer-register-section {
		width: 100% !important
	}

	/* Messages */
	.woocommerce-account .woocommerce-error,
	.woocommerce-account .woocommerce-info,
	.woocommerce-account .woocommerce-message {
		background: #FFEFEF;
		border-left: 4px solid #FF7070;
		padding: 12px 16px;
		border-radius: 12px;
		font: 400 14px/1.4 "Inter", sans-serif;
		color: #021B32;
	}



	/* -------------------------------------------------------------
   Field & row spacing for our vi-auth forms
   ------------------------------------------------------------- */

	/* Each input block                                                      */
	.vi-auth-field {
		margin-bottom: 1.25rem;
		/* ↑↓ gap below every text / password field   */
	}

	/* Checkbox + button wrapper                                             */
	.vi-auth-submit {
		margin: 1.25rem 0 1.75rem;
		/* top & bottom space for Remember-me row     */
		display: flex;
		flex-direction: column;
		gap: .75rem;
		/* gap between checkbox and button            */
	}

	/* Checkbox + label in a tidy row                                        */
	.vi-auth-submit label {
		display: inline-flex;
		align-items: center;
		gap: .5rem;
		/* horizontal gap between box and text        */
		font: 500 14px/1.4 "Inter", sans-serif;
	}

	/* Bump the left margin on the “Lost your password?” link if desired     */
	.vi-auth .lost_password {
		margin-top: -.5rem;
		/* pull it closer to the button               */
		margin-bottom: 1.5rem;
	}

	/* Reset Password */
	/* =============================================
   Responsive wrapper – .vi-auth-reset
   ============================================= */
	.vi-auth-reset {
		/* width ------------------------------------------------------------------ */
		max-width: 600px;
		/* never grow past 600 px */
		width: calc(100% - 2rem);
		/* 1 rem gap left & right on mobiles */

		/* height ----------------------------------------------------------------- */
		min-height: 50vh;
		/* fill the viewport */
		display: flex;
		flex-direction: column;
		justify-content: center;
		/* center its content vertically */

		/* spacing around the whole block ---------------------------------------- */
		margin-inline: auto;
		/* center horizontally */
		margin-block: 2rem;
		/* gap from site header / footer */

		/* optional: looks like a card, easy to remove if not needed ------------- */
		padding: 2rem;
		border-radius: .5rem;
	}

	/* tighten side‑padding on very small screens */
	@media (max-width: 480px) {
		.vi-auth-reset {
			width: calc(100% - 1.5rem);
		}
	}

	/* My Account Page */
	/* My Account Page */
	/* Base for the order-pay page on My Account */
	.woocommerce-order-pay #order_review_heading,
	.woocommerce-order-pay #order_review {
		padding: 40px 100px;
	}

	/* When width ≤ 1024px, reduce side padding */
	@media (max-width: 1024px) {

		.woocommerce-order-pay #order_review_heading,
		.woocommerce-order-pay #order_review {
			padding: 40px 60px;
		}
	}

	/* When width ≤ 768px, reduce further */
	@media (max-width: 768px) {

		.woocommerce-order-pay #order_review_heading,
		.woocommerce-order-pay #order_review {
			padding: 30px 30px;
		}
	}

	/* When width ≤ 480px, remove side padding almost entirely */
	@media (max-width: 480px) {

		.woocommerce-order-pay #order_review_heading,
		.woocommerce-order-pay #order_review {
			padding: 20px 10px;
		}
	}

	.woocommerce-order-pay #order_review tbody tr td.product-name,
	.woocommerce-order-pay #order_review tbody tr td.product-quantity,
	.woocommerce-order-pay #order_review tbody tr td.product-subtotal,
	.woocommerce-order-pay #order_review tfoot tr td {
		padding-left: 13px;
	}


	.woocommerce-order-pay .wc_payment_methods.payment_methods.methods {
		max-width: 400px;
	}

	.woocommerce-order-pay li.wc_payment_method.payment_method_ppcp {
		display: flex;
		align-items: center;
	}

	.woocommerce-order-pay li.wc_payment_method.payment_method_ppcp img {
		width: 70px;
		margin-top: 5px !important;
	}

	/* Only on order-pay pages */
	body.woocommerce-order-pay table.shop_table {
		width: 100%;
		max-width: 100%;
	}

	/* Wrap with horizontal scroll if it overflows */
	body.woocommerce-order-pay .woocommerce-order-review {
		overflow-x: auto;
		/* optional: hide vertical overflow or add padding */
	}

	/* Also ensure table doesn’t force exceed parent */
	body.woocommerce-order-pay table.shop_table {
		table-layout: auto;
		word-wrap: break-word;
		white-space: normal;
	}

	body.woocommerce-order-pay .shop_table {
		overflow-x: auto;
		width: 100%;
	}