/**
 * G4L AICerts — theme-agnostic WooCommerce content styling.
 *
 * These rules target standard WooCommerce markup only (`.woocommerce`,
 * `.woocommerce-account`, `.woocommerce-ordering`) — NOT the theme's header,
 * footer or page chrome — so they are safe to load on ANY theme (Storefront,
 * Divi, etc.). The Storefront-specific site chrome lives in site.css, which is
 * only enqueued when the active theme is Storefront.
 */

:root {
	--g4l-teal-1: #3ec9d6;
	--g4l-teal-2: #257a9e;
	--g4l-ink: #1f2d3d;
	--g4l-muted: #5b6b7b;
	--g4l-line: #e6eef2;
}

/* ---------- Sort-by (catalog ordering) dropdown ---------- */
.woocommerce-ordering select.orderby,
.woocommerce .woocommerce-ordering select {
	appearance: none;
	-webkit-appearance: none;
	font-family: 'Poppins', sans-serif !important;
	font-size: 14px !important;
	color: var(--g4l-ink) !important;
	background-color: #fff !important;
	border: 1px solid var(--g4l-line) !important;
	border-radius: 10px !important;
	padding: 10px 40px 10px 16px !important;
	box-shadow: 0 2px 8px rgba(13, 27, 62, 0.08) !important;
	cursor: pointer;
	background-image:
		linear-gradient(45deg, transparent 50%, var(--g4l-teal-2) 50%),
		linear-gradient(135deg, var(--g4l-teal-2) 50%, transparent 50%);
	background-position:
		calc(100% - 20px) 50%,
		calc(100% - 14px) 50%;
	background-size: 6px 6px, 6px 6px;
	background-repeat: no-repeat;
}
.woocommerce-ordering select.orderby:focus {
	outline: none !important;
	border-color: var(--g4l-teal-1) !important;
	box-shadow: 0 0 0 3px rgba(62, 201, 214, 0.30) !important;
}

/* ============================================================
   WooCommerce form fields (account, checkout, address, etc.)
   ============================================================ */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce .woocommerce-Input.input-text,
.woocommerce-account input.input-text,
.woocommerce form .form-row select,
.woocommerce select,
.woocommerce input[type="text"],
.woocommerce input[type="email"],
.woocommerce input[type="password"],
.woocommerce input[type="tel"],
.woocommerce input[type="number"],
.woocommerce input[type="search"] {
	width: 100%;
	padding: 11px 14px !important;
	border: 1px solid var(--g4l-line) !important;
	border-radius: 10px !important;
	background: #fff !important;
	color: var(--g4l-ink) !important;
	font-family: 'Poppins', sans-serif !important;
	font-size: 15px !important;
	box-shadow: none !important;
	transition: border-color 0.18s ease, box-shadow 0.18s ease;
	box-sizing: border-box;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce .woocommerce-Input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus,
.woocommerce input:focus {
	outline: none !important;
	border-color: var(--g4l-teal-1) !important;
	box-shadow: 0 0 0 3px rgba(62, 201, 214, 0.28) !important;
}
.woocommerce form .form-row label,
.woocommerce-account label {
	font-weight: 600;
	color: var(--g4l-ink);
	margin-bottom: 6px;
	display: inline-block;
}

/* ============================================================
   My Account page
   ============================================================ */
.woocommerce-account .entry-title,
.woocommerce-account h1.entry-title {
	font-family: 'Poppins', sans-serif;
	font-weight: 700;
	color: var(--g4l-ink);
}

/* Login / register forms as centered cards */
.woocommerce-account .woocommerce-form-login,
.woocommerce-account .woocommerce-form-register,
.woocommerce-account .u-column1,
.woocommerce-account .u-column2 {
	background: #fff !important;
	border: 1px solid var(--g4l-line) !important;
	border-radius: 16px !important;
	box-shadow: 0 6px 22px rgba(20, 40, 60, 0.08) !important;
	padding: 28px !important;
}
.woocommerce-account .woocommerce-form-login {
	max-width: 460px;
	margin: 0 auto !important;
}
.woocommerce-account .woocommerce-form-login__rememberme {
	font-weight: 400;
	color: var(--g4l-muted);
}
.woocommerce-account .woocommerce-LostPassword a,
.woocommerce-account a {
	color: var(--g4l-teal-2);
}

/* Dashboard: navigation sidebar + content as cards */
.woocommerce-account .woocommerce-MyAccount-navigation {
	width: 26% !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul {
	list-style: none !important;
	margin: 0 !important;
	padding: 10px !important;
	background: #fff;
	border: 1px solid var(--g4l-line);
	border-radius: 14px;
	box-shadow: 0 6px 22px rgba(20, 40, 60, 0.08);
}
.woocommerce-account .woocommerce-MyAccount-navigation li {
	border: none !important;
	margin: 0 !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a {
	display: block;
	padding: 11px 14px !important;
	border-radius: 10px;
	color: var(--g4l-ink) !important;
	font-weight: 600;
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
	background: #f1f6f9;
	color: var(--g4l-teal-2) !important;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
	background: linear-gradient(135deg, var(--g4l-teal-1), var(--g4l-teal-2));
	color: #fff !important;
	box-shadow: 0 6px 14px rgba(37, 122, 158, 0.28);
}
.woocommerce-account .woocommerce-MyAccount-content {
	width: 70% !important;
	background: #fff;
	border: 1px solid var(--g4l-line);
	border-radius: 16px;
	box-shadow: 0 6px 22px rgba(20, 40, 60, 0.08);
	padding: 28px !important;
}

/* Account tables (orders, downloads, addresses) */
.woocommerce-account .woocommerce-MyAccount-content table.shop_table,
.woocommerce-account table.woocommerce-orders-table,
.woocommerce-account table.account-orders-table {
	border: 1px solid var(--g4l-line) !important;
	border-radius: 12px !important;
	border-collapse: separate !important;
	border-spacing: 0 !important;
	overflow: hidden;
}
.woocommerce-account .woocommerce-MyAccount-content table.shop_table thead th {
	background: #f6f9fb !important;
	color: var(--g4l-ink) !important;
	font-weight: 700;
}
/* ============================================================
   Addresses page — modern billing / shipping cards.
   Markup: .woocommerce-Addresses.col2-set > .woocommerce-Address
   (.col-1 = billing, .col-2 = shipping) each with a
   .woocommerce-Address-title header (h2 + a.edit) and <address>.
   ============================================================ */

/* Intro line above the cards */
.woocommerce-MyAccount-content:has(.woocommerce-Addresses) > p {
	color: var(--g4l-muted);
	font-size: 15px;
	margin: 0 0 22px;
}

/* Two even cards side by side */
.woocommerce-account .woocommerce-Addresses.col2-set {
	display: grid !important;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	width: 100%;
	float: none !important;
}
.woocommerce-account .woocommerce-Addresses .u-column1,
.woocommerce-account .woocommerce-Addresses .u-column2 {
	width: auto !important;
	float: none !important;
	margin: 0 !important;
}
/* WooCommerce/Divi add clearfix ::before/::after on .col2-set; inside a grid
   they become phantom items that shunt the real cards into the wrong cells.
   Remove them and pin each address to its own column. */
.woocommerce-account .woocommerce-Addresses.col2-set::before,
.woocommerce-account .woocommerce-Addresses.col2-set::after {
	display: none !important;
}
.woocommerce-account .woocommerce-Addresses .u-column1 {
	grid-column: 1;
	grid-row: 1;
}
.woocommerce-account .woocommerce-Addresses .u-column2 {
	grid-column: 2;
	grid-row: 1;
}

.woocommerce-account .woocommerce-Addresses .woocommerce-Address {
	position: relative;
	background: #fff !important;
	border: 1px solid var(--g4l-line) !important;
	border-radius: 18px !important;
	padding: 28px 26px 26px !important;
	box-shadow: 0 6px 20px rgba(20, 40, 60, 0.07) !important;
	overflow: hidden;
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.woocommerce-account .woocommerce-Addresses .woocommerce-Address:hover {
	transform: translateY(-4px);
	box-shadow: 0 16px 34px rgba(20, 40, 60, 0.13) !important;
}
/* Accent bar across the top */
.woocommerce-account .woocommerce-Addresses .woocommerce-Address::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 5px;
	background: linear-gradient(90deg, var(--g4l-teal-1), var(--g4l-teal-2));
}

/* Header: title + icon badge on the left, Edit pill on the right */
.woocommerce-account .woocommerce-Address-title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px 14px;
	margin: 0 0 18px !important;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--g4l-line);
}
.woocommerce-account .woocommerce-Address-title h2,
.woocommerce-account .woocommerce-Address-title h3 {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 !important;
	padding: 0 !important;
	font-family: 'Poppins', sans-serif;
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--g4l-ink);
}
.woocommerce-account .woocommerce-Address-title h2::before,
.woocommerce-account .woocommerce-Address-title h3::before {
	content: "";
	flex: 0 0 auto;
	width: 42px;
	height: 42px;
	border-radius: 12px;
	box-shadow: 0 6px 14px rgba(37, 122, 158, 0.28);
}
.woocommerce-account .woocommerce-Address.col-1 .woocommerce-Address-title h2::before,
.woocommerce-account .woocommerce-Address.u-column1 .woocommerce-Address-title h2::before {
	background:
		url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='white'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='2.5'%20y='5'%20width='19'%20height='14'%20rx='2.5'/%3E%3Cpath%20d='M2.5%209.5h19'/%3E%3C/svg%3E")
			center / 22px 22px no-repeat,
		linear-gradient(135deg, var(--g4l-teal-1), var(--g4l-teal-2));
}
.woocommerce-account .woocommerce-Address.col-2 .woocommerce-Address-title h2::before,
.woocommerce-account .woocommerce-Address.u-column2 .woocommerce-Address-title h2::before {
	background:
		url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='white'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M3%206h11v9H3z'/%3E%3Cpath%20d='M14%209h3.5L21%2012.5V15h-7z'/%3E%3Ccircle%20cx='7'%20cy='17.5'%20r='1.6'/%3E%3Ccircle%20cx='17.5'%20cy='17.5'%20r='1.6'/%3E%3C/svg%3E")
			center / 22px 22px no-repeat,
		linear-gradient(135deg, var(--g4l-teal-1), var(--g4l-teal-2));
}

