/* =========================================================
   CS Grăsuții România
   NewThread Premium
   File: newthread_premium.css
   Version: v2 CLEAN FINAL
   MyBB: 1.8.x
   Theme: RoundoDarko
========================================================= */


/* =========================================================
   01. GLOBAL / PAGE
========================================================= */

#newthread_page .cs-newthread-page{
	width:min(1280px, calc(100% - 32px));
	margin:35px auto 80px;
	color:#d9fbe0;
	font-family:inherit;
	line-height:1.45;
}

.cs-newthread-page *,
.cs-newthread-page *::before,
.cs-newthread-page *::after{
	box-sizing:border-box;
}

.cs-newthread-page a{
	color:#39ff14;
	text-decoration:none;
	transition:
		color .2s ease,
		text-shadow .2s ease,
		border-color .2s ease,
		background .2s ease,
		transform .2s ease;
}

.cs-newthread-page a:hover{
	color:#caffc2;
	text-shadow:0 0 12px rgba(57,255,20,.45);
}

.cs-newthread-page .smalltext{
	color:#9fbba5;
	font-size:12px;
}


/* =========================================================
   02. HERO HEADER
========================================================= */

.cs-newthread-hero{
	position:relative;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:25px;

	padding:30px;

	margin-bottom:24px;

	border:1px solid rgba(57,255,20,.22);
	border-radius:28px;

	background:
		radial-gradient(
			circle at top left,
			rgba(57,255,20,.18),
			transparent 35%
		),
		linear-gradient(
			145deg,
			#111a22,
			#060b10
		);

	box-shadow:
		0 25px 60px rgba(0,0,0,.45),
		0 0 35px rgba(57,255,20,.08);

	overflow:hidden;
}


.cs-newthread-hero::before{
	content:"";

	position:absolute;
	inset:0;

	background:
		linear-gradient(
			120deg,
			transparent,
			rgba(57,255,20,.07),
			transparent
		);

	pointer-events:none;
}


.cs-newthread-hero__content{
	position:relative;
	z-index:2;
}


.cs-newthread-kicker{
	display:inline-flex;

	padding:6px 12px;

	margin-bottom:10px;

	border-radius:999px;
	border:1px solid rgba(57,255,20,.25);

	background:rgba(57,255,20,.07);

	color:#39ff14;

	font-size:11px;
	font-weight:900;
	letter-spacing:.15em;
	text-transform:uppercase;
}


.cs-newthread-hero h1{
	margin:0;

	color:#ffffff;

	font-size:32px;
	font-weight:950;

	letter-spacing:-.04em;

	text-shadow:
		0 0 20px rgba(57,255,20,.2);
}


.cs-newthread-hero p{
	max-width:750px;

	margin:12px 0 0;

	color:#aac7b0;

	font-size:14px;
	line-height:1.6;
}


.cs-newthread-hero__badge{

	position:relative;
	z-index:2;

	min-width:130px;

	padding:16px;

	border-radius:22px;

	border:1px solid rgba(57,255,20,.28);

	background:
		linear-gradient(
			180deg,
			rgba(57,255,20,.15),
			rgba(57,255,20,.04)
		);

	text-align:center;

	box-shadow:
		inset 0 0 25px rgba(57,255,20,.08);
}


.cs-newthread-hero__badge span{
	display:block;

	color:#39ff14;

	font-size:11px;
	font-weight:900;
	letter-spacing:.18em;
}


.cs-newthread-hero__badge strong{
	display:block;

	margin-top:5px;

	color:white;

	font-size:19px;
	font-weight:950;
}


/* =========================================================
   03. MAIN CARDS
========================================================= */

.cs-newthread-card{

	position:relative;

	margin-bottom:22px;

	border-radius:26px;

	border:1px solid rgba(57,255,20,.18);

	background:
		radial-gradient(
			circle at top left,
			rgba(57,255,20,.08),
			transparent 35%
		),
		linear-gradient(
			180deg,
			#101820,
			#070c11
		);

	box-shadow:
		0 20px 50px rgba(0,0,0,.35),
		0 0 25px rgba(57,255,20,.05);

	overflow:hidden;
}


.cs-newthread-card__head{

	display:flex;

	align-items:center;

	justify-content:space-between;

	padding:20px;

	border-bottom:1px solid rgba(57,255,20,.14);

}


.cs-newthread-card__eyebrow{

	display:block;

	margin-bottom:5px;

	color:#39ff14;

	font-size:10px;

	font-weight:950;

	letter-spacing:.15em;

	text-transform:uppercase;
}


.cs-newthread-card__head h2{

	margin:0;

	color:#ffffff;

	font-size:19px;

	font-weight:950;

}


