/* 两个封面：浅色（B 清爽浅色）和深色（C）。放在其他样式表的最后加载，覆盖原来的金黄/深灰配色和写死的宽度。 */

html[data-skin=light]{
  --bg:#f7f7f9;--bar:#ffffff;--panel:#ffffff;--panel2:#fafafb;--soft:#f3f1e6;--thead:#f7f7fa;
  --ink:#1f2430;--mute:#7d8494;--line:#ececf0;--line-strong:#d9dbe3;--hover:#f6f4ea;
  --accent:#f0b429;--accent-ink:#1f2430;--red:#d64545;--up:#1f9d63;--field:#ffffff;--link:#1f2430;
  --shadow:0 1px 2px #0000000a;--pop:0 12px 32px #1f243022;color-scheme:light;
}
html[data-skin=dark]{
  --bg:#0e1522;--bar:#0a101b;--panel:#162033;--panel2:#111a2b;--soft:#1d2a42;--thead:#122036;
  --ink:#e8edf6;--mute:#8b98b3;--line:#233049;--line-strong:#33446a;--hover:#1b2840;
  --accent:#f5c04a;--accent-ink:#1f2430;--red:#ef6b6b;--up:#37c28a;--field:#0f1828;--link:#e8edf6;
  --shadow:none;--pop:0 12px 32px #0008;color-scheme:dark;
}

/* ===== 全局 ===== */
html[data-skin]{background:var(--bg)}
html[data-skin] body{background:var(--bg)!important;background-image:none!important;color:var(--ink);font:14px/1.55 -apple-system,"PingFang SC","Microsoft YaHei","Segoe UI",sans-serif}
html[data-skin] a{color:var(--link)}
html[data-skin] .hint,html[data-skin] .footer-note{color:var(--mute)}
html[data-skin] hr{border:0;border-top:1px solid var(--line)}

/* ===== 顶栏 ===== */
html[data-skin] .topbar{height:auto!important;min-height:56px;padding:6px 22px!important;background:var(--bar)!important;background-image:none!important;border:0!important;border-bottom:1px solid var(--line)!important;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
html[data-skin] .topbar .brand{color:var(--ink)!important;font-size:19px!important;font-weight:800;letter-spacing:0}
html[data-skin] .topbar .brand:before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--accent);margin-right:8px}
html[data-skin] .topbar .info,html[data-skin] .topbar .info a,html[data-skin] .topbar .info button,html[data-skin] .language-switch button{color:var(--mute)!important;font-size:13px}
html[data-skin] .topbar .info a{margin-left:0;text-decoration:none}
html[data-skin] .topbar .info a:hover,html[data-skin] .language-switch button:hover{color:var(--ink)!important}
html[data-skin] .topbar .info form{margin:0;display:inline}
html[data-skin] .language-switch button.active{color:var(--ink)!important;font-weight:700;text-decoration:none}
html[data-skin] .skin-toggle{background:var(--soft);border-radius:999px;padding:3px 12px;color:var(--ink)!important;font-weight:600}
html[data-skin] .plain-language-switch{background:var(--panel)!important;border:1px solid var(--line);border-radius:999px;padding:6px 14px!important;color:var(--mute)}
html[data-skin] .plain-language-switch button,html[data-skin] .plain-language-switch a{color:var(--mute)!important;text-decoration:none}

/* ===== 页面骨架和菜单 ===== */
html[data-skin] .layout{padding-top:0!important;background:none!important;min-height:0!important;display:block;position:static}
html[data-skin] .layout:before{display:none!important}
html[data-skin] .reference-announcement{position:static!important;background:none!important;color:var(--mute)!important;font-size:13px;padding:8px 22px 0}
html[data-skin] .sidebar{background:var(--bar)!important;width:auto;flex:none}
html[data-skin] .side-group{border:0!important;background:none!important;margin:0}
html[data-skin] .side-group h3{background:none!important;border:0!important;border-top:0!important;color:var(--mute)!important;font-size:14px!important;font-weight:600!important;margin:0;outline:0}
html[data-skin] .sidebar ul{list-style:none;margin:0;padding:0;border:0!important}
html[data-skin] .sidebar ul li a{display:block;color:var(--ink)!important;text-decoration:none;font-size:14px;line-height:1.4}
html[data-skin] .sidebar ul li a.active{background:var(--soft);font-weight:700;color:var(--ink)!important}
html[data-skin] .sidebar ul li a:hover{background:var(--hover)}
html[data-skin] .footer-note{margin:0}

