/* ==========================================================
   Nivolify Affiliate Pro Dashboard
   Production CSS v2.0
   Part 1 - Foundation
========================================================== */

/* ==========================================================
   ROOT VARIABLES
========================================================== */

:root{

    --nap-primary:#2563eb;
    --nap-primary-hover:#1d4ed8;

    --nap-success:#16a34a;
    --nap-warning:#f59e0b;
    --nap-danger:#dc2626;
    --nap-info:#0891b2;

    --nap-sidebar:#111827;
    --nap-sidebar-hover:#1f2937;
    --nap-sidebar-active:#2563eb;

    --nap-bg:#f4f7fb;
    --nap-white:#ffffff;

    --nap-border:#e5e7eb;

    --nap-text:#111827;
    --nap-text-light:#6b7280;

    --nap-radius:18px;
    --nap-radius-sm:12px;

    --nap-shadow-sm:0 2px 8px rgba(15,23,42,.05);
    --nap-shadow:0 10px 30px rgba(15,23,42,.08);
    --nap-shadow-lg:0 20px 50px rgba(15,23,42,.12);

    --nap-transition:.30s ease;

    --sidebar-width:280px;
    --topbar-height:78px;

}

/* ==========================================================
   RESET
========================================================== */

*,
*::before,
*::after{

    box-sizing:border-box;

}

html{

    scroll-behavior:smooth;

}

html,
body{

    margin:0;
    padding:0;

    width:100%;
    min-height:100%;

    background:var(--nap-bg);

    font-family:Inter,Segoe UI,Roboto,Arial,sans-serif;

    color:var(--nap-text);

    overflow-x:hidden;

}

/* ==========================================================
   SCROLLBAR
========================================================== */

::-webkit-scrollbar{

    width:8px;

}

::-webkit-scrollbar-track{

    background:#eef2f7;

}

::-webkit-scrollbar-thumb{

    background:#cbd5e1;

    border-radius:30px;

}

::-webkit-scrollbar-thumb:hover{

    background:#94a3b8;

}

/* ==========================================================
   LINKS
========================================================== */

a{

    text-decoration:none;

    transition:var(--nap-transition);

}

a:hover{

    text-decoration:none;

}

/* ==========================================================
   DASHBOARD LAYOUT
========================================================== */

#nap-dashboard{

    display:flex;

    width:100%;

    min-height:100vh;

    background:var(--nap-bg);

}

/* ==========================================================
   SIDEBAR
========================================================== */

.nap-sidebar{

    position:fixed;

    top:0;

    left:0;

    width:var(--sidebar-width);

    height:100vh;

    background:var(--nap-sidebar);

    color:#fff;

    overflow-y:auto;

    overflow-x:hidden;

    z-index:999;

    box-shadow:4px 0 30px rgba(0,0,0,.18);

    transition:var(--nap-transition);

}

/* Sidebar Scroll */

.nap-sidebar::-webkit-scrollbar{

    width:6px;

}

.nap-sidebar::-webkit-scrollbar-thumb{

    background:rgba(255,255,255,.18);

}

/* ==========================================================
   MAIN WRAPPER
========================================================== */

.nap-main-wrapper{

    margin-left:var(--sidebar-width);

    width:calc(100% - var(--sidebar-width));

    min-height:100vh;

    display:flex;

    flex-direction:column;

}

/* ==========================================================
   TOPBAR
========================================================== */

.nap-topbar{

    position:sticky;

    top:0;

    left:0;

    z-index:100;

    height:var(--topbar-height);

    background:#fff;

    border-bottom:1px solid var(--nap-border);

    box-shadow:var(--nap-shadow-sm);

    display:flex;

    align-items:center;

    padding:0 28px;

}

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

.nap-content{

    flex:1;

    padding:35px;

    background:var(--nap-bg);

}

/* ==========================================================
   TYPOGRAPHY
========================================================== */

h1,
h2,
h3,
h4,
h5,
h6{

    margin:0;

    font-weight:700;

    color:var(--nap-text);

}

p{

    margin:0;

    color:var(--nap-text-light);

    line-height:1.7;

}

small{

    color:var(--nap-text-light);

}