.cs-newthread-card__icon{

	display:flex;

	align-items:center;

	justify-content:center;

	width:44px;
	height:44px;

	border-radius:16px;

	border:1px solid rgba(57,255,20,.25);

	background:rgba(57,255,20,.08);

	color:#39ff14;

	font-size:20px;
}


/* =========================================================
   04. FORM GRID
========================================================= */


.cs-newthread-form-grid{

	display:grid;

	grid-template-columns:1fr 1fr;

	gap:20px;

	padding:22px;
}


.cs-newthread-field{

	min-width:0;

}


.cs-newthread-field--wide{

	grid-column:1 / -1;

}


.cs-newthread-field label{

	display:block;

	margin-bottom:9px;

	color:#eaffed;

	font-size:12px;

	font-weight:950;

}


/* =========================================================
   05. SUBJECT + PREFIX FINAL FIX
========================================================= */


.cs-newthread-subject-row{

	display:flex;

	align-items:center;

	gap:12px;

	width:100%;

}


.cs-newthread-subject-row > *{

	flex-shrink:0;

}


.cs-newthread-subject-row select,
.cs-newthread-subject-row .prefixselect{

	width:auto !important;

	min-width:150px;

	max-width:220px;

}


.cs-newthread-subject-input{

	flex:1 !important;

	width:100% !important;

	min-width:0;

}


/* =========================================================
   06. INPUT BASE
========================================================= */


.cs-newthread-page input.textbox,
.cs-newthread-page select,
.cs-newthread-page textarea{

	border:1px solid rgba(57,255,20,.20) !important;

	border-radius:14px !important;

	background:
		rgba(0,0,0,.25) !important;

	color:#ffffff !important;

	outline:none;

	transition:
		border-color .2s ease,
		box-shadow .2s ease;
}


.cs-newthread-page input.textbox,
.cs-newthread-page select{

	height:42px !important;

	padding:0 14px !important;

}


.cs-newthread-page textarea{

	padding:14px !important;

	min-height:300px;

	line-height:1.6;

}


.cs-newthread-page input.textbox:focus,
.cs-newthread-page select:focus,
.cs-newthread-page textarea:focus{

	border-color:rgba(57,255,20,.55) !important;

	box-shadow:
		0 0 20px rgba(57,255,20,.12);

}

/* =========================================================
   07. EDITOR AREA
========================================================= */

.cs-newthread-editor-layout{

	display:grid;

	grid-template-columns:220px minmax(0,1fr);

	gap:16px;

	align-items:start;

}


.cs-newthread-smilies{

	padding:14px;

	border-radius:18px;

	border:1px solid rgba(57,255,20,.14);

	background:rgba(0,0,0,.18);

	max-height:420px;

	overflow:auto;

}


.cs-newthread-smilies:empty{

	display:none;

}


.cs-newthread-editor-box{

	min-width:0;

}


.cs-newthread-editor-box textarea{

	display:block;

	width:100%;

}


/* =========================================================
   08. MYBB SCEDITOR
========================================================= */


.cs-newthread-page .sceditor-container{

	width:100% !important;

	border-radius:16px !important;

	border:1px solid rgba(57,255,20,.18) !important;

	background:#080d12 !important;

	overflow:hidden;

	box-shadow:
		0 0 20px rgba(57,255,20,.05);

}


.cs-newthread-page .sceditor-toolbar{

	background:
		rgba(10,18,24,.95) !important;

	border-bottom:
		1px solid rgba(57,255,20,.12) !important;

}


.cs-newthread-page .sceditor-group{

	background:
		rgba(255,255,255,.035) !important;

	border-color:
		rgba(255,255,255,.08) !important;

	border-radius:10px !important;

}


.cs-newthread-page .sceditor-button{

	border-radius:8px !important;

}


.cs-newthread-page .sceditor-button:hover{

	background:
		rgba(57,255,20,.12) !important;

}


.cs-newthread-page .sceditor-container iframe,
.cs-newthread-page .sceditor-container textarea{

	background:
		rgba(0,0,0,.22) !important;

	color:#eaffed !important;

}



/* =========================================================
   09. MULTIQUOTE
========================================================= */


.cs-newthread-multiquote{

	display:flex;

	align-items:center;

	flex-wrap:wrap;

	gap:10px;

	padding:12px 15px;

	margin-top:12px;

	border-radius:16px;

	border:1px solid rgba(57,255,20,.16);

	background:
		rgba(57,255,20,.05);

}


.cs-newthread-multiquote a{

	display:inline-flex;

	align-items:center;

	justify-content:center;

	padding:7px 12px;

	border-radius:999px;

	border:1px solid rgba(57,255,20,.22);

	background:
		rgba(57,255,20,.08);

	color:#ffffff;

	font-size:12px;

	font-weight:900;

}


.cs-newthread-multiquote a:hover{

	background:
		rgba(57,255,20,.15);

}



