/**
 * Cart page styles.
 *
 * Scoped with .bcom-cart.alignwide for FSE/BTF theme compatibility.
 * Inherits --bcom-* and --boost-* CSS custom properties.
 */

/* ─── Container ──────────────────────────────────────────────── */

/* Reset: prevent FSE/BTF theme global styles from breaking cart */
#bcom-cart table,
#bcom-cart th,
#bcom-cart td { border: none; padding: 0; margin: 0; background: transparent; }
#bcom-cart input[type="number"] { -moz-appearance: textfield; background: #fff; border: 1px solid var(--bcom-border, #e0e0e0); border-radius: var(--boost-radius, var(--bcom-radius, 6px)); padding: 8px; }
#bcom-cart a { text-decoration: none; color: inherit; }

.bcom-cart {
	max-width: 900px;
	margin: 0 auto;
	padding: 40px 20px 60px;
	font-family: inherit;
	color: var(--boost-text, var(--bcom-text, #1a1a1a));
	-webkit-font-smoothing: antialiased;
	box-sizing: border-box;
}

/* ─── Empty state ────────────────────────────────────────────── */
#bcom-cart .bcom-cart__empty {
	text-align: center;
	padding: 60px 20px;
}
#bcom-cart .bcom-cart__empty p {
	color: var(--boost-text-muted, var(--bcom-text-muted, #717171));
	font-size: 16px;
	margin-bottom: 24px;
}

/* ─── Table — scoped to prevent theme overrides ──────────────── */
#bcom-cart .bcom-cart__table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 32px;
	table-layout: auto;
	display: table;
}
#bcom-cart .bcom-cart__table thead th {
	text-align: left;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .05em;
	color: var(--bcom-text-muted, #717171);
	padding: 0 12px 12px;
	border-bottom: 1px solid var(--bcom-border, #e0e0e0);
}
#bcom-cart .bcom-cart__th--price,
#bcom-cart .bcom-cart__th--qty,
#bcom-cart .bcom-cart__th--total { text-align: center; }
#bcom-cart .bcom-cart__th--remove { width: 40px; }

/* ─── Row ────────────────────────────────────────────────────── */
#bcom-cart .bcom-cart__row {
	border-bottom: 1px solid var(--bcom-border, #e0e0e0);
}
#bcom-cart .bcom-cart__row td {
	padding: 16px 12px;
	vertical-align: middle;
}

/* ─── Thumbnail ──────────────────────────────────────────────── */
#bcom-cart .bcom-cart__cell--thumb {
	width: 72px;
	padding-right: 0;
}
#bcom-cart .bcom-cart__thumb {
	width: 72px;
	height: 72px;
	object-fit: cover;
	border-radius: var(--bcom-radius, 6px);
	border: 1px solid var(--bcom-border, #e0e0e0);
	background: #f5f5f5;
}

/* ─── Product name ───────────────────────────────────────────── */
#bcom-cart .bcom-cart__product-name {
	font-size: 15px;
	font-weight: 500;
	color: var(--bcom-text, #1a1a1a);
	text-decoration: none;
}
#bcom-cart .bcom-cart__product-name:hover {
	text-decoration: underline;
}
#bcom-cart .bcom-cart__variant {
	font-size: 13px;
	color: var(--bcom-text-muted, #717171);
	margin-top: 4px;
}

/* ─── Price + total ──────────────────────────────────────────── */
#bcom-cart .bcom-cart__cell--price,
#bcom-cart .bcom-cart__cell--total {
	text-align: center;
	font-size: 14px;
	font-weight: 500;
	white-space: nowrap;
}

