/* ===== Widget ===== */
.nag-root {
	position: fixed;
	bottom: 20px;
	z-index: 2147483000;
	font-family: Arial, "Segoe UI", sans-serif !important;
	font-size: 15px !important;
	line-height: 1.4 !important;
	letter-spacing: normal !important;
	direction: rtl;
}
.nag-root.nag-left { left: 20px; }
.nag-root.nag-right { right: 20px; }
.nag-root *, .nag-root *::before, .nag-root *::after { box-sizing: border-box; }

/* Neutralize theme button styles (e.g. Hello Elementor's pink borders/hover) */
.nag-root button {
	-webkit-appearance: none !important;
	appearance: none !important;
	margin: 0 !important;
	text-transform: none !important;
	box-shadow: none;
	transition: background-color .15s, border-color .15s !important;
	font-family: Arial, "Segoe UI", sans-serif !important;
	line-height: 1.2 !important;
	min-height: 0;
	width: auto;
}

.nag-root .nag-toggle {
	width: 56px !important;
	height: 56px !important;
	border-radius: 50% !important;
	border: 3px solid #fff !important;
	background: #1a4fa0 !important;
	color: #fff !important;
	padding: 0 !important;
	box-shadow: 0 3px 10px rgba(0, 0, 0, .35) !important;
}
.nag-root .nag-toggle:hover, .nag-root .nag-toggle:focus { background: #123a78 !important; color: #fff !important; }

.nag-root .nag-close,
.nag-root .nag-close:hover,
.nag-root .nag-close:focus {
	background: transparent !important;
	border: 0 !important;
	color: #fff !important;
	padding: 0 4px !important;
	border-radius: 4px !important;
}

.nag-root .nag-font-row button,
.nag-root .nag-font-row button:hover,
.nag-root .nag-font-row button:focus {
	width: 40px !important;
	height: 36px !important;
	padding: 0 !important;
	border: 1px solid #b9c3d3 !important;
	border-radius: 8px !important;
	background: #f2f5fa !important;
	color: #1d1d1d !important;
}
.nag-root .nag-font-row button:hover { border-color: #1a4fa0 !important; }

.nag-root .nag-opt {
	display: flex !important;
	flex-direction: column !important;
	width: 100% !important;
	padding: 8px 6px !important;
	border: 2px solid #d5dbe5 !important;
	border-radius: 10px !important;
	background: #f7f9fc !important;
	color: #1d1d1d !important;
	white-space: normal !important;
}
.nag-root .nag-opt:hover, .nag-root .nag-opt:focus { border-color: #1a4fa0 !important; background: #f7f9fc !important; color: #1d1d1d !important; }
.nag-root .nag-opt[aria-pressed="true"],
.nag-root .nag-opt[aria-pressed="true"]:hover,
.nag-root .nag-opt[aria-pressed="true"]:focus {
	background: #1a4fa0 !important;
	border-color: #1a4fa0 !important;
	color: #fff !important;
}

.nag-root .nag-reset {
	width: 100% !important;
	padding: 10px !important;
	border: 0 !important;
	border-radius: 8px !important;
	background: #c62828 !important;
	color: #fff !important;
}
.nag-root .nag-reset:hover, .nag-root .nag-reset:focus { background: #a01f1f !important; color: #fff !important; }

.nag-toggle {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	border: 3px solid #fff;
	background: #1a4fa0;
	color: #fff;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 3px 10px rgba(0, 0, 0, .35);
	padding: 0;
	margin: 0;
}
.nag-toggle:hover { background: #123a78; }
.nag-toggle svg { width: 32px; height: 32px; fill: currentColor; }

.nag-root button:focus-visible,
.nag-root a:focus-visible {
	outline: 3px solid #ffbf00 !important;
	outline-offset: 2px;
}

.nag-panel {
	position: absolute;
	bottom: 68px;
	width: 320px;
	max-width: calc(100vw - 40px);
	max-height: calc(100vh - 110px);
	overflow-y: auto;
	background: #fff;
	color: #1d1d1d;
	border-radius: 12px;
	box-shadow: 0 6px 24px rgba(0, 0, 0, .3);
	padding: 0 0 12px;
	text-align: right;
}
.nag-left .nag-panel { left: 0; }
.nag-right .nag-panel { right: 0; }
.nag-panel[hidden] { display: none; }

.nag-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: #1a4fa0;
	color: #fff;
	padding: 12px 16px;
	border-radius: 12px 12px 0 0;
}
.nag-head h2 {
	margin: 0 !important;
	padding: 0 !important;
	font-size: 18px !important;
	font-weight: bold;
	color: #fff !important;
	background: none !important;
	font-family: inherit !important;
}
.nag-close {
	background: transparent;
	border: 0;
	color: #fff;
	font-size: 26px !important;
	line-height: 1;
	cursor: pointer;
	padding: 0 4px;
}

.nag-font-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 12px 16px 4px;
}
.nag-font-row span { font-weight: bold; }
.nag-font-row .nag-font-btns { display: flex; gap: 6px; }
.nag-font-row button {
	width: 40px;
	height: 36px;
	border: 1px solid #b9c3d3;
	border-radius: 8px;
	background: #f2f5fa;
	color: #1d1d1d;
	font-size: 18px !important;
	font-weight: bold;
	cursor: pointer;
}
.nag-font-level { min-width: 44px; text-align: center; font-weight: normal !important; }

.nag-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
	padding: 10px 16px;
}
.nag-opt {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	min-height: 70px;
	padding: 8px 6px;
	border: 2px solid #d5dbe5;
	border-radius: 10px;
	background: #f7f9fc;
	color: #1d1d1d;
	font-size: 14px !important;
	font-family: inherit !important;
	cursor: pointer;
	text-align: center;
}
.nag-opt:hover { border-color: #1a4fa0; }
.nag-opt[aria-pressed="true"] {
	background: #1a4fa0;
	border-color: #1a4fa0;
	color: #fff;
}
.nag-opt .nag-ico { font-size: 20px !important; line-height: 1; }

.nag-foot {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 4px 16px 0;
}
.nag-reset {
	width: 100%;
	padding: 10px;
	border: 0;
	border-radius: 8px;
	background: #c62828;
	color: #fff;
	font-size: 15px !important;
	font-weight: bold;
	cursor: pointer;
}
.nag-reset:hover { background: #a01f1f; }
.nag-statement {
	display: block;
	text-align: center;
	color: #1a4fa0 !important;
	text-decoration: underline !important;
	font-size: 14px !important;
	background: none !important;
}

/* ===== Page adjustments (never applied to the widget itself) ===== */

/* Filters */
html.nag-grayscale { filter: grayscale(100%); }
html.nag-invert { filter: invert(100%) hue-rotate(180deg); }
html.nag-grayscale.nag-invert { filter: grayscale(100%) invert(100%); }
html.nag-invert img, html.nag-invert video, html.nag-invert picture { filter: invert(100%) hue-rotate(180deg); }

/* High contrast */
html.nag-contrast body,
html.nag-contrast body *:not(.nag-root):not(.nag-root *) {
	background-color: #000 !important;
	background-image: none !important;
	color: #fff !important;
	border-color: #fff !important;
	text-shadow: none !important;
	box-shadow: none !important;
}
html.nag-contrast body a:not(.nag-root *),
html.nag-contrast body a:not(.nag-root *) * {
	color: #ffeb3b !important;
}
html.nag-contrast body button:not(.nag-root *),
html.nag-contrast body input:not(.nag-root *),
html.nag-contrast body select,
html.nag-contrast body textarea {
	border: 1px solid #fff !important;
}

/* Highlight links */
html.nag-links body a:not(.nag-root *) {
	text-decoration: underline !important;
	outline: 2px solid #ffbf00 !important;
	outline-offset: 1px;
	background-color: #fffbe0 !important;
	color: #0b3d91 !important;
}
html.nag-contrast.nag-links body a:not(.nag-root *) {
	background-color: #000 !important;
	color: #ffeb3b !important;
}

/* Highlight headings */
html.nag-headings body :is(h1, h2, h3, h4, h5, h6):not(.nag-root *) {
	outline: 2px dashed #1a4fa0 !important;
	outline-offset: 3px;
}

/* Readable font */
html.nag-readable body *:not(.nag-root):not(.nag-root *):not(i):not([class*="icon"]):not([class*="fa-"]):not([class*="dashicons"]) {
	font-family: Arial, Helvetica, sans-serif !important;
}

/* Text spacing */
html.nag-spacing body *:not(.nag-root):not(.nag-root *) {
	line-height: 1.8 !important;
	letter-spacing: .08em !important;
	word-spacing: .16em !important;
}

/* Stop animations */
html.nag-noanim *:not(.nag-root *),
html.nag-noanim *:not(.nag-root *)::before,
html.nag-noanim *:not(.nag-root *)::after {
	animation: none !important;
	transition: none !important;
	scroll-behavior: auto !important;
}

/* Big cursor */
html.nag-cursor, html.nag-cursor * {
	cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 24 24'%3E%3Cpath d='M4 2l16 10.5-7 1.5 4 7.5-3 1.5-4-7.5L4 20z' fill='%23000' stroke='%23fff' stroke-width='1.2'/%3E%3C/svg%3E") 4 2, auto !important;
}

@media (max-width: 480px) {
	.nag-root { bottom: 12px; }
	.nag-root.nag-left { left: 12px; }
	.nag-root.nag-right { right: 12px; }
	.nag-toggle { width: 50px; height: 50px; }
	.nag-panel { bottom: 60px; max-width: calc(100vw - 24px); }
}

@media print {
	.nag-root { display: none !important; }
}