/* INFO MESSAGES, ERRORS */
.message-info {line-height: 1.5; margin-bottom: 20px; 
	background-color: var(--ui-bg-attention); box-shadow: 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24);
	border: 1px solid var(--ui-bd-attention); position: relative; padding: 15px 20px;}
.message-info__title {font-weight: var(--ui-fw-bolder);}

/* VOTE BLOCK */

/*--- VOTE BARS ---*/

/* MAY BE TO DELETE */


/* SERVICE PAGE COMMON, FORM
----------------------------------------------- */
.serv__title {font-size: 24px; font-weight: var(--ui-fw-bolder); margin-bottom: 30px;}
.serv__subtitle {font-size: 18px; font-weight: var(--ui-fw-bolder); margin-bottom: 20px;}
.serv__section {margin-bottom: 30px;}
.serv__gap {gap: 10px;}
.serv__links a {color: var(--ui-accent); border-bottom: 1px dotted var(--ui-accent);}
.serv__table-resp {overflow-y: hidden; overflow-x: auto;}
.serv__table table {width: 100%;}
.serv__table table thead tr, .pm tbody tr:first-child {background-color: var(--ui-bg-black); color: #fff;}
.serv__table table td {padding: 10px 10px; font-size: 13px; border: 1px solid var(--ui-bdc);}
.serv__table table tbody tr:nth-child(2n) {background-color: var(--ui-bg-darker);}

.form__row + .form__row {margin-top: 20px;}
.form__row {display: grid; gap: 10px 20px; align-items: center; grid-template-columns: 200px minmax(200px,1fr); position: relative;}
.form__row--textarea, .form__row--textarea .form__label, .form__row--wide {display: block;}
.form__row--textarea .form__label {background-color: var(--ui-bg-black); color: #fff; padding: 15px;}
.form__label--important::after {content: "*"; margin: 0 0 0 5px; color: var(--ui-red);}
#result-registration, .ui-helper-hidden-accessible, #related_news, .form__vote {grid-column: 1 / -1; padding: 20px; 
	background-color: var(--ui-bg-attention); border: 1px solid var(--ui-bd-attention);}
.form__find-related {position: absolute; right: 0; top: 0; border-radius: 0 4px 4px 0;}
.form__content select, #category {width: 100% !important;}
.bb-pane + textarea {border-radius: 0 0 4px 4px;}
.xfieldsnote {color: var(--ui-tt-fade); font-size: 13px; margin-top: 5px;}

.form__table {width: 100%;}
.form__table tr + tr td {padding-top: 20px;}
.form__table .addnews {width: 220px;}
.xfields textarea, .xprofile textarea, .form__textarea--height {height:100px !important;}
.xfields .bb-editor, .xfields .wseditor {margin-top:10px;}
td.xfields {position: relative;}

.form__row--checkboxes-group {display: grid; grid-gap: 20px 20px; grid-template-columns: repeat(auto-fill,minmax(280px,1fr)); align-items: start;}
.form__sec-code > input {flex: 1 1 0; margin-right: 10px; height: 80px; line-height: 80px; text-align: center;}
.form__row--submit {display: flex !important;}
.form__row--submit button {min-width: auto; white-space: nowrap;}
.form__btn {width: 220px;}


/* CHECKBOXES, RADIO BUTTONS
----------------------------------------------- */
.has-radiobox label {position: relative; padding-left: 32px; display: block; cursor: pointer;}
.has-radiobox input {appearance: none; -webkit-appearance: none; display: block; width: 22px; height: 22px; cursor: pointer;
	border: 1px solid var(--ui-bdc); background: var(--ui-bg); border-radius: 50%;
	position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.has-radiobox label input:checked::before {content: ''; background-color: var(--ui-accent); 
	width: 12px; height: 12px; border-radius: 50%; position: absolute; left: 4px; top: 4px;}
.has-checkbox, .checkbox {display: block; position: relative; padding-left: 50px; cursor: pointer;}
.has-checkbox, .checkbox label {cursor: pointer; display: block;}
.has-checkbox input, .checkbox input {
	appearance: none; -webkit-appearance: none; display: inline-block; transition: all .2s linear;
	height: 22px; width: 40px; border-radius: 11px; background-color: var(--ui-bg-darker); cursor: pointer;
	box-shadow: var(--ui-bsh-inset); position: absolute; left: 0; top: 50%; margin-top: -11px;}
.has-checkbox input::before, .checkbox input::before {content: ''; width: 20px; height: 20px; border-radius: 10px; 
	position: absolute; left: 1px; top: 1px; background-color: var(--ui-bg); transition: all .2s linear;}
.has-checkbox input:checked, .checkbox input:checked {background-color: var(--green);}
.has-checkbox input:checked::before, .checkbox input:checked::before {left: 19px;}


/* STATS, PM, TABLES
----------------------------------------------- */


/* USER PROFILE, USER POPUP
----------------------------------------------- */


/* SEARCH PAGE, SEARCH TABLE */
.search-page__simple-form {gap: 10px; margin-bottom: 20px;}

/*--- AJAX LOADER ---*/
#loading-layer {background-color: rgba(0,0,0,0.66); border-radius: 10px; box-shadow: var(--ui-bsh); 
	padding: 20px; color: #fff; line-height: 1.6; max-width: calc(100w - 30px);}
#loading-layer::before {content: ''; width: 80px; height: 80px; border-radius: 50%; 
	border: 10px solid rgba(255,255,255,0.15); border-left-color: #ffda4a; 
	display: block; box-sizing: border-box; animation: rotate 1s linear infinite;}
@keyframes rotate { 100% {transform: rotate(360deg);} }
#loading-layer svg {display: none;}
#loading-layer.withtext {position: relative; padding: 15px 20px 15px 80px; min-height: 60px;}
#loading-layer.withtext::before {width: 40px; height: 40px; border-width: 5px; 
	position: absolute; left: 20px; top: 50%; margin-top: -20px;}


