:root{--primary:#4f46e5;--secondary:#dc2626;--soft:#eef2ff;--bg:#eef3f8;--card:#fff;--text:#0f172a;--muted:#64748b;--border:#e2e8f0;--shadow:0 24px 60px rgba(15,23,42,.12)}
*{box-sizing:border-box}html,body{min-height:100%;margin:0;font-family:Inter,"Hind Siliguri",system-ui,sans-serif;background:var(--bg);color:var(--text)}a{text-decoration:none;color:inherit}button{font:inherit;border:0;background:transparent;cursor:pointer}.jli-shell{min-height:100vh;background:radial-gradient(circle at top left,rgba(79,70,229,.12),transparent 32rem),radial-gradient(circle at top right,rgba(220,38,38,.1),transparent 30rem),var(--bg);--primary:#4f46e5;--secondary:#dc2626;--soft:#eef2ff;--bg:#eef3f8}.jli-shell.dark{--bg:#0f172a;--card:#111c2f;--text:#f8fafc;--muted:#cbd5e1;--border:#334155;background:radial-gradient(circle at top left,rgba(79,70,229,.22),transparent 32rem),#0f172a}.theme-sakura{--primary:#db2777;--secondary:#f97316;--soft:#fdf2f8;--bg:#fff7fb}.theme-ocean{--primary:#0284c7;--secondary:#0d9488;--soft:#e0f2fe;--bg:#eefafe}.theme-emerald{--primary:#059669;--secondary:#65a30d;--soft:#ecfdf5;--bg:#f2fbf7}.theme-royal{--primary:#7c3aed;--secondary:#2563eb;--soft:#f5f3ff;--bg:#f5f6ff}.theme-sunset{--primary:#ea580c;--secondary:#e11d48;--soft:#fff7ed;--bg:#fff7f3}.lang-bn{font-family:"Hind Siliguri",Inter,sans-serif}.lang-ja{font-family:"Noto Sans JP",Inter,sans-serif}
.jli-sidebar{position:fixed;inset:0 auto 0 0;z-index:40;width:17rem;background:rgba(255,255,255,.94);border-right:1px solid var(--border);box-shadow:10px 0 32px rgba(15,23,42,.08);backdrop-filter:blur(18px);transition:.25s ease;display:flex;flex-direction:column}.dark .jli-sidebar{background:rgba(15,23,42,.94)}.jli-sidebar.collapsed{width:5rem}.jli-brand{height:4.7rem;display:flex;align-items:center;gap:.8rem;padding:0 1rem;border-bottom:1px solid var(--border);overflow:hidden}.jli-brand img{width:2.7rem;height:2.7rem;flex:0 0 auto}.brand-text{min-width:0}.brand-text strong{display:block;font-size:1.28rem;font-weight:950;color:var(--text);line-height:1}.brand-text span{display:block;font-size:.68rem;font-weight:900;color:var(--primary);white-space:nowrap}.collapsed .brand-text{display:none}.jli-nav{padding:.75rem;overflow:auto}.nav-group{position:relative;margin-bottom:.3rem}.nav-parent{width:100%;display:flex;align-items:center;justify-content:space-between;gap:.5rem;border-radius:1rem;padding:.78rem .85rem;color:#475569;font-weight:900;transition:.2s}.dark .nav-parent{color:#cbd5e1}.nav-parent:hover{background:var(--soft);color:var(--primary);transform:translateY(-1px)}.nav-parent span{display:flex;align-items:center;gap:.82rem;min-width:0}.nav-parent i:first-child{width:1.2rem;text-align:center}.nav-parent b{font-size:.76rem;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chev{font-size:.7rem;transition:.2s}.chev.open{transform:rotate(180deg)}.nav-children{margin:.15rem 0 .5rem 1.45rem;padding-left:.7rem;border-left:1px solid var(--border)}.nav-children a{display:block;border-radius:.75rem;padding:.5rem .7rem;color:var(--muted);font-size:.82rem;font-weight:800}.nav-children a:hover,.nav-children a.active{background:var(--soft);color:var(--primary)}.collapsed .nav-parent{justify-content:center;padding:.85rem}.collapsed .nav-parent b,.collapsed .chev{display:none}.collapsed .nav-children{display:none}.jli-workspace{min-height:100vh;transition:.25s ease}.wide-sidebar{margin-left:17rem}.mini-sidebar{margin-left:5rem}.jli-topbar{position:sticky;top:0;z-index:30;min-height:4.7rem;padding:.65rem 1rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--border);background:rgba(255,255,255,.82);backdrop-filter:blur(18px);box-shadow:0 14px 34px rgba(15,23,42,.06)}.dark .jli-topbar{background:rgba(15,23,42,.82)}.topbar-left,.topbar-actions{display:flex;align-items:center;gap:.65rem;min-width:0}.page-title span{display:block;color:var(--primary);font-size:.67rem;font-weight:950;text-transform:uppercase;letter-spacing:.1em}.page-title h1{margin:.08rem 0 0;font-size:1.08rem;line-height:1.1;font-weight:950;color:var(--text);white-space:nowrap}.icon-btn,.pill-btn{height:2.65rem;display:inline-flex;align-items:center;justify-content:center;gap:.42rem;border:1px solid var(--border);border-radius:.95rem;background:rgba(255,255,255,.9);color:#334155;box-shadow:0 10px 22px rgba(148,163,184,.16);font-weight:950}.dark .icon-btn,.dark .pill-btn{background:rgba(2,6,23,.45);color:#e2e8f0;box-shadow:none}.icon-btn{width:2.65rem}.pill-btn{padding:0 .75rem}.icon-btn:hover,.pill-btn:hover{transform:translateY(-1px);border-color:var(--primary);color:var(--primary);background:var(--soft)}.date-chip{height:2.65rem;display:flex;align-items:center;gap:.5rem;border:1px solid var(--border);border-radius:999px;background:rgba(255,255,255,.78);padding:0 .8rem;color:var(--muted);font-weight:900;white-space:nowrap}.dark .date-chip{background:rgba(2,6,23,.45)}.dropdown-wrap{position:relative}.dropdown-panel{position:absolute;right:0;top:calc(100% + .65rem);z-index:70;width:18rem;border:1px solid var(--border);border-radius:1.2rem;background:rgba(255,255,255,.98);box-shadow:var(--shadow);backdrop-filter:blur(18px);padding:.65rem}.dark .dropdown-panel{background:rgba(15,23,42,.98)}.dropdown-panel h3{margin:.2rem .25rem .6rem;color:var(--text);font-size:1rem;font-weight:950}.option-row{width:100%;display:grid;grid-template-columns:2.25rem 1fr;grid-template-areas:"icon title" "icon sub";gap:.05rem .55rem;align-items:center;text-align:left;border-radius:.85rem;padding:.6rem;color:var(--text)}.option-row:hover,.option-row.active{background:var(--soft);color:var(--primary)}.option-row>span{grid-area:icon}.option-row>b{grid-area:title;font-size:.83rem}.option-row>small{grid-area:sub;color:var(--muted);font-size:.72rem}.swatch{width:2rem;height:2rem;border-radius:.75rem;display:block}.swatch.default{background:linear-gradient(135deg,#4f46e5,#dc2626)}.swatch.sakura{background:linear-gradient(135deg,#db2777,#f97316)}.swatch.ocean{background:linear-gradient(135deg,#0284c7,#0d9488)}.swatch.emerald{background:linear-gradient(135deg,#059669,#65a30d)}.swatch.royal{background:linear-gradient(135deg,#7c3aed,#2563eb)}.swatch.sunset{background:linear-gradient(135deg,#ea580c,#e11d48)}.notify-btn{position:relative}.notify-btn em{position:absolute;right:-.25rem;top:-.25rem;min-width:1.18rem;height:1.18rem;border-radius:999px;background:#dc2626;color:#fff;border:2px solid #fff;font-size:.65rem;font-style:normal;font-weight:950;display:grid;place-items:center}.notification-panel{width:min(24rem,calc(100vw - 1.5rem));padding:0;overflow:hidden}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:.7rem;padding:.9rem;background:linear-gradient(135deg,var(--soft),#fff1f2);border-bottom:1px solid var(--border)}.dark .panel-head{background:rgba(30,41,59,.75)}.panel-head span{color:var(--primary);font-size:.66rem;font-weight:950;letter-spacing:.1em;text-transform:uppercase}.panel-head h3{margin:.1rem 0 0}.panel-head button{border-radius:999px;background:#fff;color:var(--primary);padding:.42rem .65rem;font-size:.72rem;font-weight:900}.notification-item{width:100%;display:grid;grid-template-columns:2.5rem 1fr;gap:.65rem;padding:.7rem;text-align:left}.notification-item:hover,.notification-item.unread{background:var(--soft)}.note-icon{height:2.5rem;width:2.5rem;border-radius:.82rem;display:grid!important;place-items:center;color:#fff}.note-icon.info{background:linear-gradient(135deg,#4f46e5,#2563eb)}.note-icon.danger{background:linear-gradient(135deg,#dc2626,#e11d48)}.note-icon.warning{background:linear-gradient(135deg,#d97706,#f59e0b)}.note-icon.success{background:linear-gradient(135deg,#059669,#22c55e)}.notification-item b,.notification-item small,.notification-item time{display:block}.notification-item b{font-size:.82rem;color:var(--text)}.notification-item small{color:var(--muted);font-size:.76rem;font-weight:700;line-height:1.45}.notification-item time{color:#94a3b8;font-size:.7rem;font-weight:850;margin-top:.15rem}.user-btn{min-width:13.7rem;height:2.9rem;display:flex;align-items:center;gap:.58rem;border:1px solid var(--border);border-radius:999px;background:rgba(255,255,255,.9);box-shadow:0 10px 22px rgba(148,163,184,.16);padding:.25rem .55rem .25rem .25rem}.dark .user-btn{background:rgba(2,6,23,.45);box-shadow:none}.user-btn img{width:2.35rem;height:2.35rem}.user-btn span{min-width:0;text-align:left}.user-btn b,.user-btn small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:8rem}.user-btn b{font-size:.78rem;color:var(--text)}.user-btn small{font-size:.68rem;color:var(--muted);font-weight:850}.user-panel{width:18rem}.user-panel button{width:100%;display:flex;align-items:center;gap:.55rem;border-radius:.8rem;padding:.7rem;color:var(--text);font-weight:850;text-align:left}.user-panel button:hover{background:var(--soft);color:var(--primary)}.user-panel button.danger{color:#dc2626}.user-card{display:flex;align-items:center;gap:.65rem;padding:.8rem;border-radius:1rem;background:linear-gradient(135deg,var(--soft),#fff1f2);margin-bottom:.5rem}.dark .user-card{background:rgba(30,41,59,.75)}.user-card img{width:2.8rem;height:2.8rem}.user-card b,.user-card small{display:block}.user-card small{color:var(--muted);font-size:.72rem;font-weight:800}.jli-content{padding:1.2rem}.dashboard-hero,.profile-hero{display:grid;grid-template-columns:1fr auto;gap:1.5rem;align-items:center;border-radius:1.6rem;padding:2rem;background:linear-gradient(135deg,#0f172a,var(--primary) 56%,var(--secondary));color:#fff;box-shadow:var(--shadow);overflow:hidden;position:relative}.dashboard-hero:before,.profile-hero:before{content:"";position:absolute;inset:auto -4rem -9rem auto;width:22rem;height:22rem;border-radius:50%;background:rgba(255,255,255,.14)}.hero-badge{display:inline-flex;gap:.5rem;align-items:center;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.14);border-radius:999px;padding:.45rem .8rem;font-weight:950;font-size:.75rem}.dashboard-hero h1{font-size:clamp(2rem,4vw,4rem);line-height:1;margin:.85rem 0;font-weight:950;max-width:850px}.dashboard-hero p{max-width:700px;color:rgba(255,255,255,.82);font-weight:650;line-height:1.7}.hero-actions{display:flex;gap:.75rem;margin-top:1.1rem;flex-wrap:wrap}.hero-actions a{border-radius:999px;background:#fff;color:#111827;padding:.8rem 1rem;font-weight:950}.hero-actions .ghost{background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.28)}.hero-panel{position:relative;width:20rem;border:1px solid rgba(255,255,255,.24);border-radius:1.3rem;background:rgba(255,255,255,.12);padding:1rem;backdrop-filter:blur(10px)}.hero-panel strong{font-size:1.05rem}.hero-panel ul{margin:.8rem 0 0;padding:0;list-style:none}.hero-panel li{margin:.6rem 0;color:rgba(255,255,255,.9);font-weight:800}.metric-grid,.profile-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin-top:1rem}.metric-grid article,.premium-card{border:1px solid var(--border);background:rgba(255,255,255,.86);border-radius:1.3rem;padding:1.1rem;box-shadow:0 16px 32px rgba(15,23,42,.06)}.dark .metric-grid article,.dark .premium-card{background:rgba(17,28,47,.86)}.metric-grid i,.premium-card i{height:3rem;width:3rem;display:grid!important;place-items:center;border-radius:1rem;background:var(--soft);color:var(--primary);font-size:1.2rem}.metric-grid span{display:block;margin-top:.8rem;color:var(--muted);font-weight:900}.metric-grid b{font-size:1.8rem;font-weight:950;color:var(--text)}.profile-hero{grid-template-columns:auto 1fr}.profile-hero img{width:6rem;height:6rem}.profile-hero span{font-weight:950;letter-spacing:.12em;text-transform:uppercase}.profile-hero h1{margin:.2rem 0;font-size:2.4rem}.profile-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.premium-card h3{margin:.8rem 0 .3rem}.premium-card p{color:var(--muted);font-weight:700;line-height:1.65}.login-page{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr);background:radial-gradient(circle at top left,rgba(79,70,229,.18),transparent 35rem),#0f172a;color:#fff}.login-visual{padding:clamp(2rem,6vw,5rem);display:flex;flex-direction:column;justify-content:center}.login-logo{display:flex;align-items:center;gap:.8rem;font-weight:950;font-size:1.5rem}.login-logo img{width:3.4rem;height:3.4rem}.login-visual h1{font-size:clamp(2.3rem,5vw,5.2rem);line-height:.96;margin:1.2rem 0;font-weight:950;max-width:760px}.login-visual p{max-width:680px;color:#cbd5e1;font-size:1.05rem;line-height:1.8;font-weight:600}.login-stats{display:flex;gap:1rem;flex-wrap:wrap;margin-top:1.4rem}.login-stats span{min-width:9rem;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.08);border-radius:1.2rem;padding:1rem;color:#cbd5e1;font-weight:800}.login-stats b{display:block;color:#fff;font-size:1.7rem}.login-card{align-self:center;margin:2rem clamp(1rem,4vw,4rem);border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.96);color:#0f172a;border-radius:1.6rem;padding:2rem;box-shadow:0 30px 80px rgba(0,0,0,.35)}.card-kicker{color:var(--primary);font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;font-weight:950}.login-card h2{font-size:2rem;margin:.35rem 0 .3rem}.login-card p{color:#64748b;font-weight:700;line-height:1.6}.login-card label{display:block;margin:.85rem 0 .35rem;font-weight:900}.form-control{width:100%;height:3rem;border:1px solid #cbd5e1;border-radius:.9rem;padding:0 .9rem;font:inherit;font-weight:750}.form-control:focus{outline:3px solid #c7d2fe;border-color:#4f46e5}.login-submit{width:100%;height:3.15rem;margin-top:1rem;border-radius:.95rem;background:linear-gradient(135deg,#4f46e5,#dc2626);color:#fff;font-weight:950;display:flex;align-items:center;justify-content:center;gap:.55rem}.login-error{display:flex;gap:.45rem;align-items:center;border-radius:.85rem;background:#fef2f2;color:#dc2626;padding:.7rem .8rem;font-weight:850}.demo-note{margin-top:1rem;color:#64748b;background:#f8fafc;border-radius:.9rem;padding:.8rem;font-size:.86rem;line-height:1.6}.validation-message{color:#dc2626;font-size:.8rem;font-weight:800;margin-top:.2rem}.mobile-only{display:none!important}#blazor-error-ui{background:#ffffe0;bottom:0;box-shadow:0 -1px 2px rgba(0,0,0,.2);display:none;left:0;padding:.6rem 1.25rem;position:fixed;width:100%;z-index:1000}#blazor-error-ui .dismiss{cursor:pointer;position:absolute;right:.75rem;top:.5rem}
@media(max-width:1100px){.date-chip{display:none}.dashboard-hero{grid-template-columns:1fr}.hero-panel{width:100%}.metric-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:860px){.desktop-only{display:none!important}.mobile-only{display:inline-flex!important}.jli-sidebar{transform:translateX(-105%);width:17rem!important}.jli-sidebar.mobile-open{transform:translateX(0)}.wide-sidebar,.mini-sidebar{margin-left:0}.mobile-backdrop{position:fixed;inset:0;z-index:35;background:rgba(0,0,0,.48)}.topbar-actions{gap:.4rem}.pill-btn{width:2.65rem;padding:0}.pill-btn:not(.user-btn){font-size:0}.user-btn{min-width:0;width:2.9rem;padding:.25rem}.user-btn span,.user-btn>i{display:none}.page-title h1{font-size:.92rem}.page-title span{display:none}.profile-grid{grid-template-columns:1fr}.login-page{grid-template-columns:1fr}.login-visual{padding:2rem 1.2rem}.login-card{margin:0 1.2rem 2rem}.login-stats span{flex:1}.topbar-actions .dropdown-panel{right:-.5rem}.theme-panel,.compact-panel{width:min(18rem,calc(100vw - 1rem))}}
@media(max-width:560px){.jli-topbar{padding:.55rem}.jli-content{padding:.75rem}.topbar-actions{gap:.3rem}.icon-btn,.pill-btn{width:2.45rem;height:2.45rem}.dashboard-hero,.profile-hero{padding:1.2rem;border-radius:1.2rem}.dashboard-hero h1{font-size:2.05rem}.metric-grid{grid-template-columns:1fr}.hero-actions a{width:100%;text-align:center}.login-visual h1{font-size:2.3rem}}

/* Secure session loading screen */
.jli-auth-loading {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 2rem;
    background: radial-gradient(circle at top left, rgba(79,70,229,.18), transparent 28rem), radial-gradient(circle at bottom right, rgba(220,38,38,.14), transparent 26rem), #f8fafc;
    font-family: Inter, "Hind Siliguri", Arial, sans-serif;
}
.auth-loading-card {
    width: min(26rem, 100%);
    text-align: center;
    border: 1px solid rgba(226,232,240,.95);
    border-radius: 1.5rem;
    background: rgba(255,255,255,.94);
    padding: 2rem;
    box-shadow: 0 24px 70px rgba(15,23,42,.14);
}
.auth-loading-card img {
    width: 4.5rem;
    height: 4.5rem;
    margin: 0 auto 1rem;
    display: block;
}
.auth-loading-card h2 {
    margin: 0;
    color: #0f172a;
    font-size: 1.25rem;
    font-weight: 950;
}
.auth-loading-card p {
    margin: .5rem 0 0;
    color: #64748b;
    font-weight: 700;
}

/* Imported page compatibility */
.validation-message{margin-top:.35rem;display:block;color:#e11d48;font-size:.8rem;font-weight:700}.hidden{display:none!important}


/* Global role/user page-action permission enforcement */
.jli-permission-denied {
    display: none !important;
    pointer-events: none !important;
}
html.jli-permission-pending [data-permission-actioncode] {
    visibility: hidden !important;
}


.jli-page-permission-loading {
    min-height: 14rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .9rem;
    border: 1px dashed var(--border);
    border-radius: 1.2rem;
    background: rgba(255,255,255,.72);
    color: var(--primary);
}
.jli-page-permission-loading i { font-size: 1.4rem; }
.jli-page-permission-loading strong,
.jli-page-permission-loading small { display: block; }
.jli-page-permission-loading small { margin-top: .2rem; color: var(--muted); font-weight: 700; }

/* Authenticated employee avatar crop */
.user-btn img,
.user-card img {
    object-fit: cover;
    object-position: center;
    border-radius: 999px;
}


/* =========================================================
   JLI Premium Admin Dashboard
   ========================================================= */
.admin-dashboard-page{
    max-width:1700px;
    margin:0 auto;
    padding:1.35rem 1.35rem 2rem;
    display:grid;
    gap:1.2rem
}
.admin-hero-card{
    display:grid;
    grid-template-columns:minmax(0,1.6fr) minmax(320px,.9fr);
    gap:1rem;
    padding:1.2rem;
    border:1px solid rgba(255,255,255,.66);
    border-radius:1.6rem;
    background:
        radial-gradient(circle at top left,rgba(79,70,229,.14),transparent 27rem),
        radial-gradient(circle at top right,rgba(6,182,212,.12),transparent 25rem),
        linear-gradient(135deg,rgba(255,255,255,.94),rgba(255,255,255,.82));
    box-shadow:0 24px 60px rgba(15,23,42,.12);
    backdrop-filter:blur(18px)
}
.dark .admin-hero-card{
    border-color:rgba(51,65,85,.92);
    background:
        radial-gradient(circle at top left,rgba(99,102,241,.20),transparent 27rem),
        radial-gradient(circle at top right,rgba(16,185,129,.14),transparent 22rem),
        linear-gradient(135deg,rgba(15,23,42,.94),rgba(17,24,39,.92))
}
.hero-copy{display:grid;gap:1rem;align-content:start}
.hero-kicker{display:flex;flex-wrap:wrap;gap:.55rem}
.hero-badge{
    display:inline-flex;align-items:center;gap:.42rem;
    padding:.48rem .72rem;border-radius:999px;
    background:rgba(79,70,229,.1);color:#4338ca;
    font-size:.72rem;font-weight:950;letter-spacing:.02em
}
.hero-badge.soft{background:rgba(14,165,233,.1);color:#0369a1}
.dark .hero-badge{background:rgba(99,102,241,.18);color:#c7d2fe}
.dark .hero-badge.soft{background:rgba(6,182,212,.18);color:#a5f3fc}
.admin-hero-card h1{
    margin:0;
    font-size:clamp(1.8rem,2vw + 1rem,3rem);
    line-height:1.08;
    font-weight:950;
    color:#0f172a
}
.dark .admin-hero-card h1{color:#f8fafc}
.admin-hero-card p{
    margin:0;
    max-width:64rem;
    color:#475569;
    font-size:.98rem;
    font-weight:700;
    line-height:1.8
}
.dark .admin-hero-card p{color:#cbd5e1}
.hero-actions{display:flex;flex-wrap:wrap;gap:.7rem}
.hero-primary-action,.hero-secondary-action{
    min-height:2.9rem;
    display:inline-flex;align-items:center;gap:.55rem;
    padding:0 1rem;border-radius:1rem;
    font-size:.86rem;font-weight:900;
    transition:.18s ease;
    border:1px solid transparent
}
.hero-primary-action{
    color:#fff;background:linear-gradient(135deg,#4f46e5,#7c3aed);
    box-shadow:0 12px 28px rgba(79,70,229,.28)
}
.hero-secondary-action{
    color:#334155;background:rgba(255,255,255,.86);border-color:#dbe4ef
}
.hero-primary-action:hover,.hero-secondary-action:hover{transform:translateY(-2px)}
.dark .hero-secondary-action{
    color:#e2e8f0;background:rgba(15,23,42,.65);border-color:#334155
}
.hero-inline-stats{
    display:flex;flex-wrap:wrap;gap:.6rem .8rem;
    padding-top:.2rem
}
.hero-inline-stats span{
    display:inline-flex;align-items:center;gap:.42rem;
    padding:.45rem .7rem;border-radius:.9rem;
    background:rgba(255,255,255,.72);
    border:1px solid #e2e8f0;
    color:#334155;font-size:.76rem;font-weight:900
}
.dark .hero-inline-stats span{
    background:rgba(15,23,42,.62);border-color:#334155;color:#e2e8f0
}
.hero-side-panels{display:grid;gap:.75rem;align-content:start}
.focus-card{
    padding:1rem;border-radius:1.25rem;
    border:1px solid #e2e8f0;background:#fff;
    box-shadow:0 16px 40px rgba(15,23,42,.08)
}
.dark .focus-card{background:rgba(15,23,42,.86);border-color:#334155}
.focus-card-head{display:flex;align-items:center;gap:.8rem;margin-bottom:.8rem}
.focus-icon{
    width:2.5rem;height:2.5rem;display:grid;place-items:center;
    border-radius:.95rem;background:linear-gradient(135deg,#4338ca,#06b6d4);
    color:#fff;font-size:1rem
}
.focus-card-head strong{display:block;color:#0f172a;font-size:1rem;font-weight:950}
.focus-card-head small{display:block;color:#64748b;font-size:.72rem;font-weight:800}
.dark .focus-card-head strong{color:#f8fafc}
.dark .focus-card-head small{color:#94a3b8}
.focus-list{list-style:none;margin:0;padding:0;display:grid;gap:.58rem}
.focus-list li{
    display:flex;align-items:flex-start;gap:.55rem;
    color:#334155;font-size:.82rem;font-weight:800;line-height:1.6
}
.focus-list i{margin-top:.15rem;color:#10b981}
.dark .focus-list li{color:#e2e8f0}
.focus-card.compact{padding:.9rem 1rem}
.focus-card.compact.alt{background:linear-gradient(135deg,#eff6ff,#f5f3ff)}
.dark .focus-card.compact.alt{background:linear-gradient(135deg,rgba(30,41,59,.9),rgba(51,65,85,.75))}
.focus-mini-grid{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.focus-mini-grid span{display:block;color:#64748b;font-size:.72rem;font-weight:900}
.focus-mini-grid strong{display:block;margin-top:.15rem;color:#0f172a;font-size:1rem;font-weight:950}
.focus-mini-grid small{display:block;margin-top:.1rem;color:#94a3b8;font-size:.72rem;font-weight:800}
.focus-mini-grid i{
    width:2.7rem;height:2.7rem;display:grid;place-items:center;
    border-radius:1rem;background:rgba(79,70,229,.1);color:#4f46e5;font-size:1rem
}
.dark .focus-mini-grid strong{color:#f8fafc}
.dashboard-metric-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:1rem
}
.metric-tile{
    position:relative;
    display:grid;gap:.52rem;
    padding:1rem 1rem 1rem 1rem;
    border-radius:1.25rem;
    border:1px solid #e2e8f0;
    background:#fff;
    overflow:hidden;
    box-shadow:0 16px 40px rgba(15,23,42,.08)
}
.metric-tile::after{
    content:"";
    position:absolute;inset:auto -18% -45% auto;
    width:8rem;height:8rem;border-radius:50%;
    background:currentColor;opacity:.08
}
.metric-tile.indigo{color:#4f46e5}
.metric-tile.sky{color:#0284c7}
.metric-tile.emerald{color:#059669}
.metric-tile.amber{color:#d97706}
.dark .metric-tile{background:rgba(15,23,42,.86);border-color:#334155}
.metric-icon{
    width:2.9rem;height:2.9rem;display:grid;place-items:center;
    border-radius:1rem;background:color-mix(in oklab,currentColor 14%,white);font-size:1.08rem
}
.metric-label{font-size:.76rem;font-weight:950;letter-spacing:.04em;text-transform:uppercase}
.metric-value{font-size:.97rem;font-weight:950;line-height:1.55;color:#0f172a}
.metric-foot{font-size:.76rem;font-weight:800;color:#64748b}
.dark .metric-value{color:#f8fafc}
.dark .metric-foot{color:#94a3b8}
.dashboard-main-grid,.dashboard-lower-grid{
    display:grid;gap:1rem
}
.dashboard-main-grid{grid-template-columns:minmax(0,1.2fr) minmax(330px,.85fr)}
.dashboard-lower-grid{grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr)}
.glass-panel{
    padding:1.05rem;
    border-radius:1.35rem;
    border:1px solid rgba(255,255,255,.7);
    background:linear-gradient(135deg,rgba(255,255,255,.95),rgba(255,255,255,.86));
    box-shadow:0 18px 45px rgba(15,23,42,.08);
    backdrop-filter:blur(18px)
}
.dark .glass-panel{
    border-color:#334155;
    background:linear-gradient(135deg,rgba(15,23,42,.92),rgba(15,23,42,.82))
}
.panel-head{
    display:flex;align-items:flex-start;justify-content:space-between;
    gap:1rem;margin-bottom:1rem
}
.panel-kicker{
    display:block;margin-bottom:.2rem;
    color:#6366f1;font-size:.72rem;font-weight:950;letter-spacing:.06em;text-transform:uppercase
}
.panel-head h3{margin:0;color:#0f172a;font-size:1.12rem;font-weight:950}
.panel-head a{display:inline-flex;align-items:center;gap:.35rem;color:#4f46e5;font-size:.78rem;font-weight:900}
.dark .panel-head h3{color:#f8fafc}
.quick-action-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:.85rem
}
.quick-action-card{
    display:grid;gap:.45rem;
    padding:.9rem;border-radius:1.1rem;
    border:1px solid #e2e8f0;background:#fff;
    box-shadow:0 10px 26px rgba(15,23,42,.05);
    transition:.18s ease
}
.quick-action-card:hover{transform:translateY(-2px);border-color:#c7d2fe}
.dark .quick-action-card{background:rgba(15,23,42,.75);border-color:#334155}
.qa-icon{
    width:2.6rem;height:2.6rem;display:grid;place-items:center;
    border-radius:.95rem;color:#fff;font-size:.95rem
}
.qa-icon.indigo{background:linear-gradient(135deg,#4f46e5,#6366f1)}
.qa-icon.sky{background:linear-gradient(135deg,#0284c7,#06b6d4)}
.qa-icon.emerald{background:linear-gradient(135deg,#059669,#10b981)}
.qa-icon.rose{background:linear-gradient(135deg,#e11d48,#f43f5e)}
.qa-icon.amber{background:linear-gradient(135deg,#d97706,#f59e0b)}
.qa-icon.violet{background:linear-gradient(135deg,#7c3aed,#a855f7)}
.quick-action-card strong{color:#0f172a;font-size:.9rem;font-weight:950}
.quick-action-card small{color:#64748b;font-size:.76rem;font-weight:800;line-height:1.55}
.dark .quick-action-card strong{color:#f8fafc}
.dark .quick-action-card small{color:#94a3b8}
.workflow-steps{display:grid;gap:.8rem}
.workflow-step{
    display:grid;grid-template-columns:2.7rem minmax(0,1fr);gap:.8rem;
    align-items:center;padding:.82rem .9rem;border-radius:1rem;
    border:1px solid #e2e8f0;background:#fff
}
.dark .workflow-step{background:rgba(15,23,42,.72);border-color:#334155}
.step-icon{
    width:2.7rem;height:2.7rem;display:grid;place-items:center;
    border-radius:.95rem;font-size:.95rem;font-weight:950;color:#fff
}
.workflow-step.done .step-icon{background:linear-gradient(135deg,#10b981,#34d399)}
.workflow-step.active .step-icon{background:linear-gradient(135deg,#4f46e5,#06b6d4)}
.workflow-step.pending .step-icon{background:linear-gradient(135deg,#f59e0b,#fb7185)}
.workflow-step strong{display:block;color:#0f172a;font-size:.88rem;font-weight:950}
.workflow-step small{display:block;margin-top:.18rem;color:#64748b;font-size:.76rem;font-weight:800}
.dark .workflow-step strong{color:#f8fafc}
.dark .workflow-step small{color:#94a3b8}
.workflow-note{
    margin-top:.95rem;
    display:flex;align-items:flex-start;gap:.55rem;
    padding:.8rem .9rem;border-radius:1rem;
    background:rgba(79,70,229,.08);color:#4338ca;
    font-size:.78rem;font-weight:850;line-height:1.6
}
.dark .workflow-note{background:rgba(79,70,229,.16);color:#c7d2fe}
.module-hub-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:.85rem
}
.module-hub-card{
    display:grid;gap:.42rem;
    padding:1rem;border-radius:1.05rem;
    border:1px solid #e2e8f0;background:#fff;
    transition:.18s ease
}
.module-hub-card:hover{transform:translateY(-2px);border-color:#bfdbfe}
.dark .module-hub-card{background:rgba(15,23,42,.75);border-color:#334155}
.module-hub-card i{font-size:1.12rem;color:#4f46e5}
.module-hub-card strong{color:#0f172a;font-size:.9rem;font-weight:950}
.module-hub-card small{color:#64748b;font-size:.76rem;font-weight:800;line-height:1.55}
.dark .module-hub-card strong{color:#f8fafc}
.dark .module-hub-card small{color:#94a3b8}
.watchlist-group{display:grid;gap:.78rem}
.watch-item{
    display:grid;grid-template-columns:2.6rem minmax(0,1fr);gap:.75rem;
    align-items:flex-start;padding:.82rem .84rem;border-radius:1rem;
    border:1px solid #e2e8f0;background:#fff
}
.dark .watch-item{background:rgba(15,23,42,.75);border-color:#334155}
.watch-badge{
    width:2.6rem;height:2.6rem;display:grid;place-items:center;
    border-radius:1rem;color:#fff;font-size:.9rem
}
.watch-badge.red{background:linear-gradient(135deg,#ef4444,#f97316)}
.watch-badge.indigo{background:linear-gradient(135deg,#4f46e5,#7c3aed)}
.watch-badge.emerald{background:linear-gradient(135deg,#059669,#10b981)}
.watch-badge.amber{background:linear-gradient(135deg,#d97706,#f59e0b)}
.watch-item strong{display:block;color:#0f172a;font-size:.86rem;font-weight:950}
.watch-item small{display:block;margin-top:.18rem;color:#64748b;font-size:.76rem;font-weight:800;line-height:1.6}
.dark .watch-item strong{color:#f8fafc}
.dark .watch-item small{color:#94a3b8}
@media (max-width:1250px){
    .admin-hero-card,
    .dashboard-main-grid,
    .dashboard-lower-grid{grid-template-columns:1fr}
}
@media (max-width:1100px){
    .dashboard-metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .quick-action-grid,
    .module-hub-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:700px){
    .admin-dashboard-page{padding:1rem .8rem 1.4rem}
    .dashboard-metric-grid,
    .quick-action-grid,
    .module-hub-grid{grid-template-columns:1fr}
    .panel-head{flex-direction:column}
    .hero-actions{flex-direction:column}
    .hero-primary-action,.hero-secondary-action{justify-content:center}
    .hero-inline-stats{display:grid;grid-template-columns:1fr}
    .admin-hero-card h1{font-size:1.7rem}
}

/* ============================================================
   DOCUMENT-WIDE APPEARANCE ENGINE
   Theme/mode must affect every routed page, including pages that
   use their own scoped CSS or Tailwind utility classes.
   ============================================================ */
:root {
    --jli-global-primary: #4f46e5;
    --jli-global-secondary: #dc2626;
    --jli-global-soft: #eef2ff;
}

html[data-jli-theme] { accent-color: var(--jli-global-primary); }

body[data-jli-theme] .jli-content {
    border-top: 3px solid var(--jli-global-primary);
    background:
        radial-gradient(circle at 6% 0%, color-mix(in srgb, var(--jli-global-primary) 14%, transparent), transparent 28rem),
        radial-gradient(circle at 96% 2%, color-mix(in srgb, var(--jli-global-secondary) 11%, transparent), transparent 26rem),
        var(--jli-global-soft);
    transition: background .25s ease, border-color .25s ease, color .25s ease;
}

body[data-jli-theme] .jli-content :is(a, input, select, textarea, button):focus-visible {
    outline: 3px solid color-mix(in srgb, var(--jli-global-primary) 28%, transparent);
    outline-offset: 2px;
}

body[data-jli-theme] .jli-content :is(a, .text-primary, .text-indigo-600, .text-blue-600) {
    --tw-text-opacity: 1;
}

body.jli-global-dark {
    color-scheme: dark;
    background: #020617;
}

body.jli-global-dark .jli-content {
    color: #e2e8f0;
    background:
        radial-gradient(circle at 5% 0%, color-mix(in srgb, var(--jli-global-primary) 24%, transparent), transparent 30rem),
        radial-gradient(circle at 96% 2%, color-mix(in srgb, var(--jli-global-secondary) 18%, transparent), transparent 28rem),
        #08111f !important;
}

body.jli-global-dark .jli-content > :is(div, section, main) {
    color: #e2e8f0;
}

body.jli-global-dark .jli-content :is(.bg-white, .bg-slate-50, .bg-gray-50) {
    background-color: #111827 !important;
}

body.jli-global-dark .jli-content :is(.text-slate-950, .text-slate-900, .text-slate-800, .text-gray-900) {
    color: #f8fafc !important;
}

body.jli-global-dark .jli-content :is(.text-slate-700, .text-slate-600, .text-gray-700) {
    color: #cbd5e1 !important;
}

body.jli-global-dark .jli-content :is(.border-slate-200, .border-gray-200) {
    border-color: #334155 !important;
}

/* Google Translate operates invisibly; language is controlled by JLI topbar. */
#google_translate_element,
.goog-te-banner-frame,
.goog-te-balloon-frame,
.goog-logo-link,
.goog-te-gadget { display: none !important; }

iframe.goog-te-banner-frame,
iframe.skiptranslate,
iframe[class*="VIpgJd-ZVi9od-ORHb"],
.VIpgJd-ZVi9od-ORHb,
[class*="VIpgJd-ZVi9od-ORHb-OEVmcd"],
#goog-gt-tt {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    border: 0 !important;
}

html, body { top: 0 !important; position: static !important; }
.goog-text-highlight { background: transparent !important; box-shadow: none !important; }


/* =========================================================
   JLI Premium Table Actions + Zebra Rows
   ========================================================= */
.jli-zebra-table{
    border-collapse:separate;
    border-spacing:0;
}
.jli-zebra-table tbody tr{
    transition:background-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.jli-zebra-table tbody tr:nth-child(odd)>td{
    background:rgba(248,250,252,.88)!important;
}
.jli-zebra-table tbody tr:nth-child(even)>td{
    background:rgba(255,255,255,.98)!important;
}
.jli-zebra-table tbody tr:hover>td{
    background:linear-gradient(90deg,rgba(224,231,255,.65),rgba(236,253,245,.82))!important;
}
.jli-zebra-table tbody tr>td{
    transition:background-color .18s ease, color .18s ease, box-shadow .18s ease;
    border-bottom-color:#e2e8f0!important;
}
.jli-zebra-table tbody tr>td:first-child{box-shadow:inset 3px 0 0 transparent}
.jli-zebra-table tbody tr:hover>td:first-child{box-shadow:inset 3px 0 0 #4f46e5}

.jli-table-action-group{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:.45rem!important;
    padding:.38rem!important;
    border-radius:1rem!important;
    border:1px solid rgba(226,232,240,.96)!important;
    background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,250,252,.95))!important;
    box-shadow:0 16px 38px -24px rgba(15,23,42,.28), inset 0 1px 0 rgba(255,255,255,.96)!important;
    backdrop-filter:blur(10px);
}
.jli-action-cell{white-space:nowrap}
.jli-table-action-btn{
    position:relative;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:.4rem!important;
    min-width:2.45rem!important;
    height:2.45rem!important;
    padding:0 .76rem!important;
    border-radius:.9rem!important;
    border:1px solid #dbe4ef!important;
    background:linear-gradient(180deg,#ffffff,#f8fafc)!important;
    color:#334155!important;
    font-size:.82rem!important;
    font-weight:900!important;
    line-height:1!important;
    box-shadow:0 14px 24px -18px rgba(15,23,42,.35), inset 0 1px 0 rgba(255,255,255,.95)!important;
    transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease, color .16s ease, background .16s ease!important;
}
.jli-table-action-btn::before{
    content:"";
    position:absolute;
    inset:1px;
    border-radius:inherit;
    background:linear-gradient(180deg,rgba(255,255,255,.75),rgba(255,255,255,0));
    pointer-events:none;
}
.jli-table-action-btn i,
.jli-table-action-btn svg{
    position:relative;
    z-index:1;
    font-size:.92rem!important;
}
.jli-table-action-btn.jli-action-icon{
    width:2.45rem!important;
    padding:0!important;
}
.jli-table-action-btn:hover,
.jli-table-action-btn:focus-visible{
    transform:translateY(-1px);
    box-shadow:0 18px 28px -18px rgba(15,23,42,.38), 0 0 0 4px rgba(99,102,241,.10)!important;
    outline:none!important;
}
.jli-table-action-btn:active{transform:translateY(0) scale(.97)}

.jli-table-action-btn.jli-action-view{
    color:#4338ca!important;
    border-color:#c7d2fe!important;
    background:linear-gradient(135deg,#eef2ff,#ffffff 56%,#e0f2fe)!important;
}
.jli-table-action-btn.jli-action-view:hover,
.jli-table-action-btn.jli-action-view:focus-visible{
    color:#312e81!important;
    border-color:#818cf8!important;
}
.jli-table-action-btn.jli-action-edit{
    color:#047857!important;
    border-color:#a7f3d0!important;
    background:linear-gradient(135deg,#ecfdf5,#ffffff 56%,#d1fae5)!important;
}
.jli-table-action-btn.jli-action-edit:hover,
.jli-table-action-btn.jli-action-edit:focus-visible{
    color:#065f46!important;
    border-color:#34d399!important;
}
.jli-table-action-btn.jli-action-danger{
    color:#be123c!important;
    border-color:#fecdd3!important;
    background:linear-gradient(135deg,#fff1f2,#ffffff 56%,#ffe4e6)!important;
}
.jli-table-action-btn.jli-action-danger:hover,
.jli-table-action-btn.jli-action-danger:focus-visible{
    color:#9f1239!important;
    border-color:#fb7185!important;
}
.jli-table-action-btn.jli-action-accent{
    color:#a16207!important;
    border-color:#fde68a!important;
    background:linear-gradient(135deg,#fffbeb,#ffffff 56%,#fef3c7)!important;
}
.jli-table-action-btn.jli-action-accent:hover,
.jli-table-action-btn.jli-action-accent:focus-visible{
    color:#854d0e!important;
    border-color:#fbbf24!important;
}
.jli-table-action-btn.jli-action-neutral{
    color:#0f766e!important;
    border-color:#99f6e4!important;
    background:linear-gradient(135deg,#f0fdfa,#ffffff 56%,#ccfbf1)!important;
}
.jli-table-action-btn.jli-action-neutral:hover,
.jli-table-action-btn.jli-action-neutral:focus-visible{
    color:#115e59!important;
    border-color:#2dd4bf!important;
}


/* =========================================================
   JLI Compact Page Header Metric Cards
   Keeps summary/header cards slim even when values are long.
   ========================================================= */
.jli-compact-metric-grid{
    align-items:stretch!important;
    gap:.35rem!important;
}
.jli-compact-metric-card{
    min-height:3.15rem!important;
    max-height:4.15rem!important;
    padding:.34rem .46rem!important;
    border-radius:.55rem!important;
    overflow:hidden!important;
    display:flex!important;
    align-items:center!important;
}
.jli-compact-metric-card>div,
.jli-compact-metric-card>.flex{
    width:100%!important;
    min-width:0!important;
    gap:.38rem!important;
    align-items:center!important;
}
.jli-compact-metric-card [class*="h-8"][class*="w-8"],
.jli-compact-metric-card [class*="h-9"][class*="w-9"],
.jli-compact-metric-card [class*="h-10"][class*="w-10"]{
    width:1.85rem!important;
    height:1.85rem!important;
    min-width:1.85rem!important;
    border-radius:.45rem!important;
    font-size:.78rem!important;
}
.jli-compact-metric-card span{
    font-size:.56rem!important;
    line-height:1.05!important;
    letter-spacing:.06em!important;
    margin:0!important;
}
.jli-compact-metric-card strong{
    margin-top:.08rem!important;
    font-size:1.03rem!important;
    line-height:1.06!important;
    min-width:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
}
.jli-compact-metric-card.jli-metric-long-value strong{
    font-size:.72rem!important;
    line-height:1.08!important;
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
    white-space:normal!important;
    max-height:2.16em!important;
    overflow:hidden!important;
}
.jli-compact-metric-card.jli-metric-medium-value strong{
    font-size:.84rem!important;
    line-height:1.08!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
}
.jli-compact-metric-card p,
.jli-compact-metric-card small{
    margin-top:.08rem!important;
    font-size:.56rem!important;
    line-height:1.05!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
}
@media(max-width:767px){
    .jli-compact-metric-card{
        min-height:3rem!important;
        max-height:3.85rem!important;
    }
}

/* =========================================================
   JLI Role Based Dashboards - Admin / User
   ========================================================= */
.jli-role-dashboard .admin-hero-card{min-height:0}
.jli-admin-dashboard-hero{background:radial-gradient(circle at 12% 16%,rgba(99,102,241,.18),transparent 28rem),radial-gradient(circle at 92% 12%,rgba(14,165,233,.12),transparent 25rem),linear-gradient(135deg,rgba(255,255,255,.96),rgba(248,250,252,.88))}
.jli-user-dashboard-hero{background:radial-gradient(circle at 10% 10%,rgba(16,185,129,.14),transparent 27rem),radial-gradient(circle at 90% 18%,rgba(14,165,233,.12),transparent 24rem),linear-gradient(135deg,rgba(255,255,255,.97),rgba(240,253,250,.78))}
.jli-user-dashboard .hero-badge{background:rgba(5,150,105,.10);color:#047857}
.jli-user-dashboard .hero-badge.soft{background:rgba(14,165,233,.10);color:#0369a1}
.jli-dashboard-section-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.55fr);gap:1rem;align-items:start}
.jli-dashboard-control-card{display:grid;gap:.55rem}
.jli-dashboard-control-card .panel-head{margin-bottom:.2rem}
.jli-dashboard-control-link{display:grid;grid-template-columns:2.6rem 1fr auto;gap:.7rem;align-items:center;padding:.7rem;border:1px solid #e2e8f0;border-radius:1rem;background:linear-gradient(135deg,#fff,#f8fafc);transition:.18s ease}
.jli-dashboard-control-link>span{width:2.6rem;height:2.6rem;display:grid;place-items:center;border-radius:.85rem;background:#eef2ff;color:#4f46e5}
.jli-dashboard-control-link strong,.jli-dashboard-control-link small{display:block}
.jli-dashboard-control-link strong{font-size:.82rem;color:#0f172a;font-weight:950}.jli-dashboard-control-link small{margin-top:.12rem;font-size:.7rem;color:#64748b;font-weight:800}.jli-dashboard-control-link>i{color:#94a3b8;font-size:.72rem}.jli-dashboard-control-link:hover{transform:translateY(-1px);border-color:#c7d2fe;box-shadow:0 12px 28px rgba(79,70,229,.10)}
.jli-dashboard-role-loading{min-height:48vh;display:grid;place-items:center;padding:2rem}.jli-dashboard-role-loading-card{display:flex;align-items:center;gap:.9rem;padding:1rem 1.25rem;border:1px solid #e2e8f0;border-radius:1.2rem;background:rgba(255,255,255,.92);box-shadow:0 18px 45px rgba(15,23,42,.09)}.jli-dashboard-role-loading-icon{width:2.8rem;height:2.8rem;display:grid;place-items:center;border-radius:.9rem;background:linear-gradient(135deg,#4f46e5,#0ea5e9);color:#fff}.jli-dashboard-role-loading-card strong,.jli-dashboard-role-loading-card small{display:block}.jli-dashboard-role-loading-card strong{color:#0f172a;font-weight:950}.jli-dashboard-role-loading-card small{margin-top:.15rem;color:#64748b;font-size:.75rem;font-weight:800}
.jli-dashboard-no-access{margin-top:1rem;display:flex;align-items:center;gap:.8rem;padding:1rem;border:1px dashed #cbd5e1;border-radius:1rem;background:#f8fafc;color:#475569}.jli-dashboard-no-access>i{font-size:1.15rem;color:#4f46e5}.jli-dashboard-no-access strong,.jli-dashboard-no-access small{display:block}.jli-dashboard-no-access small{margin-top:.15rem;color:#64748b;font-weight:700}
.dark .jli-admin-dashboard-hero,.dark .jli-user-dashboard-hero{background:radial-gradient(circle at top left,rgba(99,102,241,.22),transparent 27rem),linear-gradient(135deg,rgba(15,23,42,.96),rgba(17,24,39,.92))}.dark .jli-dashboard-control-link{background:rgba(15,23,42,.82);border-color:#334155}.dark .jli-dashboard-control-link strong{color:#f8fafc}.dark .jli-dashboard-control-link small{color:#94a3b8}.dark .jli-dashboard-role-loading-card,.dark .jli-dashboard-no-access{background:rgba(15,23,42,.9);border-color:#334155}.dark .jli-dashboard-role-loading-card strong,.dark .jli-dashboard-no-access strong{color:#f8fafc}
@media(max-width:1050px){.jli-dashboard-section-grid{grid-template-columns:1fr}}
@media(max-width:700px){.jli-role-dashboard .admin-hero-card{grid-template-columns:1fr}.jli-role-dashboard .hero-side-panels{grid-template-columns:1fr 1fr}.jli-user-quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.jli-role-dashboard .hero-side-panels{grid-template-columns:1fr}.jli-user-quick-grid{grid-template-columns:1fr}}

/* =========================================================
   JLI Role Dashboard - live management / attendance metrics
   ========================================================= */
.jli-dashboard-stats-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.jli-dashboard-stats-grid .metric-tile{min-height:9rem;padding:1rem 1.05rem;align-content:start}
.jli-dashboard-stats-grid .metric-value{font-size:1.14rem;line-height:1.35;overflow-wrap:anywhere}
.jli-dashboard-stats-grid .metric-foot{line-height:1.45}
.metric-tile.rose{color:#e11d48}
.metric-tile.violet{color:#7c3aed}
.jli-user-attendance-stats .metric-tile{min-height:8.75rem}
@media(max-width:1200px){.jli-dashboard-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.jli-dashboard-stats-grid{grid-template-columns:1fr}.jli-dashboard-stats-grid .metric-tile{min-height:auto}}

/* JLI Dashboard CRM + Follow-up overview */
.jli-crm-dashboard-panel{margin-top:1rem;padding:1.05rem;border:1px solid #eadde2;background:linear-gradient(135deg,#fff 0%,#fffafb 60%,#fbf7ff 100%);box-shadow:0 12px 34px rgba(80,25,48,.06)}
.jli-crm-dashboard-head{align-items:flex-end}.jli-crm-dashboard-head small{display:block;margin-top:.25rem;color:#94a3b8;font-size:.72rem;font-weight:700}.jli-crm-head-actions{display:flex;gap:.5rem;flex-wrap:wrap}.jli-crm-head-actions a{display:inline-flex;align-items:center;gap:.4rem;padding:.55rem .72rem;border-radius:.65rem;background:#fff;border:1px solid #e8d9df;color:#7b1d36;font-size:.72rem;font-weight:900;text-decoration:none;box-shadow:0 3px 10px rgba(60,20,40,.04)}.jli-crm-head-actions a:hover{background:#7b1d36;color:#fff;border-color:#7b1d36}
.jli-crm-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem;margin:.8rem 0 1rem}.jli-crm-kpi{min-height:92px;display:flex;align-items:center;gap:.72rem;padding:.8rem;border:1px solid #e6e9ef;border-radius:.85rem;background:#fff}.jli-crm-kpi-icon{width:42px;height:42px;flex:0 0 42px;border-radius:.78rem;display:grid;place-items:center;font-size:1rem}.jli-crm-kpi div{min-width:0}.jli-crm-kpi small{display:block;color:#64748b;font-size:.66rem;font-weight:900;text-transform:uppercase;letter-spacing:.05em}.jli-crm-kpi strong{display:block;margin:.08rem 0;font-size:1.35rem;line-height:1.2;color:#172033}.jli-crm-kpi div>span{display:block;color:#94a3b8;font-size:.66rem;font-weight:700}.jli-crm-kpi.indigo .jli-crm-kpi-icon{background:#eef2ff;color:#4f46e5}.jli-crm-kpi.sky .jli-crm-kpi-icon{background:#e0f2fe;color:#0284c7}.jli-crm-kpi.rose .jli-crm-kpi-icon{background:#fff1f2;color:#e11d48}.jli-crm-kpi.emerald .jli-crm-kpi-icon{background:#ecfdf5;color:#059669}
.jli-crm-dashboard-body{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(320px,.75fr);gap:.8rem}.jli-crm-team-block,.jli-crm-followup-block,.jli-my-followups{padding:.85rem;border:1px solid #e8ebf0;border-radius:.85rem;background:#fff}.jli-crm-subhead{display:flex;justify-content:space-between;align-items:center;gap:.7rem;margin-bottom:.65rem}.jli-crm-subhead div span{display:block;color:#8c2341;font-size:.58rem;font-weight:950;letter-spacing:.12em}.jli-crm-subhead div strong{display:block;margin-top:.12rem;color:#202939;font-size:.84rem}.jli-crm-subhead>span,.jli-crm-subhead>a{color:#94a3b8;font-size:.64rem;font-weight:800;text-decoration:none}.jli-crm-subhead>a:hover{color:#7b1d36}
.jli-crm-user-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem}.jli-crm-user-card{padding:.68rem;border:1px solid #eceef2;border-radius:.75rem;background:#fcfcfd}.jli-crm-user-top{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:.5rem}.jli-crm-user-avatar{width:34px;height:34px;border-radius:.7rem;display:grid;place-items:center;background:linear-gradient(135deg,#7b1d36,#a63d5b);color:#fff;font-size:.68rem;font-weight:950}.jli-crm-user-top div{min-width:0}.jli-crm-user-top strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#273142;font-size:.72rem}.jli-crm-user-top small{display:block;margin-top:.06rem;color:#98a2b3;font-size:.6rem}.jli-crm-work-badge{padding:.26rem .42rem;border-radius:999px;background:#f7e9ee;color:#7b1d36;font-size:.55rem;font-weight:950}.jli-crm-user-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:.3rem;margin-top:.55rem;padding-top:.5rem;border-top:1px solid #eef0f3}.jli-crm-user-stats span{text-align:center;color:#667085;font-size:.55rem;font-weight:800}.jli-crm-user-stats b{display:block;color:#253044;font-size:.76rem}.jli-crm-user-stats .danger b{color:#d92d20}
.jli-crm-follow-list{display:flex;flex-direction:column;gap:.42rem}.jli-crm-follow-row{display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:.5rem;padding:.55rem;border:1px solid #edf0f3;border-radius:.7rem;background:#fafbfc;text-decoration:none;color:inherit}.jli-crm-follow-row.overdue{border-color:#fecaca;background:#fff7f7}.jli-crm-follow-icon{width:32px;height:32px;border-radius:.62rem;display:grid;place-items:center;background:#fffaeb;color:#b54708}.jli-crm-follow-row.overdue .jli-crm-follow-icon{background:#fef2f2;color:#dc2626}.jli-crm-follow-row div{min-width:0}.jli-crm-follow-row strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#344054;font-size:.67rem}.jli-crm-follow-row div small{display:block;margin-top:.1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#98a2b3;font-size:.57rem}.jli-crm-due{text-align:right;color:#b54708;font-size:.53rem;font-weight:950;letter-spacing:.04em}.jli-crm-follow-row.overdue .jli-crm-due{color:#d92d20}.jli-crm-due small{display:block;margin-top:.12rem;color:#98a2b3;font-size:.54rem;letter-spacing:0}.jli-crm-empty{min-height:120px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4rem;color:#98a2b3;font-size:.68rem;font-weight:800}.jli-crm-empty i{font-size:1.2rem}.jli-crm-empty.compact{min-height:72px}.jli-my-crm-panel{margin-bottom:1rem}.jli-my-followups{margin-top:.3rem}.jli-crm-follow-list.horizontal{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:1150px){.jli-crm-dashboard-body{grid-template-columns:1fr}.jli-crm-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.jli-crm-dashboard-head{align-items:flex-start}.jli-crm-head-actions{width:100%}.jli-crm-head-actions a{flex:1;justify-content:center}.jli-crm-user-grid,.jli-crm-follow-list.horizontal{grid-template-columns:1fr}.jli-crm-user-stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.jli-crm-kpi-grid{grid-template-columns:1fr}.jli-crm-dashboard-panel{padding:.72rem}.jli-crm-user-card{padding:.58rem}}


/* AH26 fallback: use the same corporate palette for all theme aliases. */
.theme-sakura,.theme-ocean,.theme-emerald,.theme-royal,.theme-sunset{
    --primary:#4f46e5!important;
    --secondary:#e11d48!important;
    --soft:#eef2ff!important;
    --bg:#f8fafc!important;
}

/* =========================================================
   JLI 260915AH - Full Responsive Hardening
   320px mobile -> tablet -> laptop -> wide desktop
   ========================================================= */
html,body{max-width:100%;overflow-x:hidden}
*,*::before,*::after{box-sizing:border-box}
img,svg,video,canvas,iframe{max-width:100%;height:auto}
input,select,textarea,button{max-width:100%}
main,.main-content,.content,.page-content,.page-shell,.jli-page-shell{min-width:0;max-width:100%}
.rz-dialog,.rz-dialog-wrapper,.rz-popup,.rz-dropdown-panel,.rz-multiselect-panel{max-width:calc(100vw - 20px)!important}
.rz-dialog-content{max-width:100%;overflow:auto}
.rz-data-grid,.rz-grid-table,.rz-datatable,.rz-data-grid-data{max-width:100%}
.table-responsive,.table-wrap,.data-table-wrap,.grid-table-wrap,.rz-data-grid-data{overflow-x:auto;-webkit-overflow-scrolling:touch}

@media(max-width:1024px){
  .page-shell,.jli-page-shell{padding-left:clamp(.65rem,2vw,1rem)!important;padding-right:clamp(.65rem,2vw,1rem)!important}
  .admin-hero-card,.hero-card,.page-header,.premium-header{min-width:0!important}
  .modal-card,.dialog-card,.form-card{max-width:calc(100vw - 24px)!important}
}

@media(max-width:767px){
  body{font-size:14px}
  .page-shell,.jli-page-shell,.page-content,.content{width:100%!important;max-width:100%!important;margin-left:auto!important;margin-right:auto!important}
  .admin-hero-card,.hero-card,.page-header,.premium-header{grid-template-columns:1fr!important;flex-wrap:wrap!important}
  .header-actions,.hero-actions,.page-actions,.toolbar-actions,.action-row{width:100%!important;flex-wrap:wrap!important}
  .header-actions>a,.header-actions>button,.hero-actions>a,.hero-actions>button,.page-actions>a,.page-actions>button{min-width:0!important;max-width:100%!important}
  .metric-grid,.metrics-grid,.summary-grid,.dashboard-metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .form-grid,.entry-grid,.filter-grid{grid-template-columns:1fr!important}
  .grid-cols-5,.grid-cols-4,.grid-cols-3{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .sticky-actions,.form-actions{flex-wrap:wrap!important}
  .sticky-actions>button,.sticky-actions>a,.form-actions>button,.form-actions>a{min-width:0!important;flex:1 1 140px}
  table{max-width:none}
  th,td{overflow-wrap:anywhere}
}

@media(max-width:520px){
  .page-shell,.jli-page-shell{padding-left:.55rem!important;padding-right:.55rem!important}
  .metric-grid,.metrics-grid,.summary-grid,.dashboard-metric-grid,.grid-cols-5,.grid-cols-4,.grid-cols-3,.grid-cols-2{grid-template-columns:1fr!important}
  .header-actions,.hero-actions,.page-actions,.toolbar-actions,.action-row{display:grid!important;grid-template-columns:1fr!important;gap:.5rem!important}
  .header-actions>a,.header-actions>button,.hero-actions>a,.hero-actions>button,.page-actions>a,.page-actions>button,.toolbar-actions>a,.toolbar-actions>button{width:100%!important;justify-content:center!important}
  .modal-card,.dialog-card,.form-card{width:calc(100vw - 16px)!important;max-width:calc(100vw - 16px)!important;border-radius:14px!important}
  .rz-dialog{width:calc(100vw - 16px)!important;max-width:calc(100vw - 16px)!important;left:8px!important;right:8px!important}
  input,select,textarea,.rz-inputtext,.rz-dropdown,.rz-numeric,.rz-datepicker{font-size:16px!important}
}

@media(max-width:360px){
  .page-shell,.jli-page-shell{padding-left:.4rem!important;padding-right:.4rem!important}
  .card,.glass-panel,.form-card,.metric-tile{border-radius:.8rem!important}
  .btn,button,a[class*="btn"]{max-width:100%}
}