/* Pacific iConnect website membership ring — shared across all website surfaces. */
:root {
    --member-gold: #d6a400;
    --member-silver: #8c98a8;
    --member-bronze: #bd6f2c;
    --member-lite: #1268db;
}

.logo-ring-wrap,
.logo-ring-container,
.logo-box:has(> .shiny-ring) {
    position: relative !important;
    width: 70px !important;
    height: 70px !important;
    min-width: 70px !important;
    overflow: visible !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    isolation: isolate;
}

.logo-ring-wrap > .shiny-ring,
.logo-ring-container > .shiny-ring,
.logo-box > .shiny-ring {
    position: absolute !important;
    inset: 0 !important;
    width: 70px !important;
    height: 70px !important;
    padding: 0 !important;
    border: 4px solid var(--member-color, #bd6f2c) !important;
    border-radius: 50% !important;
    background: transparent !important;
    box-shadow: 0 0 0 2px #fff, 0 3px 10px rgba(15, 23, 42, .22) !important;
    -webkit-mask: none !important;
    mask: none !important;
    animation: none !important;
    z-index: 1 !important;
    pointer-events: none;
}

.shiny-ring.ring-gold, .shiny-ring.gold { --member-color: var(--member-gold); }
.shiny-ring.ring-silver, .shiny-ring.silver { --member-color: var(--member-silver); }
.shiny-ring.ring-bronze, .shiny-ring.bronze { --member-color: var(--member-bronze); }
.shiny-ring.ring-lite, .shiny-ring.lite { --member-color: var(--member-lite); }

.logo-ring-container[style*="--member-color"] {
    border: 4px solid var(--member-color) !important;
    border-radius: 50% !important;
    box-shadow: 0 0 0 2px #fff, 0 3px 10px rgba(15, 23, 42, .22) !important;
}

.logo-ring-wrap > img,
.logo-ring-container > img,
.logo-box:has(> .shiny-ring) > img {
    position: relative !important;
    inset: auto !important;
    width: 58px !important;
    height: 58px !important;
    border: 2px solid #fff !important;
    border-radius: 50% !important;
    object-fit: contain !important;
    background: #fff !important;
    z-index: 2 !important;
}

.logo-ring-wrap > .member-badge,
.logo-ring-container > .member-badge,
.logo-ring-container > .web-list-member-badge,
.logo-box:has(> .shiny-ring) > .member-badge {
    position: absolute !important;
    left: 50% !important;
    bottom: -9px !important;
    transform: translateX(-50%) !important;
    z-index: 4 !important;
    padding: 3px 9px !important;
    border-radius: 999px !important;
    color: #fff !important;
    font-size: 9px !important;
    line-height: 1.2 !important;
    font-weight: 900 !important;
    white-space: nowrap !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .2) !important;
}

.member-badge.badge-gold, .member-badge.gold { background: var(--member-gold) !important; }
.member-badge.badge-silver, .member-badge.silver { background: var(--member-silver) !important; }
.member-badge.badge-bronze, .member-badge.bronze { background: var(--member-bronze) !important; }
.member-badge.badge-lite, .member-badge.lite { background: var(--member-lite) !important; }

@media (prefers-reduced-motion: reduce) {
    .shiny-ring { animation: none !important; }
}