/**
 * VMHS compact native mobile — public portal + staff system
 * Load after responsive enhancement layers.
 */

/* ─── Shared mobile tokens ───────────────────────────────────────── */
@media (max-width: 767.98px) {
  .vmhs-public.vmhs-app-shell {
    --app-header-h: 3.25rem;
    --app-bottom-nav-h: 3.5rem;
    --app-mobile-gutter: 0.75rem;
    --app-radius: 0.65rem;
    --app-radius-lg: 0.85rem;
  }

  .vmhs-app.vmhs-desktop-shell,
  body[data-vmhs-theme].vmhs-desktop-shell {
    --vmhs-mobile-gutter: 0.75rem;
    --vmhs-mobile-card-pad: 0.85rem;
  }
}

@media (max-width: 575.98px) {
  .vmhs-public.vmhs-app-shell {
    --app-header-h: 3rem;
    --app-bottom-nav-h: 3.35rem;
    --app-mobile-gutter: 0.65rem;
  }

  .vmhs-app.vmhs-desktop-shell,
  body[data-vmhs-theme].vmhs-desktop-shell {
    --vmhs-mobile-gutter: 0.65rem;
    --vmhs-mobile-card-pad: 0.75rem;
  }
}

/* ─── Public shell ───────────────────────────────────────────────── */
@media (max-width: 767.98px) {
  .vmhs-public .landing-container,
  .vmhs-public .app-container {
    padding-left: max(var(--app-mobile-gutter, 0.75rem), env(safe-area-inset-left));
    padding-right: max(var(--app-mobile-gutter, 0.75rem), env(safe-area-inset-right));
  }

  /* Header — single compact row */
  .vmhs-public .public-header .header-inner {
    grid-template-areas: "brand actions" !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    row-gap: 0 !important;
    padding: 0.45rem var(--app-mobile-gutter, 0.75rem) !important;
    column-gap: 0.5rem !important;
  }

  .vmhs-public .public-header .nav-links {
    display: none !important;
  }

  .vmhs-public .public-header .brand-link img {
    width: 2.125rem !important;
    height: 2.125rem !important;
    max-width: none !important;
    object-fit: contain !important;
    object-position: center !important;
  }

  .vmhs-public .public-header .brand-text-app strong {
    font-size: 0.9375rem;
  }

  .vmhs-public .public-header .brand-text-app > span {
    display: none;
  }

  .vmhs-public .public-header-toolbar {
    padding: 0.1rem;
    gap: 0.1rem;
    border-radius: 0.6rem;
  }

  .vmhs-public .public-header-icon-btn,
  .vmhs-public .public-header-notifications__toggle {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 0.55rem !important;
  }

  .vmhs-public .header-actions {
    gap: 0.25rem !important;
  }

  .vmhs-public .public-header-cta {
    padding: 0.4rem 0.55rem !important;
    min-height: 2.25rem;
    border-radius: 0.55rem !important;
  }

  .vmhs-public .public-header-cta__text {
    display: none;
  }

  .vmhs-public .mobile-nav-toggle {
    width: 2.25rem;
    height: 2.25rem;
  }

  /* Bottom tab bar */
  .vmhs-public .app-bottom-nav {
    height: var(--app-bottom-nav-h);
    padding: 0.2rem 0.35rem calc(0.15rem + env(safe-area-inset-bottom));
    box-shadow: 0 -1px 0 var(--app-border), 0 -8px 24px rgba(15, 23, 42, 0.05);
  }

  .vmhs-public .app-bottom-nav a {
    gap: 0.05rem;
    min-height: 44px;
    font-size: 0.5625rem;
    letter-spacing: 0.01em;
    border-radius: 0.5rem;
  }

  .vmhs-public .app-bottom-nav a i {
    font-size: 1.125rem;
  }

  /* Mobile drawer — fit compact chrome */
  .vmhs-public .mobile-nav {
    top: calc(var(--app-header-h) + 0.35rem) !important;
    bottom: calc(var(--app-bottom-nav-h) + 0.35rem) !important;
  }

  /* Page sections */
  .vmhs-public .app-hero {
    --app-hero-gutter-top: 0.85rem;
    padding-bottom: 1.25rem;
  }

  .vmhs-public .vmhs-public-page-head {
    padding: 0.65rem 0 0.5rem;
  }

  .vmhs-public .vmhs-public-page-head__inner {
    padding: 0.85rem 0.95rem 0.9rem 1.05rem;
  }

  .vmhs-public .app-card__body {
    padding: var(--vmhs-mobile-card-pad, 0.85rem) 1rem;
  }

  .vmhs-public .app-tile,
  .vmhs-public .app-action-btn {
    padding: 0.75rem 0.85rem;
  }

  .vmhs-public .app-stats {
    gap: 0.4rem;
  }

  .vmhs-public .app-action-row {
    gap: 0.4rem;
    padding-bottom: 0.15rem;
  }

  /* FAB offsets — correct widget class names */
  .vmhs-public .vmhs-live-chat-widget,
  .vmhs-public .vmhs-bonga-widget-float {
    bottom: calc(var(--app-bottom-nav-h) + env(safe-area-inset-bottom, 0px) + 0.5rem) !important;
  }

  .vmhs-public .vmhs-scroll-top {
    bottom: calc(
      var(--app-bottom-nav-h) + env(safe-area-inset-bottom, 0px) + 0.5rem + 4.15rem
    ) !important;
  }
}

