/* The Koppelingen screen (B6, editor/koppelingen.js): one card per integration, grouped, mobile first. */
.integrations .integration-group { margin-top: 18px; }
.integrations .integration-head { display: flex; gap: 8px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.integrations .integration-head h3 { margin: 0; font-size: 17px; }
.integrations .integration p { margin: 6px 0; overflow-wrap: anywhere; }
.integrations .integration.on { border-color: var(--accent); }
.integrations .badge.soon { color: var(--muted); }
.integrations .integration-form textarea { min-height: 120px; font-size: 14px; }
.integrations .integration-form .hint { font-size: 14px; }
.integrations .integration .row { margin-top: 8px; }
.integrations button.link { background: none; border: 0; padding: 0; min-height: 44px; color: var(--accent); text-decoration: underline; font: inherit; cursor: pointer; text-align: left; }
.proposed-integration li { overflow-wrap: anywhere; }

/* Google Bedrijfsprofiel (WP8a, editor/google-profile.js): per kind a part, the site and Google side by side from 600
   pixels, one under the other on a phone. */
.integrations .google-kind { margin-top: 14px; padding-top: 10px; border-top: 1px solid var(--line); }
.integrations .google-kind h4 { margin: 0 0 4px; font-size: 16px; }
.integrations .google-compare { display: grid; grid-template-columns: 1fr; gap: 12px; margin: 8px 0; }
.integrations .google-compare h4 { margin: 0 0 4px; font-size: 15px; }
.integrations .google-compare ul { margin: 0; padding-left: 18px; }
.integrations .google-pick fieldset { border: 0; margin: 8px 0; padding: 0; }
.integrations .google-pick legend { font-weight: 600; margin-bottom: 6px; }
.integrations .google-location { display: flex; gap: 10px; align-items: flex-start; min-height: 44px; margin: 6px 0; overflow-wrap: anywhere; }
.integrations .google-location input { margin-top: 4px; flex: none; width: 20px; height: 20px; }
.integrations .google-photo { display: flex; gap: 10px; align-items: flex-start; margin: 10px 0; }
.integrations .google-photo img { width: 96px; height: 72px; object-fit: cover; border-radius: var(--radius); flex: none; }
.integrations .google-photo > div { display: flex; flex-direction: column; gap: 6px; min-width: 0; flex: 1; }
.integrations .google-photo select { min-height: 44px; max-width: 100%; }
.integrations .google-photo .confirm { overflow-wrap: anywhere; }
.integrations .google-post { display: flex; gap: 10px; align-items: center; justify-content: space-between; flex-wrap: wrap; margin: 6px 0; overflow-wrap: anywhere; }
.integrations .google-item { margin: 4px 0; }
@media (min-width: 600px) {
  .integrations .google-compare { grid-template-columns: 1fr 1fr; }
}

/* The Cookiemelding part (B7a, editor/cookiemelding.js). */
.integrations .cookie-section { margin-top: 24px; }
.integrations .cookie-text { margin: 10px 0; }
.integrations .cookie-text textarea { min-height: 90px; font-size: 15px; }
.integrations .cookie-text .small { margin-top: 4px; font-size: 14px; padding: 3px 10px; }
.integrations .cookie-load { margin: 10px 0; border: 1px solid var(--line); border-radius: var(--radius); }
.integrations .note { font-weight: 600; }