/*
 * Shared responsive and accessibility safeguards.
 * Added by the full mobile-readiness audit on 2026-07-17.
 * These rules intentionally avoid concealing layout defects with body-level
 * overflow clipping and preserve module-specific desktop presentation.
 */

:root {
  --responsive-touch-target: 44px;
  --responsive-page-gutter: clamp(12px, 2.2vw, 30px);
  --responsive-control-gap: clamp(8px, 1.4vw, 14px);
  --responsive-focus-ring: 3px solid rgba(49, 196, 189, 0.55);
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

:where(
  .dashboard-shell,
  .dashboard-main,
  .dashboard-content,
  .dashboard-section,
  .dashboard-panel,
  .admin-panel,
  .table-panel,
  .quotation-page,
  .quotation-preview,
  .prospects-workspace,
  .customers-page,
  .carrier-body main,
  form,
  fieldset,
  label
) {
  min-inline-size: 0;
}

:where(img, svg, video, canvas, iframe) {
  max-inline-size: 100%;
}

:where(img, video) {
  block-size: auto;
}

:where(input, select, textarea, button) {
  max-inline-size: 100%;
}

:where(input, select, textarea) {
  min-inline-size: 0;
}

:where(
  .dashboard-content,
  .dashboard-panel,
  .admin-panel,
  .data-table,
  .quotation-table,
  .customer-profile,
  .prospect-detail
) :where(a, p, dd, td, th, strong, small, span) {
  overflow-wrap: anywhere;
}

:where(
  .mobile-menu,
  .sidebar-collapse,
  .sidebar-nested-toggle,
  .dashboard-sidebar a,
  .dashboard-sidebar button,
  .primary-action,
  .secondary-action,
  .table-action,
  .button,
  button:not([hidden])
) {
  min-block-size: var(--responsive-touch-target);
}

:where(button, a, summary, input, select, textarea):focus-visible {
  outline: var(--responsive-focus-ring);
  outline-offset: 2px;
}

.dashboard-main,
.dashboard-content {
  inline-size: 100%;
  max-inline-size: 100%;
}

.dashboard-content {
  padding-inline: max(var(--responsive-page-gutter), env(safe-area-inset-left)) max(var(--responsive-page-gutter), env(safe-area-inset-right));
  padding-bottom: max(var(--responsive-page-gutter), env(safe-area-inset-bottom));
}

.dashboard-topbar {
  min-inline-size: 0;
  padding-inline: max(var(--responsive-page-gutter), env(safe-area-inset-left)) max(var(--responsive-page-gutter), env(safe-area-inset-right));
}

.topbar-left,
.topbar-actions,
.section-heading-row,
.table-heading,
.form-actions,
.filter-actions,
.hero-actions,
.quotation-toolbar,
.quotation-tabs,
.pagination {
  min-inline-size: 0;
  flex-wrap: wrap;
}

.topbar-left > div,
.topbar-actions > *,
.user-chip > div {
  min-inline-size: 0;
}

.dashboard-topbar h1,
.section-heading-row h2,
.table-heading h2,
.table-heading h3 {
  max-inline-size: 100%;
  overflow-wrap: anywhere;
}

.user-chip strong,
.user-chip small {
  display: block;
  max-inline-size: min(34vw, 260px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sidebar-backdrop {
  touch-action: manipulation;
}

.dashboard-sidebar {
  padding-bottom: max(12px, env(safe-area-inset-bottom));
}

.dashboard-sidebar :where(a, button) {
  touch-action: manipulation;
}

.sidebar-nested-header,
.sidebar-nested-parent,
.sidebar-nested-subnav,
.sidebar-subnav {
  min-inline-size: 0;
}

.sidebar-nested-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--responsive-touch-target);
  align-items: stretch;
}

.sidebar-nested-toggle {
  display: grid;
  place-items: center;
  inline-size: var(--responsive-touch-target);
  padding: 0;
}

.sidebar-nested-toggle[aria-expanded="true"] span {
  transform: rotate(90deg);
}

.table-scroll,
.bm-scroll {
  position: relative;
  inline-size: 100%;
  max-inline-size: 100%;
  overflow-x: auto;
  overflow-y: visible;
  overscroll-behavior-inline: contain;
  scrollbar-gutter: stable;
  -webkit-overflow-scrolling: touch;
}

.table-scroll::after,
.bm-scroll::after {
  content: "Scroll horizontally to view more columns";
  display: none;
  position: sticky;
  inset-inline-start: 10px;
  inline-size: max-content;
  margin-block: 8px 2px;
  border-radius: 999px;
  padding: 5px 9px;
  background: rgba(15, 17, 22, 0.92);
  color: #d8dce5;
  font-size: 0.72rem;
  font-weight: 700;
  pointer-events: none;
}

:where(.data-table, .bm-table, .quotation-table) {
  max-inline-size: none;
}

:where(.data-table, .bm-table, .quotation-table) :where(td, th) {
  vertical-align: top;
}

:where(.data-table, .bm-table, .quotation-table) :where(input, select, textarea) {
  min-inline-size: 0;
}

.pagination {
  align-items: center;
  gap: var(--responsive-control-gap);
}

.pagination > * {
  max-inline-size: 100%;
}

:where(
  [role="dialog"],
  .quotation-modal,
  .customer-modal-dialog,
  .services-modal,
  [data-user-modal],
  [data-access-modal],
  .summary-card-editor > section,
  #prospect-form:target,
  #prospect-import:target,
  #prospect-detail:target,
  #prospect-statuses:target,
  #prospect-convert:target
) {
  max-inline-size: calc(100vw - 24px);
  max-block-size: calc(100dvh - 24px);
}

:where(
  .quotation-modal-body,
  .customer-modal-dialog,
  .services-modal,
  [data-user-modal],
  [data-access-modal],
  .summary-card-editor > section,
  #prospect-form:target,
  #prospect-import:target,
  #prospect-detail:target,
  #prospect-statuses:target,
  #prospect-convert:target
) {
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

:where(.quotation-modal-head, .customer-modal-head) {
  padding-top: max(14px, env(safe-area-inset-top));
}

:where(.quotation-modal-close, .customer-modal-close, .summary-editor-close) {
  flex: 0 0 var(--responsive-touch-target);
  min-inline-size: var(--responsive-touch-target);
  min-block-size: var(--responsive-touch-target);
}

:where(.prospect-count-grid, .customer-stats, .quotation-stats) > * {
  min-inline-size: 0;
}

:where(.prospect-count-card, .customer-stats article, .quotation-stat) strong {
  overflow-wrap: anywhere;
}

@media (max-width: 1024px) {
  .dashboard-topbar {
    align-items: flex-start;
    gap: 12px;
  }

  .topbar-actions {
    justify-content: flex-end;
  }

  .table-scroll::after,
  .bm-scroll::after {
    display: block;
  }
}

@media (max-width: 820px) {
  body.dashboard-body {
    min-block-size: 100dvh;
  }

  .dashboard-shell {
    grid-template-columns: minmax(0, 1fr);
  }

  .dashboard-sidebar {
    position: fixed;
    z-index: 1200;
    inset-block: 0;
    inset-inline-start: 0;
    inline-size: min(88vw, 340px);
    max-inline-size: calc(100vw - 44px);
    transform: translateX(-105%);
    transition: transform 180ms ease;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-top: env(safe-area-inset-top);
    box-shadow: 18px 0 50px rgba(0, 0, 0, 0.45);
  }

  .dashboard-shell.is-sidebar-open .dashboard-sidebar {
    transform: translateX(0);
  }

  .dashboard-shell.is-sidebar-open .sidebar-backdrop {
    display: block;
    position: fixed;
    z-index: 1190;
    inset: 0;
    background: rgba(0, 0, 0, 0.68);
  }

  .dashboard-main {
    grid-column: 1;
  }

  .mobile-menu {
    display: inline-grid;
    place-items: center;
    flex: 0 0 var(--responsive-touch-target);
    inline-size: var(--responsive-touch-target);
    padding: 0;
  }

  .sidebar-collapse {
    display: none;
  }

  .dashboard-topbar {
    position: relative;
    flex-direction: column;
  }

  .topbar-left,
  .topbar-actions {
    inline-size: 100%;
  }

  .topbar-actions {
    justify-content: flex-start;
  }

  .user-chip strong,
  .user-chip small {
    max-inline-size: min(60vw, 310px);
  }

  :where(.prospect-count-grid, .customer-stats, .quotation-stats) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  :where(.form-actions, .filter-actions, .hero-actions) > * {
    flex: 1 1 160px;
  }
}

@media (max-width: 600px) {
  :where(input, select, textarea) {
    font-size: 16px;
  }

  .dashboard-content,
  .dashboard-topbar {
    padding-inline: max(12px, env(safe-area-inset-left)) max(12px, env(safe-area-inset-right));
  }

  .dashboard-content {
    padding-top: 14px;
  }

  .dashboard-panel,
  .admin-panel {
    max-inline-size: 100%;
  }

  .topbar-actions .role-pill {
    order: 3;
  }

  .topbar-actions .logout-link {
    margin-inline-start: auto;
  }

  :where(.prospect-count-grid, .customer-stats, .quotation-stats) {
    grid-template-columns: minmax(0, 1fr);
  }

  :where(.form-actions, .filter-actions, .hero-actions, .pagination) {
    align-items: stretch;
  }

  :where(.form-actions, .filter-actions, .hero-actions) > * {
    flex-basis: 100%;
    inline-size: 100%;
  }

  .pagination {
    justify-content: center;
  }

  .pagination > :where(a, button) {
    flex: 1 1 120px;
    text-align: center;
  }

  :where(
    [role="dialog"],
    .quotation-modal,
    .customer-modal-dialog,
    .services-modal,
    [data-user-modal],
    [data-access-modal],
    .summary-card-editor > section,
    #prospect-form:target,
    #prospect-import:target,
    #prospect-detail:target,
    #prospect-statuses:target,
    #prospect-convert:target
  ) {
    inline-size: calc(100vw - 12px);
    max-inline-size: calc(100vw - 12px);
    max-block-size: calc(100dvh - 12px);
    border-radius: 12px 12px 0 0;
  }

  .quotation-modal-backdrop,
  .customer-modal,
  .summary-card-editor {
    align-items: end;
    padding: 6px;
  }

  .quotation-modal-head,
  .customer-modal-head {
    flex-wrap: wrap;
  }
}

@media (max-width: 380px) {
  .dashboard-topbar h1 {
    font-size: clamp(1.3rem, 8vw, 1.7rem);
  }

  .user-chip > div {
    display: none;
  }

  .dashboard-sidebar {
    inline-size: calc(100vw - 32px);
  }
}

@media (max-height: 520px) and (orientation: landscape) {
  .dashboard-topbar {
    position: relative;
  }

  .dashboard-sidebar {
    padding-top: 0;
  }

  :where(
    [role="dialog"],
    .quotation-modal,
    .customer-modal-dialog,
    .services-modal,
    [data-user-modal],
    [data-access-modal],
    .summary-card-editor > section
  ) {
    max-block-size: calc(100dvh - 8px);
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}