@import "app.tokens-cbvCbuP.css";
@import "app.layout-wfLivgN.css";
@import "app.components-jO1uWZe.css";
@import "app.cards-K_Z1bFY.css";
@import "app.filters-DLGzv95.css";
@import "app.dashboard-UNK8bKg.css";
@import "app.chat-dTeU2m4.css";
@import "app.responsive-qgwnMzd.css";

/* === Additions kept from main during design merge === */

/* Tom Select + Bootstrap 5 form-select compatibility */
.ts-wrapper.form-select {
  min-height: calc(1.5em + .75rem + var(--tblr-border-width) * 2);
  height: auto;
  padding: 0;
}
.ts-wrapper.form-select .ts-control {
  min-height: calc(1.5em + .75rem + var(--tblr-border-width) * 2);
  padding: .375rem 2.25rem .375rem .75rem;
  border: 0;
  background: transparent;
}

/* Tom Select dropdown: force opaque white background so it stays readable
   when opened inside an offcanvas, modal, or any container with translucent
   backdrop / backdrop-filter. */
.ts-dropdown,
.ts-dropdown.form-control,
.ts-dropdown.form-select,
.offcanvas .ts-dropdown,
.modal .ts-dropdown {
  background-color: #fff !important;
}
.ts-dropdown .ts-dropdown-content,
.ts-dropdown .option,
.ts-dropdown .optgroup-header,
.ts-dropdown .create,
.ts-dropdown .no-results {
  background-color: #fff;
}
.ts-dropdown .active {
  background-color: var(--tblr-tertiary-bg, #f0f1f3);
}
/* Tiloweb UploadedFileType preview: consistent framed preview for uploaded images/files. */
.uploaded-file-preview {
  margin-top: .75rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .5rem;
}
.uploaded-file-preview__image {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: var(--tblr-bg-surface-secondary, #f6f7f9);
  border: 1px solid var(--tblr-border-color);
  border-radius: var(--tblr-border-radius);
  padding: 12px;
  max-width: 100%;
}
.uploaded-file-preview__img {
  display: block;
  max-width: 180px;
  max-height: 120px;
  width: auto;
  height: auto;
  object-fit: contain;
}
.uploaded-file-preview__file {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .5rem .75rem;
  background-color: var(--tblr-bg-surface-secondary, #f6f7f9);
  border: 1px solid var(--tblr-border-color);
  border-radius: var(--tblr-border-radius);
}
.uploaded-file-preview__link {
  color: var(--tblr-primary);
  text-decoration: none;
  font-weight: 500;
}
.uploaded-file-preview__link::before {
  content: "\ea87"; /* ti-file */
  font-family: "tabler-icons";
  margin-right: .4rem;
  color: var(--tblr-secondary);
}
.uploaded-file-preview__link:hover {
  text-decoration: underline;
}
.uploaded-file-preview__hint {
  color: var(--tblr-secondary);
  font-size: var(--tblr-small-font-size, .875em);
}
/* App shell: sidebar stuck to left edge, main content centered in container-xl. */
.app-shell-sidebar {
  width: 100%;
}
@media (min-width: 992px) {
  .app-shell-sidebar {
    width: 280px;
  }
}
/* Section tabs: used on detail pages (warehouse info, partner info, configuration).
   Cleaner underline style with consistent spacing + bold active state. */
.nav-tabs.nav-tabs-sections {
  border-bottom: 1px solid var(--tblr-border-color);
  gap: .25rem;
}
.nav-tabs.nav-tabs-sections .nav-link {
  color: var(--tblr-secondary);
  font-weight: 500;
  padding: .625rem 1rem;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  margin-bottom: -1px;
  transition: color .15s ease, border-color .15s ease;
}
.nav-tabs.nav-tabs-sections .nav-link:hover {
  color: var(--tblr-body-color);
  border-bottom-color: var(--tblr-border-color-translucent);
}
.nav-tabs.nav-tabs-sections .nav-link.active {
  color: var(--tblr-primary);
  background: transparent;
  border-bottom-color: var(--tblr-primary);
  font-weight: 600;
}
.nav-tabs.nav-tabs-sections .nav-link i {
  font-size: 1rem;
  line-height: 1;
}
.nav-tabs.nav-tabs-sections .nav-link .badge {
  font-size: 11px;
  padding: 2px 8px;
  font-weight: 600;
}
/* Align height with paired .btn (40px) when TomSelect is wired via company-switcher controller. */
[data-controller~="company-switcher"] + .ts-wrapper.form-select,
[data-controller~="company-switcher"] + .ts-wrapper.form-select .ts-control {
  min-height: calc(1.5em + 1rem + var(--tblr-border-width) * 2);
}
[data-controller~="company-switcher"] + .ts-wrapper.form-select .ts-control {
  padding-top: .5rem;
  padding-bottom: .5rem;
}