/* KDF upozornenia - zvonček, panel, toasty (štýl Facebooku v svetlom dizajne KDF) */
.kdf-hdr-icons,
.kdf-ntoasts,
.kdf-npush {
	--kn-red: #e41e3f;
	--kn-teal: #0097b2;
	--kn-dark: #1b1d1f;
	--kn-muted: #65676b;
	--kn-line: #e5e9ea;
	--kn-soft: #f0f2f5;
	--kn-hover: #f2f4f5;
	font-family: Poppins, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* ---------- ikony v hlavičke ---------- */
.kdf-hdr-icons {
	float: right;
	display: flex;
	align-items: center;
	gap: 8px;
	height: 36px;
	margin: 0 0 0 14px;
	position: relative;
	z-index: 30;
}
/* mobil/tablet: JS ich zarovná na stred hamburgera Betheme (top/right počíta z jeho polohy),
   bez transform - ten by sa stal containing blockom pre fixed panel upozornení */
.kdf-hdr-icons.is-mobile {
	float: none;
	position: absolute;
	height: auto;
	margin: 0;
}
.kdf-hdr-icons[hidden] { display: none; }
html body .kdf-hdr-login { background: var(--kn-teal) !important; color: #fff !important; }
.kdf-hdr-icons.is-floating { position: fixed; top: 10px; right: 16px; z-index: 9999; }

html body .kdf-hdr-btn {
	position: relative;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 34px !important;
	height: 34px !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 50% !important;
	background: var(--kn-soft) !important;
	color: var(--kn-dark) !important;
	box-shadow: none !important;
	line-height: 1 !important;
	cursor: pointer;
	transition: background .15s ease, color .15s ease;
	text-decoration: none !important;
	overflow: visible !important; /* <button> zvončeka má z témy overflow:hidden - orezával badge */
}
html body .kdf-hdr-btn:hover { background: #e4e6e9 !important; }
html body .kdf-hdr-btn.is-open { background: rgba(0, 151, 178, .14) !important; color: var(--kn-teal) !important; }
.kdf-hdr-btn svg { width: 20px; height: 20px; fill: currentColor; display: block; }
/* zvonček s neprečítaným upozornením: plné koliesko vo farbe typu (ako ikony v ľavom menu), biela ikona */
.kdf-bell-btn { --kdf-ut: #8a9496; } /* výchozia farba - nízka špecificita, aby ju typy nižšie prebili */
html body .kdf-bell-btn[data-utype]:not([data-utype=""]) { background: var(--kdf-ut) !important; color: #fff !important; transition: background-color .3s; }
html body .kdf-bell-btn[data-utype="forum"]   { --kdf-ut: #ffbd59; }
html body .kdf-bell-btn[data-utype="group"]   { --kdf-ut: #8b5cf6; }
html body .kdf-bell-btn[data-utype="comment"] { --kdf-ut: #45bd62; }
html body .kdf-bell-btn[data-utype="mention"] { --kdf-ut: #007c93; }
html body .kdf-bell-btn[data-utype="friend"]  { --kdf-ut: #1877f2; }
html body .kdf-bell-btn[data-utype="like"]    { --kdf-ut: var(--kn-red); }
html body .kdf-bell-btn[data-utype="photo"]   { --kdf-ut: #0ea5e9; }
html body .kdf-bell-btn[data-utype]:not([data-utype=""]):hover { filter: brightness(.93); }
/* skratky z ľavého panelu (Nástenka, Skupiny, Udalosti) - len na mobile, kde panel chýba */
html body .kdf-hdr-icons:not(.is-mobile) .kdf-hdr-nav { display: none !important; }
@media (min-width: 768px) { html body .kdf-hdr-icons .kdf-hdr-nav { display: none !important; } } /* = hranica, kde style.css skrýva .kdf-feed-left */
.kdf-hdr-nav .dashicons { width: 20px; height: 20px; font-size: 20px; line-height: 20px; }
html body .kdf-hdr-nav.is-current { background: rgba(0, 151, 178, .14) !important; color: var(--kn-teal) !important; }
@media (max-width: 420px) {
	.kdf-hdr-icons.is-mobile { gap: 5px; }
	html body .kdf-hdr-icons.is-mobile .kdf-hdr-btn { width: 32px !important; height: 32px !important; }
}
/* avatar má rovnaký kruh 34 px ako ikony, takže sedí v rovnakej osi */
html body .kdf-hdr-me { overflow: visible !important; background: var(--kn-line) !important; } /* visible: šípka ponuky presahuje kruh */
.kdf-hdr-me img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; }
html body .kdf-hdr-me.is-open { background: var(--kn-line) !important; box-shadow: 0 0 0 2px var(--kn-teal) !important; }
/* malá šípka dole v rohu avatara (ako na Facebooku) */
.kdf-me-caret {
	position: absolute; right: -3px; bottom: -3px;
	width: 14px; height: 14px; border-radius: 50%;
	background: var(--kn-soft); border: 2px solid #fff; box-sizing: content-box;
	display: flex; align-items: center; justify-content: center; color: var(--kn-dark);
}
html body .kdf-hdr-me .kdf-me-caret svg { width: 14px; height: 14px; }

/* ---------- ponuka účtu pod avatarom ---------- */
.kdf-me-panel { width: 340px; padding: 8px; box-sizing: border-box; overflow-y: auto; }
.kdf-me-card {
	margin: 4px 4px 12px; padding: 4px; border-radius: 12px;
	box-shadow: 0 2px 12px rgba(20, 30, 32, .12); background: #fff;
}
html body .kdf-me-profile {
	display: flex; align-items: center; gap: 10px; padding: 8px; border-radius: 8px;
	color: var(--kn-dark) !important; font-size: 16px; font-weight: 600; text-decoration: none !important;
}
.kdf-me-profile:hover, .kdf-me-item:hover { background: var(--kn-hover); }
.kdf-me-profile img { width: 38px !important; height: 38px !important; border-radius: 50% !important; object-fit: cover; flex: none; margin: 0 !important; }
.kdf-me-card hr { margin: 4px 8px !important; border: 0 !important; border-top: 1px solid var(--kn-line) !important; height: 0 !important; background: none !important; }
html body .kdf-me-view {
	display: block !important; margin: 6px 4px 4px !important; padding: 9px 12px !important; min-height: 36px; line-height: 18px !important; box-sizing: border-box; border-radius: 8px; text-align: center;
	background: var(--kn-soft); color: var(--kn-dark) !important; font-size: 14px; font-weight: 600; text-decoration: none !important;
}
html body .kdf-me-view:hover { background: #e4e6e9; }
.kdf-me-list { margin: 0 !important; padding: 0 !important; list-style: none !important; }
.kdf-me-list li { margin: 0 !important; padding: 0 !important; list-style: none !important; }
.kdf-me-list li::before { display: none !important; }
.kdf-me-list li.is-logout { margin-top: 4px !important; padding-top: 4px !important; border-top: 1px solid var(--kn-line); }
html body .kdf-me-item {
	display: flex; align-items: center; gap: 12px; padding: 8px; border-radius: 8px;
	color: var(--kn-dark) !important; font-size: 15px; font-weight: 500; text-decoration: none !important;
}
.kdf-me-ico {
	flex: none; width: 36px; height: 36px; border-radius: 50%; background: var(--kn-line);
	display: flex; align-items: center; justify-content: center;
}
.kdf-me-ico svg, .kdf-me-chev svg { width: 20px; height: 20px; fill: currentColor; display: block; }
.kdf-me-label { flex: 1; min-width: 0; }
.kdf-me-chev { color: var(--kn-muted); }

.kdf-hdr-badge {
	position: absolute;
	top: -4px;
	right: -4px;
	z-index: 10;
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 19px;
	height: 19px;
	padding: 0 4px;
	border: 2px solid #fff;
	border-radius: 999px;
	background: var(--kn-red);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	line-height: 15px;
	text-align: center;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
	box-sizing: border-box;
	transform: scale(0);
	transition: transform .2s cubic-bezier(.3, 1.6, .5, 1);
	pointer-events: none;
}
.kdf-hdr-badge.is-on { transform: scale(1); }

/* jemné zatrasenie zvončeka pri novom upozornení */
.kdf-bell-btn.is-ringing svg { animation: kdf-ring .9s ease; transform-origin: 50% 10%; }
@keyframes kdf-ring {
	0%, 100% { transform: rotate(0); }
	15% { transform: rotate(16deg); }
	30% { transform: rotate(-14deg); }
	45% { transform: rotate(10deg); }
	60% { transform: rotate(-6deg); }
	75% { transform: rotate(3deg); }
}

/* kým je niečo neprečítané (badge .is-on): zvonček sa každé 4 s zatrasie, ikona správ poskočí,
   počítadlo jemne pulzuje. Po prečítaní badge zmizne a animácia sa zastaví sama. */
.kdf-bell-btn:has(.kdf-hdr-badge.is-on) svg { animation: kdf-ring-loop 4s ease-in-out infinite; transform-origin: 50% 10%; }
.kdf-hdr-msg:has(.kdf-hdr-badge.is-on) svg { animation: kdf-hop-loop 4s ease-in-out infinite; }
.kdf-hdr-badge.is-on { animation: kdf-badge-pulse 2s ease-in-out infinite; }
@keyframes kdf-ring-loop {
	0%, 25%, 100% { transform: rotate(0); }
	4% { transform: rotate(16deg); }
	8% { transform: rotate(-14deg); }
	12% { transform: rotate(10deg); }
	16% { transform: rotate(-6deg); }
	20% { transform: rotate(3deg); }
}
@keyframes kdf-hop-loop {
	0%, 20%, 100% { transform: translateY(0) scale(1); }
	6% { transform: translateY(-4px) scale(1.08); }
	12% { transform: translateY(0) scale(.96); }
	16% { transform: translateY(-1px) scale(1); }
}
@keyframes kdf-badge-pulse {
	0%, 100% { box-shadow: 0 0 0 0 rgba(228, 30, 63, .55); }
	60% { box-shadow: 0 0 0 7px rgba(228, 30, 63, 0); }
}
@media (prefers-reduced-motion: reduce) {
	.kdf-bell-btn:has(.kdf-hdr-badge.is-on) svg, .kdf-hdr-msg:has(.kdf-hdr-badge.is-on) svg, .kdf-hdr-badge.is-on { animation: none; }
}

/* ---------- rozbaľovací panel ---------- */
.kdf-bell { position: relative; }
/* flex + line-height:0: inak <img> avatara sadne na baseline riadku (28 px), obal narastie na 43 px a avatar vyskočí hore */
.kdf-hdr-icons > .kdf-bell { display: flex; align-items: center; line-height: 0; }
.kdf-bell-panel {
	position: absolute;
	top: calc(100% + 10px);
	right: -8px;
	width: 380px;
	max-height: calc(100vh - 80px);
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--kn-line);
	border-radius: 14px;
	box-shadow: 0 12px 28px rgba(20, 30, 32, .16), 0 2px 4px rgba(20, 30, 32, .08);
	overflow: hidden;
	text-align: left;
	animation: kdf-pop .16s ease-out;
}
.kdf-bell-panel[hidden] { display: none; }
@keyframes kdf-pop { from { opacity: 0; transform: translateY(-6px) scale(.98); } }

.kdf-bell-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 14px 16px 6px;
}
html body .kdf-bell-head h3 { margin: 0 !important; padding: 0 !important; font-size: 22px !important; font-weight: 700 !important; line-height: 1.2 !important; color: var(--kn-dark) !important; }

html body .kdf-bell-panel button {
	margin: 0 !important;
	border: 0 !important;
	box-shadow: none !important;
	font-family: inherit !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	cursor: pointer;
}
html body .kdf-bell-readall {
	display: inline-flex !important;
	align-items: center;
	gap: 4px;
	padding: 6px 8px !important;
	border-radius: 8px !important;
	background: transparent !important;
	color: #007488 !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
}
html body .kdf-bell-readall:hover { background: var(--kn-hover) !important; }
html body .kdf-bell-readall:disabled { color: #5f676b !important; opacity: .75; background: transparent !important; cursor: default; }
.kdf-bell-readall svg { width: 16px; height: 16px; fill: currentColor; flex: none; }

.kdf-bell-tabs { display: flex; gap: 6px; padding: 4px 16px 8px; }
html body .kdf-bell-tabs button {
	padding: 6px 12px !important;
	border-radius: 18px !important;
	background: transparent !important;
	color: var(--kn-dark) !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	line-height: 1.3 !important;
}
html body .kdf-bell-tabs button:hover { background: var(--kn-hover) !important; }
html body .kdf-bell-tabs button.is-active { background: rgba(0, 151, 178, .14) !important; color: #1f8f89 !important; }

.kdf-bell-list {
	flex: 1;
	min-height: 0;
	overflow-y: auto;
	margin: 0 !important;
	padding: 0 8px 8px !important;
	list-style: none !important;
	overscroll-behavior: contain;
}
.kdf-bell-list li { margin: 0 !important; padding: 0 !important; list-style: none !important; }
.kdf-bell-list li::before { display: none !important; }
.kdf-bell-list .kdf-bell-empty { padding: 36px 16px !important; color: var(--kn-muted); font-size: 14px; text-align: center; }

.kdf-nitem-link,
.kdf-ntoast {
	position: relative;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 8px;
	border-radius: 10px;
	color: var(--kn-dark) !important;
	text-decoration: none !important;
	transition: background .12s ease;
}
.kdf-nitem-link:hover { background: var(--kn-hover); }

.kdf-nitem-av { position: relative; flex: 0 0 52px; width: 52px; height: 52px; }
.kdf-nitem-av img {
	width: 52px !important;
	height: 52px !important;
	margin: 0 !important;
	border-radius: 50% !important;
	object-fit: cover;
	border: 0 !important;
	box-shadow: none !important;
	background: var(--kn-soft);
}
.kdf-nitem-body { flex: 1; min-width: 0; }
html body .kdf-nitem-text {
	margin: 0 !important;
	padding: 0 !important;
	font-size: 14px !important;
	line-height: 1.35 !important;
	color: #3a3d40 !important;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.kdf-nitem-text strong { font-weight: 700; color: var(--kn-dark); }
.kdf-nitem-time { display: block; margin-top: 3px; font-size: 12px; color: var(--kn-muted); }
.is-unread .kdf-nitem-text { color: var(--kn-dark) !important; }
.is-unread .kdf-nitem-time { color: var(--kn-teal); font-weight: 600; }
.kdf-nitem-dot { flex: 0 0 12px; width: 12px; height: 12px; border-radius: 50%; background: var(--kn-teal); }

/* ikona typu udalosti v rohu avatara */
.kdf-ntype {
	position: absolute;
	right: -3px;
	bottom: -3px;
	width: 24px;
	height: 24px;
	border: 2px solid #fff;
	border-radius: 50%;
	box-sizing: border-box;
	background: #8a9496 no-repeat center / 14px 14px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12 22a2.5 2.5 0 0 0 2.45-2h-4.9A2.5 2.5 0 0 0 12 22Zm7-6V11a7 7 0 0 0-5.5-6.84V3.5a1.5 1.5 0 0 0-3 0v.66A7 7 0 0 0 5 11v5l-1.7 1.7A1 1 0 0 0 4 19.4h16a1 1 0 0 0 .7-1.7Z'/%3E%3C/svg%3E");
}
.kdf-ntype-message {
	background-color: var(--kn-teal);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12 3C6.5 3 2 6.9 2 11.7c0 2.4 1.1 4.6 3 6.2V22l3.6-2c1 .3 2.2.5 3.4.5 5.5 0 10-3.9 10-8.8S17.5 3 12 3z'/%3E%3C/svg%3E");
}
.kdf-ntype-friend {
	background-color: #1877f2;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M9 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8zm0 2c-3.3 0-7 1.7-7 4v2h14v-2c0-2.3-3.7-4-7-4zm10-4V7h-2v3h-3v2h3v3h2v-3h3v-2z'/%3E%3C/svg%3E");
}
.kdf-ntype-group {
	background-color: #8b5cf6;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M16 11a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-8 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 2c-2.7 0-6 1.3-6 3.5V19h12v-2.5C14 14.3 10.7 13 8 13zm8 0c-.3 0-.7 0-1.1.1 1.2.8 2.1 2 2.1 3.4V19h5v-2.5c0-2.2-3.3-3.5-6-3.5z'/%3E%3C/svg%3E");
}
.kdf-ntype-comment {
	background-color: #45bd62;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white' fill-rule='evenodd'%3E%3Cpath d='M5 3h14a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H9l-5 4V5a2 2 0 0 1 1-2zm3 5v2h8V8zm0 4v2h5v-2z'/%3E%3C/svg%3E");
}
.kdf-ntype-mention {
	background-color: #007c93;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12 2a10 10 0 1 0 5 18.7l-1-1.7A8 8 0 1 1 20 12v1a2 2 0 0 1-4 0V7h-2v1a5 5 0 1 0 .9 7.3A4 4 0 0 0 22 13v-1A10 10 0 0 0 12 2zm0 13a3 3 0 1 1 0-6 3 3 0 0 1 0 6z'/%3E%3C/svg%3E");
}
.kdf-ntype-forum {
	background-color: #ffbd59;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M4 3h11a1 1 0 0 1 1 1v8a1 1 0 0 1-1 1H8l-5 4V4a1 1 0 0 1 1-1zm14 5h2a1 1 0 0 1 1 1v12l-4-3H9a1 1 0 0 1-1-1v-2h9a1 1 0 0 0 1-1z'/%3E%3C/svg%3E");
}
.kdf-ntype-like {
	background-color: var(--kn-red);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12 21s-7.5-4.6-9.5-9.2C1.2 8.6 3.4 5 7 5c2 0 3.4 1.1 5 3 1.6-1.9 3-3 5-3 3.6 0 5.8 3.6 4.5 6.8C19.5 16.4 12 21 12 21z'/%3E%3C/svg%3E");
}
.kdf-ntype-photo {
	background-color: #0ea5e9;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white' fill-rule='evenodd'%3E%3Cpath d='M9 4 7.2 6H4a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-3.2L15 4zm3 13a4 4 0 1 1 0-8 4 4 0 0 1 0 8z'/%3E%3C/svg%3E");
}

.kdf-bell-foot {
	display: flex;
	align-items: center;
	gap: 6px;
	flex: none; /* pätička sa nikdy nezmršťuje ani neprekrýva so zoznamom */
	position: relative;
	z-index: 1;
	min-height: 48px;
	padding: 8px 12px calc(8px + env(safe-area-inset-bottom, 0px));
	border-top: 1px solid var(--kn-line);
	background: #fff;
}
.kdf-bell-head, .kdf-bell-tabs { flex: none; }
html body .kdf-bell-tool {
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
	height: 32px;
	padding: 0 10px !important;
	border-radius: 16px !important;
	background: var(--kn-soft) !important;
	color: #4b5357 !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	line-height: 1 !important;
	min-width: 0;
	flex: 0 1 auto;
	white-space: nowrap;
}
.kdf-bell-tool span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html body .kdf-bell-tool:hover { background: #e4e6e9 !important; color: var(--kn-dark) !important; }
html body .kdf-bell-tool:disabled { opacity: 1; color: #6b7378 !important; cursor: help; }
html body .kdf-bell-tool[hidden] { display: none !important; }
.kdf-bell-tool svg { width: 16px; height: 16px; fill: currentColor; flex: none; }
.kdf-bell-foot .kdf-bell-all {
	flex: none;
	margin-left: auto;
	padding: 6px 4px;
	color: #007488 !important; /* tmavšia tyrkysová = kontrast 4.5:1 na bielej */
	font-size: 13px !important;
	font-weight: 700;
	line-height: 1.2 !important;
	letter-spacing: 0 !important;
	white-space: nowrap;
	text-decoration: none !important;
}
.kdf-bell-all { color: #007488 !important; font-weight: 700; white-space: nowrap; text-decoration: none !important; }
.kdf-bell-all:hover { color: #ffbd59 !important; }

/* ---------- toasty vľavo dole (nové upozornenie počas prezerania webu) ---------- */
.kdf-ntoasts {
	position: fixed;
	left: 16px;
	bottom: 16px;
	z-index: 99991;
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: 340px;
	max-width: calc(100vw - 32px);
	pointer-events: none;
}
.kdf-ntoast {
	pointer-events: auto;
	padding: 10px 34px 10px 10px;
	background: #fff;
	border: 1px solid var(--kn-line);
	border-radius: 12px;
	box-shadow: 0 8px 24px rgba(20, 30, 32, .16);
	opacity: 0;
	transform: translateX(-24px);
	transition: opacity .25s ease, transform .25s ease;
}
.kdf-ntoast.is-in { opacity: 1; transform: none; }
.kdf-ntoast:hover { background: #fafbfb; }
.kdf-ntoast .kdf-nitem-av,
.kdf-ntoast .kdf-nitem-av img { flex-basis: 44px; width: 44px !important; height: 44px !important; }
html body .kdf-ntoast-x {
	position: absolute;
	top: 6px;
	right: 6px;
	width: 24px;
	height: 24px;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 50% !important;
	background: transparent !important;
	color: var(--kn-muted) !important;
	font-size: 18px !important;
	line-height: 24px !important;
	box-shadow: none !important;
	cursor: pointer;
}
html body .kdf-ntoast-x:hover { background: var(--kn-soft) !important; }

/* ---------- ponuka na zapnutie systémových notifikácií ---------- */
.kdf-npush {
	position: fixed;
	top: 64px;
	right: 16px;
	z-index: 99992;
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
	gap: 12px;
	width: 360px;
	max-width: calc(100vw - 32px);
	padding: 14px;
	box-sizing: border-box;
	background: #fff;
	border: 1px solid var(--kn-line);
	border-radius: 14px;
	box-shadow: 0 12px 28px rgba(20, 30, 32, .16);
	opacity: 0;
	transform: translateY(-10px);
	transition: opacity .3s ease, transform .3s ease;
}
.kdf-npush.is-in { opacity: 1; transform: none; }
.kdf-npush-ico {
	flex: 0 0 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: rgba(0, 151, 178, .14);
	color: var(--kn-teal);
}
.kdf-npush-ico svg { width: 22px; height: 22px; fill: currentColor; }
.kdf-npush-text { flex: 1; min-width: 0; font-size: 13px; line-height: 1.4; color: var(--kn-muted); }
.kdf-npush-text strong { display: block; margin-bottom: 2px; font-size: 15px; color: var(--kn-dark); }
.kdf-npush-acts { flex: 0 0 100%; display: flex; justify-content: flex-end; gap: 8px; }
html body .kdf-npush-acts button {
	height: 34px;
	margin: 0 !important;
	padding: 0 16px !important;
	border: 0 !important;
	border-radius: 17px !important;
	box-shadow: none !important;
	font-family: inherit !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 1 !important;
	text-transform: none !important;
	cursor: pointer;
}
html body .kdf-npush-no { background: var(--kn-soft) !important; color: var(--kn-dark) !important; }
html body .kdf-npush-yes { background: var(--kn-teal) !important; color: #fff !important; }
html body .kdf-npush-yes:hover { background: #ffbd59 !important; }

/* ---------- mobil ---------- */
@media (max-width: 600px) {
	.kdf-hdr-icons { gap: 6px; }
	/* panel cez celú šírku pod hlavičkou */
	.kdf-bell-panel {
		position: fixed;
		top: 56px;
		left: 8px;
		right: 8px;
		width: auto;
		z-index: 100000; /* nad spodnou lištou (PWA banner, chat, odkazy pätičky) */
		max-height: calc(100vh - 72px);
		max-height: calc(100dvh - 72px - env(safe-area-inset-bottom, 0px)); /* dvh = bez lišty prehliadača */
	}
	.kdf-ntoasts { left: 8px; right: 8px; bottom: 8px; width: auto; max-width: none; }
	.kdf-npush { top: auto; bottom: 12px; right: 8px; left: 8px; width: auto; max-width: none; }
}

@media (prefers-reduced-motion: reduce) {
	.kdf-bell-btn.is-ringing svg,
	.kdf-bell-panel { animation: none; }
	.kdf-ntoast, .kdf-npush, .kdf-hdr-badge { transition: none; }
}

/* ---------- panel "Chaty" (ikona správ) - zdieľa vzhľad s panelom upozornení ---------- */
html body .kdf-msg-search {
	margin: 4px 16px 8px !important;
	width: auto !important;
	padding: 9px 14px !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: #f0f2f5 !important;
	font-size: 14px !important;
	color: var(--kn-dark) !important;
	box-shadow: none !important;
}
html body .kdf-msg-search:focus { outline: 2px solid rgba(0, 151, 178, .35) !important; }
.kdf-msg-list .kdf-msg-sec { padding: 12px 16px 4px !important; font-size: 13px; font-weight: 600; color: var(--kn-muted); }
.kdf-msg-item .kdf-nitem-av,
.kdf-msg-item .kdf-nitem-av img { flex-basis: 48px; width: 48px !important; height: 48px !important; }
html body .kdf-msg-name { font-weight: 600 !important; margin: 0 !important; }
.kdf-msg-item.is-unread .kdf-msg-name { font-weight: 700 !important; }
.kdf-msg-last { display: flex; min-width: 0; white-space: nowrap; }
.kdf-msg-excerpt { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.kdf-msg-item.is-unread .kdf-msg-last { color: var(--kn-dark); font-weight: 600; }
.kdf-msg-online {
	position: absolute;
	right: 1px;
	bottom: 1px;
	width: 13px;
	height: 13px;
	border-radius: 50%;
	background: #31a24c;
	border: 2px solid #fff;
}