/* ============================================================
   MOBIPIUM REBRAND V1 — Visual Override Layer
   Include LAST in every frontEnd page.
   Only visual changes — zero functionality impact.
   ============================================================ */

/* ── Google Font ── */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

/* ── Font Override ── */
body,
.popover,
input, select, textarea, button,
.page-header,
#ftitle,
div.inputsAA.form-group,
input.inputsAA,
.sbSelector,
.sbOptions a,
label,
.ui.dropdown>.text,
input.search_filter,
.SumoSelect>.CaptionCont,
.SumoSelect>.optWrapper>.options li label,
h1, h2, h3, h4, h5, h6,
p, span, a, li, td, th, div,
.quickOverviewTitles,
.subtitlesTitles,
.control-label,
.metric-label,
.metric-value,
.nav-sidebar > li > a,
.nav-fe > li > a,
.link-top span,
.change-nav span,
.contact-top a,
.contact-top span,
.help-top span,
.help-top a,
.greeting,
.account,
.faqs,
val {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}

/* Protect icon fonts — remove them from the font override above */
.fa, .fas, .far, .fal, .fab, .fad,
i[class*="fa-"],
i[class*="fas"],
i[class*="far"],
i[class*="fab"],
[class^="fonticons-"], [class*=" fonticons-"] {
  font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands', 'FontAwesome' !important;
  font-style: normal !important;
}

/* ── Font Size Adjustment (Inter is more compact than Neutra Text) ── */
body {
  font-size: 13px !important;
}

/* ── Body ── */
body {
  background-color: #f0f2f4 !important;
}

/* ── Navbar Background ── */
.navbar-inverse {
  background-color: #1a1c1e !important;
  box-shadow: none !important;
}

/* ── Accent Color: #5AFE9A / #00FFAA → #00ff9d ── */

/* Sidebar active + hover */
.nav-sidebar > .active > a,
.nav-sidebar > .active > a:hover,
.nav-sidebar > .active > a:focus,
.nav > li > a:focus,
.nav > li > a:hover,
.nav-fe > .active > a,
.nav-fe > .active > a:hover,
.nav-fe > .active > a:focus {
  color: #00ff9d !important;
}

/* Nav links active */
.link-top:hover,
li.active .link-top,
a.main-link.topbtn.selected {
  color: #00ff9d !important;
}

/* Navbar accent elements */
.navbar-inverse .navbar-nav > li > span.revenue-number,
.navbar-inverse .navbar-nav > li > span.revenue-number.style-2,
.navbar-inverse .navbar-nav > li > a.config,
#logoutLi,
#notificationBell .notification-bell-link,
.notification-bell-link-mobile,
.help-top > .help,
#spanSkypeInfoDash:hover,
#spanTeamsInfoDash:hover,
#spanTelegramInfoDash:hover,
#spanEmailInfoDash:hover {
  color: #00ff9d !important;
}

/* Tools dropdown active */
.nav-fe .tools-dropdown .tools-dropdown-menu li.active > a {
  color: #00ff9d !important;
}

/* ── Primary Buttons (GO, APPLY, etc.) ── */
.btn.btn-default.active,
.btn-kms,
a.buttonFilterOffersC,
#GoButton {
  background-color: #00ff9d !important;
  border-color: #00ff9d !important;
  color: #1a1c1e !important;
  border-radius: 6px !important;
}

.btn.btn-default.active:hover,
.btn-kms:hover,
a.buttonFilterOffersC:hover,
#GoButton:hover {
  background-color: #00e68a !important;
  border-color: #00e68a !important;
  color: #1a1c1e !important;
}

/* ── Evolution Buttons (Dashboard) ── */
.evolution-buttons {
  border-color: #00ff9d !important;
  background-color: #00ff9d !important;
  color: #1a1c1e !important;
  border-radius: 6px !important;
}

.evolution-buttons:hover,
.evolution-buttons.active {
  border-color: #1a1c1e !important;
  background-color: #1a1c1e !important;
  color: #00ff9d !important;
}

/* ── Top Offers Button ── */
.btn-top-offers {
  background: #00ff9d !important;
  color: #1a1c1e !important;
}

.btn-top-offers:hover {
  background: #00ff9d !important;
  box-shadow: 0 0 30px rgba(0, 255, 157, 0.8), 0 0 60px rgba(0, 255, 157, 0.6) !important;
}

