/* Shared theme tokens complement styles.css; status badges keep their meanings. */
body[data-theme] .brand-mark, body[data-theme] .btn.primary, body[data-theme] .pagination button.active {
  color: var(--on-primary);
}
body[data-theme] .welcome-banner, body[data-theme] .login-art {
  background: var(--hero);
  border-color: var(--hero-border);
}
body[data-theme] .welcome-banner h2, body[data-theme] .login-intro h1 { color: var(--theme-text); }
body[data-theme] .welcome-banner p, body[data-theme] .welcome-banner .eyebrow,
body[data-theme] .welcome-banner .banner-links button, body[data-theme] .banner-meta,
body[data-theme] .login-intro p, body[data-theme] .login-intro .eyebrow, body[data-theme] .login-footer {
  color: var(--theme-soft-text);
}
body[data-theme] .banner-art { filter: var(--art-filter); }
body[data-theme] .login-art:after { border-color: var(--hero-border); }
body[data-theme] .workspace-avatar, body[data-theme] .avatar, body[data-theme] .nav-link .count {
  background: var(--mint);
  color: var(--green);
}
body[data-theme] .nav-link.active, body[data-theme] .stat-card:first-child .stat-icon,
body[data-theme] .audit-dot, body[data-theme] .product-preview, body[data-theme] .app-filter .active {
  background: var(--mint);
  color: var(--green);
}
body[data-theme] .nav-link, body[data-theme] .nav-group { color: var(--muted); }
body[data-theme] .nav-link.active { color: var(--green); }
body[data-theme] .nav-dot { background: var(--line); }
body[data-theme] .nav-link.active .nav-dot { background: var(--green); }
body[data-theme] .workspace-select, body[data-theme] .quick-item, body[data-theme] .detail-note,
body[data-theme] .command-hint, body[data-theme] .kanban-col, body[data-theme] .modal-footer,
body[data-theme] .data-table th, body[data-theme] .segmented, body[data-theme] .login-demo {
  background: var(--bg);
  border-color: var(--line);
}
body[data-theme] .data-table td, body[data-theme] .data-table .code, body[data-theme] .detail-field div,
body[data-theme] .data-table .name-cell, body[data-theme] .form-field, body[data-theme] .help-content,
body[data-theme] .cost-bar-row strong { color: var(--ink); }
body[data-theme] .data-table tbody tr:hover, body[data-theme] .segmented button.active,
body[data-theme] .quick-item:hover { background: var(--mint); }
body[data-theme] .segmented button.active, body[data-theme] .quick-item, body[data-theme] .quick-item svg,
body[data-theme] .ring-legend strong, body[data-theme] .help-content h3, body[data-theme] .form-field .form-hint,
body[data-theme] .command-search, body[data-theme] .login-demo strong { color: var(--green); }
body[data-theme] .form-field input, body[data-theme] .form-field select, body[data-theme] .form-field textarea,
body[data-theme] .quick-item, body[data-theme] .app-card { border-color: var(--line); }
body[data-theme] .form-field input:focus, body[data-theme] .form-field select:focus,
body[data-theme] .form-field textarea:focus { border-color: var(--green); outline-color: var(--mint); }
body[data-theme] .table-checkbox { accent-color: var(--green); }
body[data-theme] .mini-progress .track, body[data-theme] .cost-bar { background: var(--line); }
body[data-theme] .mini-progress .fill, body[data-theme] .cost-bar i, body[data-theme] .legend i { background: var(--chart-plan); }
body[data-theme] .legend i.light { background: var(--chart-done); }
body[data-theme] .chart-area text { fill: var(--muted); }
body[data-theme] .chart-area .gridline { stroke: var(--line); }
body[data-theme] .toast:not(.error) { background: var(--green); color: var(--on-primary); }
body[data-theme] .breadcrumb strong, body[data-theme] .stat-top, body[data-theme] .panel-head h3 span,
body[data-theme] .task-text p, body[data-theme] .ring-legend span, body[data-theme] .form-field .form-hint,
body[data-theme] .detail-field label, body[data-theme] .detail-meta { color: var(--muted); }

