/* ==========================================================================
   BAG-CHECKOUT-2 — second pass over the bag, checkout and account screens.
   Scope: body.yb.yb-bc2 (added by inc/areas/fix-bag-checkout2.php).
   Report: SITE-AUDIT/A5-ROUND2.md

   Owned by this file only. It does not restyle anything checkout.css,
   bag-page.css, account.css or fix-a5-bag-checkout-account.css already own;
   it fills the screens none of them reach (orders, addresses, account
   details, empty states) and dresses the markup this area adds.

   State classes, set from the real WooCommerce settings, so everything below
   turns itself off the moment the owner configures shipping / payments:
     .yb-bc2-noship  no enabled shipping method exists anywhere
     .yb-bc2-nopay   no payment gateway can take money
     .yb-bc2-noreg   account creation is switched off
   ========================================================================== */

body.yb.yb-bc2 {
	--yb-bc2-ink: #000;
	--yb-bc2-grey: #57585B;
	--yb-bc2-rule: #D5D5D5;
	--yb-bc2-ground: #F5F5F5;
}

/* --------------------------------------------------------------------------
   1. Checkout: inline validation message under the field
   Uses the .checkout-inline-error-message element checkout.css already paints
   (pale panel + red text + icon); only the box model is set here.
   -------------------------------------------------------------------------- */
body.yb.yb-bc2 form.checkout .checkout-inline-error-message {
	display: block;
	box-sizing: border-box;
	width: 100%;
	clear: both;
}
body.yb.yb-bc2 form.checkout .form-row.woocommerce-invalid { margin-bottom: 20px; }

/* --------------------------------------------------------------------------
   2. Checkout: the "not configured yet" states read as calm information,
   never as an error the shopper caused.
   -------------------------------------------------------------------------- */
body.yb.yb-bc2.woocommerce-checkout .yb-co-ship__none,
body.yb.yb-bc2.woocommerce-checkout .yb-co-ship__methods > .yb-co-ship__pkg > p {
	color: var(--yb-bc2-grey);
}
body.yb.yb-bc2.woocommerce-checkout .yb-co-ship-row td,
body.yb.yb-bc2.woocommerce-cart .yb-bag-ship__text span { color: var(--yb-bc2-grey); }

