/* Grupisana i kompaktnija podešavanja. */
.settings-category {
  background: color-mix(in srgb, var(--theme-surface, var(--panel, #fff)) 94%, var(--accent, #0b8dcc) 6%);
  border: 1px solid color-mix(in srgb, var(--theme-border, var(--border, #c8d7e1)) 82%, var(--accent, #0b8dcc) 18%);
  border-radius: 16px;
  box-sizing: border-box;
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 14px;
  width: 100%;
}

.settings-category-heading {
  align-items: center;
  border-bottom: 1px solid color-mix(in srgb, var(--theme-border, var(--border, #c8d7e1)) 82%, transparent);
  display: flex;
  min-height: 28px;
  padding: 0 1px 9px;
}

.settings-category-heading h3 {
  color: var(--theme-text, var(--text, #142230));
  font-size: 1rem;
  font-weight: 900;
  letter-spacing: .01em;
  line-height: 1.2;
  margin: 0;
}

.settings-category-content {
  display: grid;
  gap: 11px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-width: 0;
}

.settings-category-content > * {
  box-sizing: border-box;
  min-width: 0;
  width: 100%;
}

#settingsBasicGroupContent .command-bar-position-field,
#settingsControlGroupContent .settings-zone-field {
  grid-column: 1 / -1;
}

#settingsWarningsGroupContent {
  grid-template-columns: minmax(0, 1fr);
}

#settingsWarningsGroupContent > #cardDeadlineSettings,
#settingsWarningsGroupContent > #premiumWarningSettings,
#settingsWarningsGroupContent > #criticalAlertSettings {
  background: var(--theme-surface, var(--panel, #fff));
  border-color: var(--theme-border, var(--border, #c8d7e1));
  box-shadow: none;
  grid-column: 1 / -1;
  margin: 0;
  max-width: none;
}

#settingsWarningsGroupContent .premium-settings-heading {
  margin-bottom: 11px;
}

#settingsWarningsGroupContent .premium-settings-heading > strong {
  color: var(--theme-text, var(--text, #142230));
  font-size: .98rem;
  font-weight: 900;
}

#cardDeadlineSettingsStatus,
#cardDeadlineSettingsNote,
#settingsWarningsGroupContent .premium-settings-heading > span,
#settingsWarningsGroupContent .premium-settings-heading small {
  display: none !important;
}

html[data-theme="dark"] .settings-category {
  background: color-mix(in srgb, var(--theme-surface, #101b25) 91%, var(--accent, #2aa8e6) 9%);
}

@media (max-width: 620px) {
  .settings-category {
    border-radius: 14px;
    gap: 10px;
    padding: 12px;
  }

  .settings-category-content {
    grid-template-columns: minmax(0, 1fr);
  }

  #settingsBasicGroupContent .command-bar-position-field,
  #settingsControlGroupContent .settings-zone-field {
    grid-column: 1;
  }
}
