/* IB Referrals page-only (scoped by #ibReferralsPage) */

#ibReferralsPage .ibref-tabs .nav-link {
  border: 0;
  background: transparent;
  color: #111827;
  font-weight: 800;
  padding: 8px 4px;
  border-radius: 0;
}

#ibReferralsPage .ibref-tabs .nav-link.active {
  color: #2563eb;
  box-shadow: inset 0 -2px 0 #2563eb;
}

#ibReferralsPage .stat-card {
  border-radius: 18px;
  box-shadow: 0 8px 26px rgba(15, 23, 42, 0.06);
}

#ibReferralsPage .ibref-table-head {
  background: #f8fafc;
  border-bottom: 1px solid rgba(148, 163, 184, 0.2);
  outline: none;
}

#ibReferralsPage .ibref-toolbar-group {
  background: #ffffff;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

#ibReferralsPage .ibref-toolbar-group .form-control,
#ibReferralsPage .ibref-toolbar-group .form-select,
#ibReferralsPage .ibref-toolbar-group .input-group-text {
  border-color: rgba(148, 163, 184, 0.22);
}

#ibReferralsPage .ibref-toolbar-group .input-group-text {
  border-left: 0;
}

#ibReferralsPage .ibref-toolbar-group .form-control {
  border-right: 0;
}

#ibReferralsPage.all-referrals-page .ibref-toolbar-group {
  border-radius: 12px;
  background: #F9F9F9;
}

#ibReferralsPage.all-referrals-page .ibref-toolbar-group .form-control,
#ibReferralsPage.all-referrals-page .ibref-toolbar-group .form-select,
#ibReferralsPage.all-referrals-page .ibref-toolbar-group .input-group-text {
  background: #F9F9F9 !important;
  height: 40px;
  border-color: rgba(148, 163, 184, 0.22);
}

#ibReferralsPage.all-referrals-page .ibref-toolbar-group .form-control,
#ibReferralsPage.all-referrals-page .ibref-toolbar-group .form-select {
  padding-top: 0.55rem;
  padding-bottom: 0.55rem;
}

#ibReferralsPage.all-referrals-page .ibref-toolbar-group .input-group-text {
  width: 42px;
  justify-content: center;
}

/* All Referrals: separate title bar vs toolbar bar (like reference) */
#ibReferralsPage.all-referrals-page .ibref-table-titlebar {
  background: #F9F9F9;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18);
}

#ibReferralsPage.all-referrals-page .ibref-table-toolbar {
  background: #ffffff;
}

/* All Referrals: Filters panel styling (match reference) */
#ibReferralsPage.all-referrals-page #ibrefFilters .ibref-filters-card {
  background: #ffffff;
  border-radius: 18px;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.08) !important;
}

#ibReferralsPage.all-referrals-page #ibrefFilters .ibref-filters-card .card-body {
  padding: 1.15rem !important;
}

#ibReferralsPage.all-referrals-page #ibrefFilters .ibref-filters-card .form-control,
#ibReferralsPage.all-referrals-page #ibrefFilters .ibref-filters-card .form-select,
#ibReferralsPage.all-referrals-page #ibrefFilters .ibref-filters-card .input-group-text {
  background: #F9F9F9 !important;
  height: 40px;
  border-color: rgba(148, 163, 184, 0.22);
}

#ibReferralsPage.all-referrals-page #ibrefFilters .ibref-filters-card .form-control,
#ibReferralsPage.all-referrals-page #ibrefFilters .ibref-filters-card .form-select {
  padding-top: 0.55rem;
  padding-bottom: 0.55rem;
}

#ibReferralsPage.all-referrals-page #ibrefFilters .ibref-filters-card .input-group-text {
  width: 42px;
  justify-content: center;
}

