/* Shared responsive navigation for the public and administration shells. */
.banto-mobile-nav-toggle,
.banto-mobile-drawer-header,
.banto-mobile-nav-backdrop{
  display: none;
}

.banto-mobile-nav-toggle,
.banto-mobile-nav-close{
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  padding: 0;
  border: 1px solid #dbe3ee;
  border-radius: 10px;
  background: #fff;
  color: #253047;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
}

.banto-mobile-nav-toggle:hover,
.banto-mobile-nav-toggle:focus,
.banto-mobile-nav-close:hover,
.banto-mobile-nav-close:focus{
  color: #1d4ed8;
  border-color: #93c5fd;
  outline: 2px solid #bfdbfe;
  outline-offset: 2px;
}

.banto-mobile-nav-backdrop[hidden]{
  display: none !important;
}

@media (max-width: 991px){
  body.banto-mobile-nav-open{
    overflow: hidden !important;
  }

  .banto-mobile-nav-ready .banto-mobile-nav-toggle{
    display: inline-flex;
  }

  .banto-mobile-nav-ready .banto-mobile-drawer-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 58px;
    padding: 10px 14px;
    border-bottom: 1px solid #e5e7eb;
    background: #fff;
  }

  .banto-mobile-drawer-header strong{
    overflow: hidden;
    color: #111827;
    font-size: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .banto-mobile-nav-close{
    display: inline-flex;
  }

  .banto-mobile-nav-ready .banto-mobile-nav-backdrop{
    position: fixed;
    inset: 0;
    z-index: 1180;
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: rgba(15, 23, 42, .55);
    cursor: pointer;
  }

  /* Authenticated application shell. */
  .banto-topbar-left{
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .banto-mobile-nav-ready .banto-side-menu[data-banto-mobile-nav]{
    position: fixed !important;
    top: 0 !important;
    right: auto !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 1190 !important;
    display: block !important;
    visibility: hidden;
    width: min(86vw, 340px) !important;
    max-width: 340px;
    height: 100vh;
    height: 100dvh;
    max-height: none !important;
    padding: 0 0 18px !important;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 0 !important;
    border-right: 1px solid #dbe3ee !important;
    background: #fff;
    box-shadow: 18px 0 45px rgba(15, 23, 42, .22);
    transform: translate3d(-105%, 0, 0);
    transition: transform .22s ease, visibility .22s ease;
    -webkit-overflow-scrolling: touch;
  }

  .banto-mobile-nav-ready .banto-side-menu[data-banto-mobile-nav].is-mobile-open{
    visibility: visible;
    transform: translate3d(0, 0, 0);
  }

  .banto-mobile-nav-ready .banto-side-menu[data-banto-mobile-nav] nav{
    padding: 8px 14px 20px;
  }

  /* Legacy SB Admin shell. */
  body.banto-admin .navbar-header{
    float: none;
    display: flex;
    align-items: center;
    min-height: 51px;
    padding: 0 10px;
  }

  body.banto-admin .navbar-header .banto-mobile-nav-toggle{
    float: none;
    margin: 4px 8px 4px 0;
  }

  body.banto-admin .navbar-header .navbar-brand{
    height: auto;
    min-height: 50px;
    padding: 15px 8px;
    font-size: 16px;
  }

  .banto-mobile-nav-ready body.banto-admin .sidebar[data-banto-mobile-nav]{
    position: fixed !important;
    top: 0 !important;
    right: auto !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 1190 !important;
    display: block !important;
    visibility: hidden !important;
    width: min(88vw, 340px) !important;
    max-width: 340px;
    height: 100vh !important;
    height: 100dvh !important;
    margin: 0 !important;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 0 !important;
    border-right: 1px solid #dbe3ee !important;
    background: #fff !important;
    box-shadow: 18px 0 45px rgba(15, 23, 42, .22);
    transform: translate3d(-105%, 0, 0);
    transition: transform .22s ease, visibility .22s ease;
    -webkit-overflow-scrolling: touch;
  }

  .banto-mobile-nav-ready body.banto-admin .sidebar[data-banto-mobile-nav].is-mobile-open{
    visibility: visible !important;
    transform: translate3d(0, 0, 0);
  }

  .banto-mobile-nav-ready body.banto-admin .sidebar[data-banto-mobile-nav] .sidebar-collapse,
  .banto-mobile-nav-ready body.banto-admin .sidebar[data-banto-mobile-nav] .sidebar-nav,
  .banto-mobile-nav-ready body.banto-admin .sidebar[data-banto-mobile-nav] #side-menu{
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    max-height: none !important;
  }

  .banto-mobile-nav-ready body.banto-admin .sidebar[data-banto-mobile-nav] .sidebar-nav{
    padding: 0 0 24px;
  }

  body.banto-admin #page-wrapper{
    min-width: 0;
    margin-left: 0 !important;
    padding-right: 12px;
    padding-left: 12px;
  }

  body.banto-admin .navbar-top-links{
    margin-right: 4px;
  }

  body.banto-admin .navbar-top-links .navbar-form{
    max-width: calc(100vw - 24px);
  }

  /* Progressive enhancement: navigation remains visible when JavaScript is unavailable. */
  html:not(.banto-mobile-nav-ready) .banto-side-menu[data-banto-mobile-nav]{
    position: static !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    padding: 12px 14px !important;
    visibility: visible !important;
    transform: none !important;
    border-right: 0 !important;
    border-bottom: 1px solid #dbe3ee !important;
  }

  html:not(.banto-mobile-nav-ready) body.banto-admin .sidebar[data-banto-mobile-nav]{
    position: static !important;
    display: block !important;
    visibility: visible !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
    transform: none !important;
  }

  html:not(.banto-mobile-nav-ready) body.banto-admin .sidebar-collapse{
    display: block !important;
    height: auto !important;
  }

  /* General safeguards for narrow screens. */
  .banto-content-container,
  body.banto-admin #page-wrapper{
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  .banto-content-container .row,
  body.banto-admin #page-wrapper .row{
    min-width: 0;
  }

  .banto-content-container [class*="col-"],
  .banto-content-container .panel,
  .banto-content-container .panel-body,
  body.banto-admin #page-wrapper [class*="col-"],
  body.banto-admin #page-wrapper .panel,
  body.banto-admin #page-wrapper .panel-body{
    min-width: 0;
    max-width: 100%;
  }

  .banto-content-container img,
  .banto-content-container video,
  .banto-content-container canvas,
  .banto-content-container iframe,
  body.banto-admin #page-wrapper img,
  body.banto-admin #page-wrapper video,
  body.banto-admin #page-wrapper canvas,
  body.banto-admin #page-wrapper iframe{
    max-width: 100%;
  }

  .banto-content-container .btn-toolbar,
  .banto-content-container .form-inline,
  body.banto-admin #page-wrapper .btn-toolbar,
  body.banto-admin #page-wrapper .form-inline{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }

  .banto-content-container .table-responsive,
  body.banto-admin #page-wrapper .table-responsive,
  .banto-content-container .dataTables_wrapper,
  body.banto-admin #page-wrapper .dataTables_wrapper{
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    border: 0;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-inline: contain;
    scrollbar-gutter: stable;
  }

  .banto-content-container .banto-auto-table-responsive,
  body.banto-admin #page-wrapper .banto-auto-table-responsive{
    margin-bottom: 18px;
  }

  .banto-content-container .banto-auto-table-responsive > .table,
  body.banto-admin #page-wrapper .banto-auto-table-responsive > .table{
    width: 100%;
    margin-bottom: 0;
  }

  .banto-content-container .banto-wide-table-responsive > .table,
  body.banto-admin #page-wrapper .banto-wide-table-responsive > .table,
  .banto-content-container .dataTables_wrapper table.dataTable,
  body.banto-admin #page-wrapper .dataTables_wrapper table.dataTable{
    min-width: var(--banto-table-min-width, 680px) !important;
  }

  .banto-content-container .dataTables_wrapper > .row,
  body.banto-admin #page-wrapper .dataTables_wrapper > .row{
    width: auto;
    min-width: 0;
    margin-right: 0;
    margin-left: 0;
  }

  .banto-content-container .dataTables_wrapper .dataTables_length,
  .banto-content-container .dataTables_wrapper .dataTables_filter,
  .banto-content-container .dataTables_wrapper .dataTables_info,
  .banto-content-container .dataTables_wrapper .dataTables_paginate,
  body.banto-admin #page-wrapper .dataTables_wrapper .dataTables_length,
  body.banto-admin #page-wrapper .dataTables_wrapper .dataTables_filter,
  body.banto-admin #page-wrapper .dataTables_wrapper .dataTables_info,
  body.banto-admin #page-wrapper .dataTables_wrapper .dataTables_paginate{
    float: none !important;
    width: 100%;
    max-width: 100%;
    margin: 0 0 10px;
    text-align: left !important;
    white-space: normal;
  }

  .banto-content-container .dataTables_wrapper .dataTables_filter input,
  body.banto-admin #page-wrapper .dataTables_wrapper .dataTables_filter input{
    width: min(100%, 260px);
    max-width: 100%;
    margin-left: 6px;
  }

  .banto-content-container .banto-table-scroll,
  body.banto-admin #page-wrapper .banto-table-scroll{
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    touch-action: pan-x pan-y;
    -webkit-overflow-scrolling: touch;
  }

  .banto-content-container .banto-table-scroll > table.banto-responsive-table,
  body.banto-admin #page-wrapper .banto-table-scroll > table.banto-responsive-table,
  .banto-content-container .banto-table-scroll table.dataTable,
  body.banto-admin #page-wrapper .banto-table-scroll table.dataTable{
    width: max(100%, var(--banto-table-min-width, 100%)) !important;
    min-width: var(--banto-table-min-width, 100%) !important;
    table-layout: auto !important;
    margin-bottom: 0;
  }

  .banto-content-container table.banto-responsive-table td,
  .banto-content-container table.banto-responsive-table th,
  body.banto-admin #page-wrapper table.banto-responsive-table td,
  body.banto-admin #page-wrapper table.banto-responsive-table th{
    min-width: 105px;
    max-width: 360px;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: manual;
    vertical-align: middle;
  }

  .banto-content-container table.banto-responsive-table th,
  body.banto-admin #page-wrapper table.banto-responsive-table th,
  .banto-content-container table.banto-responsive-table td:last-child,
  body.banto-admin #page-wrapper table.banto-responsive-table td:last-child,
  .banto-content-container table.banto-responsive-table .btn,
  body.banto-admin #page-wrapper table.banto-responsive-table .btn,
  .banto-content-container table.banto-responsive-table .label,
  body.banto-admin #page-wrapper table.banto-responsive-table .label{
    white-space: nowrap !important;
    overflow-wrap: normal !important;
  }

  .banto-content-container table.banto-responsive-table td:last-child,
  body.banto-admin #page-wrapper table.banto-responsive-table td:last-child{
    min-width: 145px;
  }

  .banto-content-container pre,
  body.banto-admin #page-wrapper pre{
    max-width: 100%;
    overflow-x: auto;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
  }

  .banto-topbar .dropdown-menu,
  body.banto-admin .dropdown-menu{
    max-width: calc(100vw - 24px) !important;
  }

  .modal-dialog{
    margin: 10px;
  }
}

