/* Baluarte Material Design v1.5 — governed product extensions. */

/* T-009 · Three-panel conversational shell. */
.b-conversation-shell {
  display: grid;
  inline-size: 100%;
  block-size: 100dvh;
  grid-template-columns: 260px 360px minmax(400px, 1fr);
  overflow: hidden;
  background: var(--bg);
}

.b-conversation-shell--rail-collapsed {
  grid-template-columns: 49px 360px minmax(400px, 1fr);
}

.b-conversation-shell--workspace {
  grid-template-columns: 260px minmax(500px, 1fr);
}

.b-conversation-shell--workspace.b-conversation-shell--rail-collapsed {
  grid-template-columns: 49px minmax(500px, 1fr);
}

.b-conversation-shell__rail,
.b-conversation-shell__inbox,
.b-conversation-shell__workspace {
  min-inline-size: 0;
  min-block-size: 0;
}

/* T-011 · Provider-first hierarchy with connected agents. */
.b-provider-tree {
  display: flex;
  min-block-size: 0;
  flex: 1 1 auto;
  flex-direction: column;
  overflow-y: auto;
}

.b-provider-group {
  display: grid;
  min-inline-size: 0;
}

.b-provider-group__trigger,
.b-provider-agent {
  display: flex;
  inline-size: 100%;
  min-inline-size: 0;
  align-items: center;
  border: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
  text-align: start;
  cursor: pointer;
}

.b-provider-group__connections {
  display: grid;
  min-inline-size: 0;
}

.b-provider-group__toggle {
  display: inline-grid;
  place-items: center;
  margin-inline-start: auto;
}

.b-provider-agent__avatar {
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  border-radius: var(--b-radius-circle);
}

.b-provider-agent__label {
  display: grid;
  min-inline-size: 0;
}

/* T-021 · Async searchable combobox, including multi-value mode. */
.b-combobox__control {
  min-block-size: 40px;
  border: 1px solid var(--border) !important;
  border-radius: var(--b-shape-control-radius) !important;
  background: var(--bg) !important;
  box-shadow: none !important;
}

.b-combobox__control--is-focused {
  border-color: var(--accent) !important;
}

.b-combobox__value-container {
  padding-inline: var(--b-space-6) !important;
}

.b-combobox__input-container,
.b-combobox__single-value {
  color: var(--text) !important;
}

.b-combobox__placeholder {
  color: var(--text-muted) !important;
}

.b-combobox__indicator-separator {
  display: none;
}

.b-combobox__indicator {
  color: var(--text-muted) !important;
}

.b-combobox__menu,
.b-combobox__menu-portal .b-combobox__menu {
  z-index: var(--b-z-popover);
  overflow: hidden;
  border: 1px solid var(--border-strong);
  border-radius: var(--b-radius-2xl);
  background: var(--bg) !important;
  box-shadow: var(--elevation-5) !important;
}

.b-combobox__menu-list {
  padding: var(--b-space-3) !important;
}

.b-combobox__option {
  min-block-size: 36px;
  border-radius: var(--b-shape-menu-item-radius) !important;
  background: transparent !important;
  color: var(--text) !important;
  cursor: pointer !important;
}

.b-combobox__option--is-focused {
  background: var(--surface-hover) !important;
}

.b-combobox__option--is-selected {
  background: var(--surface-selected) !important;
}

.b-combobox__multi-value {
  border: 1px solid var(--border) !important;
  border-radius: var(--b-radius-md) !important;
  background: var(--info-bg) !important;
}

.b-combobox__multi-value__label {
  color: var(--info) !important;
}

.b-combobox__multi-value__remove {
  color: var(--text-muted) !important;
}

.b-combobox__multi-value__remove:hover {
  background: var(--danger-bg) !important;
  color: var(--danger) !important;
}

/* T-023 · Capability-aware conversational Composer. */
.b-composer--capability {
  max-inline-size: none;
}

.b-composer__notice {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--b-space-3);
  margin-block-end: var(--b-space-3);
  text-align: center;
}

.b-composer__files {
  display: flex;
  gap: var(--b-space-3);
  overflow-x: auto;
}

