/* Yizhong white / mint gradient palette, v263-r1; additive theme.
   Load after existing presentation sheets. Colours only: no geometry, fonts,
   visibility, interaction, business state or responsive breakpoint changes.
   Brand accents are explicitly separated from amber operational warnings. */

:root {
    --bp-blue: #17845d;
    --bp-violet: #0d6c4b;
    --bp-accent: #176b4d;
    --bp-accent-dark: #10533c;
    --bp-soft: #edf8f0;
    --bp-soft-hover: #e1f2e7;
    --bp-white: #ffffff;
    --bp-gradient: linear-gradient(115deg, #17845d 0%, #127650 58%, #0d6c4b 100%);
    --bp-gradient-hover: linear-gradient(115deg, #126b4c 0%, #0e593e 58%, #0d553c 100%);
    --bp-warning-accent: #d99516;
    --bp-warning-soft: #fff4de;
    --canvas: #f3faf5;
    --paper: #ffffff;
    --tint: #f7fcf8;
    --tint-1: #f7fcf8;
    --tint-2: #edf7f0;
    --rule: #d5e7dc;
    --rule-strong: #adcdbb;
    --steel: #7c9288;
    --ink: #183b2d;
    --ink-2: #355347;
    --text: #244638;
    --text-soft: #506a5d;
    --muted: #657d70;
    --signal: #16805b;
    --signal-hover: #0e593e;
    --signal-ink: #ffffff;
    --signal-soft: #edf8f0;
    --focus: #20865e;
    --brand: #176b4d;
    --brand-dark: #10533c;
    --brand-darker: #183b2d;
    --brand-light: #edf8f0;
    --brand-pale: #f7fcf8;
    --bg: #f3faf5;
    --surface: #ffffff;
    --surface-soft: #f7fcf8;
    --line: #d5e7dc;
    --line-dark: #adcdbb;
    --purple: #287555;
    --purple-bg: #ecf7ef;
    --info: #286b50;
    --info-bg: #eef8f1;
    --success: #1e7a4c;
    --success-bg: #e7f4ec;
    --success-line: #b9dcc6;
    --warning: #9a5b00;
    --warning-bg: #fff4de;
    --warning-line: #ecd29c;
    --danger: #c0362c;
    --danger-bg: #fdecea;
    --danger-line: #f0c2bc;
    --wb-ink: #183b2d;
    --wb-coral: #16805b;
    --wb-lime: #edf8f0;
    --wb-muted: #7c9288;
    --atelier-ink: #183b2d;
    --atelier-coral: #16805b;
    --atelier-lime: #edf8f0;
    --atelier-muted: #7c9288;
}

html, body { background-color: var(--canvas); color: var(--text); }
::selection { background-color: #d8efdf; color: #1f513c; }
a { color: var(--brand); }
a:hover { color: var(--brand-dark); }
input[type="checkbox"], input[type="radio"] { accent-color: var(--bp-accent); }
input::placeholder, textarea::placeholder { color: #6b8376; }

/* White shell, quiet tinted hovers, clear white-on-gradient active states. */
.app-header, .app-sidebar, .app-sidebar .sidebar-foot {
    background-color: var(--paper); border-color: var(--rule);
}
.sidebar-brand .brand, .sidebar-brand .brand:hover,
.sidebar-brand .brand-name, .app-header .brand-name { color: var(--ink); }
.header-context strong, .welcome strong { color: var(--ink); }
.header-search { background-color: var(--tint-1); border-color: var(--rule); }
.header-search:focus-within { border-color: var(--bp-accent); background-color: var(--paper); }
.header-search button { color: var(--bp-accent); border-color: var(--rule); }
.header-search button:hover { color: var(--bp-white); background-color: var(--bp-accent); border-color: var(--bp-accent); }
.header-icon { color: var(--bp-accent); }
.header-icon:hover, .header-icon:focus-visible { color: var(--brand-dark); background-color: var(--bp-soft); }
.avatar { color: var(--bp-white); background-color: var(--bp-blue); background-image: var(--bp-gradient); }
.app-sidebar .workspace-badge { color: var(--bp-accent-dark); background-color: var(--bp-soft); }
.app-sidebar .nav-group-toggle:hover, .app-sidebar .nav-group-toggle:focus-visible {
    color: var(--brand-dark); background-color: var(--bp-soft);
}
.app-sidebar .nav-group.has-active > .nav-group-toggle,
.app-sidebar .nav-group.is-open > .nav-group-toggle { color: var(--brand-dark); }
.app-sidebar .nav-group.has-active .nav-group-icon,
.app-sidebar .nav-group.is-open .nav-group-icon { color: var(--bp-accent); }
.app-sidebar .nav-item:hover, .app-sidebar .nav-item:focus-visible {
    color: var(--brand-dark); background-color: var(--bp-soft);
}
.app-sidebar .nav-item.active, .app-sidebar .nav-item.active:hover {
    color: var(--bp-white); background-color: var(--bp-blue); background-image: var(--bp-gradient);
}
.app-sidebar .nav-item.active::after { background-color: #d4eedf; }
.app-sidebar .nav-item.active .nav-icon { color: var(--bp-white); }
.app-sidebar .nav-item:not(.active):hover .nav-icon { color: var(--bp-accent); }
.sidebar-toggle, .page-tabs-scroll { color: var(--bp-accent); }
.sidebar-toggle span { background-color: var(--bp-accent); }
.page-tab.is-active, .page-tab.is-active .page-tab-link { color: var(--brand-dark); }
.page-tab.is-active::after, .tab-btn.active::after, .tabs button.active::after {
    background-color: var(--bp-accent); background-image: var(--bp-gradient);
}
.page-tab:hover::after { background-color: #acd7bc; }
.tab-btn:hover, .tab-btn.active, .tabs button:hover, .tabs button.active { color: var(--brand-dark); }

/* Action buttons: disabled and semantic variants are handled separately below. */
.btn-primary:not(:disabled):not([aria-disabled="true"]),
.btn.primary:not(:disabled):not([aria-disabled="true"]),
.create-reference .btn-primary:not(:disabled):not([aria-disabled="true"]),
.dispatch-hero .btn-primary:not(:disabled):not([aria-disabled="true"]),
.wb-slip .btn-cta:not(:disabled):not([aria-disabled="true"]),
.app-main .dp-workbench button.dp-primary:not(:disabled):not([aria-disabled="true"]),
.pagination button.active:not(:disabled),
.pagination button:hover:not(:disabled) {
    color: var(--bp-white); border-color: var(--bp-accent);
    background-color: var(--bp-blue); background-image: var(--bp-gradient);
}
.btn-primary:not(:disabled):not([aria-disabled="true"]):hover,
.btn.primary:not(:disabled):not([aria-disabled="true"]):hover,
.create-reference .btn-primary:not(:disabled):not([aria-disabled="true"]):hover,
.dispatch-hero .btn-primary:not(:disabled):not([aria-disabled="true"]):hover,
.wb-slip .btn-cta:not(:disabled):not([aria-disabled="true"]):hover,
.wb-slip .btn-cta:not(:disabled):not([aria-disabled="true"]):focus-visible,
.app-main .dp-workbench button.dp-primary:not(:disabled):not([aria-disabled="true"]):hover {
    color: var(--bp-white); border-color: var(--brand-dark);
    background-color: #126b4c; background-image: var(--bp-gradient-hover);
}
.btn-ghost, .btn.ghost, .btn-link { color: var(--bp-accent); }
.btn-ghost:not(:disabled):hover, .btn-ghost:not(:disabled):focus-visible,
.btn.ghost:not(:disabled):hover, .btn.ghost:not(:disabled):focus-visible {
    color: var(--brand-dark); background-color: var(--bp-soft); border-color: #acd7bc;
}
.btn-address { color: var(--brand-dark); background-color: var(--bp-soft); border-color: #c1dfcd; }
.btn-primary:disabled, .btn-primary:disabled:hover,
.btn.primary:disabled, .btn.primary:disabled:hover,
.wb-slip .btn-cta:disabled, .wb-slip .btn-cta:disabled:hover,
.app-main .dp-workbench button.dp-primary:disabled,
.app-main .dp-workbench button.dp-primary:disabled:hover {
    color: #ffffff; background-color: #7c9288; background-image: none; border-color: #7c9288;
}

/* Dashboard rules, bars and highlights; do not recolour warning/danger metrics. */
.wb-slip::before, .stat-card:not(.warning):not(.danger):not(.success)::before {
    background-color: var(--bp-accent); background-image: var(--bp-gradient);
}
.wb-tag { color: var(--bp-accent); border-color: var(--bp-accent); }
.wb-slip-number { color: #1d5039; }
.stat-card:not(.danger):not(.warning) .stat-value { color: #1d5039; }
.stat-icon, .stat-card.purple .stat-icon { color: var(--bp-accent); background-color: var(--bp-soft); }
.wb-bar-fill { background-color: #5d9b77; }
/* Existing app.js says yellow identifies the latest day. Preserve that data
   encoding; only the ordinary bars change to blue. No business JS is modified. */
.wb-bar.is-today .wb-bar-fill { background-color: #ffc425; background-image: none; }
.wb-bars-axis .is-today, .chart-summary strong { color: var(--brand-dark); }
.chart-summary i { background-color: var(--bp-accent); }
.todo-mark:not(.warning):not(.success):not(.danger) { color: var(--bp-accent); background-color: var(--bp-soft); }
.quick-tile > .ui-icon { color: var(--bp-accent); }
.quick-tile:hover { border-color: var(--bp-accent); }
.dispatch-hero, .hero-banner { background-color: var(--bp-soft); border-color: #cde5d5; }
.dispatch-art, .hero-art { color: var(--bp-accent); }
.dispatch-art .accent, .dispatch-art .route-accent { color: var(--bp-violet); }
.security-banner, .invite-card { border-left-color: var(--bp-accent); }
.guide-step > span { color: var(--bp-white); background-color: var(--bp-accent); }

/* Forms, choices and ledger surfaces retain the original sizes and scroll model. */
.form-field input:focus, .form-field select:focus, .form-field textarea:focus,
.filter-grid input:focus, .filter-grid select:focus, .filter-grid textarea:focus,
.input:focus, .select:focus, .textarea:focus,
.create-reference input:focus, .create-reference select:focus,
.open-service-fields input:focus, .open-service-fields select:focus,
.app-main .dp-workbench input:focus, .app-main .dp-workbench select:focus,
.app-main .ls-fields input:focus, .app-main .ls-fields select:focus,
.app-main .ls-fields textarea:focus, .app-main .ls-cargo-fields input:focus {
    border-color: var(--bp-accent); box-shadow: 0 0 0 3px #20865e18;
}
:where(button, a, summary, input, select, textarea, [tabindex]):focus-visible,
body[data-design="waybill"] :is(button, a, summary, input, select, textarea, [tabindex]):focus-visible {
    outline-color: var(--focus) !important;
}
.switch input:checked + .switch-track { background-color: var(--bp-accent); }
.create-reference { --brand: #176b4d; --brand-dark: #10533c; --brand-light: #edf8f0; }
.create-submit-panel { border-top-color: var(--bp-accent) !important; }
.reference-presets button.active,
.create-parcel .reference-presets button.active,
.create-parcel .parcel-goods .reference-presets button.active,
.order-business-category[aria-pressed="true"],
.app-main .ls-page .ls-seat[aria-pressed="true"] {
    color: var(--bp-white); background-color: var(--bp-accent); border-color: var(--bp-accent);
}
.order-business-category[aria-pressed="true"] span { color: #ffffff; background-color: #ffffff24; }
.app-main .ls-page .ls-seat[aria-pressed="true"] small { color: #eef8f1; }
.order-channel-choice:has(input:checked), .courier-choice:has(input:checked),
.open-service-quote:has(input:checked) {
    background-color: var(--bp-soft); border-color: var(--bp-accent);
    box-shadow: inset 0 0 0 1px var(--bp-accent);
}
.address-target label:has(input:checked) { background-color: var(--bp-soft); border-color: var(--bp-accent); color: var(--brand-dark); }
.data-table thead th, .order-table th:last-child,
.channel-config-page .channel-config-table th,
.channel-config-page .channel-config-table th:last-child {
    background-color: var(--tint-1); color: var(--text-soft); border-bottom-color: var(--rule);
}
.data-table tbody tr:hover, .data-table tbody tr:hover td,
.order-table tbody tr:hover td:last-child,
.channel-config-page .channel-config-table tbody tr:hover td:last-child { background-color: #f0f9f3; }
.channel-config-page .channel-category.active,
.channel-config-page .channel-provider-toggle[aria-expanded="true"],
.channel-config-page .channel-pricing-group.active, .merchant-group-choice.active {
    color: var(--bp-white); background-color: var(--bp-accent); border-color: var(--bp-accent);
}
.channel-config-page .channel-category.active span,
.channel-pricing-group.active span, .merchant-group-choice.active strong,
.merchant-group-choice.active span { color: #eef8f1; }

/* Provider CSS may be loaded lazily: keep the existing scoped specificity. */
.app-main .dp-workbench .dp-panel, .app-main .dp-workbench .dp-record,
.app-main .dp-workbench .dp-quote, .app-main .ls-page .ls-choice,
.app-main .ls-page .ls-record { background-color: var(--paper); border-color: var(--rule); }
.app-main .dp-workbench .dp-badge, .app-main .dp-production .dp-prod-badge,
.app-main .dp-prod-stage-number { color: var(--brand-dark); background-color: var(--bp-soft); border-color: #c1dfcd; }
.app-main .dp-production .dp-prod-scope { background-color: var(--tint-1); border-left-color: var(--bp-accent); }
.app-main .dp-prod-stages > article, .app-main .dp-prod-flags > div { background-color: var(--tint-1); border-color: var(--rule); }
.app-main .dp-workbench button:not(.dp-primary):not(.dp-danger):not(:disabled):hover {
    color: var(--brand-dark); background-color: var(--bp-soft); border-color: #acd7bc;
}
.app-main .dp-workbench input, .app-main .dp-workbench select,
.app-main .ls-fields input, .app-main .ls-fields select,
.app-main .ls-fields textarea, .app-main .ls-cargo-fields input {
    color: var(--text); background-color: var(--paper);
}
.app-main .dp-workbench summary, .app-main .ls-page .ls-raw summary,
.app-main .ls-page .ls-result-list summary { color: var(--brand-dark); }
.app-main .dp-workbench .dp-price { color: #1d5039; }

/* Login uses its own stylesheet and an inline currentColor brand mark. */
.login-layout .slip-top { color: #ffffff; background-color: var(--bp-blue); background-image: var(--bp-gradient); }
.login-layout .login-brand, .login-layout .brand-symbol { color: #ffffff; }
.login-layout .slip-kind { color: #edf8f0; }
.login-layout .slip-code { border-bottom-color: var(--bp-accent); }
.login-layout .slip-tag { color: var(--bp-accent); border-color: var(--bp-accent); }
.login-layout .login-button { color: #ffffff; background-color: var(--bp-blue); background-image: var(--bp-gradient); }
.login-layout .login-button:hover:not(:disabled) { background-color: #126b4c; background-image: var(--bp-gradient-hover); }
.login-layout .login-button:disabled { background-color: #7c9288; background-image: none; }
.login-layout .input-group input:focus { border-color: var(--bp-accent); box-shadow: 0 0 0 3px #20865e18; }
.login-layout .input-group:focus-within > svg { stroke: var(--bp-accent); }
.login-layout .remember input { accent-color: var(--bp-accent); }
.login-layout .button-loading { border-top-color: #ffffff; }
.login-layout .password-toggle:hover::before { background-color: var(--bp-accent); }

/* Semantic feedback is not branding. Keep amber / red / green and their states. */
.btn-warning, .btn.warning, .btn.yellow,
.btn-warning:hover, .btn.warning:hover, .btn.yellow:hover {
    color: var(--warning); background-color: var(--warning-bg);
    background-image: none; border-color: var(--warning-line);
}
.btn-danger, .btn.danger, .btn.red {
    color: var(--danger); background-color: var(--danger-bg); background-image: none; border-color: var(--danger-line);
}
.btn-danger:hover, .btn.danger:hover, .btn.red:hover {
    color: #ffffff; background-color: var(--danger); background-image: none; border-color: var(--danger);
}
.btn-success, .btn.success, .btn.green {
    color: var(--success); background-color: var(--success-bg); background-image: none; border-color: var(--success-line);
}
.btn-success:hover, .btn.success:hover, .btn.green:hover {
    color: #ffffff; background-color: var(--success); background-image: none; border-color: var(--success);
}
.confirm-box.warning, .alert-warning, .page-cache-notice,
.channel-config-page .product-rebuild-notice {
    color: var(--warning); background-color: var(--bp-warning-soft); border-color: var(--warning-line);
}
.confirm-box.warning { border-left-color: var(--bp-warning-accent); }
.confirm-box.warning strong { color: #794800; }
.todo-mark.warning { color: #794800; background-color: #ffe7ad; }
.toast.warning::before, .toast-item.warning::before { background-color: #f1b747; }
.stat-card.warning::before,
body[data-active-page="dashboard"] .stat-card.warning::before {
    background-color: var(--bp-warning-accent); background-image: none;
}
.stat-card.danger::before { background-color: var(--danger); background-image: none; }
.stat-card.success::before { background-color: var(--success); background-image: none; }
.stat-card.danger .stat-value { color: var(--danger); }
.channel-pricing-row--review td:first-child { box-shadow: inset 4px 0 0 var(--bp-warning-accent); }
.wb-review { border-top-color: var(--bp-warning-accent); }
.app-main .dp-workbench .dp-warning, .app-main .dp-prod-stages .dp-prod-acceptance {
    color: var(--warning); background-color: var(--warning-bg); border-color: var(--warning-line);
}
.app-main .dp-workbench .dp-warning { border-left-color: var(--warning); }
.app-main .dp-workbench .dp-message { color: var(--warning); }
.app-main .dp-workbench .dp-ok { color: var(--success); }
.app-main .dp-workbench button.dp-danger { color: var(--danger); border-color: var(--danger-line); }
.data-table .amount-cell.is-negative { color: var(--danger) !important; }
.data-table .amount-cell.is-negative small { color: var(--danger); }
.wb-wallet-hint.is-low { color: var(--danger) !important; background-color: var(--danger-bg); }
.wb-wallet-hint.is-low::before { background-color: var(--danger); }
.login-layout .login-error { color: var(--danger); }
.login-layout .login-error:not(:empty) { background-color: var(--danger-bg); border-left-color: var(--danger); }

/* Existing print rules still own visibility and layout. */
@media print {
    html, body { background-color: #ffffff; color: #000000; }
}

/* White-to-mint surfaces. Geometry, display, position and permissions untouched. */
html, body { background: #f2faf5; }
body { background: linear-gradient(135deg, #ffffff 0%, #f0faf4 55%, #e6f5eb 100%); }
.app-main { background: linear-gradient(145deg, #ffffff 0%, #f5fbf7 48%, #eaf7ef 100%); }
.app-sidebar { background: linear-gradient(165deg, #ffffff 0%, #f3fbf6 45%, #ddf1e4 100%) !important; }
.app-header { background: linear-gradient(105deg, #ffffff 0%, #f7fcf9 60%, #eaf7ef 100%) !important; border-color: #d5e7dc; }
.sidebar-brand, .workspace-label, .sidebar-foot { background-color: transparent !important; }
.app-main .card, .app-main .filter-card, .app-main .wb-slip,
.app-main .dp-panel, .app-main .ls-panel, .modal-card {
    background-image: linear-gradient(145deg, #ffffff 15%, #f1faf4 100%);
    border-color: #d5e7dc;
}
.card-head, .modal-head, .modal-actions { background-image: linear-gradient(110deg, #ffffff 0%, #edf8f1 100%); }
.stat-card:not(.warning):not(.danger):not(.success) { background-image: linear-gradient(135deg, #ffffff 0%, #eaf7ef 100%); }
.login-story { background: radial-gradient(ellipse at 20% 20%, #ffffff 0%, #eff9f3 48%, #d8efdf 100%); }
.login-form-area { background: linear-gradient(155deg, #ffffff 30%, #f0faf4 100%); border-color: #d5e7dc; }
.login-panel { background-image: linear-gradient(145deg, #ffffff 20%, #f7fcf9 100%); }
.slip { background: linear-gradient(145deg, #ffffff 15%, #f1faf4 100%); box-shadow: 0 30px 60px -30px #1c6b4140; }
.slip-kind { color: #e4f7ec; }
::selection { background: #ccebd8; color: #183b2d; }
@media print {
    html, body, .app-main, .app-sidebar, .app-header, .login-story,
    .login-form-area, .login-panel, .slip, .modal-card,
    .app-main .card, .app-main .filter-card, .app-main .wb-slip,
    .card-head, .modal-head, .modal-actions,
    .stat-card:not(.warning):not(.danger):not(.success) {
        background: #fff !important; background-image: none !important;
    }
}