#ibReferralsPage.all-referrals-page #ibrefFilters .ibref-filters-card :is(.form-control, .form-select, .btn):focus,
#ibReferralsPage.all-referrals-page #ibrefFilters .ibref-filters-card :is(.form-control, .form-select, .btn):focus-visible {
  box-shadow: none;
  outline: none;
}

/* Referrals by IB: Filters panel styling (match All Referrals) */
#ibReferralsPage.referrals-by-ib-page #ibrefByIbFilters .ibref-filters-card {
  background: #ffffff;
  border-radius: 18px;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.08) !important;
}

#ibReferralsPage.referrals-by-ib-page #ibrefByIbFilters .ibref-filters-card .card-body {
  padding: 1.15rem !important;
}

#ibReferralsPage.referrals-by-ib-page #ibrefByIbFilters .ibref-filters-card .form-control,
#ibReferralsPage.referrals-by-ib-page #ibrefByIbFilters .ibref-filters-card .form-select,
#ibReferralsPage.referrals-by-ib-page #ibrefByIbFilters .ibref-filters-card .input-group-text {
  background: #F9F9F9 !important;
  height: 40px;
  border-color: rgba(148, 163, 184, 0.22);
}

#ibReferralsPage.referrals-by-ib-page #ibrefByIbFilters .ibref-filters-card .form-control,
#ibReferralsPage.referrals-by-ib-page #ibrefByIbFilters .ibref-filters-card .form-select {
  padding-top: 0.55rem;
  padding-bottom: 0.55rem;
}

#ibReferralsPage.referrals-by-ib-page #ibrefByIbFilters .ibref-filters-card .input-group-text {
  width: 42px;
  justify-content: center;
}

#ibReferralsPage.referrals-by-ib-page #ibrefByIbFilters .ibref-filters-card :is(.form-control, .form-select, .btn):focus,
#ibReferralsPage.referrals-by-ib-page #ibrefByIbFilters .ibref-filters-card :is(.form-control, .form-select, .btn):focus-visible {
  box-shadow: none;
  outline: none;
}

/* Referral Clients: Filters panel styling (match All Referrals) */
#ibReferralsPage.refclients-page #refClientsFilters .ibref-filters-card {
  background: #ffffff;
  border-radius: 18px;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.08) !important;
}

#ibReferralsPage.refclients-page #refClientsFilters .ibref-filters-card .card-body {
  padding: 1.15rem !important;
}

#ibReferralsPage.refclients-page #refClientsFilters .ibref-filters-card .form-control,
#ibReferralsPage.refclients-page #refClientsFilters .ibref-filters-card .form-select,
#ibReferralsPage.refclients-page #refClientsFilters .ibref-filters-card .input-group-text {
  background: #F9F9F9 !important;
  height: 40px;
  border-color: rgba(148, 163, 184, 0.22);
}

#ibReferralsPage.refclients-page #refClientsFilters .ibref-filters-card .form-control,
#ibReferralsPage.refclients-page #refClientsFilters .ibref-filters-card .form-select {
  padding-top: 0.55rem;
  padding-bottom: 0.55rem;
}

#ibReferralsPage.refclients-page #refClientsFilters .ibref-filters-card .input-group-text {
  width: 42px;
  justify-content: center;
}

#ibReferralsPage.refclients-page #refClientsFilters .ibref-filters-card :is(.form-control, .form-select, .btn):focus,
#ibReferralsPage.refclients-page #refClientsFilters .ibref-filters-card :is(.form-control, .form-select, .btn):focus-visible {
  box-shadow: none;
  outline: none;
}

#ibReferralsPage .ibref-table-head :is(button, a, input, select, textarea):focus,
#ibReferralsPage .ibref-table-head :is(button, a, input, select, textarea):focus-visible {
  box-shadow: none;
  outline: none;
}

#ibReferralsPage .ibref-filters-card {
  background: #ffffff;
  border: 0;
  box-shadow: 0 -8px 16px rgba(15, 23, 42, 0.055), 0 10px 14px rgba(15, 23, 42, 0.04) !important;
}