/* ── Offer Type Badges ── */
.offer-type-badge,
.offer-type-badge.top,
.offer-type-badge.new {
  background-color: #00ff9d !important;
}

/* Traffic badges */
.traffic-badge.content-type,
.traffic-badge.flow-type {
  background-color: rgba(0, 255, 157, 0.31) !important;
  border-color: rgba(0, 255, 157, 0.31) !important;
}

/* ── Brand New Label ── */
.brand-new-label-top,
.brand-new-label {
  background: #00ff9d !important;
}

/* ── Date Picker ── */
.daterangepicker td.active,
.daterangepicker td.active:hover {
  background-color: #00ff9d !important;
}

.ranges li.active,
.ranges li:hover {
  background: #00ff9d !important;
}

/* ── Pagination ── */
.pagination > .active > a,
.pagination > .active > a:focus,
.pagination > .active > a:hover,
.paginate_button.current,
.paginate_button:hover {
  border-color: #00ff9d !important;
}

/* ── Search / Filter Button ── */
.searchBtn {
  background-color: #00ff9d !important;
  border-color: #00ff9d !important;
}

.searchBtn:hover {
  border-color: #1a1c1e !important;
}

/* ── Cards ── */
.card,
.card-content,
.fluctuations,
.fluctuation-card {
  border-radius: 10px !important;
}

/* ── Tables ── */
.offers-table thead tr,
table.datatable thead tr,
.table thead tr {
  background-color: #1a1c1e !important;
}

.offers-table th,
table.datatable th {
  color: #ffffff !important;
}

/* ── Popover (settings cog) ── */
body div.popover {
  background-color: #24272b !important;
  border: 0.5px solid #2d3035 !important;
  border-radius: 6px !important;
}

body div.popover .popover-content a {
  color: #8c97a3 !important;
  display: block !important;
  padding: 8px 12px !important;
  text-decoration: none !important;
  font-size: 12px !important;
}

body div.popover .popover-content a:hover {
  color: #ffffff !important;
  background-color: rgba(255, 255, 255, 0.05) !important;
}

body div.popover .arrow::after {
  border-bottom-color: #24272b !important;
}

/* ── Footer ── */
footer {
  background-color: #1a1c1e !important;
}

footer .social-links li a {
  border-color: #00ff9d !important;
  color: #00ff9d !important;
}

footer .social-links li a:hover {
  background-color: #00ff9d !important;
  color: #1a1c1e !important;
}

/* ── Sidebar (mobile) ── */
.sidebar {
  background-color: #1a1c1e !important;
}

.nav-sidebar > li > a {
  border-bottom-color: #2d3035 !important;
}

/* ── Tools Dropdown ── */
.nav-fe .tools-dropdown .tools-dropdown-menu {
  background-color: #24272b !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4) !important;
}

.nav-fe .tools-dropdown .tools-dropdown-menu li {
  border-bottom-color: #2d3035 !important;
}

.nav-fe .tools-dropdown .tools-dropdown-menu li a:hover {
  background-color: rgba(255, 255, 255, 0.05) !important;
}

/* ── Market Card Details Button ── */
.btn-details-only {
  border-color: #00ff9d !important;
  color: #00ff9d !important;
  border-radius: 6px !important;
}

.btn-details-only:hover {
  background-color: #00ff9d !important;
  color: #1a1c1e !important;
}

/* ── Offer Packs Card ── */
.offer-packs.card::before {
  background-color: #00ff9d !important;
}

/* ── Country Code in Market ── */
.overlay-name .country-code {
  color: #00ff9d !important;
}

/* ── Page Header ── */
.page-header {
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
}

/* ── Select2 / SumoSelect consistency ── */
.select2-container--default .select2-selection--single,
.SumoSelect > .CaptionCont {
  border-radius: 6px !important;
}

/* ── Scrollbar ── */
body ::-webkit-scrollbar-thumb {
  background: #b5c0ca !important;
}

body ::-webkit-scrollbar-thumb:hover {
  background: #8c97a3 !important;
}

/* ── Spacing Adjustments ── */

/* Section titles */
.subtitlesTitles,
h3.subtitlesTitles,
#subtitlesTitles {
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

/* Quick overview KPI labels */
.quickOverviewTitles p.quickOverviewTitles {
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
}

/* KPI values */
.valcomp val {
  font-weight: 700 !important;
}

/* Navbar menu items */
.nav-fe > li > a.link-top {
  font-weight: 500 !important;
}

