/* OpenDesign V8 · AI Provider Platform. Scope is intentionally module-local. */
.bms-ai-connections-v8 {
  display: grid;
  gap: var(--bms-space-3);
  min-width: 0;
  color: var(--bms-text);
  font-family: var(--bms-font-ui);
}

.bms-ai-connections-v8 *,
.bms-ai-connections-v8 *::before,
.bms-ai-connections-v8 *::after { box-sizing: border-box; }

.bms-ai-connections-v8__header,
.bms-ai-connections-v8__section-heading,
.bms-ai-connections-v8__provider-card > header,
.bms-ai-connections-v8__binding > header,
.bms-ai-connections-v8__binding > footer,
.bms-ai-connections-v8__dialog header,
.bms-ai-connections-v8__dialog footer {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--bms-space-3);
}

.bms-ai-connections-v8__header {
  padding: var(--bms-space-4);
  border: 1px solid var(--bms-border);
  border-radius: var(--bms-radius-2);
  background: var(--bms-surface);
}

.bms-ai-connections-v8__header h3,
.bms-ai-connections-v8__section-heading h4,
.bms-ai-connections-v8__dialog h3 { margin: 2px 0 var(--bms-space-1); color: var(--bms-text); }
.bms-ai-connections-v8__header p,
.bms-ai-connections-v8__section-heading p { margin: 0; color: var(--bms-text-muted); }
.bms-ai-connections-v8__header-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: var(--bms-space-2); }

.bms-ai-connections-v8__tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--bms-space-1);
  padding: var(--bms-space-1);
  border: 1px solid var(--bms-border);
  border-radius: var(--bms-radius-2);
  background: var(--bms-surface-subtle);
}

.bms-ai-connections-v8__tabs button {
  min-width: 0;
  min-height: var(--bms-control-touch);
  padding: var(--bms-space-2) var(--bms-space-3);
  border: 1px solid transparent;
  border-radius: var(--bms-radius-1);
  color: var(--bms-text-muted);
  background: transparent;
  font: 700 12px/1.25 var(--bms-font-ui);
}

.bms-ai-connections-v8__tabs button.active {
  border-color: var(--bms-border);
  color: var(--bms-primary);
  background: var(--bms-surface);
  box-shadow: var(--bms-shadow-1);
}

.bms-ai-connections-v8__tabs button:focus-visible { outline: 3px solid color-mix(in srgb, var(--bms-focus) 28%, transparent); outline-offset: 2px; }
.bms-ai-connections-v8 [data-ai-pane] { min-width: 0; }
.bms-ai-connections-v8 [data-ai-pane][hidden] { display: none; }

.bms-ai-connections-v8__message,
.bms-ai-connections-v8__empty {
  padding: var(--bms-space-6);
  border: 1px dashed var(--bms-border-strong);
  border-radius: var(--bms-radius-2);
  color: var(--bms-text-muted);
  background: var(--bms-surface-subtle);
  text-align: center;
}

.bms-ai-connections-v8__message.is-error,
.bms-ai-connections-v8__inline-error {
  border-color: color-mix(in srgb, var(--bms-danger) 40%, var(--bms-border));
  color: var(--bms-danger);
  background: var(--bms-danger-soft);
}

.bms-ai-connections-v8__empty strong { display: block; color: var(--bms-text); }
.bms-ai-connections-v8__empty p { margin: var(--bms-space-1) 0 var(--bms-space-3); }

.bms-ai-connections-v8__card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--bms-space-3);
}

.bms-ai-connections-v8__provider-card,
.bms-ai-connections-v8__binding {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--bms-border);
  border-radius: var(--bms-radius-2);
  background: var(--bms-surface);
}

.bms-ai-connections-v8__provider-card > header,
.bms-ai-connections-v8__binding > header { padding: var(--bms-space-3); border-bottom: 1px solid var(--bms-border); background: var(--bms-surface-subtle); }
.bms-ai-connections-v8__provider-card header div { min-width: 0; }
.bms-ai-connections-v8__provider-card header strong,
.bms-ai-connections-v8__provider-card header small { display: block; overflow-wrap: anywhere; }
.bms-ai-connections-v8__provider-card header small { margin-top: 3px; color: var(--bms-text-muted); }

.bms-ai-connections-v8__provider-card dl {
  display: grid;
  grid-template-columns: minmax(110px, .45fr) minmax(0, 1fr);
  margin: 0;
}

.bms-ai-connections-v8__provider-card :is(dt, dd) { margin: 0; padding: var(--bms-space-2) var(--bms-space-3); border-bottom: 1px solid var(--bms-border); overflow-wrap: anywhere; }
.bms-ai-connections-v8__provider-card dt { color: var(--bms-text-muted); background: var(--bms-surface-subtle); }
.bms-ai-connections-v8__provider-card dd { font-weight: 600; }
.bms-ai-connections-v8__inline-error { margin: var(--bms-space-3); padding: var(--bms-space-2); border: 1px solid; border-radius: var(--bms-radius-1); }
.bms-ai-connections-v8__provider-card > footer { display: flex; flex-wrap: wrap; gap: var(--bms-space-2); padding: var(--bms-space-3); }

