.dw-workflows__counters { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: var(--space-3); margin-bottom: var(--space-4); } .dw-workflows__counter { display: flex; flex-direction: column; align-items: center; gap: var(--space-1); padding: var(--space-3) var(--space-2); border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); text-decoration: none; color: inherit; cursor: pointer; transition: background var(--transition-fast), border-color var(--transition-fast); } .dw-workflows__counter:hover { background: var(--color-surface-hover); border-color: var(--color-border-strong); } .dw-workflows__counter-value { font-size: var(--text-xl); font-weight: 700; color: var(--color-text-primary); } .dw-workflows__counter--accent .dw-workflows__counter-value { color: var(--color-accent); } .dw-workflows__counter--warning .dw-workflows__counter-value { color: var(--color-warning); } .dw-workflows__counter--success .dw-workflows__counter-value { color: var(--color-success); } .dw-workflows__counter--danger .dw-workflows__counter-value { color: var(--color-danger); } .dw-workflows__counter-label { font-size: var(--text-xs); color: var(--color-text-muted); } .dw-workflows__filters { display: flex; gap: var(--space-1); margin-bottom: var(--space-4); flex-wrap: wrap; } .dw-workflows__filter { background: none; border: 1px solid var(--color-border); padding: var(--space-1) var(--space-3); border-radius: var(--radius-full); font-size: var(--text-xs); font-weight: 500; color: var(--color-text-secondary); cursor: pointer; transition: all var(--transition-fast); } .dw-workflows__filter:hover { background: var(--color-surface-hover); color: var(--color-text-primary); } .dw-workflows__filter--active { background: var(--color-accent-soft); border-color: var(--color-accent); color: var(--color-accent-text); } .dw-workflows__list { display: flex; flex-direction: column; gap: var(--space-3); } .dw-workflows__card-header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); margin-bottom: var(--space-2); } .dw-workflows__filename { font-weight: 600; font-size: var(--text-base); color: var(--color-text-primary); margin: 0; } .dw-workflows__card-info { display: flex; gap: var(--space-4); font-size: var(--text-xs); color: var(--color-text-muted); } .dw-workflows__attention { color: var(--color-warning); font-weight: 500; font-size: var(--text-xs); } .dw-workflows__card-actions { display: flex; align-items: center; justify-content: space-between; margin-top: var(--space-2); padding-top: var(--space-2); border-top: 1px solid var(--color-border); } @media (max-width: 640px) { .dw-workflows__counters { grid-template-columns: repeat(3, 1fr); } }