/* "Настройки" in the approved board concept: stat tiles, white cards, list-style rows and board buttons. */
.workspace > .settings-view { margin: 16px 24px 32px !important; padding: 0 !important; display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; align-items: start !important; gap: 16px !important; background: #fff !important; }
.settings-view > .settings-overview,.settings-view > .settings-storage-card { grid-column: 1 / -1 !important; }

.settings-view .settings-overview { display: grid !important; grid-template-columns: repeat(4,minmax(0,1fr)) !important; gap: 12px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
.settings-view .settings-overview article { display: grid !important; gap: 6px !important; padding: 12px 14px !important; border: 0 !important; border-radius: 8px !important; background: #f8f6fc !important; box-shadow: none !important; }
.settings-view .settings-overview span { color: #898397 !important; font-size: 13px !important; }
.settings-view .settings-overview strong { color: #24202c !important; font-size: 22px !important; font-weight: 600 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }

.settings-view .settings-card { margin: 0 !important; padding: 18px 20px !important; border: 1px solid #eae5f3 !important; border-radius: 8px !important; background: #fff !important; box-shadow: none !important; min-width: 0 !important; }
.settings-view .panel-head { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; margin: 0 0 12px !important; }
.settings-view .panel-head h3 { margin: 0 !important; color: #24202c !important; font-size: 16px !important; font-weight: 600 !important; }
.settings-view .panel-head p { margin: 4px 0 0 !important; color: #898397 !important; font-size: 13px !important; }
.settings-view .panel-head > button { width: 32px !important; min-width: 32px !important; height: 32px !important; min-height: 32px !important; padding: 0 !important; border: 1px solid #ddd7e7 !important; border-radius: 7px !important; background: #fff !important; box-shadow: none !important; color: #7954d6 !important; font-size: 18px !important; }
.settings-view .settings-pill { display: inline-flex !important; padding: 3px 8px !important; border: 0 !important; border-radius: 4px !important; background: #eee8ff !important; box-shadow: none !important; color: #7047db !important; font-size: 12px !important; font-weight: 500 !important; }
.settings-view .settings-card > p { margin: 0 0 12px !important; color: #5f586d !important; font-size: 14px !important; line-height: 1.45 !important; }

.settings-view .field span { color: #898397 !important; font-size: 12px !important; font-weight: 500 !important; text-transform: uppercase !important; letter-spacing: 0 !important; }
.settings-view :is(select,input[type='text'],input[type='search']) { min-height: 40px !important; border: 1px solid #ddd7e7 !important; border-radius: 7px !important; background-color: #fff !important; box-shadow: none !important; color: #494558 !important; font-size: 14px !important; }
.settings-view .settings-card button:not(.panel-head > button) { min-height: 34px !important; padding: 6px 12px !important; border: 1px solid #ddd7e7 !important; border-radius: 7px !important; background: #fff !important; box-shadow: none !important; color: #514a60 !important; font-size: 13px !important; font-weight: 450 !important; }
.settings-view .settings-card :is(.settings-row-actions,.pill-row) button.settings-delete,.settings-view .settings-card .pill-row > button[data-delete-filter] { color: #bf4c5d !important; }
.settings-view .settings-card button:disabled { color: #b4adc0 !important; }

.settings-view .settings-list { display: grid !important; gap: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; }
.settings-view :is(.pill-row,.backup-row,.automation) { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; min-height: 52px !important; margin: 0 !important; padding: 8px 4px !important; border: 0 !important; border-bottom: 1px solid #f0edf5 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
.settings-view :is(.pill-row,.backup-row,.automation):last-of-type { border-bottom: 0 !important; }
.settings-view :is(.pill-row,.backup-row,.automation):hover { background: #faf8fe !important; }
.settings-view .pill-row > span:first-child,.settings-view :is(.backup-main,.automation-main) { display: grid !important; gap: 3px !important; min-width: 0 !important; }
.settings-view .pill-row strong,.settings-view :is(.backup-main,.automation-main) strong { color: #24202c !important; font-size: 14px !important; font-weight: 500 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
.settings-view .pill-row small,.settings-view :is(.backup-main,.automation-main) small { color: #898397 !important; font-size: 12px !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
.settings-view .pill-row .tag { display: inline-flex !important; padding: 3px 8px !important; border: 0 !important; border-radius: 4px !important; background: color-mix(in srgb,var(--tag,#7954d6) 10%,white) !important; color: color-mix(in srgb,var(--tag,#7954d6) 80%,#222) !important; box-shadow: none !important; font-size: 12px !important; font-weight: 500 !important; }
.settings-view .settings-row-actions { display: flex !important; gap: 6px !important; flex-shrink: 0 !important; }
.settings-view .settings-row-actions button { opacity: .75; }
.settings-view :is(.pill-row,.automation):is(:hover,:focus-within) .settings-row-actions button { opacity: 1; }

.settings-view .automation { justify-content: flex-start !important; }
.settings-view .automation > input[type='checkbox'] { accent-color: #7954d6 !important; flex-shrink: 0 !important; }
.settings-view .automation-main { flex: 1 !important; }
.settings-view .automation-flow { color: #746c84 !important; font-size: 12px !important; }

.settings-view .settings-actions { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; margin: 0 0 12px !important; }
.settings-view .settings-actions #settingsBackup { border-color: #7954d6 !important; background: #7954d6 !important; color: #fff !important; }
.settings-view .settings-actions #settingsReset { color: #bf4c5d !important; }
.settings-view .backup-row { justify-content: flex-start !important; }
.settings-view .backup-kind { flex: 0 0 150px !important; padding: 0 !important; border: 0 !important; background: transparent !important; color: #746c84 !important; font-size: 13px !important; }
.settings-view .backup-main { flex: 1 !important; }
.settings-view .backup-toggle { justify-self: start !important; margin-top: 12px !important; color: #7954d6 !important; }

@media (max-width: 1100px) {
  .workspace > .settings-view { grid-template-columns: minmax(0,1fr) !important; }
}
@media (max-width: 760px) {
  .workspace > .settings-view { margin: 12px 14px 14px !important; gap: 12px !important; }
  .settings-view .settings-overview { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 8px !important; }
  .settings-view .settings-overview strong { font-size: 18px !important; }
  .settings-view .settings-card { padding: 14px !important; }
  .settings-view :is(.pill-row,.backup-row,.automation) { flex-wrap: wrap !important; }
  .settings-view .backup-kind { flex-basis: 100% !important; }
}

/* Toggle rows (workspace settings) */
.settings-view .settings-toggle { display: flex; align-items: flex-start; gap: 12px; padding: 4px 0; cursor: pointer; }
.settings-view .settings-toggle input { flex: 0 0 auto; width: 18px; height: 18px; margin-top: 2px; accent-color: #7954d6; }
.settings-view .settings-toggle span { display: grid; gap: 4px; }
.settings-view .settings-toggle strong { color: #24202c; font-size: 14px; font-weight: 500; }
.settings-view .settings-toggle small { color: #898397; font-size: 13px; line-height: 1.45; }