/* Edit link → teal pill */
.woocommerce-account .woocommerce-Address-title .edit {
	flex: 0 0 auto;
	background: linear-gradient(135deg, var(--g4l-teal-1), var(--g4l-teal-2)) !important;
	color: #fff !important;
	text-decoration: none !important;
	border-radius: 999px !important;
	padding: 8px 18px !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	white-space: nowrap;
	box-shadow: 0 4px 12px rgba(37, 122, 158, 0.22);
	transition: filter 0.15s ease, transform 0.1s ease;
}
.woocommerce-account .woocommerce-Address-title .edit:hover {
	filter: brightness(1.07);
	transform: translateY(-1px);
	color: #fff !important;
}

/* Address body with a pin marker */
.woocommerce-account .woocommerce-Address address {
	position: relative;
	font-style: normal !important;
	margin: 0;
	padding-left: 28px;
	font-size: 15px;
	line-height: 1.95;
	color: var(--g4l-muted);
}
.woocommerce-account .woocommerce-Address address::before {
	content: "";
	position: absolute;
	left: 0;
	top: 4px;
	width: 17px;
	height: 17px;
	background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23257a9e'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M12%2021s-6.5-5.8-6.5-10.5a6.5%206.5%200%200%201%2013%200C18.5%2015.2%2012%2021%2012%2021z'/%3E%3Ccircle%20cx='12'%20cy='10.5'%20r='2.4'/%3E%3C/svg%3E") center / contain no-repeat;
	opacity: 0.85;
}

/* ============================================================
   Account details form — modern fields + password sub-card.
   ============================================================ */