/* Navbar icons — keep original sizing */
.nav-fe > li > a.link-top i.fa {
  font-family: 'FontAwesome' !important;
}

/* Last updated text */
#lastupd {
  color: #8c97a3 !important;
}

/* Fluctuation card headers */
.fluctuations th,
table.kpi-table th {
  font-weight: 700 !important;
}

/* Badge overview */
.badge-overview {
  font-weight: 600 !important;
}

/* GO button */
#GoButton {
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
}

/* Evolution buttons */
.evolution-buttons {
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
}

/* Top offers button */
.btn-top-offers {
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
}

/* ══════════════════════════════════════════════
   NAVBAR — Complete Rebrand Layout
   ══════════════════════════════════════════════ */

/* Main navbar container */
.rb-navbar {
  display: flex !important;
  align-items: center !important;
  height: 60px !important;
  padding: 0 16px !important;
  background-color: #1a1c1e !important;
  min-height: 60px !important;
  border: none !important;
  box-shadow: none !important;
  margin: 0 !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 10000 !important;
}

.rb-navbar-inner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  height: 100% !important;
}

/* Hide old Bootstrap navbar internals */
.rb-navbar .container-fluid,
.rb-navbar .navbar-header,
.rb-navbar .navbar-collapse,
.rb-navbar .format-high,
.rb-navbar .nav-fe,
.rb-navbar .change-nav,
.rb-navbar .top-offers-navbar-center {
  display: none !important;
}

/* LEFT: Logo + nav items */
.rb-nav-left {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
  height: 100% !important;
}

.rb-logo-link {
  display: flex !important;
  align-items: center !important;
  margin-right: 12px !important;
}

.rb-logo {
  height: 20px !important;
  width: auto !important;
}

.rb-nav-item {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 2px !important;
  min-width: 72px !important;
  padding: 6px 8px !important;
  border-radius: 6px !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  color: #8c97a3 !important;
  text-decoration: none !important;
  transition: color 0.2s, background-color 0.2s !important;
  white-space: nowrap !important;
}

.rb-nav-item:hover {
  color: #ffffff !important;
  text-decoration: none !important;
}

.rb-nav-item.active {
  color: #00ff9d !important;
  background-color: rgba(0, 255, 157, 0.1) !important;
}

.rb-nav-icon {
  display: block !important;
  width: 16px !important;
  height: 16px !important;
}

/* RIGHT section */
.rb-nav-right {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
  height: 100% !important;
}

.rb-nav-link {
  font-size: 11px !important;
  color: #8c97a3 !important;
  text-decoration: none !important;
  padding: 0 12px !important;
  cursor: pointer !important;
}

.rb-nav-link:hover {
  color: #ffffff !important;
  text-decoration: none !important;
}

.rb-nav-divider {
  width: 1px !important;
  height: 24px !important;
  background-color: #2d3035 !important;
}

/* Account block */
.rb-account {
  display: flex !important;
  align-items: center !important;
  padding: 0 12px !important;
}

.rb-account-row {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.rb-account-flag {
  font-size: 12px !important;
  line-height: 1 !important;
}

.rb-account-info {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

.rb-account-name {
  font-size: 11.5px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
  line-height: 1.2 !important;
}

.rb-account-id {
  font-size: 9px !important;
  color: #505358 !important;
  line-height: 1.2 !important;
}

/* Icon buttons (globe, settings) */
.rb-icon-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  border: 0.5px solid #2d3035 !important;
  border-radius: 5px !important;
  background: transparent !important;
  cursor: pointer !important;
  color: #8c97a3 !important;
  padding: 0 !important;
  margin: 0 4px !important;
}

.rb-icon-btn:hover { color: #ffffff !important; }

/* Dropdowns */
.rb-dropdown-hover { position: relative !important; display: flex !important; align-items: center !important; }

.rb-dropdown {
  display: none !important;
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  padding-top: 0 !important;
  min-width: 160px !important;
  background-color: #24272b !important;
  border: 0.5px solid #2d3035 !important;
  border-radius: 6px !important;
  padding: 4px 0 !important;
  z-index: 50 !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.4) !important;
}

/* Invisible bridge to prevent hover gap */
.rb-dropdown-hover::after {
  content: '' !important;
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  right: 0 !important;
  height: 12px !important;
  display: none !important;
}

.rb-dropdown-hover:hover::after { display: block !important; }

.rb-dropdown-right { left: auto !important; right: 0 !important; }

.rb-dropdown-hover:hover > .rb-dropdown { display: block !important; }

.rb-dropdown-item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 12px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  color: #8c97a3 !important;
  text-decoration: none !important;
  transition: background-color 0.15s !important;
  white-space: nowrap !important;
}

