.monitoring-settings-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.monitoring-settings .monitoring-check-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  margin: 0;
  padding: 24px;
  border: 1px solid var(--monitoring-border);
  border-radius: 8px;
  background: var(--monitoring-surface);
  color: var(--monitoring-ink);
  box-shadow: none;
}

.monitoring-check-heading {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--monitoring-surface);
}

.monitoring-check-heading > div { flex: 1; min-width: 0; }
.monitoring-check-heading h2 { margin: 3px 0 0; font-size: 19px; line-height: 1.35; color: var(--monitoring-ink); }
.monitoring-check-heading .badge { flex-shrink: 0; max-width: 38%; white-space: normal; line-height: 1.4; }
.monitoring-check-mark { display: grid; place-items: center; width: 44px; height: 44px; flex: 0 0 44px; border-radius: 8px; font-size: 23px; color: var(--monitoring-blue); background: color-mix(in srgb, var(--monitoring-blue) 10%, var(--monitoring-surface)); }
.monitoring-check-mark.is-sitemap { color: var(--monitoring-green); background: color-mix(in srgb, var(--monitoring-green) 10%, var(--monitoring-surface)); }
.monitoring-check-mark.is-crawl { color: var(--monitoring-red); background: color-mix(in srgb, var(--monitoring-red) 10%, var(--monitoring-surface)); }
.monitoring-check-mark.is-rank { color: var(--monitoring-amber); background: color-mix(in srgb, var(--monitoring-amber) 10%, var(--monitoring-surface)); }
.monitoring-check-description { min-height: 44px; margin: 18px 0; font-size: 14px; line-height: 1.6; color: var(--monitoring-muted); }
.monitoring-check-form { display: flex; flex: 1; flex-direction: column; min-width: 0; }
.monitoring-check-controls { padding: 18px 0; border-block: 1px solid var(--monitoring-border); }

