/* Buy without signing up: the account box on the cart, checkout, thank-you panel, "Send to someone else". */

.ece-gc-fieldnote { margin: 6px 0 0; font-size: 14px; color: #334155; }
.ece-gc-mismatch,
.ece-gc-missing { color: #b91c1c; }

/* Cart, logged-out buyer: "Your ExpertCE account" on the left (it replaces the express
   buttons and "Proceed to checkout"); on the right WooCommerce's own cart form and totals,
   drawn as one "Order summary" box. Only the look changes: the markup, links and buttons are
   WooCommerce's, so removing a course and coupons work as before. Phones: one column. */
body.woocommerce-cart .entry-content .woocommerce:has(> .ece-gc-account) {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 380px;
	grid-template-rows: auto auto auto auto 1fr; /* step bar, notices, then the last row takes whatever the account box is taller by */
	column-gap: 30px;
	align-items: start;
	margin: 7px 0 0;
}
body.woocommerce-cart .entry-content .woocommerce:has(> .ece-gc-account) > * { grid-column: 1 / -1; }
body.woocommerce-cart .entry-content .woocommerce:has(> .ece-gc-account) > .ece-steps { grid-row: 1; margin-left: 0; margin-right: 0; width: auto; }
body.woocommerce-cart .entry-content .woocommerce:has(> .ece-gc-account) > .woocommerce-notices-wrapper { grid-row: 2; padding: 0; }
body.woocommerce-cart .entry-content .woocommerce:has(> .ece-gc-account) > .ece-gc-account { grid-column: 1; grid-row: 3 / span 3; }
body.woocommerce-cart .entry-content .woocommerce:has(> .ece-gc-account) > .woocommerce-cart-form {
	grid-column: 2;
	grid-row: 3;
	width: auto;
	margin: 0;
	padding: 24px 26px 4px;
	background: #f3f7ff;
	border-radius: 12px 12px 0 0;
}
body.woocommerce-cart .entry-content .woocommerce:has(> .ece-gc-account) > .cart-collaterals { grid-column: 2; grid-row: 4; width: auto; padding: 0; }
body.woocommerce-cart .entry-content .woocommerce:has(> .ece-gc-account) > .cart-collaterals .cart_totals {
	padding: 4px 26px 22px;
	border-radius: 0 0 12px 12px;
	background: #f3f7ff;
}
body.woocommerce-cart .entry-content .woocommerce:has(> .ece-gc-account) > .cart-collaterals .cart_totals > h2 { display: none; }
body.woocommerce-cart .entry-content .woocommerce:has(> .ece-gc-account) > .cart-collaterals #ppcp-recaptcha-v2-container:empty { margin: 0 !important; }
body.woocommerce-cart .entry-content .woocommerce:has(> .ece-gc-account) > .cross-sells { grid-row: 6; }

.ece-gc-summary__title { margin: 0 0 4px; font-size: 22px; line-height: 1.3; font-weight: 700; color: #0f172a; }

/* Cart, signed-in buyer: no account box, so the cart form and totals are one centred "Order
   summary" column on the page's own background (owner 2026-10-22: no tinted box); the totals
   keep WooCommerce's Proceed to checkout and express buttons. */
body.woocommerce-cart.logged-in .entry-content .woocommerce > .woocommerce-cart-form:has(.ece-gc-summary__title),
body.woocommerce-cart.logged-in .entry-content .woocommerce:has(> .woocommerce-cart-form .ece-gc-summary__title) > .cart-collaterals {
	box-sizing: border-box;
	flex: 0 0 auto; /* the theme lays the cart out as a wrapping flex row: one row each */
	float: none;
	width: calc(100% - 30px); /* the wrapper's -15px sides, like the step bar */
	max-width: 560px;
	margin-left: auto;
	margin-right: auto;
}
body.woocommerce-cart.logged-in .entry-content .woocommerce > .woocommerce-cart-form:has(.ece-gc-summary__title) {
	margin-top: 0;
	margin-bottom: 0;
	padding: 0 0 4px;
}
body.woocommerce-cart.logged-in .entry-content .woocommerce:has(> .woocommerce-cart-form .ece-gc-summary__title) > .cart-collaterals { margin-top: 0; padding: 0; }
body.woocommerce-cart.logged-in .entry-content .woocommerce:has(> .woocommerce-cart-form .ece-gc-summary__title) > .cart-collaterals .cart_totals {
	float: none !important; /* the theme floats it right at half width */
	width: auto !important;
	margin: 0;
	padding: 4px 0 0;
}
body.woocommerce-cart.logged-in .entry-content .woocommerce:has(> .woocommerce-cart-form .ece-gc-summary__title) > .cart-collaterals .cart_totals > h2 { display: none; }

/* The cart table as a list: picture | name, Remove | price (quantity only if it can change). */
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table { margin: 0; border: 0; }
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table thead { display: none; }
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table tbody,
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table tr { display: block; }
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table tr.cart_item {
	margin: 0;
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr) auto;
	grid-template-areas: "thumb name sub" "thumb remove sub" "thumb qty sub";
	column-gap: 12px;
	align-items: start;
	padding: 14px 0;
	border-bottom: 1px solid #cdd8e6;
}
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table tr td {
	display: block;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	text-align: left !important;
}
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table tr td::before { content: none !important; display: none !important; }
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table td.product-thumbnail { display: block !important; grid-area: thumb; }
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table td.product-thumbnail img { display: block; width: 56px !important; height: 56px; object-fit: cover; border-radius: 4px; }
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table td.product-name { grid-area: name; font-size: 15px; line-height: 1.4; }
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table td.product-remove { grid-area: remove; position: static !important; margin-top: 4px; }
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table td.product-remove a.remove {
	display: inline;
	width: auto;
	height: auto;
	margin: 0;
	border-radius: 0;
	background: none !important;
	font-size: 0;
	line-height: 1;
}
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table td.product-remove a.remove::after {
	content: "Remove";
	font-size: 13px;
	font-weight: 400;
	color: #b42318;
	text-decoration: underline;
}
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table td.product-price { display: none; }
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table td.product-quantity { grid-area: qty; margin-top: 8px; }
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table td.product-quantity:not(:has(input)) { display: none; }
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table td.product-subtotal { grid-area: sub; text-align: right !important; font-weight: 600; white-space: nowrap; }
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table td.actions { padding: 14px 0 0 !important; }
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table td.actions .coupon { display: flex; gap: 8px; float: none; width: 100%; margin: 0; }
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table td.actions .coupon .input-text {
	flex: 1 1 auto;
	width: auto !important;
	min-width: 0;
	height: 46px;
	float: none;
	margin: 0;
	padding: 10px 12px;
	font-size: 16px;
	background: #ffffff;
	border: 1px solid #cbd5e1;
	border-radius: 8px;
}
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table td.actions .coupon .button {
	flex: none;
	width: auto !important;
	height: 46px;
	float: none;
	margin: 0;
	padding: 0 18px;
	background: #fff7e0 !important; /* the same pale button as checkout's Apply coupon */
	color: #7a5200 !important;
	border: 1px solid #f3d38a !important;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 600;
	text-transform: none;
	line-height: 44px;
}
/* Update cart only does something when a quantity can change. */
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title):not(:has(td.product-quantity input)) button[name="update_cart"] { display: none; }
body.woocommerce-cart .entry-content .woocommerce .woocommerce-cart-form:has(.ece-gc-summary__title) table.shop_table td.actions .btn-black {
	display: block;
	position: static;
	margin: 10px 0 0;
	text-align: right;
	font-size: 13px;
}

@media (max-width: 880px) {
	body.woocommerce-cart .entry-content .woocommerce:has(> .ece-gc-account) { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; }
	body.woocommerce-cart .entry-content .woocommerce:has(> .ece-gc-account) > .ece-gc-account { grid-row: 3; margin-bottom: 24px; }
	body.woocommerce-cart .entry-content .woocommerce:has(> .ece-gc-account) > .woocommerce-cart-form { grid-column: 1; grid-row: 4; }
	body.woocommerce-cart .entry-content .woocommerce:has(> .ece-gc-account) > .cart-collaterals { grid-column: 1; grid-row: 5; }
}

.ece-gc-account {
	margin: 0;
	padding: 24px 26px;
	background: #fffaf0; /* a warm tint, apart from the Order summary's blue */
	border: 1px solid #f6e7c4;
	border-radius: 12px;
	font-size: 16px;
	line-height: 1.5;
	color: #0f172a;
}
.ece-gc-account .ece-gc-account__title { margin: 0 0 6px; font-size: 22px; line-height: 1.3; font-weight: 700; color: #0f172a; }
.ece-gc-account .ece-gc-account__lead { margin: 0 0 16px; font-size: 15px; color: #334155; }
.ece-gc-account .ece-gc-account__errors { margin: 0 0 16px; font-size: 15px; }
.ece-gc-account .form-row { margin: 0 0 14px; padding: 0; width: auto; float: none; }
.ece-gc-account .ece-gc-account__form { display: grid; grid-template-columns: 1fr 1fr; column-gap: 18px; }
.ece-gc-account label { display: block; margin: 0 0 6px; font-size: 15px; font-weight: 600; color: #0f172a; }
.ece-gc-account input.input-text {
	width: 100%;
	box-sizing: border-box;
	min-height: 46px;
	padding: 10px 12px;
	font-size: 16px;
	border: 1px solid #cbd5e1 !important; /* the theme's form styles: transparent, #eee border */
	border-radius: 8px;
	background: #ffffff !important;
	color: #0f172a;
}
.ece-gc-account .woocommerce-invalid input.input-text { border-color: #b91c1c !important; }
/* The site's main button (yellow, like Proceed to checkout / Place order), not WooCommerce's purple. */
.ece-gc-account button.ece-gc-continue {
	grid-column: 1 / -1;
	justify-self: end;
	display: block;
	width: auto;
	margin: 6px 0 0;
	padding: 0 30px;
	min-height: 48px;
	background: #ffb606 !important;
	border: 0 !important;
	border-radius: 4px;
	color: #000000 !important;
	font-size: 15px;
	font-weight: 700;
	text-transform: none;
	box-shadow: none;
	cursor: pointer;
}
@media (max-width: 600px) {
	.ece-gc-account .ece-gc-account__form { grid-template-columns: minmax(0, 1fr); }
	.ece-gc-account button.ece-gc-continue { justify-self: stretch; width: 100%; }
}
.ece-gc-account button.ece-gc-continue:hover { background: #f0a800 !important; }
.ece-gc-account button.ece-gc-continue:focus-visible { outline: 2px solid #1565c0; outline-offset: 2px; }
.ece-gc-account button.ece-gc-continue[disabled] { opacity: 0.7; cursor: default; }


.ece-gc-linkbtn {
	background: none;
	border: 0;
	padding: 0;
	color: #1565c0;
	font: inherit;
	font-weight: 600;
	text-decoration: underline;
	text-transform: none;
	letter-spacing: normal;
	box-shadow: none;
	min-height: 0;
	line-height: inherit;
	cursor: pointer;
}
.ece-gc-linkbtn:hover { background: none; color: #0d47a1; }
/* The theme paints every <button> (yellow fill, caps, padding); inside our panels a link-style
   button must read as a plain link. */
.ece-gc-panel button.ece-gc-linkbtn,
.ece-gc-send button.ece-gc-linkbtn,
.woocommerce-checkout .ece-gc-fieldnote button.ece-gc-linkbtn,
.ece-gc-account .ece-gc-fieldnote button.ece-gc-linkbtn {
	background: none !important;
	border: 0 !important;
	padding: 0 !important;
	color: #1565c0 !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	box-shadow: none !important;
	height: auto !important;
	min-height: 0 !important;
	line-height: inherit !important;
	font-size: inherit !important;
	font-weight: 600 !important;
}
.ece-gc-panel button.ece-gc-linkbtn:hover,
.ece-gc-send button.ece-gc-linkbtn:hover { color: #0d47a1 !important; background: none !important; }
.ece-gc-linkbtn:focus-visible { outline: 2px solid #1565c0; outline-offset: 2px; }

.ece-gc-panel,
.ece-gc-send {
	margin: 0 0 28px;
	padding: 20px 22px;
	background: #f0fdf4;
	border: 1px solid #bbf7d0;
	border-radius: 12px;
	font-size: 16px;
	line-height: 1.6;
	color: #0f172a;
}
.ece-gc-panel--existing { background: #eff6ff; border-color: #d3e3fd; }
.ece-gc-send { background: #f8fafc; border-color: #e2e8f0; margin-top: 24px; }

.ece-gc-panel__title,
.ece-gc-send__title { margin: 0 0 8px; font-size: 22px; line-height: 1.3; font-weight: 700; color: #0f172a; }
.ece-gc-panel__sub { margin: 18px 0 6px; font-size: 18px; font-weight: 700; color: #0f172a; }
.ece-gc-panel p,
.ece-gc-send p { margin: 0 0 10px; }
.ece-gc-panel p.ece-gc-panel__lead { margin-bottom: 4px; }
.ece-gc-panel p.ece-gc-fix { margin: 0; font-size: 15px; }

/* White card inside the green panel: the password (and fix-email) step. */
.ece-gc-card {
	max-width: 620px;
	margin: 18px 0 0;
	padding: 18px 20px;
	background: #ffffff;
	border: 1px solid #d1fae5;
	border-radius: 10px;
}
.ece-gc-panel .ece-gc-card .ece-gc-panel__sub { margin: 0 0 2px; padding: 0; line-height: 1.3; }
.ece-gc-panel .ece-gc-msg:empty { display: none; }
.ece-gc-panel p.ece-gc-card__text { margin: 0 0 4px; color: #334155; }
.ece-gc-card .ece-gc-form { max-width: none; }
.ece-gc-card .ece-gc-hint,
.ece-gc-card .ece-gc-msg { margin: 0; }

/* The site's main button (yellow, like Place order); the theme's default here looks disabled.
   Also the existing-account panel's "Sign in" link. */
.ece-gc-panel button.ece-gc-btn,
.ece-gc-panel a.button.ece-gc-signin {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	min-height: 44px;
	height: auto;
	padding: 0 20px;
	background: #ffb606 !important;
	border: 0 !important;
	border-radius: 8px;
	color: #000000 !important;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.02em;
	box-shadow: none;
	cursor: pointer;
}
.ece-gc-panel button.ece-gc-btn:hover,
.ece-gc-panel a.button.ece-gc-signin:hover { background: #f0a800 !important; }
.ece-gc-panel button.ece-gc-btn:focus-visible,
.ece-gc-panel a.button.ece-gc-signin:focus-visible { outline: 2px solid #1565c0; outline-offset: 2px; }
.ece-gc-panel button.ece-gc-btn:disabled { opacity: 0.6; cursor: default; }

.ece-gc-form { margin: 8px 0 0; display: grid; gap: 8px; max-width: 520px; }
.ece-gc-form[hidden] { display: none; }
.ece-gc-form label { font-weight: 600; font-size: 15px; }
.ece-gc-form input[type="email"],
.ece-gc-form input[type="text"],
.ece-gc-form input[type="password"] {
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
	padding: 10px 12px;
	font-size: 16px;
	border: 1px solid #cbd5e1;
	border-radius: 8px;
	background: #ffffff;
	color: #0f172a;
}
.ece-gc-row { display: flex; gap: 8px; flex-wrap: wrap; }
.ece-gc-row input { flex: 1 1 220px; }
.ece-gc-hint { font-size: 14px; color: #475569; }
.ece-gc-msg { min-height: 1em; font-size: 15px; font-weight: 600; }
.ece-gc-msg.is-ok { color: #166534; }
.ece-gc-msg.is-error { color: #b91c1c; }

.ece-gc-actions { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.ece-gc-lost { color: #1565c0; text-decoration: underline; }

.ece-gc-send__list { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 14px; }
.ece-gc-send__item { padding: 14px 16px; background: #ffffff; border: 1px solid #e2e8f0; border-radius: 10px; }
.ece-gc-send__course { font-weight: 700; margin: 0 0 6px; }
.ece-gc-send__status { font-size: 15px; color: #334155; }
.ece-gc-confirm { padding: 12px 14px; background: #fffbeb; border: 1px solid #fde68a; border-radius: 8px; }
.ece-gc-confirm[hidden],
.ece-gc-panel [hidden],
.ece-gc-send [hidden] { display: none !important; } /* the theme's button display beats [hidden] */
.ece-gc-confirm__text { font-weight: 600; }

/* After "Save password": the panel shows only this line (gc-thankyou.js). */
.ece-gc-panel p.ece-gc-saved { margin: 0; font-weight: 600; color: #166534; }
.ece-gc-panel p.ece-gc-saved::before { content: "\2713"; margin-right: 8px; }

/* "Set a password before you start?" (first course click while there is no password). */
.ece-gc-dialog {
	position: fixed;
	width: min(440px, calc(100vw - 32px));
	max-height: calc(100vh - 32px);
	box-sizing: border-box;
	margin: auto;
	padding: 26px 24px 22px;
	border: 0;
	border-radius: 12px;
	background: #ffffff;
	box-shadow: 0 20px 50px rgba(15, 23, 42, 0.25);
	color: #0f172a;
	font-size: 16px;
	line-height: 1.5;
	overflow: auto;
}
.ece-gc-dialog::backdrop { background: rgba(15, 23, 42, 0.5); }
.ece-gc-dialog .ece-gc-form { margin: 0; max-width: none; }
.ece-gc-panel .ece-gc-dialog .ece-gc-panel__sub { margin: 0 28px 0 0; padding: 0; line-height: 1.3; }
.ece-gc-panel .ece-gc-dialog p.ece-gc-card__text { margin: -4px 0 4px; }
.ece-gc-dialog .ece-gc-hint,
.ece-gc-dialog .ece-gc-msg { margin: 0; }
.ece-gc-panel .ece-gc-dialog button.ece-gc-btn { width: 100%; margin-top: 4px; }
.ece-gc-skip { justify-self: center; margin-top: 4px; color: #1565c0; font-weight: 600; text-decoration: underline; }
.ece-gc-dialog .ece-gc-skip-note { text-align: center; }
.ece-gc-panel .ece-gc-dialog button.ece-gc-dialog__close {
	position: absolute;
	top: 8px;
	right: 8px;
	width: 36px;
	height: 36px;
	min-height: 0;
	padding: 0;
	background: none !important;
	border: 0 !important;
	box-shadow: none !important;
	color: #475569 !important;
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
}
.ece-gc-panel .ece-gc-dialog button.ece-gc-dialog__close:focus-visible { outline: 2px solid #1565c0; outline-offset: 2px; }

@media (max-width: 600px) {
	.ece-gc-panel,
	.ece-gc-send { padding: 16px; }
	.ece-gc-panel__title,
	.ece-gc-send__title { font-size: 20px; }
	.ece-gc-card { padding: 16px; }
	.ece-gc-panel button.ece-gc-btn { flex: 1 1 100%; }
}