/* =========================
🔥 SAFE ISOLATION (FIXED)
========================= */
.ccp-isolated{
    font-family: Arial, sans-serif;
}

/* REMOVE ONLY BAD INHERITS (NOT EVERYTHING) */
.ccp-isolated *{
    box-sizing: border-box;
}

/* =========================
MAIN WRAPPER
========================= */
.ccp-wrapper-main{
    width:100%;
    display:block;
}

/* =========================
HEADER (WISE STYLE)
========================= */
.ccp-top-bar{
    display:flex !important;
    align-items:center !important;
    gap:12px;
    background:#f3f4f6;
    padding:16px;
    border-radius:12px;
    width:100%;
}

/* FLAGS */
.ccp-flags{
    position:relative;
    width:40px;
    height:40px;
    flex-shrink:0;
}

.ccp-flags img{
    position:absolute;
    width:26px;
    height:18px;
    object-fit:cover;
    border-radius:50%;
    border:2px solid #fff;
    display:block;
}

/* FLAG STACK */
.ccp-flags img:first-child{
    top:0;
    left:0;
    z-index:2;
}

.ccp-flags img:last-child{
    bottom:0;
    right:0;
}

/* TEXT */
.ccp-text{
    display:flex;
    flex-direction:column;
    justify-content:center;
    flex-shrink:0;
}

/* MAIN TEXT */
.ccp-main-line{
    font-size:22px;
    font-weight:700;
    color:#111;
    white-space:nowrap;
}

/* CHANGE */
#ccp-change{
    font-size:14px;
    color:#16a34a;
    margin-top:3px;
}

/* =========================
CHART FIX (NO SHRINK)
========================= */
.ccp-chart-wrapper{
    width:100% !important;
    display:block !important;
    margin-top:12px;
}

.ccp-chart{
    width:100% !important;
    height:400px !important;
}

/* PREVENT FLEX ISSUES */
.ccp-chart-wrapper,
.ccp-chart{
    flex-shrink:0 !important;
}

/* =========================
BUTTONS
========================= */
.ccp-buttons{
    display:flex;
    gap:8px;
    margin-top:12px;
    flex-wrap:wrap;
}

.ccp-buttons button{
    padding:6px 12px;
    border-radius:6px;
    border:none;
    background:#e5e7eb;
    cursor:pointer;
    font-size:13px;
}

.ccp-buttons button.active{
    background:#111;
    color:#fff;
}

.ccp-bottom-section{
    display:flex;
    gap:30px;
    margin-top:20px;
    flex-wrap:wrap;
}

/* TABLE BOX */
.ccp-stats-box{
    flex:1;
    min-width:320px;
    background:#f9fafb;
    border-radius:16px;
    overflow:hidden;
}

/* HEADER */
.ccp-stats-header{
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    background:#0f3d00;
    color:#fff;
    padding:14px;
    font-weight:600;
}

/* ROW */
.ccp-stats-row{
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    padding:14px;
    border-bottom:1px solid #eee;
    font-size:14px;
}

/* CONTENT */
.ccp-stats-content{
    flex:1;
    min-width:320px;
}

.ccp-stats-content h2{
    font-size:24px;
    margin-bottom:10px;
}

.ccp-stats-content p{
    font-size:15px;
    line-height:1.6;
    color:#374151;
    margin-bottom:12px;
}