/* User Nav*/	
	.side-nav {
		position: fixed;
		top: 112px;
		width: 350px;
		right: -350px;
		height: 100%;
		background-color: #908489;
		overflow-x: hidden;
		transition: 0.3s;
		z-index: 9999;
		background: url(/templates/foxengine2/assets/img/menu_bg.png);
		/* border-left: 2px solid #52301f; */
	}

	.side-nav.show {
		right: 0;
	}

	.side-nav .menu-content {
		color: #f1f1f1;
	}

.side-nav a {
	    color: var(--link-color-primary);
}


	.side-nav .menu-content .avatar {
		overflow: hidden;
		border-radius: 50%;
		background-color: rgba(255, 255, 255, 0.31);
		margin-right: 10px;
	}

	.side-nav .menu-content .avatar img {
		object-fit: cover;
		width: 42px;
		height: 42px;
	}

	/* UserBlock */
	.user-button {
		background: none;
		border: none;
		display: flex;
		align-items: center;
		cursor: pointer;
		font-family: 'FSElliotPro-Heavy';
	}

.user-button .avatar {
    overflow: hidden;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.31);
    margin-right: 10px;
    height: 55px;
    width: 55px;
    transition: all 0.4s ease;
    border: 2px solid transparent;
    box-shadow: 0 0 0 rgba(255, 255, 255, 0);
    transform: rotate(0deg);
}

.user-button .avatar:hover {
    border: 2px solid #ae8435;
    box-shadow: 0 0 12px rgb(196 116 79);
    transform: rotate(5deg) scale(1.05);
}
.user-button .avatar:active {
     transform: scale(1.25);
    box-shadow: 0 0 20px rgba(0, 209, 255, 0.8);
}


	.user-button .avatar img {
	}

	.user-button .chevron {
		margin-left: 10px;
		transition: transform 0.3s;
		font-family: 'Minecraft Bold';
		color: #ac6343;
	}

	.user-button .chevron[data-opened="true"] {
		transform: rotate(180deg);
	}

	#usrMenu > .pages a {
		height: 42px;
		padding: 10px;
		display: block;
	}
	
	#usrMenu > .pages a:hover {
		background: #cac2b5;
	}
	
	/* Full Profile */
	
	.userProfile {
	background: var(--theme-content-pane);
	-webkit-box-shadow: 0 14px 43px rgba(79, 45, 31, .2);
	-moz-box-shadow: 0 14px 43px rgba(79, 45, 31, .2);
	box-shadow: 0 14px 43px rgba(79, 45, 31, .2);
	border: 3px solid #ddd4bc;
	padding: 5px;
	}
	
	.userData {
		font-family: 'Intro-Black';
		background: url(/templates/foxengine2/assets/img/block-profile.png) no-repeat;
		background-size: cover;
		padding: 3px;
	}
	
	#profileContents .pageItem:nth-child(even) {
		background: #fefdfd
	}

	#profileContents .pageItem:nth-child(odd) {
		background: #f4f2ef
	}

	#profileContents .itemTitle {
		width: 50%;
		display: inline-block;
		vertical-align: top;
		padding: 0 10px 0 15px;
		line-height: 32px;
		font-size: 14px;
		color: #5d5a57
	}

	#profileContents .itemDetail {
		width: 40%;
		display: inline-block;
		vertical-align: top;
		padding: 0 10px;
		font-weight: 600;
		line-height: 32px;
		color: #5d5a57;
		font-size: 14px
	}
	
	@media screen and (max-width: 767px) {
    .foxesResponsive_pull {
        margin-left:-10px;
        margin-right: -10px;
    }

    .foxesResponsive_pull .foxesResponsive_pull {
        margin-left: 0;
        margin-right: 0;
    }

    .foxesResponsive_pull, .foxesResponsive_pull .foxesBox:not( .foxesBox--child ), .foxesResponsive_pull .foxesStreamItem {
        border-radius: 0;
        border-left-width: 0;
        border-right-width: 0;
    }

    #foxesLayout_mainArea {
        padding: 10px;
    }
	
    html[dir] #foxesLayout_sidebar.foxesLayout_sidebarleft, html[dir] #foxesLayout_sidebar.foxesLayout_sidebarright {
        padding: 10px;
        padding-top: 0;
    }

    .foxesColumns.foxesColumns_collapseTablet:not( .foxesHide ), .foxesColumns.foxesColumns_collapsePhone:not( .foxesHide ) {
        width: auto;
        display: block;
        padding-right: 0;
    }

    .foxesColumns.foxesColumns_collapseTablet > .foxesColumn:not( .foxesHide ), .foxesColumns.foxesColumns_collapsePhone > .foxesColumn:not( .foxesHide ) {
        position: relative;
        margin: 0 0 15px 0;
        display: table-cell;
    }

    .foxesLayout_contentSection {
        padding: 5px;
    }

    .foxesGrid.foxesGrid_collapseTablet > [class*="foxesGrid_span"], .foxesGrid.foxesGrid_collapsePhone > [class*="foxesGrid_span"] {
        width: 100%;
    }

    .foxesGrid.foxesGrid_collapseTablet > [class*="foxesGrid_span"], html[dir="ltr"] .foxesGrid.foxesGrid_collapsePhone > [class*="foxesGrid_span"] {
        margin-left: 0;
    }

    .foxesGrid.foxesGrid_collapseTablet > [class*="foxesGrid_span"], html[dir="rtl"] .foxesGrid.foxesGrid_collapsePhone > [class*="foxesGrid_span"] {
        margin-right: 0;
    }

    #elContextualTools {
        padding: 0;
    }

    .foxesHeaderButtons .foxesToolList {
        float: right;
        width: auto;
        margin-bottom: 0;
    }

    .foxesHeaderButtons .foxesType_pageTitle {
        line-height: 1.5;
    }

    .foxesHeaderButtons .foxesToolList .foxesButton {
        line-height: 28px;
    }
}

	#profileStats {
		background: #2b2b2b;
		margin: 25px 0 0px;
		color: #fff;
		height: auto;
		padding: 12px 12px 12px 0px;
		font-size: 18px;
		font-weight: 500;
		position: relative;
	}
	
	#profileStats li {
		align-content: space-evenly;
	}

	#profileStats > [data-role="switchView"] .foxesList_inline, #profileStats > [data-role="switchView"] .foxesButton {
		position: relative;
		z-index: 1000;
	}

	#profileStats > ul:last-child > li {
		margin-right: 20px;
		padding-right: 20px;
		border-right: 1px solid rgba(255,255,255,0.2);
	}

	#profileStats > ul:last-child > li {
		margin: 0;
		padding-left: 20px;
	}

	#profileStats > ul:last-child > li:last-child {
		border: 0;
	}