.woocommerce-account .woocommerce-EditAccountForm {
	max-width: 760px;
}
.woocommerce-account .woocommerce-EditAccountForm .woocommerce-form-row {
	margin-bottom: 18px;
}
.woocommerce-account .woocommerce-EditAccountForm input.input-text:focus {
	box-shadow: 0 0 0 3px rgba(62, 201, 214, 0.18) !important;
}
/* Display-name helper line */
.woocommerce-account .woocommerce-EditAccountForm .woocommerce-form-row span em {
	display: block;
	margin-top: 6px;
	font-style: normal;
	font-size: 13px;
	color: var(--g4l-muted);
}
/* Password change → distinct sub-card with a lock icon */
.woocommerce-account .woocommerce-EditAccountForm fieldset {
	margin: 26px 0 22px;
	padding: 22px 22px 6px;
	background: #f6f9fb;
	border: 1px solid var(--g4l-line);
	border-radius: 14px;
}
.woocommerce-account .woocommerce-EditAccountForm fieldset legend {
	display: flex;
	align-items: center;
	gap: 9px;
	width: 100%;
	margin: 0 0 16px;
	padding: 0;
	font-family: 'Poppins', sans-serif;
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--g4l-ink);
}
.woocommerce-account .woocommerce-EditAccountForm fieldset legend::before {
	content: "";
	width: 22px;
	height: 22px;
	flex: 0 0 auto;
	background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23257a9e'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='4.5'%20y='10'%20width='15'%20height='10'%20rx='2'/%3E%3Cpath%20d='M8%2010V7a4%204%200%200%201%208%200v3'/%3E%3C/svg%3E") center / contain no-repeat;
}
/* Show/hide password eye */
.woocommerce-account .woocommerce-EditAccountForm .show-password-input {
	color: var(--g4l-muted);
}
.woocommerce-account .woocommerce-EditAccountForm .show-password-input.display-password {
	color: var(--g4l-teal-2);
}
/* Save button → prominent teal pill */
.woocommerce-account .woocommerce-EditAccountForm button[name="save_account_details"],
.woocommerce-account .woocommerce-EditAccountForm .woocommerce-Button {
	background: linear-gradient(135deg, var(--g4l-teal-1), var(--g4l-teal-2)) !important;
	color: #fff !important;
	border: 0 !important;
	border-radius: 999px !important;
	padding: 13px 34px !important;
	font-family: 'Poppins', sans-serif !important;
	font-weight: 600 !important;
	font-size: 15px !important;
	box-shadow: 0 8px 20px rgba(37, 122, 158, 0.26) !important;
	margin-top: 6px;
	transition: filter 0.15s ease, transform 0.1s ease;
}
.woocommerce-account .woocommerce-EditAccountForm button[name="save_account_details"]:hover,
.woocommerce-account .woocommerce-EditAccountForm .woocommerce-Button:hover {
	filter: brightness(1.07);
	transform: translateY(-1px);
	color: #fff !important;
}

@media (max-width: 600px) {
	.woocommerce-account .woocommerce-Addresses.col2-set {
		grid-template-columns: 1fr;
	}
	.woocommerce-account .woocommerce-Addresses .u-column1,
	.woocommerce-account .woocommerce-Addresses .u-column2 {
		grid-column: 1;
		grid-row: auto;
	}
}

@media (max-width: 768px) {
	.woocommerce-account .woocommerce-MyAccount-navigation,
	.woocommerce-account .woocommerce-MyAccount-content {
		width: 100% !important;
		float: none !important;
		margin-bottom: 20px;
	}
}

/* ============================================================
   Full-width WooCommerce on sidebar themes (e.g. Divi).
   The store reads best edge-to-edge, so drop the theme's blog
   sidebar on every WooCommerce page and let the content span the
   whole content column. These selectors target Divi's markup
   (#sidebar, #left-area, the #main-content .container divider);
   on themes that don't use them the rules simply match nothing.
   ============================================================ */
.woocommerce #sidebar,
.woocommerce-page #sidebar {
	display: none !important;
}
.woocommerce #left-area,
.woocommerce-page #left-area {
	width: 100% !important;
	padding-right: 0 !important;
}
/* Divi draws a 1px vertical rule between content and sidebar. */
.woocommerce #main-content .container:before,
.woocommerce-page #main-content .container:before {
	display: none !important;
}

/* ============================================================
   Cart (block) + Checkout — modern card layout.
   Matches the single-product design language: white cards, teal
   accents, Poppins, rounded corners, soft shadows.
   ============================================================ */

/* Drop Divi's navy #footer-bottom bar on ALL WooCommerce pages — it floats
   mid-page on the short store screens, and our own policies footer (below) is
   the single consistent footer across every store page. */
.woocommerce #footer-bottom,
.woocommerce-page #footer-bottom,
.single-product #footer-bottom,
.post-type-archive-product #footer-bottom,
.tax-product_cat #footer-bottom,
.woocommerce-cart #footer-bottom,
.woocommerce-checkout #footer-bottom,
.woocommerce-account #footer-bottom {
	display: none !important;
}

/* ============================================================
   Consistent policies footer + policy links (shop / product).
   ============================================================ */
.g4l-policies-footer {
	background: #0d1b3e;
	color: rgba(255, 255, 255, 0.75);
	padding: 18px 24px;
	font-family: 'Poppins', sans-serif;
}
.g4l-policies-inner {
	max-width: 1160px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	flex-wrap: wrap;
}
.g4l-policies-copy {
	font-size: 13px;
}
.g4l-policies-links {
	display: flex;
	gap: 20px;
	flex-wrap: wrap;
}
.g4l-policies-footer .g4l-policy-link {
	color: #fff;
	text-decoration: none;
	font-size: 13px;
	font-weight: 600;
}
.g4l-policies-footer .g4l-policy-link:hover {
	color: var(--g4l-teal-1);
	text-decoration: underline;
}
@media (max-width: 600px) {
	.g4l-policies-inner { justify-content: center; text-align: center; }
	.g4l-policies-links { justify-content: center; }
}

/* Policy links under the product meta (category) on the product page. */
.g4l-product-policies {
	margin-top: 16px;
	padding-top: 14px;
	border-top: 1px solid var(--g4l-line);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 16px;
	font-size: 13px;
}
.g4l-product-policies__label {
	font-family: 'Poppins', sans-serif;
	font-weight: 700;
	color: var(--g4l-ink);
}
.g4l-product-policies .g4l-policy-link {
	color: var(--g4l-teal-2);
	text-decoration: none;
	font-weight: 600;
}
.g4l-product-policies .g4l-policy-link:hover { text-decoration: underline; }

/* Policy links at the foot of the shop category sidebar. */
.g4l-cat-policies {
	margin-top: 20px;
	padding-top: 16px;
	border-top: 1px solid var(--g4l-line);
	display: flex;
	flex-direction: column;
	gap: 9px;
}
.g4l-cat-policies__label {
	font-family: 'Poppins', sans-serif;
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--g4l-muted);
	margin-bottom: 2px;
}
.g4l-cat-policies .g4l-policy-link {
	color: var(--g4l-teal-2);
	text-decoration: none;
	font-size: 14px;
	font-weight: 600;
}
.g4l-cat-policies .g4l-policy-link:hover { text-decoration: underline; }

.woocommerce-cart .entry-title,
.woocommerce-checkout .entry-title,
.woocommerce-account .entry-title {
	font-family: 'Poppins', sans-serif !important;
	font-weight: 700 !important;
	color: var(--g4l-ink) !important;
	font-size: 34px !important;
	margin-bottom: 26px !important;
}