.rb-dropdown-item:hover {
  background-color: rgba(255,255,255,0.05) !important;
  color: #ffffff !important;
}

.rb-dropdown-item:hover .fa {
  color: #ffffff !important;
}

/* Ensure ALL dropdown item text goes white on hover, not green */
.rb-dropdown-hover .rb-dropdown-item:hover,
.rb-dropdown-hover .rb-dropdown-item:hover span,
.rb-dropdown-hover .rb-dropdown-item:hover .fa {
  color: #ffffff !important;
}

.rb-dropdown-item .fa {
  font-family: 'FontAwesome' !important;
  width: 16px !important;
  text-align: center !important;
  color: #8c97a3 !important;
}

.rb-lang-flag { font-size: 14px !important; }

/* TOP OFFERS BANNER — full width bar below navbar */
.rb-top-banner {
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 30px !important;
  background-color: #00ff9d !important;
  color: #1a1c1e !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: box-shadow 0.2s !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Only show on dashboard — JS adds this class */
.rb-top-banner.rb-banner-visible {
  display: flex !important;
}

.rb-top-banner:hover {
  color: #1a1c1e !important;
  text-decoration: none !important;
  box-shadow: 0 0 20px rgba(0, 255, 157, 0.4) !important;
}

/* Pulse animation */
@keyframes rb-pulse-glow {
  0%, 100% { box-shadow: none; }
  50% { box-shadow: 0 0 30px rgba(0, 255, 157, 0.6), 0 0 60px rgba(0, 255, 157, 0.3); }
}

.rb-top-banner.rb-pulse,
.rb-top-banner.pulse-animation {
  animation: rb-pulse-glow 0.8s ease-in-out 6 !important;
}

/* Cursor emoji — handled entirely by JS in dashboard.js */
.rb-top-banner { position: relative !important; }

/* Adjust body padding for fixed navbar */
body {
  padding-top: 60px !important;
}

/* Pages without banner get same padding */
body.rb-no-banner {
  padding-top: 60px !important;
}

/* Hide old Select2 language selector only */
.rb-navbar .select2-container,
.languague-li,
.languague-li + .select2-container,
.rb-nav-right .select2-container {
  display: none !important;
}

/* Cursor pointer on all interactive navbar elements */
.rb-nav-item,
.rb-nav-link,
.rb-icon-btn,
.rb-dropdown-item,
.rb-lang-option,
.rb-top-banner {
  cursor: pointer !important;
}

/* ══════════════════════════════════════════════
   FONT SIZES — Match index.html reference
   ══════════════════════════════════════════════ */

/* Page title (h1) — index.html uses section-title at 11px uppercase */
.page-header,
h1.page-header {
  font-size: 16px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: #1a1c1e !important;
  border-bottom: none !important;
  padding-bottom: 0 !important;
  margin-top: 10px !important;
  margin-bottom: 0px !important;
}

/* Section subtitles */
.subtitlesTitles,
h3.subtitlesTitles,
#subtitlesTitles {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: #1a1c1e !important;
}

/* CHOOSE MIRROR label */
.control-label,
h3#subtitlesTitles {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
}

/* KPI metric labels */
.quickOverviewTitles p.quickOverviewTitles {
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  color: #8c97a3 !important;
}

/* KPI values */
.valcomp val {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #1a1c1e !important;
}

/* Last updated */
#lastupd,
#lastupd label {
  font-size: 9px !important;
  color: #8c97a3 !important;
}

/* Fluctuation card headers */
.fluctuations th,
table.kpi-table th {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #1a1c1e !important;
}

/* (navbar left and top offers styles moved to main navbar section above) */

/* ══════════════════════════════════════════════
   CHOOSE MIRROR — Clean flat layout
   ══════════════════════════════════════════════ */

.grid-container-header {
  border-bottom: none !important;
  border-top: none !important;
}

.rb-mirror-row {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 12px 0 !important;
  flex-wrap: nowrap !important;
}

.rb-mirror-label {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: #1a1c1e !important;
  white-space: nowrap !important;
}

.rb-mirror-info {
  font-size: 14px !important;
  color: #8c97a3 !important;
  cursor: help !important;
}

