:root {
	--glow: 0 8px 25px rgba(var(--p), 0.4);
	--glow2: 0 10px 30px -8px rgba(var(--p), .45);
	--bg: #f8f9fa;
	--panel: #ffffff;
	--panel-tr: rgba(255, 255, 255, .92);
	--ring: 15, 23, 42;
	--ring-a: .12;
	--txt: #1e293b;
	--muted: #26303f;
	--muted-2: #343e4d;

	--p: 199, 44, 226;
	--bs-primary: #C72CE2;
	--bs-primary-text-emphasis: #C72CE2;
	--bs-primary-rgb: 199, 44, 226;
	--p-strong: 139, 31, 158;
	--p-stronger: 119, 26, 136;
	--hero-1: #471a57;
	--hero-2: #2d173a;
	--hero-3: #060107;
	--on-p: #ffffff;
	font-size: 10px;
}

[data-theme=dark] {
	--bg: #0d1114;
	--panel: #15191d;
	--panel-tr: rgba(16, 20, 23, .92);
	--ring: 255, 255, 255;
	--ring-a: .08;
	--txt: #e2e8f0;
	--muted: #bac4d3;
	--muted-2: #97a4b8;
}

* {
	box-sizing: border-box;
	scrollbar-width: thin;
	text-decoration: none;
	scrollbar-color: var(--scroll-bar-color) var(--scroll-bar-bg-color);
}

body {
	font-family: 'Vazirmatn', system-ui, sans-serif;
	background: var(--bg);
	color: var(--txt);
}

.font-heading,
h6,
h5,
h4,
h3,
h2,
h1,
.lalezar {
	font-family: 'Lalezar', 'Vazirmatn', sans-serif;
}

a {
	color: rgb(var(--p-strong));
}

a:hover {
	color: rgb(var(--p));
}

.text-p {
	color: rgb(var(--p));
}

.text-mut {
	color: var(--muted);
}

.text-mut2 {
	color: var(--muted-2);
}

.grid-c {
	display: grid;
	place-items: center;
}

.only-dark,
.only-light {
	position: absolute;
	transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
		opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1);
	transform: rotate(0deg) scale(1);
	opacity: 1;
}

.only-dark {
	transform: rotate(-180deg) scale(0);
	opacity: 0;
	pointer-events: none;
}

.only-light {
	transform: rotate(0deg) scale(1);
	opacity: 1;
}


[data-theme="dark"] .only-dark {
	transform: rotate(0deg) scale(1);
	opacity: 1;
}

[data-theme="dark"] .only-light {
	transform: rotate(-180deg) scale(0);
	opacity: 0;
	pointer-events: none;
}

header {
	background: var(--panel-tr);
	backdrop-filter: blur(11px);
}

.shell {
	margin-inline: auto;
	min-height: 100vh;
	background: var(--bg);
	padding-bottom: 118px;
	transition: background .4s;
}

.content-header {
	position: relative;
	padding: 0px 15px 10px 20px;
}

.surface {
	background: var(--panel);
	box-shadow: 0 0 0 1px rgba(var(--ring), var(--ring-a));
}

input[type="radio"],
input[type="checkbox"] {
	accent-color: rgb(var(--p));
	width: 1.76rem;
	height: 1.76rem;
	cursor: pointer;
	margin-left: 0.4rem;
	vertical-align: middle;
}

input[type='checkbox'][name*='['],
input[type='checkbox'].simple {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 11px;
	margin: 3px;
	border: none;
	border-radius: 11px;
	background: var(--panel);
	color: var(--muted);
	box-shadow: 0 0 0 1px rgba(var(--ring), var(--ring-a));
	box-sizing: border-box;
	cursor: pointer;
	vertical-align: middle;
	flex-shrink: 0;
	transition: .2s;
	touch-action: manipulation;
}

input[type='checkbox'][name*='[']:hover,
input[type='checkbox'].simple:hover {
	box-shadow: 0 0 0 1px rgba(var(--ring), calc(var(--ring-a) * 1.6));
}

input[type='checkbox'][name*='[']:focus-visible,
input[type='checkbox'].simple:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px rgba(var(--ring), calc(var(--ring-a) * 1.8));
}

input[type='checkbox'][name*='[']::after,
input[type='checkbox'].simple::after {
	content: "";
	display: block;
	width: 18px;
	height: 18px;
	background-color: var(--muted);
	-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>");
	mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>");
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: 18px 18px;
	mask-size: 18px 18px;
	opacity: 0;
	transform: scale(0.6);
	transition: opacity .15s ease, transform .15s ease;
}

input[type='checkbox'][name*='[']:checked::after,
input[type='checkbox'].simple:checked::after {
	opacity: 1;
	transform: scale(1);
}

input[type='checkbox'][name*='[']:checked,
input[type='checkbox'].simple:checked {
	color: var(--fg, var(--muted));
	box-shadow: 0 0 0 1px rgba(var(--ring), calc(var(--ring-a) * 2));
}

input[type='checkbox'][name*='[']:disabled,
input[type='checkbox'].simple:disabled {
	cursor: not-allowed;
	opacity: .5;
}

input[type='checkbox']:not([name*='[']):not([class*='simple']) {
	height: 40px;
	width: 55px;
	opacity: 0;
	margin-inline-end: 3px !important;
	margin-inline-start: -58px !important;
}

@media (prefers-reduced-motion: reduce) {

	input[type='checkbox'][name*='['],
	input[type='checkbox'].simple,
	input[type='checkbox'][name*='[']::after,
	input[type='checkbox'].simple::after {
		transition: none;
	}
}

.icon-btn,
.icon-text-btn,
.icon-block-btn {
	border-radius: 11px;
	background: var(--panel);
	color: var(--muted);
	box-shadow: 0 0 0 1px rgba(var(--ring), var(--ring-a));
	transition: .2s;
	cursor: pointer;
	position: relative;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	vertical-align: middle;
}

.icon-btn {
	padding: 11px;
	width: 40px;
	height: 40px;
}

.icon-text-btn {
	padding: 1rem 1.6rem;
}

.icon-block-btn {
	width: 100%;
	padding: 1.6rem 1.6rem;
	flex-direction: column;
}

.icon-block-btn>i {
	margin-bottom: 1.2rem;
	width: 44px;
	justify-content: center;
	align-items: center;
	height: 44px;
	display: inline-flex;
	border-radius: 10px;
	background-color: rgba(var(--p), 0.12);
	color: rgb(var(--p));
	font-size: 16px;
}

.icon-btn:hover,
.icon-text-btn:hover,
.icon-block-btn:hover {
	color: rgb(var(--p));
}

.icon-btn:active,
.icon-text-btn:active,
.icon-block-btn:active {
	transform: scale(.9);
}

.icon-btn.active,
.icon-text-btn.active,
.icon-block-btn.active {
	border: 1px solid var(rgb(--p));
	box-shadow: var(--glow);
}

i {
	display: inline-flex;
	justify-content: center;
	align-items: center;
}

.offcanvas-backdrop.show {
	opacity: 0.1;
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
}

