/* BIVA responsive foundation — shared across public, client, talent,
   hospitality and administration experiences. */

:root {
  --biva-mobile-gutter: clamp(14px, 4vw, 22px);
  --biva-touch-target: 44px;
  --biva-mobile-radius: 18px;
}

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

body {
  min-width: 0;
}

img,
svg,
video,
canvas {
  max-width: 100%;
}

button,
input,
select,
textarea {
  font: inherit;
}

button,
[role="button"],
a {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

input,
select,
textarea {
  max-width: 100%;
}

@media (max-width: 760px) {
  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
  }

  body {
    font-size: 14px;
  }

  :where(button, [role="button"], input:not([type="checkbox"]):not([type="radio"]), select) {
    min-height: var(--biva-touch-target);
  }

  :where(input, select, textarea) {
    font-size: 16px !important;
  }

  :where(.portal-shell, .portal-card, main, section, article, aside, header, footer, nav, div) {
    min-width: 0;
  }

  .portal-card {
    padding-right: var(--biva-mobile-gutter);
    padding-left: var(--biva-mobile-gutter);
  }

  :where(.dashboard-container, .dashboard-content, .page-container, .page-content,
    .biva-admin-layout__content, .hospitality-content, .talent-content,
    .client-content, .workspace-content) {
    width: 100%;
    max-width: 100%;
    padding-right: var(--biva-mobile-gutter);
    padding-left: var(--biva-mobile-gutter);
  }

  :where(.dashboard-grid, .dashboard-stats, .stats-grid, .metrics-grid,
    .card-grid, .cards-grid, .action-grid, .dashboard-actions,
    .form-grid, .filter-grid, .summary-grid) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  :where(.page-header, .section-header, .dashboard-section-heading,
    .toolbar, .table-toolbar, .filter-bar, .filters-bar, .actions-bar,
    .biva-admin-layout__header, .biva-admin-surface__header) {
    align-items: stretch;
    flex-direction: column;
    gap: 12px;
  }

  :where(.page-header, .section-header, .dashboard-section-heading,
    .biva-admin-layout__header) h1 {
    font-size: clamp(1.7rem, 8.5vw, 2.35rem) !important;
    line-height: 1.08;
    overflow-wrap: anywhere;
  }

  :where(.toolbar, .table-toolbar, .filter-bar, .filters-bar,
    .actions-bar, .header-actions, .page-actions,
    .biva-admin-layout__header-actions) > * {
    max-width: 100%;
  }

  :where(.toolbar, .table-toolbar, .filter-bar, .filters-bar,
    .actions-bar, .header-actions, .page-actions) > button,
  :where(.toolbar, .table-toolbar, .filter-bar, .filters-bar,
    .actions-bar, .header-actions, .page-actions) > a {
    justify-content: center;
  }

  :where(.table-container, .table-wrapper, .table-scroll, .data-table-wrap,
    .responsive-table, .biva-table-wrap, .worklog-table-wrap,
    [class*="table-container"], [class*="table-wrapper"]) {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
  }

  :where(table) {
    font-size: .82rem;
  }

  :where(th, td) {
    padding: 12px 10px;
  }

  :where(.modal, .dialog, [role="dialog"]) {
    max-width: 100%;
  }

  :where(.modal-content, .modal__content, .dialog-content,
    .biva-modal__panel, .signup-intent-modal__panel) {
    width: calc(100vw - 20px) !important;
    max-width: none !important;
    max-height: calc(100dvh - 20px);
    margin: auto 10px 10px;
    border-radius: 24px 24px 18px 18px !important;
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  :where(.modal-footer, .modal__footer, .dialog-actions) {
    position: sticky;
    bottom: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    padding-bottom: max(14px, env(safe-area-inset-bottom));
    background: inherit;
  }

  :where(.modal-footer, .modal__footer, .dialog-actions) > * {
    width: 100%;
  }

  .dashboard-nav {
    min-height: 64px;
    padding: 10px var(--biva-mobile-gutter);
  }

  .dashboard-nav__brand-copy,
  .dashboard-nav__context,
  .dashboard-nav__user-copy {
    display: none;
  }

  .dashboard-nav__account {
    margin-left: auto;
    gap: 6px;
  }

  .dashboard-hero {
    padding: 22px 18px !important;
    border-radius: 22px !important;
  }

  .dashboard-hero__left,
  .dashboard-hero__right {
    width: 100%;
  }

  .dashboard-hero__actions,
  .dashboard-hero__quick {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .biva-admin-layout__content {
    padding-top: 14px;
    padding-bottom: calc(34px + env(safe-area-inset-bottom));
  }

  .biva-admin-sidebar {
    z-index: 100;
  }

  .biva-admin-sidebar__inner {
    padding-top: max(10px, env(safe-area-inset-top));
  }

  :where(.card, .panel, .surface, .biva-admin-surface) {
    max-width: 100%;
  }

  :where(.toast-container, .notification-toast-container) {
    right: 10px !important;
    bottom: calc(10px + env(safe-area-inset-bottom)) !important;
    left: 10px !important;
    width: auto !important;
    max-width: none !important;
  }
}

@media (max-width: 390px) {
  :root {
    --biva-mobile-gutter: 12px;
  }

  :where(.modal-content, .modal__content, .dialog-content,
    .biva-modal__panel, .signup-intent-modal__panel) {
    width: calc(100vw - 12px) !important;
    margin-right: 6px;
    margin-left: 6px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}