/* BLACKGSM v83 mobile-first responsive patch */
:root{
  --bgsm-mobile-base:360px;
  --bgsm-space-1:0.25rem;
  --bgsm-space-2:0.5rem;
  --bgsm-space-3:0.75rem;
  --bgsm-space-4:1rem;
  --bgsm-space-5:1.25rem;
  --bgsm-space-6:1.5rem;
  --bgsm-space-7:2rem;
  --bgsm-radius-lg:1rem;
  --bgsm-radius-xl:1.25rem;
}
html{font-size:16px;-webkit-text-size-adjust:100%}
body{overflow-x:hidden}
img,svg,video,canvas,iframe{max-width:100%;height:auto}
.container,.container-fluid{width:100%}
.table-responsive,.table-wrap,.dataTables_wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* Universal mobile-first fixes */
.auth-shell,
.business-auth-shell,
main.auth-shell{
  min-height:calc(100svh - var(--bgsm-auth-nav-offset,0px));
  padding:clamp(1rem,4vw,2rem) 0;
  align-items:flex-start!important;
}
.auth-card,
.business-auth-card,
.bgsm-tabler-auth-card{
  width:100%;
  border-radius:clamp(1rem,3vw,1.5rem);
  overflow:hidden;
}
.auth-form-wrap,
.business-auth-form,
.bgsm-tabler-auth-main{
  padding:clamp(1rem,4vw,1.5rem)!important;
}
.auth-form-wrap .btn,
.business-auth-form .btn,
.customer-login-form .btn,
.bgsm-tabler-form .btn,
.auth-form-grid .btn{
  min-height:48px;
}
.auth-form-wrap .form-control,
.auth-form-wrap .form-select,
.business-auth-form .form-control,
.business-auth-form .form-select,
.customer-login-form .form-control,
.customer-login-form .form-select,
.bgsm-tabler-form .form-control,
.bgsm-tabler-form .form-select,
.auth-form-grid .form-control,
.auth-form-grid .form-select{
  min-height:46px;
  padding:0.75rem 0.9rem;
  font-size:0.95rem;
  border-radius:0.9rem;
}
.auth-form-wrap .form-label,
.business-auth-form .form-label,
.customer-login-form .form-label,
.bgsm-tabler-form .form-label,
.auth-form-grid .form-label{
  display:block;
  margin-bottom:0.45rem;
  font-size:0.92rem;
  line-height:1.35;
  overflow-wrap:anywhere;
}
.customer-login-form .col-6,
.customer-login-form .col-sm-6,
.bgsm-tabler-form .col-6,
.auth-form-grid .col-6,
.row.mobile-stack > [class*="col-"]{
  width:100%;
}

/* Nav and hero motion */
.bgsm-auth-scroll-nav,
.portal-site-header,
.admin-topbar,
nav.sticky-top{
  transition:transform .28s ease, box-shadow .2s ease, background-color .2s ease;
  will-change:transform;
}
.bgsm-auth-scroll-nav.is-hidden,
.portal-site-header.is-hidden,
.admin-topbar.is-hidden,
nav.sticky-top.is-hidden{
  transform:translateY(calc(-100% - 10px));
}
.admin-hero-card,.reseller-hero-card,.portal-hero-card,.business-dashboard-hero,.dashboard-sticky-hero{
  position:relative;
  top:auto;
}

/* Page grids/cards */
.grid,
.product-grid,
.marketplace-grid,
.service-grid,
.dashboard-cards,
.stats-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(0.75rem,2.8vw,1.25rem);
}
.card,
.product-card,
.service-card,
.dashboard-card{min-width:0}

/* Login page cleanups */
.bgsm-customer-login-shell .auth-card,
.business-auth-shell .business-auth-card,
.bgsm-tabler-auth-shell .bgsm-tabler-auth-card,
main.auth-shell .auth-card{
  box-shadow:0 18px 48px rgba(15,23,42,.10);
}
.business-auth-topbar,
.bgsm-tabler-auth-top{
  gap:0.75rem;
  flex-wrap:wrap;
}
.business-auth-topbar__actions,
.bgsm-tabler-auth-actions,
.auth-linkbar{
  display:flex;
  flex-wrap:wrap;
  gap:0.6rem;
}
.business-auth-topbar__actions .btn,
.bgsm-tabler-auth-actions .btn,
.auth-linkbar a{
  max-width:100%;
}
.business-auth-links-inline{
  display:flex;
  flex-wrap:wrap;
  gap:0.4rem 0.6rem;
  align-items:center;
}

/* Small phones */
@media (max-width: 480px){
  html{font-size:15px}
  .container,.container-fluid{padding-left:12px;padding-right:12px}
  .auth-shell,
  .business-auth-shell,
  main.auth-shell{padding-top:1rem;padding-bottom:1.25rem}
  .auth-form-wrap,
  .business-auth-form,
  .bgsm-tabler-auth-main{padding:1rem!important}
  .auth-brand,.business-auth-brand,.bgsm-tabler-auth-brand{font-size:0.84rem}
  .auth-card h1,.auth-card .h1,.auth-card h2,.business-auth-card h1,.business-auth-card h2{line-height:1.2}
  .business-auth-topbar__actions .btn,
  .bgsm-tabler-auth-actions .btn,
  .auth-linkbar a{width:100%;justify-content:center}
  .btn,
  button,
  input[type="submit"],
  input[type="button"]{width:100%}
  .pagination{flex-wrap:wrap}
}

/* Tablet */
@media (min-width: 768px){
  .auth-shell,
  .business-auth-shell,
  main.auth-shell{align-items:center!important}
  .grid,
  .product-grid,
  .marketplace-grid,
  .service-grid,
  .dashboard-cards,
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* Desktop */
@media (min-width: 1024px){
  .grid,
  .service-grid,
  .dashboard-cards,
  .stats-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .marketplace-grid,
  .product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* Laptop main target */
@media (min-width: 1366px){
  .grid,
  .service-grid,
  .dashboard-cards,
  .stats-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .marketplace-grid,
  .product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .container{max-width:min(1200px, calc(100% - 32px))}
  .container-xl{max-width:min(1320px, calc(100% - 40px))}
}