.hero {
	height: 200px;
	border-radius: 2.4rem;
	position: relative;
	overflow: hidden;
	box-shadow: 0 0 0 1px rgba(var(--ring), var(--ring-a));
	transition: background .5s;
	background: radial-gradient(circle at 100% 0%, var(--hero-1) 0%, transparent 50%),
		radial-gradient(circle at 0% 100%, var(--hero-2) 0%, transparent 50%),
		linear-gradient(160deg, #0A0A0C 0%, #141418 55%, #1E1E22 100%);
}

.hero img {
	border-radius: 2.4rem;
	max-height: 150px;
}

img {
	border-radius: 2.4rem;
	max-width: 100%;
}

.hero::before {
	content: "";
	position: absolute;
	top: -25%;
	right: -70px;
	height: 100%;
	aspect-ratio: 1/1;
	background: radial-gradient(circle, var(--hero-1) 0%, transparent 70%);
	pointer-events: none;
}

.slide {
	position: absolute;
	inset: 0;
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	align-items: center;
	gap: 0.8rem;
	padding: 0.64rem 3.84rem 0.64rem 2.24rem;
	transition: opacity .7s ease, transform .7s ease;
	opacity: 0;
	transform: scale(.95);
	pointer-events: none;
}

.slide.on {
	opacity: 1;
	transform: scale(1);
	pointer-events: auto;
}

.hero-title {
	font-family: 'Lalezar', 'Vazirmatn', sans-serif;
	font-size: 27px;
	line-height: 1.55;
	color: #fff;
	margin: 0;
}

.hero-sub {
	line-height: 1.9;
	color: rgba(226, 232, 240, .85);
	margin: 0;
}

.btn-cta {
	display: inline-flex;
	align-items: center;
	gap: 0.8rem;
	background: rgb(var(--p));
	color: var(--on-p);
	border: none;
	border-radius: 1.2rem;
	padding: 1.04rem 2rem;
	font-size: 13px;
	font-weight: 700;
	box-shadow: var(--glow);
	transition: .25s;
	cursor: pointer;
}

.btn-cta:hover {
	filter: brightness(1.1);
}

.btn-cta:active {
	transform: scale(.95);
}

.dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	border: none;
	padding: 0;
	background: rgba(255, 255, 255, .25);
	transition: .3s;
	cursor: pointer;
}

.dot.on {
	background: rgb(var(--p));
	box-shadow: 0 0 10px rgba(var(--p), .7);
}

.mod-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	border: none;
	background: var(--panel);
	color: rgb(var(--p));
	border-radius: 1.6rem;
	padding: 1.44rem 0.96rem;
	box-shadow: 0 0 0 1px rgba(var(--ring), var(--ring-a));
	transition: transform .3s, box-shadow .3s, background .4s;
	cursor: pointer;
	height: 100%;
	justify-content: space-between;
}

.mod-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 0 0 1px rgba(var(--p), .45), 0 14px 26px -14px rgba(var(--p), .4);
}

.mod-card .chev {
	align-self: flex-end;
	color: var(--muted-2);
	font-size: 10px;
	transition: .2s;
}

.mod-card:hover .chev {
	color: rgb(var(--p));
	transform: translateX(-3px);
}

.mod-icon {
	font-size: 26px;
	color: rgb(var(--p));
	line-height: 36px;
}

.mod-title {
	line-height: 1.7;
	font-weight: 500;
}

.tile {
	aspect-ratio: 1;
	width: 100%;
	display: grid;
	place-items: center;
	border: none;
	border-radius: 1.6rem;
	background: var(--panel);
	font-size: 22px;
	color: var(--txt);
	box-shadow: 0 0 0 1px rgba(var(--ring), var(--ring-a));
	transition: .2s;
	cursor: pointer;
}

.tile:hover {
	color: rgb(var(--p));
	box-shadow: 0 0 0 1px rgba(var(--p), .45);
}

.tile:active {
	transform: scale(.9);
}

.iconbg {
	width: 56px;
	height: 56px;
	border-radius: 1.6rem;
	display: grid;
	place-items: center;
	color: #fff;
	font-size: 22px;
	box-shadow: var(--glow);
	background: linear-gradient(135deg, rgb(var(--p-stronger)), rgb(var(--p-strong)) 55%, rgb(var(--p)) 100%);
}


.iconbg img {
	width: 84%;
}

.alert-card {
	display: flex;
	align-items: center;
	gap: 1.6rem;
	width: 100%;
	border: none;
	text-align: right;
	border-radius: 1.76rem;
	padding: 1.6rem;
	box-shadow: 0 0 0 1px rgba(var(--ring), var(--ring-a));
	transition: .3s;
	cursor: pointer;
}

.alert-card:hover {
	box-shadow: 0 0 0 1px rgba(var(--p), .4), 0 14px 30px -18px rgba(var(--p), .4);
}

.pulse-dot {
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: rgb(var(--p));
	box-shadow: 0 0 9px 2px rgba(var(--p), .98);
}

.bottom-nav {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	margin-inline: auto;
	max-width: 448px;
	background-color: rgba(255, 255, 255, 0.7);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	box-shadow: 0 0 8px rgba(var(--ring), var(--ring-a));
	border-radius: 2.4rem 2.4rem 0 0;
	z-index: 1040;
}

[data-bs-theme="dark"] .bottom-nav {
	background-color: rgba(2, 2, 2, 0.7);

}

.nav-b {
	width: 20%;
	contain: layout;
	max-width: 20%;
	border: none;
	background: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	font-weight: 500;
	color: var(--muted-2);
	transition: .2s;
	padding: 0.64rem 0;
	cursor: pointer;
}

.nav-b i {
	font-size: 17px;
}

.nav-b:active {
	transform: scale(.9);
}

.nav-b.on {
	color: rgb(var(--p));
}

.badgecnt {
	position: absolute;
	top: 5px;
	right: 58%;
	width: 7px;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	font-size: xx-small;
	height: 7px;
	border-radius: 50%;
	color: var(--on-p);
	background: rgb(var(--p));
	border: 2px solid var(--bg);
	box-shadow: 0 0 0 2px rgba(10, 123, 90, .15);
}

#PoiAiModsGrid {
	max-height: 46vh;
	overflow-y: auto;
	overflow-x: visible;
	width: 100%;
}

.PoiAi-wrap {
	position: relative;
	display: flex;
	justify-content: center;
	flex: 1 1 0;
}

.PoiAi-wrap::before {
	content: '';
	position: absolute;
	top: -42px;
	width: 70px;
	height: 70px;
	border-radius: 50%;
	border: 1px solid rgba(var(--p), .5);
	animation: halo 2.6s ease-out infinite;
}

.PoiAi-btn {
	position: relative;
	width: 64px;
	height: 64px;
	min-width: 64px;
	min-height: 64px;
	max-width: 64px;
	max-height: 64px;
	margin-top: -38px;
	margin-bottom: 16px;
	border-radius: 50%;
	overflow: hidden;
	border: 1px solid rgba(var(--p), .55);
	box-shadow: var(--glow), inset 0 1px 0 rgba(255, 255, 255, .35), inset 0 -8px 14px rgba(0, 0, 0, .28);
	transition: transform .25s, box-shadow .25s;
	display: grid;
	place-items: center;
	cursor: pointer;
}

[data-theme=dark] .PoiAi-btn {
	background: linear-gradient(140deg, rgba(var(--p), .4), rgba(var(--p-strong), .25) 55%, rgba(255, 255, 255, .08)),
		linear-gradient(140deg, rgba(0, 0, 0, 0.9));
}

[data-theme=light] .PoiAi-btn {
	background: linear-gradient(140deg, rgba(var(--p), 0.9), rgba(var(--p-strong), 0.9));
}

.PoiAi-btn:active {
	transform: scale(.9);
}

.PoiAi-btn.active {
	box-shadow: 0 0 0 1px rgba(var(--p), .5), var(--glow), inset 0 1px 0 rgba(255, 255, 255, .35);
}

.PoiAi-txt {
	font-family: 'Lalezar', 'Vazirmatn', sans-serif;
	font-size: 17px;
	line-height: 1;
	color: #fff;
	text-shadow: 0 0 14px rgba(var(--p), .95);
	letter-spacing: 1px;
	position: relative;
	z-index: 2;
	transform: translateY(1px);
}

.spark {
	position: absolute;
	animation: floaty 3.2s ease-in-out infinite;
}

.spark svg {
	fill: rgb(var(--p));
}

.spark.w svg {
	fill: #fff;
}

@keyframes floaty {

	0%,
	100% {
		transform: translateY(0) scale(1);
		opacity: .9;
	}

	50% {
		transform: translateY(-20px) scale(.55);
		opacity: .25;
	}
}

@keyframes halo {
	0% {
		transform: scale(.9);
		opacity: 1;
	}

	100% {
		transform: scale(1.35);
		opacity: 0;
	}
}