.rb-mirror-updated {
  font-size: 9px !important;
  color: #8c97a3 !important;
  white-space: nowrap !important;
}

.rb-mirror-select-wrap {
  min-width: 120px !important;
}

/* Select2 inside mirror row — match reference size */
.rb-mirror-select-wrap .select2-container {
  width: 130px !important;
}

.rb-mirror-select-wrap .select2-container .select2-selection--single {
  font-size: 11px !important;
  height: 37.5px !important;
  border: 0.5px solid #e2e5e9 !important;
  border-radius: 6px !important;
  display: flex !important;
  align-items: center !important;
}

.rb-mirror-select-wrap .select2-container .select2-selection__rendered {
  font-size: 11px !important;
  line-height: 37.5px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.rb-mirror-select-wrap .select2-container .select2-selection__arrow {
  height: 37.5px !important;
  top: 0 !important;
}

.rb-mirror-select-wrap .select2-container .select2-selection__arrow b {
  margin-top: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
}

.rb-go-btn {
  padding: 6px 16px !important;
  margin: 0 !important;
  white-space: nowrap !important;
  width: auto !important;
  display: inline-block !important;
  font-size: 10.5px !important;
  border-radius: 6px !important;
}

/* Hide old top offers button (replaced by rb-top-banner) */
.btn-top-offers,
.top-offers-navbar-center {
  display: none !important;
}

/* Select arrow vertical alignment */
.rb-mirror-select-wrap .select-arrow {
  top: 20px !important;
}

/* ══════════════════════════════════════════════
   GLOBAL — Selects, Inputs, Badges, Cards (all pages)
   ══════════════════════════════════════════════ */

/* All Select2 dropdowns — font and size consistency */
.select2-container .select2-selection--single {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 11px !important;
  height: 37.5px !important;
  border: 0.5px solid #e2e5e9 !important;
  border-radius: 6px !important;
}

.select2-container .select2-selection__rendered {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 11px !important;
  line-height: 37.5px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.select2-container .select2-selection__arrow {
  height: 37.5px !important;
  top: 0 !important;
}

.select2-container .select2-selection__arrow b {
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin-top: 0 !important;
}

.select2-results__option {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 11px !important;
}

/* Native selects */
select,
select.form-control {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 11px !important;
  height: 37.5px !important;
  line-height: 37.5px !important;
  border-radius: 6px !important;
  border: 0.5px solid #e2e5e9 !important;
  padding: 0 12px !important;
}

/* SumoSelect */
.SumoSelect > .CaptionCont {
  font-size: 11px !important;
  height: 37.5px !important;
  line-height: 37.5px !important;
  border-radius: 6px !important;
  border: 0.5px solid #e2e5e9 !important;
}

.SumoSelect > .CaptionCont > span {
  line-height: 37.5px !important;
  padding-top: 0 !important;
}

.SumoSelect > .CaptionCont > label {
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
}

.SumoSelect > .optWrapper > .options li label {
  font-size: 11px !important;
}

/* Inputs — match select height, but respect inline styles for special inputs */
input.form-control,
input[type="text"],
input[type="search"],
input[type="number"],
input[type="email"] {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 11px !important;
}

textarea.form-control {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 11px !important;
}

/* Filter inputs inside filter rows — match select sizing */
.filterSelectBox input,
.filterSearchSelectBox input,
.searchFilterC input.search_filter {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 11px !important;
  height: 37.5px !important;
}

/* Search Offer Name input — override inline styles */
#fillOffername {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 11px !important;
  height: 37.5px !important;
  line-height: 37.5px !important;
  border: 0.5px solid #e2e5e9 !important;
  border-radius: 6px !important;
  padding: 0 12px !important;
  box-sizing: border-box !important;
  margin-top: 3px !important;
}

/* Custom select arrows (.select-arrow) */
.select-arrow {
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin-top: 0 !important;
}

/* Search filter inputs */
.dataTables_filter input,
.dataTables_filter label {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 11px !important;
}

/* Badges — consistent border-radius */
.badge,
.badge-overview,
.offer-type-badge,
.traffic-badge {
  border-radius: 4px !important;
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 9px !important;
  font-weight: 600 !important;
}

/* Cards — text inside */
.card,
.card-content,
.market.card,
.fluctuation-card {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}

.card-content p,
.card-content span,
.card-content a,
.card-content td,
.card-content th {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}

/* Market card specific */
.market.card .offer-name,
.market.card .offer-details,
.market.card .cpa-text {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}

/* Filter/Reset buttons */
.btn,
.btn-default,
.btn-primary {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  border-radius: 6px !important;
}

/* DataTables info and pagination text */
.dataTables_info,
.dataTables_length label,
.dataTables_length select {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 11px !important;
}

/* Table cells globally */
table td,
table th {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}

/* Semantic UI dropdown (date picker in stats) */
.ui.scrolling.dropdown.selection,
.ui.selection.dropdown {
  height: 37.5px !important;
  min-height: 37.5px !important;
  padding: 0 12px !important;
  font-size: 11px !important;
  line-height: 37.5px !important;
  border-radius: 6px !important;
  border: 0.5px solid #e2e5e9 !important;
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}

.ui.dropdown > .text,
.ui.dropdown > .default.text {
  font-size: 11px !important;
  line-height: 37.5px !important;
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  margin-top: 0 !important;
}

.ui.dropdown > .dropdown.icon {
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin-top: 0 !important;
}

/* Buttons — consistent height and font */
.btn,
.btn-default,
.btn-primary {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 11px !important;
  border-radius: 6px !important;
  height: 37.5px !important;
  line-height: 37.5px !important;
  padding: 0 16px !important;
}

/* Exclude navbar items from button height */
.rb-nav-item,
.rb-nav-link,
.rb-icon-btn,
.rb-dropdown-item {
  height: auto !important;
  line-height: normal !important;
}

/* Top banner must keep its fixed height */
a.rb-top-banner,
a.rb-top-banner.rb-banner-visible {
  height: 30px !important;
  line-height: 30px !important;
}

/* Pagination — font consistency and centering */
.pagination li a,
.pagination li a.pag-link,
.pagination li span {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 11px !important;
  width: 30px !important;
  height: 30px !important;
  line-height: 30px !important;
  padding: 0 !important;
  text-align: center !important;
  display: inline-block !important;
}

.pagination li.active a {
  border: 1px solid #00ff9d !important;
  border-radius: 50% !important;
  width: 30px !important;
  height: 30px !important;
  line-height: 28px !important;
}

/* Select2 multiple — match height with single selects */
.select2-container .select2-selection--multiple {
  min-height: 37.5px !important;
  height: 37.5px !important;
  border: 0.5px solid #e2e5e9 !important;
  border-radius: 6px !important;
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 11px !important;
  display: flex !important;
  align-items: center !important;
  padding: 0 8px !important;
}

.select2-container .select2-selection--multiple .select2-selection__rendered {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  padding: 0 !important;
}

.select2-container .select2-selection--multiple .select2-search--inline .select2-search__field {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 11px !important;
  margin: 0 !important;
  height: auto !important;
}

/* Remove old border-bottom from filter containers — selects have their own borders now */
.filterSelectBox,
.filterSearchSelectBox,
.searchFilterC,
.fillfilter,
.grid-item.fillfilter {
  border: none !important;
  border-bottom: none !important;
}

/* Also the Semantic UI dropdown wrapper */
.ui.scrolling.dropdown.selection,
.ui.selection.dropdown {
  box-shadow: none !important;
}

/* sbHolder (old selectbox plugin) */
.sbHolder {
  border: 0.5px solid #e2e5e9 !important;
  border-radius: 6px !important;
  height: 37.5px !important;
  font-size: 11px !important;
  background: #fff !important;
}

.sbHolder .sbSelector {
  font-size: 11px !important;
  line-height: 37.5px !important;
  height: 37.5px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.sbHolder .sbToggle {
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin-top: 0 !important;
}

/* Multiple select container — remove old border-bottom only, keep structure */
.multiple-selects .select2-container {
  border-bottom: none !important;
  border-radius: 6px !important;
}

/* Single select filter containers — remove outer border-bottom */
.single-select .sbHolder,
.fillfilter .sbHolder {
  border-bottom: 0.5px solid #e2e5e9 !important;
}

.single-select,
.fillfilter.single-select,
.filterSelectBox .sbHolder + .select-arrow {
  border-bottom: none !important;
}

/* Remove border-bottom from all filter grid items that contain sbHolder */
.grid-item.fillfilter {
  border-bottom: none !important;
}

/* Fix: the outer searchFilterC div has border-bottom from styles.css */
.searchFilterC {
  border-bottom: none !important;
}

.filterSearchSelectBox {
  border-bottom: none !important;
}

/* sbSelector text vertical centering */
.sbHolder .sbSelector {
  display: flex !important;
  align-items: center !important;
}

/* Remove border-bottom from all select2 containers — inner selection has its own border */
.select2-container {
  border-bottom: none !important;
  border: none !important;
}

/* Fix select text alignment — override custom-container margin-top */
.custom-container .select2-selection__rendered {
  margin-top: 0 !important;
  position: relative !important;
  line-height: 37.5px !important;
}

/* Ensure all filter selects get the same margin-top as buttons */
.fillfilter .sbHolder,
.fillfilter .select2-container,
.grid-item.fillfilter .sbHolder {
  margin-top: 3px !important;
}

/* Stats date picker — align with other filters */
.stats-custom,
.stats-custom .grid-item,
#reportRange {
  margin-top: 3px !important;
}

/* DataTables pagination */
.dataTables_paginate .paginate_button,
.dataTables_paginate .paginate_button a,
.paging_simple_numbers .paginate_button,
.pagination-fa {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 11px !important;
}

.dataTables_paginate .paginate_button {
  width: 30px !important;
  height: 30px !important;
  line-height: 30px !important;
  padding: 0 !important;
  text-align: center !important;
  display: inline-block !important;
}

.dataTables_paginate .paginate_button.current {
  border: 1px solid #00ff9d !important;
  border-radius: 50% !important;
  width: 30px !important;
  height: 30px !important;
  line-height: 28px !important;
}

.wrap-paginate {
  display: inline-block !important;
}

/* ══════════════════════════════════════════════
   FOOTER — New minimal layout via SSI (rb-footer)
   ══════════════════════════════════════════════ */

/* Hide old footer */
footer:not(.rb-footer) {
  display: none !important;
}

/* Override any position hacks on footer */
footer {
  position: static !important;
  bottom: auto !important;
  height: auto !important;
}

.rb-footer {
  display: block !important;
  flex-shrink: 0 !important;
  margin-top: auto !important;
  background-color: #1a1c1e !important;
  padding: 16px 24px !important;
  width: 100% !important;
  border: none !important;
  color: #8c97a3 !important;
  position: static !important;
  bottom: auto !important;
  height: auto !important;
}

.rb-footer-inner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  width: 100% !important;
}

