/* Shared components extend Bootstrap, not a second component library. */
.proxy-ui .btn {
  display: inline-flex; align-items: center; justify-content: center;
  gap: var(--ui-control-icon-gap);
  min-height: var(--ui-control-height); vertical-align: middle;
  --bs-btn-font-size: var(--ui-font-size-base); --bs-btn-line-height: var(--ui-line-height);
  --bs-btn-padding-y: var(--ui-control-padding-y); --bs-btn-padding-x: var(--ui-control-padding-x);
  --bs-btn-border-radius: var(--ui-radius-md);
  --bs-btn-disabled-opacity: var(--ui-control-disabled-opacity);
  --bs-btn-focus-shadow-rgb: var(--ui-tone-rgb, var(--ui-color-primary-rgb));
  --ui-tone-ink: var(--ui-tone-bg, var(--ui-color-text));
  --ui-tone-border: var(--ui-tone-bg, var(--ui-color-border-strong));
}
.proxy-ui .btn > :is(.bi, .spinner-border) { margin: 0 !important; flex-shrink: 0; line-height: 1; }
.proxy-ui :is(.btn-sm, .btn-group-sm > .btn) {
  min-height: var(--ui-control-height-sm);
  --bs-btn-font-size: var(--ui-font-size-sm); --bs-btn-padding-y: var(--ui-control-padding-y-sm); --bs-btn-padding-x: var(--ui-control-padding-x-sm); --bs-btn-border-radius: var(--ui-radius-sm);
}
.proxy-ui :is(.btn-lg, .btn-group-lg > .btn) {
  min-height: var(--ui-control-height-lg);
  --bs-btn-font-size: var(--ui-font-size-lg); --bs-btn-padding-y: var(--ui-control-padding-y-lg); --bs-btn-padding-x: var(--ui-control-padding-x-lg);
}
/* A tone is selected once; solid/outline/state mappings below are shared. */
.proxy-ui :is(.btn-primary, .btn-outline-primary, .text-bg-primary) {
  --ui-tone-bg: var(--ui-color-primary); --ui-tone-hover: var(--ui-color-primary-hover); --ui-tone-on: var(--ui-color-on-primary); --ui-tone-rgb: var(--ui-color-primary-rgb);
}
.proxy-ui :is(.btn-secondary, .btn-outline-secondary, .text-bg-secondary) {
  --ui-tone-bg: var(--ui-color-secondary); --ui-tone-hover: var(--ui-color-secondary-hover); --ui-tone-on: var(--ui-color-on-secondary); --ui-tone-rgb: var(--ui-color-secondary-rgb);
}
.proxy-ui :is(.btn-success, .btn-outline-success, .text-bg-success) {
  --ui-tone-bg: var(--ui-color-success); --ui-tone-hover: var(--ui-color-success-hover); --ui-tone-on: var(--ui-color-on-success); --ui-tone-rgb: var(--ui-color-success-rgb);
}
.proxy-ui :is(.btn-danger, .btn-outline-danger, .text-bg-danger) {
  --ui-tone-bg: var(--ui-color-danger); --ui-tone-hover: var(--ui-color-danger-hover); --ui-tone-on: var(--ui-color-on-danger); --ui-tone-rgb: var(--ui-color-danger-rgb);
}
.proxy-ui :is(.btn-warning, .btn-outline-warning, .text-bg-warning) {
  --ui-tone-bg: var(--ui-color-warning); --ui-tone-hover: var(--ui-color-warning-hover); --ui-tone-on: var(--ui-color-on-warning); --ui-tone-rgb: var(--ui-color-warning-rgb);
}
.proxy-ui :is(.btn-info, .btn-outline-info, .text-bg-info) {
  --ui-tone-bg: var(--ui-color-info); --ui-tone-hover: var(--ui-color-info-hover); --ui-tone-on: var(--ui-color-on-info); --ui-tone-rgb: var(--ui-color-info-rgb);
}
.proxy-ui :is(.btn-light, .btn-outline-light, .text-bg-light) {
  --ui-tone-bg: var(--ui-color-light); --ui-tone-hover: var(--ui-color-light-hover); --ui-tone-on: var(--ui-color-on-light); --ui-tone-rgb: var(--ui-color-light-rgb);
  --ui-tone-ink: var(--ui-color-text); --ui-tone-border: var(--ui-color-border-strong);
}
.proxy-ui :is(.btn-dark, .btn-outline-dark, .text-bg-dark) {
  --ui-tone-bg: var(--ui-color-dark); --ui-tone-hover: var(--ui-color-dark-hover); --ui-tone-on: var(--ui-color-on-dark); --ui-tone-rgb: var(--ui-color-dark-rgb);
}
.proxy-ui :is(.btn-primary, .btn-secondary, .btn-success, .btn-danger, .btn-warning, .btn-info, .btn-light, .btn-dark) {
  --bs-btn-color: var(--ui-tone-on); --bs-btn-bg: var(--ui-tone-bg); --bs-btn-border-color: var(--ui-tone-border);
  --bs-btn-hover-color: var(--ui-tone-on); --bs-btn-hover-bg: var(--ui-tone-hover); --bs-btn-hover-border-color: var(--ui-tone-hover);
  --bs-btn-active-color: var(--ui-tone-on); --bs-btn-active-bg: var(--ui-tone-hover); --bs-btn-active-border-color: var(--ui-tone-hover);
  --bs-btn-disabled-color: var(--ui-tone-on); --bs-btn-disabled-bg: var(--ui-tone-bg); --bs-btn-disabled-border-color: var(--ui-tone-border);
}
.proxy-ui :is(.btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-danger, .btn-outline-warning, .btn-outline-info, .btn-outline-light, .btn-outline-dark) {
  --bs-btn-color: var(--ui-tone-ink); --bs-btn-bg: transparent; --bs-btn-border-color: var(--ui-tone-border);
  --bs-btn-hover-color: var(--ui-tone-on); --bs-btn-hover-bg: var(--ui-tone-bg); --bs-btn-hover-border-color: var(--ui-tone-border);
  --bs-btn-active-color: var(--ui-tone-on); --bs-btn-active-bg: var(--ui-tone-hover); --bs-btn-active-border-color: var(--ui-tone-hover);
  --bs-btn-disabled-color: var(--ui-tone-ink); --bs-btn-disabled-bg: transparent; --bs-btn-disabled-border-color: var(--ui-tone-border);
}
.proxy-ui :is(.text-bg-primary, .text-bg-secondary, .text-bg-success, .text-bg-danger, .text-bg-warning, .text-bg-info, .text-bg-light, .text-bg-dark) {
  color: var(--ui-tone-on) !important; background-color: rgba(var(--ui-tone-rgb), var(--bs-bg-opacity, 1)) !important;
}
.proxy-ui .btn-link { --bs-btn-color: var(--ui-color-primary); --bs-btn-hover-color: var(--ui-color-primary-hover); --bs-btn-active-color: var(--ui-color-primary-hover); --bs-btn-disabled-color: var(--ui-color-text-muted); }
.proxy-ui .btn-close { --bs-btn-close-focus-shadow: var(--ui-shadow-focus); }
.proxy-ui .form-control, .proxy-ui .form-select {
  min-height: var(--ui-control-height); border-color: var(--ui-color-border-strong); border-radius: var(--ui-radius-md);
  background-color: var(--ui-color-surface); color: var(--ui-color-text);
  font-size: var(--ui-font-size-base); line-height: var(--ui-line-height);
}
.proxy-ui .form-control-sm, .proxy-ui .form-select-sm { min-height: var(--ui-control-height-sm); font-size: var(--ui-font-size-sm); border-radius: var(--ui-radius-sm); }
.proxy-ui .form-control-lg, .proxy-ui .form-select-lg { min-height: var(--ui-control-height-lg); font-size: var(--ui-font-size-lg); }
.proxy-ui .form-control:focus, .proxy-ui .form-select:focus { border-color: var(--ui-color-primary); box-shadow: var(--ui-shadow-focus); }
.proxy-ui :is(.form-control, .form-select):disabled { background-color: var(--ui-color-surface-muted); color: var(--ui-color-text-muted); opacity: 1; }
.proxy-ui .form-control::placeholder { color: var(--ui-color-text-subtle); opacity: 1; }
.proxy-ui :is(.form-control, .form-select).is-invalid, .proxy-ui .was-validated :is(.form-control, .form-select):invalid { border-color: var(--ui-color-danger); }
.proxy-ui :is(.form-control, .form-select).is-invalid:focus, .proxy-ui .was-validated :is(.form-control, .form-select):invalid:focus { box-shadow: 0 0 0 4px rgba(var(--ui-color-danger-rgb), .16); }
.proxy-ui :is(.form-control, .form-select).is-valid, .proxy-ui .was-validated :is(.form-control, .form-select):valid { border-color: var(--ui-color-success); }
.proxy-ui :is(.form-control, .form-select).is-valid:focus, .proxy-ui .was-validated :is(.form-control, .form-select):valid:focus { box-shadow: 0 0 0 4px rgba(var(--ui-color-success-rgb), .16); }
.proxy-ui .input-group-text { color: var(--ui-color-text-muted); background-color: var(--ui-color-surface-muted); border-color: var(--ui-color-border-strong); border-radius: var(--ui-radius-md); }
.proxy-ui .input-group-sm > :is(.form-control, .form-select, .input-group-text, .btn) { min-height: var(--ui-control-height-sm); font-size: var(--ui-font-size-sm); padding-top: var(--ui-control-padding-y-sm); padding-bottom: var(--ui-control-padding-y-sm); }
.proxy-ui .input-group-lg > :is(.form-control, .form-select, .input-group-text, .btn) { min-height: var(--ui-control-height-lg); font-size: var(--ui-font-size-lg); padding-top: var(--ui-control-padding-y-lg); padding-bottom: var(--ui-control-padding-y-lg); }
.proxy-ui .form-check-input:checked { background-color: var(--ui-color-primary); border-color: var(--ui-color-primary); }
.proxy-ui .form-check-input:focus { border-color: var(--ui-color-primary); box-shadow: var(--ui-shadow-focus); }
.proxy-ui .form-check-input:disabled { opacity: var(--ui-control-disabled-opacity); }
.proxy-ui .card { --bs-card-bg: var(--ui-color-surface); --bs-card-border-color: var(--ui-color-border); --bs-card-border-radius: var(--ui-radius-lg); box-shadow: var(--ui-shadow-xs); }
.proxy-ui .modal-content { --bs-modal-bg: var(--ui-color-surface); --bs-modal-border-color: var(--ui-color-border); --bs-modal-border-radius: var(--ui-radius-lg); }
.proxy-ui .pagination { --bs-pagination-color: var(--ui-color-primary); --bs-pagination-bg: var(--ui-color-surface); --bs-pagination-border-color: var(--ui-color-border-strong); --bs-pagination-hover-color: var(--ui-color-primary-hover); --bs-pagination-hover-bg: var(--ui-color-primary-soft); --bs-pagination-hover-border-color: var(--ui-color-primary-border); --bs-pagination-focus-color: var(--ui-color-primary-hover); --bs-pagination-focus-bg: var(--ui-color-primary-soft); --bs-pagination-focus-box-shadow: var(--ui-shadow-focus); --bs-pagination-active-color: var(--ui-color-on-primary); --bs-pagination-active-bg: var(--ui-color-primary); --bs-pagination-active-border-color: var(--ui-color-primary); --bs-pagination-disabled-color: var(--ui-color-text-muted); --bs-pagination-disabled-bg: var(--ui-color-surface-muted); --bs-pagination-disabled-border-color: var(--ui-color-border); }
.proxy-ui .nav-pills { --bs-nav-pills-link-active-color: var(--ui-color-on-primary); --bs-nav-pills-link-active-bg: var(--ui-color-primary); }
.proxy-ui .nav-tabs { --bs-nav-tabs-border-color: var(--ui-color-border); --bs-nav-tabs-link-hover-border-color: var(--ui-color-border); --bs-nav-tabs-link-active-color: var(--ui-color-text); --bs-nav-tabs-link-active-bg: var(--ui-color-surface); --bs-nav-tabs-link-active-border-color: var(--ui-color-border) var(--ui-color-border) var(--ui-color-surface); }
.proxy-ui .table { --bs-table-color: var(--ui-color-text); --bs-table-bg: var(--ui-color-surface); --bs-table-border-color: var(--ui-color-border); --bs-table-hover-color: var(--ui-color-text); --bs-table-hover-bg: var(--ui-color-surface-hover); }
.ui-actions { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--ui-space-2); }
.ui-actions > .btn { flex-shrink: 0; }
.ui-actions > .ui-form-feedback { flex-basis: 100%; }
.ui-form-feedback { margin-top: var(--ui-space-2); font-size: var(--ui-font-size-sm); overflow-wrap: anywhere; }
.ui-form-feedback[data-ui-state="pending"] { color: var(--ui-color-text-muted); }
.ui-form-feedback[data-ui-state="error"] { color: var(--ui-color-danger); }
.ui-form-feedback[data-ui-state="unknown"] { color: var(--ui-color-warning); }
.ui-form-feedback[data-ui-state="success"] { color: var(--ui-color-success); }
.ui-panel { width: 100%; }
.ui-panel-sm { max-width: var(--ui-panel-width-sm); }
.ui-panel-md { max-width: var(--ui-panel-width-md); }
.ui-panel-lg { max-width: var(--ui-panel-width-lg); }
.ui-centered-page { min-height: 100vh; display: grid; place-items: center; padding: var(--ui-space-4); }
.ui-status-copy { white-space: pre-wrap; overflow-wrap: anywhere; }
.ui-num { font-variant-numeric: tabular-nums; }
