.btn-success[data-v-186e584e] {
  color: var(--success);
}
.text-muted[data-v-186e584e] {
  color: #909399;
}
.d-flex[data-v-186e584e] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 4px;
}
.reassigned-icon[data-v-186e584e] {
  margin-left: 4px;
}

/* Improve tag spacing */
.el-tag[data-v-186e584e] {
  margin: 2px 0;
}

/* Improve pointer cursor for copyable elements */
.pointer[data-v-186e584e] {
  cursor: pointer;
}
.pointer[data-v-186e584e]:hover {
  opacity: 0.8;
}

/* Referrer Alert Styling */
.referrer-alert[data-v-186e584e] {
  border-left: 6px solid #f56c6c !important;
  background: linear-gradient(135deg, #f56c6c, #ff8a95) !important;
  -webkit-animation: pulse-red-186e584e 2s infinite,shake-186e584e 0.5s infinite alternate;
          animation: pulse-red-186e584e 2s infinite,shake-186e584e 0.5s infinite alternate;
  border-radius: 8px !important;
  -webkit-box-shadow: 0 4px 12px rgba(245, 108, 108, 0.3) !important;
          box-shadow: 0 4px 12px rgba(245, 108, 108, 0.3) !important;
}
.referrer-alert .el-alert__title[data-v-186e584e] {
  font-size: 18px !important;
  font-weight: bold !important;
  color: white !important;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-pack: justify !important;
      -ms-flex-pack: justify !important;
          justify-content: space-between !important;
  -webkit-box-align: center !important;
      -ms-flex-align: center !important;
          align-items: center !important;
  -ms-flex-wrap: wrap !important;
      flex-wrap: wrap !important;
}
.referrer-title-content[data-v-186e584e] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.referrer-counts[data-v-186e584e] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 15px;
  margin-top: 5px;
  font-size: 14px;
}
.today-count[data-v-186e584e] {
  background: rgba(255, 255, 255, 0.2);
  padding: 2px 8px;
  border-radius: 4px;
  border: 1px solid rgba(255, 255, 255, 0.3);
}
.total-count[data-v-186e584e] {
  background: rgba(255, 255, 255, 0.15);
  padding: 2px 8px;
  border-radius: 4px;
  border: 1px solid rgba(255, 255, 255, 0.2);
}
.referrer-actions[data-v-186e584e] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 5px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.referrer-alert .el-alert__description[data-v-186e584e] {
  margin-top: 8px;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.95) !important;
  font-weight: 500;
}
.referrer-alert .el-alert__icon[data-v-186e584e] {
  color: white !important;
  font-size: 20px !important;
}
@-webkit-keyframes pulse-red-186e584e {
0% {
    -webkit-box-shadow: 0 4px 12px rgba(245, 108, 108, 0.3),
      0 0 0 0 rgba(245, 108, 108, 0.7);
            box-shadow: 0 4px 12px rgba(245, 108, 108, 0.3),
      0 0 0 0 rgba(245, 108, 108, 0.7);
}
70% {
    -webkit-box-shadow: 0 4px 12px rgba(245, 108, 108, 0.3),
      0 0 0 15px rgba(245, 108, 108, 0);
            box-shadow: 0 4px 12px rgba(245, 108, 108, 0.3),
      0 0 0 15px rgba(245, 108, 108, 0);
}
100% {
    -webkit-box-shadow: 0 4px 12px rgba(245, 108, 108, 0.3),
      0 0 0 0 rgba(245, 108, 108, 0);
            box-shadow: 0 4px 12px rgba(245, 108, 108, 0.3),
      0 0 0 0 rgba(245, 108, 108, 0);
}
}
@keyframes pulse-red-186e584e {
0% {
    -webkit-box-shadow: 0 4px 12px rgba(245, 108, 108, 0.3),
      0 0 0 0 rgba(245, 108, 108, 0.7);
            box-shadow: 0 4px 12px rgba(245, 108, 108, 0.3),
      0 0 0 0 rgba(245, 108, 108, 0.7);
}
70% {
    -webkit-box-shadow: 0 4px 12px rgba(245, 108, 108, 0.3),
      0 0 0 15px rgba(245, 108, 108, 0);
            box-shadow: 0 4px 12px rgba(245, 108, 108, 0.3),
      0 0 0 15px rgba(245, 108, 108, 0);
}
100% {
    -webkit-box-shadow: 0 4px 12px rgba(245, 108, 108, 0.3),
      0 0 0 0 rgba(245, 108, 108, 0);
            box-shadow: 0 4px 12px rgba(245, 108, 108, 0.3),
      0 0 0 0 rgba(245, 108, 108, 0);
}
}
@-webkit-keyframes shake-186e584e {
0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
}
25% {
    -webkit-transform: translateX(-2px);
            transform: translateX(-2px);
}
50% {
    -webkit-transform: translateX(2px);
            transform: translateX(2px);
}
75% {
    -webkit-transform: translateX(-1px);
            transform: translateX(-1px);
}
100% {
    -webkit-transform: translateX(1px);
            transform: translateX(1px);
}
}
@keyframes shake-186e584e {
0% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
}
25% {
    -webkit-transform: translateX(-2px);
            transform: translateX(-2px);
}
50% {
    -webkit-transform: translateX(2px);
            transform: translateX(2px);
}
75% {
    -webkit-transform: translateX(-1px);
            transform: translateX(-1px);
}
100% {
    -webkit-transform: translateX(1px);
            transform: translateX(1px);
}
}