/* ==========================================================
   IMAGES
========================================================== */

img{

    max-width:100%;

    display:block;

}

/* ==========================================================
   UTILITIES
========================================================== */

.nap-shadow{

    box-shadow:var(--nap-shadow);

}

.nap-radius{

    border-radius:var(--nap-radius);

}

.nap-transition{

    transition:var(--nap-transition);

}

/* ==========================================================
   BOOTSTRAP FIXES
========================================================== */

.btn{

    border-radius:12px;

    transition:var(--nap-transition);

}

.card{

    border:none;

    box-shadow:none;

}

.table{

    margin-bottom:0;

}
/* ==========================================================
   PART 2
   PREMIUM SIDEBAR
========================================================== */

/* ===========================
   Logo Area
=========================== */

.nap-sidebar-logo{

    display:flex;

    align-items:center;

    justify-content:center;

    height:80px;

    padding:20px;

    border-bottom:1px solid rgba(255,255,255,.08);

}

.nap-sidebar-logo img{

    max-height:42px;

    width:auto;

}

.nap-sidebar-logo h3{

    color:#fff;

    font-size:22px;

    font-weight:700;

    letter-spacing:.5px;

}

/* ===========================
   User Card
=========================== */

.nap-sidebar-user{

    margin:22px;

    padding:20px;

    border-radius:18px;

    background:rgba(255,255,255,.06);

    backdrop-filter:blur(8px);

    text-align:center;

    transition:var(--nap-transition);

}

.nap-sidebar-user:hover{

    background:rgba(255,255,255,.10);

}

.nap-sidebar-avatar{

    width:82px;

    height:82px;

    margin:auto;

    border-radius:50%;

    overflow:hidden;

    border:4px solid rgba(255,255,255,.15);

}

.nap-sidebar-avatar img{

    width:100%;

    height:100%;

    object-fit:cover;

}

.nap-sidebar-user h5{

    margin-top:16px;

    margin-bottom:4px;

    color:#fff;

    font-size:17px;

}

.nap-sidebar-user small{

    color:rgba(255,255,255,.70);

    display:block;

}

.nap-affiliate-code{

    display:inline-block;

    margin-top:14px;

    padding:7px 14px;

    border-radius:999px;

    background:rgba(37,99,235,.20);

    color:#93c5fd;

    font-size:13px;

    font-weight:600;

}

/* ===========================
   Menu Wrapper
=========================== */

.nap-sidebar-menu{

    padding:10px 16px 24px;

}

/* ===========================
   Section Title
=========================== */

.nap-menu-title{

    margin:20px 14px 12px;

    color:rgba(255,255,255,.45);

    text-transform:uppercase;

    letter-spacing:1px;

    font-size:11px;

    font-weight:700;

}

/* ===========================
   Menu List
=========================== */

.nap-sidebar-menu ul{

    list-style:none;

    margin:0;

    padding:0;

}

.nap-sidebar-menu li{

    margin-bottom:6px;

}

/* ===========================
   Menu Link
=========================== */

.nap-sidebar-menu a{

    display:flex;

    align-items:center;

    gap:15px;

    padding:14px 16px;

    border-radius:14px;

    color:rgba(255,255,255,.78);

    font-size:15px;

    font-weight:500;

    transition:all .25s ease;

}

.nap-sidebar-menu a:hover{

    background:rgba(255,255,255,.08);

    color:#fff;

    transform:translateX(4px);

}

.nap-sidebar-menu a i{

    width:22px;

    text-align:center;

    font-size:17px;

}

/* ===========================
   Active Menu
=========================== */

.nap-sidebar-menu a.active,

.nap-sidebar-menu li.active a{

    background:var(--nap-primary);

    color:#fff;

    box-shadow:0 8px 22px rgba(37,99,235,.35);

}

.nap-sidebar-menu a.active i,

.nap-sidebar-menu li.active i{

    color:#fff;

}

/* ===========================
   Notification Badge
=========================== */

.nap-menu-badge{

    margin-left:auto;

    min-width:24px;

    height:24px;

    border-radius:30px;

    display:flex;

    justify-content:center;

    align-items:center;

    background:#ef4444;

    color:#fff;

    font-size:12px;

    font-weight:700;

}

