/* Global mobile-friendly layout for Sportsfest admin app */

html,
body {
  overflow-x: clip;
  max-width: 100%;
}

/* Sneat hides .layout-menu-toggle when collapsed — restore navbar hamburger on tablet/phone */
@media (max-width: 1199.98px) {
  .layout-navbar .layout-menu-toggle.navbar-nav,
  .layout-menu-fixed-offcanvas .layout-navbar .layout-menu-toggle,
  .layout-menu-collapsed .layout-navbar .layout-menu-toggle {
    display: flex !important;
  }

  #layout-navbar .container-xxl,
  #layout-navbar.container-xxl {
    max-width: 100%;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }

  .layout-content-navbar .layout-page {
    min-width: 0;
    max-width: 100%;
  }

  .layout-overlay.layout-menu-toggle {
    z-index: 1090;
  }

  .layout-menu {
    z-index: 1100;
  }
}

/* Tighter content padding on small screens */
@media (max-width: 575.98px) {
  .layout-page .content-wrapper .container-xxl.container-p-y,
  .layout-page .content-wrapper .flex-grow-1.container-p-y {
    padding-top: 0.75rem !important;
    padding-bottom: 0.75rem !important;
    padding-left: 0.625rem !important;
    padding-right: 0.625rem !important;
  }
}

@media (max-width: 767.98px) {
  .layout-page .content-wrapper .container-xxl.container-p-y,
  .layout-page .content-wrapper .flex-grow-1.container-p-y {
    padding-left: 0.75rem !important;
    padding-right: 0.75rem !important;
  }
}