.rb-footer-logo {
  display: block !important;
  max-height: 32px !important;
  width: auto !important;
}

.rb-footer-social {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}

.rb-footer-social a {
  color: #8c97a3 !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 16px !important;
  transition: color 0.2s !important;
}

.rb-footer-social a:hover {
  color: #ffffff !important;
}

/* ══════════════════════════════════════════════
   CHATWOOT — Match login style (bubble moved up)
   ══════════════════════════════════════════════ */

.woot-widget-bubble {
  bottom: 70px !important;
}

/* Weekly needs — select arrows need specific positioning */
.weekly-needs-container .select-arrow {
  top: 10px !important;
  transform: none !important;
}

/* Sticky footer layout */
html, body {
  height: 100% !important;
  margin: 0 !important;
}

body {
  min-height: 100vh !important;
  display: flex !important;
  flex-direction: column !important;
}

.container {
  flex: 1 0 auto !important;
}

/* Chatwoot — move up like login */
.woot-widget-bubble {
  bottom: 70px !important;
}

/* Pixel page + other pages — ensure all text elements use Inter */
.card-pixel,
.card-pixel p,
.card-pixel span,
.card-pixel label,
.card-pixel input,
.card-pixel h3,
.card-pixel h4,
.module,
.module p,
code,
kbd,
var,
.provide,
.provide p,
.provide label,
.askam {
  font-family: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
}

.card-pixel {
  font-size: 13px !important;
}

/* Logo holder inside new navbar — reset old styles */
.rb-navbar .logo-holder {
  position: static !important;
  left: auto !important;
  width: auto !important;
  min-width: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  margin-right: 12px !important;
  display: flex !important;
  align-items: center !important;
  float: none !important;
}

.rb-navbar .logo-holder a {
  display: flex !important;
  align-items: center !important;
}

.rb-navbar .logo-holder img {
  height: 20px !important;
  width: auto !important;
  min-width: auto !important;
  max-width: none !important;
}

/* ── Push modals below navbar ── */
.modal-dialog {
  margin-top: 70px !important;
}