/**
 * Easy responsive pack: shell + login + account + channel connect + courier.
 * Tablet/phone ≤1023px. Order grids intentionally untouched.
 */

/* Hamburger: theme hides it from md up; keep through tablet */
@media (max-width: 1023px) {
  .nav-link.nav-toggler {
    display: block !important;
  }
}

/* ---- Shell: off-canvas nav ---- */
@media (max-width: 1023px) {
  .left-sidebar {
    position: fixed !important;
    left: -140px !important;
    width: 120px !important;
    height: 100% !important;
    z-index: 1050 !important;
    transition: left 0.2s ease;
  }

  .left-sidebar.sidebar-bar-mobile {
    left: 0 !important;
  }

  .footer,
  .page-wrapper {
    margin-left: 0 !important;
  }

  .topbar {
    width: 100% !important;
  }

  /* Theme forces d-flex → block under 1023 and breaks toolbars; keep real flex for pack */
  .sh-pack .d-flex,
  .topbar .d-flex,
  .navbar-nav {
    display: flex !important;
  }

  .leftSideCards,
  .integrationCards {
    left: 120px !important;
    max-width: calc(100vw - 130px);
    z-index: 1051;
  }
}

@media (max-width: 767px) {
  .topbar .navbar-nav.my-lg-0 .nav-item > a span,
  .topbar .hide-on-phone {
    display: none !important;
  }

  .page-wrapper {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* ---- Login ---- */
@media (max-width: 767px) {
  app-login .card,
  .login-box,
  .container-fluid .card {
    margin: 0 8px;
  }

  app-login img.image-responsive,
  app-login img.img-responsive {
    max-width: 180px;
    height: auto;
  }

  app-login .col-md-5 {
    max-width: 100%;
    flex: 0 0 100%;
  }
}

/* ---- My Account / forms ---- */
@media (max-width: 1023px) {
  app-my-account .mat-form-field,
  app-my-account .mat-mdc-form-field {
    width: 100%;
  }

  app-my-account .col-md-4 {
    flex: 0 0 100%;
    max-width: 100%;
  }
}

/* ---- Channel connect + courier ---- */
@media (max-width: 1023px) {
  app-ebay-inte .nav-tabs,
  app-shopify-inti .nav-tabs,
  .sh-pack .nav-tabs {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  app-ebay-inte .nav-tabs .nav-item,
  app-shopify-inti .nav-tabs .nav-item,
  .sh-pack .nav-tabs .nav-item {
    flex: 0 0 auto;
  }

  app-ebay-inte .ebay-inte-logo,
  app-shopify-inti .img-fixed {
    max-width: 160px;
    height: auto;
  }

  app-shipping-courier-setup .col-md-3,
  app-shipping-courier-setup .col-md-6 {
    flex: 0 0 100%;
    max-width: 100%;
  }

  app-shipping-courier-setup .mat-form-field,
  app-shipping-courier-setup .mat-mdc-form-field {
    width: 100%;
  }

  app-shipping-courier-setup .table-responsive {
    display: block;
    width: 100%;
    overflow-x: auto;
  }
}