.b-composer__capability-menu {
  inline-size: 270px;
}

.b-conversation-drop {
  position: absolute;
  z-index: var(--b-z-overlay);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 2px dashed var(--accent);
  border-radius: var(--b-radius-3xl);
  corner-shape: var(--b-corner-squircle);
  background: var(--info-bg);
  color: var(--info);
  pointer-events: none;
  text-align: center;
}

.b-conversation-drop--locked {
  border-color: var(--warning);
  background: var(--warning-bg);
  color: var(--warning);
}

.b-conversation-drop__mark {
  display: grid;
  place-items: center;
}

/* T-024 · Timeline, actor and delivery-state contract. */
.b-timeline {
  min-inline-size: 0;
  min-block-size: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.b-timeline__inner {
  position: relative;
  inline-size: 100%;
  min-block-size: 100%;
}

.b-message-row {
  display: flex;
  inline-size: 100%;
}

.b-message-row--outbound {
  justify-content: flex-end;
}

.b-message {
  min-inline-size: 0;
  max-inline-size: min(72%, 620px);
}

.b-message__actor {
  display: inline-flex;
  align-items: center;
  gap: var(--b-space-3);
}

.b-message__actor-mark {
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
}

.b-message__status {
  display: inline-grid;
  place-items: center;
  color: var(--text-muted);
}

.b-message__status--failed {
  color: var(--danger);
}

/* T-025 · Conversational attachments and media mosaics. */
.b-message-attachments {
  display: grid;
  min-inline-size: 0;
  gap: var(--b-space-3);
}

.b-attachment-grid {
  display: grid;
  min-inline-size: 0;
  gap: var(--b-space-2);
  overflow: hidden;
  border-radius: var(--b-radius-2xl);
}

.b-attachment-image {
  display: block;
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
}

.b-attachment-list {
  display: grid;
  gap: var(--b-space-3);
}

.b-attachment-card {
  display: flex;
  min-inline-size: 0;
  align-items: center;
  gap: var(--b-space-4);
  border: 1px solid var(--border);
  border-radius: var(--b-radius-2xl);
  background: var(--bg);
  color: var(--text);
  text-decoration: none;
}

.b-attachment-card__icon,
.b-attachment-card__action {
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
}

.b-attachment-card__copy {
  display: grid;
  min-inline-size: 0;
}

.b-attachment-expired {
  color: var(--text-muted);
  font-size: var(--b-text-xs);
}

/* T-026 · Continuous categorical color field. */
.b-color-field {
  --b-color-field-value: transparent;
  display: flex;
  align-items: center;
  gap: var(--b-space-4);
}

.b-color-field__swatch {
  flex: 0 0 auto;
  border: 1px solid var(--border-strong);
  border-radius: var(--b-radius-circle);
  background: var(--b-color-field-value, transparent);
}

.b-color-field__popover {
  display: grid;
  border: 1px solid var(--border-strong);
  border-radius: var(--b-radius-2xl);
  background: var(--bg);
  box-shadow: var(--elevation-4);
}

.b-color-field__saturation,
.b-color-field__hue {
  position: relative;
  touch-action: none;
}

.b-color-field__marker {
  position: absolute;
  border: 1px solid var(--border-strong);
  border-radius: var(--b-radius-circle);
  pointer-events: none;
}

/* T-033 · Product feedback dialog with evidence attachments. */
.b-feedback {
  inline-size: min(480px, calc(100vw - 32px));
}

.b-feedback__form {
  display: grid;
  gap: var(--b-space-6);
}

.b-feedback__type {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.b-feedback__field textarea {
  min-block-size: 120px;
}

.b-feedback__files {
  display: flex;
  flex-wrap: wrap;
  gap: var(--b-space-3);
}

.b-feedback__context {
  color: var(--text-muted);
  font-size: var(--b-text-xs);
}

@media (max-width: 980px) {
  .b-conversation-shell,
  .b-conversation-shell--rail-collapsed,
  .b-conversation-shell--workspace,
  .b-conversation-shell--workspace.b-conversation-shell--rail-collapsed {
    grid-template-columns: minmax(0, 1fr);
  }
}