.PoiAi-panel {
	position: fixed;
	bottom: 92px;
	left: 50%;
	transform: translate(-50%, 16px);
	width: min(424px, calc(100vw - 24px));
	background: var(--panel-tr);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	border-radius: 2.08rem;
	box-shadow: 0 0 0 1px rgba(var(--p), .4), var(--glow), 0 18px 40px -18px rgba(0, 0, 0, .6);
	opacity: 0;
	pointer-events: none;
	transition: .35s ease;
	z-index: 1050;
}

.PoiAi-panel.on {
	opacity: 1;
	transform: translate(-50%, 0);
	pointer-events: auto;
}

.PoiAi-input {
	background: rgba(var(--ring), .06);
	border: 1px solid rgba(var(--ring), .12);
	border-radius: 1.44rem;
	color: var(--txt);
	font-size: 13px;
	padding: 1.12rem 1.6rem;
}

.PoiAi-input:focus {
	background: rgba(var(--ring), .08);
	border-color: rgba(var(--p), .6);
	box-shadow: 0 0 0 3px rgba(var(--p), .2);
	color: var(--txt);
}

.PoiAi-input::placeholder {
	color: var(--muted-2);
}

.PoiAi-send {
	width: 44px;
	height: 44px;
	flex-shrink: 0;
	border: none;
	border-radius: 1.44rem;
	background: rgb(var(--p));
	color: var(--on-p);
	box-shadow: var(--glow);
	transition: .2s;
	display: grid;
	place-items: center;
	cursor: pointer;
}

.PoiAi-send:active {
	transform: scale(.9);
}

.offcanvas {
	background: var(--bg);
	color: var(--txt);
}

#drawerOff {
	width: 300px;
	border-radius: 0 3.2rem 3.2rem 0;
}

#profileOff {
	width: 300px;
	border-radius: 3.2rem 0 0 3.2rem;
}

#sheetOff {
	height: auto;
	max-height: 85vh;
	border-radius: 3.2rem 3.2rem 0 0;
}

.handle {
	width: 42px;
	height: 5px;
	border-radius: 999px;
	background: rgba(var(--ring), .2);
	margin: 12px auto 4px;
}

.acc {
	background: var(--panel);
	border-radius: 1.76rem;
	box-shadow: 0 0 0 1px rgba(var(--ring), var(--ring-a));
	overflow: hidden;
	transition: box-shadow .3s;
}

.acc:has(.acc-btn[aria-expanded=true]) {
	box-shadow: 0 0 0 1px rgba(var(--p), .45);
}

.acc-btn {
	display: flex;
	align-items: center;
	gap: 1.2rem;
	width: 100%;
	padding: 1.44rem 1.6rem;
	border: none;
	background: none;
	color: var(--txt);
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
}

.acc-ic {
	width: 40px;
	height: 40px;
	border-radius: 1.28rem;
	display: grid;
	place-items: center;
	background: rgba(var(--p), .12);
	color: rgb(var(--p));
	flex-shrink: 0;
}

.chev {
	transition: .3s;
	color: var(--muted-2);
	font-size: 11px;
}

.acc-btn[aria-expanded=true] .chev {
	transform: rotate(-90deg);
	color: rgb(var(--p));
}

.bullet {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: rgb(var(--p));
	flex-shrink: 0;
}

.swatch {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	border: none;
	padding: 0;
	transition: .2s;
	box-shadow: 0 0 0 2px var(--bg), 0 0 0 4px rgba(var(--ring), .18);
	cursor: pointer;
}

.swatch.on {
	box-shadow: 0 0 0 2px var(--bg), 0 0 0 4px rgb(var(--p));
	transform: scale(1.12);
}

.color-wrap {
	position: relative;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	overflow: hidden;
	box-shadow: 0 0 0 2px var(--bg), 0 0 0 4px rgba(var(--ring), .18);
	flex-shrink: 0;
}

.color-wrap input {
	position: absolute;
	inset: -30%;
	width: 160%;
	height: 160%;
	border: none;
	padding: 0;
	cursor: pointer;
}

.menu-link {
	display: flex;
	align-items: center;
	gap: 1.28rem;
	border: none;
	background: none;
	width: 100%;
	padding: 1.28rem 1.44rem;
	border-radius: 1.44rem;
	font-size: 13px;
	font-weight: 500;
	color: var(--txt);
	transition: .2s;
	text-align: right;
	cursor: pointer;
}

.menu-link:hover {
	background: rgba(var(--ring), .06);
	color: rgb(var(--p));
}

.menu-link i {
	width: 20px;
	color: rgb(var(--p));
}

.toast-c {
	position: fixed;
	bottom: 160px;
	left: 50%;
	transform: translate(-50%, 16px);
	z-index: 2000;
	background: rgba(15, 23, 42, .92);
	color: #fff;
	border-radius: 999px;
	padding: 0.96rem 2.08rem;
	opacity: 0;
	pointer-events: none;
	backdrop-filter: blur(8px);
	transition: .3s;
	box-shadow: 0 0 0 1px rgba(var(--p), .35);
	max-width: calc(100vw - 32px);
	text-align: center;
}

.toast-c.on {
	opacity: 1;
	transform: translate(-50%, 0);
}

.quick-chip {
	border: 1px solid rgba(var(--p-stronger), .12);
	border-color: rgba(var(--p), .6);
	background: rgba(var(--p), .06);
	color: rgb(var(--p));
}

.quick-chip:hover {
	border-color: rgba(var(--p), .4);
	background: rgba(var(--p), .12);
	color: rgb(var(--p));
}

.PoiAi-mod-tile {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.8rem;
	padding: 1.44rem 0.8rem;
	border-radius: 1.6rem;
	background: var(--panel);
	box-shadow: 0 0 0 1px rgba(var(--ring), var(--ring-a));
	color: var(--txt);
	transition: .25s;
	text-align: center;
}

.PoiAi-mod-tile:hover {
	transform: translateY(-3px);
	box-shadow: 0 0 0 1px rgba(var(--p), .45), 0 12px 24px -14px rgba(var(--p), .4);
	color: rgb(var(--p));
}

.PoiAi-mod-tile i {
	font-size: 20px;
	color: rgb(var(--p));
}

.PoiAi-mod-tile span {
	line-height: 1.6;
}

.avatar-circle {
	width: 84px;
	height: 84px;
	border-radius: 50%;
	background: linear-gradient(135deg, rgb(var(--p-stronger)), rgb(var(--p-strong)) 55%, rgb(var(--p)) 100%);
	display: grid;
	place-items: center;
	color: #fff;
	font-size: 34px;
	box-shadow: var(--glow);
	overflow: hidden;
}

.reveal {
	opacity: 0;
	filter: blur(8px);
	transform: translateY(18px);
	transition: opacity .7s ease, filter .7s ease, transform .7s ease;
}

.reveal.on {
	opacity: 1;
	filter: blur(0);
	transform: translateY(0);
}

@media (max-width: 575px) {
	.hero-title {
		font-size: 22px;
	}

	.mod-card {
		padding: 1.12rem 0.8rem;
	}

	.mod-icon {
		font-size: 22px;
	}

	.tile {
		font-size: 18px;
	}

	.bottom-nav {
		padding-bottom: env(safe-area-inset-bottom);
	}
}

@media (min-width: 576px) and (max-width: 768px) {
	.hero-title {
		font-size: 25px;
	}
}

.mod-card {
	background: var(--panel);
}

.tile {
	background: var(--panel);
}

.alert-card {
	background: var(--panel);
}

.acc {
	background: var(--panel);
}

[data-theme=dark] .menu-link {
	color: var(--txt);
}

#drawerMenu li,
.PoiAi-mod-tile span,
.quick-chip {
	font-size: 1.32rem;
}

@media print {

	.bottom-nav,
	.PoiAi-panel,
	.toast-c,
	.offcanvas {
		display: none !important;
	}

	.shell {
		padding-bottom: 0;
	}
}