/* Make referrer phone numbers more prominent */
.btn-success[data-v-186e584e] {
  color: var(--success);
  font-weight: bold;
}
.reassigned-icon[data-v-186e584e] {
  margin-left: 4px;
  -webkit-animation: spin-186e584e 2s linear infinite;
          animation: spin-186e584e 2s linear infinite;
}
@-webkit-keyframes spin-186e584e {
from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
}
to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
}
}
@keyframes spin-186e584e {
from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
}
to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
}
}

/* Toggle Button Styles */
.info-toggle-container[data-v-186e584e] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.info-toggle-btn[data-v-186e584e] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 6px;
  color: #409eff;
  font-size: 12px;
  padding: 6px 12px;
  border-radius: 4px;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.info-toggle-btn[data-v-186e584e]:hover {
  background-color: rgba(64, 158, 255, 0.1);
  color: #409eff;
}
.info-toggle-btn i[data-v-186e584e] {
  font-size: 12px;
}

/* Glowing effect for the toggle button */
.glow-effect[data-v-186e584e] {
  -webkit-animation: glow-186e584e 2s infinite;
          animation: glow-186e584e 2s infinite;
  position: relative;
}
.glow-effect[data-v-186e584e]::after {
  content: '';
  position: absolute;
  top: -2px;
  left: -2px;
  right: -2px;
  bottom: -2px;
  background: linear-gradient(45deg, #409eff, #67c23a, #e6a23c, #f56c6c);
  border-radius: 6px;
  z-index: -1;
  -webkit-animation: borderGlow-186e584e 2s infinite;
          animation: borderGlow-186e584e 2s infinite;
  opacity: 0.5;
}
@-webkit-keyframes glow-186e584e {
0% {
    -webkit-box-shadow: 0 0 5px rgba(64, 158, 255, 0.5);
            box-shadow: 0 0 5px rgba(64, 158, 255, 0.5);
}
50% {
    -webkit-box-shadow: 0 0 20px rgba(64, 158, 255, 0.8);
            box-shadow: 0 0 20px rgba(64, 158, 255, 0.8);
}
100% {
    -webkit-box-shadow: 0 0 5px rgba(64, 158, 255, 0.5);
            box-shadow: 0 0 5px rgba(64, 158, 255, 0.5);
}
}
@keyframes glow-186e584e {
0% {
    -webkit-box-shadow: 0 0 5px rgba(64, 158, 255, 0.5);
            box-shadow: 0 0 5px rgba(64, 158, 255, 0.5);
}
50% {
    -webkit-box-shadow: 0 0 20px rgba(64, 158, 255, 0.8);
            box-shadow: 0 0 20px rgba(64, 158, 255, 0.8);
}
100% {
    -webkit-box-shadow: 0 0 5px rgba(64, 158, 255, 0.5);
            box-shadow: 0 0 5px rgba(64, 158, 255, 0.5);
}
}
@-webkit-keyframes borderGlow-186e584e {
0% {
    opacity: 0.3;
}
50% {
    opacity: 0.7;
}
100% {
    opacity: 0.3;
}
}
@keyframes borderGlow-186e584e {
0% {
    opacity: 0.3;
}
50% {
    opacity: 0.7;
}
100% {
    opacity: 0.3;
}
}

/* Info Card Styles */
.info-card[data-v-186e584e] {
  border: 1px solid #e8f4fd;
  background: linear-gradient(135deg, #f8fcff 0%, #e8f4fd 100%);
  border-radius: 8px;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  font-size: 12px;
}
.info-card[data-v-186e584e]:hover {
  -webkit-transform: translateY(-2px);
          transform: translateY(-2px);
  -webkit-box-shadow: 0 8px 25px rgba(64, 158, 255, 0.1);
          box-shadow: 0 8px 25px rgba(64, 158, 255, 0.1);
}
.card-header[data-v-186e584e] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0;
  background: transparent;
  border-bottom: 1px solid #e8f4fd;
}
.header-content[data-v-186e584e] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px;
}
.header-icon[data-v-186e584e] {
  font-size: 16px;
  color: #409eff;
}
.header-title[data-v-186e584e] {
  font-size: 14px;
  font-weight: 600;
  color: #2c3e50;
}
.card-content[data-v-186e584e] {
  padding: 16px 0 8px 0;
}
.info-section[data-v-186e584e] {
  margin-bottom: 20px;
}
.info-section[data-v-186e584e]:last-child {
  margin-bottom: 0;
}
.section-title[data-v-186e584e] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  font-size: 13px;
  font-weight: 600;
  color: #34495e;
}
.section-icon[data-v-186e584e] {
  font-size: 14px;
  color: #409eff;
}
.section-description[data-v-186e584e] {
  margin: 0;
  line-height: 1.6;
  color: #5a6c7d;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 4px;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  font-size: 12px;
}
.inline-tag[data-v-186e584e] {
  margin: 0 4px;
}