/* 两个封面都是：左边竖菜单 */
html[data-skin] .layout{display:grid;grid-template-columns:208px minmax(0,1fr);grid-template-rows:auto 1fr;align-items:start}
html[data-skin] .sidebar{grid-row:1 / span 2;grid-column:1;min-height:calc(100vh - 57px);padding:16px 10px!important;border-right:1px solid var(--line)}
html[data-skin] .reference-announcement{grid-column:2;grid-row:1}
html[data-skin] .content{grid-column:2;grid-row:2}
html[data-skin] .side-group{margin-bottom:14px}
html[data-skin] .side-group h3{font-size:12px!important;letter-spacing:.08em;padding:6px 12px!important}
html[data-skin] .sidebar ul li a{padding:8px 12px!important;border-radius:10px;color:var(--ink)!important}
html[data-skin] .sidebar ul li a.active{background:var(--soft);color:var(--accent)!important}
html[data-skin] .footer-note{font-size:12px;margin-top:24px;padding:0 12px;text-align:left}

/* ===== 内容区、面板 ===== */
html[data-skin] .content{background:none!important;min-height:0!important;padding:22px!important;min-width:0;overflow-x:auto}
html[data-skin] .panel{background:var(--panel)!important;border:1px solid var(--line)!important;border-radius:16px;box-shadow:var(--shadow);margin-bottom:18px;color:var(--ink)}
html[data-skin] .panel h2{background:none!important;background-image:none!important;border:0!important;border-top:0!important;color:var(--ink)!important;font-size:19px!important;font-weight:700;padding:16px 20px 2px!important;margin:0!important;line-height:1.4}
html[data-skin] .panel .body{padding:12px 20px 22px!important}
html[data-skin] .panel h3{color:var(--mute)}
html[data-skin] .panel .panel{box-shadow:none}

/* ===== 按钮 ===== */
html[data-skin] .btn{background:var(--accent)!important;background-image:none!important;color:var(--accent-ink)!important;border:0!important;border-radius:10px!important;box-shadow:none!important;font-size:14px;font-weight:700;height:auto!important;line-height:1.3!important;padding:9px 18px!important;min-width:0!important;width:auto!important;text-decoration:none}
html[data-skin] .btn:hover{filter:brightness(.95)}
html[data-skin] .btn.secondary{background:var(--soft)!important;color:var(--ink)!important;border:1px solid var(--line-strong)!important}
html[data-skin] .btn.small{padding:5px 12px!important;height:auto!important;line-height:1.3!important;font-size:13px}
html[data-skin] .reference-toolbar .btn,html[data-skin] .customer-search .btn,html[data-skin] .account-search .btn,html[data-skin] .member-search .btn,html[data-skin] .adjustment-list-panel .btn,html[data-skin] .customer-actions .btn,html[data-skin] .reference-actions .btn,html[data-skin] .transfer-actions .btn{width:auto!important;height:auto!important}
html[data-skin] .logout-link{background:none;border:0;cursor:pointer;padding:0}
html[data-skin] .tiny,html[data-skin] .row-delete,html[data-skin] .delete-icon{color:var(--ink)}
html[data-skin] .tiny[disabled]{opacity:.3}
html[data-skin] .formula-link,html[data-skin] .customer-actions>a,html[data-skin] .reference-actions>a{color:var(--link)!important}