#ibReferralsPage .ibref-input .form-control,
#ibReferralsPage .ibref-input .form-select,
#ibReferralsPage .ibref-input .input-group-text {
  border-color: rgba(148, 163, 184, 0.22);
}

#ibReferralsPage .ibref-input .input-group-text {
  border-left: 0;
}

#ibReferralsPage .ibref-table thead th {
  background: #eef3ff;
  color: #2563eb;
  font-weight: 700;
  font-size: 0.8rem;
  border-bottom: 0;
  white-space: nowrap;
}

#ibReferralsPage .ibref-table tbody td {
  font-size: 0.875rem;
  border-bottom: 1px dashed rgba(148, 163, 184, 0.4);
  padding-top: 0.9rem;
  padding-bottom: 0.9rem;
  vertical-align: middle;
}

#ibReferralsPage .ibref-table tbody tr:nth-child(even) td {
  background: #f4f6f8;
}

#ibReferralsPage .ibref-table th,
#ibReferralsPage .ibref-table td {
  border-right: 1px dashed rgba(148, 163, 184, 0.35);
}

#ibReferralsPage .ibref-table th:last-child,
#ibReferralsPage .ibref-table td:last-child {
  border-right: 0;
}

#ibReferralsPage .ibref-status {
  font-weight: 700;
  font-size: 0.75rem;
  min-width: 88px;
}

#ibReferralsPage .ibref-status-active {
  background: #8BE59F;
  color: #166534;
}

#ibReferralsPage .ibref-status-inactive {
  background: rgba(37, 99, 235, 0.14);
  color: #2563eb;
}

#ibReferralsPage .ibref-dots {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  color: #131313;
  background: transparent;
}

#ibReferralsPage .ibref-dots.dropdown-toggle::after {
  display: none;
}

#ibReferralsPage .ibref-dots.dropdown-toggle::before {
  content: "⋮";
  font-size: 18px;
  line-height: 1;
  display: inline-block;
  transform: translateY(-1px);
}

#ibReferralsPage .ibref-dots:hover {
  background: #f1f5f9;
}

#ibReferralsPage .ibref-actions-menu {
  width: 200px;
  border-radius: 12px;
  padding: 10px 8px;
}

#ibReferralsPage .ibref-actions-menu .dropdown-item {
  border-radius: 10px;
  padding: 10px 12px;
  font-weight: 700;
  color: #111827;
}

#ibReferralsPage .ibref-actions-menu .dropdown-item i {
  width: 18px;
  text-align: center;
  color: #111827;
}

#ibReferralsPage .ibref-actions-menu .dropdown-item.text-danger {
  font-weight: 800;
}

#ibReferralsPage .ibref-actions-menu .dropdown-item.text-danger i {
  color: #ef4444;
}

#ibReferralsPage .ibref-actions-menu .dropdown-item:hover {
  background: #f1f5f9;
}

/* Wallet info labels/values */
#ibrefWalletInfoRow .ibref-info-label {
  font-size: 0.78rem;
  font-weight: 500;
  color: #94a3b8;
  margin-bottom: 2px;
}
#ibrefWalletInfoRow .ibref-info-value {
  font-size: 0.9rem;
  font-weight: 700;
  color: #111827;
}

/* Stat boxes */
#ibReferralsPage .ibref-stat {
  background: #fff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.06);
}
#ibReferralsPage .ibref-stat-label {
  font-size: 0.82rem;
  font-weight: 600;
  color: #64748b;
  white-space: nowrap;
}
#ibReferralsPage .ibref-stat-value {
  font-size: 1.3rem;
  font-weight: 700;
  color: #111827;
}

/* Wallet details card: match reference spacing without affecting other blocks */
#ibReferralsPage #ibrefWalletCard .ibref-stat {
  border-radius: 14px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
}

#ibReferralsPage #ibrefWalletCard .ibref-stat > div {
  min-height: 44px;
}

