/* JN Media PRO unified visual layer - presentation only */
:root{--jn-bg:#06070d;--jn-panel:#101221;--jn-panel2:#14172a;--jn-line:rgba(255,255,255,.09);--jn-muted:#989aaa;--jn-pink:#ff0aa8;--jn-purple:#8b32ff}
html,body{background:radial-gradient(circle at 52% 0,rgba(70,28,130,.12),transparent 38%),var(--jn-bg)!important;color:#fff}
/* PRO menu: compact premium icon navigation, one row on desktop */
.pro-adminbar{position:relative!important;top:auto!important;background:#080a12!important;border:0!important;box-shadow:none!important;padding:22px 0 12px!important;overflow:visible!important}
.pro-adminbar-inner{width:min(1460px,calc(100% - 48px))!important;margin:auto!important;padding:0!important;display:grid!important;grid-template-columns:repeat(9,minmax(0,1fr))!important;gap:0!important;overflow:visible!important;border:1px solid rgba(152,104,255,.22)!important;border-radius:18px!important;background:linear-gradient(180deg,rgba(18,20,34,.98),rgba(10,12,22,.98))!important;box-shadow:0 20px 60px rgba(0,0,0,.28)!important}
.pro-adminbar a{min-width:0!important;min-height:112px!important;padding:19px 8px 15px!important;border:0!important;border-right:1px solid rgba(255,255,255,.075)!important;border-radius:0!important;background:transparent!important;color:#f7f7fb!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:10px!important;text-align:center!important;font-size:13px!important;font-weight:800!important;letter-spacing:0!important;text-shadow:none!important;box-shadow:none!important;transform:none!important;position:relative!important;white-space:normal!important}
.pro-adminbar a:last-child{border-right:0!important}.pro-adminbar a:before{display:block;font-size:26px;line-height:1;color:#d9dbe8;font-weight:400}.pro-adminbar a:nth-child(1):before{content:'▦'}.pro-adminbar a:nth-child(2):before{content:'▱'}.pro-adminbar a:nth-child(3):before{content:'◉'}.pro-adminbar a:nth-child(4):before{content:'▶'}.pro-adminbar a:nth-child(5):before{content:'⌘'}.pro-adminbar a:nth-child(6):before{content:'□'}.pro-adminbar a:nth-child(7):before{content:'↗'}.pro-adminbar a:nth-child(8):before{content:'⚙'}.pro-adminbar a:nth-child(9):before{content:'▤'}
.pro-adminbar a:after{content:'';position:absolute;left:34%;right:34%;bottom:12px;height:3px;border-radius:5px;background:#34384e;transition:.2s}.pro-adminbar a:hover{background:rgba(255,255,255,.025)!important;color:#fff!important}.pro-adminbar a:hover:after{background:linear-gradient(90deg,var(--jn-pink),var(--jn-purple))}.pro-adminbar a.jn-active{background:linear-gradient(145deg,rgba(255,10,168,.12),rgba(139,50,255,.18))!important;box-shadow:inset 0 0 0 1px rgba(255,10,168,.75)!important}.pro-adminbar a.jn-active:before{color:#fff}.pro-adminbar a.jn-active:after{background:linear-gradient(90deg,var(--jn-pink),var(--jn-purple));box-shadow:0 0 14px rgba(255,10,168,.45)}
/* Dashboard: wider and calmer like approved visual */
body>.wrap,body>main.wrap,.wrap{width:min(1460px,calc(100% - 48px))!important;max-width:none!important;margin-left:auto!important;margin-right:auto!important}.wrap>.top{padding:34px 0 26px!important;border-bottom:1px solid var(--jn-line)!important;margin-bottom:26px!important}.wrap h1{font-size:clamp(34px,3vw,54px)!important;line-height:1.03!important;letter-spacing:-1.8px!important}.wrap h2{margin-top:34px!important}.grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:16px!important}.card,.panel{border:1px solid var(--jn-line)!important;background:linear-gradient(155deg,rgba(20,22,39,.96),rgba(10,11,20,.98))!important;box-shadow:0 18px 48px rgba(0,0,0,.18)!important;border-radius:14px!important}.card{padding:22px!important}.card .n{font-size:34px!important}.modules{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:16px!important}.module{min-height:112px!important;padding:22px!important;transition:.2s!important}.module:hover{transform:translateY(-2px)!important;border-color:rgba(255,10,168,.42)!important;box-shadow:0 20px 55px rgba(64,16,105,.20)!important}.module strong{font-size:15px!important;margin-bottom:10px!important}.muted{color:var(--jn-muted)!important}
/* Hero stays the same real site video, only tighten transition into PRO nav */
.pro-video-hero{margin-bottom:0!important}.pro-video-hero+.pro-adminbar{border-top:1px solid rgba(255,255,255,.06)!important}
@media(max-width:1180px){.pro-adminbar-inner{grid-template-columns:repeat(5,1fr)!important}.pro-adminbar a:nth-child(5){border-right:0!important}.pro-adminbar a{border-bottom:1px solid rgba(255,255,255,.06)!important}.grid{grid-template-columns:repeat(2,1fr)!important}}
@media(max-width:760px){.pro-adminbar{padding-top:12px!important}.pro-adminbar-inner{width:min(100% - 24px,1460px)!important;grid-template-columns:repeat(3,1fr)!important}.pro-adminbar a{min-height:90px!important;font-size:11px!important}.pro-adminbar a:before{font-size:21px}.modules,.grid{grid-template-columns:1fr!important}body>.wrap,body>main.wrap,.wrap{width:min(100% - 28px,1460px)!important}.wrap h1{font-size:36px!important}}

/* JN Media PRO app shell - approved sidebar reference */
body.jn-app{padding:72px 0 0 238px!important;background:radial-gradient(circle at 70% 0,rgba(40,25,85,.12),transparent 35%),#070a10!important;min-height:100vh!important}
body.jn-app .pro-site-header,body.jn-app .pro-video-hero{display:none!important}
body.jn-app .site-header,body.jn-app .jn-site-header,body.jn-app .jn-basis-hero,body.jn-app .jn-hero,body.jn-app .jnpro-restore-nav,body.jn-app .jn-site-footer,body.jn-app .jn-footer{display:none!important}
body.jn-app .admin-site-shell{width:100%!important;max-width:none!important;margin:0!important;padding:0 0 70px!important}
body.jn-app .admin-site-shell>.wrap{width:min(1500px,calc(100% - 48px))!important;max-width:none!important;margin:0 auto!important;padding:26px 0 0!important}
body.jn-app .pro-adminbar{position:fixed!important;inset:0 auto 0 0!important;width:238px!important;height:100vh!important;padding:0!important;border:0!important;border-right:1px solid rgba(148,163,190,.16)!important;border-radius:0!important;background:linear-gradient(180deg,#0b1018,#070a10)!important;box-shadow:none!important;overflow:hidden!important;z-index:100!important}
body.jn-app .pro-adminbar-inner{width:100%!important;height:100%!important;margin:0!important;padding:0 10px!important;display:flex!important;flex-direction:column!important;gap:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;overflow-y:auto!important;scrollbar-width:none!important;-ms-overflow-style:none!important}body.jn-app .pro-adminbar-inner::-webkit-scrollbar{display:none!important;width:0!important}
body.jn-app .app-brand{height:68px!important;min-height:68px!important;padding:10px 12px!important;display:flex!important;align-items:center!important;gap:8px!important;border:0!important;background:transparent!important;text-decoration:none!important}body.jn-app .app-brand img{width:158px!important;max-width:calc(100% - 34px)!important;height:auto!important}body.jn-app .app-brand b{color:#ff0aa8;font-size:8px;align-self:flex-end;margin-bottom:8px}
body.jn-app .app-brand:before,body.jn-app .app-brand:after,body.jn-app .app-sidebar-foot>a:before,body.jn-app .app-sidebar-foot>a:after{content:none!important;display:none!important}
body.jn-app .app-menu{display:grid!important;gap:1px!important;padding-top:0!important}
body.jn-app .app-menu a{min-height:31px!important;padding:0 11px!important;border:0!important;border-radius:7px!important;display:grid!important;grid-template-columns:23px 1fr!important;align-items:center!important;gap:7px!important;background:transparent!important;color:#aeb7c8!important;text-decoration:none!important;font-size:10.5px!important;font-weight:600!important;text-align:left!important;box-shadow:none!important}
body.jn-app .app-menu a:before,body.jn-app .app-menu a:after{display:none!important}body.jn-app .app-menu a i{font-style:normal;color:#8d9aad;font-size:14px;text-align:center}body.jn-app .app-menu a:hover,body.jn-app .app-menu a.jn-active{color:#fff!important;background:linear-gradient(90deg,rgba(255,10,168,.20),rgba(125,50,255,.18))!important;box-shadow:inset 0 0 0 1px rgba(255,10,168,.22)!important}body.jn-app .app-menu a.jn-active i{color:#ff3fbd}
body.jn-app .app-sidebar-foot{margin-top:auto;padding:10px 12px 9px;border-top:1px solid rgba(255,255,255,.07)}body.jn-app .app-motto{color:#778195;font-size:8px;letter-spacing:3px;line-height:1.5;margin-bottom:8px}body.jn-app .app-user{padding:7px 0;border-top:1px solid rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.06)}body.jn-app .app-user b,body.jn-app .app-user span{display:block}body.jn-app .app-user b{font-size:10px}body.jn-app .app-user span{font-size:8px;color:#8e97a8;margin-top:2px}body.jn-app .app-sidebar-foot>a{display:flex!important;align-items:center!important;gap:8px!important;color:#aeb7c8!important;text-decoration:none!important;font-size:10px!important;padding:7px 0 0!important;min-height:0!important;background:transparent!important;border:0!important}
body.jn-app .app-topbar{position:fixed;left:238px;right:0;top:0;height:72px;z-index:90;display:flex;align-items:center;gap:18px;padding:0 28px;background:rgba(7,10,16,.94);border-bottom:1px solid rgba(148,163,190,.14);backdrop-filter:blur(16px)}
.app-search{width:min(510px,48vw);height:38px;padding:0 12px;display:flex;align-items:center;gap:10px;border:1px solid rgba(148,163,190,.17);border-radius:8px;background:#0c1119;color:#788395;font-size:11px}.app-search kbd{margin-left:auto;border:1px solid rgba(255,255,255,.12);border-radius:5px;padding:3px 6px;color:#9da7b7;background:#0a0e15}.app-new{margin-left:auto;display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:8px;background:linear-gradient(90deg,#ff0aa8,#8b31ff);color:#fff;text-decoration:none;font-size:11px;font-weight:800}.app-top-user{min-width:115px}.app-top-user b,.app-top-user span{display:block}.app-top-user b{font-size:11px}.app-top-user span{font-size:9px;color:#8f98a8;margin-top:4px}
body.jn-app>.wrap,body.jn-app>main.wrap,body.jn-app .dashboard-shell{width:min(1500px,calc(100% - 48px))!important;margin:0 auto 70px!important;padding-top:26px!important}body.jn-app .pro-footer{display:none!important}
body.jn-app .card,body.jn-app .panel{background:linear-gradient(145deg,#111722,#0b1018)!important;border-color:rgba(148,163,190,.14)!important;border-radius:10px!important;box-shadow:none!important}body.jn-app input,body.jn-app select,body.jn-app textarea{background:#0a0f17!important;border-color:rgba(148,163,190,.18)!important}
.invoice-line{padding:14px;margin:12px 0;border:1px solid rgba(148,163,190,.14);border-radius:9px;background:#0b111a}.invoice-preview{margin:22px 0}.invoice-preview-paper{padding:20px;border-radius:10px;background:#f7f7fa;color:#171721}.invoice-preview-head{display:flex;justify-content:space-between;align-items:center;padding-bottom:15px;border-bottom:4px solid #ef1b8d}.invoice-preview-head b{font-size:24px}.invoice-preview-head b span{color:#ef1b8d}.invoice-preview-paper table{width:100%;border-collapse:collapse;margin-top:18px}.invoice-preview-paper th,.invoice-preview-paper td{padding:8px;text-align:left;border-bottom:1px solid #d9d9e1;font-size:12px}.invoice-preview-paper th:last-child,.invoice-preview-paper td:last-child{text-align:right}.invoice-preview-totals{width:min(330px,100%);margin:14px 0 0 auto}.invoice-preview-totals div{display:flex;justify-content:space-between;padding:5px 0}.invoice-preview-totals .grand{margin-top:5px;padding-top:9px;border-top:2px solid #ef1b8d;font-size:17px}
.invoice-recurring-box{padding:15px;margin:18px 0;border:1px solid rgba(255,10,168,.24);border-radius:10px;background:rgba(255,10,168,.04)}.invoice-mode-options{display:flex;gap:18px;flex-wrap:wrap}.invoice-mode-options label{display:flex;align-items:center;gap:7px}.invoice-mode-options input{width:auto!important}

/* Definitieve app-zijbalk: op alle beheerschermen compact en zonder zichtbare scrollbar. */
html body.jn-app .pro-adminbar-inner{overflow-y:auto!important;scrollbar-width:none!important;-ms-overflow-style:none!important}html body.jn-app .pro-adminbar-inner::-webkit-scrollbar{width:0!important;height:0!important;display:none!important}html body.jn-app .app-menu{gap:0!important}html body.jn-app .app-menu a{min-height:30px!important;height:30px!important;padding-top:0!important;padding-bottom:0!important}html body.jn-app .app-brand{height:64px!important;min-height:64px!important}html body.jn-app .app-sidebar-foot{padding-top:7px!important;padding-bottom:7px!important}
@media(max-width:900px){body.jn-app{padding-left:74px!important}.app-topbar{left:74px!important}.app-search{display:none!important}body.jn-app .pro-adminbar{width:74px!important}body.jn-app .app-brand img,body.jn-app .app-brand b,body.jn-app .app-menu a span,body.jn-app .app-sidebar-foot{display:none!important}body.jn-app .app-brand{height:70px!important;min-height:70px!important}body.jn-app .app-menu a{grid-template-columns:1fr!important;padding:0!important}body.jn-app .app-menu a i{text-align:center!important}}
@media(max-width:600px){body.jn-app{padding:62px 0 70px!important}.app-topbar{left:0!important;height:62px!important;padding:0 14px!important}.app-top-user{display:none!important}body.jn-app .pro-adminbar{top:auto!important;right:0!important;width:auto!important;height:66px!important;border-right:0!important;border-top:1px solid rgba(148,163,190,.17)!important}body.jn-app .pro-adminbar-inner{padding:6px!important}body.jn-app .app-brand,body.jn-app .app-sidebar-foot{display:none!important}body.jn-app .app-menu{display:flex!important;overflow-x:auto!important}body.jn-app .app-menu a{min-width:58px!important;height:52px!important}body.jn-app>.wrap,body.jn-app>main.wrap,body.jn-app .dashboard-shell{width:min(100% - 24px,1500px)!important}.app-new{margin-left:0!important}}