#PoiAiForm {
	position: fixed;
	z-index: 9999;
	bottom: 10px;
	width: calc(100% - 4.8rem);
}

.offcanvas-body {
	overflow-y: auto;

	--fade-size: 30px;
	--fade-end: 5px;

	mask-image: linear-gradient(to bottom,
			transparent 0,
			black var(--fade-size),
			black calc(100% - var(--fade-size)),
			rgba(0, 0, 0, 0) calc(100% - var(--fade-end)));

	-webkit-mask-image: linear-gradient(to bottom,
			transparent 0,
			black var(--fade-size),
			black calc(100% - var(--fade-size)),
			rgba(0, 0, 0, 0) calc(100% - var(--fade-end)));
}

#ajaxcontent {
	padding: 0px 10px 100px 10px;
}

.hscroll {
	--fade-left: 80px;
	--fade-right: 80px;

	overflow-x: auto;
	overflow-y: hidden;
	scrollbar-width: none;
	-ms-overflow-style: none;

	-webkit-mask-image: linear-gradient(to right,
			transparent 0,
			black var(--fade-left),
			black calc(100% - var(--fade-right)),
			transparent 100%);
	mask-image: linear-gradient(to right,
			transparent 0,
			black var(--fade-left),
			black calc(100% - var(--fade-right)),
			transparent 100%);
}

.hscroll::-webkit-scrollbar {
	display: none;
}

@media (hover: hover) and (pointer: fine) {
	.hscroll {
		cursor: w-resize;
	}

	.hscroll.is-dragging {
		cursor: grabbing;
		user-select: none;
		scroll-behavior: auto;
	}
}

.hscroll.at-start {
	--fade-left: 0px;
}

.hscroll.at-end {
	--fade-right: 0px;
}

[dir="rtl"] .hscroll.at-start {
	--fade-right: 0px;
	--fade-left: 80px;
}

[dir="rtl"] .hscroll.at-end {
	--fade-left: 0px;
	--fade-right: 80px;
}

.hscroll.at-start.at-end {
	--fade-left: 0px;
	--fade-right: 0px;
}

content.content-header>h1 {
	color: var(--txt) !important;
	font-size: 2rem !important;
	font-weight: 700 !important;
	letter-spacing: -0.02em;
}

fieldset {
	border: 1px solid rgba(var(--ring), var(--ring-a));
	border-radius: 1.6rem;
	padding: 2.4rem;
	margin: 1.6rem 0;
	background: var(--panel);
	box-shadow: 0 0 0 1px rgba(var(--ring), var(--ring-a));
}

legend {
	font-family: 'Lalezar', 'Vazirmatn', sans-serif;
	font-size: 1.76rem;
	color: rgb(var(--p));
	padding: 0 1.2rem;
	background: var(--panel);
	border-radius: 0.8rem;
	margin-bottom: 0.8rem;
}


label {
	display: inline-flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.8rem;
	color: var(--txt);
	font-size: 1.44rem;
	margin: 0.56rem 0;
}


label:has(> input:only-child),
label:has(> select:only-child) {
	display: inline-flex;
	padding: 0.8rem 1.6rem;
}


input:not([type]),
input[type="text"],
input[type="file"],
input[type="time"],
input[type="url"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="date"],
select,
textarea {
	max-width: 100%;
	padding: 0.96rem 1.44rem;
	border: 1px solid rgba(var(--ring), var(--ring-a));
	border-radius: 1.2rem;
	background-color: var(--bg);
	color: var(--txt);
	font-family: 'Vazirmatn', system-ui, sans-serif;
	font-size: 1.44rem;
	transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
	outline: none;
}

input[type="text"][size],
input[type="tel"][size] {
	max-width: 100%;
}

input[type="text"]:focus,
input[type="tel"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="date"]:focus,
input[type="search"]:focus,
select:focus,
textarea:focus {
	border-color: rgba(var(--p), 0.6);
	box-shadow: 0 0 0 3px rgba(var(--p), 0.15);
	background-color: var(--panel);
}


select:not([multiple]) {
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%2364748b' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10l-5 5z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: left 1.2rem center;
	padding-left: 3.2rem;
	cursor: pointer;
}

a.button,
input[type="submit"],
input[type="button"],
input[type="reset"],
button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.8rem;
	padding: 0.96rem 2.4rem;
	border: none;
	border-radius: 1.2rem;
	background: rgb(var(--p));
	color: var(--on-p);
	font-family: 'Vazirmatn', system-ui, sans-serif;
	font-size: 1.44rem;
	font-weight: 700;
	cursor: pointer;
	transition: filter 0.2s, transform 0.1s, box-shadow 0.2s;
}

a.button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
button:hover {
	filter: brightness(1.1);
}

a.button:active,
input[type="submit"]:active,
input[type="button"]:active,
input[type="reset"]:active,
button:active {
	transform: scale(0.96);
}

section.content input[type="submit"],
section.content input[type="button"],
section.content input[type="reset"],
section.content button {
	box-shadow: 0 4px 12px -4px rgba(var(--p), 0.4);
}

section.content input[type="button"]:hover,
section.content input[type="submit"]:hover,
section.content input[type="reset"]:hover,
section.content button:hover {
	box-shadow: 0 6px 16px -4px rgba(var(--p), 0.5);
}

a:has(> input[type="button"]),
a:has(> input[type="submit"]) {
	text-decoration: none;
	display: inline-block;
}


table {
	width: 100%;
	border-collapse: separate !important;
	border-spacing: 0 !important;
	margin: 1.6rem 0;
	background: var(--panel);
	border-radius: 1.6rem;
	box-shadow: 0 0 0 1px rgba(var(--ring), var(--ring-a));
	border: 1px solid rgba(var(--ring), var(--ring-a));
}

th,
td {
	padding: 1.36rem 1.6rem;
	text-align: right;
	border-bottom: 1px solid rgba(var(--ring), var(--ring-a));
	color: var(--txt);
	font-size: 1.44rem;
}

th {
	background: rgba(var(--p), 0.08);
	color: rgb(var(--p));
	font-weight: 700;
}

tbody tr:hover {
	background: rgba(var(--p), 0.04);
	transition: background 0.2s;
}

table tr:last-child>td,
table tr:last-child>th {
	border-bottom: none;
}

:where(table > thead:first-child > tr:first-child,
	table > tbody:first-child > tr:first-child,
	table > tfoot:first-child > tr:first-child,
	table > tr:first-child)> :first-child {
	border-top-right-radius: 1.6rem;
}

:where(table > thead:first-child > tr:first-child,
	table > tbody:first-child > tr:first-child,
	table > tfoot:first-child > tr:first-child,
	table > tr:first-child)> :last-child {
	border-top-left-radius: 1.6rem;
}

:where(table > tbody:last-child > tr:last-child,
	table > tfoot:last-child > tr:last-child,
	table > thead:last-child > tr:last-child,
	table > tr:last-child)> :first-child {
	border-bottom-right-radius: 1.6rem;
}

:where(table > tbody:last-child > tr:last-child,
	table > tfoot:last-child > tr:last-child,
	table > thead:last-child > tr:last-child,
	table > tr:last-child)> :last-child {
	border-bottom-left-radius: 1.6rem;
}

.box {
	background: var(--panel) !important;
	border-radius: 1.6rem;
	box-shadow: 0 0 0 1px rgba(var(--ring), var(--ring-a));
	margin-bottom: 1.6rem;
	overflow: hidden;
	transition: transform 0.2s, box-shadow 0.2s;
}

.box:hover {
	box-shadow: 0 8px 24px -8px rgba(var(--p), 0.2), 0 0 0 1px rgba(var(--p), 0.3);
}

.box-header {
	padding: 1.6rem;
	border-bottom: 1px solid rgba(var(--ring), var(--ring-a));
	color: var(--txt);
	font-weight: 700;
	font-size: 1.6rem;
	background: rgba(var(--p), 0.05);
	height: auto !important;
}