/* Cart line-items card */
.wc-block-cart .wc-block-cart__main {
	background: #fff;
	border: 1px solid var(--g4l-line);
	border-radius: 16px;
	padding: 6px 26px;
	box-shadow: 0 6px 22px rgba(20, 40, 60, 0.06);
}
.wc-block-cart-items {
	border: 0 !important;
}
.wc-block-cart-items__header {
	font-family: 'Poppins', sans-serif !important;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: var(--g4l-muted) !important;
	border-bottom: 2px solid #eef2f5 !important;
}
.wc-block-cart-items__row {
	border-bottom: 1px solid #eef2f5 !important;
}
.wc-block-cart-items__row:last-child {
	border-bottom: 0 !important;
}
.wc-block-cart-item__image img {
	border: 1px solid var(--g4l-line);
	border-radius: 12px;
	background: #f7fafb;
	mix-blend-mode: multiply;
}
.wc-block-components-product-name {
	font-family: 'Poppins', sans-serif !important;
	font-weight: 600 !important;
	color: var(--g4l-ink) !important;
	font-size: 16px !important;
}
.wc-block-cart-item__prices .wc-block-components-product-price__value,
.wc-block-components-formatted-money-amount {
	color: var(--g4l-ink);
	font-weight: 600;
}

/* Totals summary card */
.wc-block-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-block {
	background: #fff !important;
	border: 1px solid var(--g4l-line) !important;
	border-radius: 16px !important;
	padding: 24px 26px !important;
	box-shadow: 0 6px 22px rgba(20, 40, 60, 0.06) !important;
	margin-bottom: 18px;
}
.wc-block-cart .wc-block-cart__sidebar .wc-block-cart__totals-title {
	padding-top: 0 !important;
	margin-top: 0 !important;
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
	color: var(--g4l-teal-2) !important;
	font-family: 'Poppins', sans-serif !important;
	font-weight: 700 !important;
	font-size: 24px !important;
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
	font-family: 'Poppins', sans-serif !important;
	font-weight: 700 !important;
	color: var(--g4l-ink) !important;
}
.wc-block-components-totals-coupon__input input {
	border-radius: 10px !important;
	border: 1px solid var(--g4l-line) !important;
}

/* Checkout button (block) — teal gradient pill */
.wc-block-cart__submit-button,
a.wc-block-cart__submit-button {
	border-radius: 999px !important;
	font-family: 'Poppins', sans-serif !important;
	font-weight: 600 !important;
	padding: 16px 20px !important;
	font-size: 16px !important;
	background: linear-gradient(135deg, var(--g4l-teal-1), var(--g4l-teal-2)) !important;
	border: 0 !important;
	box-shadow: 0 8px 18px rgba(37, 122, 158, 0.28) !important;
}

@media (min-width: 900px) {
	.wc-block-cart .wc-block-cart__sidebar {
		position: sticky;
		top: 24px;
	}
}

/* ---- Checkout (block) ---- */
.wc-block-components-checkout-step__title,
.wc-block-components-checkout-step__heading {
	font-family: 'Poppins', sans-serif !important;
	color: var(--g4l-ink) !important;
	font-weight: 700 !important;
}

/* Checkout form (steps) card */
.wc-block-checkout .wc-block-checkout__main {
	background: #fff;
	border: 1px solid var(--g4l-line);
	border-radius: 16px;
	padding: 14px 30px 28px;
	box-shadow: 0 6px 22px rgba(20, 40, 60, 0.06);
}
.wc-block-checkout .wc-block-components-checkout-step {
	border: 0 !important;
}

/* Checkout form fields — rounded, teal focus (ring only while focused, not
   just because the field is filled/`is-active`). */
.wc-block-components-text-input input,
.wc-block-components-text-input .input-text,
.wc-block-components-select select,
.wc-block-components-address-form input,
.wc-block-components-address-form select {
	border-radius: 10px !important;
	border: 1px solid var(--g4l-line) !important;
}
.wc-block-components-text-input input:not(:focus) {
	box-shadow: none !important;
}
.wc-block-components-text-input input:focus,
.wc-block-components-select select:focus,
.wc-block-components-address-form input:focus,
.wc-block-components-address-form select:focus {
	border-color: var(--g4l-teal-1) !important;
	box-shadow: 0 0 0 3px rgba(62, 201, 214, 0.28) !important;
	outline: none !important;
}

/* Checkout order-summary card */
.wc-block-checkout .wc-block-checkout__sidebar .wp-block-woocommerce-checkout-order-summary-block {
	background: #fff !important;
	border: 1px solid var(--g4l-line) !important;
	border-radius: 16px !important;
	box-shadow: 0 6px 22px rgba(20, 40, 60, 0.06) !important;
	padding: 6px 4px !important;
}
.wc-block-checkout .wc-block-checkout__sidebar .wc-block-components-title {
	font-family: 'Poppins', sans-serif !important;
	color: var(--g4l-ink) !important;
	font-weight: 700 !important;
}
.wc-block-components-order-summary-item__image img {
	border: 1px solid var(--g4l-line);
	border-radius: 10px;
	background: #f7fafb;
	mix-blend-mode: multiply;
}

/* Place Order button — teal gradient pill */
.wc-block-components-checkout-place-order-button {
	border-radius: 999px !important;
	font-family: 'Poppins', sans-serif !important;
	font-weight: 600 !important;
	padding: 16px 20px !important;
	font-size: 16px !important;
	background: linear-gradient(135deg, var(--g4l-teal-1), var(--g4l-teal-2)) !important;
	border: 0 !important;
	box-shadow: 0 8px 18px rgba(37, 122, 158, 0.28) !important;
}

@media (min-width: 900px) {
	.wc-block-checkout .wc-block-checkout__sidebar {
		position: sticky;
		top: 24px;
	}
}

/* ============================================================
   WooCommerce notices as a modern inline banner.
   The classic notices (e.g. "… added to your cart") sit inline at
   the top of the content (they do NOT float over the page) as a
   card with a status icon; store.js adds a close button. The
   `body …` scope out-specifies Divi's own navy notice styling.
   ============================================================ */