@media screen and (max-width: 979px) {
    #userReputation .foxesDataList .foxesDataItem_generic, #userReputation .foxesDataList .foxesDataItem_main {
        display:table-cell;
    }

    #profileHeader .foxesColumn_narrow {
        width: 70px;
    }

    #profileHeader .foxesUserPhoto_xlarge {
        width: 70px;
        height: 70px;
    }

    #profileStats {
        padding-left: 20px;
        padding-right: 20px;
    }

    #profilePhoto [data-action="editPhoto"] {
        bottom: 10px;
    }
	
	#profileStats {
        height: auto;
    }

    #profileStats.cProfileHeaderContent {
        display: none;
    }

    #profileStats > ul > li {
        display: block;
        margin-bottom: 10px;
    }

    #profileStats > ul:last-child {
        margin-top: calc( var(--sp-1) * -1 );
        margin-bottom: calc( var(--sp-1) * -1 );
    }

    #profileStats > ul:last-child > li {
        margin: var(--sp-1) 0;
        padding: 0;
        border: 0;
        width: 50%;
    }

}
	
	.profile-title {
		color: #886f1d;
		font-family: 'FSElliotPro-Heavy';
		display: inline-block;
		border-radius: 5px;
		padding: 3px;
		background: aliceblue;
		margin: 5px;
	}

	.profile-title h1 {
		display: table-cell;
		font-size: 1rem;
		/* text-transform: capitalize; */
	}
	
	/* AVATAR BOX */
	[data-marker="avatar-box"] {
		bottom: -30px;
		left: 24px;
		z-index: 10;
		border-width: 0px;
		border-style: solid;
		border-color: rgb(22, 22, 26);
		vertical-align: inherit;
		max-width: 100%;
		min-height: 0px;
		min-width: 0px;
		flex-shrink: 0;
		flex-direction: column;
		flex-basis: auto;
		display: flex;
		align-items: stretch;
	}

	/* AVATAR WRAPPER */
	.avatar-wrapper {
		position: absolute;
		vertical-align: inherit;
		max-width: 100%;
		min-height: 0px;
		min-width: 0px;
		flex-shrink: 0;
		flex-direction: column;
		flex-basis: auto;
		display: inline-table;
		align-items: stretch;
		width: min-content;
		z-index: 1;
	}

	/* IMG INNER */
	.avatar-image-inner {
		border-width: 0px;
		position: relative;
	}

	/* IMG */
	.avatar-image {
		transition: opacity 0.33s ease-in-out 0s;
		opacity: 0;
		position: absolute;
		max-height: 128px;
		max-width: 128px;
		object-fit: cover;
		z-index: 0;
		width: 132px;
		height: 132px;
		border-radius: 132px;
		vertical-align: inherit;
	}

	/* BUTTON */
	.avatar-edit-button {
		-webkit-box-align: center;
		align-items: center;
		-webkit-box-pack: center;
		justify-content: center;
		display: flex;
		position: absolute;
		left: 4px;
		top: 4px;
		background: rgba(22, 22, 26, 0.4);
		border: 2px solid rgba(22, 22, 26, 0.1);
		width: calc(100% - 8px);
		height: calc(100% - 8px);
		opacity: 0;
		transition: all 0.15s ease-in-out 0s;
		backdrop-filter: blur(44px);
		transform: scale(0.85);
		transform-origin: center center;
		border-radius: 135px;
	}

	.avatar-edit-button:hover,
	.avatar-edit-button:focus {
		transform: scale(1);
		opacity: 1;
	}

	.avatar-edit-button:active {
		transform: scale(0.9);
	}

	.avatar-edit-button svg {
		width: 24px;
		height: 24px;
		fill: white;
	}

	/* HOVER */
	.avatar-wrapper:hover .avatar-edit-button {
		opacity: 1;
	}
	
	.FoxesStatus_online {
	color: #249168;
	margin: 5px;
	}

	.FoxesStatus_offline {
		color: #d54040;
		margin: 5px;
	}

			
	.profile-title span {
		font-size: 10pt;
	}
	
	.profileButtonGroup{
		position: relative;
		width: auto;
		height: 62px;
		display: inline-flex;
		transition: .3s ease;
		margin: 8px 5px;
	}
	
	.profileButton {
		width: max-content;
		height: max-content;
		font-size: 15pt;
		background-color: #b0c2c2c2;
		color: antiquewhite;
		border-radius: 10px;
		padding: 10px;
	}
	
	.statsTabbleItem:nth-child(even) {
		background: #fefdfd;
	}

	.statsTabbleItem:nth-child(odd) {
		background: #f4f2ef
	}

	.pageItemTitle {
		width: 65%;
		display: inline-block;
		vertical-align: top;
		padding: 0 10px 0 15px;
		line-height: 32px;
		/* font-size: 14px; */
		color: #5d5a57
	}

	.pageItemValue {
		display: inline-flex;
		vertical-align: top;
		padding: 0 10px;
		font-weight: 600;
		line-height: 32px;
		color: #5d5a57;
		font-size: 14px;
	}

	a.see_last_comments {
		margin: 0 0 0 15px;
		color: #61a1c1
	}

	a.see_last_comments:hover {
		text-decoration: none
	}

	.statsTabbleItem_second_title {
		color: #b98c6d;
		font-size: 16px;
		font-weight: 800;
		margin: 15px 15px 15px 0
	}
	
	.dpad {
		font-size: 0.8rem;
	}

	.toggleSwitch {
		height: 65px;
		background-color: #8d7c4b;
	}
	
	.profileActions {
	    display: flex;
		float: right;
		margin: 5px;
	}
	
	.profileActions > button {
		    margin: 5px;
	}
	
	#dialogContent .option_select {
		float: left;
	}
	
	/* PROFILE BACKGROUNDS */