/* ===== 表单 ===== */
html[data-skin] input:not([type=checkbox]):not([type=radio]),html[data-skin] select,html[data-skin] textarea{background:var(--field)!important;color:var(--ink)!important;border:1px solid var(--line-strong)!important;border-radius:8px!important;font-family:inherit;font-size:14px}
html[data-skin] input:not([type=checkbox]):not([type=radio]):focus,html[data-skin] select:focus,html[data-skin] textarea:focus{outline:2px solid var(--accent);outline-offset:0}
html[data-skin] input:not([type=checkbox]):not([type=radio]),html[data-skin] select{min-height:32px}
html[data-skin] select{padding:3px 8px}
html[data-skin] input[type=checkbox],html[data-skin] input[type=radio]{accent-color:var(--accent)}
html[data-skin] .form-row label,html[data-skin] .filter-form label,html[data-skin] .customer-search label,html[data-skin] .account-search label,html[data-skin] .member-search label,html[data-skin] .adjustment-list-panel .adjustment-search label,html[data-skin] .remark-row label,html[data-skin] .member-formula-add label,html[data-skin] .transfer-search label,html[data-skin] .quick-table-search,html[data-skin] .remark-settings p{color:var(--mute)!important}
html[data-skin] .remark-settings{background:var(--panel2)!important}
html[data-skin] .required{color:var(--red)}
html[data-skin] .customer-form .phone-hint,html[data-skin] .subordinate-chip,html[data-skin] .member-fixed-value{color:var(--mute)}
html[data-skin] .raw-data{background:var(--field)!important;color:var(--ink)!important;border:1px solid var(--line-strong)!important;border-radius:8px}
html[data-skin] .raw-toolbar input{border:1px solid var(--line-strong)}
html[data-skin] .autosave-state{color:var(--mute)}