.box-info {
	border-top: 3px solid rgb(var(--p));
}

.box-header > h6 {
	display: inline-block;
	padding-inline-start: .5rem;
	padding-inline-end: .5rem;
}
.box-footer {
	padding: 1rem 1.5rem;
}
.dateinputs input[type="tel"] {
	width: 4.8rem !important;
	text-align: center !important;
}

.dateinputs input[type="tel"]:nth-of-type(3) {
	min-width: 6.34rem !important;
}

.dateinputhide {
	display: none !important;
}

input[type="hidden"] {
	display: none;
}

#ajaxcontent form {
	padding: 2.4rem;
	background: var(--panel);
	border-radius: 1.6rem;
}

form br {
	display: block;
	content: "";
	margin-top: 0.4rem;
}

.tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin-bottom: 0;
	border-radius: 1.6rem;
	border-bottom: 1px solid rgba(var(--ring), var(--ring-a));
}

.tabs>a:nth-child(2n-1) {
	margin: 0 1.6rem 0 1.6rem;
}

.tabs>a:nth-child(2n) {
	margin: 0 -1.6rem 0 -1.6rem;
}

.tabs>a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 1.2rem 2.4rem;
	border-radius: 1.2rem 1.2rem 0 0;
	background: rgba(var(--ring), calc(var(--ring-a) * 0.1));
	color: var(--muted);
	font-family: 'Vazirmatn', system-ui, sans-serif;
	font-size: 1.52rem;
	font-weight: 500;
	text-decoration: none !important;
	border: 1px solid rgba(var(--ring), var(--ring-a));
	border-bottom: none;
	cursor: pointer;
	transition: all 0.25s ease;
	position: relative;
	top: 4px;
}

.tabs>a:hover {
	color: rgb(var(--p));
	background: rgba(var(--p), 0.06);
}

.tabs>a.selected {
	color: rgb(var(--p));
	background: var(--panel);
	border-color: rgba(var(--ring), var(--ring-a));
	border-bottom-color: var(--panel);
	font-weight: 700;
	box-shadow: 0 -4px 12px -6px rgba(var(--p), 0.2);
	z-index: 2;
}

.tabs>.page {
	width: 100%;
	padding: 2.4rem;
	background: var(--panel);
	border-radius: 1.6rem;
	border: 1px solid rgba(var(--ring), var(--ring-a));
	box-shadow: 0 8px 24px -8px rgba(var(--ring), 0.1);
	order: 10;
	margin-top: -1px;
}

.tabs>.page.active {
	display: block !important;
	animation: fadeInTab 0.3s ease-out;
}

[type="text"][name="y"] {
	width: 90px;
}

@media screen and (max-width: 780px) {

	input:not([type]),
	input[type="text"],
	input[type="file"],
	input[type="time"],
	input[type="url"],
	input[type="email"],
	input[type="tel"],
	input[type="password"],
	input[type="email"],
	input[type="number"],
	input[type="search"],
	input[type="date"],
	select,
	textarea {
		width: 100%;
	}

	input[type="text"][size],
	input[type="tel"][size] {
		width: 100%;
	}
}


