.wg-account-invoices {
	--wg-ink: #17243a;
	--wg-muted: #6b7d95;
	--wg-line: #d7e2ee;
	--wg-blue: #1479ed;
	display: grid;
	gap: 20px;
}

.wg-account-invoices-summary {
	display: grid;
	grid-template-columns: 50px minmax(0, 1fr) auto;
	align-items: center;
	gap: 16px;
	padding: 20px;
	border: 1px solid var(--wg-line);
	border-radius: 8px;
	background: linear-gradient(135deg, #f7faff 0%, #eef6ff 100%);
}

.wg-account-invoices-icon,
.wg-invoice-card-icon {
	display: grid;
	place-items: center;
	flex: 0 0 auto;
	width: 50px;
	height: 50px;
	border: 1px solid #c6ddf7;
	border-radius: 7px;
	color: var(--wg-blue);
	background: #eaf4ff;
}

.wg-account-invoices-summary h2 { margin: 3px 0 6px; color: var(--wg-ink); font-size: 24px; letter-spacing: 0; }
.wg-account-invoices-summary p, .wg-invoice-card p, .wg-invoice-empty p { margin: 0; color: var(--wg-muted); }
.wg-account-invoices-copy { min-width: 0; }
.wg-account-invoices-stats { display: grid; grid-template-columns: repeat(2, minmax(110px, auto)); gap: 8px; }
.wg-account-invoices-stats > span { display: grid; gap: 3px; min-height: 58px; padding: 10px 12px; border: 1px solid #d4e2f2; border-radius: 7px; background: rgba(255, 255, 255, .72); }
.wg-account-invoices-stats small { color: var(--wg-muted); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.wg-account-invoices-stats strong { color: var(--wg-ink); font-size: 14px; }
.wg-kicker { display: block; color: var(--wg-blue); font-size: 11px; font-weight: 800; text-transform: uppercase; }
.wg-invoice-list { display: grid; gap: 10px; }
.wg-invoice-card {
	display: grid;
	grid-template-columns: 46px minmax(0, 1fr) auto auto;
	align-items: center;
	gap: 15px;
	min-height: 88px;
	padding: 15px;
	border: 1px solid var(--wg-line);
	border-left: 3px solid var(--wg-blue);
	border-radius: 6px;
	background: #fff;
	transition: border-color .2s ease, transform .2s ease;
}
.wg-invoice-card:hover { border-color: #aac9ec; transform: translateY(-1px); }
.wg-invoice-card h3 { margin: 2px 0 4px; color: var(--wg-ink); font-size: 17px; letter-spacing: 0; }
.wg-invoice-card-total { min-width: 125px; text-align: right; }
.wg-invoice-card-total strong, .wg-invoice-status { display: block; }
.wg-invoice-card-total strong { color: var(--wg-ink); font-size: 16px; }
.wg-invoice-status { margin-top: 3px; color: #087d59; font-size: 11px; font-weight: 700; }
.wg-invoice-card.is-test { border-left-color: #d38b0a; }
.wg-invoice-card.is-test .wg-invoice-status { color: #956000; }
.wg-invoice-card .button { display: inline-flex !important; align-items: center; justify-content: center; gap: 7px; min-height: 42px; margin: 0 !important; white-space: nowrap; }
.wg-invoice-pending { display: inline-flex; align-items: center; gap: 7px; max-width: 180px; color: #986000; font-size: 12px; font-weight: 700; }
.wg-invoice-empty { display: flex; align-items: center; gap: 14px; padding: 22px; border: 1px dashed #c8d7e7; border-radius: 6px; background: #fff; }
.wg-invoice-empty > i { color: #8aa0ba; font-size: 25px; }
.wg-invoice-empty strong { display: block; margin-bottom: 3px; color: var(--wg-ink); }

@media (max-width: 760px) {
	.wg-account-invoices-summary { grid-template-columns: 44px minmax(0, 1fr); padding: 18px; }
	.wg-account-invoices-icon { width: 44px; height: 44px; }
	.wg-account-invoices-stats { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.wg-invoice-card { grid-template-columns: 42px minmax(0, 1fr); gap: 12px; }
	.wg-invoice-card-icon { width: 42px; height: 42px; }
	.wg-invoice-card-total { grid-column: 2; text-align: left; }
	.wg-invoice-card .button, .wg-invoice-pending { grid-column: 1 / -1; width: 100%; max-width: none; }
}

@media (max-width: 480px) {
	.wg-account-invoices-stats { grid-template-columns: 1fr; }
}