/* ========================================================================
   EDITORIAL TABS — Unified styling for stats/category tabs
   Applies to: .dp-tabs (developer) · .cmp-tabs (compounds) · .territory-tabs (locations)
   Style: Underline indicator, tabular numerals, no pill backgrounds
   No gold · Navy primary · Soft blue accent · Compact responsive
   ======================================================================== */

/* === Container === */
.dp-tabs,
.cmp-tabs,
.territory-tabs {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  gap: 0 !important;
  margin: 0 0 24px !important;
  padding: 0 !important;
  background: none !important;
  border: none !important;
  border-bottom: 1px solid #E2E8F0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
  position: relative !important;
}
.dp-tabs::-webkit-scrollbar,
.cmp-tabs::-webkit-scrollbar,
.territory-tabs::-webkit-scrollbar { display: none !important; }

/* Section wrapper resets (developer page has dp-tabs-section) */
.dp-tabs-section,
.cmp-tabs-wrapper {
  padding: clamp(20px, 3vw, 32px) clamp(16px, 3vw, 32px) 0 !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
}

/* === Tab button === */
.dp-tabs__btn,
.cmp-tab,
.territory-tab {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 14px 20px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #64748B !important;
  font-family: inherit !important;
  font-size: clamp(.86rem, 1.05vw, .98rem) !important;
  font-weight: 600 !important;
  letter-spacing: .005em !important;
  cursor: pointer !important;
  transition: color .22s ease, border-color .22s ease !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  position: relative !important;
  border-bottom: 2px solid transparent !important;
  margin-bottom: -1px !important; /* overlap the container border */
  box-shadow: none !important;
  min-height: 0 !important;
}

/* Hide chunky icons (cleaner editorial look) */
.dp-tabs__btn i,
.cmp-tab i,
.territory-tab i,
.dp-tabs__btn svg,
.cmp-tab svg,
.territory-tab svg {
  font-size: .92rem !important;
  width: 14px !important;
  height: 14px !important;
  opacity: .55 !important;
  transition: opacity .2s !important;
}

.dp-tabs__btn:hover,
.cmp-tab:hover,
.territory-tab:hover {
  color: #0F1B2C !important;
  background: transparent !important;
  transform: none !important;
}
.dp-tabs__btn:hover i, .cmp-tab:hover i, .territory-tab:hover i,
.dp-tabs__btn:hover svg, .cmp-tab:hover svg, .territory-tab:hover svg { opacity: .85 !important; }

/* === Active tab === */
.dp-tabs__btn.active,
.cmp-tab.active,
.territory-tab.active {
  color: #0F1B2C !important;
  background: transparent !important;
  border-bottom-color: #0277bd !important;
  box-shadow: none !important;
}
.dp-tabs__btn.active i,
.cmp-tab.active i,
.territory-tab.active i,
.dp-tabs__btn.active svg,
.cmp-tab.active svg,
.territory-tab.active svg {
  opacity: 1 !important;
  color: #0277bd !important;
}

/* === Count badge → inline number === */
.dp-tabs__count,
.cmp-tab-count,
.count {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 0 0 4px !important;
  margin: 0 !important;
  background: transparent !important;
  color: #94A3B8 !important;
  font-family: 'Frank Ruhl Libre', Georgia, 'Times New Roman', serif !important;
  font-weight: 600 !important;
  font-size: .92em !important;
  letter-spacing: 0 !important;
  font-variant-numeric: tabular-nums !important;
  font-feature-settings: "tnum" !important;
  border-radius: 0 !important;
  min-width: 0 !important;
  text-align: inherit !important;
}
.dp-tabs__btn.active .dp-tabs__count,
.cmp-tab.active .cmp-tab-count,
.territory-tab.active .count {
  background: transparent !important;
  color: #0277bd !important;
}
.dp-tabs__btn:not(.active) .dp-tabs__count,
.cmp-tab:not(.active) .cmp-tab-count,
.territory-tab:not(.active) .count {
  background: transparent !important;
  color: #94A3B8 !important;
}

/* RTL adjustments */
[dir="rtl"] .dp-tabs__count,
[dir="rtl"] .cmp-tab-count,
[dir="rtl"] .count {
  padding: 0 4px 0 0 !important;
  margin: 0 !important;
}

/* === Responsive: tablets === */
@media (max-width: 991px) {
  .dp-tabs__btn, .cmp-tab, .territory-tab {
    padding: 12px 16px !important;
    font-size: .88rem !important;
  }
}
/* === Responsive: mobile === */
@media (max-width: 640px) {
  .dp-tabs, .cmp-tabs, .territory-tabs {
    margin-bottom: 16px !important;
  }
  .dp-tabs__btn, .cmp-tab, .territory-tab {
    padding: 10px 14px !important;
    font-size: .82rem !important;
    gap: 6px !important;
  }
  .dp-tabs__btn i, .cmp-tab i, .territory-tab i,
  .dp-tabs__btn svg, .cmp-tab svg, .territory-tab svg { display: none !important; }
}
@media (max-width: 380px) {
  .dp-tabs__btn, .cmp-tab, .territory-tab {
    padding: 9px 11px !important;
    font-size: .76rem !important;
  }
}