.bg-pinkGrad {
	linear-gradient(to bottom, #FD49A8 0%, #FD2980 10%, #FC1A58 20%, #FA1F41 30%, #FA2733 40%, #FB3D26 50%, #FC541F 60%, #FE6A1E 70%, #FE771D 80%, #FF861B 90%, #FF8F1B 100%);
}

.bg-soft-lilac-dream {
	background: linear-gradient(135deg, #c7a9e9, #a1c4fd);
}

.bg-peachy-blush {
	background: linear-gradient(135deg, #ffd3a5, #fd6585);
}

.bg-minty-fresh {
	background: linear-gradient(135deg, #d4fc79, #96e6a1);
}

.bg-serene-seafoam {
	background: linear-gradient(135deg, #81fbb8, #28c76f);
}

.bg-lavender-breeze {
	background: linear-gradient(135deg, #8a84e2, #84fab0);
}

.bg-lemon-sorbet {
	background: linear-gradient(135deg, #fddb92, #d1fdff);
}

.bg-cotton-candy {
	background: linear-gradient(135deg, #fdbb9b, #ff80a0);
}

.bg-bubblegum-sky {
	background: linear-gradient(135deg, #a1c4fd, #c2e9fb);
}

.bg-icy-mint {
	background: linear-gradient(135deg, #8cfac7, #65fecd);
}

.bg-rosewater {
	background: linear-gradient(135deg, #e66767, #e65c6e);
}

.bg-creamsicle {
	background: linear-gradient(135deg, #ffb6b9, #ff9e8f);
}

.bg-lilac-lemonade {
	background: linear-gradient(135deg, #cea0e3, #fcb4d5);
}

.bg-pistachio-delight {
	background: linear-gradient(135deg, #98f898, #2ec72e);
}

.bg-coral-breeze {
	background: linear-gradient(135deg, #ff6b6b, #ffb66b);
}

.bg-dreamy-sky {
	background: linear-gradient(135deg, #77a1d3, #79cbca);
}

.bg-mint-macaron {
	background: linear-gradient(135deg, #4facfe, #00f2fe);
}

.bg-lavender-mist {
	background: linear-gradient(135deg, #b993d6, #8ca6db);
}

.bg-tangerine-twist {
	background: linear-gradient(135deg, #ff9a8b, #ff6a88);
}

.bg-minty-sky {
	background: linear-gradient(135deg, #a1c4fd, #c2e9fb);
}

.bg-peach-parfait {
	background: linear-gradient(135deg, #ffd3a5, #fd6585);
}

.bg-tranquil-tides {
	background: linear-gradient(135deg, #3c67c1, #99c2e2);
}

.bg-lemon-lavender {
	background: linear-gradient(135deg, #fccb90, #d57eeb);
}

.bg-minty-melon {
	background: linear-gradient(135deg, #d4fc79, #96e6a1);
}

.bg-rose-quartz {
	background: linear-gradient(135deg, #aa9cfc, #fc9ce7);
}

.bg-sunflower-serenity {
	background: linear-gradient(135deg, #f6d365, #fda085);
}

.bg-minty-peach {
	background: linear-gradient(135deg, #a2c0cc, #fceea7);
}

.bg-lavender-lemonade {
	background: linear-gradient(135deg, #b39ddb, #e6c3f6);
}

.bg-peachy-sunset {
	background: linear-gradient(135deg, #f8a5c2, #fbbc8a);
}

.bg-pastel-ocean {
	background: linear-gradient(135deg, #a8edea, #fed6e3);
}

.bg-melon-mist {
	background: linear-gradient(135deg, #f794a4, #fdd6bd);
}

.bg-minty-dream {
	background: linear-gradient(135deg, #a1c4fd, #c2e9fb);
}

.bg-blueberry-breeze {
	background: linear-gradient(135deg, #636fa4, #e8cbc0);
}

.bg-lemon-lime {
	background: linear-gradient(135deg, #c0eb78, #d1f5d3);
}

.bg-cotton-candy-sky {
	background: linear-gradient(135deg, #ffb6d1, #2470a0);
}

.bg-mint-chocolatte {
	background: linear-gradient(135deg, #89f7fe, #66a6ff);
}

.bg-lavender-fields {
	background: linear-gradient(135deg, #d4a5a5, #d8b6b6);
}

.bg-lemon-sorbet-2 {
	background: linear-gradient(135deg, #fddb92, #d1fdff);
}

.bg-sweet-sunrise {
	background: linear-gradient(135deg, #ff5f6d, #ffc371);
}

.bg-blueberry-lemonade {
	background: linear-gradient(135deg, #667eea, #764ba2);
}

.bg-peaches-n-cream {
	background: linear-gradient(135deg, #ffd86f, #fc6262);
}

.bg-minty-marshmallow {
	background: linear-gradient(135deg, #5edfff, #b8d3fe);
}

.bg-lavender-lush {
	background: linear-gradient(135deg, #a1c4fd, #c2e9fb);
}

.bg-vanilla-rose {
	background: linear-gradient(135deg, #f3e7e7, #fc9d9d);
}

.bg-lemon-zest {
	background: linear-gradient(135deg, #fdfc47, #24fe41);
}

.bg-minty-mango {
	background: linear-gradient(135deg, #f1c40f, #f9e98d);
}

.bg-lavender-love {
	background: linear-gradient(135deg, #e3a6ae, #c9c8e1);
}

.bg-blueberry-bliss {
	background: linear-gradient(135deg, #9cd8db, #93a5cf);
}

.bg-marshmallow-sky {
	background: linear-gradient(135deg, #50a7c2, #53e3a6);
}

.bg-honey-lavender {
	background: linear-gradient(135deg, #8e44ad, #f39c12);
}

.bg-pistachio-paradise {
	background: linear-gradient(135deg, #d1fbd0, #fbd1b7);
}

@keyframes fadeInTab {
	from {
		opacity: 0;
		transform: translateY(6px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@media screen and (max-width: 740px) {
	.elfinder-navbar {
		max-width: 100px !important;
	}

	label {
		width: 100%;
	}
}

/* twsh.css */
.poioverlay {
	background-color: rgba(34, 34, 34, 0.2);
}

.poiw100 {
	width: 99%;
	margin-right: auto !important;
	margin-left: auto !important;
}



.workbook {
	background-color: #ffffff;
	color: #333333 !important;
}

.stdslist {
	border: 1px solid #C0C0C0;
}

td {
	vertical-align: top;
}

.wh {
	border-top-width: 0px;
	border-bottom-width: 0px;
	background-color: #F0F1FF;
	text-align: center;
	padding: 3px;
}

.w1 {
	border-top-width: 1px;
	border-bottom-width: 0px;
	background-color: #DAE1FF;
	text-align: center;
	padding: 3px;
}

.w2 {
	border-top-width: 1px;
	border-bottom-width: 0px;
	background-color: #F0F1FF;
	text-align: center;
	padding: 3px;
}

.verticaltext span {
	margin-top: -150%;
	width: 40px;
	display: block;
	transform: rotate(-90deg);
	-webkit-transform: rotate(-90deg);
	-moz-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}

.poibg {
	text-align: center;
	font-size: 15px;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	color: #FFFFFF;
	border: none;
	border-radius: 1.2rem;
	width: 40px;
	height: 40px;
	line-height: 40px !important;
	cursor: pointer;
}

.poibggreen {
	background: #66bb6a;
	border-color: #66bb6a;
	background: linear-gradient(60deg, #66bb6a, #43a047) !important;
	background: -moz-linear-gradient(60deg, #66bb6a 0%, #43a047 100%) !important;
	background: -webkit-linear-gradient(60deg, #66bb6a 0%, #43a047 100%) !important;
	box-shadow: 0 12px 20px -10px rgba(76, 175, 80, 0.28), 0 4px 20px 0px rgba(0, 0, 0, 0.12), 0 7px 8px -5px rgba(76, 175, 80, 0.2) !important;
	color: #FFFFFF !important;
	text-shadow: none !important;
	border: none !important;
}

.poibgorange {
	background: #ffa726;
	border-color: #ffa726;
	background: linear-gradient(60deg, #ffa726, #fb8c00) !important;
	background: -moz-linear-gradient(60deg, #ffa726 0%, #fb8c00 100%) !important;
	background: -webkit-linear-gradient(60deg, #ffa726 0%, #fb8c00 100%) !important;
	box-shadow: 0 12px 20px -10px rgba(255, 152, 0, 0.28), 0 4px 20px 0px rgba(0, 0, 0, 0.12), 0 7px 8px -5px rgba(255, 152, 0, 0.2) !important;
	color: #FFFFFF !important;
	text-shadow: none !important;
	border: none !important;
}

.poibgbluelight {
	background: #26c6da;
	border-color: #26c6da;
	background: linear-gradient(60deg, #26c6da, #00acc1) !important;
	background: -moz-linear-gradient(60deg, #26c6da 0%, #00acc1 100%) !important;
	background: -webkit-linear-gradient(60deg, #26c6da 0%, #00acc1 100%) !important;
	box-shadow: 0 12px 20px -10px rgba(0, 188, 212, 0.28), 0 4px 20px 0px rgba(0, 0, 0, 0.12), 0 7px 8px -5px rgba(0, 188, 212, 0.2) !important;
	color: #FFFFFF !important;
	text-shadow: none !important;
	border: none !important;
}

.poibgblue {
	background: #1A73E8;
	border-color: #1A73E8;
	background: linear-gradient(60deg, #1A73E8, #0039F7) !important;
	background: -moz-linear-gradient(60deg, #1A73E8 0%, #0039F7 100%) !important;
	background: -webkit-linear-gradient(60deg, #1A73E8 0%, #0039F7 100%) !important;
	box-shadow: 0 12px 20px -10px rgba(0, 188, 212, 0.28), 0 4px 20px 0px rgba(0, 0, 0, 0.12), 0 7px 8px -5px rgba(0, 188, 212, 0.2) !important;
	color: #FFFFFF !important;
	text-shadow: none !important;
	border: none !important;
}

.poibgbluedark {
	background: #27334C;
	border-color: #27334C;
	background: linear-gradient(60deg, #27334C, #32436F) !important;
	background: -moz-linear-gradient(60deg, #27334C 0%, #32436F 100%) !important;
	background: -webkit-linear-gradient(60deg, #27334C 0%, #32436F 100%) !important;
	box-shadow: 0 12px 20px -10px rgba(0, 188, 212, 0.28), 0 4px 20px 0px rgba(0, 0, 0, 0.12), 0 7px 8px -5px rgba(0, 188, 212, 0.2) !important;
	color: #FFFFFF !important;
	text-shadow: none !important;
	border: none !important;
}

.poibgred {
	background: #ef5350;
	border-color: #ef5350;
	background: linear-gradient(60deg, #ef5350, #e53935) !important;
	background: -moz-linear-gradient(60deg, #ef5350 0%, #e53935 100%) !important;
	background: -webkit-linear-gradient(60deg, #ef5350 0%, #e53935 100%) !important;
	box-shadow: 0 12px 20px -10px rgba(244, 67, 54, 0.28), 0 4px 20px 0px rgba(0, 0, 0, 0.12), 0 7px 8px -5px rgba(244, 67, 54, 0.2) !important;
	color: #FFFFFF !important;
	text-shadow: none !important;
	border: none !important;
}

.poibgpurple {
	background: #ab47bc;
	border-color: #ab47bc;
	background: linear-gradient(60deg, #ab47bc, #8e24aa) !important;
	background: -moz-linear-gradient(60deg, #ab47bc 0%, #8e24aa 100%) !important;
	background: -webkit-linear-gradient(60deg, #ab47bc 0%, #8e24aa 100%) !important;
	box-shadow: 0 12px 20px -10px rgba(156, 39, 176, 0.28), 0 4px 20px 0px rgba(0, 0, 0, 0.12), 0 7px 8px -5px rgba(156, 39, 176, 0.2) !important;
	color: #FFFFFF !important;
	text-shadow: none !important;
	border: none !important;
}

.poibgpink {
	background: #f64677;
	border-color: #f64677;
	background: linear-gradient(60deg, #f64677, #e91e87) !important;
	background: -moz-linear-gradient(60deg, #f64677 0%, #e91e87 100%) !important;
	background: -webkit-linear-gradient(60deg, #f64677 0%, #e91e87 100%) !important;
	box-shadow: 0 12px 20px -10px rgba(156, 39, 176, 0.28), 0 4px 20px 0px rgba(0, 0, 0, 0.12), 0 7px 8px -5px rgba(156, 39, 176, 0.2) !important;
	color: #FFFFFF !important;
	text-shadow: none !important;
	border: none !important;
}

.poibgblue2 {
	background: #58ffca;
	border-color: #58ffca;
	background: linear-gradient(60deg, #58ffca, #3bdbdb) !important;
	background: -moz-linear-gradient(60deg, #58ffca 0%, #3bdbdb 100%) !important;
	background: -webkit-linear-gradient(60deg, #58ffca 0%, #3bdbdb 100%) !important;
	box-shadow: 0 12px 20px -10px rgba(156, 39, 176, 0.28), 0 4px 20px 0px rgba(0, 0, 0, 0.12), 0 7px 8px -5px rgba(156, 39, 176, 0.2) !important;
	color: #FFFFFF !important;
	text-shadow: none !important;
	border: none !important;
}

.poibgyellow {
	background: #fbdc0f;
	border-color: #fbdc0f;
	background: linear-gradient(60deg, #fbdc0f, #ff9e00) !important;
	background: -moz-linear-gradient(60deg, #fbdc0f 0%, #ff9e00 100%) !important;
	background: -webkit-linear-gradient(60deg, #fbdc0f 0%, #ff9e00 100%) !important;
	box-shadow: 0 12px 20px -10px rgba(156, 39, 176, 0.28), 0 4px 20px 0px rgba(0, 0, 0, 0.12), 0 7px 8px -5px rgba(156, 39, 176, 0.2) !important;
	color: #FFFFFF !important;
	text-shadow: none !important;
	border: none !important;
}

#sendmessage {
	padding: 5px;
}

legend select {
	vertical-align: inherit !important;
}

textarea {
	width: 100%;
}

:placeholder-shown,
::placeholder {
	letter-spacing: 0px !important;
}

[type="password"],
input[type="file"],
input[type="tell"],
input[name="username"],
.timepicker {
	direction: ltr;
	text-align: center;
	cursor: pointer;
}

input[type="file"] {
	background-image: url('/jscripts/icons/svg/attach.svg');
	background-size: 20px;
	background-repeat: no-repeat;
	background-position: left 1.2rem center;
	padding-left: 3.2rem;
	cursor: pointer;
	width: 48px;
}

input[type="file"]::-webkit-file-upload-button {
	opacity: 0;
	width: 40px;
	cursor: pointer;
}

.timepicker {
	direction: ltr;
	text-align: left;
	width: 110px !important;
	background-image: url('/jscripts/icons/svg/alarm-clock.svg');
	background-size: 20px;
	background-repeat: no-repeat;
	background-position: right 1.2rem center;
	cursor: pointer;
}

legend {
	white-space: nowrap;
}

input[type="time"] {
	direction: ltr;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
	-webkit-appearance: none !important;
	margin: 0 !important;
}

input[type=number] {
	appearance: textfield !important;
	-moz-appearance: textfield !important;
}

ul#bd {
	list-style-type: none;
}

audio {
	width: 95%;
	margin: 10px auto;
}



.ui-widget {
	font-family: inherit !important;
}

[onclick] {
	cursor: pointer;
}

*:hover {
	text-decoration: none !important;
}

input[type=range]:hover {
	opacity: 1;
}

.ioswitch.checked .inner {
	left: 23px;
	opacity: 1;
}

.ioswitch .inner {
	width: 24px;
	height: 24px;
	position: absolute;
	top: 3px;
	left: 3px;
	border-radius: 100%;
	background: #ffffff;
	transition: all 350ms cubic-bezier(0, 0.89, 0.44, 1);
	box-shadow: 0 1px 2px 0 rgba(var(--ring), calc(var(--ring-a) + 0.08)), 0 3px 4px 0 rgba(var(--ring), var(--ring-a));
}

.ioswitch.checked {
	box-shadow: inset 0 0 0 30px rgba(var(--p), 1);
}

.ioswitch {
	cursor: pointer;
	background: #dddddd;
	border: none;
	height: 30px;
	border-radius: 18px;
	width: 50px !important;
	min-width: 50px !important;
	transition: all 0.3s ease-in-out;
	box-shadow: none;
	position: relative;
	display: inline-block;
	vertical-align: middle;
	margin: 5px 5px;
}

.content-header>h1 {
	margin: 0;
	font-size: 15px;
	padding: 15px 10px 0px 10px;
	font-weight: 500;
	color: rgb(var(--p));
}

.currentpage a {
	cursor: default;
	display: inline-block;
	background-color: rgb(var(--p-strong));
	margin-right: 3px;
	min-width: 15px;
	min-height: 15px;
	border-radius: 15px;
	color: var(--on-p) !important;
	padding: 2px 3px;
	line-height: 150%;
}

.otherpage a {
	display: inline-block;
	background-color: var(--muted);
	color: var(--on-p) !important;
	margin-right: 3px;
	min-width: 15px;
	min-height: 15px;
	border-radius: 15px;
	padding: 2px 3px;
	line-height: 150%;
}

.otherpage a:hover {
	background-color: var(--p-stronger);
	color: var(--on-p) !important;
}

.poiaclist {
	display: none;
	position: fixed;
	padding: 0px;
	list-style-type: none;
	background: var(--panel);
	border: 1px solid rgba(var(--ring), var(--ring-a));
	border-radius: 5px;
	overflow-y: auto;
	max-height: 500px;
	z-index: 10000;
}

.poiaclist li {
	display: block;
	padding: 3px 2px 6px 2px;
	border-bottom: 1px solid rgba(var(--ring), var(--ring-a));
	cursor: pointer;
	margin-top: 2px;
	overflow: hidden;
	text-overflow: ellipsis;
}

.poiaclist li.selected {
	background-color: rgb(var(--p));
	color: var(--on-p);
}

input[type=range] {
	appearance: none;
	-webkit-appearance: none;
	width: 90%;
	height: 15px;
	border-radius: 5px;
	background: var(--muted-2);
	outline: none;
	opacity: 0.7;
	transition: opacity .2s;
}

input[type=range]::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 25px;
	height: 25px;
	border-radius: 50%;
	background: rgb(var(--p));
	cursor: pointer;
}

input[type=range]::-moz-range-thumb {
	width: 25px;
	height: 25px;
	border-radius: 50%;
	background: rgb(var(--p));
	cursor: pointer;
}

.contxtmenu {
	display: block !important;
	font-size: 13px;
	position: absolute;
	padding: 8px;
	background: var(--panel);
	box-shadow: 1px 1px 5px rgba(var(--ring), calc(var(--ring-a) + 0.15));
	border-radius: 5px;
	margin: 0;
	list-style: none;
}

textarea[disabled=disabled],
input[type=text][disabled=disabled] {
	background: none !important;
	height: auto !important;
	border: none;
	border-bottom: 1px solid #ccc;
	resize: none;
	overflow: visible;
}

#trumbowyg-icons {
	overflow: hidden;
	visibility: hidden;
	height: 0px;
	width: 0px;
}

#trumbowyg-icons svg {
	height: 0px;
	width: 0px;
}

.headernkala {
	font-family: yekannumbers;
	position: absolute;
	font-size: 10px;
	bottom: 7px;
	right: 7px;
	background-color: #FF1414;
	color: #fff;
	padding: 3px;
	line-height: 10px;
	min-width: 20px;
	height: 20px;
	border: 0px solid #fff;
	border-radius: 6px;
	display: none;
}

.centerbox {
	align-self: center;
}

.middle {
	vertical-align: middle;
}

.align-l {
	text-align: left;
}

.simpletable {
	border: 1px solid #e7e7e7;
	width: 100%;
}

.simpletable tr:nth-child(2n+1) {
	background-color: #f6f6f6;
}

.simpletable td {
	padding: 5px;
}

.poicircle {
	width: 25px;
	margin: 3px;
	display: inline-block;
	position: relative;
	text-align: center;
	vertical-align: top;
}

.poicircle strong {
	position: absolute;
	top: 0px;
	left: 0;
	width: 100%;
	text-align: center;
	line-height: 20px;
	font-size: 7px;
	color: #fff;
	font-weight: 300;
}

progress {
	width: 100%;
	margin-top: -12px;
	margin-bottom: 12px;
}

.tophide {
	position: absolute !important;
	top: -200% !important;
}

.ui-datepicker-trigger {
	cursor: pointer;
}

img.cke_slideShow {
	width: 150px !important;
	height: 150px !important;
	background-size: contain !important;
}

[id="headselect"] {
	cursor: pointer;
}

#messagealerter>div {
	padding: 10px 20px;
	margin: auto;
	position: relative;
	display: inline-block;
	z-index: 9999;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
	box-shadow: 5px 0px 5px rgba(0, 0, 0, 0.2);
}

#messagealerter {
	position: fixed;
	width: 100%;
	text-align: center;
	top: 0px;
	left: 0px;
	z-index: 9999;
}

.toast {
	background-color: #00b947;
}

.bg-success,
.toast-success,
.alert_success {
	background-color: #00b947 !important;
	color: #fff !important;
}

.bg-error,
.toast-error,
.alert_error {
	background-color: #b90000 !important;
	color: #fff !important;
}

.bg-info,
.toast-info,
.alert_info {
	background-color: #189ec7 !important;
	color: #fff !important;
}

.bg-warning,
.toast-warning,
.alert_warning,
.alert_loading {
	background-color: #ff5405 !important;
	color: #fff !important;
}

pre {
	direction: ltr;
	text-align: left;
}

.flex {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.flex-childs-w50>* {
	width: 100%;
}

.flexdaterow {
	display: flex;
	flex-direction: row;
	column-gap: 5px;
	height: 22px;
	line-height: 22px;
}

.dateinputhide {
	margin: 0px !important;
	opacity: 0 !important;
	width: 0px !important;
	min-width: 0px !important;
	max-width: 0px !important;
	padding-left: 0px !important;
	padding-right: 0px !important;
	overflow: hidden !important;
	display: inline-block !important;
}

.bs-tooltip-top .tooltip-arrow {
	bottom: 3px !important;
	left: 4px;
}

@media screen and (min-width: 767px) {
	.flex-childs-w50>* {
		width: 48%;
	}
}

@media screen and (max-width: 600px) {

	form {
		text-align: cenrer;
	}

	[type="text"]:not(.timepicker).dateinputhide {
		margin: 0px !important;
		opacity: 0 !important;
		width: 0px !important;
		min-width: 0px !important;
		max-width: 0px !important;
		padding-left: 0px !important;
		padding-right: 0px !important;
		overflow: hidden !important;
		display: inline-block !important;
	}
}

.ui-sortable {
	position: relative;
}

.ui-sortable-handle {
	touch-action: none;
}

.column.ui-sortable {
	display: flex;
	flex-direction: column;
	gap: 1.2rem;
}

.portlet-header,
.portlet-header.ui-sortable-handle {
	display: flex;
	align-items: center;
	gap: 0.8rem;
	background: var(--panel) !important;
	color: var(--txt) !important;
	border: none !important;
	border-radius: 1.6rem !important;
	padding: 1.04rem 1.44rem !important;
	height: auto !important;
	min-height: 46px;
	box-shadow: 0 0 0 1px rgba(var(--ring), var(--ring-a));
	transition: box-shadow .25s, transform .25s, background .4s;
	cursor: move;
}

.portlet-header:hover {
	box-shadow: 0 0 0 1px rgba(var(--p), .45), 0 10px 22px -14px rgba(var(--p), .5);
}

.portlet-header a {
	display: inline-flex;
	align-items: center;
	gap: 0.56rem;
	color: rgb(var(--p-strong));
	font-weight: 500;
	font-size: 1.36rem;
	transition: color .2s;
}

.portlet-header a:hover {
	color: rgb(var(--p));
}

.portlet-header a i {
	color: rgb(var(--p));
	font-size: 1.6rem !important;
	line-height: 1;
	transition: transform .2s, color .2s;
}

.portlet-header a:hover i {
	transform: scale(1.15);
}

.portlet-header input[type="checkbox"].simple {
	width: 1.76rem;
	height: 1.76rem;
	min-width: 1.76rem;
	accent-color: rgb(var(--p));
	margin: 0 0.4rem 0 0 !important;
	opacity: 1 !important;
	cursor: pointer;
}

.portlet-header .catids {
	display: none;
}

.ui-sortable-placeholder {
	visibility: visible !important;
	border: 1px dashed rgba(var(--p), .5) !important;
	border-radius: 1.6rem !important;
	background: rgba(var(--p), .06) !important;
	box-shadow: none !important;
	min-height: 46px;
}

.ui-sortable-helper {
	box-shadow: 0 18px 40px -18px rgba(var(--p), .55), 0 0 0 1px rgba(var(--p), .45) !important;
	transform: rotate(-1deg) scale(1.02);
	cursor: grabbing !important;
	opacity: .95;
}

.ui-sortable-helper .portlet-header,
.portlet-header.ui-sortable-helper {
	cursor: grabbing;
}

.ui-sortable-handle:active {
	cursor: grabbing;
}

hr {
	border: none;
	height: 1px;
	margin: 2rem 0;
	background: linear-gradient(to left,
			transparent 0%,
			rgba(var(--ring), calc(var(--ring-a) * 2.6)) 20%,
			rgba(var(--ring), calc(var(--ring-a) * 2.6)) 80%,
			transparent 100%);
}

hr.text-p {
	background: linear-gradient(to left,
			transparent 0%,
			rgba(var(--p), .45) 15%,
			rgba(var(--p), .45) 85%,
			transparent 100%);
}

hr.dashed {
	height: 0;
	border-top: 1px dashed rgba(var(--ring), calc(var(--ring-a) * 2));
	background: none;
}

hr.dotted {
	height: 0;
	border-top: 1px dotted rgba(var(--ring), calc(var(--ring-a) * 2));
	background: none;
}

hr.glow {
	height: 1px;
	background: linear-gradient(to left,
			transparent 0%,
			rgba(var(--p), .8) 50%,
			transparent 100%);
	box-shadow: 0 0 12px rgba(var(--p), .55);
}

hr.short {
	width: 60px;
	margin-inline: auto;
	height: 3px;
	border-radius: 999px;
	background: linear-gradient(to left, rgb(var(--p-strong)), rgb(var(--p)));
}

.poi-ms {
	display: block;
	width: 100%;
	max-width: 250px;
	height: 125px;
	--poi-ms-bubble-w: 48px;
	--poi-ms-bubble-h: 44px;
	--poi-ms-bubble-r: 8px;
	--poi-ms-bubble-tip: 7px;
	--poi-ms-bubble-gap: 4px;
	--poi-ms-knob-r: 9px;
}

@media (max-width:575.98px) {
	.poi-ms {
		max-width: 100%
	}
}

.poi-ms svg {
	display: block;
	width: 100%;
	overflow: visible;
	touch-action: none;
	user-select: none;
	-webkit-user-select: none
}

.poi-ms .trackBg {
	stroke: rgba(var(--ring), var(--ring-a));
}

.poi-ms .trackMiddle {
	stroke: rgba(var(--ring), var(--ring-a));
}

.poi-ms .track {
	stroke: rgb(var(--p))
}

.poi-ms .tick {
	fill: rgba(var(--ring), var(--ring-a));
	opacity: .6
}

.poi-ms .knob {
	fill: rgb(var(--p));
	stroke: rgba(var(--ring), var(--ring-a));
	stroke-width: 1
}

.poi-ms .bubbleShape {
	fill: var(--bg);
	stroke: rgba(var(--ring), var(--ring-a));
	stroke-width: 1;
	stroke-miterlimit: 10
}

.poi-ms .dragger {
	fill: rgba(var(--ring), var(--ring-a));
	opacity: 0;
	cursor: grab
}

.poi-ms .dragger:active {
	cursor: grabbing
}

.poi-ms .thumb {
	pointer-events: none
}

.poi-ms .monthText {
	fill: var(--txt);
	font-size: 1.12rem;
	font-weight: 700
}

.modal-dialog-centered {
	flex-direction: column;
}