/* Notifications — use the same calm blue/white system as the index page. */
body.workspace-feature-notify {
  --notify-canvas: #f3f7fb;
  --notify-surface: #fff;
  --notify-soft: #f6f9fd;
  --notify-border: #dbe6f1;
  --notify-ink: #0b1f38;
  --notify-muted: #60748b;
  --notify-blue: #1769d2;
}

body.workspace-feature-notify,
body.workspace-feature-notify .main-area,
body.workspace-feature-notify .content {
  background: var(--notify-canvas) !important;
}

body.workspace-feature-notify .notify-hero {
  padding: 28px 30px !important;
  border: 1px solid #c9dbef !important;
  border-radius: 18px !important;
  background: linear-gradient(120deg, #edf5ff 0%, #f8fbff 100%) !important;
  box-shadow: 0 14px 36px rgba(38, 78, 122, .08) !important;
}

body.workspace-feature-notify .workspace-page-kicker { color: #216bd6 !important; }
body.workspace-feature-notify .notify-hero h1,
body.workspace-feature-notify .channel-title,
body.workspace-feature-notify .guide h2,
body.workspace-feature-notify .guide-col h3 { color: var(--notify-ink) !important; }
body.workspace-feature-notify .notify-hero p,
body.workspace-feature-notify .guide-sub,
body.workspace-feature-notify .security-note { color: var(--notify-muted) !important; }

body.workspace-feature-notify .channel-grid { gap: 18px !important; }
body.workspace-feature-notify .channel-card,
body.workspace-feature-notify .guide {
  border: 1px solid var(--notify-border) !important;
  border-radius: 16px !important;
  background: var(--notify-surface) !important;
  box-shadow: 0 10px 30px rgba(32, 68, 108, .07) !important;
}

body.workspace-feature-notify .channel-card { padding: 22px !important; }
body.workspace-feature-notify .channel-head {
  margin-bottom: 18px !important;
  padding-bottom: 16px !important;
  border-bottom: 1px solid #eaf0f6 !important;
}

body.workspace-feature-notify .channel-icon,
body.workspace-feature-notify .feishu .channel-icon,
body.workspace-feature-notify .wecom .channel-icon {
  color: var(--notify-blue) !important;
  border: 1px solid #cbdcf0 !important;
  background: #edf4ff !important;
  box-shadow: none !important;
}

body.workspace-feature-notify .bind-state {
  color: #60748b !important;
  border: 1px solid #dce5ef !important;
  background: #f4f7fa !important;
}
body.workspace-feature-notify .bind-state.ok {
  color: #18845b !important;
  border-color: #cce8dc !important;
  background: #edf9f4 !important;
}

body.workspace-feature-notify .field label,
body.workspace-feature-notify .rule-box b,
body.workspace-feature-notify .check-item,
body.workspace-feature-notify .threshold { color: #324a63 !important; }

body.workspace-feature-notify .field input[type="text"],
body.workspace-feature-notify .field input[type="url"],
body.workspace-feature-notify .field input[type="number"] {
  min-height: 46px !important;
  color: var(--notify-ink) !important;
  border: 1px solid #ccd9e7 !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: none !important;
}
body.workspace-feature-notify .field input:focus {
  border-color: #6ba2e9 !important;
  box-shadow: 0 0 0 3px rgba(39, 112, 218, .12) !important;
}

body.workspace-feature-notify .rule-box,
body.workspace-feature-notify .guide-col {
  border: 1px solid #e1e9f2 !important;
  border-radius: 12px !important;
  background: var(--notify-soft) !important;
}
body.workspace-feature-notify input[type="checkbox"] { accent-color: var(--notify-blue) !important; }

body.workspace-feature-notify .channel-actions {
  margin-top: 18px !important;
  padding-top: 18px !important;
  border-top: 1px solid #eaf0f6 !important;
}
body.workspace-feature-notify .save-btn {
  color: #fff !important;
  background: var(--notify-blue) !important;
  box-shadow: 0 8px 18px rgba(23, 105, 210, .20) !important;
}
body.workspace-feature-notify .save-btn:hover { background: #0e5dbe !important; }
body.workspace-feature-notify .test-btn {
  color: #155fae !important;
  border: 1px solid #c8dced !important;
  background: #eef6ff !important;
}
body.workspace-feature-notify .test-btn:hover { background: #e4f0fd !important; }
body.workspace-feature-notify .delete-btn {
  color: #a24d57 !important;
  border: 1px solid #ead9dc !important;
  background: #fff !important;
}
body.workspace-feature-notify .delete-btn:hover {
  color: #b23845 !important;
  border-color: #e4bdc3 !important;
  background: #fff5f6 !important;
}

body.workspace-feature-notify .guide { padding: 24px !important; }
body.workspace-feature-notify .guide-grid { gap: 14px !important; }
body.workspace-feature-notify .guide-col { padding: 18px !important; }
body.workspace-feature-notify .step i {
  color: var(--notify-blue) !important;
  border: 1px solid #d0e1f5 !important;
  background: #eaf3ff !important;
}
body.workspace-feature-notify .security-note {
  border: 1px solid #dce6f0 !important;
  border-radius: 12px !important;
  background: #f3f7fc !important;
}

@media (max-width: 900px) {
  body.workspace-feature-notify .notify-hero { padding: 22px !important; }
  body.workspace-feature-notify .channel-grid,
  body.workspace-feature-notify .guide-grid { grid-template-columns: 1fr !important; }
}