@media (max-width: 575.98px) {
  .vmhs-public .app-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.35rem;
  }

  .vmhs-public .app-card__body {
    padding: 0.75rem 0.85rem;
  }
}

/* ─── Staff system — compact mobile workspace ────────────────────── */
@media (max-width: 767.98px) {
  .vmhs-app .pc-container,
  body[data-vmhs-theme] .pc-container {
    padding-left: max(var(--vmhs-mobile-gutter, 0.75rem), env(safe-area-inset-left)) !important;
    padding-right: max(var(--vmhs-mobile-gutter, 0.75rem), env(safe-area-inset-right)) !important;
  }

  .vmhs-app .pc-content,
  body[data-vmhs-theme] .pc-content {
    padding: 0.65rem max(var(--vmhs-mobile-gutter, 0.75rem), env(safe-area-inset-left)) 0.85rem max(var(--vmhs-mobile-gutter, 0.75rem), env(safe-area-inset-right)) !important;
  }

  .vmhs-app .vmhs-page-header,
  body[data-vmhs-theme] .vmhs-page-header {
    margin-bottom: 0.75rem;
    padding-bottom: 0.65rem;
  }

  .vmhs-app .vmhs-page-header__title,
  body[data-vmhs-theme] .vmhs-page-header__title {
    font-size: 1.15rem;
    line-height: 1.25;
  }

  .vmhs-app .vmhs-page-header__lead,
  body[data-vmhs-theme] .vmhs-page-header__lead {
    font-size: 0.8125rem;
  }

  .vmhs-app .vmhs-page-header__actions,
  body[data-vmhs-theme] .vmhs-page-header__actions {
    gap: 0.35rem;
  }

  .vmhs-app .vmhs-page-header__actions .btn,
  body[data-vmhs-theme] .vmhs-page-header__actions .btn {
    padding: 0.35rem 0.65rem;
    font-size: 0.8125rem;
  }

  .vmhs-app .card .card-body,
  body[data-vmhs-theme] .card .card-body,
  .vmhs-app .card-stretch .card-body,
  body[data-vmhs-theme] .card-stretch .card-body {
    padding: var(--vmhs-mobile-card-pad, 0.85rem) !important;
  }

  .vmhs-app .metric-card,
  body[data-vmhs-theme] .metric-card {
    border-radius: 0.65rem;
  }

  .vmhs-app .metric-card .card-body,
  body[data-vmhs-theme] .metric-card .card-body {
    padding: 0.65rem 0.75rem !important;
  }

  .vmhs-app .vmhs-status-strip,
  body[data-vmhs-theme] .vmhs-status-strip {
    gap: 0.35rem;
    margin-bottom: 0.65rem;
  }

  .vmhs-app .vmhs-intake-rail,
  body[data-vmhs-theme] .vmhs-intake-rail {
    margin-bottom: 0.65rem;
  }

  .vmhs-app .pc-header.vmhs-toolbar,
  body[data-vmhs-theme] .pc-header.vmhs-toolbar {
    min-height: 3rem;
  }

  .vmhs-app .pc-header .pc-head-link,
  body[data-vmhs-theme] .pc-header .pc-head-link {
    min-width: 2.5rem;
    min-height: 2.5rem;
  }

  .vmhs-app .pc-footer.vmhs-footer,
  body[data-vmhs-theme] .pc-footer.vmhs-footer {
    margin-top: 0.35rem !important;
    padding: 0.45rem 0 calc(0.45rem + env(safe-area-inset-bottom)) !important;
    border-top: 1px solid rgba(15, 23, 42, 0.06);
  }

  .vmhs-app .pc-footer .footer-wrapper,
  body[data-vmhs-theme] .pc-footer .footer-wrapper {
    padding-left: max(var(--vmhs-mobile-gutter, 0.75rem), env(safe-area-inset-left));
    padding-right: max(var(--vmhs-mobile-gutter, 0.75rem), env(safe-area-inset-right));
  }

  .vmhs-app .pc-footer .row,
  body[data-vmhs-theme] .pc-footer .row {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 0.35rem;
    text-align: left;
  }

  .vmhs-app .pc-footer p,
  body[data-vmhs-theme] .pc-footer p {
    font-size: 0.6875rem;
    line-height: 1.3;
    margin: 0 !important;
  }

  .vmhs-app .pc-footer .footer-link,
  body[data-vmhs-theme] .pc-footer .footer-link {
    font-size: 0.6875rem;
  }

  .vmhs-app .table thead th,
  .vmhs-app .table tbody td,
  body[data-vmhs-theme] .table thead th,
  body[data-vmhs-theme] .table tbody td {
    padding: 0.5rem 0.45rem;
    font-size: 0.75rem;
  }

  .vmhs-app .vmhs-workspace__body > .row,
  body[data-vmhs-theme] .vmhs-workspace__body > .row {
    --bs-gutter-x: 0.5rem;
    --bs-gutter-y: 0.5rem;
  }

  .vmhs-app .alert,
  body[data-vmhs-theme] .alert {
    padding: 0.55rem 0.65rem;
    font-size: 0.8125rem;
    margin-bottom: 0.65rem;
  }
}

