/* UVRG additions on top of DashLite: referral hub, team tree, leaderboard, birthdays */
:root {
    --uvrg-blue: #2398c9;
    --uvrg-navy: #1f3466;
    --uvrg-gold: #f4bd0e;
}

/* Referral hero card */
.uvrg-hero {
    background: linear-gradient(135deg, var(--uvrg-navy) 0%, var(--uvrg-blue) 100%);
    color: #fff;
    border: 0;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
}
.uvrg-hero::after {
    content: "";
    position: absolute;
    right: -60px;
    top: -60px;
    width: 220px;
    height: 220px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .08);
}
.uvrg-hero .card-inner { position: relative; z-index: 1; }
.uvrg-hero h4, .uvrg-hero h5, .uvrg-hero p { color: #fff; }
.uvrg-hero .uvrg-id {
    display: inline-block;
    background: rgba(255, 255, 255, .15);
    border-radius: 20px;
    padding: 2px 12px;
    font-size: 13px;
    letter-spacing: .5px;
}
.uvrg-link-box {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.uvrg-link-box input {
    flex: 1 1 260px;
    min-width: 0;
    background: rgba(255, 255, 255, .95);
    border: 0;
    font-weight: 500;
}
.uvrg-share { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.uvrg-share a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 20px;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: transform .15s ease, opacity .15s ease;
}
.uvrg-share a:hover { transform: translateY(-1px); opacity: .9; color: #fff; }
.uvrg-share .wa { background: #25d366; }
.uvrg-share .fb { background: #1877f2; }
.uvrg-share .x  { background: #000; }
.uvrg-share .tg { background: #229ed9; }

/* Stat tiles */
.uvrg-stat {
    border-radius: 12px;
    height: 100%;
}
.uvrg-stat .uvrg-stat-icon {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    color: #fff;
    background: var(--uvrg-blue);
}
.uvrg-stat .uvrg-stat-icon.navy { background: var(--uvrg-navy); }
.uvrg-stat .uvrg-stat-icon.gold { background: var(--uvrg-gold); }
.uvrg-stat .uvrg-stat-icon.green { background: #1ee0ac; }
.uvrg-stat-value { font-size: 1.75rem; font-weight: 700; color: #364a63; line-height: 1.2; }
.uvrg-stat-label { color: #8094ae; font-size: 13px; }

/* Birthday banner */
.uvrg-birthday {
    background: linear-gradient(135deg, #ff9a8b 0%, #ff6a88 55%, #ff99ac 100%);
    color: #fff;
    border-radius: 12px;
    padding: 18px 22px;
    display: flex;
    align-items: center;
    gap: 16px;
}
.uvrg-birthday .emoji { font-size: 40px; line-height: 1; }
.uvrg-birthday h5 { color: #fff; margin: 0 0 2px; }
.uvrg-birthday p { margin: 0; opacity: .95; }

/* Team tree */
.uvrg-tree, .uvrg-tree ul { list-style: none; margin: 0; padding-left: 0; }
.uvrg-tree ul { margin-left: 22px; padding-left: 18px; border-left: 2px dashed #dbdfea; }
.uvrg-tree li { position: relative; padding: 6px 0; }
.uvrg-tree ul > li::before {
    content: "";
    position: absolute;
    left: -18px;
    top: 26px;
    width: 16px;
    border-top: 2px dashed #dbdfea;
}
.uvrg-node {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    border: 1px solid #e5e9f2;
    border-radius: 10px;
    background: #fff;
    cursor: default;
}
.uvrg-node.has-children { cursor: pointer; }
.uvrg-node.has-children:hover { border-color: var(--uvrg-blue); }
.uvrg-node .user-avatar { width: 34px; height: 34px; font-size: 13px; background: var(--uvrg-blue); }
.uvrg-node.root .user-avatar { background: var(--uvrg-navy); }
.uvrg-node .toggle { color: #8094ae; transition: transform .15s ease; }
.uvrg-tree li.collapsed > ul { display: none; }
.uvrg-tree li.collapsed > .uvrg-node .toggle { transform: rotate(-90deg); }
.uvrg-level-badge {
    font-size: 11px;
    padding: 1px 8px;
    border-radius: 10px;
    background: #ebeef2;
    color: #526484;
}

/* Leaderboard */
.uvrg-medal {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    color: #526484;
    background: #ebeef2;
}
.uvrg-medal.gold { background: #f4bd0e; color: #fff; }
.uvrg-medal.silver { background: #b7c1ce; color: #fff; }
.uvrg-medal.bronze { background: #d08b5b; color: #fff; }

.uvrg-podium .card { border-radius: 12px; text-align: center; height: 100%; }
.uvrg-podium .uvrg-podium-count { font-size: 2rem; font-weight: 700; color: var(--uvrg-navy); }
.uvrg-podium .first { border: 2px solid var(--uvrg-gold); }

/* Admin realtors table */
.uvrg-realtors td { vertical-align: middle; }
.uvrg-realtors thead th {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #8094ae;
    border-top: 0;
    white-space: nowrap;
}
.uvrg-realtors .user-card { min-width: 220px; }
.uvrg-realtors .tb-lead-sub, .uvrg-realtors .sub-text { display: block; }
.uvrg-realtors .dropdown-menu { min-width: 180px; }
.dataTables_processing { background: rgba(255, 255, 255, .9); border: 1px solid #e5e9f2; border-radius: 6px; padding: 10px; }
#realtors-table_wrapper .dataTables_filter input,
#realtors-table_wrapper .datatable-filter input { min-width: 300px; }
@media (max-width: 575px) {
    #realtors-table_wrapper .dataTables_filter input,
    #realtors-table_wrapper .datatable-filter input { min-width: 0; width: 100%; }
}

/* Wide tables scroll inside their card instead of stretching the page on phones */
#realtors-table_wrapper .datatable-wrap,
#realtors-table_wrapper { max-width: 100%; }
#realtors-table_wrapper .datatable-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.uvrg-realtors td, .uvrg-realtors th { white-space: nowrap; }
@media (max-width: 575px) {
    .uvrg-stat .card-inner { padding: 14px; gap: 10px !important; }
    .uvrg-stat .uvrg-stat-icon { width: 36px; height: 36px; font-size: 18px; }
    .uvrg-stat .uvrg-stat-value { font-size: 1.35rem; }
}