.monitoring-settings .monitoring-enabled-control { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 48px; padding: 0; margin: 0 0 20px; cursor: pointer; }
.monitoring-enabled-control > span { display: grid; gap: 3px; }
.monitoring-enabled-control strong { font-size: 14px; color: var(--monitoring-ink); }
.monitoring-enabled-control small { font-size: 12px; color: var(--monitoring-muted); }
.monitoring-settings .monitoring-enabled-control .form-check-input { float: none; flex: 0 0 48px; width: 48px; height: 44px; margin: 0; cursor: pointer; background: transparent; box-shadow: none; }
.monitoring-settings .monitoring-enabled-control .form-check-input:checked::after { background-color: #34c779; border-color: #34c779; }
.monitoring-settings .monitoring-enabled-control .form-check-input:checked::before { background: #fff; }
.monitoring-settings .monitoring-enabled-control .form-check-input:disabled { cursor: not-allowed; }
.monitoring-frequency-label { margin-bottom: 8px; font-size: 13px; font-weight: 600; color: var(--monitoring-ink); }
.monitoring-settings .form-select { min-height: 44px; width: 100%; border-color: var(--monitoring-border); background-color: var(--monitoring-surface); color: var(--monitoring-ink); }
.monitoring-schedule-help { min-height: 40px; margin: 9px 0 0; color: var(--monitoring-muted); font-size: 12px; line-height: 1.6; }
.monitoring-check-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 20px 0; }
.monitoring-check-facts > div { min-width: 0; }
.monitoring-check-facts > div:last-child { grid-column: 1 / -1; }
.monitoring-check-facts dt { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 500; color: var(--monitoring-muted); }
.monitoring-check-facts dt i { font-size: 16px; }
.monitoring-check-facts dd { margin: 6px 0 0; font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }
.monitoring-check-note { margin: 0 0 18px; padding-left: 12px; border-left: 3px solid var(--monitoring-amber); color: var(--monitoring-amber); font-size: 13px; line-height: 1.6; }
.monitoring-check-footer { margin-top: auto; padding-top: 18px; border-top: 1px solid var(--monitoring-border); background: var(--monitoring-surface); }
.monitoring-save-row { margin-bottom: 16px; }
.monitoring-save-status { min-width: 0; font-size: 12px; line-height: 1.6; color: var(--monitoring-muted); }
.monitoring-save-status > span:not([hidden]) { display: flex; align-items: center; gap: 6px; }
.monitoring-save-status i { flex-shrink: 0; font-size: 17px; }
.monitoring-save-status[data-state="dirty"] { color: var(--bostic-unsaved-text, var(--monitoring-red)); }
.monitoring-save-status[data-state="error"] { color: var(--monitoring-red); }
.monitoring-save-status[data-state="saved"] { color: var(--monitoring-green); }
.monitoring-save-status[data-state="saving"] { color: var(--monitoring-blue); }
.monitoring-check-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.monitoring-settings .btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 44px; line-height: 1.4; white-space: normal; }
.monitoring-check-actions .btn { min-width: 0; padding: 10px 8px; font-size: 12px; }
.monitoring-settings .btn i { flex-shrink: 0; font-size: 18px; }
.monitoring-settings-loading, .monitoring-access-note, .monitoring-allowance-note { display: flex; align-items: center; gap: 14px; margin: 0 0 24px; padding: 18px 20px; background: var(--monitoring-surface); border: 1px solid var(--monitoring-border); border-radius: 8px; color: var(--monitoring-ink); }
.monitoring-settings-loading { color: var(--monitoring-blue); }
.monitoring-access-note { border-left: 3px solid var(--monitoring-amber); }
.monitoring-access-note > i, .monitoring-allowance-note > i { font-size: 24px; color: var(--monitoring-blue); }
.monitoring-access-note > i { color: var(--monitoring-amber); }
.monitoring-access-note > div, .monitoring-allowance-note > div { flex: 1; min-width: 0; }
.monitoring-access-note p, .monitoring-allowance-note p { margin: 4px 0 0; font-size: 13px; line-height: 1.6; color: var(--monitoring-muted); }
.monitoring-allowance-note { margin: 24px 0 0; }
.monitoring-settings [hidden] { display: none !important; }
.monitoring-settings :is(button, select, input, a):focus-visible { outline: 2px solid #ffa11d; outline-offset: 3px; }
.monitoring-connected-heading { display: flex; align-items: center; gap: 14px; padding: 20px 24px; margin-top: 8px; border-block: 1px solid var(--monitoring-border); background: var(--monitoring-surface); }
.monitoring-connected-heading > i { font-size: 26px; color: var(--monitoring-blue); }
.monitoring-connected-heading h2 { margin: 4px 0 0; font-size: 20px; color: var(--monitoring-ink); }
.monitoring-connection-note { margin: 0 0 18px; padding-left: 12px; border-left: 3px solid var(--monitoring-blue); color: var(--monitoring-muted); font-size: 12px; line-height: 1.6; }
.monitoring-setup-link { display: flex; align-items: center; gap: 6px; width: fit-content; min-height: 44px; color: var(--monitoring-blue); font-weight: 600; }
.monitoring-setup-link i { flex-shrink: 0; font-size: 18px; }

@media (max-width: 1199.98px) {
  .monitoring-settings-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .monitoring-check-description { min-height: 0; }
}

@media (max-width: 575.98px) {
  .monitoring-settings .monitoring-check-card { padding: 18px; }
  .monitoring-check-heading { flex-wrap: wrap; gap: 10px; }
  .monitoring-check-heading h2 { font-size: 18px; }
  .monitoring-check-heading .badge { margin-left: 54px; max-width: 100%; }
  .monitoring-save-status { min-height: 24px; }
  .monitoring-check-actions { gap: 6px; }
  .monitoring-check-actions .btn { gap: 5px; padding-inline: 5px; }
  .monitoring-access-note, .monitoring-allowance-note { flex-wrap: wrap; padding: 16px; }
  .monitoring-access-note .btn, .monitoring-allowance-note .btn { width: 100%; }
}