@media (max-width: 575.98px) {
  .vmhs-app .vmhs-page-header,
  body[data-vmhs-theme] .vmhs-page-header {
    flex-direction: column;
    align-items: stretch;
  }

  .vmhs-app .vmhs-page-header__actions,
  body[data-vmhs-theme] .vmhs-page-header__actions {
    width: 100%;
  }

  .vmhs-app .vmhs-page-header__actions .btn-group,
  body[data-vmhs-theme] .vmhs-page-header__actions .btn-group {
    width: 100%;
  }

  .vmhs-app .pc-footer .col-sm,
  .vmhs-app .pc-footer .col-auto,
  body[data-vmhs-theme] .pc-footer .col-sm,
  body[data-vmhs-theme] .pc-footer .col-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: none;
  }
}

/* Guest account hub */
@media (max-width: 767.98px) {
  .vmhs-public .guest-dash-layout {
    gap: 0.65rem;
  }

  .vmhs-public .guest-dash-stats {
    gap: 0.4rem;
  }

  .vmhs-public .guest-dash-stat {
    padding: 0.65rem 0.75rem;
  }

  .vmhs-public .guest-hub-nav__link {
    padding: 0.4rem 0.7rem;
    font-size: 0.8125rem;
    min-height: 2.25rem;
  }

  .vmhs-public .guest-dash-list__item {
    padding: 0.65rem 0.75rem;
  }
}