/* Segmented toggle: single rounded bar, no extra white wrapper (sits on page bg) */
#ibReferralsPage .ibref-segmented {
  display: inline-flex;
  align-items: stretch;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.55);
  box-shadow: none;
}

#ibReferralsPage .ibref-segmented .ibref-segment-btn {
  border: 0;
  border-radius: 0 !important;
  min-width: 148px;
  padding: 0.45rem 1.15rem;
  line-height: 1.25;
}

#ibReferralsPage .ibref-segmented .ibref-segment-btn:focus,
#ibReferralsPage .ibref-segmented .ibref-segment-btn:focus-visible {
  box-shadow: none;
  outline: none;
}

#ibReferralsPage .ibref-segmented .ibref-segment-btn--active {
  background: #2563eb;
  color: #fff;
}

#ibReferralsPage .ibref-segmented .ibref-segment-btn--inactive {
  background: #fff;
  color: #111827;
}

/* Referral Details modal (right-side panel like design) */
.ibref-details-modal .modal-dialog.ibref-details-dialog {
  max-width: 620px;
  width: min(620px, calc(100% - 24px));
  margin: 0 0 0 auto;
  height: 100%;
}

/* Ensure backdrop covers sidebar/header (sidebar uses z-index: 1200) */
body.ibref-details-open .modal-backdrop.show {
  z-index: 2000;
}

body.ibref-details-open #ibrefReferralDetailsModal {
  z-index: 2005;
}

.ibref-details-modal .modal-content.ibref-details-content {
  height: 100%;
  border-radius: 18px 0 0 18px;
  box-shadow: 0 22px 60px rgba(15, 23, 42, 0.22);
}

.ibref-details-modal .ibref-details-header {
  border-bottom: 1px solid rgba(148, 163, 184, 0.25);
}

.ibref-details-modal .ibref-details-close {
  width: 40px;
  height: 40px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #fff;
  border: 1px solid rgba(148, 163, 184, 0.35);
  color: #111827;
}

.ibref-details-modal .ibref-details-close:focus,
.ibref-details-modal .ibref-details-close:focus-visible {
  box-shadow: none;
  outline: none;
}

.ibref-details-modal .ibref-kv-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px 28px;
  border-top: 1px solid rgba(148, 163, 184, 0.18);
  padding-top: 18px;
}

.ibref-details-modal .ibref-k {
  color: #64748b;
  font-size: 0.78rem;
  font-weight: 700;
  margin-bottom: 4px;
}

.ibref-details-modal .ibref-v {
  font-size: 0.92rem;
}

.ibref-details-modal .ibref-source .form-control {
  font-size: 0.92rem;
  color: #111827;
  background: #E9E9E9;
}

.ibref-details-modal .ibref-source .btn {
  color: #111827;
  background: #E9E9E9;
}

.ibref-details-modal .ibref-source .form-control:focus,
.ibref-details-modal .ibref-source .btn:focus,
.ibref-details-modal .ibref-source .btn:focus-visible {
  box-shadow: none;
  outline: none;
}

.ibref-details-modal .ibref-metric {
  background: #E9E9E9;
}

@media (max-width: 768px) {
  .ibref-details-modal .modal-dialog.ibref-details-dialog {
    width: 100%;
    max-width: 100%;
  }
  .ibref-details-modal .modal-content.ibref-details-content {
    border-radius: 0;
  }
  .ibref-details-modal .ibref-kv-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 460px) {
  .ibref-details-modal .ibref-kv-grid {
    grid-template-columns: 1fr;
  }
}

#ibReferralsPage .ibref-filter-btn {
  width: 38px;
  height: 38px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

#ibReferralsPage .ibref-filter-btn i {
  color: #111827;
}

/* IB group pills (Referrals by IB page) */
#ibReferralsPage .ibref-group {
  font-size: 0.75rem;
  font-weight: 800;
}