/* ─── Quantity ────────────────────────────────────────────────── */
#bcom-cart .bcom-cart__cell--qty { text-align: center; }
#bcom-cart .bcom-cart__qty {
	display: inline-flex;
	align-items: center;
	border: 1px solid var(--bcom-border, #e0e0e0);
	border-radius: var(--bcom-radius, 6px);
	overflow: hidden;
}
#bcom-cart .bcom-cart__qty-btn {
	background: none;
	border: none;
	width: 36px;
	height: 36px;
	font-size: 16px;
	cursor: pointer;
	color: var(--bcom-text, #1a1a1a);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background .15s;
}
#bcom-cart .bcom-cart__qty-btn:hover { background: #f5f5f5; }
#bcom-cart .bcom-cart__qty-input {
	width: 44px;
	height: 36px;
	border: none;
	border-left: 1px solid var(--bcom-border, #e0e0e0);
	border-right: 1px solid var(--bcom-border, #e0e0e0);
	text-align: center;
	font-size: 14px;
	font-weight: 500;
	-moz-appearance: textfield;
	color: var(--bcom-text, #1a1a1a);
}
#bcom-cart .bcom-cart__qty-input::-webkit-outer-spin-button,
#bcom-cart .bcom-cart__qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* ─── Remove ─────────────────────────────────────────────────── */
#bcom-cart .bcom-cart__cell--remove { text-align: center; }
#bcom-cart .bcom-cart__remove {
	background: none;
	border: none;
	font-size: 20px;
	color: var(--bcom-text-muted, #717171);
	cursor: pointer;
	padding: 4px;
	transition: color .15s;
}
#bcom-cart .bcom-cart__remove:hover { color: #dc3232; }

/* ─── Footer: coupon + totals + actions ──────────────────────── */
#bcom-cart .bcom-cart__footer {
	display: grid;
	grid-template-columns: 1fr 320px;
	gap: 24px 40px;
	align-items: start;
}

/* ─── Coupon ─────────────────────────────────────────────────── */
#bcom-cart .bcom-cart__coupon {
	display: flex;
	gap: 8px;
	align-items: center;
}
#bcom-cart .bcom-cart__coupon input[type="text"] {
	flex: 1;
	max-width: 240px;
	padding: 10px 14px;
	font-size: 14px;
	border: 1px solid var(--bcom-field-border, #d0d0d0);
	border-radius: var(--bcom-radius, 6px);
	outline: none;
	transition: border-color .2s;
}
#bcom-cart .bcom-cart__coupon input:focus {
	border-color: var(--bcom-field-focus, #111);
}
#bcom-cart .bcom-cart__coupon-remove {
	background: none;
	border: none;
	font-size: 18px;
	color: #dc3232;
	cursor: pointer;
	padding: 4px;
}

/* ─── Totals ─────────────────────────────────────────────────── */
#bcom-cart .bcom-cart__totals {
	grid-column: 2;
	grid-row: 1 / 3;
}
#bcom-cart .bcom-cart__totals-row {
	display: flex;
	justify-content: space-between;
	font-size: 14px;
	padding: 6px 0;
	color: var(--bcom-text-muted, #717171);
}
#bcom-cart .bcom-cart__totals-row--discount { color: var(--bcom-success, #27ae60); }
#bcom-cart .bcom-cart__totals-row--total {
	font-size: 18px;
	font-weight: 700;
	color: var(--bcom-text, #1a1a1a);
	padding: 12px 0 0;
	margin-top: 8px;
	border-top: 2px solid var(--bcom-text, #1a1a1a);
}

/* ─── Actions ────────────────────────────────────────────────── */
#bcom-cart .bcom-cart__actions {
	grid-column: 2;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
#bcom-cart .bcom-cart__checkout-btn {
	text-align: center;
}
#bcom-cart .bcom-cart__continue {
	text-align: center;
	font-size: 13px;
	color: var(--bcom-text-muted, #717171);
	text-decoration: underline;
}
#bcom-cart .bcom-cart__continue:hover { color: var(--bcom-text, #1a1a1a); }

/* ─── Responsive ─────────────────────────────────────────────── */
@media (max-width: 768px) {
	#bcom-cart .bcom-cart__table thead { display: none; }
	#bcom-cart .bcom-cart__row {
		display: grid;
		grid-template-columns: 64px 1fr auto;
		gap: 0 12px;
		padding: 16px 0;
	}
	#bcom-cart .bcom-cart__row td { padding: 2px 0; }
	#bcom-cart .bcom-cart__cell--thumb { grid-row: 1 / 4; }
	#bcom-cart .bcom-cart__thumb { width: 64px; height: 64px; }
	#bcom-cart .bcom-cart__cell--name { grid-column: 2; }
	#bcom-cart .bcom-cart__cell--price { grid-column: 2; font-size: 13px; text-align: left; }
	#bcom-cart .bcom-cart__cell--price::before { content: attr(data-label) ": "; color: var(--bcom-text-muted, #717171); font-weight: 400; }
	#bcom-cart .bcom-cart__cell--qty { grid-column: 2; text-align: left; }
	#bcom-cart .bcom-cart__cell--total { grid-column: 3; grid-row: 1 / 4; align-self: center; font-weight: 600; }
	#bcom-cart .bcom-cart__cell--remove { grid-column: 3; grid-row: 1; text-align: right; }

	#bcom-cart .bcom-cart__footer {
		grid-template-columns: 1fr;
	}
	#bcom-cart .bcom-cart__totals { grid-column: 1; }
	#bcom-cart .bcom-cart__actions { grid-column: 1; }
}