.profileedit_ItemPickerList {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    justify-items: center;
}

.profileedit_ItemPickerList label {
	margin: 5px;
}

.profileedit_ItemPickerList label:hover {
	transition: 0.3s;
	filter: drop-shadow(1px 3px 6px rgba(0, 0, 0, 0.25)) brightness(115%);
	animation: bounceSelected 0.6s ease;
}

.profilebackground_BackgroundOption {
    padding: 0;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
	margin: 15;
}
.profilebackground_Preview {
    width: 200px;
    height: 112px;
    overflow: hidden;
    background: #000000;
    border-radius: 3px;
}

.profilebackground_Preview img {
    width: 100%;
    display: block;
    position: relative;
    z-index: 3;
    border-radius: 3px;
}
	
	/* PROFILE COLORSCHEMES */
.colorBlock {
	cursor: pointer;
	height: 60px;
	position: relative;
	text-align: center;
}
					
.innerDiv {
	height: 100%;
	display: none;
	font-size: 40pt;
	margin: 0 auto;
	background-color: rgb(217 222 231 / 54%);
}

.innerSpan.checked:before {
	font-family: Font Awesome\ 6 Pro;
	content: "\f00c";
	margin: 5px;
    font-size: 32pt;
    color: #ffffff;
}

.foxesButton_split {
    margin: 0;
    padding: 0;
    list-style: none;
    display: inline-flex;
    border-radius: var(--button--radius);
}