@keyframes g4l-toast-in {
	from { opacity: 0; transform: translateY(-8px); }
	to   { opacity: 1; transform: none; }
}
body .woocommerce-notices-wrapper {
	position: static !important;
	width: auto !important;
	max-width: none !important;
	margin: 0 auto 22px !important;
	padding: 0 !important;
	border: 0 !important;
}
body .woocommerce-notices-wrapper:empty {
	display: none !important;
}
body .woocommerce-notices-wrapper .woocommerce-message,
body .woocommerce-notices-wrapper .woocommerce-info,
body .woocommerce-notices-wrapper .woocommerce-error,
body .woocommerce-MyAccount-content .woocommerce-message,
body .woocommerce-MyAccount-content .woocommerce-info,
body .woocommerce-MyAccount-content .woocommerce-error {
	position: relative;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px 14px;
	background: #fff !important;
	color: var(--g4l-ink) !important;
	border: 1px solid var(--g4l-line) !important;
	border-left: 4px solid var(--g4l-teal-1) !important;
	border-radius: 14px !important;
	box-shadow: 0 6px 20px rgba(20, 40, 60, 0.08) !important;
	padding: 16px 44px 16px 52px !important;
	margin: 0 0 12px 0 !important;
	font-family: 'Poppins', sans-serif !important;
	font-size: 15px !important;
	line-height: 1.5 !important;
	list-style: none !important;
	animation: g4l-toast-in 0.3s ease;
}
body .woocommerce-notices-wrapper .woocommerce-message::before,
body .woocommerce-notices-wrapper .woocommerce-info::before,
body .woocommerce-notices-wrapper .woocommerce-error::before,
body .woocommerce-MyAccount-content .woocommerce-message::before,
body .woocommerce-MyAccount-content .woocommerce-info::before,
body .woocommerce-MyAccount-content .woocommerce-error::before {
	content: "\2713" !important;
	font-family: 'Poppins', Arial, sans-serif !important;
	position: absolute !important;
	left: 16px !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	margin: 0 !important;
	width: 24px !important;
	height: 24px !important;
	border-radius: 50% !important;
	background: var(--g4l-teal-1) !important;
	color: #fff !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	line-height: 24px !important;
	text-align: center !important;
	display: block !important;
}
body .woocommerce-notices-wrapper .woocommerce-info::before,
body .woocommerce-MyAccount-content .woocommerce-info::before {
	content: "\2139" !important;
	background: #3ea0d6 !important;
}
body .woocommerce-notices-wrapper .woocommerce-error,
body .woocommerce-MyAccount-content .woocommerce-error {
	border-left-color: #e05260 !important;
}
body .woocommerce-notices-wrapper .woocommerce-error::before,
body .woocommerce-MyAccount-content .woocommerce-error::before {
	content: "!" !important;
	background: #e05260 !important;
}
body .woocommerce-notices-wrapper .woocommerce-message .button.wc-forward,
body .woocommerce-notices-wrapper .woocommerce-message a.button,
body .woocommerce-MyAccount-content .woocommerce-info .button,
body .woocommerce-MyAccount-content .woocommerce-info a.button,
body .woocommerce-MyAccount-content .woocommerce-message .button.wc-forward,
body .woocommerce-MyAccount-content .woocommerce-message a.button {
	display: inline-block;
	/* WooCommerce prints the button BEFORE the notice text, which left it floating
	   above the message. order:2 moves it after the text; margin-left:auto + align
	   keep it on the right, vertically centred against multi-line text. */
	order: 2;
	flex-shrink: 0;
	align-self: center;
	margin: 0 0 0 auto !important;
	background: linear-gradient(135deg, var(--g4l-teal-1), var(--g4l-teal-2)) !important;
	color: #fff !important;
	border-radius: 999px !important;
	padding: 9px 22px !important;
	font-family: 'Poppins', sans-serif !important;
	font-weight: 600 !important;
	font-size: 13px !important;
	border: 0 !important;
	float: none !important;
}
.g4l-toast-close {
	position: absolute;
	top: 8px;
	right: 12px;
	border: 0;
	background: transparent;
	color: #9aa7b2;
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
	padding: 0;
}
.g4l-toast-close:hover {
	color: var(--g4l-ink);
}

/* Block notices (inline, inside cart/checkout) — modern banner */
.wc-block-components-notice-banner {
	border-radius: 12px !important;
	font-family: 'Poppins', sans-serif !important;
	box-shadow: 0 4px 14px rgba(20, 40, 60, 0.08);
}

/* ============================================================
   Neutralise Divi's button hover animation on store buttons: it
   spreads the letters apart (letter-spacing: 4px) and slides an
   arrow in. Keep our buttons steady on hover.
   ============================================================ */
.woocommerce .button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce #respond input#submit:hover,
.woocommerce-message a.button:hover,
.woocommerce-info a.button:hover,
.single_add_to_cart_button:hover,
.wc-block-components-button:hover,
.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover,
.g4l-back-to-shop:hover {
	letter-spacing: normal !important;
}
.woocommerce .button::after,
.woocommerce a.button::after,
.woocommerce button.button::after,
.woocommerce input.button::after,
.woocommerce a.button.alt::after,
.woocommerce-message a.button::after,
.single_add_to_cart_button::after,
.wc-block-components-button::after {
	display: none !important;
	content: none !important;
}

/* ============================================================
   Floating "Back to Shop" button (store inner pages).
   ============================================================ */
.g4l-back-to-shop {
	position: fixed;
	left: 24px;
	bottom: 24px;
	z-index: 9998;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: linear-gradient(135deg, var(--g4l-teal-1), var(--g4l-teal-2));
	color: #fff !important;
	font-family: 'Poppins', sans-serif;
	font-weight: 600;
	font-size: 14px;
	text-decoration: none !important;
	padding: 12px 20px;
	border-radius: 999px;
	box-shadow: 0 10px 24px rgba(37, 122, 158, 0.32);
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.g4l-back-to-shop:hover {
	transform: translateY(-2px);
	box-shadow: 0 14px 30px rgba(37, 122, 158, 0.42);
	color: #fff !important;
}
.g4l-back-to-shop__icon {
	font-size: 16px;
	line-height: 1;
}

@media (max-width: 600px) {
	.g4l-back-to-shop {
		left: 14px;
		bottom: 14px;
		padding: 10px 16px;
		font-size: 13px;
	}
	body .woocommerce-notices-wrapper .woocommerce-message .button.wc-forward,
	body .woocommerce-notices-wrapper .woocommerce-message a.button {
		margin: 4px 0 0 !important;
	}
}

/* ============================================================
   Order received / thank-you page — modern layout + enrolment
   success panel (the panel markup is output by the plugin via
   woocommerce_before_thankyou).
   ============================================================ */

/* Replace WooCommerce's plain "Thank you. Your order has been received."
   line with our branded panel. */
.woocommerce-order .woocommerce-thankyou-order-received {
	display: none !important;
}

.g4l-thankyou {
	background: linear-gradient(135deg, rgba(62, 201, 214, 0.12), rgba(37, 122, 158, 0.08));
	border: 1px solid #d7ebf0;
	border-radius: 18px;
	padding: 32px;
	margin: 0 0 30px;
	text-align: center;
}
.g4l-thankyou__icon {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--g4l-teal-1), var(--g4l-teal-2));
	color: #fff;
	font-size: 32px;
	line-height: 64px;
	font-weight: 700;
	margin: 0 auto 16px;
	box-shadow: 0 10px 24px rgba(37, 122, 158, 0.32);
}
.g4l-thankyou__title {
	font-family: 'Poppins', sans-serif;
	font-weight: 700;
	font-size: 28px;
	color: var(--g4l-ink);
	margin: 0 0 10px;
}
.g4l-thankyou__text {
	color: var(--g4l-muted);
	font-size: 16px;
	line-height: 1.6;
	margin: 0 auto 14px;
	max-width: 620px;
}
.g4l-thankyou__inbox {
	background: #fff;
	border: 1px solid var(--g4l-line);
	border-radius: 12px;
	padding: 14px 20px;
	color: var(--g4l-ink);
	font-size: 15px;
	line-height: 1.55;
	max-width: 640px;
	margin: 6px auto 0;
	box-shadow: 0 4px 14px rgba(20, 40, 60, 0.06);
}
.g4l-thankyou__inbox strong {
	color: var(--g4l-teal-2);
}