/* ===========================
   Divider
=========================== */

.nap-sidebar-divider{

    height:1px;

    margin:18px 12px;

    background:rgba(255,255,255,.08);

}

/* ===========================
   Logout
=========================== */

.nap-sidebar-logout{

    margin:22px;

}

.nap-sidebar-logout a{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    width:100%;

    padding:14px;

    border-radius:14px;

    background:rgba(220,38,38,.15);

    color:#fca5a5;

    font-weight:600;

    transition:var(--nap-transition);

}

.nap-sidebar-logout a:hover{

    background:#dc2626;

    color:#fff;

}

/* ===========================
   Collapse Ready
=========================== */

.nap-sidebar.collapsed{

    width:86px;

}

.nap-sidebar.collapsed .nap-sidebar-user,

.nap-sidebar.collapsed .nap-menu-title,

.nap-sidebar.collapsed span,

.nap-sidebar.collapsed .nap-affiliate-code{

    display:none;

}

.nap-sidebar.collapsed .nap-sidebar-logo{

    justify-content:center;

}

.nap-sidebar.collapsed .nap-sidebar-menu a{

    justify-content:center;

    padding:15px;

}

.nap-sidebar.collapsed .nap-sidebar-menu a i{

    margin:0;

    font-size:18px;

}

.nap-main-wrapper.sidebar-collapsed{

    margin-left:86px;

    width:calc(100% - 86px);

}
/* ==========================================================
   PART 3
   TOPBAR + HERO + STATISTICS
==========================================================*/

/* ===========================
   Topbar
=========================== */

.nap-topbar-inner{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:25px;

    width:100%;

}

.nap-topbar-left{

    display:flex;

    align-items:center;

    gap:20px;

}

.nap-sidebar-toggle{

    width:48px;

    height:48px;

    border:none;

    border-radius:14px;

    background:#f4f7fb;

    cursor:pointer;

    transition:.3s;

}

.nap-sidebar-toggle:hover{

    background:#2563eb;

    color:#fff;

}

.nap-page-title h3{

    font-size:24px;

    font-weight:700;

    margin-bottom:2px;

}

.nap-page-title small{

    color:#6b7280;

}

.nap-topbar-center{

    flex:1;

    display:flex;

    justify-content:center;

}

.nap-search-box{

    width:100%;

    max-width:420px;

    display:flex;

    align-items:center;

    gap:12px;

    background:#f4f7fb;

    border-radius:14px;

    padding:12px 18px;

}

.nap-search-box input{

    width:100%;

    border:none;

    outline:none;

    background:transparent;

    font-size:15px;

}

.nap-topbar-right{

    display:flex;

    align-items:center;

    gap:15px;

}

/* ===========================
   Icon Buttons
=========================== */

.nap-icon-btn{

    position:relative;

    width:46px;

    height:46px;

    border:none;

    border-radius:14px;

    background:#f4f7fb;

    cursor:pointer;

    transition:.3s;

}

.nap-icon-btn:hover{

    background:#2563eb;

    color:#fff;

}

.nap-badge{

    position:absolute;

    top:6px;

    right:6px;

    min-width:18px;

    height:18px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#ef4444;

    color:#fff;

    font-size:11px;

    font-weight:700;

}

/* ===========================
   User Dropdown
=========================== */

.nap-user-dropdown{

    display:flex;

    align-items:center;

    gap:12px;

    border:none;

    background:#fff;

    border-radius:16px;

    padding:8px 14px;

    box-shadow:0 6px 18px rgba(0,0,0,.06);

}

.nap-user-dropdown img{

    width:46px;

    height:46px;

    border-radius:50%;

    object-fit:cover;

}

.nap-user-info{

    display:flex;

    flex-direction:column;

    text-align:left;

}

.nap-user-info strong{

    font-size:15px;

}

.nap-user-info small{

    color:#6b7280;

}

/* ===========================
   Hero Banner
=========================== */

