/* Settings navigation */ .dw-settings__nav { display: flex; gap: var(--space-1); margin-bottom: var(--space-6); border-bottom: 1px solid var(--color-border); padding-bottom: var(--space-2); flex-wrap: wrap; } .dw-settings__nav-item { background: none; border: none; padding: var(--space-2) var(--space-3); border-radius: var(--radius-md); font-size: var(--text-sm); font-weight: 500; color: var(--color-text-secondary); cursor: pointer; transition: background var(--transition-fast), color var(--transition-fast); } .dw-settings__nav-item:hover { background: var(--color-surface-hover); color: var(--color-text-primary); } .dw-settings__nav-item--active { background: var(--color-accent-soft); color: var(--color-accent-text); } /* Sections */ .dw-settings__section { margin-bottom: var(--space-10); scroll-margin-top: calc(var(--topbar-height) + var(--space-4)); } .dw-settings__section-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--space-4); } .dw-settings__section-title { font-size: var(--text-lg); font-weight: 600; color: var(--color-text-primary); margin: 0; } .dw-settings__section-desc { font-size: var(--text-sm); color: var(--color-text-secondary); margin: var(--space-1) 0 var(--space-4); max-width: 600px; } /* Governance summary cards */ .dw-gov__summary { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: var(--space-3); margin-bottom: var(--space-6); } .dw-gov__card { display: flex; flex-direction: column; align-items: center; gap: var(--space-1); padding: var(--space-4) var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); text-align: center; } .dw-gov__card-icon { font-size: var(--text-xl); } .dw-gov__card-value { font-size: var(--text-lg); font-weight: 700; color: var(--color-text-primary); } .dw-gov__card-label { font-size: var(--text-xs); color: var(--color-text-muted); } /* Workspace info */ .dw-settings__workspace-row { display: flex; align-items: center; justify-content: space-between; } .dw-settings__workspace-name { font-weight: 600; font-size: var(--text-base); margin: 0; color: var(--color-text-primary); } .dw-settings__workspace-desc { font-size: var(--text-sm); color: var(--color-text-secondary); margin: var(--space-1) 0 0; } /* Rule cards */ .dw-rules__list { display: flex; flex-direction: column; gap: var(--space-3); } .dw-rules__card-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--space-2); } .dw-rules__card-name { font-weight: 600; font-size: var(--text-base); color: var(--color-text-primary); margin: 0; } .dw-rules__card-desc { font-size: var(--text-sm); color: var(--color-text-secondary); margin: 0 0 var(--space-3); } .dw-rules__card-details { display: flex; flex-wrap: wrap; gap: var(--space-4); margin-bottom: var(--space-3); padding: var(--space-3); background: var(--color-surface-hover); border-radius: var(--radius-sm); } .dw-rules__card-detail { display: flex; flex-direction: column; gap: 2px; } .dw-rules__card-detail-label { font-size: var(--text-xs); color: var(--color-text-muted); text-transform: uppercase; letter-spacing: 0.03em; } .dw-rules__card-detail-value { font-size: var(--text-sm); color: var(--color-text-primary); font-weight: 500; } .dw-rules__card-actions { display: flex; gap: var(--space-2); } /* Rule form */ .dw-rules__form { display: flex; flex-direction: column; gap: var(--space-3); } .dw-rules__form-row { display: flex; gap: var(--space-3); flex-wrap: wrap; } .dw-rules__form-field { display: flex; flex-direction: column; gap: var(--space-1); flex: 1; min-width: 180px; } .dw-rules__form-field label { font-size: var(--text-xs); font-weight: 500; color: var(--color-text-secondary); } .dw-rules__form-field input, .dw-rules__form-field select { padding: var(--space-2) var(--space-3); border-radius: var(--radius-md); border: 1px solid var(--color-border); background: var(--color-surface); color: var(--color-text-primary); font-size: var(--text-sm); } .dw-rules__form-hint { font-size: var(--text-xs); color: var(--color-text-muted); margin-top: var(--space-1); } .dw-rules__form-error { font-size: var(--text-sm); color: var(--color-danger); padding: var(--space-2) var(--space-3); background: var(--color-danger-soft); border-radius: var(--radius-sm); margin: 0; } .dw-rules__form-actions { display: flex; gap: var(--space-3); padding-top: var(--space-2); } .dw-rules__types-grid { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-1); } .dw-rules__type-checkbox { display: flex; align-items: center; gap: 6px; font-size: var(--text-sm); color: var(--color-text-primary); cursor: pointer; } /* Danger zone */ .dw-settings__danger { border-top: 1px solid var(--color-danger-soft); padding-top: var(--space-6); } .dw-settings__danger-row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); } .dw-settings__danger-title { font-weight: 600; font-size: var(--text-base); color: var(--color-text-primary); margin: 0; } .dw-settings__danger-desc { font-size: var(--text-sm); color: var(--color-text-secondary); margin: var(--space-1) 0 0; max-width: 400px; } @media (max-width: 640px) { .dw-gov__summary { grid-template-columns: repeat(2, 1fr); } .dw-settings__danger-row { flex-direction: column; align-items: flex-start; } .dw-rules__card-actions { flex-wrap: wrap; } }