:root {

    --gold-primary: #C9A227;
    --gold-hover: #B8860B;
    --gold-dark: #8B7500;

}

/* Card */

.card {

    border: none;
    border-radius: 15px;
    box-shadow: 0 4px 20px rgba(0,0,0,.05);

}

/* Stat Card */

.stat-card {

    transition: .3s;

}

.stat-card:hover {

    transform: translateY(-3px);

}

/* Rank Card */



/* Gold Button */

.btn-gold {

    background: linear-gradient(
        135deg,
        #D4AF37,
        #C9A227
    );

    border: none;

    color: #fff;

}

.btn-gold:hover {

    background: linear-gradient(
        135deg,
        #C9A227,
        #B8860B
    );

    color: #fff;

}

/* Progress */

.progress {

  height: 18px;
  border-radius: 50px;

}

.progress-bar {

    background: linear-gradient(
        90deg,
        #D4AF37,
        #C9A227
    );

}

/* Network Counter */

.network-number {

    color: var(--gold-primary);
    font-weight: 700;

}

/* Table */

.table thead {

    background: #FFF8E1;

}

.table thead th {

    color: var(--gold-dark);

}

/* Badge */

.badge-paid {

    background: #E8F5E9;
    color: #2E7D32;

}

/* Announcement */

.announcement-item {

    padding: 15px;
    border-radius: 10px;

    transition: .3s;

}

.announcement-item:hover {

    background: #FFF8E1;

}

/* Referral Box */

.referral-box {

    border: 2px dashed #E5D7A3;
    border-radius: 12px;

}

/* Rank Medal */

.rank-medal {

  width: 190px;
  align-self: center;
  margin-left: -30px;

  filter: drop-shadow(
      0 8px 15px rgba(201,162,39,.20)
  );

}

.rank-title {

  font-size: 2.4rem;
  line-height: 1.1;
  color: #C9A227;
  font-weight: 700;
  letter-spacing: -.5px;

}

.rank-requirement {

    padding: 12px 15px;

    border-radius: 10px;

    margin-bottom: 10px;

    font-size: 14px;

}

.rank-requirement.success {

    background: #E8F5E9;

    color: #2E7D32;

}

.rank-requirement.pending {

    background: #FFF8E1;

    color: #B8860B;

}

.progress {

    height: 12px;

    border-radius: 30px;

    background: #F4F4F4;

}

.progress-bar {

    background: linear-gradient(
        90deg,
        #D4AF37,
        #C9A227
    );

}

.network-box {

    background: #FFFDF8;

    border: 1px solid #F1E3A3;

    border-radius: 12px;

    padding: 15px;

    text-align: center;

    transition: all .3s ease;

}

.network-box:hover {

    transform: translateY(-3px);

    box-shadow: 0 8px 20px rgba(201,162,39,.12);

}

.network-box h4 {

    margin-top: 8px;

    margin-bottom: 0;

    color: #C9A227;

    font-weight: 700;

}

.network-total {

    color: #C9A227;

    font-weight: 700;

}

.commission-type {

    color: #444;

    font-weight: 500;

}

.badge-paid {

    background: #E8F5E9;

    color: #2E7D32;

    padding: 6px 12px;

    border-radius: 20px;

}

.announcement-item {

    padding: 15px;

    border-radius: 12px;

    margin-bottom: 10px;

    background: #FFFDF8;

    border: 1px solid #F1E3A3;

    transition: .3s;

}

.announcement-item:hover {

    background: #FFF8E1;

}

.stat-icon i {

    color: #C9A227;

    font-size: 50px;

}

.referral-title {

    font-size: 1.5rem;
    font-weight: 500;

}

.network-title {

    font-size: 2rem;
    font-weight: 700;

}

.referral-icon {

    width: 70px;

    height: 70px;

    border-radius: 50%;

    background: rgba(201,162,39,.12);

    flex-shrink: 0;

}

.referral-icon i {

    font-size: 34px;

    color: #C9A227;

}

.icon-circle {

    width: 60px;
    height: 60px;

    border-radius: 50%;
    background: rgba(201,162,39,.12);

    display: flex;
    align-items: center;
    justify-content: center;

    flex-shrink: 0;
}

.icon-circle i {

    font-size: 32px;
    color: #C9A227;

    line-height: 1;
}

.network-level-card {

    border: 1px solid #F1E3A3;

    border-radius: 20px;

    background: #FFFDF8;

    padding: 25px 10px;

    transition: .3s;

}

.network-level-card:hover {

  transform: translateY(-3px);

  box-shadow: 0 8px 20px rgba(201,162,39,.10);

}

.total-network-card {

    background: linear-gradient(
        135deg,
        #FFFDF8,
        #FFF8E8
    );

    border: 1px solid #F1E3A3;

    border-radius: 18px;

    padding: 25px 35px;
    min-height: 120px;

}

