#duaUserAnalyticsScreen{

padding:12px;
background:#f5f7fb;
min-height:100vh;

}

/* =========================
HEADER
========================= */

.duaHeader{

display:flex;
align-items:center;
gap:10px;
margin-bottom:15px;

}

.duaBackBtn{

width:38px;
height:38px;

border:none;

border-radius:10px;

background:#fff;

color:#111827;

font-size:18px;

font-weight:700;

cursor:pointer;

display:flex;

align-items:center;

justify-content:center;

box-shadow:
0 2px 8px rgba(0,0,0,.05);

}

.duaHeaderTitle{

font-size:18px;
font-weight:700;
color:#111827;

}

/* =========================
FILTERS
========================= */

.duaFilterBar{

display:flex;
gap:8px;
margin-bottom:15px;
overflow-x:auto;

scrollbar-width:none;

}

.duaFilterBar::-webkit-scrollbar{

display:none;

}

.duaFilterBtn{

border:none;

padding:8px 14px;

border-radius:10px;

background:#fff;

color:#111827;

font-weight:600;

cursor:pointer;

white-space:nowrap;

box-shadow:
0 2px 8px rgba(0,0,0,.05);

}

.duaFilterBtn.active{

background:#111827;

color:#fff;

}

/* =========================
CARDS GRID
========================= */

.duaCardsGrid{

display:grid;

grid-template-columns:
repeat(3,1fr);

gap:10px;

}

.duaCard{

background:#fff;

padding:12px;

border-radius:12px;

text-align:center;

box-shadow:
0 2px 8px rgba(0,0,0,.05);

min-height:72px;

display:flex;

flex-direction:column;

justify-content:center;

}

.duaCardLabel{

font-size:11px;

color:#777;

font-weight:500;

}

.duaCardValue{

font-size:20px;

font-weight:700;

margin-top:5px;

color:#111827;

}

/* =========================
TABS
========================= */

.duaTabs{

display:flex;

gap:8px;

overflow-x:auto;

margin-top:18px;

padding-bottom:4px;

scrollbar-width:none;

}

.duaTabs::-webkit-scrollbar{

display:none;

}

.duaTab{

border:none;

background:#fff;

color:#111827;

padding:10px 15px;

border-radius:999px;

white-space:nowrap;

font-weight:600;

cursor:pointer;

flex-shrink:0;

box-shadow:
0 2px 8px rgba(0,0,0,.05);

}

.duaTab.active{

background:#111827;

color:#fff;

}

/* =========================
TAB CONTENT
========================= */

.duaTabContent{

display:none;

margin-top:15px;

}

.duaTabContent.active{

display:block;

}

/* =========================
SECTION
========================= */

.duaSection{

background:#fff;

padding:14px;

border-radius:14px;

box-shadow:
0 2px 8px rgba(0,0,0,.05);

}

.duaSection h3{

margin:0 0 12px 0;

font-size:15px;

font-weight:700;

color:#111827;

}

/* =========================
ROWS
========================= */

.duaRow{

display:flex;

justify-content:space-between;

align-items:center;

padding:12px 0;

border-bottom:1px solid #eee;

}

.duaRow:last-child{

border-bottom:none;

}

.duaRow span{

color:#374151;

font-size:14px;

}

.duaRow strong{

color:#111827;

font-size:14px;

font-weight:700;

}

/* =========================
MOBILE
========================= */

@media(max-width:480px){

.duaCardsGrid{

grid-template-columns:
repeat(3,1fr);

gap:8px;

}

.duaCard{

padding:10px;

min-height:68px;

}

.duaCardLabel{

font-size:10px;

}

.duaCardValue{

font-size:18px;

}

.duaTab{

padding:8px 12px;

font-size:13px;

}

}