/*
 * BreederHits Identity Card
 * Rank frame progression:
 * Initiate  = Bronze
 * Vanguard  = Silver
 * Rogue     = Gold
 * Elite     = Gold + Cyan Glow
 * Overlord  = Premium Gold + Purple Glow
 */

#bhIdentityCard {
    position: absolute !important;
    right: 10px !important;
    top: 320px !important;
    width: 335px !important;
    z-index: 9998 !important;
    font-family: Arial, Helvetica, sans-serif !important;
}

/* Scoped to the existing right rail; no dashboard or partner-panel changes. */
#bhIdentityCard .bh-member-square-panel {
    box-sizing: border-box;
    width: 180px;
    margin: 22px auto 24px;
    padding: 16px 12px 12px;
    border: 1px solid rgba(110, 180, 175, .45);
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(16,28,41,.96), rgba(7,17,27,.96));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
    color: #e6edf5;
    text-align: center;
}
#bhIdentityCard .bh-member-square-panel h2 {
    margin: 0 0 12px;
    padding: 0;
    color: #f0cf64;
    font: 800 15px/1.4 Arial, Helvetica, sans-serif;
    letter-spacing: .7px;
    text-align: center;
}
#bhIdentityCard .bh-member-square-panel table {
    width: 125px;
    margin: 0 auto;
    border: 0;
    border-collapse: collapse;
    background: transparent;
}
#bhIdentityCard .bh-member-square-panel td {
    padding: 0 0 10px;
    border: 0;
    background: transparent;
    text-align: center;
}
#bhIdentityCard .bh-member-square-panel tr:last-child td { padding-bottom: 0; }
#bhIdentityCard .bh-member-square-panel a {
    display: block;
    width: 125px;
    margin: 0 auto;
    padding: 0;
    line-height: 0;
}
#bhIdentityCard .bh-member-square-panel img {
    display: block;
    width: 125px;
    height: 125px;
    max-width: none;
    margin: 0;
    padding: 0;
    border: 0;
}

.bh-id-card {
    position: relative;
    display: grid;
    grid-template-columns: 34% 1px 66%;
    min-height: 208px;
    overflow: hidden;

    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,0.98) 0%,
            rgba(224,229,235,0.97) 34%,
            rgba(250,251,252,0.99) 63%,
            rgba(206,214,223,0.97) 100%
        );

    border-radius: 15px;
    color: #18202a;

    box-shadow:
        0 14px 28px rgba(0,0,0,0.42),
        0 3px 8px rgba(0,0,0,0.28),
        inset 0 1px 0 rgba(255,255,255,0.95),
        inset 0 -1px 0 rgba(0,0,0,0.18);
}

/* INITIATE — BRONZE */
.bh-id-rank-initiate {
    border: 4px solid #a96f3c;
    box-shadow:
        0 0 0 1px #5f351d,
        0 0 12px rgba(191,123,63,0.34),
        0 14px 28px rgba(0,0,0,0.42),
        inset 0 0 0 1px rgba(255,220,185,0.58);
}

/* VANGUARD — SILVER */
.bh-id-rank-vanguard {
    border: 4px solid #cbd3dc;
    box-shadow:
        0 0 0 1px #6f7a86,
        0 0 13px rgba(215,230,245,0.46),
        0 14px 28px rgba(0,0,0,0.42),
        inset 0 0 0 1px rgba(255,255,255,0.72);
}

/* ROGUE — GOLD */
.bh-id-rank-rogue {
    border: 4px solid #d9a928;
    box-shadow:
        0 0 0 1px #806015,
        0 0 15px rgba(247,181,0,0.44),
        0 14px 28px rgba(0,0,0,0.42),
        inset 0 0 0 1px rgba(255,238,170,0.75);
}

