/*
 * Badger UI Normalizer RC1.1
 * Stronger panel-wide button/tab margin + alignment cleanup.
 * Loaded last so donor/module CSS cannot force odd spacing.
 */

*, *::before, *::after { box-sizing: border-box; }

:root{
  --badger-ui-gap-xs: 6px;
  --badger-ui-gap-sm: 10px;
  --badger-ui-gap-md: 12px;
  --badger-ui-radius-pill: 999px;
  --badger-ui-radius-card: 14px;
  --badger-ui-border: rgba(148, 163, 184, .28);
  --badger-ui-border-strong: rgba(245, 181, 46, .46);
  --badger-ui-surface: rgba(15, 23, 34, .82);
  --badger-ui-surface-soft: rgba(22, 32, 45, .72);
  --badger-ui-shadow-soft: 0 8px 22px rgba(0,0,0,.20);
}

/* =========================================================
   PANEL-WIDE TAB/BUTTON BAR NORMALIZATION
   Fixes tabs/buttons touching the left/top edge and each other.
   ========================================================= */
.page-body .nav-tabs,
.page-wrapper .nav-tabs,
.module-page .nav-tabs,
.module-shell .nav-tabs,
.card .nav-tabs,
ul.nav-tabs,
.tabs .nav-tabs,
.nav.nav-tabs{
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  column-gap: 10px !important;
  row-gap: 8px !important;
  width: 100% !important;
  min-height: 48px !important;
  margin: 0 0 12px 0 !important;
  padding: 9px 12px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: rgba(18, 28, 40, .35) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
  overflow: visible !important;
}