/*--- QUOTES, SPOILERS, HIDDEN TEXT, SCRIPTCODE ---*/


/*--- RATING ---*/

/*---BB EDITOR ---*/


/*--- DROP NENU ---*/
#dropmenudiv {font: 13px Arial; padding: 10px; display: none; background: var(--ui-bg); 
	border-radius: 8px;  box-shadow: 0 0 50px 0 rgba(0,0,0,0.22); z-index:200 !important;}
#dropmenudiv a {display: block; text-decoration: none; padding: 5px 8px; width: 154px;}


/*--- TAGS CLOUD ---*/


/*--- SEARCH SUGGESTIONS---*/
#searchsuggestions::after {content: 'Все результаты поиска';}
#searchsuggestions::before {font-size: 16px; font-weight: 700; color: #888888; margin-bottom: 15px; 
	display: block; content: 'Возможно, вы ищете';}
#dofullsearch, #searchsuggestions .seperator {display: none;}
#searchsuggestions {z-index: 99998; background-color: #fff; color: #000; --tt: #000; box-shadow: var(--bsh-long); 
	border-radius: 24px; padding: 24px; width: var(--searchWidth, 300px); font-weight: 700;
	position: absolute; left: 0; top: 120%; max-height: 80vh; overflow-y: auto;}
#searchsuggestions span {display: block;}
#searchsuggestions span.notfound {padding: 20px; text-align: center;}
#searchsuggestions span.seperator a, #searchsuggestions::after {width: 100%; height: 40px; border-radius: 20px; font-weight: 400; font-size: 14px; margin-top: 24px; 
	display: flex; align-items: center; justify-content: center; background-color: var(--ui-bg-btn); color: var(--ui-tt-btn);}