#ibReferralsPage .ibref-group-gold {
  background: rgba(250, 204, 21, 0.28);
  color: #7c5d00;
}

#ibReferralsPage .ibref-group-silver {
  background: rgba(148, 163, 184, 0.28);
  color: #334155;
}

#ibReferralsPage .ibref-group-platinum {
  background: rgba(37, 99, 235, 0.16);
  color: #2563eb;
}

#ibReferralsPage .ibm-pagination .page-link {
  border: 0;
  color: #64748b;
}

#ibReferralsPage .ibm-pagination .page-item.active .page-link {
  background: #0d6efd;
  color: #fff;
}

#ibReferralsPage .ibm-pagination {
  gap: 6px;
}

#ibReferralsPage .ibm-pagination .ibm-page-num,
#ibReferralsPage .ibm-pagination .ibm-page-btn,
#ibReferralsPage .ibm-pagination .ibm-page-ellipsis {
  width: 34px;
  height: 34px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  background: #f1f5f9;
}

#ibReferralsPage .ibm-pagination .ibm-page-btn i {
  font-size: 12px;
}

#ibReferralsPage .ibm-pagination .page-item.active .ibm-page-num {
  background: #0d6efd;
  color: #fff;
}

#ibReferralsPage .ibm-pagination .page-item:not(.active):not(.disabled) .ibm-page-num:hover,
#ibReferralsPage .ibm-pagination .page-item:not(.active):not(.disabled) .ibm-page-btn:hover {
  background: #e2e8f0;
}

#ibReferralsPage .ibm-pagination .page-item.disabled .page-link {
  opacity: 0.6;
}

/* Referral Clients (per-IB) — same as dashboard body bg (--bg-body / #E7F1F9) */
#ibReferralsPage.refclients-page {
  background: var(--bg-body);
  margin: -20px -28px 0;
  padding: 20px 28px 40px;
}

@media (max-width: 767.98px) {
  #ibReferralsPage.refclients-page {
    margin: -14px -14px 0;
    padding: 14px 14px 30px;
  }
}

@media (max-width: 575.98px) {
  #ibReferralsPage.refclients-page {
    margin: -12px -12px 0;
    padding: 12px 12px 24px;
  }
}

#ibReferralsPage .refclients-stat-box {
  border: 1px solid #e2e8f0;
  border-radius: 0.75rem;
  padding: 0.65rem 0.85rem;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

#ibReferralsPage .refclients-stat-label {
  font-size: 0.8125rem;
  color: #000;
  font-weight: 600;
}

#ibReferralsPage .refclients-stat-value {
  font-size: 1rem;
  font-weight: 700;
  color: #000;
}

#ibReferralsPage .refclients-badge-aid {
  background: #dbeafe;
  color: #1d4ed8;
  font-weight: 600;
}

#ibReferralsPage .refclients-badge-tier {
  background: #fef9c3;
  color: #854d0e;
  font-weight: 600;
}

#ibReferralsPage .refclients-badge-region {
  background: #f1f5f9;
  color: #475569;
  font-weight: 600;
}

/* Distinct white panels on pale blue (match reference) */
#ibReferralsPage.refclients-page .refclients-main-card {
  background: #fff;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 4px 14px rgba(15, 23, 42, 0.04);
}

#ibReferralsPage.refclients-page .refclients-page-title {
  letter-spacing: -0.01em;
}

/* Referral Clients table: horizontal padding so content isn’t flush to the edge */
#ibReferralsPage.refclients-page .refclients-table thead th,
#ibReferralsPage.refclients-page .refclients-table tbody td {
  padding-left: 1.25rem;
  padding-right: 1rem;
}

@media (min-width: 768px) {
  #ibReferralsPage.refclients-page .refclients-table thead th,
  #ibReferralsPage.refclients-page .refclients-table tbody td {
    padding-left: 1.5rem;
    padding-right: 1.25rem;
  }
}

