/* Pulmet 代打包中台 客户页（templates/dashboard.php）和登录页（Portal::auth）。独立页面，不用主题。 */
:root {
	--pk-bg: #f3f5f9;
	--pk-card: #fff;
	--pk-text: #1d2433;
	--pk-muted: #6b7385;
	--pk-line: #e6e9f0;
	--pk-accent: #2f6fed;
	--pk-accent-soft: #e8effd;
	--pk-ok: #1a7f4b;
	--pk-bad: #c0392b;
	--pk-warn-bg: #fff6e0;
}
* { box-sizing: border-box; }
body.pk { margin: 0; background: var(--pk-bg); color: var(--pk-text); font: 14px/1.5 -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Helvetica Neue", sans-serif; }
.pk a { color: var(--pk-accent); text-decoration: none; }
.pk a:hover { text-decoration: underline; }
.pk-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 24px; background: #fff; border-bottom: 1px solid var(--pk-line); position: sticky; top: 0; z-index: 2; }
.pk-brand { display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: 17px; }
.pk-brand img { border-radius: 5px; }
.pk-user { display: flex; gap: 16px; align-items: center; color: var(--pk-muted); }
.pk-main { max-width: 1280px; margin: 0 auto; padding: 20px 24px 40px; display: grid; gap: 16px; }
.pk-row { display: grid; gap: 16px; }
.pk-row-3 { grid-template-columns: 1fr 1.2fr 1.2fr; }
.pk-row-2 { grid-template-columns: 1.3fr 1fr; }
.pk-card { background: var(--pk-card); border-radius: 8px; padding: 16px 20px; box-shadow: 0 1px 2px rgba(20, 30, 60, .05); min-width: 0; }
.pk-card h2 { margin: 0 0 12px; font-size: 15px; font-weight: 600; }
.pk-card h2 small { font-weight: 400; color: var(--pk-muted); font-size: 12px; margin-left: 6px; }
.pk-balance { padding: 0; overflow: visible; }
.pk-welcome { background: linear-gradient(90deg, #2f6fed, #5b8ff5); color: #fff; padding: 10px 16px; border-radius: 8px 8px 0 0; font-size: 13px; }
.pk-big { font-size: 32px; font-weight: 700; padding: 14px 16px 2px; font-variant-numeric: tabular-nums; }
.pk-sub { padding: 0 16px 16px; color: var(--pk-muted); display: flex; gap: 16px; align-items: center; }
.pk-topup { position: relative; }
.pk-topup summary { color: var(--pk-accent); cursor: pointer; font-weight: 600; list-style: none; }
.pk-topup summary::-webkit-details-marker { display: none; }
.pk-pop { position: absolute; left: 0; top: 26px; z-index: 3; width: 300px; background: #fff; border: 1px solid var(--pk-line); border-radius: 8px; padding: 12px 14px; box-shadow: 0 8px 24px rgba(20, 30, 60, .12); color: var(--pk-text); }
.pk-qr { display: block; width: 180px; margin: 10px auto 0; border-radius: 10px; }
.pk-stats { display: grid; grid-template-columns: repeat(4, 1fr); text-align: center; gap: 8px; }
.pk-stats-wide { grid-template-columns: repeat(8, 1fr); }
.pk-stats b { display: block; font-size: 24px; font-weight: 700; font-variant-numeric: tabular-nums; }
.pk-stats span { color: var(--pk-muted); font-size: 12px; }
.pk-ok { color: var(--pk-ok); }
.pk-neg { color: var(--pk-bad); }
.pk-muted { color: var(--pk-muted); }
.pk-alert { background: var(--pk-warn-bg); border: 1px solid #f3d48a; padding: 10px 14px; border-radius: 8px; }
.pk-alert-bad { background: #fdecea; border-color: #f2b8b0; color: var(--pk-bad); }
.pk-tag { padding: 2px 8px; border-radius: 10px; font-size: 12px; }
.pk-tag-warn { background: var(--pk-warn-bg); color: #8a5a00; }
.pk-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pk-table th, .pk-table td { text-align: left; padding: 7px 8px; border-bottom: 1px solid var(--pk-line); white-space: nowrap; }
.pk-table th { color: var(--pk-muted); font-weight: 500; background: #fafbfd; }
.pk-table td:last-child { white-space: normal; }
.pk-scroll { overflow-x: auto; }
.pk-tall { max-height: 340px; overflow-y: auto; }
.pk-tall th { position: sticky; top: 0; }
.pk-dl { margin: 12px 0 0; color: var(--pk-muted); display: flex; flex-wrap: wrap; gap: 10px; }
.pk-foot { color: var(--pk-muted); font-size: 12px; margin: 0; }
.pk-chart-head h2 { margin-bottom: 0; }
.pk-toggle { position: relative; }
.pk-toggle input { position: absolute; opacity: 0; }
.pk-toggle label { display: inline-block; margin-top: -26px; float: right; padding: 3px 14px; border: 1px solid var(--pk-line); cursor: pointer; font-size: 13px; background: #fff; }
.pk-toggle label[for="pk-m"] { border-radius: 0 5px 5px 0; }
.pk-toggle label[for="pk-d"] { border-radius: 5px 0 0 5px; margin-right: -1px; }
.pk-toggle input:checked + label { background: var(--pk-accent); border-color: var(--pk-accent); color: #fff; }
.pk-chart-d, .pk-chart-m { clear: both; padding-top: 8px; }
.pk-chart-m { display: none; }
#pk-m:checked ~ .pk-chart-m { display: block; }
#pk-m:checked ~ .pk-chart-d { display: none; }
.pk-chart { width: 100%; height: auto; display: block; }
.pk-grid { stroke: var(--pk-line); stroke-width: 1; }
.pk-axis { fill: var(--pk-muted); font-size: 11px; }
.pk-val { fill: var(--pk-text); font-size: 11px; font-weight: 600; }
.pk-bar { fill: var(--pk-accent); }
.pk-bar:hover { fill: #1f55c4; }
@media (max-width: 1000px) {
	.pk-row-3, .pk-row-2 { grid-template-columns: 1fr; }
	.pk-stats-wide { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 560px) {
	.pk-top, .pk-main { padding-left: 16px; padding-right: 16px; }
	.pk-stats { grid-template-columns: repeat(2, 1fr); }
	.pk-pop { width: min(300px, calc(100vw - 48px)); }
}

/* Log-in, forgotten and new password (PackPortal::auth). */
.pk-auth { display: flex; justify-content: center; padding: 64px 16px; }
.pk-auth-card { width: 100%; max-width: 400px; background: #fff; border-radius: 10px; padding: 28px; box-shadow: 0 1px 2px rgba(20, 30, 60, .05); }
.pk-auth-card h1 { font-size: 20px; margin: 18px 0 14px; }
.pk-form { display: grid; gap: 12px; }
.pk-form label { display: grid; gap: 4px; color: var(--pk-muted); font-size: 13px; }
.pk-form input[type="text"], .pk-form input[type="password"] { font: inherit; padding: 9px 11px; border: 1px solid var(--pk-line); border-radius: 6px; color: var(--pk-text); }
.pk-form input:focus { outline: 2px solid var(--pk-accent-soft); border-color: var(--pk-accent); }
.pk-form button { font: inherit; font-weight: 600; padding: 10px; border: 0; border-radius: 6px; background: var(--pk-accent); color: #fff; cursor: pointer; }
.pk-form p { margin: 0; }
.pk-links { margin: 14px 0 0; font-size: 13px; }
.pk-alert-ok { background: #e7f6ee; border-color: #b6e2c8; color: var(--pk-ok); margin-bottom: 12px; }
.pk-auth-card .pk-alert-bad { margin-bottom: 12px; }

/* 只有三块：余额与充值、库存、资金流水。 */
.pk-main { max-width: 1100px; }
.pk-row-bal { grid-template-columns: 1fr 2fr; }
.pk-kv { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; text-align: center; }
.pk-kv b { display: block; font-size: 22px; font-weight: 700; font-variant-numeric: tabular-nums; }
.pk-kv span { color: var(--pk-muted); font-size: 12px; }
.pk-num { text-align: right !important; font-variant-numeric: tabular-nums; }
.pk-table tfoot td { font-weight: 600; background: #fafbfd; }
.pk-zero td { color: var(--pk-muted); }
@media (max-width: 1000px) { .pk-row-bal { grid-template-columns: 1fr; } }