/*--- UI DIALOG ---*/
.ui-front {z-index: 1000;}
.ui-widget-overlay {background: #000; opacity: 0.6; left: 0; top: 0; right: 0; bottom: 0; position: fixed;}
.ui-dialog {background-color: var(--ui-bg); border-radius: 10px; max-width: 100% !important;
	box-shadow: var(--ui-bsh); width: 600px; position: absolute;}
.ui-dialog-titlebar {padding: 15px 30px; border-radius: 10px 10px 0 0;
	display: flex; align-items: center; gap: 10px; background-color: var(--ui-bg-black); color: #fff;}
.ui-dialog-title {font-size: 19px; font-weight: var(--ui-fw-bolder);}
.ui-dialog-titlebar-close {color: #fff; font-size: 24px; width: 40px; height: 40px; 
	overflow: hidden; text-indent: -200px; position: relative; margin-right: -10px; border-radius: 6px;}
.ui-icon-closethick {display: grid; place-items: center; position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.ui-icon-closethick::before {content:"X"; text-indent: 0;}
.ui-dialog-content {padding: 20px 30px;}
.ui-dialog-buttonpane {padding: 0 30px 20px 30px;}
.ui-dialog-buttonset, .save-buttons {display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 10px;}
.ui-dialog-buttonset button, .save-buttons input.bbcodes {height: 36px; padding: 0 15px; font-size: 14px; 
	flex: 1 1 0; max-width: 100%; min-width: auto; white-space: nowrap;}
.ui-dialog .ui-resizable-se {bottom: 3px; height: 14px; right: 3px; width: 14px;}
.ui-draggable .ui-dialog-titlebar {cursor: move;}
.dle-popup-complaint .ui-dialog-content textarea, .dle-popup-sendpm .ui-dialog-content textarea {margin: 10px 0 20px 0; height: 100px !important;}
.dle-popup-complaint .ui-dialog-content textarea:last-child {margin-bottom: 0;}
.ui-dialog-content br + input, .ui-dialog-content br + select {margin-top: 10px; width: 100% !important;}
@media screen and (max-width: 760px) {
	.ui-dialog-titlebar, .ui-dialog-content, .ui-dialog-buttonpane {padding-left: 20px; padding-right: 20px;}
}


/* ---  UI MENU --- */

/*--- UPDATES TO NEW VERSIONS ---*/

/*--- 11, 12 ---*/

/*--- 13, 14, 15, 16, 17 ---*/

.dle-popup-quickedit .ui-dialog-titlebar-close, .ui-dialog-titlebar .ui-button-text {text-indent: -200px;}
.ui-dialog-titlebar .ui-button-text::before {content:"X"; text-indent: 0; 
	position: absolute; inset: 0; display: grid; place-items: center;}
.dle-popup-quickedit .ui-dialog-content {height: calc(100vh - 170px) !important;}
.quick-edit-text {width: 100%;}
.xfieldsrow::after {content: ''; clear: both; display: table;}

.DLEPush {z-index: 1000; position: fixed; right: 20px; top: 20px;}
@keyframes DLEPush-show {
	0% {transform: translateY(100%); opacity: 0;}
	100% {transform: translateY(0); opacity: 1;}
}
.DLEPush-notification.wrapper {animation-name: DLEPush-show; animation-duration: 0.3s; position: relative;
	display: grid; gap: 10px; margin-bottom: 10px; width: 400px; max-width: calc(100vw - 40px); 
	color: #333; background-color: hsl(var(--hue,174), 41%, 91%); box-shadow: 0 10px 15px rgb(0 0 0 / 15%); 
	border-radius: 6px; padding: 15px 30px 15px 60px; overflow: hidden;}
.DLEPush-notification .DLEPush-icon {display: grid; place-items: center; position: absolute; left: 0; top: 0; 
	color: #fff; background-color: hsl(var(--hue,174), 100%, 27%); width: 45px; height: 100%;}
.DLEPush-notification .DLEPush-icon svg {scale: 0.8;}
.DLEPush-notification .DLEPush-header {font-weight: bold; font-size: 1.1em;}
.DLEPush-notification .DLEPush-header:empty {display: none;}
.DLEPush-notification .DLEPush-close {position: absolute; top: 50%; right: 10px; background: none;
	border: 0; padding: 0; color: inherit; font-size: 1.4em; transform: translateY(-50%);}
.DLEPush-notification.wrapper.push-success {--hue: 174;}
.DLEPush-notification.wrapper.push-warning {--hue: 36;}
.DLEPush-notification.wrapper.push-error {--hue: 14;}
input[type="text"].comments_author_field {width: 100%; margin-bottom: 10px;}

/* --- ADAPTIVE --- */
@media screen and (max-width: 760px) {
	.serv__gap, .form__row--submit {gap: 10px;}
	.form__row {grid-template-columns: minmax(200px,1fr);}
	.form__table, .form__table tr, .form__table td, .form__table tbody {display: block; width: 100%; min-height: 22px; padding: 0 !important;}
	.form__table tr + tr {padding-top: 20px !important;}
	.form__table .addnews {width: 100%; padding: 0 0 10px 0 !important;}
	.form__find-related {position: static; width: 100%; border-radius: 4px;}
	.qq-upload-button {width: 100% !important;}
	.form__btn {width: 100%;}
}
@media screen and (max-width: 590px) {
	.form__sec-code img {height: 60px; width: 120px;}
	.form__sec-code > input {height: 60px; line-height: 60px;}
	.comments-tree-list .comments-tree-list {padding-left: 20px;}
	.xfieldimagegallery, .comments-image-gallery {grid-template-columns: repeat(auto-fill,minmax(140px,1fr));}

}