/* "Launch your course" buttons (order-received panel + My Account) */
.g4l-launch-wrap {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
	margin: 4px auto 18px;
	max-width: 640px;
}
.g4l-launch-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: linear-gradient(135deg, var(--g4l-teal-1), var(--g4l-teal-2));
	color: #fff !important;
	text-decoration: none !important;
	font-weight: 700;
	font-size: 15px;
	line-height: 1.2;
	padding: 13px 26px;
	border-radius: 999px;
	box-shadow: 0 6px 18px rgba(37, 122, 158, 0.28);
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.g4l-launch-btn:hover {
	transform: translateY(-1px);
	box-shadow: 0 9px 24px rgba(37, 122, 158, 0.34);
	color: #fff !important;
	letter-spacing: normal !important;
}
.g4l-launch-btn__icon {
	font-size: 12px;
}
.g4l-launch-account {
	margin: 26px 0 10px;
}
.g4l-launch-account__title {
	font-family: "Poppins", sans-serif;
	font-size: 20px;
	color: var(--g4l-ink);
	margin: 0 0 12px;
}
.g4l-launch-account .g4l-launch-wrap {
	justify-content: flex-start;
	margin-left: 0;
}

/* Order overview as a row of stat tiles */
.woocommerce-order .woocommerce-order-overview {
	list-style: none !important;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
	gap: 14px;
	margin: 0 0 30px !important;
	padding: 0 !important;
	border: 0 !important;
}
/* The theme adds a clearfix ::before/::after to this list; in a grid those
   become phantom cells that push the first tile out of column 1. */
.woocommerce-order .woocommerce-order-overview::before,
.woocommerce-order .woocommerce-order-overview::after {
	display: none !important;
	content: none !important;
}
.woocommerce-order .woocommerce-order-overview li {
	background: #fff !important;
	border: 1px solid var(--g4l-line) !important;
	border-radius: 14px !important;
	padding: 16px 18px !important;
	box-shadow: 0 4px 14px rgba(20, 40, 60, 0.05);
	text-transform: uppercase;
	letter-spacing: 0.4px;
	font-size: 12px;
	color: var(--g4l-muted);
	margin: 0 !important;
	float: none !important;
	border-left: 1px solid var(--g4l-line) !important;
}
.woocommerce-order .woocommerce-order-overview li strong {
	display: block;
	font-family: 'Poppins', sans-serif;
	font-size: 16px;
	color: var(--g4l-ink);
	margin-top: 6px;
	text-transform: none;
	letter-spacing: 0;
}

/* Order details + customer details as cards */
.woocommerce-order .woocommerce-order-details,
.woocommerce-order .woocommerce-customer-details {
	background: #fff;
	border: 1px solid var(--g4l-line);
	border-radius: 16px;
	padding: 10px 26px 22px;
	box-shadow: 0 6px 22px rgba(20, 40, 60, 0.06);
	margin-bottom: 24px;
}
.woocommerce-order .woocommerce-order-details__title,
.woocommerce-order .woocommerce-column__title {
	font-family: 'Poppins', sans-serif !important;
	color: var(--g4l-ink) !important;
	font-weight: 700 !important;
}
.woocommerce-order table.woocommerce-table--order-details {
	border: 0 !important;
}
.woocommerce-order table.woocommerce-table--order-details th {
	color: var(--g4l-muted);
}
.woocommerce-order .woocommerce-customer-details address {
	border: 0 !important;
	border-radius: 12px;
	background: #f7fafb;
	padding: 16px 18px;
}

/* ---- My Account: modern welcome heading ---- */
.woocommerce-account .woocommerce-MyAccount-content > p:first-of-type {
	font-size: 16px;
	color: var(--g4l-ink);
}
.woocommerce-account .woocommerce-MyAccount-content a {
	color: var(--g4l-teal-2);
	font-weight: 600;
}

/* ============================================================
   Responsive — phones / small tablets.
   ============================================================ */
@media (max-width: 782px) {
	/* Order received */
	.g4l-thankyou { padding: 24px 18px; }
	.g4l-thankyou__title { font-size: 22px; }
	.g4l-thankyou__text,
	.g4l-thankyou__inbox { font-size: 14px; }
	.woocommerce-order .woocommerce-order-overview { grid-template-columns: repeat(2, 1fr); }
	.woocommerce-order .woocommerce-order-details,
	.woocommerce-order .woocommerce-customer-details { padding: 4px 16px 16px; }

	/* Cart / checkout / account cards go single column, comfortable padding */
	.wc-block-cart .wc-block-cart__main,
	.wc-block-cart .wc-block-cart__sidebar .wp-block-woocommerce-cart-order-summary-block,
	.wc-block-checkout .wc-block-checkout__main { padding: 14px 16px; }
	.woocommerce-cart .entry-title,
	.woocommerce-checkout .entry-title,
	.woocommerce-account .entry-title { font-size: 26px !important; }

	/* Order-details / account tables can overflow narrow screens — let them scroll. */
	.woocommerce-order .woocommerce-order-details,
	.woocommerce-account .woocommerce-MyAccount-content { overflow-x: auto; }
}

@media (max-width: 480px) {
	.woocommerce-order .woocommerce-order-overview { grid-template-columns: 1fr; }
}

/* ============================================================
   Empty cart + "New in store" / related / cross-sell / up-sell.
   Modernises the empty-cart state and EVERY product-card grid
   that appears outside the main shop archive (cart, single
   product, account) so they match the shop's card language.
   ============================================================ */

/* ---- Empty-cart block ---- */
.wp-block-woocommerce-empty-cart-block,
.woocommerce-cart .cart-empty-wrapper,
.woocommerce-cart .cart-empty {
	text-align: center;
	max-width: 1120px;
	margin-left: auto;
	margin-right: auto;
}

/* Intro icon (sad face / cart image) dropped into a soft teal circle.
   Direct-child only, so product images inside the grid are untouched. */
.wp-block-woocommerce-empty-cart-block > .wp-block-image,
.wp-block-woocommerce-empty-cart-block > figure {
	margin: 6px auto 10px;
}
.wp-block-woocommerce-empty-cart-block > .wp-block-image img,
.wp-block-woocommerce-empty-cart-block > figure img {
	width: 96px;
	height: 96px;
	object-fit: contain;
	padding: 22px;
	background: #eaf6f8;
	border-radius: 50%;
	box-shadow: 0 8px 22px rgba(37, 122, 158, 0.14);
}