/* =========================================================
   10. POLL BOX
========================================================= */


.cs-newthread-page .pollbox,
.cs-newthread-page .pollbox table{

	width:100%;

}


.cs-newthread-page .pollbox{

	margin-top:20px;

	padding:18px;

	border-radius:22px;

	border:
		1px solid rgba(57,255,20,.16);

	background:
		rgba(255,255,255,.025);

}


.cs-newthread-page .pollbox input[type="text"]{

	width:100%;

}



/* =========================================================
   11. CAPTCHA
========================================================= */


.cs-newthread-page .captcha{

	margin-top:20px;

	padding:18px;

	border-radius:20px;

	border:
		1px solid rgba(57,255,20,.15);

	background:
		rgba(0,0,0,.18);

}


.cs-newthread-page .captcha img{

	border-radius:10px;

}



/* =========================================================
   12. OPTIONS PANEL
========================================================= */


.cs-newthread-options-card{

	display:block;

}


.cs-newthread-options-body{

	padding:22px;

	display:flex;

	flex-direction:column;

	gap:14px;

}


.cs-newthread-options-body table{

	width:100%;

	border-collapse:collapse;

}


.cs-newthread-options-body td{

	padding:14px;

	color:#d9fbe0;

	border-bottom:
		1px solid rgba(255,255,255,.05);

}


.cs-newthread-options-body tr:last-child td{

	border-bottom:0;

}


.cs-newthread-options-body strong{

	color:#ffffff;

}


.cs-newthread-options-body input[type="checkbox"],
.cs-newthread-options-body input[type="radio"]{

	accent-color:#39ff14;

}



/* =========================================================
   13. ATTACHMENTS
========================================================= */


.cs-newthread-page .attachbox{

	margin-top:20px;

	padding:18px;

	border-radius:22px;

	border:
		1px solid rgba(57,255,20,.16);

	background:
		rgba(255,255,255,.025);

}


.cs-newthread-page input[type="file"]{

	color:#dfffe2;

	font-size:12px;

}


.cs-newthread-page input[type="file"]::file-selector-button{

	padding:8px 14px;

	margin-right:10px;

	border-radius:999px;

	border:
		1px solid rgba(57,255,20,.25);

	background:
		rgba(57,255,20,.08);

	color:#ffffff;

	font-weight:900;

	cursor:pointer;

}


.cs-newthread-page input[type="file"]::file-selector-button:hover{

	background:
		rgba(57,255,20,.15);

}



/* =========================================================
   14. POST OPTIONS / SUBSCRIPTIONS
========================================================= */


.cs-newthread-page .post_options,
.cs-newthread-page .subscription_method{

	padding:16px;

	border-radius:18px;

	border:
		1px solid rgba(57,255,20,.12);

	background:
		rgba(255,255,255,.025);

}


.cs-newthread-page label{

	color:#dfffe2;

}



/* =========================================================
   15. MYBB DEFAULT TABLE CLEANUP
========================================================= */


.cs-newthread-page .tborder{

	width:100% !important;

	border-radius:22px !important;

	border:
		1px solid rgba(57,255,20,.16) !important;

	background:
		linear-gradient(
			180deg,
			#101820,
			#070c11
		) !important;

	overflow:hidden;

}


.cs-newthread-page .thead{

	padding:14px !important;

	background:
		rgba(57,255,20,.08) !important;

	color:#ffffff !important;

	font-weight:950 !important;

}


.cs-newthread-page .trow1,
.cs-newthread-page .trow2{

	background:
		rgba(255,255,255,.025) !important;

	color:#d9fbe0 !important;

	border-color:
		rgba(255,255,255,.05) !important;

}



/* =========================================================
   16. ERROR / NOTICE
========================================================= */


.cs-newthread-page .error,
.cs-newthread-page .red_alert,
.cs-newthread-page .pm_alert{

	padding:15px;

	margin-bottom:18px;

	border-radius:18px;

	border:
		1px solid rgba(255,80,80,.35);

	background:
		rgba(255,80,80,.08);

	color:#ffe1e1;

}

/* =========================================================
   17. ACTION BUTTONS
========================================================= */

.cs-newthread-actions{

	display:flex;

	align-items:center;

	justify-content:center;

	flex-wrap:wrap;

	gap:12px;

	margin-top:22px;

	padding:20px;

	border-radius:24px;

	border:
		1px solid rgba(57,255,20,.16);

	background:
		linear-gradient(
			180deg,
			#101820,
			#070c11
		);

	box-shadow:
		0 18px 45px rgba(0,0,0,.35);

}


