/**========================================================================
 
 * @author         :  Cryptrix (edited - Black Mono + Scroll Fix)
 * @store          :  https://codyhub.art
 * @version        :  all versions
 *========================================================================**/

/* fonts removed - uses system font */

/* === SCROLL FIX === */
html, body {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    height: auto;
    -webkit-overflow-scrolling: touch;
}

/* general colors */
a {
    color: #e0e0e0;
}

body {
    background: #0a0a0a;
    color: #b3b3b3;
}

button {
    background: transparent;
    color: #ffffff;
}

input,
textarea,
.post_input_container {
    background: #161616;
    color: #ffffff;
    border: 1px solid #2a2a2a !important
}

/* cookie box */
.cookie_wrap {
    background: #161616;
    color: #b3b3b3;
    border: 1px solid #2a2a2a;
}

/* item with background no effect */
.bback {
    background: rgb(0, 0, 0, 0.12);
}

/* item with background no effect with border */
.bbackb {
    background: rgb(0, 0, 0, 0.10);
    border: 1px solid rgb(255, 255, 255, 0.06);
}

/* item with no background and hover effect */
.bhover:hover,
.bhoverr:hover {
    background: rgb(255, 255, 255, 0.04);
}

/* item with background and hover effect */
.bbackhover {
    background: rgb(0, 0, 0, 0.10);
}

.bbackhover:hover {
    background: rgb(0, 0, 0, 0.18);
}

/* item width background and hover effect with a border */
.bbackhoverb {
    background: rgb(0, 0, 0, 0.05);
}

.bbackhoverb:hover {
    background: rgb(255, 255, 255, 0.03);
    border: 1px solid rgb(255, 255, 255, 0.08);
}