/* ELITE — GOLD + CYAN */
.bh-id-rank-elite {
    border: 4px solid #e1b638;
    box-shadow:
        0 0 0 1px #806015,
        0 0 10px rgba(247,181,0,0.50),
        0 0 23px rgba(0,229,255,0.52),
        0 14px 28px rgba(0,0,0,0.45),
        inset 0 0 0 1px rgba(255,240,177,0.78);
}

/* OVERLORD — PREMIUM GOLD + PURPLE */
.bh-id-rank-overlord {
    border: 4px solid #f0c84b;
    box-shadow:
        0 0 0 1px #90680b,
        0 0 12px rgba(255,204,50,0.68),
        0 0 28px rgba(170,70,255,0.68),
        0 0 42px rgba(126,33,214,0.32),
        0 16px 31px rgba(0,0,0,0.48),
        inset 0 0 0 1px rgba(255,247,198,0.90);
}

/* Very light security texture */
.bh-id-card::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.10;
    background:
        repeating-linear-gradient(
            115deg,
            transparent 0,
            transparent 8px,
            rgba(25,47,67,0.22) 9px,
            transparent 10px
        );
}

.bh-id-left,
.bh-id-right {
    position: relative;
    z-index: 1;
}

.bh-id-left {
    padding: 14px 10px 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.bh-id-faction-frame {
    width: 88px;
    height: 100px;
    padding: 4px;
    border-radius: 10px;

    background:
        linear-gradient(145deg, #f8fbff, #8c98a5 50%, #ffffff);

    box-shadow:
        0 4px 10px rgba(0,0,0,0.28),
        inset 0 0 0 1px rgba(255,255,255,0.8);

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

.bh-id-faction-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 7px;
}

.bh-id-faction-placeholder {
    width: 100%;
    height: 100%;
    border-radius: 7px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background:
        radial-gradient(circle at 50% 38%, rgba(0,229,255,0.22), transparent 45%),
        linear-gradient(145deg, #172132, #080d15);
    border: 1px solid rgba(0,229,255,0.35);
    color: #8feaf3;
    letter-spacing: 1.1px;
    text-align: center;
}

.bh-id-faction-placeholder span {
    font-size: 8px;
    font-weight: 700;
}

.bh-id-faction-placeholder strong {
    margin-top: 2px;
    font-size: 13px;
    font-weight: 900;
}

.bh-id-user {
    margin-top: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.2px;
    color: #101820;
}

.bh-id-user span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bh-id-rank-icon {
    width: 23px;
    height: 23px;
    flex: 0 0 23px;
    object-fit: contain;
    margin-right: 5px;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,0.35));
}

.bh-id-faction-name {
    margin-top: 5px;
    max-width: 100%;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 0.8px;
    color: #53606c;
    text-align: center;
    text-transform: uppercase;
}

.bh-id-divider {
    position: relative;
    z-index: 1;
    margin: 13px 0;
    background:
        linear-gradient(
            180deg,
            transparent 0%,
            rgba(107,120,133,0.60) 15%,
            rgba(107,120,133,0.60) 85%,
            transparent 100%
        );
}

.bh-id-right {
    padding: 13px 14px 12px 13px;
}

.bh-id-title {
    text-align: center;
    font-size: 16px;
    font-weight: 900;
    letter-spacing: 1.35px;
    color: #232b33;
    text-transform: uppercase;
}

.bh-id-subtitle {
    margin-top: 2px;
    margin-bottom: 8px;
    text-align: center;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: 1.15px;
    color: #72808d;
}

.bh-id-stat-row {
    height: 29px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid rgba(87,101,115,0.24);
}

.bh-id-stat-row:last-of-type {
    border-bottom: 1px solid rgba(87,101,115,0.24);
}

.bh-id-stat-row span {
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.45px;
    color: #53606c;
}

.bh-id-stat-row strong {
    font-size: 11px;
    font-weight: 900;
    color: #18202a;
}

.bh-id-card-code {
    margin-top: 7px;
    text-align: right;
    font-size: 6px;
    font-weight: 800;
    letter-spacing: 1.05px;
    color: #8a949e;
}