.bms-ai-connections-v8__section-heading { margin-bottom: var(--bms-space-3); }
.bms-ai-connections-v8__table { width: 100%; min-width: 720px; border-collapse: collapse; }
.bms-ai-connections-v8__table th { position: sticky; top: 0; z-index: var(--bms-z-sticky); }
.bms-ai-connections-v8__table td strong,
.bms-ai-connections-v8__table td small { display: block; }
.bms-ai-connections-v8__table td small { margin-top: 3px; color: var(--bms-text-muted); overflow-wrap: anywhere; }
.bms-ai-connections-v8__table code { overflow-wrap: anywhere; font-family: var(--bms-font-data); }

.bms-ai-connections-v8__binding-list { display: grid; gap: var(--bms-space-3); }
.bms-ai-connections-v8__binding > div {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--bms-space-3);
  padding: var(--bms-space-3);
}
.bms-ai-connections-v8__binding label,
.bms-ai-connections-v8__form-grid > label,
.bms-ai-connections-v8__dialog > form > label { display: grid; gap: var(--bms-space-1); color: var(--bms-text-muted); font-size: 12px; font-weight: 700; }
.bms-ai-connections-v8__binding > footer { align-items: center; padding: var(--bms-space-3); border-top: 1px solid var(--bms-border); }
.bms-ai-connections-v8__binding > footer small { color: var(--bms-text-muted); }

.bms-ai-connections-v8__dialog {
  width: min(760px, calc(100vw - (2 * var(--bms-space-4))));
  max-height: calc(100dvh - (2 * var(--bms-space-4)));
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--bms-border);
  border-radius: var(--bms-radius-3);
  color: var(--bms-text);
  background: var(--bms-surface);
  box-shadow: var(--bms-shadow-overlay);
}
.bms-ai-connections-v8__dialog::backdrop { background: var(--bms-backdrop); }
.bms-ai-connections-v8__dialog > form { display: grid; max-height: inherit; overflow: auto; }
.bms-ai-connections-v8__dialog header { position: sticky; top: 0; z-index: var(--bms-z-sticky); padding: var(--bms-space-4); border-bottom: 1px solid var(--bms-border); background: var(--bms-surface); }
.bms-ai-connections-v8__dialog footer { position: sticky; bottom: 0; align-items: center; justify-content: flex-end; padding: var(--bms-space-3) var(--bms-space-4); border-top: 1px solid var(--bms-border); background: var(--bms-surface); }
.bms-ai-connections-v8__dialog > form > label,
.bms-ai-connections-v8__dialog > form > .field-hint { margin: var(--bms-space-3) var(--bms-space-4) 0; }

.bms-ai-connections-v8__form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--bms-space-3); padding: var(--bms-space-4) var(--bms-space-4) 0; }
.bms-ai-connections-v8__form-grid .is-wide { grid-column: 1 / -1; }
.bms-ai-connections-v8__form-grid fieldset { display: flex; flex-wrap: wrap; gap: var(--bms-space-3); padding: var(--bms-space-3); border: 1px solid var(--bms-border); border-radius: var(--bms-radius-2); }
.bms-ai-connections-v8__form-grid fieldset legend { padding-inline: var(--bms-space-1); font-weight: 700; }

@media (max-width: 900px) {
  .bms-ai-connections-v8__card-grid { grid-template-columns: minmax(0, 1fr); }
  .bms-ai-connections-v8__binding > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  .bms-ai-connections-v8__header,
  .bms-ai-connections-v8__section-heading,
  .bms-ai-connections-v8__binding > footer { align-items: stretch; flex-direction: column; }
  .bms-ai-connections-v8__header-actions { justify-content: flex-start; }
  .bms-ai-connections-v8__header-actions .btn,
  .bms-ai-connections-v8__section-heading .btn { width: 100%; }
  .bms-ai-connections-v8__tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bms-ai-connections-v8__binding > div,
  .bms-ai-connections-v8__form-grid { grid-template-columns: minmax(0, 1fr); }
  .bms-ai-connections-v8__form-grid .is-wide { grid-column: auto; }
  .bms-ai-connections-v8__provider-card > footer .btn { flex: 1 1 calc(50% - var(--bms-space-2)); }
  .bms-ai-connections-v8__dialog { width: calc(100vw - (2 * var(--bms-space-2))); max-height: calc(100dvh - (2 * var(--bms-space-2))); border-radius: var(--bms-radius-2); }
  .bms-ai-connections-v8__dialog footer .btn { flex: 1 1 0; }
}

@media (prefers-reduced-motion: reduce) {
  .bms-ai-connections-v8 * { scroll-behavior: auto; transition: none; }
}