.fspeej-notification-center { position: relative; z-index: 20; margin-right: 14px; }
.fspeej-student-sidebar-toggle, .fspeej-student-sidebar-overlay, .fspeej-student-sidebar-close, .fspeej-student-sidebar-head { display: none; }
.fspeej-student-sidebar .tp-user-wrap { border: 1px solid rgba(45,78,157,.08); border-radius: 14px; padding: 20px 14px 14px; box-shadow: 0 12px 30px rgba(25,42,78,.08); }
.fspeej-student-sidebar .tp-user-menu ul { padding-left: 0; margin-bottom: 0; }
.fspeej-student-sidebar .tp-user-menu ul li a { align-items: center; min-height: 42px; padding: 9px 13px; }
.fspeej-student-sidebar .tp-user-menu ul li a span { width: 28px; color: #2d4e9d; }
.fspeej-student-sidebar .tp-user-menu ul li a.active span { color: #fff; }
.fspeej-student-sidebar .tp-user-menu ul li a:hover { transform: translateX(3px); }
.fspeej-student-sidebar .tp-user-menu-title { margin-top: 18px; padding-left: 13px; color: #8993a8; font-size: 10px; font-weight: 700; letter-spacing: .08em; }
.tp-header-user-box:has(.fspeej-promotion-menu-link) { min-width: 275px; }
.fspeej-promotion-menu-link { white-space: nowrap; }
.fspeej-promotion-menu-link span { flex: 0 0 30px; }
.fspeej-student-sidebar .fspeej-promotion-menu-link { font-size: 13px; }
@media (max-width: 575px) {
	.fspeej-promotion-menu-link { font-size: 14px; }
}
@media (min-width: 992px) {
	.fspeej-student-sidebar { position: sticky; top: 105px; max-height: calc(100vh - 130px); overflow-y: auto; scrollbar-width: thin; scrollbar-color: #cbd4e5 transparent; }
	.fspeej-student-sidebar::-webkit-scrollbar { width: 5px; }
	.fspeej-student-sidebar::-webkit-scrollbar-thumb { border-radius: 10px; background: #cbd4e5; }
	.fspeej-student-sidebar::-webkit-scrollbar-track { background: transparent; }
}
.fspeej-notification-trigger { position: relative; width: 42px; height: 42px; border: 1px solid rgba(45,78,157,.18); border-radius: 50%; background: #fff; color: #2d4e9d; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease; }
.fspeej-notification-trigger:hover, .fspeej-notification-trigger:focus-visible { transform: translateY(-2px); background: #f4f7ff; box-shadow: 0 8px 18px rgba(45,78,157,.18); outline: none; }
.fspeej-notification-trigger:active { transform: translateY(0) scale(.94); }
.fspeej-notification-trigger i { display: inline-block; font-size: 17px; }
.fspeej-notification-trigger:hover i, .fspeej-notification-trigger:focus-visible i { animation: fspeej-bell-ring .65s ease-in-out; }
.fspeej-notification-badge { position: absolute; top: -5px; right: -4px; min-width: 19px; height: 19px; padding: 0 5px; border: 2px solid #fff; border-radius: 20px; background: #d84949; color: #fff; font: 700 10px/15px Arial, sans-serif; animation: fspeej-badge-pop .35s ease-out; }
.fspeej-notification-popover { position: absolute; top: calc(100% + 12px); right: 0; width: min(380px, calc(100vw - 30px)); overflow: hidden; border: 1px solid #e7eaf2; border-radius: 12px; background: #fff; box-shadow: 0 18px 45px rgba(28,43,75,.18); transform-origin: top right; animation: fspeej-notification-open .22s cubic-bezier(.2,.8,.2,1) both; }
.fspeej-notification-popover.is-closing { animation: fspeej-notification-close .16s ease-in both; }
.fspeej-notification-popover-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 18px; border-bottom: 1px solid #edf0f5; color: #17233d; }
.fspeej-notification-close { border: 0; background: none; color: #7d879d; font-size: 22px; cursor: pointer; }
.fspeej-notification-list { max-height: 330px; overflow-y: auto; }
.fspeej-notification-item { display: block; padding: 14px 18px; border-bottom: 1px solid #f0f2f6; color: #27334d; text-decoration: none; animation: fspeej-notification-item-in .3s ease both; }
.fspeej-notification-item:nth-child(2) { animation-delay: .04s; }
.fspeej-notification-item:nth-child(3) { animation-delay: .08s; }
.fspeej-notification-item:nth-child(4) { animation-delay: .12s; }
.fspeej-notification-item:nth-child(5) { animation-delay: .16s; }
.fspeej-notification-item:hover { background: #f7f9fd; }
.fspeej-notification-item.unread { border-left: 3px solid #2d4e9d; background: #f7f9fd; }
.fspeej-notification-item.urgent { position: relative; border: 1px solid #f0b7b7; border-left: 4px solid #d84949; background: #fff5f5; }
.fspeej-notification-item.urgent:hover { background: #ffeaea; }
.fspeej-notification-urgent-label { display: inline-flex; align-items: center; gap: 5px; margin-bottom: 7px; color: #c23838; font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.fspeej-notification-item.urgent strong { color: #9f2525; }
.fspeej-notification-item strong { display: block; font-size: 14px; }
.fspeej-notification-item p { margin: 5px 0 0; color: #68738a; font-size: 12px; line-height: 1.45; }
.fspeej-notification-popover .fspeej-notification-item p { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; }
.fspeej-notification-item small { display: block; margin-top: 7px; color: #98a1b2; font-size: 11px; }
.fspeej-notification-empty { margin: 0; padding: 28px 18px; color: #7d879d; text-align: center; font-size: 13px; }
.fspeej-notification-all { display: block; padding: 13px 18px; background: #2d4e9d; color: #fff; text-align: center; font-size: 13px; text-decoration: none; }
.fspeej-sidebar-notification { position: relative; }
.fspeej-sidebar-count { margin-left: auto; min-width: 20px; padding: 2px 6px; border-radius: 20px; background: #d84949; color: #fff; font-size: 10px; text-align: center; }
.fspeej-offcanvas-notification { display: flex; align-items: center; gap: 9px; width: fit-content; margin-bottom: 24px; color: #2d4e9d; font-size: 15px; font-weight: 600; text-decoration: none; }
.fspeej-notifications-page, .fspeej-notification-detail { padding: 30px; background: #fff; }
.fspeej-notifications-page [data-notification-page-list] { overflow: hidden; border: 1px solid #edf0f5; border-radius: 10px; }
.fspeej-notification-detail h1 { margin: 18px 0 8px; color: #17233d; }
.fspeej-notification-detail > p { max-width: 720px; margin: 24px 0; color: #68738a; line-height: 1.8; white-space: pre-line; }
.fspeej-notification-detail-type { display: inline-block; margin: 24px 0 0 18px; color: #2d4e9d; font-size: 12px; font-weight: 700; text-transform: uppercase; }
.fspeej-notification-detail-type.urgent { color: #d84949; }
.fspeej-notification-alert { position: fixed; right: 18px; bottom: 18px; z-index: 2000; width: min(390px, calc(100vw - 36px)); padding: 18px; border-left: 4px solid #d49400; border-radius: 10px; background: #fff; box-shadow: 0 15px 40px rgba(20,29,53,.2); animation: fspeej-alert-in .35s cubic-bezier(.2,.8,.2,1) both; }
.fspeej-notification-alert.is-closing { animation: fspeej-alert-out .25s ease both; }
.fspeej-notification-alert strong { display: block; margin-bottom: 5px; color: #17233d; }
.fspeej-notification-alert p { margin: 0 0 12px; color: #68738a; font-size: 13px; }
.fspeej-notification-alert a { color: #2d4e9d; font-weight: 600; font-size: 13px; }
.fspeej-push-permission { position: fixed; right: 18px; bottom: 18px; z-index: 1999; display: flex; align-items: center; gap: 18px; width: min(460px, calc(100vw - 36px)); padding: 16px 18px; border: 1px solid #e3e8f2; border-radius: 12px; background: #fff; box-shadow: 0 15px 40px rgba(20,29,53,.16); }
.fspeej-push-permission-content { flex: 1; }
.fspeej-push-permission strong { color: #17233d; font-size: 14px; }
.fspeej-push-permission p { margin: 4px 0 0; color: #68738a; font-size: 12px; line-height: 1.4; }
.fspeej-push-permission-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.fspeej-push-permission button { padding: 8px 11px; border-radius: 6px; cursor: pointer; font-size: 12px; font-weight: 600; }
.fspeej-push-later { border: 1px solid #dfe4ee; background: #fff; color: #68738a; }
.fspeej-push-allow { border: 0; background: #2d4e9d; color: #fff; }
.fspeej-push-permission button:disabled { cursor: wait; opacity: .65; }
@keyframes fspeej-notification-open { from { opacity: 0; transform: translateY(-8px) scale(.96); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes fspeej-notification-close { from { opacity: 1; transform: translateY(0) scale(1); } to { opacity: 0; transform: translateY(-6px) scale(.97); } }
@keyframes fspeej-notification-item-in { from { opacity: 0; transform: translateX(10px); } to { opacity: 1; transform: translateX(0); } }
@keyframes fspeej-bell-ring { 0%, 100% { transform: rotate(0); } 25% { transform: rotate(-12deg); } 75% { transform: rotate(12deg); } }
@keyframes fspeej-badge-pop { from { opacity: 0; transform: scale(.55); } 70% { transform: scale(1.12); } to { opacity: 1; transform: scale(1); } }
@keyframes fspeej-alert-in { from { opacity: 0; transform: translateY(18px) scale(.96); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes fspeej-alert-out { from { opacity: 1; transform: translateY(0) scale(1); } to { opacity: 0; transform: translateY(12px) scale(.97); } }
@media (prefers-reduced-motion: reduce) { .fspeej-notification-trigger, .fspeej-notification-trigger i, .fspeej-notification-badge, .fspeej-notification-popover, .fspeej-notification-item, .fspeej-notification-alert { animation: none; transition: none; } }
@media (max-width: 575px) { .fspeej-notification-center { margin-right: 6px; } .fspeej-notification-trigger { width: 38px; height: 38px; } .fspeej-notification-popover { position: fixed; top: 68px; right: 15px; left: 15px; width: auto; } .fspeej-notifications-page, .fspeej-notification-detail { padding: 20px 16px; } .fspeej-notification-detail h1 { font-size: 25px; } .fspeej-push-permission { right: 12px; bottom: 12px; left: 12px; width: auto; align-items: flex-start; gap: 10px; } .fspeej-push-permission-actions { margin-left: auto; } }
@media (max-width: 991px) {
	.fspeej-student-sidebar-toggle { position: fixed; right: 18px; bottom: 18px; z-index: 1100; display: inline-flex; align-items: center; gap: 8px; min-height: 46px; padding: 0 16px; border: 0; border-radius: 999px; background: #2d4e9d; box-shadow: 0 12px 24px rgba(45,78,157,.28); color: #fff; cursor: pointer; font-size: 13px; font-weight: 700; }
	.fspeej-student-sidebar-toggle:hover { background: #243f80; transform: translateY(-2px); }
	.fspeej-student-sidebar-overlay { position: fixed; inset: 0; z-index: 90; display: block; background: rgba(15,25,48,.48); opacity: 0; pointer-events: none; transition: opacity .25s ease; }
	.fspeej-student-sidebar-overlay:not([hidden]) { opacity: 1; pointer-events: auto; }
	.fspeej-student-sidebar { position: fixed; top: 82px; bottom: 0; left: 0; z-index: 95; width: min(340px, calc(100vw - 42px)); margin: 0; padding: 14px; overflow-y: auto; background: #f6f8fc; box-shadow: 14px 0 35px rgba(15,25,48,.18); transform: translateX(-105%); transition: transform .28s cubic-bezier(.22,.8,.25,1); }
	.fspeej-student-sidebar.is-open { transform: translateX(0); }
	.fspeej-student-sidebar .tp-user-wrap { min-height: 100%; padding: 18px 12px; border: 0; box-shadow: none; }
	.fspeej-student-sidebar-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: 0 4px 20px; padding: 4px 2px 16px; border-bottom: 1px solid #e3e8f2; }
	.fspeej-student-sidebar-eyebrow { display: block; margin-bottom: 3px; color: #8a94a9; font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
	.fspeej-student-sidebar-head strong { color: #17233d; font-size: 19px; }
	.fspeej-student-sidebar-close { display: inline-grid; width: 34px; height: 34px; place-items: center; border: 1px solid #e1e6ef; border-radius: 50%; background: #fff; color: #68738a; cursor: pointer; }
	.fspeej-student-sidebar-close:hover { background: #eef2fa; color: #2d4e9d; }
	.fspeej-student-sidebar .tp-user-menu ul li a:hover { transform: none; }
	body.fspeej-sidebar-open { overflow: hidden; }
}