@charset "utf-8";

/********************************************************
■ GGONGPLAY SideBar — Nariya 기능 유지 / 디자인 전용
********************************************************/
#nt_sidebar {
    top:0;
    width:280px;
    height:100%;
    position:fixed;
    z-index:500;
    background:#f5f7f8 !important;
    color:#17202b;
    box-shadow:0 0 5px 5px rgba(50,60,70,.15);
    -webkit-box-shadow:0 0 5px 5px rgba(50,60,70,.15);
    -moz-box-shadow:0 0 5px 5px rgba(50,60,70,.15);
}
#nt_sidebar * { box-sizing:border-box; }
#nt_sidebar .sidebar-content {
    height:100%;
    overflow-y:auto;
    overflow-x:hidden;
    -webkit-overflow-scrolling:touch;
}
#nt_sidebar .sidebar-content::-webkit-scrollbar { width:5px; }
#nt_sidebar .sidebar-content::-webkit-scrollbar-thumb { background:#c7cdd3; border-radius:10px; }

/* Brand */
#nt_sidebar_header {
    height:72px;
    padding:0 18px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    background:#0b111a !important;
    border-bottom:1px solid rgba(255,255,255,.08);
}
.gp-side-brand { display:flex; align-items:center; gap:10px; min-width:0; text-decoration:none !important; }
.gp-side-brand img { width:38px; height:38px; object-fit:contain; flex:0 0 auto; }
.gp-side-brand-copy { display:flex; flex-direction:column; line-height:1; }
.gp-side-brand-copy strong { color:#fff; font-size:15px; letter-spacing:-.2px; font-weight:800; }
.gp-side-brand-copy small { margin-top:6px; color:#b7ff16; font-size:8px; letter-spacing:1.6px; font-weight:800; }
.gp-side-close { width:34px; height:34px; border-radius:9px; display:flex; align-items:center; justify-content:center; color:#fff !important; background:rgba(255,255,255,.06); text-decoration:none !important; }
.gp-side-close:hover { color:#0b111a !important; background:#b7ff16; }

/* 4 primary actions */
#nt_sidebar .sidebar-icon {
    margin:0 !important;
    padding:8px 10px 10px;
    background:#0b111a !important;
    border:0 !important;
}
#nt_sidebar .sidebar-icon > li {
    padding:0 !important;
    border:0 !important;
}
#nt_sidebar .sidebar-icon > li > a {
    min-height:67px;
    margin:0 3px;
    border-radius:10px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    color:#d5dce5;
    background:#141c27;
    text-decoration:none !important;
    transition:.18s ease;
}
#nt_sidebar .sidebar-icon > li > a:hover { color:#0b111a; background:#b7ff16; transform:translateY(-1px); }
#nt_sidebar .sidebar-icon i { font-size:20px; line-height:22px; margin-bottom:7px; }
#nt_sidebar .sidebar-icon span { font-size:12px; font-weight:600; }
#sidebar_more_icon .sidebar-icon { padding-top:0; }

/* Account strip */
.gp-side-account { padding:10px 12px 2px; background:#f5f7f8; }
.gp-side-account > .btn-group { gap:7px; display:flex; }
.gp-side-account > .btn-group .btn {
    border:1px solid #e3e7eb !important;
    border-radius:9px !important;
    padding:9px 8px;
    color:#27313d !important;
    background:#fff !important;
    box-shadow:none !important;
    font-size:12px;
    font-weight:700;
}
.gp-side-account > .btn-group .btn:hover { color:#0b111a !important; border-color:#b7ff16 !important; background:#f5ffe0 !important; }

/* Common sections */
#nt_sidebar_menu { padding:16px 12px 0; }
.gp-side-section-title { padding:0 4px 10px; display:flex; align-items:flex-end; justify-content:space-between; border:0 !important; }
.gp-side-section-title span { color:#83b800; font-size:10px; font-weight:800; letter-spacing:1.4px; }
.gp-side-section-title strong { color:#111923; font-size:14px; font-weight:800; }
.sidebar-list h5 { border:0; margin:0; }
.sidebar-list ul.me-ul { overflow:hidden; margin:0; border:1px solid #e4e8ec !important; border-radius:12px; background:#fff; }
.sidebar-list ul.off { display:none; }
.sidebar-list li { position:relative; }
.sidebar-list li a { display:block; padding:12px 14px; border-bottom:1px solid #edf0f2; color:#27313d; overflow:hidden; text-decoration:none !important; }
.sidebar-list li:last-child > a { border-bottom:0; }
.sidebar-list li a:hover { color:#0b111a; background:#f8fafb; }
.sidebar-list li .me-a { padding-right:42px; }
.sidebar-list .tree-toggle { position:absolute; z-index:1; top:0; right:0; width:42px; padding:13px 0; text-align:center; cursor:pointer; color:#87919c; }
.sidebar-list .me-ul1 { background:#fafbfc; }
.sidebar-list .me-ul2 { background:#f6f8f9; }
.sidebar-list .me-li1 .me-a1, .sidebar-list .me-li2 .me-a2 { padding-left:26px; }
.sidebar-list .me-li.active > .me-a, .sidebar-list .me-li1.active > .me-a1, .sidebar-list .me-li2.active > .me-a2 { color:#0b111a; font-weight:800; box-shadow:inset 3px 0 #b7ff16; }
.sidebar-list .me-line1 .me-a1, .sidebar-list .me-line2 .me-a2 { background:#f2f4f6; font-weight:700; }
.gp-side-empty { min-height:74px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px; color:#9aa2ab; font-size:12px; }
.gp-side-empty i { color:#c1c7cd; font-size:19px; }

/* Stats */
.gp-side-stats { padding:20px 12px 34px; }
.gp-side-section-title--stats { padding-left:4px; padding-right:4px; }
.gp-stat-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.gp-stat-card {
    min-height:76px;
    padding:13px;
    border:1px solid #e4e8ec;
    border-radius:12px;
    background:#fff;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    color:#25303a !important;
    text-decoration:none !important;
}
.gp-stat-card:hover { border-color:#cce88b; box-shadow:0 5px 16px rgba(11,17,26,.05); }
.gp-stat-card span { color:#7c8792; font-size:11px; }
.gp-stat-card strong { color:#111923; font-size:20px; line-height:1; font-weight:800; }
.gp-stat-card strong em { margin-left:3px; color:#8c959e; font-style:normal; font-size:10px; font-weight:500; }
.gp-stat-sub { margin-top:10px; padding:11px 13px; border-radius:10px; background:#eef1f3; display:flex; flex-wrap:wrap; gap:7px 14px; color:#77828c; font-size:10px; }
.gp-stat-sub span { white-space:nowrap; }
.gp-stat-sub b { margin-left:3px; color:#27313d; font-weight:700; }

/* User detail panel */
#sidebar-user .p-3 { margin:10px 12px 0; padding:14px !important; border:1px solid #e4e8ec; border-radius:12px; background:#fff; }
#sidebar-user .sidebar-list { padding:10px 12px 24px !important; }
#sidebar-user .sidebar-list .me-ul { border-radius:12px; }

/* positioning / mask — Nariya original behavior preserved exactly */
@media (min-width:768px) {
    #nt_sidebar { right:-300px; }
}
@media (max-width:767px) {
    #nt_sidebar { left:-300px; }
}
#nt_sidebar_mask {
    display:none;
    position:fixed;
    z-index:499;
    background:rgba(0,0,0,.75);
    left:0;
    top:0;
    width:100%;
    height:100%;
}

/* notification / move buttons — original behavior */
#nt_sidebar_noti { position:fixed; z-index:100; }
@media (min-width:768px) { #nt_sidebar_noti { top:40%; right:0; border-top-left-radius:50rem !important; border-bottom-left-radius:50rem !important; } }
@media (max-width:767px) { #nt_sidebar_noti { left:0; bottom:25px; border-top-right-radius:50rem !important; border-bottom-right-radius:50rem !important; } }
#nt_sidebar_move { display:none; position:fixed; width:40px; bottom:20px; right:25px; z-index:2; }
#nt_sidebar_move span { display:block; color:#fff; background:rgba(0,0,0,.5); margin:5px 0; text-align:center; border-radius:50%; width:42px; height:42px; line-height:42px !important; font-size:19px; }
#nt_sidebar_move .sidebar-move-bottom { display:none; }


/* V3 FIX: visual-only compacting for original 280px Nariya drawer */
#nt_sidebar_header{
    height:64px;
    padding:0 13px;
}
.gp-side-brand{gap:8px;}
.gp-side-brand img{width:32px;height:32px;}
.gp-side-brand-copy strong{font-size:13px;}
.gp-side-brand-copy small{font-size:7px;letter-spacing:1.25px;margin-top:5px;}
.gp-side-close{width:31px;height:31px;border-radius:8px;}

#nt_sidebar .sidebar-icon{
    padding:7px 5px 9px;
}
#nt_sidebar .sidebar-icon > li > a{
    min-height:61px;
    margin:0 2px;
    border-radius:8px;
}
#nt_sidebar .sidebar-icon i{
    font-size:18px;
    margin-bottom:6px;
}
#nt_sidebar .sidebar-icon span{
    font-size:11px;
}

.gp-side-account{
    padding:9px 9px 2px;
}
.gp-side-account > .btn-group{
    gap:5px;
}
.gp-side-account > .btn-group .btn{
    padding:8px 5px;
    font-size:11px;
    border-radius:8px !important;
}

#nt_sidebar_menu{
    padding:14px 9px 0;
}
.gp-side-section-title{
    padding:0 3px 8px;
}
.gp-side-section-title span{
    font-size:9px;
}
.gp-side-section-title strong{
    font-size:13px;
}
.sidebar-list ul.me-ul{
    border-radius:10px;
}
.sidebar-list li a{
    padding:10px 12px;
    font-size:12px;
}
.sidebar-list li .me-a{
    padding-right:36px;
}
.sidebar-list .tree-toggle{
    width:36px;
    padding:11px 0;
}

.gp-side-stats{
    padding:17px 9px 28px;
}
.gp-stat-grid{
    gap:6px;
}
.gp-stat-card{
    min-height:68px;
    padding:10px;
    border-radius:10px;
}
.gp-stat-card span{
    font-size:10px;
}
.gp-stat-card strong{
    font-size:18px;
}
.gp-stat-sub{
    margin-top:8px;
    padding:9px 10px;
    gap:5px 9px;
    font-size:9px;
}

#sidebar-user .p-3{
    margin:9px 9px 0;
}
#sidebar-user .sidebar-list{
    padding:9px 9px 20px !important;
}

/* ===== GGONGPLAY SIDEBAR ROW GAP FIX START ===== */
/* 더보기 확장 메뉴의 2열 이하가 서로 붙지 않도록 모든 아이콘 행 간격 통일 */
#nt_sidebar .sidebar-icon {
    row-gap:6px !important;
}

/* 첫 4개 메뉴와 펼쳐진 메뉴 사이도 같은 호흡으로 유지 */
#sidebar_more_icon .sidebar-icon {
    padding-top:6px !important;
}

/* 모바일에서도 동일한 간격 유지 */
@media all and (max-width:767px) {
    #nt_sidebar .sidebar-icon {
        row-gap:6px !important;
    }

    #sidebar_more_icon .sidebar-icon {
        padding-top:6px !important;
    }
}
/* ===== GGONGPLAY SIDEBAR ROW GAP FIX END ===== */