/* Avoid double horizontal padding when a view nests another container */
@media (max-width: 767.98px) {
  .layout-page .content-wrapper > .container-xxl > .container-xxl.container-p-y {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* Page title + action rows */
@media (max-width: 767.98px) {
  .page-header-row,
  .container > .d-flex.justify-content-between.align-items-center.mb-4,
  .container.mt-4 > .d-flex.justify-content-between.align-items-center.mb-4 {
    flex-wrap: wrap;
    gap: 0.75rem;
  }

  .page-header-row > h1,
  .page-header-row > h2,
  .container > .d-flex.justify-content-between.align-items-center.mb-4 > h2,
  .container.mt-4 > .d-flex.justify-content-between.align-items-center.mb-4 > h2 {
    width: 100%;
    margin-bottom: 0;
  }

  .page-header-row .btn,
  .container > .d-flex.justify-content-between.align-items-center.mb-4 .btn,
  .container.mt-4 > .d-flex.justify-content-between.align-items-center.mb-4 .btn {
    flex: 1 1 auto;
  }
}

/* Card headers with badges / button groups */
@media (max-width: 767.98px) {
  .card-header.d-flex.justify-content-between {
    flex-wrap: wrap;
    gap: 0.5rem;
  }

  .card-header .d-flex.gap-2 {
    flex-wrap: wrap;
    width: 100%;
  }

  .card-header .d-flex.gap-2 .btn {
    flex: 1 1 calc(50% - 0.25rem);
    min-width: 0;
  }
}

@media (max-width: 575.98px) {
  .card-header .d-flex.gap-2 .btn {
    flex: 1 1 100%;
  }
}

/* Report filter grid */
@media (max-width: 991.98px) {
  .filter-row > [class*="col-"] {
    flex: 0 0 50%;
    max-width: 50%;
    margin-bottom: 0.5rem;
  }
}

@media (max-width: 575.98px) {
  .filter-row > [class*="col-"] {
    flex: 0 0 100%;
    max-width: 100%;
  }
}

/* Registration wizard: horizontal step nav on narrow screens */
@media (max-width: 991.98px) {
  .bs-stepper.wizard-vertical.sportsfest {
    flex-direction: column;
  }

  .bs-stepper.wizard-vertical.sportsfest .bs-stepper-header {
    border-right: none !important;
    border-bottom: 1px solid rgba(67, 89, 113, 0.12);
    flex-direction: row !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    flex-wrap: nowrap;
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
  }

  .bs-stepper.wizard-vertical.sportsfest .bs-stepper-header .step {
    flex-shrink: 0;
  }

  .bs-stepper.wizard-vertical.sportsfest .bs-stepper-header .line {
    display: none;
  }

  .bs-stepper.wizard-vertical.sportsfest .bs-stepper-header .bs-stepper-subtitle {
    display: none;
  }

  .bs-stepper.wizard-vertical.sportsfest .bs-stepper-header .bs-stepper-title {
    font-size: 0.75rem;
    white-space: nowrap;
  }
}

@media (max-width: 575.98px) {
  .registration-phase-banner .row > [class*="col-"] {
    flex: 0 0 100%;
    max-width: 100%;
  }
}

/* Tables */
.table-responsive {
  -webkit-overflow-scrolling: touch;
}

@media (max-width: 767.98px) {
  .table-responsive .table {
    font-size: 0.875rem;
  }

  .table-responsive .table th,
  .table-responsive .table td {
    padding: 0.5rem 0.375rem;
  }
}

/* Modals */
@media (max-width: 575.98px) {
  .modal-dialog {
    margin: 0.5rem;
    max-width: calc(100% - 1rem);
  }
}

/* Auth pages */
@media (max-width: 575.98px) {
  .authentication-wrapper .w-px-400 {
    max-width: 100% !important;
    width: 100% !important;
  }

  .authentication-wrapper .authentication-inner .p-sm-12,
  .authentication-wrapper .authentication-inner .p-6 {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
}

/* Home landing */
@media (max-width: 575.98px) {
  .home-hero .display-5 {
    font-size: 1.65rem;
  }

  .home-hero .lead {
    font-size: 1rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }
}

/* Scanner pages (employee + companion) */
.sf-scanner-shell {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

.sf-scanner-shell .row {
  margin-left: 0;
  margin-right: 0;
}

.sf-scanner-shell .card,
.sf-scanner-shell .table-responsive,
.sf-scanner-shell video,
.sf-scanner-shell #scanner-container {
  max-width: 100%;
}

.sf-scanner-shell .card-header .badge {
  flex-shrink: 0;
}

@media (max-width: 991.98px) {
  .sf-scanner-shell .col-lg-6 {
    padding: 0.5rem !important;
    flex: 0 0 100%;
    max-width: 100%;
  }

  .sf-scanner-shell .card {
    margin-bottom: 0.75rem;
  }

  .sf-scanner-shell #scanner-container {
    max-height: min(52vh, 480px);
    aspect-ratio: 4 / 5;
  }
}

@media (max-width: 767.98px) {
  .sf-scanner-shell .card-header.d-flex {
    align-items: flex-start;
  }

  .sf-scanner-shell .card-header h5 {
    font-size: 1.05rem;
    line-height: 1.3;
    padding-right: 0.5rem;
  }

  .sf-scanner-shell .scanner-status .d-flex.gap-3 {
    flex-direction: column;
    align-items: flex-start !important;
    gap: 0.5rem !important;
  }

  .sf-scanner-shell .table-responsive {
    max-height: 45vh;
  }
}

@media (max-width: 575.98px) {
  .sf-scanner-shell .col-lg-6 {
    padding: 0.375rem !important;
  }

  .sf-scanner-shell .card-body {
    padding: 0.875rem;
  }

  .sf-scanner-shell .card:hover {
    transform: none;
  }

  .sf-scanner-shell .scanner-indicator-caption {
    font-size: 0.75rem;
  }

  .auto-scan-indicator {
    top: auto !important;
    bottom: 1rem;
    right: 50% !important;
    left: auto !important;
    transform: translateX(50%);
    white-space: nowrap;
    font-size: 0.75rem;
    padding: 0.4rem 0.75rem;
  }

  .scan-result-indicator,
  .scan-please-wait-popup {
    min-width: min(92vw, 420px) !important;
    max-width: 92vw !important;
    padding: 1.25rem 1rem !important;
  }

  .scan-result-indicator .title,
  .scan-please-wait-popup .title {
    font-size: 1.05rem !important;
  }

  .scan-result-indicator .message,
  .scan-please-wait-popup .message {
    font-size: 0.9rem !important;
  }

  .toast-bottom-right {
    right: 0.5rem !important;
    left: 0.5rem !important;
    width: auto !important;
  }

  #toast-container {
    width: 100%;
  }
}