/* DARK-MODE COMPONENT FIXES — overlay, not a ground-truth edit.
   zivvy-design-system.css is token-complete but not component-complete in dark mode
   (its own §8 note / known defect #4: ~24 hardcoded `white` declarations). This file
   patches ONLY the surface backgrounds that break, using existing tokens, scoped to
   the explicit dark themes. Text `color: white` on colored fills is correct and untouched.
   Delete this file if the upstream stylesheet ever fixes the literals. */
[data-theme="dark"] .card,.dark .card{background:var(--surface-card)}
[data-theme="dark"] .input,.dark .input,
[data-theme="dark"] .textarea,.dark .textarea,
[data-theme="dark"] .select,.dark .select{background:var(--input-bg)}
[data-theme="dark"] .checkbox-control,.dark .checkbox-control,
[data-theme="dark"] .radio-control,.dark .radio-control{background:var(--input-bg)}
[data-theme="dark"] .btn-group-item,.dark .btn-group-item{background:var(--surface-elevated)}
[data-theme="dark"] .pagination-btn,.dark .pagination-btn{background:var(--surface-elevated)}
[data-theme="dark"] .nav-primary,.dark .nav-primary,
[data-theme="dark"] .nav-sidebar,.dark .nav-sidebar{background:var(--surface-card)}
[data-theme="dark"] .modal,.dark .modal,
[data-theme="dark"] .dropdown-menu,.dark .dropdown-menu,
[data-theme="dark"] .toast,.dark .toast{background:var(--surface-elevated)}
[data-theme="dark"] .skeleton-card,.dark .skeleton-card,
[data-theme="dark"] .demo-card,.dark .demo-card{background:var(--surface-card)}
[data-theme="dark"] .avatar-status,.dark .avatar-status{border-color:var(--surface-card)}
[data-theme="dark"] .avatar-group .avatar,.dark .avatar-group .avatar{border-color:var(--surface-card)}
[data-theme="dark"] .tooltip,.dark .tooltip{background:var(--tooltip-bg);color:var(--tooltip-text)}