/*
  Badgers Claw Pit - Global CSS Consolidation v2
  Loaded last from assets/includes/head-css.php.
  Purpose: normalize panel-wide cards, tables, headers, sidebars, inputs, and buttons
  without touching Builder icon save logic or PHP behavior.
*/
:root{
  --bdg-bg: var(--panel-bg, #0c1118);
  --bdg-surface: var(--panel-surface, #1e2632);
  --bdg-surface-2: var(--panel-surface-2, #171f2a);
  --bdg-surface-3: var(--panel-card-bg, #202936);
  --bdg-border: var(--panel-border, rgba(148,163,184,.20));
  --bdg-border-strong: var(--panel-border-strong, rgba(148,163,184,.34));
  --bdg-text: var(--panel-text, #f8fafc);
  --bdg-muted: var(--panel-muted, #b6c2d2);
  --bdg-accent: var(--panel-accent, #d6a62d);
  --bdg-ring: var(--panel-ring, rgba(120,155,210,.28));
  --bdg-radius: 14px;
  --bdg-radius-sm: 10px;
  --bdg-pad: 14px;
}

/* -------------------- Page/header bars -------------------- */
.page-title-box,
.module-title-row,
.panel-page-heading,
.bdg-page-heading,
.badger-page-heading,
.main-content .page-header,
.main-content .page-title,
.main-content .module-header{
  padding-left: 18px !important;
  padding-right: 18px !important;
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.page-title-box img,
.page-title-box .module-icon,
.module-title-row img,
.module-title-row .module-icon,
.panel-page-heading img,
.panel-page-heading .module-icon,
.badger-page-heading img,
.badger-page-heading .module-icon,
.main-content .page-header img,
.main-content .module-header img{
  margin-left: 6px !important;
  margin-right: 10px !important;
  flex: 0 0 auto;
}
.page-title-box h1,.page-title-box h2,.page-title-box h3,.page-title-box h4,
.module-title-row h1,.module-title-row h2,.module-title-row h3,.module-title-row h4,
.panel-page-heading h1,.panel-page-heading h2,.panel-page-heading h3,.panel-page-heading h4,
.badger-page-heading h1,.badger-page-heading h2,.badger-page-heading h3,.badger-page-heading h4{
  margin: 0 !important;
  line-height: 1.15 !important;
}

/* -------------------- Cards / panels -------------------- */
.card,
.panel,
.module-card,
.bdg-card,
.badger-card,
.summary-tile,
.widget-card,
.tool-card,
.endpoint-card,
.module-frame-wrap,
.smarters-card,
.smarters-panel,
.module-workspace-card{
  border: 1px solid var(--bdg-border) !important;
  border-radius: var(--bdg-radius) !important;
  background: color-mix(in srgb, var(--bdg-surface) 92%, transparent) !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.035) !important;
  overflow: hidden;
}
.card-header,
.panel-heading,
.card .card-header,
.module-card-header,
.bdg-card-header,
.badger-card-header{
  background: color-mix(in srgb, var(--bdg-surface-2) 90%, transparent) !important;
  border-bottom: 1px solid var(--bdg-border) !important;
  box-shadow: none !important;
}
.card-body,
.panel-body,
.module-card-body,
.bdg-card-body,
.badger-card-body{
  padding: 14px 16px !important;
}

/* -------------------- Table normalization -------------------- */
table,
.table,
.dataTable,
.table-bordered,
.table-striped,
.table-responsive table{
  border-collapse: separate !important;
  border-spacing: 0 !important;
  width: 100%;
  color: var(--bdg-text) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.table-responsive{
  border-radius: 12px !important;
  overflow: hidden !important;
  border: 1px solid color-mix(in srgb, var(--bdg-border) 85%, transparent) !important;
  background: color-mix(in srgb, var(--bdg-surface-2) 90%, transparent) !important;
}
table thead,
.table thead,
.dataTable thead,
.table-bordered thead,
.table-striped thead,
.dataTables_wrapper thead{
  background: color-mix(in srgb, var(--bdg-surface-3) 88%, transparent) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--bdg-border-strong) !important;
  box-shadow: none !important;
}
table thead tr,
.table thead tr,
.dataTable thead tr,
.table-bordered thead tr,
.table-striped thead tr,
.dataTables_wrapper thead tr{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
table thead th,
.table thead th,
.dataTable thead th,
.table-bordered thead th,
.table-striped thead th,
.dataTables_wrapper table.dataTable thead th,
.dataTables_wrapper table.dataTable thead td{
  background: transparent !important;
  color: var(--bdg-text) !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: .015em;
  font-size: .78rem !important;
  line-height: 1.25 !important;
  padding: 10px 12px !important;
  border-top: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-bottom: 1px solid var(--bdg-border-strong) !important;
  box-shadow: none !important;
  outline: 0 !important;
}
/* Kill the donor/Tabler/DataTables double dark divider under header words */
table thead th::before, table thead th::after,
.table thead th::before, .table thead th::after,
.dataTable thead th::before, .dataTable thead th::after,
.dataTables_wrapper table.dataTable thead th::before,
.dataTables_wrapper table.dataTable thead th::after{
  display: none !important;
  content: none !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}
table tbody tr,
.table tbody tr,
.dataTable tbody tr,
.table-striped tbody tr,
.table-bordered tbody tr{
  background: color-mix(in srgb, var(--bdg-surface) 92%, transparent) !important;
  border: 0 !important;
  box-shadow: none !important;
}
table tbody tr:nth-child(even),
.table-striped tbody tr:nth-of-type(even),
.dataTable tbody tr:nth-child(even){
  background: color-mix(in srgb, var(--bdg-surface-2) 88%, transparent) !important;
}
table tbody tr:hover,
.table tbody tr:hover,
.dataTable tbody tr:hover{
  background: color-mix(in srgb, var(--bdg-surface-3) 96%, transparent) !important;
}
table tbody td,
.table tbody td,
.dataTable tbody td,
.table-bordered tbody td,
.table-striped tbody td,
.dataTables_wrapper table.dataTable tbody th,
.dataTables_wrapper table.dataTable tbody td{
  color: var(--bdg-text) !important;
  padding: 10px 12px !important;
  border-top: 1px solid color-mix(in srgb, var(--bdg-border) 70%, transparent) !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  vertical-align: middle !important;
}
table tbody td[colspan], .table tbody td[colspan], .dataTable tbody td[colspan]{
  color: var(--bdg-text) !important;
  background: color-mix(in srgb, var(--bdg-surface-2) 90%, transparent) !important;
}
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate{
  color: var(--bdg-muted) !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button,
.pagination .page-link{
  background: color-mix(in srgb, var(--bdg-surface-2) 90%, transparent) !important;
  border: 1px solid var(--bdg-border) !important;
  color: var(--bdg-text) !important;
  border-radius: 9px !important;
  box-shadow: none !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.pagination .page-item.active .page-link{
  border-color: var(--bdg-accent) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--bdg-accent) 25%, transparent) !important;
}

/* -------------------- Inputs/selects/textareas -------------------- */
.form-control,
.form-select,
.custom-select,
input[type="text"], input[type="password"], input[type="email"], input[type="url"], input[type="number"], input[type="search"], input[type="datetime-local"],
select,
textarea,
.input-group-text,
.dataTables_filter input,
.dataTables_length select{
  background: color-mix(in srgb, #070b11 85%, var(--bdg-surface-2)) !important;
  color: var(--bdg-text) !important;
  border: 1px solid var(--bdg-border-strong) !important;
  border-radius: 10px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
  min-height: 38px;
}
textarea.form-control, textarea{
  min-height: 80px;
}
.form-control:focus,
.form-select:focus,
.custom-select:focus,
input:focus,
select:focus,
textarea:focus{
  border-color: color-mix(in srgb, var(--bdg-accent) 48%, var(--bdg-border-strong)) !important;
  box-shadow: 0 0 0 2px var(--bdg-ring), inset 0 1px 0 rgba(255,255,255,.04) !important;
  outline: 0 !important;
}
::placeholder{ color: color-mix(in srgb, var(--bdg-muted) 75%, transparent) !important; opacity: 1; }

/* -------------------- Buttons / badges / pills -------------------- */
.btn,
button,
.btn-sm,
.add-button,
.delete-button,
.edit-button,
.copy-button{
  border-radius: 10px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 8px 20px rgba(0,0,0,.12) !important;
  border: 1px solid color-mix(in srgb, var(--bdg-border-strong) 82%, transparent) !important;
}
.btn:hover,
button:hover,
.add-button:hover,
.delete-button:hover,
.edit-button:hover,
.copy-button:hover{
  filter: brightness(1.08);
}
.badge,
.pill,
.nav-pills .nav-link,
.summary-count,
.status-pill,
.module-count,
.endpoint-count{
  border-radius: 999px !important;
  border: 1px solid color-mix(in srgb, var(--bdg-border) 80%, transparent) !important;
  background: color-mix(in srgb, var(--bdg-surface-2) 90%, transparent) !important;
  color: var(--bdg-text) !important;
  box-shadow: none !important;
}

/* -------------------- Sidebars / menu cards -------------------- */
.module-sidebar .nav-link,
.smarters-sidebar .nav-link,
.tool-categories .nav-link,
.api-helper-sidebar .nav-link,
.endpoint-category,
.menu-card .nav-link,
.sidebar-card .nav-link{
  background: color-mix(in srgb, var(--bdg-surface) 86%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--bdg-border) 85%, transparent) !important;
  border-radius: 12px !important;
  color: var(--bdg-muted) !important;
  box-shadow: none !important;
}
.module-sidebar .nav-link:hover,
.smarters-sidebar .nav-link:hover,
.tool-categories .nav-link:hover,
.api-helper-sidebar .nav-link:hover,
.endpoint-category:hover,
.menu-card .nav-link:hover,
.sidebar-card .nav-link:hover{
  color: var(--bdg-text) !important;
  border-color: var(--bdg-border-strong) !important;
  background: color-mix(in srgb, var(--bdg-surface-3) 90%, transparent) !important;
}
.module-sidebar .nav-link.active,
.smarters-sidebar .nav-link.active,
.tool-categories .nav-link.active,
.api-helper-sidebar .nav-link.active,
.endpoint-category.active,
.menu-card .nav-link.active,
.sidebar-card .nav-link.active,
.nav-pills .nav-link.active{
  background: transparent !important;
  color: var(--bdg-text) !important;
  border: 1px solid var(--bdg-border-strong) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), 0 0 0 2px var(--bdg-ring) !important;
}
.module-sidebar .nav-link.active::before,
.module-sidebar .nav-link.active::after,
.smarters-sidebar .nav-link.active::before,
.smarters-sidebar .nav-link.active::after,
.nav-pills .nav-link.active::before,
.nav-pills .nav-link.active::after{
  display: none !important;
  content: none !important;
}

/* -------------------- Modals / dropdowns -------------------- */
.modal-content,
.dropdown-menu,
.offcanvas,
.popover{
  background: var(--bdg-surface) !important;
  border: 1px solid var(--bdg-border) !important;
  border-radius: var(--bdg-radius) !important;
  color: var(--bdg-text) !important;
  box-shadow: 0 22px 56px rgba(0,0,0,.36) !important;
}
.modal-header,
.modal-footer,
.dropdown-divider{
  border-color: var(--bdg-border) !important;
}

/* -------------------- Remove legacy/donor harsh dividers -------------------- */
hr,
.hr,
.divider,
.section-divider{
  border-color: var(--bdg-border) !important;
  opacity: 1 !important;
  box-shadow: none !important;
}
[style*="border-bottom: 2px solid #000"],
[style*="border-bottom:2px solid #000"],
[style*="box-shadow: inset 0 -2px"],
[style*="box-shadow:inset 0 -2px"]{
  box-shadow: none !important;
  border-bottom-color: var(--bdg-border) !important;
}