.icon-circle-sm {

    width: 50px;
    height: 50px;

    border-radius: 50%;

    background: rgba(201,162,39,.12);

    display: flex;
    align-items: center;
    justify-content: center;

}

.icon-circle-sm i {

    color: #C9A227;
    font-size: 22px;

}

.network-stat {

    padding: 10px 0;

}

.network-stat.border-start {

    border-left: 1px solid #E5E5E5 !important;

}

.network-number {

    font-size: 2rem;

    font-weight: 700;

    color: #C9A227;

    margin-top: 8px;

}

.total-network-row {

    padding: 14px 18px;

    border: 1px solid #EFE7C7;

    border-radius: 12px;

    background: #FFFEFB;

}

.total-network-label {

    font-size: 1rem;

    font-weight: 600;

    color: #444;

}

.total-network-value {

    font-size: 2rem;

    font-weight: 700;

    color: #C9A227;

}

.mini-icon-circle {

    width: 36px;

    height: 36px;

    border-radius: 10px;

    background: rgba(201,162,39,.12);

    display: flex;

    align-items: center;

    justify-content: center;

}

.mini-icon-circle i {

    color: #C9A227;

    font-size: 18px;

}

.rank-icon {

    color: #C9A227;
    font-size: 56px;

}

.rank-progress-title {

    font-size: 3rem;
    font-weight: 700;
    color: #C9A227;
    margin-bottom: 10px;

}

.rank-progress-bar {

    height: 12px;
    border-radius: 50px;
    margin-top: 20px;

}



.rank-amount {

    font-size: 3rem;
    font-weight: 700;
    color: #C9A227;

}

.achievement-success {

    /* background: #EDF7EE;
    color: #2E7D32; */

    /* padding: 10px 10px; */

    border-radius: 16px;

    font-size: 1.2rem;

    font-weight: 500;

}
.achievement-danger {

    /* background: #EDF7EE;
    color: #2E7D32; */

    /* padding: 18px 20px; */

    border-radius: 16px;

    font-size: 1.2rem;

    font-weight: 500;

}

.achievement-warning {

    background: #FFF8E6;
    color: #B8860B;

    padding: 18px 20px;

    border-radius: 16px;

    font-size: 1.2rem;

    font-weight: 500;

}

.rank-status-box {

    background: #FFF8E6;

    border: 1px solid #F1E3A3;

    border-radius: 16px;

    padding: 20px;

    display: flex;

    align-items: center;

    gap: 15px;

    color: #B8860B;

}

.rank-status-box i {

    font-size: 32px;

}

.rank-progress-medal {

  width: 140px;
  height: auto;
  flex-shrink: 0;

    filter: drop-shadow(
        0 8px 15px rgba(201,162,39,.15)
    );

}
.rank-name {

    color: #C9A227;
    font-weight: 700;

}

.rank-percent {

    font-size: 2rem;
    font-weight: 700;
    color: #C9A227;

}



.rank-progress-bar .progress-bar {

    background: #C9A227;

}

.rank-sales-text {

    font-size: 1.2rem;
    font-weight: 500;
    color: #2f3148;

}

.achievement-row {

    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 0;

}

.achievement-left {

    display: flex;
    align-items: center;
    gap: 12px;

}

.achievement-left i {

    font-size: 1.6rem;

}

.achievement-success {

    color: #2eb85c;

}

.achievement-danger {

    color: #e55353;

}

.achievement-right {

    font-weight: 500;

}



.rank-progress-title {

    font-size: 2rem;

    font-weight: 700;

    color: #C9A227;

}

.rank-header {

    margin-bottom: 30px;
}

.rank-progress-medal-left {

    width: 170px;

    height: auto;

    flex-shrink: 0;
    margin-left: -40px

}
.network-level-row {
    margin-top: 25px;
}

.network-level-item {
    border-right: 1px solid #ececec;
}

.network-level-row .col:last-child .network-level-item {
    border-right: none;
}

.level-label {
    font-size: 0.85rem;
    color: #777;
    margin-bottom: 10px;
}

.level-count {
    font-size: 1.2rem;
    font-weight: 500;
    color: #C9A227;
}

.dashboard-alert {

    border: none;

    border-radius: 18px;

    background: linear-gradient(
        135deg,
        #FFF8E6,
        #FFF3CD
    );

}

.alert-icon {

    width: 60px;

    height: 60px;

    border-radius: 16px;

    background: rgba(255,193,7,.15);

    display: flex;

    align-items: center;

    justify-content: center;

}

.alert-icon i {

    font-size: 30px;

    color: #C9A227;

}

.kyc-badge-success {
    background: #E8F5EE;
    color: #198754;
    border: 1px solid #B7E4C7;
}

.kyc-badge-pending {
    background: #FFF8E1;
    color: #B78103;
    border: 1px solid #FFE082;
}

.kyc-badge-rejected {
    background: #FDECEC;
    color: #DC3545;
    border: 1px solid #F5C2C7;
}