@media (max-width: 480px) {
	#bcom-cart { padding: 20px 16px 40px; }
}

/* ═══════════════════════════════════════════════════════════════
 * Account shortcodes — shared table + address styles
 * ═══════════════════════════════════════════════════════════════ */

.bcom-account-table {
	width: 100%;
	border-collapse: collapse;
}
.bcom-account-table thead th {
	text-align: left;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .05em;
	color: var(--bcom-text-muted, #717171);
	padding: 0 12px 10px;
	border-bottom: 2px solid var(--bcom-border, #e0e0e0);
}
.bcom-account-table tbody tr {
	border-bottom: 1px solid var(--bcom-border, #e0e0e0);
}
.bcom-account-table tbody td {
	padding: 12px;
	font-size: 14px;
	vertical-align: middle;
}
.bcom-account-link {
	font-size: 13px;
	font-weight: 500;
	color: var(--bcom-accent, #111);
	text-decoration: underline;
}
.bcom-account-expired { color: var(--bcom-text-muted, #717171); font-style: italic; }
.bcom-account-empty { text-align: center; padding: 40px 20px; }
.bcom-account-empty p { color: var(--bcom-text-muted, #717171); margin-bottom: 20px; }
.bcom-account-muted { color: var(--bcom-text-muted, #717171); font-style: italic; }
.bcom-account-login { text-align: center; padding: 40px 20px; }
.bcom-account-login p { color: var(--bcom-text-muted, #717171); margin-bottom: 20px; }

/* Addresses side-by-side */
.bcom-account-addresses { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.bcom-account-address h3 { font-size: 14px; font-weight: 600; margin: 0 0 8px; }
.bcom-account-address__block { font-style: normal; line-height: 1.6; font-size: 14px; color: var(--bcom-text, #1a1a1a); }

/* Subscription status badges */
.bcom-sub-status { font-size: 12px; font-weight: 600; padding: 2px 10px; border-radius: 3px; }
.bcom-sub-status--active { background: #e8f5e9; color: #27ae60; }
.bcom-sub-status--paused { background: #fff3e0; color: #f0b849; }
.bcom-sub-status--cancelled { background: #fef0f0; color: #dc3232; }
.bcom-sub-status--expired { background: #f5f5f5; color: #999; }

/* Order detail totals */
.bcom-order-detail__totals { max-width: 300px; margin-left: auto; margin-top: 20px; }
.bcom-order-detail__row { display: flex; justify-content: space-between; padding: 4px 0; font-size: 14px; color: var(--bcom-text-muted, #717171); }
.bcom-order-detail__row--total { font-size: 17px; font-weight: 700; color: var(--bcom-text, #1a1a1a); border-top: 2px solid var(--bcom-text, #1a1a1a); padding-top: 10px; margin-top: 6px; }
.bcom-order-detail__meta { color: var(--bcom-text-muted, #717171); font-size: 14px; }

/* Order tracking form */
.bcom-order-tracking__form { max-width: 500px; }
.bcom-order-tracking__form .bcom-co__btn { margin-top: 10px; }

/* Small button variant */
.bcom-co__btn--sm { padding: 6px 14px; font-size: 13px; }

/* Responsive account tables */
@media (max-width: 600px) {
	.bcom-account-table thead { display: none; }
	.bcom-account-table tbody tr { display: block; padding: 12px 0; }
	.bcom-account-table tbody td { display: block; padding: 3px 0; font-size: 13px; }
	.bcom-account-table tbody td::before { content: attr(data-label); display: inline; font-weight: 600; margin-right: 6px; }
	.bcom-account-addresses { grid-template-columns: 1fr; }
}

/* ─── Order notes (frontend shortcode) ─────────────────────── */
.bcom-order-note {
	padding: 10px 0;
	border-bottom: 1px solid var(--bcom-border, #e0e0e0);
	font-size: 14px;
	line-height: 1.5;
}
.bcom-order-note:last-child { border-bottom: none; }
.bcom-order-note__icon { margin-right: 6px; }
.bcom-order-note__time { font-size: 12px; color: var(--bcom-text-muted, #717171); margin-top: 2px; }