/* Headings inside the empty-cart block ("Your cart is currently empty!"
   and "New in store"). */
.wp-block-woocommerce-empty-cart-block h1,
.wp-block-woocommerce-empty-cart-block h2,
.wp-block-woocommerce-empty-cart-block h3,
.wc-block-cart__empty-cart__title {
	font-family: "Poppins", sans-serif !important;
	color: var(--g4l-ink) !important;
	text-align: center !important;
	background: none !important;
	border: 0 !important;
	padding: 0 !important;
}
.wp-block-woocommerce-empty-cart-block > h1,
.wp-block-woocommerce-empty-cart-block > h2:first-of-type,
.wc-block-cart__empty-cart__title {
	font-size: 25px !important;
	font-weight: 700 !important;
	margin: 8px auto 2px !important;
}
/* "New in store" (second heading) as a section title. */
.wp-block-woocommerce-empty-cart-block > h2 ~ h2,
.wp-block-woocommerce-empty-cart-block > h3 {
	font-size: 22px !important;
	font-weight: 700 !important;
	margin: 10px auto 24px !important;
}

/* Classic empty-cart notice line. */
.woocommerce-cart .cart-empty.woocommerce-info {
	font-family: "Poppins", sans-serif;
	font-size: 20px;
	font-weight: 700;
	color: var(--g4l-ink);
	background: none;
	border: 0;
	padding-left: 0;
}
.woocommerce-cart .cart-empty.woocommerce-info::before { display: none; }

/* Dot / rule separator between the message and "New in store". */
.wp-block-woocommerce-empty-cart-block .wp-block-separator {
	max-width: 120px;
	margin: 14px auto 20px;
	opacity: 0.5;
}

/* ---- Shared product-card grids (block "New in store" + classic
        related / cross-sell / up-sell) ----
   Flexbox (not grid): resilient to WooCommerce's own flex layout, and the
   cards carry a real flex-basis + min/max width so they never collapse to
   text-width (which broke the price and add-to-cart button). */
.woocommerce .wc-block-grid__products,
.wp-block-woocommerce-empty-cart-block .wc-block-grid__products,
.wc-block-grid__products,
.related.products ul.products,
.up-sells ul.products,
.cross-sells ul.products {
	display: flex !important;
	flex-wrap: wrap !important;
	justify-content: center;
	gap: 22px !important;
	list-style: none;
	margin: 0 auto !important;
	padding: 0 !important;
	max-width: 1160px;
	float: none !important;
}

.wc-block-grid__product,
.related.products ul.products li.product,
.up-sells ul.products li.product,
.cross-sells ul.products li.product {
	flex: 0 1 232px !important;
	min-width: 200px !important;
	max-width: 300px !important;
	width: auto !important;
	box-sizing: border-box !important;
	float: none !important;
	margin: 0 !important;
	display: flex !important;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--g4l-line);
	border-radius: 16px;
	padding: 16px 16px 20px;
	text-align: center;
	box-shadow: 0 4px 16px rgba(20, 40, 60, 0.06);
	transition: transform 0.16s ease, box-shadow 0.16s ease;
}
.wc-block-grid__product:hover,
.related.products ul.products li.product:hover,
.up-sells ul.products li.product:hover,
.cross-sells ul.products li.product:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 32px rgba(20, 40, 60, 0.12);
}

/* Card image — full card width, framed on a soft ground. */
.wc-block-grid__product-image,
.wc-block-grid__product-image img,
.related.products ul.products li.product a img,
.up-sells ul.products li.product a img,
.cross-sells ul.products li.product a img {
	width: 100% !important;
	height: auto;
	margin: 0 auto 12px;
	border-radius: 12px;
	background: #f7fafb;
}

/* Card title. */
.wc-block-grid__product-title,
.related.products ul.products li.product .woocommerce-loop-product__title,
.up-sells ul.products li.product .woocommerce-loop-product__title,
.cross-sells ul.products li.product .woocommerce-loop-product__title {
	font-family: "Poppins", sans-serif !important;
	font-weight: 700 !important;
	font-size: 15px !important;
	line-height: 1.35 !important;
	color: var(--g4l-teal-2) !important;
	margin: 0 0 8px !important;
	min-height: 2.7em;
}

/* Card price. */
.wc-block-grid__product-price,
.wc-block-grid__product .price,
.related.products ul.products li.product .price,
.up-sells ul.products li.product .price,
.cross-sells ul.products li.product .price {
	color: var(--g4l-ink) !important;
	font-weight: 700 !important;
	font-size: 16px !important;
	margin: 0 0 14px !important;
	white-space: nowrap;
}

/* Card button pinned to the bottom, full width, pill. */
.wc-block-grid__product .wp-block-button,
.wc-block-grid__product .wc-block-grid__product-add-to-cart {
	margin-top: auto;
}
.wc-block-grid__product .wp-block-button__link,
.wc-block-grid__product .wc-block-grid__product-add-to-cart a.button,
.related.products ul.products li.product a.button,
.up-sells ul.products li.product a.button,
.cross-sells ul.products li.product a.button {
	display: block !important;
	width: 100% !important;
	margin-top: auto !important;
	text-align: center;
	white-space: nowrap !important;
	border-radius: 999px !important;
}
/* Push the classic loop button to the bottom of a flex card. */
.related.products ul.products li.product a.button,
.up-sells ul.products li.product a.button,
.cross-sells ul.products li.product a.button {
	margin-top: auto !important;
}

/* Section headings for the related / cross-sell / up-sell blocks. */
.related.products > h2,
.up-sells > h2,
.cross-sells > h2 {
	font-family: "Poppins", sans-serif;
	font-size: 24px;
	font-weight: 700;
	color: var(--g4l-ink);
	text-align: center;
	margin: 8px auto 24px;
}
.related.products,
.up-sells,
.cross-sells {
	max-width: 1120px;
	margin-left: auto;
	margin-right: auto;
	float: none !important;
	width: 100% !important;
}

@media (max-width: 600px) {
	.woocommerce .wc-block-grid__products,
	.wp-block-woocommerce-empty-cart-block .wc-block-grid__products,
	.wc-block-grid__products,
	.related.products ul.products,
	.up-sells ul.products,
	.cross-sells ul.products {
		gap: 14px !important;
	}
	/* Two comfortable columns on phones. */
	.wc-block-grid__product,
	.related.products ul.products li.product,
	.up-sells ul.products li.product,
	.cross-sells ul.products li.product {
		flex: 0 1 calc(50% - 14px) !important;
		min-width: 0 !important;
		max-width: none !important;
		padding: 12px 12px 16px;
	}
	.wc-block-grid__product-title,
	.related.products ul.products li.product .woocommerce-loop-product__title,
	.up-sells ul.products li.product .woocommerce-loop-product__title,
	.cross-sells ul.products li.product .woocommerce-loop-product__title { min-height: 0; }
}