/* item with no background with line separator and hover effect */
.blisting {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.blisting:hover {
    background: rgba(255, 255, 255, 0.04);
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
}

/* item with no background with line separator */
.blist {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

/* private panel top */
.back_ptop {
    background:
        radial-gradient(120% 100% at 50% -30%, rgba(255, 255, 255, 0.06), transparent 55%),
        linear-gradient(180deg, #161616 0%, #0a0a0a 60%, #161616 100%);
    color: #b3b3b3;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.05),
        inset 0 -1px 0 rgba(0, 0, 0, 0.7),
        0 6px 20px rgba(0, 0, 0, 0.5),
        0 0 30px rgba(0, 0, 0, 0.3);
    border-bottom: 2px solid rgba(255, 255, 255, 0.08);
}

#chat_right, #chat_right_data {
    background-image:
        radial-gradient(circle at 50% 45%,
            rgba(0, 0, 0, 0.2) 0%,
            rgba(0, 0, 0, 0.4) 60%,
            rgba(0, 0, 0, 0.8) 100%),
        url('./images/chat_right.jpg');
    background-size: cover, cover;
    background-position: center, center;
    background-repeat: no-repeat, no-repeat;
}

/* page menu & page sub menu */
.bpmenu:hover {
    background: rgba(255, 255, 255, 0.06);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

.bsub { background: rgba(0, 0, 0, 0.3); }
.bsub:hover { background: rgba(255, 255, 255, 0.08); }

/* sub menus */
.bmenu, .submenu { border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
.bmenu:hover, .submenu:hover { background: rgba(255, 255, 255, 0.04); }

/* box shadow */
.bshadow, .page_element, .float_menu, .btnshadow, .pboxed {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.6), 0 0 15px rgba(0, 0, 0, 0.4);
}

/* selections */
.bselected, .rselected { background: rgba(255, 255, 255, 0.06); }
.pselected { color: #ffffff; text-shadow: 0 0 8px rgba(0, 0, 0, 0.8); }
.cselected, .liked { background: rgba(255, 255, 255, 0.04); }

/* paginate */
.pag_btn { background: rgba(0, 0, 0, .4); color: #b3b3b3 }
.pagselected, .pag_btn:hover { background: rgba(0, 0, 0, .6) }

/* tags */
.gtag {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.15);
    color: #ffffff;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
}

/* borders */
.bborder { border-bottom: 1px solid rgb(255, 255, 255, 0.05); }
.tborder { border-top: 1px solid rgb(255, 255, 255, 0.05); }
.lborder, .ppanel { border-left: 1px solid rgb(255, 255, 255, 0.05); }
.rborder { border-right: 1px solid rgb(255, 255, 255, 0.05); }
.fborder { border: 1px solid rgb(255, 255, 255, 0.05); }

/* float top */
.float_top, .float_ctop {
    border-bottom: 2px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
}

/* headers */
.bhead {
    background:
        radial-gradient(120% 100% at 50% -30%, rgba(255, 255, 255, 0.06), transparent 55%),
        linear-gradient(180deg, #161616 0%, #0a0a0a 60%, #161616 100%);
    color: #e0e0e0;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.05),
        inset 0 -1px 0 rgba(0, 0, 0, 0.7),
        0 6px 20px rgba(0, 0, 0, 0.5),
        0 0 30px rgba(0, 0, 0, 0.3);
    border-bottom: 2px solid rgba(255, 255, 255, 0.08);
}

/* sidebar */
.bsidebar {
    position: relative;
    color: #e0e0e0;
    background:
        radial-gradient(80% 100% at 0% 50%, rgba(255, 255, 255, 0.04), transparent 55%),
        linear-gradient(180deg, #161616 0%, #0a0a0a 60%, #161616 100%);
    box-shadow:
        inset -1px 0 0 rgba(255, 255, 255, 0.05),
        2px 0 14px rgba(0, 0, 0, 0.5),
        0 0 20px rgba(0, 0, 0, 0.3);
}
.bsidebar::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: linear-gradient(180deg, transparent, #ffffff, #888888, transparent);
    opacity: .4;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
}
.bsidebar::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 56px;
    pointer-events: none;
    background: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.6));
}

.modal_top, .pro_top {
    background: #161616;
    color: #ffffff;
    border-bottom: 2px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
}

.bfoot {
    background:
        radial-gradient(120% 100% at 50% -30%, rgba(255, 255, 255, 0.05), transparent 55%),
        linear-gradient(180deg, #161616 0%, #0a0a0a 60%, #161616 100%);
    color: #e0e0e0;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.05),
        inset 0 -1px 0 rgba(0, 0, 0, 0.7),
        0 6px 20px rgba(0, 0, 0, 0.5),
        0 0 30px rgba(0, 0, 0, 0.3);
    border-bottom: 2px solid rgba(255, 255, 255, 0.08);
}

.foot {
    background: #111111;
    color: #b3b3b3;
    border-top: 2px solid rgba(255, 255, 255, 0.08);
}

/* backgrounds */
.backglob { background: #050505 }
.back_chat {
    background-image:
        radial-gradient(circle at 50% 50%, rgba(0, 0, 0, 0) 0%, rgba(255, 255, 255, 0.04) 45%, rgba(5, 5, 5, 0.9) 100%),
        url('./images/back_chat.jpg');
    background-size: cover, cover;
    background-position: center, center;
    background-repeat: no-repeat, no-repeat;
}
.back_priv, .back_panel, .back_modal, .page_element {
    background: #161616;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.4);
}
.back_menu { background: #161616; border: 1px solid rgba(255, 255, 255, 0.08); }
.back_pmenu { background: #161616; color: #b3b3b3; border: 1px solid rgba(255, 255, 255, 0.08); }
.back_box { background: #161616; border: 1px solid rgba(255, 255, 255, 0.08); }
.back_input {
    background: #161616;
    border-top: 2px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.4);
}
.back_quote {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.04));
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

/* colors */
.theme_color { color: #ffffff; text-shadow: 0 0 8px rgba(0, 0, 0, 0.8); }
.default_color { color: #e0e0e0; }
.error { color: #ff4444; text-shadow: 0 0 8px rgba(0, 0, 0, 0.6); }
.success { color: #00ff88; text-shadow: 0 0 8px rgba(0, 0, 0, 0.6); }
.warn { color: #ffd700; text-shadow: 0 0 8px rgba(0, 0, 0, 0.6); }

/* buttons */
.theme_btn, .back_theme {
    background: linear-gradient(135deg, #2a2a2a, #1c1c1c);
    color: #ffffff;
    font-weight: 600;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.12);
}
.theme_btn:hover, .back_theme:hover {
    box-shadow: 0 0 25px rgba(0, 0, 0, 0.8), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}
.default_btn, .defaultd_btn, .back_default {
    background: #161616;
    color: #e0e0e0;
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
}
.ok_btn { background: #ffffff; color: #0a0a0a; font-weight: 600; box-shadow: 0 0 15px rgba(0, 0, 0, 0.5); }
.warn_btn { background: #ffd700; color: #0a0a0a; font-weight: 600; box-shadow: 0 0 15px rgba(0, 0, 0, 0.5); }
.delete_btn { background: #ff4444; color: #fff; font-weight: 600; box-shadow: 0 0 15px rgba(0, 0, 0, 0.5); }
.send_btn { color: #ffffff; text-shadow: 0 0 8px rgba(0, 0, 0, 0.8); }

.user { color: #ffffff; }
.chat_system { color: #b3b3b3; }
.offline { opacity: 0.5; }
.menui, .subi { color: #e0e0e0; text-shadow: 0 0 6px rgba(0, 0, 0, 0.8); }
.reply_item { background: #161616; }
.main_post_item { color: #999; }
.input_item { color: #e0e0e0; }

/* bubbles */
.target_private, .hunt_quote {
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}
.hunter_private, .targ_quote {
    color: #fff;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}
.cquote {
    background: rgba(255, 255, 255, 0.06);
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.4);
}

/* tabs */
.tab_menu {
    background: #161616;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.6), 0 0 15px rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.08);
}
.tab_selected {
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    text-shadow: 0 0 6px rgba(0, 0, 0, 0.8);
}

/* modal */
.modal_mback { background: rgba(255, 255, 255, 0.04); }
.modal_mborder { border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
.modal_selected { background: rgba(255, 255, 255, 0.08); color: #ffffff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); }
.modal_back { background-color: rgba(0, 0, 0, 0.7); }

/* === MODAL SCROLL FIX (replaces old overflow:visible) === */
.small_modal_out, .large_modal_out, .over_modal_out, .top_modal_out, .over_emodal_out,
.small_modal_in, .large_modal_in, .over_modal_in, .top_modal_in, .over_emodal_in,
.modal_in, .back_modal, .modal_content, .modal_pad {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    max-height: 92vh;
    -webkit-overflow-scrolling: touch;
}

/* chat logs */
.mbubble { background: rgba(22, 22, 22, 0.85); border: 1px solid rgba(255, 255, 255, 0.08); }

@keyframes float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }
.topic_icon {
    width: 50px; height: 50px; position: relative; animation: float 3s ease-in-out infinite;
    background-size: contain; background-repeat: no-repeat; background-position: center;
    background-image: url('/default_images/avatar/default_system.png');
    -webkit-mask-image: url('/default_images/avatar/default_system.png');
    -webkit-mask-size: contain; -webkit-mask-repeat: no-repeat; -webkit-mask-position: center;
    mask-image: url('/default_images/avatar/default_system.png');
    mask-size: contain; mask-repeat: no-repeat; mask-position: center;
    overflow: hidden; border-radius: 50%;
    filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.3)) drop-shadow(0 0 12px rgba(0, 0, 0, 0.6));
}
.topic_icon::before {
    content: ""; position: absolute; top: -50%; left: -75%; width: 200%; height: 200%;
    background: linear-gradient(120deg, rgba(255,255,255,0.15) 0%, rgba(200,200,200,0.3) 50%, rgba(255,255,255,0.15) 100%);
    transform: rotate(25deg); animation: glassShimmer 2.5s ease-in-out infinite; pointer-events: none; filter: blur(4px);
}
@keyframes glassShimmer { 0%{transform:translateX(-100%) rotate(25deg)} 100%{transform:translateX(100%) rotate(25deg)} }
.tpicon { display: none; }

.topic_log {
    background-image: url('./images/topic.jpg');
    background-size: cover; background-position: center center;
    border: 2px solid #2a2a2a; color: #ffffff;
    text-shadow: 0 0 10px rgba(0,0,0,0.8), 1px 1px 0 #000, 2px 2px 0 #000, 3px 3px 0 #000;
    font-weight: 900; margin: 5px auto; border-radius: 12px; width: 95%; max-width: 800px;
    box-shadow: 0 0 20px rgba(255,255,255,0.08), 0 0 40px rgba(0,0,0,0.6), 0 8px 24px rgba(0,0,0,0.6), inset 0 1px 2px rgba(255,255,255,0.05);
}
.topic_log i, .topic_log span { text-shadow: 0 0 10px rgba(0,0,0,0.8),1px 1px 0 #000,2px 2px 0 #000,3px 3px 0 #000; color: #e0e0e0; }

/* progress */
.bprogress { background: linear-gradient(90deg, #333333, #1c1c1c); color: #ffffff; font-weight: 600; box-shadow: 0 0 15px rgba(0,0,0,0.6); }

/* notifications */
.bnotify { background: #ff4444; color: #fff; }
.foot_notify, .head_notify { border: 2px solid #ffffff; }

/* dates */
.sub_date { color: #888888; }
.sub_chat, .sub_priv { color: #a0a0a0; }
.sub_text, .list_mood { color: #888888 }
.list_mood { font-weight: 300 }

/* likes */
.plikes { background-color: rgba(60, 60, 60, 0.5); color: #fff; }
.bspin { color: rgba(255, 255, 255, 0.2); }

/* notices */
.my_notice { color: #fff; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.12); box-shadow: 0 0 15px rgba(0,0,0,0.5); }
.system_text { background: rgba(255,255,255,0.06); color: #ffffff; border: 1px solid rgba(255,255,255,0.08); }

.back_page { background: #0a0a0a; color: #fff; }
.post_video { background: rgb(0, 0, 0, 1); }

/* slider */
.boom_slider .ui-widget-content { background: #161616; border: 1px solid rgba(255,255,255,0.08); }
.boom_slider .ui-state-default { background: #2a2a2a !important; box-shadow: 0 0 10px rgba(0,0,0,0.6); }
.boom_slider .ui-state-active { background: #333333 !important; box-shadow: 0 0 15px rgba(0,0,0,0.8); }
.boom_slider .ui-slider-range { background: linear-gradient(90deg, #333333, #1c1c1c); box-shadow: 0 0 10px rgba(0,0,0,0.5); }

/* selectbox */
.selectboxit-list, .selectboxit-btn {
    background-color: #161616; color: #ffffff;
    border: 1px solid #2a2a2a !important;
    box-shadow: 0 0 8px rgba(0,0,0,0.4);
}
.selectboxit-list .selectboxit-focus .selectboxit-option-anchor {
    background-color: rgba(255,255,255,0.08); color: #ffffff; text-shadow: 0 0 6px rgba(0,0,0,0.8);
}
.selectboxit-default-arrow { border-top: 4px solid #ffffff; }
.selectboxit-btn.selectboxit-enabled:hover,
.selectboxit-btn.selectboxit-enabled:focus,
.selectboxit-btn.selectboxit-enabled:active {
    background: rgba(255,255,255,0.06); color: #ffffff; box-shadow: 0 0 12px rgba(0,0,0,0.5);
}
.selectboxit-options {
    background: #161616;
    border: 1px solid rgba(255,255,255,0.08);
    box-shadow: 0 0 15px rgba(0,0,0,0.4);
    max-height: 220px !important;
    overflow-y: auto !important;
}
.selectboxit-list .selectboxit-option-anchor { color: #b3b3b3; }
.selectboxit-list .selectboxit-option-anchor:hover { background: rgba(255,255,255,0.08); color: #ffffff; }
.selectboxit-container { position: relative; z-index: 10050; }

/* custom */
.modal_in { border: 1px solid rgba(255, 255, 255, 0.02); }

/* ============================================
   USERLIST STIJLEN — toegevoegd aan CODYHUB
   Glassmorphism stijl, past bij dark theme
   ============================================ */

/* ---- Gender Filter Tabs ---- */
.ulist_gender_tabs {
	display: flex;
	gap: 5px;
	padding: 8px 10px 4px 10px;
}

.ulist_gender_tab {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 3px;
	padding: 7px 4px;
	border-radius: 10px;
	border: 1px solid rgba(255,255,255,0.08) !important;
	background: #161616 !important;
	color: #444 !important;
	font-size: 10px;
	font-weight: 700;
	cursor: pointer;
	transition: all 0.2s;
}

.ulist_gender_tab i { font-size: 14px; }

.ulist_gender_tab.active,
.ulist_gender_tab:hover {
	background: #1e2a4a !important;
	color: #7aa4ff !important;
	border-color: rgba(100,149,255,0.4) !important;
}

/* ---- Container ---- */
#container_user {
	padding: 4px 8px 10px 8px !important;
}

/* ---- Base label ---- */
.ulist_label {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	padding: 8px 12px !important;
	border-radius: 10px !important;
	margin: 4px 0 2px 0 !important;
	min-height: 38px !important;
	cursor: default !important;
	position: relative !important;
	overflow: hidden !important;
	background: #161616 !important;
	border: 1px solid rgba(255,255,255,0.08) !important;
}

/* Shimmer lijn bovenaan elk label */
.ulist_label::before {
	content: '' !important;
	position: absolute !important;
	top: 0 !important;
	left: 10% !important;
	right: 10% !important;
	height: 1px !important;
	background: rgba(255,255,255,0.12) !important;
	pointer-events: none !important;
}

.ulist_label_icon {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 20px !important;
	flex-shrink: 0 !important;
	font-size: 14px !important;
}

.ulist_label_data { flex: 1 !important; }

.ulist_label_data p {
	margin: 0 !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	letter-spacing: 0.3px !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

/* Count badge */
.ulist_count {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-width: 20px !important;
	height: 20px !important;
	padding: 0 6px !important;
	border-radius: 10px !important;
	font-size: 10px !important;
	font-weight: 800 !important;
	flex-shrink: 0 !important;
}

/* Status dot */
.ulist_label_dot {
	width: 8px !important;
	height: 8px !important;
	border-radius: 50% !important;
	flex-shrink: 0 !important;
	display: block !important;
}

/* ---- Rank kleuren ---- */
.ulist_label.ulist_onairdj   { background: #0d1f3c !important; border-color: #1e4080 !important; }
.ulist_label.ulist_onairdj   .ulist_label_data p { color: #7ab4ff !important; }
.ulist_label.ulist_onairdj   .ulist_label_icon   { color: #7ab4ff !important; }
.ulist_label.ulist_onairdj   .ulist_count        { background: #1a3a6e !important; color: #90c4ff !important; border: 1px solid #2a5aaa !important; }
.dot_online { background: #4a8cff !important; box-shadow: 0 0 6px #4a8cff !important; }

.ulist_label.ulist_owner     { background: #1a1200 !important; border-color: #4a3800 !important; }
.ulist_label.ulist_owner     .ulist_label_data p { color: #ffd54f !important; }
.ulist_label.ulist_owner     .ulist_label_icon   { color: #ffd54f !important; }
.ulist_label.ulist_owner     .ulist_count        { background: #3a2800 !important; color: #ffd54f !important; border: 1px solid #6a4a00 !important; }

.ulist_label.ulist_support   { background: #001a12 !important; border-color: #00573a !important; }
.ulist_label.ulist_support   .ulist_label_data p { color: #40e0a0 !important; }
.ulist_label.ulist_support   .ulist_label_icon   { color: #40e0a0 !important; }
.ulist_label.ulist_support   .ulist_count        { background: #003320 !important; color: #40e0a0 !important; border: 1px solid #006640 !important; }

.ulist_label.ulist_superadmin { background: #200010 !important; border-color: #660040 !important; }
.ulist_label.ulist_superadmin .ulist_label_data p { color: #ff80c0 !important; }
.ulist_label.ulist_superadmin .ulist_label_icon   { color: #ff80c0 !important; }
.ulist_label.ulist_superadmin .ulist_count        { background: #400020 !important; color: #ff80c0 !important; border: 1px solid #880050 !important; }

.ulist_label.ulist_admin     { background: #200008 !important; border-color: #660020 !important; }
.ulist_label.ulist_admin     .ulist_label_data p { color: #ff8090 !important; }
.ulist_label.ulist_admin     .ulist_label_icon   { color: #ff8090 !important; }
.ulist_label.ulist_admin     .ulist_count        { background: #400010 !important; color: #ff8090 !important; border: 1px solid #880030 !important; }

.ulist_label.ulist_moderator { background: #001a10 !important; border-color: #005030 !important; }
.ulist_label.ulist_moderator .ulist_label_data p { color: #40d090 !important; }
.ulist_label.ulist_moderator .ulist_label_icon   { color: #40d090 !important; }
.ulist_label.ulist_moderator .ulist_count        { background: #003020 !important; color: #40d090 !important; border: 1px solid #006040 !important; }

.ulist_label.ulist_mod       { background: #130a28 !important; border-color: #3a1a70 !important; }
.ulist_label.ulist_mod       .ulist_label_data p { color: #b090ff !important; }
.ulist_label.ulist_mod       .ulist_label_icon   { color: #b090ff !important; }
.ulist_label.ulist_mod       .ulist_count        { background: #250a50 !important; color: #b090ff !important; border: 1px solid #5030a0 !important; }

.ulist_label.ulist_rdj       { background: #0a1a28 !important; border-color: #1a4870 !important; }
.ulist_label.ulist_rdj       .ulist_label_data p { color: #70c0ff !important; }
.ulist_label.ulist_rdj       .ulist_label_icon   { color: #70c0ff !important; }
.ulist_label.ulist_rdj       .ulist_count        { background: #103050 !important; color: #70c0ff !important; border: 1px solid #2060a0 !important; }

.ulist_label.ulist_bot       { background: #001820 !important; border-color: #004060 !important; }
.ulist_label.ulist_bot       .ulist_label_data p { color: #40d8e8 !important; }
.ulist_label.ulist_bot       .ulist_label_icon   { color: #40d8e8 !important; }
.ulist_label.ulist_bot       .ulist_count        { background: #002a38 !important; color: #40d8e8 !important; border: 1px solid #006080 !important; }
.dot_bot { background: #40d8e8 !important; box-shadow: 0 0 5px #40d8e8 !important; }

.ulist_label.ulist_svip      { background: #180a28 !important; border-color: #4a1a78 !important; }
.ulist_label.ulist_svip      .ulist_label_data p { color: #c890ff !important; }
.ulist_label.ulist_svip      .ulist_label_icon   { color: #c890ff !important; }
.ulist_label.ulist_svip      .ulist_count        { background: #2a0a48 !important; color: #c890ff !important; border: 1px solid #6030a8 !important; }

.ulist_label.ulist_vip       { background: #1a1600 !important; border-color: #504400 !important; }
.ulist_label.ulist_vip       .ulist_label_data p { color: #ffe040 !important; }
.ulist_label.ulist_vip       .ulist_label_icon   { color: #ffe040 !important; }
.ulist_label.ulist_vip       .ulist_count        { background: #302800 !important; color: #ffe040 !important; border: 1px solid #706000 !important; }

.ulist_label.ulist_dj        { background: #001020 !important; border-color: #003060 !important; }
.ulist_label.ulist_dj        .ulist_label_data p { color: #60b8f0 !important; }
.ulist_label.ulist_dj        .ulist_label_icon   { color: #60b8f0 !important; }
.ulist_label.ulist_dj        .ulist_count        { background: #002040 !important; color: #60b8f0 !important; border: 1px solid #105090 !important; }

.ulist_label.ulist_user      { background: #141418 !important; border-color: #2a2a38 !important; }
.ulist_label.ulist_user      .ulist_label_data p { color: #a0a8c0 !important; }
.ulist_label.ulist_user      .ulist_label_icon   { color: #a0a8c0 !important; }
.ulist_label.ulist_user      .ulist_count        { background: #20202c !important; color: #a0a8c0 !important; border: 1px solid #404060 !important; }

.ulist_label.ulist_guest     { background: #101014 !important; border-color: #202028 !important; }
.ulist_label.ulist_guest     .ulist_label_data p { color: #606878 !important; }
.ulist_label.ulist_guest     .ulist_label_icon   { color: #606878 !important; }
.ulist_label.ulist_guest     .ulist_count        { background: #181820 !important; color: #606878 !important; border: 1px solid #303040 !important; }

.ulist_label.ulist_offline   { background: #0e0e14 !important; border-color: #1c1c28 !important; }
.ulist_label.ulist_offline   .ulist_label_data p { color: #404858 !important; }
.ulist_label.ulist_offline   .ulist_label_icon   { color: #404858 !important; }
.ulist_label.ulist_offline   .ulist_count        { background: #1a1040 !important; color: #7060c0 !important; border: 1px solid #302080 !important; }
.dot_offline { background: #303040 !important; box-shadow: none !important; }

/* ---- Webcam indicator ---- */
.webcam-indicator {
	display: inline-flex;
	align-items: center;
	vertical-align: middle;
	margin-left: 12px;
	flex-shrink: 0;
}
.webcam-indicator svg {
	width: 16px; height: 16px; display: block;
	stroke: #7ab4ff;
	filter: drop-shadow(0 0 3px rgba(122,180,255,0.9)) drop-shadow(0 0 7px rgba(74,140,255,0.7));
	overflow: visible;
}

/* ---- Scrollbar userlist ---- */
#user_list::-webkit-scrollbar,
#container_user::-webkit-scrollbar { width: 3px; }
#user_list::-webkit-scrollbar-track { background: transparent; }
#user_list::-webkit-scrollbar-thumb { background: rgba(100,149,255,0.2); border-radius: 3px; }

/* ---- User rows ---- */
.vpad5 { padding: 2px 0 4px 0; }
.offline_user .user_item,
.offline_user [class*="user_name"] { opacity: 0.4; }