/*
 * Vorro Control Panel UI
 * Loaded after native usercp.css/modcp.css.
 * Structural behavior stays native; this layer modernizes the presentation.
 */

td.vorro-cp-navcell {
	width: 245px !important;
	min-width: 245px;
	padding: 0 18px 0 0;
	vertical-align: top;
}

td.vorro-cp-navcell + td {
	width: auto;
	min-width: 0;
	padding: 0;
	vertical-align: top;
}

.vorro-cp-nav {
	position: sticky;
	top: 14px;
	margin-bottom: 16px;
}

.vorro-cp-nav .thead {
	padding: 13px 14px;
}

.vorro-cp-nav .tcat {
	padding: 8px 12px;
	font-size: 10px;
	letter-spacing: .07em;
	text-transform: uppercase;
}

.vorro-cp-nav .trow1,
.vorro-cp-nav .trow2 {
	padding: 4px;
	border-bottom: 0;
}

.usercp_nav_item,
.modcp_nav_item {
	position: relative;
	display: block;
	min-height: 36px;
	padding: 9px 10px !important;
	background-image: none !important;
	background-position: 0 0 !important;
	border-radius: 6px;
	font-size: 12px;
	line-height: 18px;
}

.usercp_nav_sub_pmfolder,
.usercp_nav_trash_pmfolder,
.usercp_nav_email,
.usercp_nav_password,
.usercp_nav_username,
.usercp_nav_editsig,
.usercp_nav_avatar {
	padding-left: 22px !important;
}

.usercp_nav_sub_pmfolder::before,
.usercp_nav_trash_pmfolder::before,
.usercp_nav_email::before,
.usercp_nav_password::before,
.usercp_nav_username::before,
.usercp_nav_editsig::before,
.usercp_nav_avatar::before {
	content: "";
	position: absolute;
	left: 10px;
	top: 50%;
	width: 4px;
	height: 4px;
	margin-top: -2px;
	border-radius: 50%;
	opacity: .65;
}

.usercp_container {
	margin: 0;
	padding: 10px;
	border-radius: 9px;
}

.vorro-current-avatar-cell {
	padding: 14px !important;
}

.vorro-current-avatar,
.vorro-avatar-preview {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 112px;
	height: 112px;
	border-radius: 12px;
	overflow: hidden;
}

.vorro-current-avatar img,
.vorro-avatar-preview img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	object-fit: cover;
	border: 0 !important;
	padding: 0 !important;
	background: transparent !important;
}

.vorro-avatar-preview-cell {
	padding: 12px 0 12px 18px;
}

.usercp_notepad {
	width: 100% !important;
	min-height: 180px;
	resize: vertical;
}

.pmspace {
	float: none;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin: 0;
}

.pmspace_container {
	width: 130px;
	height: 9px;
	overflow: hidden;
	border-radius: 999px;
}

.pmspace_used {
	height: 100%;
	margin: 0;
	border: 0 !important;
}

.pmspace_text {
	padding: 0;
}

/* CP page cards and forms */
td.vorro-cp-navcell + td > .tborder,
td.vorro-cp-navcell + td > form > .tborder,
td.vorro-cp-navcell + td form .tborder {
	margin-bottom: 16px;
}

td.vorro-cp-navcell + td fieldset {
	margin: 8px 0 12px;
	padding: 14px;
}

td.vorro-cp-navcell + td fieldset legend {
	padding: 0 6px;
	font-weight: 700;
}

td.vorro-cp-navcell + td input.textbox,
td.vorro-cp-navcell + td textarea,
td.vorro-cp-navcell + td select {
	max-width: 100%;
}

td.vorro-cp-navcell + td input.textbox[size="25"] {
	width: min(100%, 340px);
}

td.vorro-cp-navcell + td input.textbox[size="45"],
td.vorro-cp-navcell + td input.textbox[size="50"] {
	width: min(100%, 520px);
}

td.vorro-cp-navcell + td textarea {
	width: 100%;
}

td.vorro-cp-navcell + td .fileupload {
	max-width: 100%;
	padding: 7px;
	border-radius: 6px;
}

/* Mod CP */
.modqueue_controls {
	width: auto;
	max-width: 320px;
	padding: 10px 12px;
	border-radius: 8px;
}

.modqueue_meta {
	margin-bottom: 8px;
}

.modqueue_mass {
	width: 170px;
}

.modqueue_mass li a {
	padding: 7px 9px;
	border-radius: 6px;
}

.modqueue_mass li a:hover {
	text-decoration: none;
}

.selectall {
	padding: 8px 10px;
}

/* Keep CP tables static just like forum rows. */
td.vorro-cp-navcell + td tr:hover > .trow1,
td.vorro-cp-navcell + td tr:hover > .trow2,
.vorro-cp-nav tr:hover > .trow1,
.vorro-cp-nav tr:hover > .trow2 {
	transition: none !important;
}

@media (max-width: 850px) {
	td.vorro-cp-navcell,
	td.vorro-cp-navcell + td {
		display: block !important;
		width: 100% !important;
		min-width: 0 !important;
		padding: 0 !important;
	}

	td.vorro-cp-navcell {
		margin-bottom: 14px;
	}

	.vorro-cp-nav {
		position: static;
	}

	.vorro-current-avatar-cell {
		width: 1% !important;
	}

	.vorro-cp-nav .trow1 > div {
		display: inline-block;
		margin-right: 6px;
	}
}

