/*
 * Businfo App 1.2.0-rc1 — transaction and workspace responsive bridge.
 * Presentation-only compatibility layer for com_businfo 4.7.4-rc8.2-rc5-alpha1+.
 */

.bi-shell-transaction,
.bi-shell-workspace {
  overflow-x: clip;
}

.bi-shell-transaction .bi-page-shell,
.bi-shell-transaction .bi-content-grid,
.bi-shell-transaction .bi-main-column,
.bi-shell-transaction .bi-main-content,
.bi-shell-transaction .bi-transaction-page,
.bi-shell-transaction .bi-transaction-shell,
.bi-shell-transaction .bi-transaction-main,
.bi-shell-workspace .bi-page-shell,
.bi-shell-workspace .bi-workspace-host,
.bi-shell-workspace .bi-main-column,
.bi-shell-workspace .bi-main-content,
.bi-shell-workspace .bi-workspace-main,
.bi-shell-workspace .vendor-app-main,
.bi-shell-workspace .trip-app-shell,
.bi-shell-workspace .businfo-account-page,
.bi-shell-workspace .registration-page {
  min-width: 0;
  max-width: 100%;
}

.bi-shell-transaction img,
.bi-shell-transaction svg,
.bi-shell-transaction video,
.bi-shell-transaction canvas,
.bi-shell-workspace img,
.bi-shell-workspace svg,
.bi-shell-workspace video,
.bi-shell-workspace canvas {
  max-width: 100%;
}

.bi-shell-transaction input,
.bi-shell-transaction select,
.bi-shell-transaction textarea,
.bi-shell-workspace input,
.bi-shell-workspace select,
.bi-shell-workspace textarea {
  max-width: 100%;
}

/* Compact transaction header: remove the empty mobile navigation column. */
.bi-shell-transaction .bi-header-inner {
  grid-template-columns: minmax(0, 1fr) auto;
}

.bi-shell-transaction .bi-brand {
  min-width: 0;
  justify-self: start;
}

.bi-shell-transaction .bi-header-actions {
  min-width: 0;
}

/* Keep wide data inside its own scroll container instead of widening the page. */
.bi-shell-transaction .table-responsive,
.bi-shell-workspace .table-responsive,
.bi-shell-workspace .vendor-company-table,
.bi-shell-workspace .vendor-booking-table,
.bi-shell-workspace .saas-card,
.bi-shell-workspace .account-panel {
  min-width: 0;
  max-width: 100%;
}

.bi-shell-transaction .table-responsive,
.bi-shell-workspace .table-responsive {
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-gutter: stable;
}

.bi-shell-workspace .saas-table,
.bi-shell-workspace #tripsTable {
  width: 100%;
  min-width: 760px;
}

/* Native dialogs and Bootstrap modals must remain within the visual viewport. */
.bi-shell-transaction dialog,
.bi-shell-workspace dialog {
  max-width: min(94vw, 680px);
  max-height: min(90dvh, 820px);
  overflow: auto;
  overscroll-behavior: contain;
}

.bi-shell-workspace .modal-dialog,
.bi-shell-transaction .modal-dialog {
  width: auto;
  max-width: min(94vw, 620px);
  margin: max(1rem, var(--bi-safe-top, 0px)) auto max(1rem, var(--bi-safe-bottom, 0px));
}

.bi-shell-workspace .modal-content,
.bi-shell-transaction .modal-content {
  max-height: calc(100dvh - 2rem - var(--bi-safe-top, 0px) - var(--bi-safe-bottom, 0px));
  overflow: hidden;
}

.bi-shell-workspace .modal-body,
.bi-shell-transaction .modal-body {
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}

/* Long forms: never let controls or repeatable groups force page overflow. */
.bi-shell-transaction .form-grid,
.bi-shell-transaction .wizard-grid,
.bi-shell-workspace .form-grid,
.bi-shell-workspace .wizard-grid,
.bi-shell-workspace .profile-form-grid,
.bi-shell-workspace .trip-form-grid,
.bi-shell-workspace .control-group,
.bi-shell-workspace .subform-repeatable,
.bi-shell-workspace .subform-repeatable-group,
.bi-shell-workspace .vendor-repeatable-card {
  min-width: 0;
}