/* ===== 表格 ===== */
html[data-skin] table.grid,html[data-skin] .transfer-grid,html[data-skin] .source-grid{background:var(--panel)!important;color:var(--ink)!important;border-collapse:separate;border-spacing:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;font-family:inherit}
html[data-skin] table.grid th,html[data-skin] .transfer-grid th,html[data-skin] .source-grid th{background:var(--thead)!important;background-image:none!important;color:var(--mute)!important;font-weight:600!important;font-size:12px!important;border:0!important;border-bottom:1px solid var(--line)!important;padding:8px 8px!important}
html[data-skin] table.grid td,html[data-skin] .transfer-grid td,html[data-skin] .source-grid td{background:transparent!important;color:var(--ink)!important;border:0!important;border-bottom:1px solid var(--line)!important;font-size:13px!important}
html[data-skin] table.grid tr:nth-child(even) td{background:transparent!important}
html[data-skin] table.grid tbody tr:hover td,html[data-skin] .source-grid tr:hover td{background:var(--hover)!important}
html[data-skin] table.grid tr:last-child td{border-bottom:0!important}
html[data-skin] .grid .subtotal td,html[data-skin] .grid tfoot td,html[data-skin] .grid .contra td,html[data-skin] .grid .bf td{background:var(--soft)!important;font-weight:600}
html[data-skin] .grid td.number{font-variant-numeric:tabular-nums}
html[data-skin] table a,html[data-skin] .grid a,html[data-skin] .transfer-grid a,html[data-skin] .transfer-balances a{color:var(--link)!important;text-decoration:none}
html[data-skin] table a:hover{text-decoration:underline}
html[data-skin] .balance-pos,html[data-skin] table.grid .balance-pos{color:var(--ink)!important;font-weight:400}
html[data-skin] .balance-neg,html[data-skin] table.grid .balance-neg{color:var(--red)!important;font-weight:400}
html[data-skin] .grid td[style*="background"],html[data-skin] .grid tr[style*="background"] td{background:var(--soft)!important}
html[data-skin] .adjustment-list-grid .adjustment-date,html[data-skin] .adjustment-list-grid .adjustment-note,html[data-skin] .customer-grid .customer-note,html[data-skin] .transfer-grid .blue,html[data-skin] .transfer-grid .amount,html[data-skin] .transfer-grid .note,html[data-skin] .source-grid td{color:var(--ink)!important}
html[data-skin] .adjustment-list-grid .adjustment-customer{color:var(--ink)!important}
html[data-skin] .report-section h3{color:var(--ink)}
html[data-skin] .tag{border-radius:999px}
html[data-skin] .tag.active{background:#37c28a22;color:var(--up)}
html[data-skin] .tag.suspended{background:#ef6b6b22;color:var(--red)}

/* ===== 提示框 ===== */
html[data-skin] .error-box{background:#ef6b6b1f;border:1px solid #ef6b6b66;color:var(--red);border-radius:10px;padding:10px 14px}
html[data-skin] .ok-box{background:#37c28a1f;border:1px solid #37c28a66;color:var(--up);border-radius:10px;padding:10px 14px}
html[data-skin=light] .error-box{color:#b32424}
html[data-skin=light] .ok-box{color:#17784a}

/* ===== 客户转账（左右两块）和各个写死宽度的页面，改成能自动换行 ===== */
html[data-skin] .customer-transfer-panel{width:auto!important;min-width:1360px!important;max-width:none!important}
html[data-skin] .panel:has(.transfer-panes){max-width:none}
html[data-skin] .panel:has(.transfer-panes)>h2{display:none}
html[data-skin] .customer-transfer-panel .transfer-panes,html[data-skin] .transfer-panes{display:grid;grid-template-columns:5fr 6fr!important;gap:14px}
html[data-skin] .customer-transfer-panel .transfer-panes>section,html[data-skin] .transfer-panes section{background:var(--panel)!important;border:1px solid var(--line)!important;border-radius:14px;padding:14px!important;width:auto!important;max-width:none!important;min-height:0!important}
html[data-skin] .transfer-panes h3,html[data-skin] .customer-transfer-panel .transfer-panes>section h3{background:none!important;color:var(--ink)!important;margin:0 0 12px!important;padding:0!important;height:auto!important;font-weight:700;font-size:15px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
html[data-skin] .transfer-panes section:first-child .filter-form,html[data-skin] .customer-transfer-panel .transfer-panes>section:first-child .filter-form{display:flex!important;flex-wrap:wrap;gap:10px 16px;padding:0!important;margin:0 0 16px!important;grid-template-columns:none!important}
html[data-skin] .transfer-panes input[type=date]{width:auto!important}
html[data-skin] .page-tabs,html[data-skin] .panel:has(.transfer-panes) .page-tabs{background:none!important;margin:0 0 14px!important;padding:0!important;display:flex;gap:6px;flex-wrap:wrap}
html[data-skin] .page-tabs a{color:var(--mute)!important;text-decoration:none;padding:6px 14px;border-radius:999px;font-size:14px}
html[data-skin] .page-tabs a:first-child{background:var(--soft);color:var(--ink)!important;font-weight:700}
html[data-skin] .customer-transfer-panel #create-transfer .form-row{flex-wrap:nowrap!important;gap:8px!important;align-items:center}
html[data-skin] .customer-transfer-panel #create-transfer .form-row>label{width:auto!important;flex:0 0 auto!important;padding-left:0!important}
html[data-skin] .customer-transfer-panel #create-transfer select{width:245px!important;flex:0 0 245px!important;height:auto!important}html[data-skin] .customer-transfer-panel #create-transfer input[name=amount]{width:245px!important;flex:0 0 245px!important;height:auto!important}html[data-skin] .customer-transfer-panel #create-transfer input[name=note]{width:290px!important;flex:0 0 290px!important;height:auto!important}
html[data-skin] .customer-transfer-panel .transfer-balances,html[data-skin] .transfer-balances{display:grid;grid-template-columns:1fr 1fr!important;gap:14px;width:auto!important;max-width:none!important;align-items:start}
html[data-skin] .transfer-balances td{padding:6px 8px!important;height:auto!important}
html[data-skin] .embedded-adjustment,html[data-skin] .customer-transfer-panel .embedded-adjustment{display:block!important;padding:0}
html[data-skin] .transfer-panes form[hidden],html[data-skin] .embedded-adjustment[hidden]{display:none!important}
html[data-skin] .embedded-adjustment>.form-row{flex-wrap:wrap!important;margin:0 0 10px!important;min-height:0!important}
html[data-skin] .embedded-adjustment .form-row label{min-width:0}
html[data-skin] .embedded-adjustment input[type=text],html[data-skin] .embedded-adjustment>.form-row select[name=customer_id]{width:min(245px,100%)!important}
html[data-skin] .adjustment-type-fields{flex-wrap:wrap;gap:4px}
html[data-skin] .reference-list-panel,html[data-skin] .reference-form-panel,html[data-skin] .adjustment-list-panel{min-width:0!important}
html[data-skin] .transfer-search{height:auto!important;max-width:none!important;margin-left:0!important;display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center}
html[data-skin] .transfer-search label,html[data-skin] .transfer-search .search,html[data-skin] .transfer-search .add{position:static!important;height:auto!important}
html[data-skin] .transfer-search select,html[data-skin] .transfer-search input{height:auto!important;width:auto!important}
html[data-skin] .transfer-actions{display:flex!important;flex-wrap:wrap;gap:10px;margin:0 0 16px!important;height:auto!important}
html[data-skin] .transfer-grid{width:100%!important;table-layout:auto!important}
html[data-skin] .adjustment-list-panel .adjustment-search,html[data-skin] .adjustment-search{display:flex!important;flex-wrap:wrap;gap:10px 16px;margin:0 0 18px!important;grid-template-columns:none!important;grid-template-rows:none!important}
html[data-skin] .adjustment-search input,html[data-skin] .adjustment-list-panel .adjustment-search input{height:auto!important}
html[data-skin] .customer-search,html[data-skin] .account-search,html[data-skin] .member-search{flex-wrap:wrap;gap:10px 18px!important;margin:0 0 18px!important}
html[data-skin] .customer-search input,html[data-skin] .account-search input{height:auto!important}
html[data-skin] .customer-form input:not([type=checkbox]),html[data-skin] .reference-form input:not([type=checkbox]){height:auto!important}
html[data-skin] .customer-form .form-row,html[data-skin] .reference-form .form-row{flex-wrap:wrap!important;margin:0 0 10px!important}
html[data-skin] .customer-form select,html[data-skin] .reference-form select{height:auto!important}
html[data-skin] .website-list-grid,html[data-skin] .account-list-grid,html[data-skin] .currency-list-grid,html[data-skin] .bank-list-grid,html[data-skin] .member-list-grid,html[data-skin] .member-formula-grid,html[data-skin] .adjustment-list-grid{max-width:100%}
html[data-skin] .reference-toolbar{flex-wrap:wrap;margin:0 0 18px}
html[data-skin] .toolbar{flex-wrap:wrap}
html[data-skin] .data-scroll,html[data-skin] .transfer-scroll{overflow:auto;max-width:100%}
html[data-skin] .compact-dialog{background:var(--panel)!important;color:var(--ink)!important;border:1px solid var(--line-strong)!important;border-radius:16px;box-shadow:var(--pop)}
html[data-skin] .compact-dialog::backdrop{background:#0008}
html[data-skin] .compact-dialog header{background:var(--soft)!important;color:var(--ink)!important;border-radius:16px 16px 0 0;font-weight:700}
html[data-skin] .compact-dialog .close{color:var(--mute)}
html[data-skin] .select-search-input,html[data-skin] .quick-table-search input{background:var(--field)!important;color:var(--ink)!important}

/* ===== 登录页和首页 ===== */
html[data-skin] .login-wrap,html[data-skin] .home-wrap{background:var(--bg)!important;background-image:none!important}
html[data-skin] .login-box,html[data-skin] .home-box{background:var(--panel)!important;border:1px solid var(--line)!important;border-radius:18px;color:var(--ink);box-shadow:var(--pop)}
html[data-skin] .login-box h1,html[data-skin] .home-box h1{color:var(--ink)}
html[data-skin] .login-box .form-row label{color:var(--mute)!important}
html[data-skin] .home-box a:not(.btn),html[data-skin] .login-links a{color:var(--mute)}

/* ===== 客户自己登录看到的页面里的黄色提示条 ===== */
html[data-skin] [style*="fff3c4"]{background:var(--soft)!important;color:var(--ink)!important;border-radius:10px}

@media print{html[data-skin] .topbar,html[data-skin] .sidebar,html[data-skin] .reference-announcement{display:none!important}html[data-skin] body,html[data-skin] .panel{background:#fff!important;color:#000}}

html[data-skin=dark] .sidebar ul li a{color:#c9d3e8!important}
html[data-skin=dark] .sidebar ul li a.active{background:var(--panel);color:var(--accent)!important}/* 菜单字分深浅：大标题深色加粗，下面的项目浅一点，正在看的那页黄色 */
html[data-skin] .side-group h3{color:var(--ink)!important;font-weight:800!important;font-size:13px!important}
html[data-skin] .sidebar ul li a{color:#6b7180!important}
html[data-skin] .sidebar ul li a:hover{color:var(--ink)!important}
html[data-skin=dark] .side-group h3{color:#f2f5fb!important}
html[data-skin=dark] .sidebar ul li a{color:#93a0ba!important}
html[data-skin=dark] .sidebar ul li a:hover{color:#e8edf6!important}
html[data-skin] .sidebar ul li a.active{color:var(--accent)!important;font-weight:700}