/* =================================================================
   lbw-LeaderBoards   (namespace-safe)
   ================================================================= */

/* ---------- base ---------- */
.lbw-widget *, .lbw-widget *::before, .lbw-widget *::after{box-sizing:border-box;}
.lbw-widget ul{margin:0;padding:0;list-style:none;}

/* ---------- header ---------- */
.lbw-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;}
.lbw-see-all{font-size:13px;font-weight:600;letter-spacing:.02em;color:#0b1c48;text-decoration:none;}

/* ---------- empty ---------- */
.lbw-empty{margin-top:15px;padding:18% 6%;min-height:260px;border-radius:15px;background:#f5f5f5;color:#8c8c8c;text-align:center;}
@media(max-width:767px){.lbw-empty{padding:22% 6%;min-height:220px;}}

/* =================================================================
   CARD LIST
   ================================================================= */
.lbw-list{display:flex;flex-wrap:wrap;gap:12px;font-size:16px;line-height:1.3;justify-content:flex-start;}

.lbw-card{
    position:relative;display:flex;align-items:center;gap:10px;
    flex:0 0 100%;max-width:100%;
    padding:12px 16px;min-height:90px;
    background:#f7f9fc;border-radius:15px;
}
.lbw-meter{position:absolute;inset:0;border-radius:15px;background:#275d78;opacity:.08;z-index:1;}

/* --- responsive columns -------------------------------------- */
.lbw-cols-2 .lbw-card{flex:0 0 calc(50% - 6px);max-width:calc(50% - 6px);}
.lbw-cols-3 .lbw-card{flex:0 0 calc(33.333% - 8px);max-width:calc(33.333% - 8px);}
.lbw-cols-4 .lbw-card{flex:0 0 calc(25% - 9px);max-width:calc(25% - 9px);}
@media(max-width:767px){
    .lbw-cols-2 .lbw-card,.lbw-cols-3 .lbw-card,.lbw-cols-4 .lbw-card{flex:0 0 100%;max-width:100%;}
}

/* ---------- avatar ------------------------- */
.lbw-avatar{
    width:70px;min-width:70px;height:70px;
    display:flex;align-items:center;justify-content:center;z-index:2;
}
.lbw-avatar[data-letters]:before{
    content:attr(data-letters);display:flex;align-items:center;justify-content:center;
    width:65px;height:65px;border-radius:50%;background:#3f4652;color:#fff;
    font:36px 'Bebas Neue',sans-serif;letter-spacing:2px;text-transform:uppercase;
}
/* tablet / mobile sizes */
@media(max-width:1024px){
    .lbw-avatar{width:50px;min-width:50px;height:50px;}
    .lbw-avatar[data-letters]:before{width:50px;height:50px;font-size:28px;}
}
@media(max-width:479px){
    .lbw-avatar{width:40px;min-width:40px;height:40px;}
    .lbw-avatar[data-letters]:before{width:40px;height:40px;font-size:24px;}
}

/* ---------- rank / name / amounts ----------------------------- */
.lbw-badge,.lbw-rank,.lbw-name,.lbw-amount,.lbw-donors{z-index:2;}
.lbw-rank{width:32px;text-align:center;font-weight:700;}
.lbw-name{flex:1 1 auto;}
.lbw-amount{font-weight:700;margin-left:auto;min-width:60px;text-align:right;}
.lbw-donors{font-size:12px;color:#666;margin-left:6px;min-width:30px;text-align:right;}

/* ---------- medal badges 1-3 ---------------------------------- */
.lbw-badge{width:28px;height:28px;flex:none;background-size:contain;background-repeat:no-repeat;background-position:center center;
top: -16px;
  position: relative;
  height: 70px;
  width: 34px;
}
.lbw-badge-1{background-image:url('../img/medal1.png');}
.lbw-badge-2{background-image:url('../img/medal2.png');}
.lbw-badge-3{background-image:url('../img/medal3.png');}

/* =================================================================
   POPUP
   ================================================================= */
.lbw-popup-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;z-index:9999;}
.lbw-popup-inner{position:relative;width:90%;max-width:900px;max-height:90vh;overflow:auto;padding:24px;background:#fff;border-radius:8px;}
.lbw-popup-close{position:absolute;top:10px;right:16px;font-size:28px;font-weight:700;cursor:pointer;line-height:1;}
.lbw-search-input{display:block;width:100%;max-width:320px;margin:12px 0 18px;padding:8px 10px;border:1px solid #ccc;border-radius:4px;font-size:15px;}
.lbw-widget ::placeholder{color:rgba(0,0,0,.5);opacity:1;}


/* =================================================================
   POPUP • two-column alignment fix  (2025-05-16)
   ================================================================= */

/* 1 ▸ make the list obey the popup padding & keep full width */
.lbw-popup-inner .lbw-list{
    margin:0 !important;
    padding:0 !important;
    width:100% !important;
}

/* 2 ▸ use CSS-grid so both columns always start at the same top edge
      – avoids the “staggered stairs” effect that flex-wrap can create */
@media(min-width:768px){          /* desktop / tablet only – keep flex on mobile */
    .lbw-popup-inner .lbw-list{
        display:grid !important;
        grid-template-columns:repeat(2,minmax(0,1fr));  /* 2 equal columns   */
        gap:12px;                                       /* same 12 px gap    */
    }
    .lbw-popup-inner .lbw-card{
        width:auto !important;      /* grid handles the width now             */
        max-width:none !important;
        flex:none !important;       /* neutralise earlier flex column rules   */
    }
}


/* =================================================================
   responsive font tweaks
   ================================================================= */
@media(max-width:1024px){
    .lbw-list,.lbw-card{font-size:14px;}
}
@media(max-width:479px){
    .lbw-list{font-size:12px;}
}
@media(max-width:360px){
    .lbw-list{font-size:10px;font-weight:500;}
}