/* Trust line under "Place order": plain text + policy links, no badges. */
body.yb.yb-bc2 .yb-bc2-trust {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 18px;
	margin: 16px 0 0;
	padding: 0;
	list-style: none;
}
body.yb.yb-bc2 .yb-bc2-trust li {
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 14px;
	line-height: 1.4;
	color: var(--yb-bc2-grey);
}
body.yb.yb-bc2 .yb-bc2-trust li::before { content: none; }
body.yb.yb-bc2 .yb-bc2-trust a {
	color: var(--yb-bc2-ink);
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* --------------------------------------------------------------------------
   3. Account: orders, addresses, account details, empty states.
   account.css styles the sign-in card, the dashboard and the wishlist only —
   these endpoint screens were left at the stock WooCommerce look.
   -------------------------------------------------------------------------- */

/* Endpoint heading (Orders / Addresses / Account details) */
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content h2,
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content legend {
	margin: 0 0 20px;
	font-size: 24px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0;
	text-transform: none;
	color: var(--yb-bc2-ink);
}

/* Empty states ("You have no orders yet.") */
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info,
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message--info {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px 24px;
	box-sizing: border-box;
	margin: 0 0 24px;
	padding: 28px 24px;
	border: 1px solid var(--yb-bc2-rule);
	border-radius: 4px;
	background: #fff;
	font-size: 17px;
	line-height: 1.4;
	color: var(--yb-bc2-ink);
}
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info::before,
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message--info::before { content: none; }
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info .button,
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message--info .button {
	order: 2;
	min-height: 48px;
	padding: 0 28px;
	border: 0;
	border-radius: 4px;
	background: #000;
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 1.2px;
	line-height: 48px;
	text-transform: uppercase;
}
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info .button:hover,
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info .button:focus-visible { background: #333; color: #fff; }

/* Orders table */
body.yb.yb-bc2.woocommerce-account table.woocommerce-orders-table,
body.yb.yb-bc2.woocommerce-account table.shop_table_responsive {
	width: 100%;
	margin: 0 0 24px;
	border: 1px solid var(--yb-bc2-rule);
	border-radius: 4px;
	border-collapse: separate;
	border-spacing: 0;
	background: #fff;
	overflow: hidden;
}
body.yb.yb-bc2.woocommerce-account table.woocommerce-orders-table th {
	padding: 14px 16px;
	border: 0;
	border-bottom: 1px solid var(--yb-bc2-rule);
	background: var(--yb-bc2-ground);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	text-align: left;
	color: var(--yb-bc2-grey);
}
body.yb.yb-bc2.woocommerce-account table.woocommerce-orders-table td {
	padding: 18px 16px;
	border: 0;
	border-bottom: 1px solid #ECECEC;
	font-size: 16px;
	line-height: 1.4;
	color: var(--yb-bc2-ink);
	vertical-align: middle;
}
body.yb.yb-bc2.woocommerce-account table.woocommerce-orders-table tr:last-child td { border-bottom: 0; }
body.yb.yb-bc2.woocommerce-account table.woocommerce-orders-table td.woocommerce-orders-table__cell-order-actions { text-align: right; }
body.yb.yb-bc2.woocommerce-account table.woocommerce-orders-table .woocommerce-button {
	min-height: 40px;
	margin: 0 0 0 8px;
	padding: 0 18px;
	border: 1px solid #000;
	border-radius: 4px;
	background: transparent;
	color: #000;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .06em;
	line-height: 38px;
	text-transform: uppercase;
}
body.yb.yb-bc2.woocommerce-account table.woocommerce-orders-table .woocommerce-button:hover,
body.yb.yb-bc2.woocommerce-account table.woocommerce-orders-table .woocommerce-button:focus-visible { background: #000; color: #fff; }

@media (max-width: 767px) {
	body.yb.yb-bc2.woocommerce-account table.woocommerce-orders-table thead { display: none; }
	body.yb.yb-bc2.woocommerce-account table.woocommerce-orders-table tr {
		display: block;
		padding: 8px 0;
		border-bottom: 1px solid #ECECEC;
	}
	body.yb.yb-bc2.woocommerce-account table.woocommerce-orders-table tr:last-child { border-bottom: 0; }
	body.yb.yb-bc2.woocommerce-account table.woocommerce-orders-table td {
		display: flex;
		justify-content: space-between;
		gap: 16px;
		padding: 8px 16px;
		border: 0;
		text-align: right;
	}
	body.yb.yb-bc2.woocommerce-account table.woocommerce-orders-table td::before {
		content: attr(data-title);
		flex: 0 0 auto;
		font-size: 13px;
		font-weight: 600;
		letter-spacing: .06em;
		text-transform: uppercase;
		text-align: left;
		color: var(--yb-bc2-grey);
	}
	body.yb.yb-bc2.woocommerce-account table.woocommerce-orders-table .woocommerce-button { margin: 4px 0 0 8px; }
}

/* Addresses */
body.yb.yb-bc2.woocommerce-account .woocommerce-Addresses {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
	margin: 0;
}
body.yb.yb-bc2.woocommerce-account .woocommerce-Addresses .woocommerce-Address {
	box-sizing: border-box;
	width: auto;
	float: none;
	margin: 0;
	padding: 24px;
	border: 1px solid var(--yb-bc2-rule);
	border-radius: 4px;
	background: #fff;
}
body.yb.yb-bc2.woocommerce-account .woocommerce-Address-title {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	margin: 0 0 12px;
}
body.yb.yb-bc2.woocommerce-account .woocommerce-Address-title h2,
body.yb.yb-bc2.woocommerce-account .woocommerce-Address-title h3 {
	margin: 0;
	font-size: 20px;
	font-weight: 600;
	text-transform: none;
	letter-spacing: 0;
}
body.yb.yb-bc2.woocommerce-account .woocommerce-Address-title .edit {
	font-size: 15px;
	color: var(--yb-bc2-ink);
	text-decoration: underline;
	text-underline-offset: 3px;
}
body.yb.yb-bc2.woocommerce-account .woocommerce-Address address {
	margin: 0;
	font-size: 16px;
	font-style: normal;
	line-height: 1.6;
	color: var(--yb-bc2-grey);
}
@media (max-width: 767px) {
	body.yb.yb-bc2.woocommerce-account .woocommerce-Addresses { grid-template-columns: 1fr; }
}

/* Address + account-details forms: same field look as checkout */
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content form .form-row,
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content form .woocommerce-form-row {
	display: block;
	width: 100%;
	margin: 0 0 18px;
	padding: 0;
	float: none;
}
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content form label {
	display: block;
	margin: 0 0 6px;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.3;
	text-transform: none;
	letter-spacing: 0;
	color: var(--yb-bc2-grey);
}
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content form input.input-text,
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content form select,
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content form textarea {
	box-sizing: border-box;
	width: 100%;
	height: 52px;
	padding: 0 14px;
	border: 1px solid #8D9196;
	border-radius: 4px;
	background: #fff;
	box-shadow: none;
	font-size: 17px;
	color: #111;
}
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content form textarea { height: auto; padding: 12px 14px; }
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content form input.input-text:focus,
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content form select:focus,
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content form textarea:focus {
	border-color: #111;
	box-shadow: 0 0 0 1px #111;
	outline: 0;
}
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content form fieldset {
	margin: 28px 0 0;
	padding: 24px;
	border: 1px solid var(--yb-bc2-rule);
	border-radius: 4px;
	background: #fff;
}
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content form button[type="submit"] {
	min-height: 52px;
	margin: 8px 0 0;
	padding: 0 36px;
	border: 0;
	border-radius: 4px;
	background: #000;
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 1.2px;
	text-transform: uppercase;
}
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content form button[type="submit"]:hover,
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content form button[type="submit"]:focus-visible { background: #333; }
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content form .woocommerce-form-row .description,
body.yb.yb-bc2.woocommerce-account .woocommerce-MyAccount-content form em {
	display: block;
	margin: 6px 0 0;
	font-size: 13px;
	font-style: normal;
	line-height: 1.4;
	color: var(--yb-bc2-grey);
}

/* Order pagination */
body.yb.yb-bc2.woocommerce-account .woocommerce-pagination ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
}
body.yb.yb-bc2.woocommerce-account .woocommerce-pagination li { margin: 0; border: 0; }
body.yb.yb-bc2.woocommerce-account .woocommerce-pagination a,
body.yb.yb-bc2.woocommerce-account .woocommerce-pagination span {
	display: inline-block;
	min-width: 40px;
	padding: 0 12px;
	border: 1px solid var(--yb-bc2-rule);
	border-radius: 4px;
	background: #fff;
	font-size: 15px;
	line-height: 38px;
	text-align: center;
	color: var(--yb-bc2-ink);
}
body.yb.yb-bc2.woocommerce-account .woocommerce-pagination .current {
	border-color: #000;
	background: #000;
	color: #fff;
}

/* --------------------------------------------------------------------------
   4. Bag: keep the summary tidy while there is nothing to promise.
   The payment-badge row is generated from the live gateways in PHP, so when it
   is absent nothing here needs to compensate; this only closes the gap it left.
   -------------------------------------------------------------------------- */
body.yb.yb-bc2.woocommerce-cart.yb-bc2-nopay .cart-totals-inner { margin-bottom: 0; }
body.yb.yb-bc2.woocommerce-cart .yb-bc2-pay { margin-top: 20px; }