/* Navigation Info Styles */
.navigation-info[data-v-186e584e] {
  background: rgba(255, 255, 255, 0.8);
  border-radius: 6px;
  padding: 16px;
  border-left: 4px solid #52c41a;
}
.nav-description[data-v-186e584e] {
  margin: 0 0 12px 0;
  line-height: 1.7;
  color: #2c3e50;
  font-size: 12px;
}
.nav-description[data-v-186e584e]:last-child {
  margin-bottom: 0;
}
.highlight-text[data-v-186e584e] {
  color: #1890ff;
  background: rgba(24, 144, 255, 0.1);
  padding: 2px 6px;
  border-radius: 3px;
  font-weight: 700;
  font-size: 12px;
}
.highlight-referral[data-v-186e584e] {
  color: #f5222d;
  background: rgba(245, 34, 45, 0.1);
  padding: 2px 6px;
  border-radius: 3px;
  font-weight: 700;
  font-size: 12px;
  text-shadow: 0 1px 2px rgba(245, 34, 45, 0.2);
}

/* Sorting Info Styles */
.sorting-info[data-v-186e584e] {
  background: rgba(255, 255, 255, 0.8);
  border-radius: 6px;
  padding: 16px;
  border-left: 4px solid #409eff;
  font-size: 12px;
}
.sort-description[data-v-186e584e] {
  margin: 0 0 12px 0;
  line-height: 1.6;
  color: #2c3e50;
  font-size: 12px;
}
.sort-examples[data-v-186e584e] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 8px;
  margin-bottom: 12px;
}
.sort-example[data-v-186e584e] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px;
  padding: 6px 10px;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 4px;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.sort-example[data-v-186e584e]:hover {
  background: rgba(255, 255, 255, 0.9);
  -webkit-transform: translateX(4px);
          transform: translateX(4px);
}
.sort-icon[data-v-186e584e] {
  font-size: 12px;
  color: #409eff;
  width: 14px;
  text-align: center;
}
.sort-text[data-v-186e584e] {
  color: #5a6c7d;
  line-height: 1.5;
  font-size: 12px;
}
.sort-note[data-v-186e584e] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 6px;
  margin: 0;
  padding: 8px 12px;
  background: rgba(64, 158, 255, 0.05);
  border-radius: 4px;
  color: #409eff;
  font-size: 11px;
}
.sort-note i[data-v-186e584e] {
  font-size: 12px;
  color: #409eff;
}
.sort-note i.el-icon-caret-top[data-v-186e584e],
.sort-note i.el-icon-caret-bottom[data-v-186e584e] {
  margin: 0 2px;
  color: #409eff;
}
.date-explanations[data-v-186e584e] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 12px;
}
.date-item[data-v-186e584e] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 12px;
  padding: 12px;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 6px;
  border-left: 4px solid #409eff;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.date-item[data-v-186e584e]:hover {
  background: rgba(255, 255, 255, 0.9);
  -webkit-transform: translateX(4px);
          transform: translateX(4px);
}
.date-label[data-v-186e584e] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 6px;
  min-width: 180px;
  color: #2c3e50;
  font-size: 12px;
}
.date-label i[data-v-186e584e] {
  color: #409eff;
  font-size: 12px;
}
.date-description[data-v-186e584e] {
  color: #5a6c7d;
  line-height: 1.5;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-size: 12px;
}

/* Responsive Design */
@media (max-width: 768px) {
.date-item[data-v-186e584e] {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 8px;
}
.date-label[data-v-186e584e] {
    min-width: auto;
}
.header-content[data-v-186e584e] {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    gap: 4px;
}
.info-toggle-container[data-v-186e584e] {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
}