/**
 * TradeHub Responsive Governance — enforced breakpoints
 */

/* Mobile-first utilities */
.desktop-only { display: none !important; }
.mobile-only { display: block; }
.desktop-hide { display: block; }

@media (min-width: 1101px) {
  .desktop-only { display: revert !important; }
  .header-nav.desktop-only,
  .main-nav.desktop-only { display: flex !important; }
  .mobile-only,
  .desktop-hide,
  .mobile-filter-bar,
  .filter-drawer-overlay,
  .filter-drawer {
    display: none !important;
  }
  .nav-toggle { display: none !important; }
  body.has-mobile-nav { padding-bottom: 0; }
}

@media (max-width: 767px) {
  .header-actions .btn-primary.btn-sm {
    min-height: var(--touch-min);
    padding: var(--space-2) var(--space-3);
    font-size: var(--text-sm);
  }

  .mobile-filter-bar {
    display: flex;
    gap: var(--space-2);
    margin-bottom: var(--space-3);
  }

  .btn-filter-open {
    font-size: var(--text-sm);
    padding: var(--space-2) var(--space-3);
    min-height: var(--touch-min);
    border: 1px solid var(--token-accent, #1d4ed8);
    border-radius: var(--radius-md);
    background: var(--token-accent, #1d4ed8);
    color: #fff;
  }

  .mobile-search-inline input {
    min-height: var(--touch-min) !important;
    font-size: var(--text-sm) !important;
  }

  .filter-drawer {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: var(--z-drawer);
    background: var(--token-surface);
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    max-height: 75vh;
    transform: translateY(100%);
    transition: transform var(--duration-slow);
  }

  .filter-drawer.open { transform: translateY(0); }

  .filter-drawer-overlay {
    position: fixed;
    inset: 0;
    z-index: var(--z-overlay);
    background: rgba(15, 20, 25, 0.4);
    opacity: 0;
    visibility: hidden;
  }

  .filter-drawer-overlay.open {
    opacity: 1;
    visibility: visible;
  }

  .table-responsive-cards .data-table thead { display: none; }

  .table-responsive-cards .data-table tr {
    display: block;
    padding: var(--space-3) var(--space-4);
    border-bottom: 1px solid var(--token-border);
  }

  .table-responsive-cards .data-table td {
    display: flex;
    justify-content: space-between;
    padding: var(--space-1) 0;
    border: none;
    font-size: var(--text-sm);
  }

  body.has-mobile-nav { padding-bottom: 52px; }

  .eco-mobile-nav {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: var(--z-header);
    display: flex;
    justify-content: space-around;
    background: var(--token-surface);
    border-top: 1px solid var(--token-border);
    padding: var(--space-1) var(--space-2) calc(var(--space-1) + env(safe-area-inset-bottom));
  }

  /* eco-mobile-nav: layout-fixes.css (dikey ikon + etiket) */
}

/* Governance: prevent oversized mobile UI */
@media (max-width: 767px) {
  [data-th-oversized] {
    min-height: var(--touch-min) !important;
    font-size: var(--text-sm) !important;
    padding: var(--space-2) var(--space-4) !important;
  }

  h1 { font-size: var(--text-2xl) !important; }
  .corp-hero h1 { max-width: none; }
}

/* Viewport audit helpers */
html[data-th-audit] * {
  outline: 1px dashed rgba(194, 65, 12, 0.15);
}

html[data-th-audit] .th-qa-issue {
  outline: 2px solid var(--token-danger) !important;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}