.foxesMenu {
    background: rgb( var(--theme-area_background_reset) );
    box-shadow: var(--popup--boxShadow);
    border: var(--popup--border);
    background-clip: padding-box;
    border-radius: var(--popup--radius);
    z-index: 10000;
    position: absolute;
}

.foxesMenu .foxesMenu_item:first-child a, .foxesMenu .foxesMenu_item:first-child > span {
    border-top-left-radius: var(--popup--radius);
    border-top-right-radius: var(--popup--radius);
}

.foxesMenu .foxesMenu_item:last-child a, .foxesMenu .foxesMenu_item:last-child > span {
    border-bottom-left-radius: var(--popup--radius);
    border-bottom-right-radius: var(--popup--radius);
}

ul.foxesMenu, .foxesMenu > ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

@keyframes bounceSelected {
  0% {
    transform: translateY(0px); }
  50% {
    transform: translateY(-2px); }
  100% {
    transform: translateY(0px); } 
}
	
.colorBlock.checked {
	border: 3px dotted #101010;
	background-color: #ccc42754;
}

@keyframes shake {
  0% {
    transform: translateX(0);
  }
  10% {
    transform: translateX(-10px);
  }
  20% {
    transform: translateX(10px);
  }
  30% {
    transform: translateX(-10px);
  }
  40% {
    transform: translateX(10px);
  }
  50% {
    transform: translateX(-10px);
  }
  60% {
    transform: translateX(10px);
  }
  70% {
    transform: translateX(-10px);
  }
  80% {
    transform: translateX(10px);
  }
  90% {
    transform: translateX(-10px);
  }
  100% {
    transform: translateX(0);
  }
}

.shake {
  animation: shake 0.8s ease-in-out;
}

/* Group Display */

    .userStatus{
		display: flow-root;
		margin: 10px;
	}
	