@media (max-width: 540px){
  .banto-topbar{
    gap: 8px;
  }

  .banto-brand-mark{
    width: 32px;
    height: 32px;
    font-size: 20px;
  }

  .banto-topbar-left,
  .banto-brand-link{
    min-width: 0;
  }

  .banto-brand-word{
    max-width: 138px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .banto-topbar-right{
    gap: 6px;
  }

  .banto-language-form{
    padding: 5px 6px;
  }

  body.banto-admin .navbar-header{
    flex-wrap: wrap;
  }

  body.banto-admin .navbar-header .navbar-brand{
    font-size: 14px;
  }

  body.banto-admin .banto-admin-back-link span{
    display: none;
  }

  body.banto-admin .banto-admin-back-link{
    min-width: 42px;
    text-align: center;
  }

  body.banto-has-side-menu #page-content > .container,
  #page-content > .container{
    width: auto;
    margin-right: 8px;
    margin-left: 8px;
    padding-right: 10px;
    padding-left: 10px;
  }

  body.banto-admin #page-wrapper{
    padding-right: 8px !important;
    padding-left: 8px !important;
  }
}

@media (prefers-reduced-motion: reduce){
  .banto-side-menu[data-banto-mobile-nav],
  .banto-mobile-nav-ready body.banto-admin .sidebar[data-banto-mobile-nav]{
    transition: none !important;
  }
}