.page-body .nav-tabs > li,
.page-wrapper .nav-tabs > li,
.module-page .nav-tabs > li,
.module-shell .nav-tabs > li,
ul.nav-tabs > li,
ul.nav-tabs > .nav-item,
.nav.nav-tabs > li,
.nav.nav-tabs > .nav-item{
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Fallback spacing for older donor CSS that breaks flex gap. */
.page-body .nav-tabs > li + li,
.page-wrapper .nav-tabs > li + li,
.module-page .nav-tabs > li + li,
.module-shell .nav-tabs > li + li,
ul.nav-tabs > li + li,
ul.nav-tabs > .nav-item + .nav-item,
.nav.nav-tabs > li + li,
.nav.nav-tabs > .nav-item + .nav-item{
  margin-left: 0 !important;
}

.page-body .nav-tabs .nav-link,
.page-wrapper .nav-tabs .nav-link,
.module-page .nav-tabs .nav-link,
.module-shell .nav-tabs .nav-link,
ul.nav-tabs > li > a,
ul.nav-tabs > .nav-item > .nav-link,
.nav.nav-tabs > li > a,
.nav.nav-tabs > .nav-item > .nav-link{
  min-height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  margin: 0 !important;
  padding: 7px 17px !important;
  line-height: 1.15 !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  border-radius: var(--badger-ui-radius-pill) !important;
  border: 1px solid var(--badger-ui-border) !important;
  background: linear-gradient(180deg, rgba(31,42,57,.94), rgba(16,24,34,.94)) !important;
  color: #fff !important;
  text-shadow: 0 1px 1px rgba(0,0,0,.55) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 3px 10px rgba(0,0,0,.18) !important;
  transform: none !important;
  top: auto !important;
  left: auto !important;
  position: relative !important;
}

.page-body .nav-tabs .nav-link:hover,
.page-wrapper .nav-tabs .nav-link:hover,
.module-page .nav-tabs .nav-link:hover,
.module-shell .nav-tabs .nav-link:hover,
ul.nav-tabs > li > a:hover,
.nav.nav-tabs > li > a:hover{
  border-color: var(--badger-ui-border-strong) !important;
  background: linear-gradient(180deg, rgba(35,48,64,.96), rgba(18,28,40,.96)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 5px 14px rgba(0,0,0,.22) !important;
}

.page-body .nav-tabs .nav-link.active,
.page-body .nav-tabs .nav-item.show .nav-link,
.page-wrapper .nav-tabs .nav-link.active,
.module-page .nav-tabs .nav-link.active,
.module-shell .nav-tabs .nav-link.active,
ul.nav-tabs > li.active > a,
ul.nav-tabs > li > a.active,
.nav.nav-tabs > li.active > a,
.nav.nav-tabs > li > a.active{
  color: #fff !important;
  border-color: var(--badger-ui-border-strong) !important;
  background: linear-gradient(180deg, rgba(38,50,66,.98), rgba(18,27,38,.98)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 1px rgba(245,181,46,.08), 0 6px 16px rgba(0,0,0,.24) !important;
}

/* Remove donor/Bootstrap underline bars and pseudo spacers. */
.page-body .nav-tabs::before,
.page-body .nav-tabs::after,
.page-wrapper .nav-tabs::before,
.page-wrapper .nav-tabs::after,
.module-page .nav-tabs::before,
.module-page .nav-tabs::after,
.module-shell .nav-tabs::before,
.module-shell .nav-tabs::after,
ul.nav-tabs::before,
ul.nav-tabs::after,
.nav.nav-tabs::before,
.nav.nav-tabs::after{
  display: none !important;
  content: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* =========================================================
   GENERAL BUTTON ROWS / BTN GROUPS
   ========================================================= */
.page-body .btn-toolbar,
.page-body .btn-group,
.page-wrapper .btn-toolbar,
.page-wrapper .btn-group,
.module-page .btn-toolbar,
.module-page .btn-group,
.module-shell .btn-toolbar,
.module-shell .btn-group,
.action-row,
.actions,
.form-actions,
.card-actions{
  display: inline-flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 10px !important;
  column-gap: 10px !important;
  row-gap: 8px !important;
}

.page-body .btn + .btn,
.page-wrapper .btn + .btn,
.module-page .btn + .btn,
.module-shell .btn + .btn,
.card .btn + .btn,
.table .btn + .btn{
  margin-left: 0 !important;
}

.page-body .btn-group > .btn,
.page-wrapper .btn-group > .btn,
.module-page .btn-group > .btn,
.module-shell .btn-group > .btn{
  margin-left: 0 !important;
  border-radius: 999px !important;
}

/* =========================================================
   CARD/TABLE SURFACE CLEANUP
   ========================================================= */
.page-body .card,
.page-wrapper .card,
.module-page .card,
.module-shell .card{
  border-radius: var(--badger-ui-radius-card) !important;
  border-color: var(--badger-ui-border) !important;
  background-clip: padding-box !important;
  box-shadow: var(--badger-ui-shadow-soft) !important;
  overflow: hidden;
}

.page-body .card-header,
.page-wrapper .card-header,
.module-page .card-header,
.module-shell .card-header{
  padding: 12px 16px !important;
  border-bottom: 1px solid rgba(148,163,184,.16) !important;
  background: rgba(18, 28, 40, .72) !important;
}

.page-body .card-body,
.page-wrapper .card-body,
.module-page .card-body,
.module-shell .card-body{
  padding: 14px 16px !important;
}

.page-body table,
.page-wrapper table,
.module-page table,
.module-shell table{
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

.page-body table th,
.page-wrapper table th,
.module-page table th,
.module-shell table th{
  padding: 11px 14px !important;
  vertical-align: middle !important;
  border-bottom: 1px solid rgba(148,163,184,.16) !important;
  background: rgba(18, 28, 40, .72) !important;
}

.page-body table td,
.page-wrapper table td,
.module-page table td,
.module-shell table td{
  padding: 10px 14px !important;
  vertical-align: middle !important;
}

.page-body .tab-content,
.page-wrapper .tab-content,
.module-page .tab-content,
.module-shell .tab-content{
  margin-top: 8px !important;
}

.page-body .row + .row,
.page-wrapper .row + .row,
.module-page .row + .row,
.module-shell .row + .row{
  margin-top: 12px !important;
}

@media (max-width: 768px){
  .page-body .nav-tabs,
  .page-wrapper .nav-tabs,
  .module-page .nav-tabs,
  .module-shell .nav-tabs,
  ul.nav-tabs,
  .nav.nav-tabs{
    padding: 8px 10px !important;
    gap: 8px !important;
    row-gap: 8px !important;
  }
  .page-body .nav-tabs .nav-link,
  .page-wrapper .nav-tabs .nav-link,
  .module-page .nav-tabs .nav-link,
  .module-shell .nav-tabs .nav-link,
  ul.nav-tabs > li > a,
  .nav.nav-tabs > li > a{
    min-height: 32px !important;
    padding: 7px 14px !important;
  }
}