.cs-newthread-btn,
.cs-newthread-actions .button,
.cs-newthread-actions input.button{

	display:inline-flex !important;

	align-items:center;

	justify-content:center;

	min-height:44px;

	padding:12px 22px !important;

	border-radius:999px !important;

	border:
		1px solid rgba(57,255,20,.35) !important;

	background:
		linear-gradient(
			180deg,
			rgba(57,255,20,.22),
			rgba(57,255,20,.08)
		) !important;

	color:#ffffff !important;

	font-size:13px !important;

	font-weight:950 !important;

	cursor:pointer;

	box-shadow:
		0 0 22px rgba(57,255,20,.10);

	transition:
		transform .2s ease,
		box-shadow .2s ease,
		border-color .2s ease;
}


.cs-newthread-btn:hover,
.cs-newthread-actions .button:hover,
.cs-newthread-actions input.button:hover{

	transform:translateY(-2px);

	border-color:
		rgba(57,255,20,.65) !important;

	box-shadow:

		0 0 30px rgba(57,255,20,.20);

}


.cs-newthread-btn--ghost{

	background:
		rgba(255,255,255,.05) !important;

	border-color:
		rgba(255,255,255,.12) !important;

	color:#dfffe2 !important;

}



/* =========================================================
   18. PREFIX / MODEL PREMIUM STYLE
========================================================= */


.cs-newthread-page .prefixselect{

	display:inline-flex;

	align-items:center;

}


.cs-newthread-page .prefixselect select{

	min-width:150px;

}


.cs-newthread-page .prefixselect option{

	background:#101820;

	color:#ffffff;

}



/* =========================================================
   19. FORUM RULES
========================================================= */


.cs-newthread-page .forumrules{

	margin-top:22px;

	padding:18px;

	border-radius:20px;

	border:
		1px solid rgba(57,255,20,.16);

	background:
		rgba(57,255,20,.04);

	color:#cdebd2;

	line-height:1.6;

}



/* =========================================================
   20. ANIMATION
========================================================= */


@keyframes csNewThreadGlow{

	0%,
	100%{

		box-shadow:
			0 0 15px rgba(57,255,20,.08);

	}

	50%{

		box-shadow:
			0 0 30px rgba(57,255,20,.18);

	}

}


.cs-newthread-hero__badge{

	animation:
		csNewThreadGlow 3s ease-in-out infinite;

}



/* =========================================================
   21. RESPONSIVE TABLET
========================================================= */


@media(max-width:1100px){

	.cs-newthread-form-grid{

		grid-template-columns:1fr;

	}


	.cs-newthread-editor-layout{

		grid-template-columns:1fr;

	}


	.cs-newthread-smilies{

		max-height:250px;

	}


	.cs-newthread-hero{

		flex-direction:column;

		align-items:flex-start;

	}


	.cs-newthread-hero__badge{

		width:100%;

	}

}



/* =========================================================
   22. RESPONSIVE MOBILE
========================================================= */


@media(max-width:700px){


	#newthread_page .cs-newthread-page{

		width:
			calc(100% - 18px);

		margin:
			18px auto 50px;

	}


	.cs-newthread-hero{

		padding:22px 16px;

		border-radius:22px;

	}


	.cs-newthread-hero h1{

		font-size:24px;

	}


	.cs-newthread-hero p{

		font-size:13px;

	}


	.cs-newthread-card{

		border-radius:20px;

	}


	.cs-newthread-card__head{

		padding:16px;

	}


	.cs-newthread-form-grid{

		padding:14px;

		gap:14px;

	}


	.cs-newthread-subject-row{

		flex-direction:column;

		align-items:stretch;

	}


	.cs-newthread-subject-row select,
	.cs-newthread-subject-row .prefixselect,
	.cs-newthread-subject-input{

		width:100% !important;

		max-width:none;

	}


	.cs-newthread-actions{

		flex-direction:column;

		align-items:stretch;

		padding:15px;

	}


	.cs-newthread-btn,
	.cs-newthread-actions .button,
	.cs-newthread-actions input.button{

		width:100%;

	}


	.cs-newthread-page textarea{

		min-height:240px;

	}


}



/* =========================================================
   23. SMALL MOBILE
========================================================= */


@media(max-width:420px){

	.cs-newthread-hero h1{

		font-size:21px;

	}


	.cs-newthread-card__head h2{

		font-size:17px;

	}


	.cs-newthread-options-body,
	.cs-newthread-form-grid{

		padding:12px;

	}


	.cs-newthread-page input.textbox,
	.cs-newthread-page select{

		height:40px !important;

	}

}



/* =========================================================
   24. REDUCED MOTION
========================================================= */


@media(prefers-reduced-motion:reduce){

	.cs-newthread-page *,
	.cs-newthread-page *::before,
	.cs-newthread-page *::after{

		animation:none !important;

		transition:none !important;

	}

}



/* =========================================================
   END
   NewThread Premium v2 CLEAN FINAL
========================================================= */