/* Админ (1) */
/* Стиль для тега span.admin */
span.groupStatus-1 {
    display: inline-block;
    color: #fff8dc;
    position: relative;
    text-transform: uppercase;
    letter-spacing: 3.5px;
    line-height: 1;
    font-weight: 800;
    font-size: 1.15em;
    padding: 8px 16px;
    background: linear-gradient(145deg, #d6ba85 0%, #f0e6b2 100%);
    border-radius: 10px 10px 18px 6px;
    text-shadow:
        0 1px 2px rgba(255, 255, 255, 0.8),
        0 2px 6px rgba(231, 213, 157, 0.8),
        2px 2px 8px rgba(0, 0, 0, 0.4);
    box-shadow:
        inset 0 0 8px rgba(255, 255, 255, 0.3),
        0 0 15px rgba(255, 215, 0, 0.4),
        0 0 35px rgba(255, 215, 0, 0.3);
    overflow: hidden;
    animation: adminPulse 2.8s ease-in-out infinite;
}

/* Анимация для span */
@keyframes adminPulse {
    0%, 100% {
        box-shadow:
            inset 0 0 8px rgba(255, 255, 255, 0.3),
            0 0 15px rgba(255, 215, 0, 0.4),
            0 0 35px rgba(255, 215, 0, 0.3);
        transform: scale(1);
    }
    50% {
        box-shadow:
            inset 0 0 10px rgba(255, 255, 255, 0.4),
            0 0 25px rgba(255, 215, 0, 0.6),
            0 0 50px rgba(255, 215, 0, 0.5);
        transform: scale(1.04);
    }
}

/* Стиль для заголовка h1.admin */
h1.groupStatus-1 {
    font-family: 'FSElliotPro-Heavy', 'Segoe UI Black', 'Arial Black', sans-serif;
    color: #fff4b3;
    text-transform: uppercase;
    letter-spacing: 5px;
    padding: 12px 20px;
    margin: 0;
    background: linear-gradient(90deg, #ffb347 0%, #ffcc33 50%, #ffd700 100%);
    border-radius: 14px;
    text-shadow:
        0 2px 6px rgba(0, 0, 0, 0.4),
        1px 1px 0 #ffffff;
    box-shadow:
        0 0 15px rgba(255, 204, 0, 0.5),
        inset 0 0 8px rgba(255, 255, 255, 0.3),
        0 0 40px rgba(255, 223, 0, 0.3);
    animation: adminGlow 3.2s ease-in-out infinite;
    position: relative;
    overflow: hidden;
}

/* Легкий глянец поверх текста */
h1.groupStatus-1::after {
    content: "";
    position: absolute;
    top: 0;
    left: -75%;
    width: 50%;
    height: 100%;
    background: linear-gradient(
        120deg,
        rgba(255, 255, 255, 0.3) 0%,
        rgba(255, 255, 255, 0.1) 50%,
        transparent 100%
    );
    transform: skewX(-20deg);
    animation: shine 4s ease-in-out infinite;
}

#profileStats span.userStatus {
    display: inline-block;
    color: #2e2e2e;
    background: #f0f0f0;
    font-weight: 600;
    font-size: 0.95em;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    padding: 6px 12px;
    border: 1px solid #ccc;
    border-radius: 8px;
    text-shadow: none;
    box-shadow:
        inset 0 1px 2px rgba(255, 255, 255, 0.6),
        0 1px 3px rgba(0, 0, 0, 0.1);
    position: relative;
    transition: background-color 0.3s, color 0.3s, box-shadow 0.3s;
}

#profileStats span.userStatus:hover {
    background: #e0e0e0;
    color: #1a1a1a;
    box-shadow:
        inset 0 2px 4px rgba(255, 255, 255, 0.5),
        0 2px 5px rgba(0, 0, 0, 0.15);
}


/* Анимация для shine эффекта */
@keyframes shine {
    0% {
        left: -75%;
    }
    50% {
        left: 125%;
    }
    100% {
        left: 125%;
    }
}

/* Анимация для h1 */
@keyframes adminGlow {
    0%, 100% {
        box-shadow:
            0 0 15px rgba(255, 204, 0, 0.5),
            inset 0 0 8px rgba(255, 255, 255, 0.3),
            0 0 40px rgba(255, 223, 0, 0.3);
    }
    50% {
        box-shadow:
            0 0 25px rgba(255, 204, 0, 0.8),
            inset 0 0 12px rgba(255, 255, 255, 0.4),
            0 0 60px rgba(255, 223, 0, 0.5);
    }
}


/* Лиса (4) */
h1.groupStatus-4 {
	color: #7fff00c4;
	font-size: 15px;
	font-family: 'Minecraft';
}

/* Гостевичек (5) */
h1.groupStatus-5 {
	text-transform: capitalize;
	font-style: italic;
	color: #888;
	font-size: 14px;
	font-family: 'Segoe UI', sans-serif;
	opacity: 0.85;
}