@media (max-width: 560px) {
	.vorro-current-avatar-cell {
		display: block !important;
		width: 100% !important;
	}

	.vorro-current-avatar-cell + td {
		display: block !important;
		width: 100% !important;
	}

	.vorro-avatar-preview-cell {
		display: block;
		width: 100% !important;
		padding: 12px 0 0;
		text-align: left;
	}

	td.vorro-cp-navcell + td fieldset table,
	td.vorro-cp-navcell + td fieldset tbody,
	td.vorro-cp-navcell + td fieldset tr,
	td.vorro-cp-navcell + td fieldset td {
		max-width: 100%;
	}
}


/* Vorro light CP skin */
.vorro-cp-nav,
.usercp_container,
.modqueue_controls {
	background: #ffffff;
	border-color: #d7dce0;
}

.vorro-cp-nav .thead {
	background: #1b1f23 !important;
	color: #ffffff !important;
}

.vorro-cp-nav .tcat {
	background: #eef0f2 !important;
	color: #68727a !important;
}

.vorro-cp-nav .trow1,
.vorro-cp-nav .trow2 {
	background: #ffffff !important;
}

.usercp_nav_item,
.modcp_nav_item {
	color: #505960 !important;
}

.usercp_nav_item:hover,
.modcp_nav_item:hover {
	background: #eef0f2 !important;
	color: #171a1d !important;
}

.usercp_nav_sub_pmfolder::before,
.usercp_nav_trash_pmfolder::before,
.usercp_nav_email::before,
.usercp_nav_password::before,
.usercp_nav_username::before,
.usercp_nav_editsig::before,
.usercp_nav_avatar::before {
	background: #7b858d;
}

.usercp_container {
	border: 1px solid #d7dce0;
}

.vorro-current-avatar,
.vorro-avatar-preview {
	background: #f3f4f5;
	border: 1px solid #d4d9dd;
}

.pmspace_container {
	background: #eef0f2;
	border: 1px solid #d3d8dc;
}

.modqueue_controls {
	color: #384047;
	border: 1px solid #d3d8dc;
}

.modqueue_meta {
	color: #6e7880;
}

.modqueue_mass li a:hover {
	background: #eef0f2;
	border-color: #d3d8dc;
}

td.vorro-cp-navcell + td fieldset {
	background: #fafbfb !important;
	border-color: #d8dde1 !important;
}

td.vorro-cp-navcell + td fieldset legend {
	color: #24292e;
}

td.vorro-cp-navcell + td .fileupload {
	background: #ffffff;
	color: #30363b;
	border: 1px solid #cfd5da;
}

.selectall {
	background: #f4f1df !important;
	color: #5f5a3f !important;
	border-color: #ddd7b9 !important;
}

td.vorro-cp-navcell + td tr:hover > .trow1,
.vorro-cp-nav tr:hover > .trow1 {
	background: #ffffff !important;
}

td.vorro-cp-navcell + td tr:hover > .trow2,
.vorro-cp-nav tr:hover > .trow2 {
	background: #fafbfb !important;
}

/* Buddy request tables: explicit template hooks keep empty states comfortably sized. */
.vorro-buddy-requests .vorro-request-empty {
	height: 42px !important;
	padding: 11px 14px !important;
	line-height: 20px !important;
	vertical-align: middle !important;
	box-sizing: border-box;
	color: #4d5861;
}

.vorro-buddy-requests .vorro-request-empty-row:last-child > .vorro-request-empty {
	border-bottom: 0 !important;
}

/* Buddy/Ignore add-user rows: align legacy MyBB float layout to modern Vorro controls. */
#buddy .trow1 > fieldset:first-of-type > .float_left,
#ignored .trow1 > fieldset:first-of-type > .float_left {
	display: flex !important;
	align-items: center;
	justify-content: flex-end;
	width: 120px !important;
	min-height: 38px;
	margin-top: 7px;
	line-height: 1.25;
}

#buddy .trow1 > fieldset:first-of-type > .float_left + div,
#ignored .trow1 > fieldset:first-of-type > .float_left + div {
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 38px;
	margin-top: 7px !important;
	margin-left: 130px !important;
}

#buddy .trow1 > fieldset:first-of-type .select2-container,
#ignored .trow1 > fieldset:first-of-type .select2-container {
	margin: 0 !important;
	vertical-align: middle !important;
}

#buddy_submit,
#ignored_submit {
	height: 38px !important;
	min-height: 38px !important;
	margin: 0 !important;
}

@media (max-width: 640px) {
	#buddy .trow1 > fieldset:first-of-type > .float_left,
	#ignored .trow1 > fieldset:first-of-type > .float_left {
		float: none !important;
		justify-content: flex-start;
		width: auto !important;
		min-height: 0;
		margin: 7px 0 5px !important;
		text-align: left !important;
	}

	#buddy .trow1 > fieldset:first-of-type > .float_left + div,
	#ignored .trow1 > fieldset:first-of-type > .float_left + div {
		flex-wrap: wrap;
		margin: 0 !important;
	}

	#buddy .trow1 > fieldset:first-of-type .select2-container,
	#ignored .trow1 > fieldset:first-of-type .select2-container {
		flex: 1 1 220px;
		width: 100% !important;
		min-width: 0 !important;
	}
}