.nap-hero-banner{

    background:linear-gradient(135deg,#2563eb,#1d4ed8);

    border-radius:22px;

    padding:45px;

    color:#fff;

    overflow:hidden;

    position:relative;

    box-shadow:0 20px 50px rgba(37,99,235,.25);

}

.nap-hero-banner::before{

    content:"";

    position:absolute;

    width:320px;

    height:320px;

    border-radius:50%;

    background:rgba(255,255,255,.08);

    right:-120px;

    top:-120px;

}

.nap-hero-content{

    position:relative;

    z-index:2;

}

.nap-hero-badge{

    display:inline-block;

    background:rgba(255,255,255,.18);

    padding:8px 18px;

    border-radius:999px;

    margin-bottom:18px;

    font-size:14px;

}

.nap-hero-content h2{

    color:#fff;

    font-size:36px;

    margin-bottom:12px;

}

.nap-hero-content p{

    color:rgba(255,255,255,.88);

    max-width:650px;

}

.nap-hero-meta{

    margin-top:25px;

    display:flex;

    gap:18px;

    flex-wrap:wrap;

}

.nap-hero-meta span{

    background:rgba(255,255,255,.12);

    padding:12px 18px;

    border-radius:12px;

}

/* ===========================
   Promotion Card
=========================== */

.nap-rank-card{

    background:#fff;

    border-radius:20px;

    padding:28px;

    box-shadow:0 12px 30px rgba(0,0,0,.08);

}

.nap-rank-card h3{

    font-size:42px;

    margin:15px 0;

}

.progress{

    height:10px;

    border-radius:20px;

    overflow:hidden;

}

/* ===========================
   Statistics
=========================== */

.nap-stat-card{

    background:#fff;

    border-radius:20px;

    padding:24px;

    display:flex;

    gap:18px;

    align-items:center;

    transition:.3s;

    box-shadow:0 12px 35px rgba(0,0,0,.05);

    height:100%;

}

.nap-stat-card:hover{

    transform:translateY(-6px);

}

.nap-stat-icon{

    width:70px;

    height:70px;

    border-radius:18px;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:28px;

    color:#fff;

}

.nap-stat-content small{

    display:block;

    color:#6b7280;

    margin-bottom:6px;

}

.nap-stat-content h3{

    font-size:30px;

    margin-bottom:4px;

}

.nap-stat-content span{

    font-size:14px;

}
/* ==========================================================
   PART 4
   PROGRESS • TABLE • NOTIFICATION • RESPONSIVE
==========================================================*/

/* ==========================================================
   Common Card
==========================================================*/

.nap-card{

    background:#fff;

    border-radius:20px;

    padding:28px;

    box-shadow:0 12px 35px rgba(15,23,42,.06);

    transition:.3s;

}

.nap-card:hover{

    transform:translateY(-3px);

}

/* ==========================================================
   Promotion Progress
==========================================================*/

.nap-card .progress{

    height:10px;

    border-radius:50px;

    background:#edf2f7;

}

.nap-card .progress-bar{

    border-radius:50px;

}

.nap-card strong{

    color:#111827;

}

/* ==========================================================
   Rank Box
==========================================================*/

.nap-rank-box{

    background:linear-gradient(135deg,#2563eb,#1d4ed8);

    border-radius:22px;

    color:#fff;

    padding:35px;

    height:100%;

    box-shadow:0 18px 45px rgba(37,99,235,.28);

}

.nap-rank-icon{

    width:90px;

    height:90px;

    margin:auto;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:rgba(255,255,255,.12);

    font-size:34px;

}

.nap-rank-box h2,
.nap-rank-box h5{

    color:#fff;

}

.nap-rank-box p{

    color:rgba(255,255,255,.85);

}

.nap-rank-box .btn{

    margin-top:18px;

    border-radius:14px;

    padding:12px 24px;

}

/* ==========================================================
   Notifications
==========================================================*/

.list-group-item{

    border:none;

    padding:14px 0;

    background:transparent;

}

.list-group-item i{

    width:28px;

}

/* ==========================================================
   Table
==========================================================*/

.table{

    margin:0;

}

.table thead th{

    border:none;

    background:#f8fafc;

    color:#64748b;

    font-size:13px;

    text-transform:uppercase;

    letter-spacing:.5px;

    padding:16px;

}

.table tbody td{

    border-top:1px solid #eef2f7;

    padding:16px;

    vertical-align:middle;

}

.table-hover tbody tr{

    transition:.25s;

}

.table-hover tbody tr:hover{

    background:#f8fbff;

}

/* ==========================================================
   Badges
==========================================================*/

.badge{

    border-radius:30px;

    padding:8px 14px;

    font-weight:600;

}

/* ==========================================================
   Buttons
==========================================================*/

.btn-primary{

    border:none;

    background:#2563eb;

}

.btn-primary:hover{

    background:#1d4ed8;

}

/* ==========================================================
   Dropdown
==========================================================*/

.dropdown-menu{

    border:none;

    border-radius:16px;

    padding:10px;

    box-shadow:0 20px 40px rgba(15,23,42,.10);

}

.dropdown-item{

    border-radius:10px;

    padding:10px 14px;

}

.dropdown-item:hover{

    background:#eff6ff;

}

/* ==========================================================
   Animation
==========================================================*/

@keyframes napFade{

    from{

        opacity:0;

        transform:translateY(12px);

    }

    to{

        opacity:1;

        transform:none;

    }

}

.nap-content>*{

    animation:napFade .35s ease;

}

/* ==========================================================
   Responsive
==========================================================*/

@media(max-width:1200px){

    .nap-search-box{

        max-width:300px;

    }

}

@media(max-width:991px){

    .nap-sidebar{

        transform:translateX(-100%);

        transition:.3s;

    }

    .nap-sidebar.show{

        transform:translateX(0);

    }

    .nap-main-wrapper{

        margin-left:0;

        width:100%;

    }

    .nap-topbar{

        padding:0 18px;

    }

    .nap-topbar-center{

        display:none;

    }

    .nap-content{

        padding:20px;

    }

}

@media(max-width:768px){

    .nap-topbar-inner{

        gap:10px;

    }

    .nap-page-title h3{

        font-size:20px;

    }

    .nap-user-info{

        display:none;

    }

    .nap-stat-card{

        padding:18px;

    }

    .nap-stat-icon{

        width:56px;

        height:56px;

        font-size:22px;

    }

    .nap-hero-banner{

        padding:30px;

    }

    .nap-hero-content h2{

        font-size:28px;

    }

    .nap-hero-meta{

        flex-direction:column;

        gap:10px;

    }

}

@media(max-width:576px){

    .nap-content{

        padding:15px;

    }

    .nap-card{

        padding:20px;

    }

    .nap-rank-box{

        padding:24px;

    }

    .nap-topbar-right{

        gap:8px;

    }

}

/* Nivolify Affiliate Pro 2.8 customer dashboard refinements */
.nap-dashboard .nap-card,.nap-dashboard-wrapper .nap-card{border-radius:16px;box-shadow:0 8px 28px rgba(15,23,42,.06);}
.nap-dashboard .nap-stat-card,.nap-dashboard-wrapper .nap-stat-card{border-radius:16px;transition:transform .2s ease,box-shadow .2s ease;}
.nap-dashboard .nap-stat-card:hover,.nap-dashboard-wrapper .nap-stat-card:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(15,23,42,.09);}
.nap-dashboard .nap-table{width:100%;border-collapse:separate;border-spacing:0;overflow:hidden;}
.nap-dashboard .nap-table th{font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;}
.nap-dashboard .progress{height:9px;border-radius:99px;overflow:hidden;}
.nap-dashboard .progress-bar{border-radius:99px;}
.nap-sidebar-logo a{display:flex;flex-direction:column;line-height:1.05;text-decoration:none;}
.nap-sidebar-logo a span{font-size:.72rem;opacity:.7;margin-top:4px;}
.nap-team-tree{margin-top:12px;}
@media(max-width:768px){.nap-hero-banner{padding:24px!important}.nap-hero-meta{display:flex;flex-direction:column;gap:8px}.nap-table{display:block;overflow-x:auto;white-space:nowrap}.nap-stat-card{min-height:120px}}

/* ==========================================================
   v45 - Notification popup + settings action
========================================================== */
.nap-icon-btn.nap-settings-trigger{
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    color:inherit;
}

.nap-notification-modal{
    position:fixed;
    inset:0;
    z-index:1400;
    display:none;
    align-items:flex-start;
    justify-content:flex-end;
    padding:92px 28px 28px;
}
.nap-notification-modal.is-open{display:flex;}
.nap-notification-backdrop{
    position:absolute;
    inset:0;
    background:rgba(15,23,42,.42);
    backdrop-filter:blur(2px);
}
.nap-notification-dialog{
    position:relative;
    z-index:1;
    width:390px;
    max-width:calc(100vw - 32px);
    max-height:min(680px,calc(100vh - 120px));
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:20px;
    box-shadow:0 24px 70px rgba(15,23,42,.24);
    display:flex;
    flex-direction:column;
    overflow:hidden;
    animation:napNotificationIn .18s ease-out;
}
@keyframes napNotificationIn{
    from{opacity:0;transform:translateY(-8px) scale(.98)}
    to{opacity:1;transform:translateY(0) scale(1)}
}
.nap-notification-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:18px 18px 15px;
    border-bottom:1px solid #eef2f7;
}
.nap-notification-header h3{
    margin:0;
    font-size:20px;
    line-height:1.25;
    color:#111827;
}
.nap-notification-header small{color:#64748b;font-size:12px;}
.nap-notification-close{
    width:38px;
    height:38px;
    flex:0 0 38px;
    border:0;
    border-radius:11px;
    background:#f3f4f6;
    color:#475569;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
}
.nap-notification-close:hover{background:#e5e7eb;color:#111827;}
.nap-notification-list{
    overflow:auto;
    padding:8px;
}
.nap-notification-item{
    display:flex;
    align-items:flex-start;
    gap:12px;
    position:relative;
    padding:13px 12px;
    margin:2px 0;
    border-radius:14px;
    color:#111827;
    text-decoration:none;
    transition:background .15s ease;
}
.nap-notification-item:hover{background:#f8fafc;}
.nap-notification-item.is-unread{background:#eff6ff;}
.nap-notification-item.is-unread:hover{background:#e8f1ff;}
.nap-notification-icon{
    width:38px;
    height:38px;
    flex:0 0 38px;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#e8eefc;
    color:#2563eb;
}
.nap-notification-body{display:flex;flex-direction:column;min-width:0;gap:3px;padding-right:12px;}
.nap-notification-body strong{font-size:14px;color:#111827;line-height:1.3;}
.nap-notification-body span{font-size:13px;color:#475569;line-height:1.45;}
.nap-notification-body small{font-size:11px;color:#94a3b8;margin-top:2px;}
.nap-notification-dot{
    position:absolute;
    top:16px;
    right:12px;
    width:8px;
    height:8px;
    border-radius:50%;
    background:#ef4444;
}
.nap-notification-empty{
    min-height:190px;
    padding:30px 20px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    color:#64748b;
    gap:7px;
}
.nap-notification-empty i{font-size:30px;color:#94a3b8;margin-bottom:4px;}
.nap-notification-empty strong{color:#334155;font-size:15px;}
.nap-notification-empty span{font-size:13px;}
.nap-notification-footer{
    border-top:1px solid #eef2f7;
    padding:12px 16px;
    background:#fff;
}
.nap-notification-footer a{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:8px;
    font-size:13px;
    font-weight:700;
    color:#2563eb;
    text-decoration:none;
}
.nap-notification-footer a:hover{text-decoration:underline;}

@media(max-width:768px){
    .nap-notification-modal{
        padding:74px 12px 12px;
        align-items:flex-start;
        justify-content:center;
    }
    .nap-notification-dialog{
        width:min(390px,100%);
        max-width:100%;
        max-height:calc(100dvh - 92px);
        border-radius:18px;
    }
}

@media(max-width:480px){
    .nap-notification-modal{padding:66px 10px 10px;}
    .nap-notification-dialog{border-radius:16px;}
    .nap-notification-header{padding:15px 14px 13px;}
    .nap-notification-list{padding:6px;}
    .nap-notification-item{padding:11px 9px;}
    .nap-notification-icon{width:34px;height:34px;flex-basis:34px;border-radius:10px;}
}
body.nap-notification-lock{overflow:hidden;}