.theme-picker { margin: 0; border: 0; padding: 0 0 23px; border-bottom: 1px solid var(--line); min-width: 0; }
.theme-picker legend { padding: 0; width: 100%; font-size: 12px; font-weight: 500; }
.theme-picker legend span { float: right; font-size: 10px; color: var(--green); background: var(--mint); border-radius: 4px; padding: 2px 7px; }
.theme-picker > p { font-size: 10px; color: var(--muted); margin: 6px 0 16px; }
.theme-options { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.theme-option { position: relative; cursor: pointer; display: flex; align-items: center; flex-direction: column; gap: 8px; padding: 13px 5px 10px; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); font-size: 10px; transition: background .15s, border-color .15s; }
.theme-option:hover { background: var(--bg); }
.theme-option:has(input:checked) { border-color: var(--green); background: var(--mint); color: var(--green); }
.theme-option:has(input:focus-visible) { outline: 2px solid var(--green); outline-offset: 3px; }
.theme-option input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.theme-swatch { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 50%; background: var(--swatch); color: #fff; box-shadow: 0 2px 6px #00000012; }
.theme-swatch svg { opacity: 0; }
.theme-option:has(input:checked) .theme-swatch svg { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .theme-option { transition: none; } }
.account-security-row { margin: -5px 0 21px; padding-top: 0; }
.password-account { display: flex; align-items: center; gap: 10px; color: var(--green); background: var(--mint); padding: 12px 14px; border-radius: 7px; font-size: 11px; margin-bottom: 22px; }
.password-account strong { margin-left: 8px; font-weight: 600; }
.password-fields { display: grid; gap: 19px; }
.password-input { position: relative; }
.password-input input { padding-right: 43px; }
.password-input .icon-btn { position: absolute; right: 4px; top: 4px; }
.password-rule { font-size: 10px; color: var(--muted); margin-top: 13px; }
.account-menu { position: relative; }
.account-menu .user-button { min-height: 38px; border-radius: 7px; }
.user-button[aria-expanded="true"] { background: var(--mint); }
.user-button[aria-expanded="true"] > svg { transform: rotate(180deg); }
.account-dropdown { position: absolute; top: calc(100% + 13px); right: 0; width: 272px; max-width: calc(100vw - 24px); background: var(--panel); border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 12px 38px #1d2b3824; z-index: 60; overflow: hidden; text-align: left; }
.account-dropdown[hidden] { display: none; }
.account-dropdown-heading { display: flex; align-items: center; gap: 11px; padding: 17px 18px; border-bottom: 1px solid var(--line); }
.account-dropdown-heading .avatar { width: 35px; height: 35px; }
.account-dropdown-heading strong { display: block; font-size: 12px; font-weight: 600; }
.account-dropdown-heading small { display: block; color: var(--muted); font-size: 10px; margin-top: 3px; }
.account-menu-items { padding: 7px; }
.account-menu-item { display: flex; width: 100%; align-items: center; gap: 11px; border-radius: 7px; padding: 12px 11px; text-align: left; color: var(--muted); }
.account-menu-item > span { flex: 1; }
.account-menu-item strong { display: block; font-size: 12px; color: var(--ink); font-weight: 500; }
.account-menu-item small { display: block; font-size: 10px; margin-top: 3px; color: var(--muted); }
.account-menu-item:hover, .account-menu-item:focus-visible { background: var(--mint); color: var(--green); }
.account-menu-item:focus-visible { outline: 1px solid var(--green); outline-offset: -1px; }
.account-menu-divider { border-top: 1px solid var(--line); margin: 6px 5px; }
.account-menu-logout, .account-menu-logout strong { color: #ba665d; }
@media (max-width:650px) { .account-dropdown { top: calc(100% + 10px); } }