/* Тестер (3) */
h1.groupStatus-3 {
	position: relative;
	font-family: "Fira Code", monospace;
	font-weight: 500;
	letter-spacing: 1.2px;
	text-transform: uppercase;
	padding: 6px 14px;
	margin-bottom: 12px;
	color: #e0ffff;
	background: linear-gradient(135deg, #00bcd4 0%, #006064 100%);
	border-radius: 8px 8px 18px 0px;
	box-shadow:
		0 0 6px rgba(0, 188, 212, 0.3),
		0 0 14px rgba(0, 188, 212, 0.2),
		inset 0 0 6px rgba(255, 255, 255, 0.06);
	text-shadow:
		0 1px 1px rgba(0, 0, 0, 0.15),
		0 0 3px rgba(255, 255, 255, 0.05);
	animation: fadeInTester 0.6s ease-in-out both;
	overflow: hidden;
}

/* Эффект глитча через псевдоэлементы */
h1.groupStatus-3::before,
h1.groupStatus-3::after {
	content: attr(data-glitch);
	position: absolute;
	left: 0;
	width: 100%;
	overflow: hidden;
	color: #00ffff;
	background: transparent;
	clip: rect(0, 900px, 0, 0);
}

h1.groupStatus-3::before {
	animation: glitchShiftTop 2.5s infinite linear;
	text-shadow: -1px 0 cyan;
}

h1.groupStatus-3::after {
	animation: glitchShiftBottom 3s infinite linear;
	text-shadow: 1px 0 lightseagreen;
}

/* Глитч-анимации */
@keyframes glitchShiftTop {
	0%   { clip: rect(0, 9999px, 0, 0); transform: translate(0px, 0); }
	5%   { clip: rect(0, 9999px, 14px, 0); transform: translate(-2px, -1px); }
	10%  { clip: rect(0, 9999px, 0, 0); transform: translate(0px, 0); }
	15%  { clip: rect(5px, 9999px, 20px, 0); transform: translate(-1px, 1px); }
	20%  { clip: rect(0, 9999px, 0, 0); transform: translate(0px, 0); }
	100% { clip: rect(0, 9999px, 0, 0); transform: translate(0px, 0); }
}

@keyframes glitchShiftBottom {
	0%   { clip: rect(0, 9999px, 0, 0); transform: translate(0px, 0); }
	5%   { clip: rect(10px, 9999px, 24px, 0); transform: translate(2px, 1px); }
	10%  { clip: rect(0, 9999px, 0, 0); transform: translate(0px, 0); }
	15%  { clip: rect(6px, 9999px, 22px, 0); transform: translate(1px, -1px); }
	20%  { clip: rect(0, 9999px, 0, 0); transform: translate(0px, 0); }
	100% { clip: rect(0, 9999px, 0, 0); transform: translate(0px, 0); }
}

span.groupStatus-3 {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 0px 18px 6px 6px;
	background: rgba(0, 188, 212, 0.08);
	color: #00e5ff;
	font-weight: 500;
	font-size: 0.95em;
	text-transform: uppercase;
	box-shadow:
		inset 0 0 4px rgba(0, 188, 212, 0.1),
		0 0 4px rgba(0, 188, 212, 0.2);
	animation: fadeInTester 0.6s ease-in-out both;
}

/* Плавное появление */
@keyframes fadeInTester {
	from {
		opacity: 0;
		transform: translateY(-6px) scale(0.98);
	}
	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

/* Партнёр (6) */
h1.groupStatus-6 {
	font-family: "PF Din Text Comp Pro", sans-serif;
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	padding: 6px 14px;
	margin-bottom: 12px;
	color: #fff;
	background: linear-gradient(135deg, #b52ca2 0%, #611a74 100%);
	border-radius: 6px 6px 18px 0px;
	box-shadow:
		0 0 4px rgba(181, 44, 162, 0.5),
		0 0 10px rgba(181, 44, 162, 0.3),
		inset 0 0 8px rgba(255, 255, 255, 0.05);
	text-shadow:
		0 1px 1px rgba(0, 0, 0, 0.2),
		0 0 3px rgba(255, 255, 255, 0.05);
	animation: fadeInPartner 0.6s ease-in-out both;
}

@keyframes fadeInPartner {
	from {
		opacity: 0;
		transform: translateY(-6px) scale(0.98);
	}
	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

span.groupStatus-6 {
	display: inline-block;
	padding: 2px 8px;
	border-radius: 0px 18px 6px 6px;
	background: rgba(181, 44, 162, 0.1);
	color: #b52ca2;
	font-weight: 600;
	font-size: 0.95em;
	text-transform: uppercase;
	box-shadow:
		inset 0 0 4px rgba(181, 44, 162, 0.1),
		0 0 3px rgba(181, 44, 162, 0.2);
}

	.connected-account__list {
    --provider-color: $text-color;
    display: grid;
    gap: 10px;
    grid-template-columns: 1fr 1fr
}

.connected-account__list .connected-account {
    align-items: center;
    background: #ecf0f1;
    border: 1px solid transparent;
    border-radius: 5px;
    display: flex;
    gap: 10px;
    padding: 10px;
    transition: all .3s ease;
    transition-property: border
}

.connected-account__list .connected-account.connected-account--placeholder {
    background: transparent;
    border-color: #ecf0f1;
    border-style: dashed
}

.connected-account__list .connected-account__info {
    line-height: 1.2
}

.connected-account__list .connected-account__icon {
    background: var(--provider-color);
    border-radius: 10px;
    box-sizing: content-box;
    color: #fff;
    display: block;
    flex-shrink: 0;
    font-size: 24px;
    height: 30px;
    line-height: 30px;
    padding: 5px 5px 3px;
    text-align: center;
    width: 30px
}

/* Базовый блок опций */
.optionsBlock {
    padding: 16px 18px;
    margin: 20px 0;
    border-radius: 10px;
    border-left: 4px solid transparent;
    background-color: #fafbff;
    box-shadow:
        0 1px 2px rgba(15, 23, 42, 0.04),
        0 4px 10px rgba(15, 23, 42, 0.06);
    display: flex;
    flex-direction: column;
    gap: 8px;
    transition:
        background-color 160ms ease-out,
        box-shadow 160ms ease-out,
        transform 120ms ease-out;
}

.optionsBlock:hover {
    transform: translateY(-1px);
    box-shadow:
        0 4px 14px rgba(15, 23, 42, 0.10);
}

.optionsBlock h3 {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    display: flex;
    align-items: center;
    gap: 6px;
}

/* --- Основные опции --- */

.mainOptions {
    background: linear-gradient(135deg, #f9fafb 0%, #f3f4ff 100%);
    border-left-color: #3b82f6;
}

.mainOptions h3 {
    color: #1d4ed8;
}

.mainOptions .optionsDescription {
    color: #4b5563;
    font-size: 0.95rem;
}

/* --- Экспериментальные опции --- */

.experimentalOptions {
    background: linear-gradient(135deg, #fdfcfb 0%, #f3f7ff 40%, #ecfdf5 100%);
    border-left-color: #10b981;
    position: relative;
    overflow: hidden;
}

.experimentalOptions::before {
    content: "Beta";
    position: absolute;
    top: 10px;
    right: 14px;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 2px 6px;
    border-radius: 999px;
    background: rgba(16, 185, 129, 0.12);
    color: #059669;
}

.experimentalOptions h3 {
    color: #047857;
}

.experimentalOptions .optionsDescription {
    color: #374151;
    font-size: 0.95rem;
}

/* Можно подсвечивать экспериментальные контролы */
.experimentalOptions input,
.experimentalOptions select,
.experimentalOptions .toggle {
    outline-color: #10b981;
}

/* --- Админские опции (обновлённые) --- */

.adminOptions {
    background: linear-gradient(135deg, #fffaf3 0%, #fff4e5 100%);
    border-left-color: #ff9800;
}

.adminOptions h3 {
    margin-top: 0;
    color: #e65100;
    font-size: 1.1rem;
}

.adminOptions .optionsDescription {
    color: #5f370e;
    font-size: 0.95rem;
}

/* Общая подпись / описание */
.optionsDescription {
    margin: 0;
    line-height: 0;
}

/* Небольшие бейджи внутри заголовков */
.optionsBadge {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 2px 6px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.04);
    color: #4b5563;
}