.bi-shell-transaction input[type="file"],
.bi-shell-workspace input[type="file"] {
  width: 100%;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Transaction summary sheet and bottom action cooperate with safe area/keyboard. */
@media (max-width: 1023px) {
  .bi-shell-transaction .bi-transaction-summary {
    max-height: min(
      82dvh,
      calc(100dvh - var(--bi-safe-top, 0px) - 1rem)
    );
    padding-bottom: max(var(--bi-safe-bottom, 0px), env(safe-area-inset-bottom));
  }

  .bi-shell-transaction .bi-transaction-summary__head {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--bi-surface-default, #fff);
  }

  .bi-shell-transaction .bi-transaction-bottom-action {
    padding-inline: max(12px, var(--bi-safe-left, 0px)) max(12px, var(--bi-safe-right, 0px));
    padding-bottom: calc(12px + max(var(--bi-safe-bottom, 0px), env(safe-area-inset-bottom)));
  }

  body.is-keyboard-open.bi-shell-transaction .bi-transaction-bottom-action {
    display: none !important;
  }

  body.is-keyboard-open.bi-shell-transaction .bi-transaction-page {
    padding-bottom: calc(24px + var(--bi-safe-bottom, 0px));
  }

  body.is-keyboard-open.bi-shell-transaction .bi-transaction-summary {
    bottom: var(--bi-keyboard-inset, 0px);
    max-height: calc(100dvh - var(--bi-keyboard-inset, 0px) - var(--bi-safe-top, 0px) - .5rem);
  }
}

@media (max-width: 767px) {
  .bi-shell-transaction .bi-header-inner {
    grid-template-columns: minmax(0, 1fr) auto;
    padding-inline: 10px;
  }

  .bi-shell-transaction .bi-brand {
    max-width: min(52vw, 170px);
  }

  .bi-shell-transaction .bi-brand img {
    max-width: min(42vw, 118px);
  }

  .bi-shell-transaction .bi-transaction-header h1 {
    overflow-wrap: anywhere;
  }

  .bi-shell-transaction .bi-transaction-progress {
    width: 100%;
    overflow-x: auto;
    grid-template-columns: repeat(var(--bi-flow-steps, 3), minmax(64px, 1fr));
    scrollbar-width: thin;
  }

  .bi-shell-transaction .bi-transaction-state {
    min-height: calc(100dvh - 140px);
    padding: 16px 0;
  }

  .bi-shell-transaction .bi-transaction-state__card {
    padding: 24px 16px;
  }

  .bi-shell-transaction .bi-transaction-bottom-action {
    gap: 8px;
  }

  .bi-shell-transaction .bi-transaction-bottom-action > .btn,
  .bi-shell-transaction .bi-transaction-bottom-action > button,
  .bi-shell-transaction .bi-transaction-bottom-action > a {
    min-width: 0;
    max-width: 58vw;
  }

  .bi-shell-transaction .form-grid,
  .bi-shell-transaction .wizard-grid,
  .bi-shell-workspace .form-grid,
  .bi-shell-workspace .wizard-grid,
  .bi-shell-workspace .profile-form-grid.two-cols {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Workspace shell: sidebar, topbar and content share one viewport contract. */
.bi-shell-workspace .bi-workspace-sidebar {
  max-height: 100dvh;
  padding-top: max(16px, var(--bi-safe-top, 0px));
  padding-bottom: max(16px, var(--bi-safe-bottom, 0px));
}

.bi-shell-workspace .bi-workspace-topbar {
  box-sizing: border-box;
  max-width: 100vw;
}

.bi-shell-workspace .bi-workspace-title,
.bi-shell-workspace .bi-workspace-topbar-actions,
.bi-shell-workspace .bi-company-switcher--topbar {
  min-width: 0;
}

.bi-shell-workspace .bi-workspace-title strong,
.bi-shell-workspace .bi-workspace-title small {
  max-width: 100%;
}

.bi-shell-workspace .bi-workspace-site-link,
.bi-shell-workspace .bi-workspace-icon-button {
  flex: 0 0 44px;
}

.bi-shell-workspace .vendor-shell,
.bi-shell-workspace .vendor-profile-shell,
.bi-shell-workspace .trip-app-shell,
.bi-shell-workspace .businfo-account-page,
.bi-shell-workspace .registration-page {
  width: 100%;
}

/* Sticky action bars stay aligned with the workspace rail/sidebar. */
.bi-shell-workspace .profile-savebar,
.bi-shell-workspace .trip-app-bottom-bar {
  z-index: calc(var(--bi-workspace-z-bottom, 1070) + 3);
  max-width: 100vw;
}

body.is-keyboard-open.bi-shell-workspace .bi-workspace-bottom-nav {
  display: none !important;
}

body.is-keyboard-open.bi-shell-workspace .profile-savebar,
body.is-keyboard-open.bi-shell-workspace .trip-app-bottom-bar {
  bottom: var(--bi-keyboard-inset, 0px) !important;
}

body.is-keyboard-open.bi-shell-workspace .profile-step-actions,
body.is-keyboard-open.bi-shell-workspace .trip-stepper {
  position: static;
}

/* Tablet and small laptop topbar: reserve space for title and compact actions. */
@media (min-width: 768px) and (max-width: 1199px) {
  .bi-shell-workspace .bi-workspace-site-link {
    width: 44px;
    padding: 0;
  }

  .bi-shell-workspace .bi-workspace-site-link > span {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  .bi-shell-workspace .bi-company-switcher--topbar {
    width: clamp(160px, 25vw, 230px);
  }

  .bi-shell-workspace .bi-workspace-topbar-actions {
    gap: 6px;
  }

  .bi-shell-workspace .vendor-topbar,
  .bi-shell-workspace .profile-header,
  .bi-shell-workspace .account-hero,
  .bi-shell-workspace .account-page-header {
    align-items: flex-start;
  }
}

@media (max-width: 767px) {
  /* The switcher remains available in the drawer; hiding the duplicate keeps the topbar usable at 320px. */
  .bi-shell-workspace .bi-company-switcher--topbar {
    display: none;
  }

  .bi-shell-workspace .bi-workspace-topbar {
    grid-template-columns: 44px minmax(0, 1fr) auto;
    gap: 6px;
    padding-inline: max(8px, var(--bi-safe-left, 0px)) max(8px, var(--bi-safe-right, 0px));
  }

  .bi-shell-workspace .bi-workspace-title small {
    font-size: 9px;
  }

  .bi-shell-workspace .bi-workspace-title strong {
    font-size: 13px;
  }

  .bi-shell-workspace .bi-workspace-topbar-actions {
    gap: 4px;
  }

  .bi-shell-workspace .bi-workspace-sidebar {
    width: min(326px, calc(100vw - 24px));
    padding-bottom: calc(16px + max(var(--bi-safe-bottom, 0px), env(safe-area-inset-bottom)));
  }

  .bi-shell-workspace .bi-workspace-bottom-nav {
    padding-inline: max(6px, var(--bi-safe-left, 0px)) max(6px, var(--bi-safe-right, 0px));
    padding-bottom: max(7px, var(--bi-safe-bottom, 0px), env(safe-area-inset-bottom));
  }

  .bi-shell-workspace .bi-workspace-bottom-nav a,
  .bi-shell-workspace .bi-workspace-bottom-nav button {
    min-height: 50px;
    font-size: 9px;
  }

  .bi-shell-workspace .bi-workspace-bottom-nav a > i,
  .bi-shell-workspace .bi-workspace-bottom-nav button > i {
    font-size: 17px;
  }

  .bi-shell-workspace .profile-savebar,
  .bi-shell-workspace .trip-app-bottom-bar {
    max-height: min(38dvh, 180px);
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  .bi-shell-workspace .vendor-confirm-card,
  .bi-shell-workspace .profile-confirm-card {
    grid-template-columns: 44px minmax(0, 1fr);
    padding: 18px 14px;
  }

  .bi-shell-workspace .vendor-confirm-actions,
  .bi-shell-workspace .profile-confirm-actions,
  .bi-shell-workspace .modal-footer {
    display: grid;
    grid-template-columns: 1fr;
  }

  .bi-shell-workspace .vendor-confirm-actions .btn,
  .bi-shell-workspace .profile-confirm-actions .btn,
  .bi-shell-workspace .modal-footer .btn {
    width: 100%;
  }

  .bi-shell-workspace .saas-toolbar,
  .bi-shell-workspace .vendor-topbar,
  .bi-shell-workspace .profile-header,
  .bi-shell-workspace .account-hero,
  .bi-shell-workspace .account-page-header,
  .bi-shell-workspace .account-panel-head {
    min-width: 0;
  }

  .bi-shell-workspace .saas-filter,
  .bi-shell-workspace .saas-search-box,
  .bi-shell-workspace .vendor-search {
    width: 100%;
    min-width: 0 !important;
  }
}

/* Landscape tablets: compact side rail, two-column forms where space permits, no page-level overflow. */
@media (orientation: landscape) and (min-width: 768px) and (max-width: 1199px) {
  .bi-shell-workspace .bi-workspace-topbar {
    min-height: calc(60px + var(--bi-safe-top, 0px));
  }

  .bi-shell-workspace .bi-workspace ~ .businfo-account-page,
  .bi-shell-workspace .bi-workspace ~ .registration-page,
  .bi-shell-workspace .bi-workspace ~ .bi-workspace-main,
  .bi-shell-workspace .bi-workspace ~ .vendor-app-main,
  .bi-shell-workspace .bi-workspace ~ .trip-app-shell {
    padding-top: calc(60px + var(--bi-safe-top, 0px) + 16px);
  }

  .bi-shell-workspace .profile-form-grid.two-cols,
  .bi-shell-workspace .wizard-grid,
  .bi-shell-workspace .form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .bi-shell-workspace .profile-form-grid.two-cols > .full,
  .bi-shell-workspace .wizard-grid > .full,
  .bi-shell-workspace .form-grid > .full {
    grid-column: 1 / -1;
  }

  .bi-shell-workspace .modal-dialog {
    max-width: min(88vw, 720px);
  }

  .bi-shell-transaction .bi-transaction-page {
    padding-top: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .bi-shell-transaction .bi-transaction-summary,
  .bi-shell-workspace .bi-workspace-sidebar,
  .bi-shell-workspace .profile-preview-panel {
    transition: none !important;
  }
}

/* The component workspace offsets its content with margin-left. When the site
 * template adds a full-width host wrapper, constrain the content width by the
 * same rail/sidebar value so margin + width never exceeds the viewport. */
@media (min-width: 1024px) and (max-width: 1439px) {
  body.bi-shell-workspace:has(.bi-workspace) .businfo-account-page,
  body.bi-shell-workspace:has(.bi-workspace) .registration-page,
  body.bi-shell-workspace:has(.bi-workspace) .bi-workspace-main,
  body.bi-shell-workspace:has(.bi-workspace) .vendor-app-main,
  body.bi-shell-workspace:has(.bi-workspace) .trip-app-shell {
    box-sizing: border-box;
    width: calc(100% - var(--bi-workspace-rail-width, 5.5rem));
    max-width: calc(100% - var(--bi-workspace-rail-width, 5.5rem));
  }
}

@media (min-width: 1440px) {
  body.bi-shell-workspace:has(.bi-workspace) .businfo-account-page,
  body.bi-shell-workspace:has(.bi-workspace) .registration-page,
  body.bi-shell-workspace:has(.bi-workspace) .bi-workspace-main,
  body.bi-shell-workspace:has(.bi-workspace) .vendor-app-main,
  body.bi-shell-workspace:has(.bi-workspace) .trip-app-shell {
    box-sizing: border-box;
    width: calc(100% - var(--bi-workspace-sidebar-width, 17rem));
    max-width: calc(100% - var(--bi-workspace-sidebar-width, 17rem));
  }
}