:root{--qtag-green: #39ff14;--sidebar-width: 240px;--sidebar-collapsed-width: 70px;--sidebar-bg: linear-gradient(165deg, #000 40%, #39ff14 200%);--sidebar-bg-collapsed: #000;--main-bg: #181c23;--toolbar-height: 64px;--status-pass: #39ff14;--status-fail: #e74c3c;--status-upcoming: #ffd600}html,body{height:100%;margin:0;padding:0;font-family:Segoe UI,Arial,sans-serif;background:var(--main-bg);color:#fff;min-height:100vh;width:100vw;box-sizing:border-box}body{min-height:100vh;min-width:100vw;overflow-x:hidden}.admin-root{display:flex;height:100vh;width:100vw}.sidebar{width:var(--sidebar-width);background:var(--sidebar-bg);color:#fff;display:flex;flex-direction:column;align-items:stretch;transition:width .3s;position:relative;z-index:10}.sidebar.collapsed{width:var(--sidebar-collapsed-width);background:var(--sidebar-bg-collapsed)}.sidebar .logo{display:flex;align-items:center;justify-content:center;height:80px;background:#000;border-bottom:1px solid #222}.sidebar .logo img{height:48px;width:auto}.sidebar.collapsed .logo img{height:35px;width:auto;max-width:100%}.sidebar nav{display:flex;flex-direction:column;margin-top:24px}.sidebar nav a{display:flex;align-items:center;gap:16px;padding:14px 28px;color:#fff;font-size:1.08rem;border-left:4px solid transparent;transition:background .2s,border-color .2s;text-decoration:none;font-weight:500}.sidebar nav a.active,.sidebar nav a:hover{background:#39ff141f;border-left:4px solid var(--qtag-green);color:var(--qtag-green)}.sidebar nav a i{min-width:22px;text-align:center;font-size:1.2em}.sidebar .logout{margin-top:24px;margin-bottom:0;padding:0 28px}.sidebar .logout button{width:100%;background:var(--qtag-green);color:#000;border:none;border-radius:6px;padding:12px 0;font-weight:700;font-size:1rem;cursor:pointer;transition:background .2s}.sidebar .logout button:hover{background:#000;color:#fff;border:1px solid var(--qtag-green)}.sidebar.collapsed nav a span,.sidebar.collapsed .logout button span{display:none}.sidebar.collapsed nav a{justify-content:center;padding:14px 0;font-size:1.2rem}.sidebar.collapsed .logout button{padding:12px 0;font-size:1.2rem}.toolbar{height:var(--toolbar-height);background:#000;display:flex;align-items:center;justify-content:space-between;padding:0 24px;border-bottom:1px solid #222;position:sticky;top:0;z-index:5}.toolbar .menu-btn{background:none;border:none;color:var(--qtag-green);font-size:1.8rem;cursor:pointer;margin-right:18px;transition:color .2s}.toolbar .menu-btn:hover{color:#fff}.toolbar .toolbar-logo{display:flex;align-items:center;gap:12px;overflow:hidden;max-width:200px}.toolbar .toolbar-logo img{height:38px;width:auto}.admin-root:has(.sidebar.collapsed) .toolbar .toolbar-logo img,.admin-root.sidebar-collapsed .toolbar .toolbar-logo img{height:28px;width:auto;max-width:100%}.toolbar .toolbar-right{display:flex;align-items:center;gap:16px}.toolbar .user-icon{width:40px;height:40px;border-radius:50%;background:#222;display:flex;align-items:center;justify-content:center;overflow:hidden;border:2px solid var(--qtag-green);position:relative}.toolbar .user-icon img{width:100%;height:100%;object-fit:cover}.main-content{flex:1;background:var(--main-bg);padding:32px;overflow-y:auto;min-width:0;min-height:0}.main-content::-webkit-scrollbar{width:8px}.main-content::-webkit-scrollbar-track{background:#222;border-radius:4px}.main-content::-webkit-scrollbar-thumb{background:var(--qtag-green);border-radius:4px}.notifications-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:32px;flex-wrap:wrap;gap:16px}.notifications-header h2{color:var(--qtag-green);font-size:1.5rem;margin:0;display:flex;align-items:center;gap:12px}.notifications-header h2 i{font-size:1.2em}.notifications-controls{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.search-box{display:flex;align-items:center;background:#111;border-radius:8px;border:1px solid #333;overflow:hidden}.search-box input{padding:12px 16px;border:none;background:transparent;color:#fff;font-size:1rem;outline:none;min-width:250px}.search-box input::placeholder{color:#666}.search-box button{background:var(--qtag-green);border:none;padding:12px 16px;color:#000;cursor:pointer;transition:background .2s}.search-box button:hover{background:#2ecc10}.add-notification-btn{background:var(--qtag-green);color:#000;border:none;border-radius:8px;padding:12px 24px;font-weight:700;font-size:1rem;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:8px;box-shadow:0 4px 12px #39ff1433}.add-notification-btn:hover{background:#2ecc10;transform:translateY(-2px);box-shadow:0 6px 16px #39ff144d}.notifications-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:14px;margin-bottom:24px}.stat-card{background:#111;border-radius:10px;padding:14px 16px;text-align:center;border-left:4px solid var(--qtag-green);box-shadow:0 4px 12px #0003}.stat-card .stat-value{font-size:1.75rem;font-weight:700;color:var(--qtag-green);margin-bottom:4px}.stat-card .stat-label{color:#888;font-size:.75rem;text-transform:uppercase;letter-spacing:.5px}.notifications-table-container{background:#111;border-radius:12px;padding:24px;color:#fff;box-shadow:0 4px 12px #0000002e;overflow:visible;position:relative}.notifications-table{width:100%;border-collapse:collapse;background:#111;border-radius:8px;overflow:visible}.notifications-table th,.notifications-table td{padding:16px;text-align:left;border-bottom:1px solid #222;font-size:1rem}.notifications-table th{background:#181c23;color:#39ff14;font-weight:600;cursor:pointer;transition:background .2s}.notifications-table th:hover{background:#222}.notifications-table th i{margin-left:8px;opacity:.7}.notifications-table tr:last-child td{border-bottom:none}.notifications-table td{color:#fff}.notifications-table .notification-icon{font-size:1.2rem;margin-right:8px}.status{padding:6px 12px;border-radius:20px;font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:1px}.status.pass{background:#39ff141a;color:var(--status-pass);border:1px solid var(--status-pass)}.status.fail{background:#e74c3c1a;color:var(--status-fail);border:1px solid var(--status-fail)}.status.upcoming{background:#ffd6001a;color:var(--status-upcoming);border:1px solid var(--status-upcoming)}.status.overdue{background:#e74c3c1a;color:#e74c3c;border:1px solid #e74c3c}.status.urgent{background:#f39c121a;color:#f39c12;border:1px solid #f39c12}.status.warning{background:#f1c40f1a;color:#f1c40f;border:1px solid #f1c40f}.notification-row.expired{border-left:4px solid #dc3545;background-color:#dc35450d}.notification-row.urgent{border-left:4px solid #ffc107;background-color:#ffc1070d}.notification-row.warning{border-left:4px solid #fd7e14;background-color:#fd7e140d}.notification-row.read{opacity:.5;background:#ffffff05}.notification-row.read td{color:#666}.notification-row.read .status{background:#9696961a;color:#999;border:1px solid #666}.notification-row.read .notification-icon{color:#666!important}.notification-row.expired .notification-icon{color:#dc3545!important}.notification-row.urgent .notification-icon{color:#ffc107!important}.notification-row.warning .notification-icon{color:#fd7e14!important}.notification-row.read .action-btn{color:#555}.notification-row.read .action-btn:hover{background:#9696961a;color:#888}.notification-row{position:relative;cursor:pointer;transition:background-color .2s}.notification-row:hover{background-color:#39ff140d!important}.notification-row.read:hover{background-color:#9696960d!important}.tooltip-container{position:relative;display:inline-block}.status-info-icon{color:var(--qtag-green);margin:0 4px;cursor:pointer;font-size:.9rem;transition:color .2s}.status-info-icon:hover{color:#fff}.tooltip{visibility:hidden;opacity:0;position:absolute;z-index:9999;bottom:125%;left:50%;transform:translate(-50%);background:#000;color:#fff;text-align:center;border-radius:8px;padding:12px 16px;font-size:.9rem;white-space:nowrap;box-shadow:0 8px 24px #00000080;border:1px solid #333;transition:opacity .3s,visibility .3s;min-width:280px}.tooltip:after{content:"";position:absolute;top:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:#000 transparent transparent transparent}.tooltip.show{visibility:visible;opacity:1}.tooltip-header{font-weight:700;color:var(--qtag-green);margin-bottom:8px;font-size:1rem}.tooltip-item{display:flex;justify-content:space-between;align-items:center;margin:6px 0;padding:4px 0}.tooltip-status{padding:2px 8px;border-radius:12px;font-size:.8rem;font-weight:700;text-transform:uppercase}.tooltip-status.overdue{background:#e74c3c33;color:#e74c3c;border:1px solid #e74c3c}.tooltip-status.urgent{background:#f39c1233;color:#f39c12;border:1px solid #f39c12}.tooltip-status.warning{background:#f1c40f33;color:#f1c40f;border:1px solid #f1c40f}.tooltip-status.upcoming{background:#3498db33;color:#3498db;border:1px solid #3498db}.tooltip-days{color:#ccc;font-size:.85rem}.action-btn{background:none;border:none;color:#888;cursor:pointer;padding:4px 8px;border-radius:4px;transition:all .2s;margin:0 2px}.action-btn:hover{background:#39ff141a;color:var(--qtag-green)}.notifications-table .actions{text-align:center}@media (max-width: 900px){.admin-root{flex-direction:column}.sidebar{position:fixed;left:0;top:0;height:100vh;z-index:100;box-shadow:2px 0 12px #0000002e}.main-content{padding:24px 8px 0}.notifications-header{flex-direction:column;gap:18px}.notifications-controls{flex-direction:column;align-items:stretch}.search-box{justify-content:center}.search-box input{min-width:200px}}@media (max-width: 600px){.sidebar{width:100vw;min-width:0;max-width:100vw;height:auto;position:fixed;left:0;top:0;z-index:100}.sidebar.collapsed{width:0;min-width:0;max-width:0}.main-content{padding:12px 2px 0}.notifications-stats{grid-template-columns:1fr}}