/* "Access AICerts LMS" My Account tab */
.woocommerce-account .g4l-account-lms__title {
	font-family: "Poppins", sans-serif;
	font-size: 20px;
	color: var(--g4l-ink);
	margin: 0 0 6px;
}
.woocommerce-account .g4l-launch-wrap {
	justify-content: flex-start;
	margin-left: 0;
	margin-top: 14px;
}

/* ============================================================
   Login/register headings, branded dashboard, order buttons.
   ============================================================ */

/* Login / register card headings (#6) */
.woocommerce-account .g4l-login-title,
.woocommerce-account .g4l-register-title {
	font-family: "Poppins", sans-serif;
	font-weight: 700;
	font-size: 22px;
	color: var(--g4l-ink);
	margin: 0 0 18px;
	text-align: center;
}
.woocommerce-account .woocommerce-form-register {
	max-width: 460px;
	margin: 0 auto !important;
}

/* Branded dashboard (#10) */
.g4l-dashboard__hello {
	font-family: "Poppins", sans-serif;
	font-size: 24px;
	font-weight: 700;
	color: var(--g4l-ink);
	margin: 0 0 8px;
}
.g4l-dashboard__lead {
	color: var(--g4l-muted);
	font-size: 15px;
	line-height: 1.65;
	max-width: 640px;
	margin: 0 0 22px;
}
.g4l-dashboard__cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 14px;
}
.g4l-dash-card {
	display: block;
	background: #f6f9fb;
	border: 1px solid var(--g4l-line);
	border-radius: 14px;
	padding: 18px;
	text-decoration: none !important;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.g4l-dash-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 10px 24px rgba(20, 40, 60, 0.10);
}
.g4l-dash-card__icon {
	display: block;
	font-size: 22px;
	margin-bottom: 8px;
}
.g4l-dash-card__title {
	display: block;
	font-family: "Poppins", sans-serif;
	font-weight: 700;
	color: var(--g4l-teal-2);
	font-size: 16px;
	margin-bottom: 4px;
}
.g4l-dash-card__desc {
	display: block;
	color: var(--g4l-muted);
	font-size: 13px;
	line-height: 1.5;
}
.g4l-dashboard__logout {
	margin: 22px 0 0;
	font-size: 13px;
	color: var(--g4l-muted);
}

/* Orders table action buttons — compact, wrap, no overlap (#8) */
.woocommerce-account .woocommerce-orders-table__cell-order-actions,
.woocommerce-account td.woocommerce-orders-table__cell-order-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	justify-content: flex-end;
	align-items: center;
}
.woocommerce-account .woocommerce-orders-table__cell-order-actions .button,
.woocommerce-account td.woocommerce-orders-table__cell-order-actions .button {
	margin: 0 !important;
	padding: 7px 14px !important;
	font-size: 13px !important;
	line-height: 1.2 !important;
	min-width: 0 !important;
	white-space: nowrap;
}

/* Orders list shouldn't crowd the footer (#9) */
.woocommerce-account .woocommerce-MyAccount-content {
	margin-bottom: 40px;
}
.woocommerce-account .woocommerce-orders-table,
.woocommerce-account .woocommerce-MyAccount-orders {
	margin-bottom: 8px;
}

/* "How to start your course" directions (SynrgiseLearn orders) */
.g4l-lms-directions {
	background: #fff;
	border: 1px solid var(--g4l-line);
	border-left: 5px solid var(--g4l-teal-1);
	border-radius: 14px;
	padding: 22px 26px;
	margin: 20px auto;
	max-width: 720px;
	box-shadow: 0 6px 20px rgba(20, 40, 60, 0.06);
}
.g4l-lms-directions__title {
	font-family: "Poppins", sans-serif;
	font-weight: 700;
	font-size: 19px;
	color: var(--g4l-ink);
	margin: 0 0 12px;
}
.g4l-lms-directions__steps {
	margin: 0 0 16px;
	padding-left: 20px;
	color: var(--g4l-ink);
}
.g4l-lms-directions__steps li {
	margin: 0 0 10px;
	line-height: 1.55;
	font-size: 15px;
}
.g4l-lms-directions__steps strong { color: var(--g4l-teal-2); }
.g4l-lms-directions__btn {
	display: inline-block;
	background: linear-gradient(135deg, var(--g4l-teal-1), var(--g4l-teal-2));
	color: #fff !important;
	text-decoration: none !important;
	font-weight: 700;
	font-size: 15px;
	padding: 12px 26px;
	border-radius: 999px;
	box-shadow: 0 8px 20px rgba(37, 122, 158, 0.28);
}
.g4l-lms-directions__btn:hover { color: #fff !important; }

/* Sign-up note under the login form */
.woocommerce-account:not(.logged-in) .g4l-login-note {
	margin: 20px 0 0;
	padding-top: 16px;
	border-top: 1px solid var(--g4l-line);
	font-size: 13px;
	line-height: 1.55;
	color: var(--g4l-muted);
	text-align: center;
}
.woocommerce-account:not(.logged-in) .g4l-login-note__link {
	display: inline-block;
	margin-top: 4px;
	color: var(--g4l-teal-2) !important;
	font-weight: 700;
	text-decoration: none;
}
.woocommerce-account:not(.logged-in) .g4l-login-note__link:hover { text-decoration: underline; }

/* Suppress the earlier CSS-only login note (this version, .g4l-login-note, includes the shop link) */
.woocommerce-account:not(.logged-in) .woocommerce-form-login::after { content: none !important; }

/* Smaller login sign-up note + breathing room so the card doesn't touch the footer */
.woocommerce-account:not(.logged-in) .g4l-login-note { font-size: 11px; line-height: 1.5; margin-top: 18px; }
.woocommerce-account:not(.logged-in) .g4l-login-note__link { font-size: 11.5px; }
.woocommerce-account:not(.logged-in) .woocommerce-form-login,
.woocommerce-account:not(.logged-in) .woocommerce-form-register { margin-bottom: 64px !important; }
.woocommerce-account:not(.logged-in) #main-content { padding-bottom: 40px; }

/* Put the "Browse the course catalogue" link on its own centred line under the note */
.woocommerce-account:not(.logged-in) .g4l-login-note__link {
	display: block !important;
	margin-top: 12px !important;
	font-size: 13px !important;
	font-weight: 700 !important;
}