/**
 * This CSS is just to get you started.
 * Feel free to modify any of it for your own app.
 */

@import url('https://fonts.googleapis.com/css2?family=Prompt:wght@100;400;700&display=swap');

#dashboard, #notices, #content { margin: auto; text-align: left; }
.Q_mobile #notices_slot,
.Q_widebar #notices_slot { width: 100%; position: fixed; left: 0; }
.Q_mobile .Q_overlay { width: 90%; }

:root {
	--html-color: #fff;
	--html-link-color: yellow;
	--html-bg-color: rgb(34, 34, 34);
	--content-bg-color: rgb(34, 34, 34);
	--content-color: #eeeeee;

	--column-bg-color: rgb(34, 34, 34);
	--column-color: white;
	--column-title-bg-color: rgb(34, 34, 34);
	--column-title-color: #eeeeee;

	--column-width: 30%;
	--column-margin: 5px;
	--scrollbar-width: 15px;

	--dialog-title-bg-color: #111111;
	--dialog-title-color: #ffffff;

	--dashboard-icon-size: 40px;

	--dashboard-mobile-height: 50px;
	--dashboard-mobile-bg-color: #000000;
	--dashboard-mobile-bg-color-to: #222222;
	--dashboard-mobile-color: #ffdc03;
	--dashboard-mobile-current-bg: radial-gradient(ellipse at bottom, rgba(255, 255, 255, 0.2) 30%, transparent 85%);
	--dashboard-mobile-current-color: #fff;
	--dashboard-mobile-current-icon-bg: radial-gradient(closest-side, rgba(0, 0, 255, 0.5) 30%, transparent 85%);

	--dashboard-main-bg-color: #000000;
	--dashboard-main-bg-color-to: #222222;
	--dashboard-main-color: #ffdc03;
	--dashboard-current-bg: radial-gradient(ellipse at bottom, rgba(255, 255, 255, 0.2) 30%, transparent 85%);
	--dashboard-current-icon-bg: radial-gradient(closest-side, rgba(0, 0, 255, 0.5) 30%, transparent 85%);
	--dashboard-current-color: white;
	--dashboard-contextual-border: #0543a0;
	--dashboard-contextual-selected-bg: #555555;
	--dashboard-contextual-selected-color: #ffffff;

	--button-bg-color: #ffdc03;
	--button-bg-color-to: #968203;
	--button-bg-color-secondary: #fff;
	--button-bg-color-active: #1a3d73;
	--button-border-color: silver;
	--button-shadow-color: #002D72;
	--button-text-color: black;;
	--button-text-color-secondary: #030303;
	--button-hover-bg-color: #969696;

	--tabs-frequent-color: #ffdc03;

	--chat-bg-color: #002D72;
	--chat-text-color: #fff;

	--tabs-frequent-color: #ffdc03;;

	--h1-font-color: #fff;

	--Q-aspect-where-text-color: #222;
	--Q-aspect-where-border-color: #222;

	--Q-aspect-what-text-color: #bf1118;
	--Q-aspect-what-border-color: #bf1118;

	--Q-aspect-people-text-color: #394ad5;
	--Q-aspect-people-border-color: #394ad5;

	--Q-aspect-when-text-color: #449944;
	--Q-aspect-when-border-color: #449944;

	--Q-aspect-deals-text-color: #e3892f;
	--Q-aspect-deals-border-color: #e3892f;

	--interests-bg-main: #bf1118;
	--interests-text-color: #fff;
	--interests-text-secondary-color: #000;
	--interests-text-selected-color: #000;
	--interests-bg-selected: #fbb;

	--expandable-expanded-background: rgba(0, 0, 0, 0.5);
	--expandable-expanded-color: white;

	--main-text-color: #ffdc03;
}

html {
	background: var(--html-bg-color);
}

.Q_notMobile #dashboard .Q_tabs_tab::before {
	display: none;
}

/**
 * This CSS is just to get you started.
 * Feel free to modify any of it for your own app.
 */
* { font-family: 'Prompt', serif; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-color: transparent; }
a, a:link, a:visited {
	text-decoration: none;
	color: var(--dashboard-main-color);
	cursor: pointer;
}
body { overflow: auto; touch-action: none; }
h2 { margin: 0; }
*, *:before, *:after { box-sizing: inherit; }

/* The various slot containers */
html #notices_slot {
	text-align: center;
}
html #content_slot {
	position: relative;
	overflow-x: auto;
	overflow-y: hidden;
	background: var(--content-bg-color);
	color: var(--html-color);
	box-shadow: #aaa 0 0 4px;
	-webkit-box-shadow: #aaa 0 0 4px;
	-moz-box-shadow: #aaa 0 0 4px;
}
html.FTL_links #content_slot {
	overflow-y: auto;
	padding: 2%;
}
#content_slot,
#content,
#content .Q_columns_tool,
#Q_columns-Communities_tool,
.Q_columns_container {
	height: 100%;
}
.Q_notMobile.Q_layout_sidebar #dashboard_slot {
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
}
#dashboard_slot h1 {
	line-height: 30px;
	font-size: 32px;
	margin-top: 10px;
}
#dashboard_slot input,
#dashboard_slot textarea { color: black; }
.Q_mobile #page { overflow: auto; -webkit-overflow-scrolling: touch; z-index: 0; }
#dashboard_slot .Q_inplace_tool .Q_hover .Q_inplace_tool_static,
#dashboard_slot .Q_inplace_tool .Q_hover .Q_inplace_tool_blockstatic {
	background: white;
	color: #333333;
}
.Q_mobile #dashboard_slot #dashboard[data-style=icons] .FTL_logo {
	display: none;
}
.Q_mobile #dashboard_slot #dashboard[data-style=icons] #dashboard_user {
	display: block;
}
.Q_mobile.Users_loggedIn #dashboard_slot #dashboard[data-style=icons] #dashboard_user {
	padding: 0 3px;
}
.Q_mobile #dashboard[data-style=icons] .Q_tabs_tab, .Q_mobile #dashboard[data-style=icons] #Users_status_tool {
	min-width: unset;
}
.Q_layout_widebar #dashboard .Q_tabs_tab, .Q_layout_widebar #dashboard .Users_status_tool {
	border: none;
}
.Q_layout_widebar.Q_notMobile #dashboard .Q_tabs_tabs {
	height: 100%;
	overflow: hidden;
}
.Q_notMobile #dashboard .Q_tabs_tab a {
	display: block;
	line-height: 40px;
}
.Q_notMobile .Users_status_login { margin: 5px; }

.Q_mobile .Users_status_login:before {
	display: block;
	font-size: 35px;
	width: calc(var(--dashboard-mobile-height) - 20px);
    height: calc(var(--dashboard-mobile-height) - 20px);
	line-height: calc(var(--dashboard-mobile-height) - 20px);
	color: var(--dashboard-mobile-color);
	font-family: 'icomoon';
	content: "\e98d";
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	-webkit-font-smoothing: antialiased;
}

#content { position: relative; }

/* Notices contents */
#notices_slot { position: fixed; text-align: center; margin: auto; padding: 0; z-index: 5000; }
#notices { margin: auto; }
#notices_slot div.container { overflow: hidden; overflow-y: auto; }
#notices_slot ul { list-style-type: none; padding: 0; margin: auto; width: 700px; max-width: 100%; border: solid 1px #555; border-top: solid 1px #aaa; box-shadow: 0 0 5px #222; -moz-box-shadow: 0 0 5px #222; -webkit-box-shadow: 0 0 5px #222; cursor: pointer; }
#notices_slot li { list-style-type: none; padding: 0; margin: 0; text-align: center; background: #ffd4aa; border: 0; border-bottom: solid 1px #aaa; line-height: 30px; min-height: 30px; }
#notices_slot ul.Q_errors * { background-color: #ebb; color: #500; }
#notices_slot ul.Q_errors li { text-align: left; padding: 0 10px 0 10px; }
#notices_slot .Q_field_name { float: right; font-size: 12px; padding-right: 10px; }
#notices_slot button
{
	display: inline-block;
	vertical-align: top;
	margin-left: 5px;
	padding: 2px 10px;
	color: #69552e;
	background: #F1E2C6;
	box-shadow: 1px 1px 1px 0 #CCC;
	border: none;
}
.Q_notTouchscreen #notices_slot button:active
{
	background: #f0d298;
	margin-left: 6px;
	box-shadow: none;
}
#notices_slot ul li .Q_field_name {
	font-size: 12px;
	line-height: 26px;
}
#notices_slot ul li * {
	vertical-align: middle;
}

body .Q_tabs_contextual .Q_listing li { text-align: left; }
html .Q_listing img { height: 30px; }

/* inputs */

input[type=text],
input[type=email],
input[type=tel],
input[type=password],
input[type=number],
input.text,
input.email,
input.tel,
input.password,
input.number,
textarea { border: 1px solid #ccc; border-bottom: 1px solid #aaa; cursor: text; font-family: "Trebuchet MS"; min-height: 40px; }
input[type=text]:focus,
input[type=email]:focus,
input[type=tel]:focus,
input[type=password]:focus,
input[type=number]:focus,
input.text:focus,
input.email:focus,
input.tell:focus,
input.password:focus,
input.number:focus,
textarea:focus { box-shadow: 0 1px 10px rgba(0,0,0,.15); -webkit-box-shadow: 0 1px 4px rgba(0,0,100,.15); -moz-box-shadow: 0 1px 4px rgba(0,0,100,.15); }
input.placeholder,
textarea.placeholder { color: #aaa; font-style: italic; }
select:focus { outline: dotted 1px #779; }
/* select { margin-top: 0.75em; } */
input[type=text],
input[type=password],
input[type=tel],
input[type=password],
input[type=number],
input.text,
input.email,
input.tel,
input.password,
input.number,
textarea { border-radius: 3px; -moz-border-radius:3px; -webkit-border-radius:3px; padding: 0 4px 0 4px; }
input[type=checkbox],
input[type=radio] { margin-right: 5px; }
html .Q_inplace_tool_fieldinput { padding: 0; }

.Q_overlay,
.Q_fullscreen_dialog {
	border: none;
	background: black;
	color: white;
	fill:white;
	text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.5);
	box-shadow: 0 0 30px 10px rgba(255, 255, 255, 0.2);
}

/* The following lines are for cordova on iOS */
.Q_notCordova #status_background { display: none; }
.Q_cordova.Q_ios #status_background {
	background: #f2f2f2;
	height: 20px;
}

.Q_cordova.Q_ios.Q_mobile #dashboard_slot { top: 20px; height: 70px; }
.Q_cordova.Q_ios.Q_mobile.Communities_dashboard_withTitles[data-dashboard-position="top"] #page { top: 90px; }

.Q_cordova.Q_ios.Q_mobile.Q_notch #status_background {
	background: black;
	height: constant(safe-area-inset-bottom);
	height: env(safe-area-inset-top);
}
.Q_cordova.Q_ios.Q_mobile.Q_notch #dashboard_slot {
	top: calc(env(safe-area-inset-top));
	height: 50px;
}
.Q_cordova.Q_ios.Q_mobile.Q_notch #page {
	top: calc(env(safe-area-inset-top) + 50px);
}

/* The following lines are for a flatter look */
html .Q_listing li { font-size: 18px; padding: 0 10px; line-height: 40px; text-align: left; border-top: solid 1px white; border-bottom: solid 1px #CCC; background: #f2f2f2; -webkit-touch-callout: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; white-space: nowrap; overflow: hidden;
}

html.FTL_notFound #content,
html.FTL_errors #content { padding: 30px; text-align: center; overflow: hidden; text-overflow: ellipsis; }
html.FTL_notFound .url,
html.FTL_errors .url { font-weight: bold; text-decoration: underline; }

span.c3 { font-weight: bold; }

#Q_columns-Communities_tool {
	height: 100%;
}

#Q_columns-Communities_tool .Q_column_event .Q_title_slot,
.Calendars_event_tool .Calendars_event_title,
.Calendars_event_tool .Calendars_event_title *,
.Calendars_event_tool .Calendars_event_description,
.Calendars_event_tool .Calendars_event_description * {
	font-family: inherit;
}

#Q_columns-Communities_tool .Q_columns_column .Q_title_slot {
	background: var(--content-bg-color);
}

#Q_columns-Communities_tool .Q_columns_column .Q_column_slot {
	background: var(--content-bg-color);
}

#Q_columns-Communities_tool .Q_columns_column .Q_controls_slot {
	background: var(--content-bg-color);
}

.Communities_buttons { margin: 15px 0; }
.Calendars_event_preview_tool { margin: 20px 0; }

.Calendars_event_preview_background { box-shadow: 0 7px 20px -5px rgba(0,0,0,.5), 0 1px 3px rgba(0,0,0,.3); }

.Calendars_event_foreground,
.Calendars_event_preview_foreground {
	font-size: 24px;
	text-shadow: 0 0 10px #000, 0 2px 3px #000;
}
.Calendars_event_preview_info {
	opacity: .7;
}

.Streams_participants_tool .Streams_participants_summary {
	width: 46px;
	border-radius: 0 0 5px 5px;
	font-size: 13px;
	background-color: #ffdc03;
	color: #000;
	margin-top: 10px;
	text-align: center;
	overflow: hidden;
	margin-right: 10px;
	font-weight: 400;
	text-shadow: none;
}

.Streams_participants_tool .Users_avatar_icon {
	box-shadow: 0 1px 3px rgba(0,0,0,.2), 0 5px 20px -5px rgba(0,0,0,.3);
	border: 1px solid #fff;
	border-radius: 50%;
}

.Q_tab_me img,
.Users_avatar_tool img,
.Streams_participants_invite img {
	border-radius: 2px;
}
.Streams_participants_invite img {
	content: url(../img/plus_yellow.png);
}
.Streams_participants_tool .Streams_invite_label {
	color: var(--dashboard-main-color);
}
.Q_columns_title {
	border: none;
	box-shadow: 0 2px 20px 5px rgba(0,0,0,.05), 0 1px 3px rgba(0,0,0,.1) !important;
	position: relative;
	z-index: 100;
}

.Q_columns_column.Q_column_profile .Q_columns_title {
	box-shadow: none !important;
	background: transparent;
}

.Communities .Q_columns_title .Q_title_slot {
	font-weight: bold;
	font-size: 25px;
}

.Calendars_event_preview_tool .Calendars_event_title {
	padding: 5px 10px;
}

.Communities_me_column_tabContent {
	border-radius: 5px;
	border: 1px solid #d4d4d4;
}

.Communities_tab.Q_current {
	border: 1px solid #d4d4d4;
	border-bottom: solid 1px transparent;
	border-radius: 5px 5px 0 0;
}
.Communities_schedule_column_tabContent {
	border-top: 1px solid #d4d4d4;
}

.Users_list_tool .Users_avatar_icon {
	border-radius: 10px;
}

.Users_list_tool .Users_avatar_name {
	font-size: 15px;
	margin-top: 5px;
}

.Travel_aspect_trips,
.Q_button.Travel_aspect_trips,
.Travel_trips_needoffer .Q_dialog_content {
	background-size: 8px auto;
	padding: 10px 15px;
	color: var(--html-color);
}

.Q_big_prompt { padding: 20px 10px; }

.Calendars_going {
	display: inline-flex;
	box-shadow: 0 10px 40px -15px rgba(0,0,0,.5), 0 1px 4px rgba(0,0,0,.2);
	border-radius: 5px;
	margin-left: 10px;
}

.Calendars_going span {
	display: inline-block;
	padding: 10px;
	cursor: pointer;
	border-left: solid 1px #e3e3e3 !important;
	color: #8f8f8f;
	background: #fff;
	min-width: 60px;
}

.Calendars_going span.Calendars_yes { padding: 10px; }

.Calendars_yes.Q_selected {
	color: #fff;
	background: #88C906;
	background-image: linear-gradient(to bottom, #A9BD08, #88C906);
	border: 1px solid #A9BD08;
	box-shadow: 0 2px 25px -2px #A9BD08, 0 0 10px 2px #fff;
	z-index: 1;
	position: relative;
}

.Calendars_yes.Q_selected {
	color: #fff;
	background: #88C906;
	background-image: linear-gradient(to bottom, #A9BD08, #88C906);
	border-color: #A9BD08;
	box-shadow: 0 2px 25px -2px #A9BD08, 0 0 10px 2px #fff;
	z-index: 1;
	position: relative;
}

.Calendars_maybe.Q_selected {
	color: #fff;
	/*background: #88C906;*/
	/*background-image: linear-gradient(to bottom, #A9BD08, #88C906);*/
	border-color: #4953d0;
	box-shadow: 0 2px 25px -2px #4953d0, 0 0 10px 2px #fff;
	z-index: 1;
	position: relative;
}

.Calendars_no.Q_selected {
	color: #fff;
	/*background: #88C906;*/
	/*background-image: linear-gradient(to bottom, #A9BD08, #88C906);*/
	border-color: #777;
	box-shadow: 0 0 10px 2px #fff;
	z-index: 1;
	position: relative;
}

.Q_contextual {
	box-shadow: 0 10px 40px -10px rgba(10,30,130, .7), 0 3px 5px rgba(0,0,0,.2);
}

.Q_contextual .Q_listing li.Q_selected *,
.Q_contextual .Q_listing li,
.Q_contextual .Q_listing li * {
	background: transparent;
	border-color: transparent;
}

.Q_contextual .Q_listing li.Q_selected {
	border-color: transparent;
/*	background: #0544a0;
	box-shadow: 0 0 20px -5px #0069f9;*/
	position: relative;
	z-index: 5;
}

.Q_contextual .Q_contextual_top_arrow {
	border-style: solid;
	border-width: 0 20px 16px 20px;
	background: none;
}

div#Calendars_event_composer_tool {
	padding: 20px 0;
}

.Communities_conversation_author .Users_avatar_name { margin-left: 10px; }

.Communities_conversation_content {
	border-radius: 10px;
	margin: 10px 0 20px 0;
}

.Streams_chat_bubble { font-size: 14px; }

.Streams_chat_bubble.Streams_chat_overflowed:after {
	content: '';
	position: absolute;
	bottom: 5px;
	width: 100%;
	height: 28px;
	left: 0;
	/*background: linear-gradient(to bottom, rgba(219, 219, 220, 0), rgb(219, 220, 221));*/
	background: inherit;
	-webkit-mask-image: -webkit-gradient( linear, left bottom, left top, color-stop(0, rgba(0,0,0,1)), color-stop(0.4, rgba(0,0,0,1)), color-stop(1.00, rgba(0,0,0,0)));
}

.Streams_chat_overflowed_indicator { display: none; }

/*.Streams_chat_from_me .Streams_chat_bubble.Streams_chat_overflowed:after {
	background: linear-gradient(to bottom, rgba(48, 92, 223, 0), rgb(48, 93, 223));
}
*/

.Streams_chat_tool .Streams_chat_bubble .Users_avatar_name { opacity: .8; }

.Streams_chat_timestamp {
	margin-right: 20px;
	margin-top: 5px;
	color: #777777;
	font-size: 11px;
}

.Q_placeholders_container {
	min-height: 40px;
}
.Q_placeholders_container .Q_placeholder {
	display: flex;
	align-items: center;
	top: 0 !important;
}

.Q_placeholders_container input { min-height: 40px; }

.Streams_chat_more {
	cursor: pointer;
	background-color: #dfdfdf;
	color: #555;
	text-align: center;
	padding: 5px 0;
	font-size: 11pt;
	margin: 20px 0;
	/*background-image: linear-gradient(to bottom, #f3f3f3, #eaeaea);*/
	/*border: 1px solid #d7d7d7;*/
}

.Users_avatar_tool img,
.Streams_participants_invite img,
.Streams_preview_tool .Streams_preview_icon,
.Streams_preview_tool .Streams_preview_add {
	border-radius: 5px;
}

.Q_columns_title_container .Streams_preview_tool .Streams_preview_icon {
	border: none;
}

.Streams_preview_tool .Streams_preview_icon,
.Streams_preview_tool .Streams_preview_add {
	margin-right: 10px;
}


.Streams_dialog_interests,
.Communities_filter_location {
	border: 1px solid var(--button-bg-color);
	box-shadow: 0 7px 10px -5px var(--button-bg-color);
	background: var(--interests-bg-main);
	color: var(--button-text-color);
	border-radius: 12px;
}

.Q_overlay.Streams_dialog_interests *,
.Q_overlay.Communities_filter_location * {
	color: var(--interests-text-color);
}

.Q_overlay {
	border-radius: 10px;
}

.Q_dialog_title {
	background: var(--dialog-title-bg-color);
	border-bottom: 1px solid var(--dialog-title-bg-color);
	color: var(--dialog-title-color);
	border-radius: 10px 10px 0 0;
	font-size: 18px;
}

.Communities_me_column_tabContent[data-val="interests"],
.Communities_me_column_tabContent[data-val="interests"] .Streams_interests_anything {
	background: var(--html-bg-color);
	color: var(--html-text-color);
}

.Communities_me_column_tabContent[data-val="credits"] {
	text-align: center;
}

.Communities_me_column_tabContent[data-val="interests"] .Streams_interests_choseAnything .Streams_interests_anything,
.Communities_me_column_tabContent[data-val="interests"] .Q_expandable_count,
.Communities_me_column_tabContent[data-val="interests"] .Q_expandable_tool .Q_selected,
.Communities_me_column_tabContent[data-val="interests"] .Streams_interests_tool .Q_selected {
	background: rgba(255, 180, 180, 0.9);
	color: #220;
	text-shadow: none;
}

#page .Calendars_info .Q_button i {
	color: inherit !important;
}

.Calendars_info .Travel_trips_buttons span { color: #3777ea; }

.Travel_trips_tool[data-userId]:not([data-userId=""]) .Travel_trips_notGoing { background: none; padding-left: 0; text-align: left; }

.Travel_trips_tool[data-userId]:not([data-userId=""]) .Travel_trips_notGoing:before {
	content: '';
	font-family: 'qplatform-communities' !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-size: 28px;
	vertical-align: middle;
	min-width: 10px;
	min-height: 10px;
	display: inline-block;
	content: "\e907";
	margin-right: 15px;
}

.Q_selected,
.Places_location_tool .Places_location_preview_tool.Q_selected {
	background: #777777;
	border: 1px solid #005fff;
	margin: -1px;
	box-shadow: 0 0 6px 1px #4990ff, inset 0 0 3px #1764dd;
}

.Q_expandable_count {
	background-color: rgba(255, 34, 34, 0.9);
	color: #fff;
}

.Q_columns_column .Q_columns_title i,
.Q_controls_trigger *,
.Q_controls_trigger *::before {
	color: white;
}

.Communities_filter_location .Q_dialog_content { padding: 10px; }

.Communities_me_column .Communities_me_icon:before {
	color: #919191;
	font-size: 24px;
}
.Q_tool.Streams_chat_tool .Streams_chat_composer .Streams_chat_subscription {
	width: 40px;
	height: 40px;
}
.Q_tool.Streams_chat_tool .Streams_chat_composer .Streams_chat_submit,
.Q_tool.Streams_chat_tool .Streams_chat_composer .Streams_chat_call,
.Q_tool.Streams_chat_tool .Streams_chat_composer .Streams_calls_tool {
	top: 2px;
	right: 3px;
	width: 35px;
	height: 35px;
	line-height: 35px;
}

.Q_tool.Streams_chat_tool .Streams_chat_composer input { padding-right: 40px; margin-left: 45px; width: calc(100% - 45px); height: 40px; }
.Q_tool.Streams_chat_tool .Streams_chat_composer ~ hr { display: none; }

.Calendars_event_composer_tool .Calendars_event_composer > div:before { color: #9e9e9e !important; }

.Communities_filter_location .Places_location_tool div[data-location=current],
.Communities_filter_location .Places_location_preview_tool,
.Communities_filter_location .Communities_filter_location_all,
.Communities_filter_location .Places_location_tool .Places_location_preview_tool,
.Communities_filter_location .Places_location_tool div[data-location=address],
.Communities_filter_location .Places_location_tool div[data-location=current],
.Communities_filter_location .Places_location_tool .Places_areas_tool {
	background-color: rgba(255, 255, 255, 0.2);
}

.FTL_counts {
	padding: 10px;
	text-align: center;
}

.FTL_getStarted {
	font-size: 30px;
	font-weight: bold;
}

.FTL_answer .Q_dialog_content {
	padding: 10px;
}
.FTL_answer .Q_dialog_content h2 {
	margin-bottom: 20px;
}
.FTL_answer .Q_dialog_content tr {
	display: block;
}
.FTL_answer .Q_dialog_content tr:not(:last-child) {
	margin-bottom: 10px;
}
.FTL_answer .Q_dialog_content input[type=checkbox] {
	width: 30px;
	height: 30px;
}

.Q_mobile.Communities_dashboard_withTitles #dashboard .Q_tabs_tab {
	width: 50px;
}

#dashboard .FTL_logo {
	float: left;
	display: inline-block;
	height: 50px;
	width: auto;
}

.Q_mobile #dashboard .FTL_logo {
	margin: 10px;
}
/* #dashboard .Q_tabs_tab::before {
	font-size: 40px !important;
}
#dashboard .Q_tabs_tab.Q_tab_conversations::before {
	font-size: 50px !important;
} */

#dashboard .Q_tabs_tab.Q_tab_shows::before,
#dashboard .Q_tabs_tab.Q_tab_links::before {
	font-family: 'icomoon';
}

#dashboard .Q_tab_watch::before,
.Q_listing_wrapper .Communities_aspect_watch::before {
	content: "\e907";
}

#dashboard .Q_tab_shows::before,
.Q_listing_wrapper .Q_tab_shows::before {
	content: "\e99d";
}

#dashboard .Q_tab_links::before,
.Q_listing_wrapper .Q_tab_links::before {
	content: "\e9a0";
}

#dashboard .Q_tab_sponsor::before,
.Q_listing_wrapper .Q_tab_sponsor::before {
	content: "\e906";
}
#dashboard .Q_tab_community::before,
.Q_listing_wrapper .Q_tab_community::before {
	content: "\e94d";
	font-family: "icomoon";
}

#dashboard .Q_tab_shows.Q_current::before,
.Q_listing_wrapper .Q_tab_shows.Q_current::before {
	content: "\e908";
	font-family: "icomoon";
}

#dashboard .Q_tab_links.Q_current::before,
.Q_listing_wrapper .Q_tab_links.Q_current::before {
	content: "\e9a1";
	font-family: "icomoon";
}
.Q_layout_widebar #dashboard[data-style=icons] .Q_tabs_tab.Q_current::before {
	font-weight: normal;
}
.FTL_welcome #content_slot {
	overflow: auto !important;
}

.FTL_welcome #content {
	height: auto !important;
}

.Streams_chat_from_me .Streams_chat_message *,
.Streams_chat_from_me .Streams_chat_message a,
.Streams_chat_from_me .Streams_chat_message a:visited {
	color: #fff;
}
.Q_inplace_tool .Q_editing .Q_inplace_tool_form input[type=text] {
	color: #000;
}
.Q_notMobile #dashboard #dashboard_user {
	float: right;
}
.Q_notMobile.Users_loggedOut #dashboard #dashboard_user {
	margin: 5px 0 0 0;
}

.Q_mobile #dashboard_slot #dashboard .Users_avatar_tool, #dashboard_slot #dashboard .Users_avatar_tool img {
    width: var(--dashboard-icon-size);
    height: var(--dashboard-icon-size);
	transform: scale(1.1);
}

.Q_mobile #dashboard[data-style=icons] .Users_avatar_tool {
	margin: 0 0 0 5px;
}
.Q_layout_widebar #dashboard[data-style=icons] .Q_tabs_tab {
	/* opacity: 0.7; */
}

.Q_tabs_tabs {

}

.Q_notMobile #dashboard * {
	font-size: 24px;
}

.Q_notMobile:not(.Communities_welcome) .Q_columns_stretchFirstColumn[data-column-count='2'] .Q_column_0 {
    min-width: var(--column-width);
    width: var(--column-width);
}

.Q_notMobile:not(.Communities_welcome) .Q_columns_stretchFirstColumn[data-column-count='2'] .Q_column_1 {
	width: calc(100% - var(--column-width) - var(--column-margin));
}

.Q_notMobile .Q_columns_stretchFirstColumn[data-column-count='3'] .Q_column_0,
.Q_notMobile .Q_columns_stretchFirstColumn[data-column-count='3'] .Q_column_2,
.Q_notMobile .Q_columns_stretchFirstColumn[data-column-count='3'] .Q_column_3,
.Q_notMobile .Q_columns_stretchFirstColumn[data-column-count='3'] .Q_column_4 {
    min-width: var(--column-width);
    width: var(--column-width);
}

.Q_notMobile .Q_columns_stretchFirstColumn[data-column-count='3'] .Q_column_1 {
	width: calc(100% - var(--column-width)*2 - var(--column-margin)*2);
}

.FTL_hero {
	margin: auto;
	display: block;
	min-width: 300px;
	width: 50%;
}

.Q_mobile .FTL_hero {
	width: 100%;
}

.FTL_filter_byTime .Q_dialog_slot,
.FTL_filter_interest .Q_dialog_slot {
	padding: 20px;
}

.Q_column_feed .Q_columns_title {
	display: none;
}

.Q_expandable_tool h2.Q_expanded,
.Q_expandable_tool h2.Q_pressed {
	color: var(--dashboard-main-color);
	font-weight: bold;
}
#page .Q_expandable_tool h2 {
	padding: 0 5px;
	border-radius: 2px;
}
.FTL_links .Q_expandable_tool span {
	display: block;
}
.Q_column_links .Q_expandable_content span {
	display: block;
}

.Q_video_tool {
	max-width: 500px;
	max-height: 280px;
	margin: auto;
	box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.5);
}
.Q_video_tool.Q_floating_tool, .Q_audio_tool.Q_floating_tool {
	width: 300px;
	height: 200px;
	z-index: 100;
	left: 50%;
	transform: translateX(-50%);
	bottom: 20px
}
.Q_audio_tool.Q_floating_tool.Q_audio_native {
	height: 105px;
}
.Communities_me_column_tabContent .Q_expandable_tool h2 {
	font-weight: bold;
}
.Communities_me_column_tabContent .Communities_profile_explanation {
	color: var(--main-text-color);
}
.Q_buttons {
	white-space: nowrap;
}

.Media_dialog_newEpisode {
	min-width: 300px;
}
.Media_dialog_newEpisode .Q_dialog_content input,
.Media_dialog_newEpisode .Q_dialog_content button[name=add] {
	display: block;
	width: 90%;
	margin: 10px auto;
}
.FTL_clips_header {
	padding: 10px;
}
.Streams_related_tool.Media_episodes {
	width: 100%;
	margin: 0 auto;
}
.Streams_related_tool.Media_episodes .Streams_preview_tool .Streams_preview_tool {
	background-color: transparent;
	border: none;
	border-radius: unset;
	margin-bottom: unset;
}
.Communities_schedule_column .Communities_tab {
	color: var(--main-text-color);
	font-size: 16px;
}
.Communities_me_column_tabContent,
.Communities_me_column_tabContent[data-val="interests"] .Q_expandable_tool h2 {
	color: var(--main-text-color);
}
.Communities_me_column_tabContent[data-val="interests"] .Q_expandable_tool h2.Q_expanded {
	color: #fff;
}
body .Streams_chat_tool .Streams_chat_addons {
	width: 40px;
	height: 40px;
	line-height: 40px;
}
.Streams_chat_item .Streams_chat_message_content .Streams_preview_tool .Streams_preview_icon,
.Streams_chat_item .Streams_chat_message_content .Streams_preview_tool .Streams_video_preview_icon {
	width: 40px;
	height: 40px;
}
button[name=addClip] img,
button.Media_newEpisode img {
	display: none;
}
button.Media_newEpisode .Streams_preview_container {
	width: 100%;
}

.Q_mobile #dashboard_slot .Users_status_tool .Q_badge_tool .Q_badge {
	font-size: 12px;
}
#dashboard_slot .Users_status_tool .Q_badge_tool .Q_badge {
	border-radius: 50%;
	background-color: #ffdc03;;
	color: #000;
	font-weight: bold;
	font-size: 16px;
    transform: rotate3d(0.01, 0.1, 0.01, 20deg);
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.5);
    border: 2px dotted #9a83068a;
    color: rgba(0, 0, 200, 0.7);
    left: -20px;
}
#dashboard #dashboard_user,
#dashboard #dashboard_user .Users_avatar_tool {
	overflow: unset;
}
.Communities_tab,
.Communities_tab i {
	color: #fff;
}
.Communities_me_credits .Communities_tab,
.Communities_me_credits .Communities_tab i {
	color: var(--main-text-color);
}
.Communities_tab.Streams_aspect_interests.Q_current,
.Communities_tab.Streams_aspect_interests.Q_current .qp-communities-interests {
	color: var(--Q-aspect-interests-text-color);
}
.Communities_tab.Streams_aspect_about.Q_current,
.Communities_tab.Streams_aspect_about.Q_current .qp-communities-about,
.Communities_tab.Users_aspect_info.Q_current,
.Communities_tab.Users_aspect_info.Q_current .qp-communities-info {
	color: var(--Q-aspect-info-text-color);
}
.Communities_tab.Streams_aspect_chat.Q_current,
.Communities_tab.Streams_aspect_chat.Q_current .qp-communities-chat {
	color: var(--Q-aspect-chats-text-color);
}
.Communities .Q_column_conversation .Q_columns_title,
.Q_column_conversation .Q_columns_title_container,
.Q_column_conversation .Q_columns_title_container .Streams_preview_tool,
.Q_column_conversation .Q_columns_title_container .Streams_preview_tool .Streams_preview_title,
.Q_column_conversation .Q_columns_title_container .Streams_preview_tool .Streams_aspect_description,
.Q_column_conversation .Q_columns_title_container .Streams_preview_tool .Streams_aspect_interests {
	background: #000;
}

.Q_column_conversations .Streams_preview:hover {
	color: var(--dashboard-main-color);
}

.Q_tool.Streams_preview_tool.Communities_stream_visited {
	outline: unset;
	background: rgba(100, 100, 100, 0.5);
}

.Streams_question_preview_tool .Streams_preview_icon {
	background-color: #fff;
	border-radius: 50%;
}

.Communities_conversations_column .Streams_preview_tool,
.Communities_inbox_column .Streams_preview_tool {
	background-color: rgba(100, 100, 100, 0.5);
	margin-bottom: 10px;
	padding: 5px;
}
.Community_FTL .Websites_webpage_preview_tool .Streams_aspect_interests a:link,
.Community_FTL .Websites_webpage_preview_tool .Streams_aspect_interests a:visited {
	color: #0055ff;
}
.Streams_chat_item .Websites_webpage_preview_tool .Streams_aspect_description {
	color: #0055ff;
}
.Users_labels_label[data-label="Streams/invited"], .Users_labels_label[data-label="Users/family"],
.Users_labels_label[data-label="Streams/invitedMe"] {
	display: none;
}
.Streams_calls_settings .Streams_calls_related .Streams_webrtc_preview_tool {
	background-color: rgba(255, 255, 255, .2);
}
.User_avatar_credits:empty {
	display: none;
}
input[name=query].Streams_userChooser_input,
input[name=query].Communities_conversationChooser_input,
input[name=query].Communities_eventChooser_input,
input[name=query].Communities_eventChooser_input:focus,
html .Q_column_people input, html .Q_column_people input:focus {
	background: black;
	color: yellow;
}
.Q_mobile .Q_column_people .Q_column_slot,
.Q_mobile .Q_column_websites_webpage .Q_column_slot {
	padding: 0;
}
.Streams_webrtc_desktop-screen .Streams_webrtc_chat-participant .Streams_webrtc_chat-participant-name {
	color: #fff !important;
}
.Media_episode_preview_tool .Media_episode_publishTime {
	color: var(--dashboard-main-color);
}
html.Media_clip #content .Q_button,
html.Media_clip #content .Q_button:hover {
	background: var(--dashboard-main-color);
	color: #000;
	padding: 0 !important;
}
html.Media_clip #content .Q_button .Streams_preview_title {
	color: #000;
}

.Q_mobile.Communities_dashboard_withTitles #dashboard[data-style=icons] .Q_tabs_title,
.Q_mobile.Communities_dashboard_withTitles #dashboard[data-style=icons] .Q_tabs_title *,
.Q_mobile.Communities_dashboard_withTitles #dashboard[data-style=icons] .Users_status_login_title {
	font-size: 10px;
}

.Q_mobile .Q_columns_column.Q_column_community .Q_column_slot,
.Q_mobile .Q_columns_column.Q_column_me .Q_column_slot,
.Q_mobile .Q_columns_column.Q_column_conversations .Q_column_slot,
.Q_mobile .Q_columns_column.Communities_column_profile .Q_column_slot {
	padding: 0;
}

#dashboard .Q_tab_contributions::before, .Q_listing_wrapper .Q_tab_contributions::before {
	content: "\e947";
}

.FTL_page_survey {
	position: absolute;
	right: 2%;
	bottom: 10px;
	width: 40px;
	height: 40px;
	background: #fff;
	border-radius: 50%;
	cursor: pointer;
	z-index: 10;
	box-shadow: #aaa 0 0 7px 5px;
	border: 1px solid #aaa;
}
.Media_clip .FTL_page_survey {
	bottom: 70px;
}
.FTL_page_survey:before {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	width: 100%;
	content: "?";
	font-size: 30px;
	font-weight: bold;
	color: red;
}
.FTL_survey_dialog .Q_dialog_content {
	min-height: 200px;
	overflow-x: hidden;
	padding: 10px;
}
.Q_notMobile .FTL_survey_dialog .Q_dialog_content {
	width: 400px;
}
.FTL_survey_dialog.FTL_survey_dialog_tester .Streams_related_composer {
	display: none;
}
.Communities_profile_section .Communities_manage_contacts {
	margin: 0;
}
.Communities_me_column {
	padding: 0 10px;
}
.Communities_conversations_column {
	padding: 5px 10px;
}
#page .Communities_top_controls {
	margin: 0;
}
#page .Communities_profile_sections {
	padding: 0 5px;
}

.Streams_userChooser_results {
	background: black !important;
}

.Streams_userChooser_results .Q_selected {
	color: black;
}

.Streams_userChooser_results a img:first-child {
	margin-right: 5px;
}
.Q_column_community .Users_list_tool .Users_avatar_tool.Q_badge_tool,
.Q_column_people .Users_list_tool .Users_avatar_tool.Q_badge_tool {
	overflow: unset;
}
.Users_avatar_tool .Media_badge_host {
	background-color: #fff;
}
.Communities_column_profile_main_avatar img.Users_avatar_icon {
	border-radius: 15px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
}

.Communities_me.Q_layout_widebar[data-dashboard-position=top] #dashboard #dashboard_user {
	border-bottom: solid 2px var(--dashboard-current-color);
}

.Communities_me.Q_layout_widebar[data-dashboard-position=top] #dashboard #dashboard_user img {
	border: solid 2px white;
}
body .Media_episode_preview_tool.Media_episode_preview_template_square .Streams_preview_episode_card_fg,
body .Media_episode_preview_tool.Media_episode_preview_template_tall .Streams_preview_episode_card_fg {
	background-color: #ffdc03;
	color: black;
}
body .Media_episode_preview_tool.Media_episode_preview_template_square .Streams_preview_episode_card_info,
body .Media_episode_preview_tool.Media_episode_preview_template_tall .Streams_preview_episode_card_info {
	color: #000;
}
.Communities_manage_contacts.Communities_has_labels {
	color: #000;
}
.Q_column_people .Q_column_slot {
	padding: 0;
	overflow: hidden;
}
.Q_column_people .Users_list_tool {
	height: 100%;
}
/* Welcome page */
.Users_loggedOut.Communities_welcome .Q_button.getStarted:active,
.Users_loggedOut.Communities_welcome .Q_button.getStarted {
	width: 320px;
}

body .Users_connect_wallets ul li a {
	color: #fff;
}

.Streams_dialog_video .Streams_video_composer .Q_tabbing_tabs > .Q_tabbing_tab:not(.Q_current) {
	filter: invert(1);
	color: #000;
}

.Media_clip_player {
	min-height: 300px;
}

/* =============================================================
   Mark Edge Show — Qbix theme override  (v4 — 2026-04-14)
   -------------------------------------------------------------
   Load this AFTER Qbix's default stylesheets on markedge.org.
   Greg: drop it as the last <link rel="stylesheet">, or wrap in
   @layer — either works.

   Design goals
   ------------
   1. Silver / black / Prompt, retaining Qbix's layout. Accent
      color is a warm frosty silver (var(--me-accent-400)).
   2. Never clobber `background-image` on elements that Qbix uses
      to render thumbnails — always use `background-color` where a
      color fill is intended.
   3. Prefer low specificity + targeted overrides. `!important` is
      used where Qbix plugin CSS wins on specificity; it is NOT a
      blanket weapon.
   4. Respect Qbix's responsive behavior. Only nudge it where the
      layout needs help (e.g. mobile sidebar hidden behind nav).

   Versions
   --------
   v1 (2026-04-13) — initial palette + buttons + tabs
   v2 (2026-04-14) — plugin cleanup (Streams, Users) + layout polish
   v3 (2026-04-14) — BUG FIX: stopped clobbering card thumbnails;
                     silvered the img-based invite/share icons;
                     active card gets a thin accent stripe; mobile
                     sidebar collapses; Menu hamburger silvered.
   v4 (2026-04-14) — Nuclear icon filter (silver regardless of src
                     color); dark-themed popups/dropdowns; hide
                     blue caret; mobile invite overlap fix;
                     earlier-comments bar restyled; focus-visible
                     rings; WCAG AA contrast verified.
   v4.1 (2026-04-14) — Cross-page sweep. Nav links were rendering
                     yellow because `.Q_tabs_title` (nested inside
                     each tab's <a>) carries the FTL color. Added
                     explicit rules for:
                       - .Q_tabs_title + nested variants
                       - .Users_status_login_title (log-in label)
                       - .Q_expandable_title (section collapsibles)
                       - table / th / td (data tables)
                     Verified on /clip, /links, /conversations,
                     /contributions.
============================================================= */

:root {
  --me-bg:              #0d0d0d;
  --me-bg-elev-1:       #333333;
  --me-bg-elev-2:       #252525;
  --me-border:          rgba(212, 212, 216, 0.08);
  --me-border-strong:   rgba(212, 212, 216, 0.20);

  --me-silver-100:      #f4f4f5;
  --me-silver-200:      #e4e4e7;
  --me-silver-300:      #d4d4d8;
  --me-silver-400:      #a1a1aa;
  --me-silver-500:      #71717a;

  --me-accent-300:      #ddd8be;
  --me-accent-400:      #d0c9a8;  /* default accent */
  --me-accent-500:      #c2b890;  /* CTA */
  --me-accent-600:      #a8a07a;

  --me-font-body:       'Prompt', 'Inter', ui-sans-serif, system-ui, sans-serif;
  
  --dashboard-contextual-color: white;
  --dashboard-contextual-current-bg: transparent;
}

/* -------------------------------------------------------------
   1. Global body + typography
------------------------------------------------------------- */
html, body {
  background-color: var(--me-bg) !important;
  color: var(--me-silver-200) !important;
  font-family: var(--me-font-body) !important;
}

a {
  color: var(--me-silver-300) !important;
  text-decoration: none;
}
a:hover, a:focus-visible {
  color: var(--me-accent-400) !important;
}

::-webkit-scrollbar         { width: 8px; height: 8px; }
::-webkit-scrollbar-track   { background: var(--me-bg-elev-1); }
::-webkit-scrollbar-thumb   { background: #454545; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #5d5d5d; }

/* -------------------------------------------------------------
   2. Top dashboard bar (#dashboard_slot.Q_fixed_top > #dashboard)
------------------------------------------------------------- */
#dashboard_slot,
#dashboard_slot #dashboard {
  background-color: rgba(13, 13, 13, 0.95) !important;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  color: var(--me-silver-200) !important;
  border-bottom: 1px solid var(--me-border) !important;
  box-shadow: 0 1px 0 0 rgba(0,0,0,0.4) !important;
}

/* Logo image in dashboard */
#dashboard_slot .FTL_logo,
#dashboard_slot .MES_logo,
#dashboard_slot .ME_logo {
  filter: brightness(1.05) contrast(1.1);
  max-height: 40px;
  width: auto;
}

/* -------------------------------------------------------------
   3. Tabs everywhere  (.Q_tabs_tool / .Q_tabs_tab)
------------------------------------------------------------- */
.Q_tabs_tool,
.Q_tabs_tabs {
  color: var(--me-silver-200) !important;
}
.Q_tabs_tool .Q_tabs_tab {
  color: var(--me-silver-300) !important;
  background-color: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  position: relative;
  transition: color 0.2s ease;
}
.Q_tabs_tool .Q_tabs_tab a,
.Q_tabs_tool .Q_tabs_tab > a {
  color: inherit !important;
}
.Q_tabs_tool .Q_tabs_tab:hover {
  color: var(--me-silver-100) !important;
}

/* Active tab — accent underline instead of yellow fill */
.Q_tabs_tool .Q_tabs_tab.Q_current,
.Q_tabs_tool .Q_tabs_tab[data-current="true"] {
  color: var(--me-silver-100) !important;
  background-color: transparent !important;
}
.Q_tabs_tool .Q_tabs_tab.Q_current::after,
.Q_tabs_tool .Q_tabs_tab[data-current="true"]::after {
  content: '';
  position: absolute;
  left: 10%; right: 10%; bottom: -2px;
  height: 2px;
  background: var(--me-accent-400);
  border-radius: 2px;
}

/* Mobile: overflow tab shows the "Menu" label + hamburger SVG */
.Q_tabs_tab.Q_tabs_overflow {
  color: var(--me-silver-100) !important;
}
.Q_tabs_copiedTitle {
  color: var(--me-silver-100) !important;
}
.Q_tabs_overflowGlyph svg,
.Q_tabs_overflowGlyph svg * {
  fill: var(--me-silver-100) !important;
  stroke: var(--me-silver-100) !important;
}

/* v4.1 FIX: nav link text actually lives in `.Q_tabs_title` nested
   inside each tab's <a>. Must be targeted directly. */
.Q_tabs_tool .Q_tabs_tab a,
.Q_tabs_tool .Q_tabs_tab > a,
#dashboard .Q_tabs_tool a {
  color: var(--me-silver-300) !important;
}
.Q_tabs_title,
.Q_tabs_tab .Q_tabs_title,
#dashboard .Q_tabs_title {
  color: var(--me-silver-300) !important;
}
.Q_tabs_tool .Q_tabs_tab:hover .Q_tabs_title {
  color: var(--me-silver-100) !important;
}
.Q_tabs_tool .Q_tabs_tab.Q_current .Q_tabs_title {
  color: var(--me-silver-100) !important;
}

/* Log-in label (lives inside .Q_tabs_title > .Users_status_tool) */
.Users_status_tool,
.Users_status_login,
.Users_status_login_title,
div.Users_status_login_title,
.Q_tabs_title .Users_status_tool,
.Q_tabs_title .Users_status_login,
.Q_tabs_title .Users_status_login_title {
  color: var(--me-silver-300) !important;
}
.Users_status_tool:hover,
.Users_status_login:hover,
.Users_status_login_title:hover {
  color: var(--me-silver-100) !important;
}

/* -------------------------------------------------------------
   4. Page title (h2#title_slot / h2.Q_title_slot)
------------------------------------------------------------- */
#title_slot,
h2.Q_title_slot,
.Q_title_slot {
  color: var(--me-silver-100) !important;
  font-family: var(--me-font-body) !important;
  margin: 0 !important;
  padding: 10px !important;
  font-size: clamp(1.5rem, 3.5vw, 4rem) !important;
  font-weight: 600 !important;
  letter-spacing: -0.015em;
  border-bottom: 1px solid var(--me-border) !important;
  max-width: 900px;
}

/* Close X on title */
.Q_title_slot_close,
.Q_close,
.Q_overlay_close {
  color: var(--me-silver-400) !important;
  opacity: 0.7;
  transition: opacity 0.15s ease, color 0.15s ease;
}
.Q_title_slot_close:hover,
.Q_close:hover {
  color: var(--me-silver-100) !important;
  opacity: 1;
}

/* All headings on the theme palette */
h1, h2, h3, h4, h5, h6 {
  color: var(--me-silver-100) !important;
  font-family: var(--me-font-body) !important;
}

/* -------------------------------------------------------------
   5. Buttons  (.Q_button and common plugin buttons)
------------------------------------------------------------- */
.Q_button,
button.Q_button,
a.Q_button,
input[type="submit"].Q_button,
.Streams_participants_invite_button {
  background-image: linear-gradient(180deg, var(--me-silver-200) 0%, var(--me-silver-400) 100%) !important;
  background-color: var(--me-silver-300) !important;
  color: #0b0b0b !important;
  border: 1px solid var(--me-border-strong) !important;
  border-radius: 8px !important;
  padding: 0 !important;
  font-family: var(--me-font-body) !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em;
  box-shadow: 0 1px 0 rgba(255,255,255,0.15) inset, 0 1px 2px rgba(0,0,0,0.4) !important;
  transition: transform 0.12s ease, filter 0.12s ease;
}
.Q_button:hover,
button.Q_button:hover,
a.Q_button:hover,
.Streams_participants_invite_button:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
}
.Q_button:active { transform: translateY(0); filter: brightness(0.95); }

.Q_button.Q_button_secondary,
.Q_button_ghost {
  background-image: none !important;
  background-color: transparent !important;
  color: var(--me-silver-200) !important;
}

/* -------------------------------------------------------------
   6. Streams "Invite" widget (Share + Invite People buttons)
      Both use `.Streams_invite_icon` as an <img>. We don't touch
      the trigger container's layout; we just desaturate the img
      so the yellow + / green person become silver.
------------------------------------------------------------- */
.Streams_invite_icon {
  /* Nuclear: zero out the source color, then invert to a near-silver.
     Works regardless of the source PNG being yellow, green, or any hue. */
  filter: brightness(0) saturate(0) invert(0.82);
  transition: filter 0.15s ease;
}
.Streams_participants_invite:hover .Streams_invite_icon,
.Streams_participants_invite_button:hover .Streams_invite_icon {
  filter: brightness(0) saturate(0) invert(0.95);
}

.Streams_invite_label {
  color: var(--me-silver-200) !important;
  background-color: transparent !important;
}

/* -------------------------------------------------------------
   7. Streams plugin — episode cards (sidebar list)
      CRITICAL: never set `background:` shorthand on `_bg` — that
      element carries the thumbnail as `background-image`.
------------------------------------------------------------- */
.Streams_preview_episode_card_fg {
  background-color: var(--me-bg-elev-1) !important;
  color: var(--me-silver-200) !important;
  border: 1px solid var(--me-border) !important;
  border-left: none !important;
  border-radius: 0 10px 10px 0 !important;
}

.Streams_preview_episode_card_bg {
  /* KEEP background-image untouched. Only set a color fallback
     for the rare case a card has no thumbnail. */
  background-color: var(--me-bg-elev-1) !important;
  background-size: cover !important;
  background-position: center !important;
  border: 1px solid var(--me-border) !important;
  border-right: none !important;
  border-radius: 10px 0 0 10px !important;
}

/* Card title + date/subtitle */
.Streams_preview_episode_card_title,
.Streams_preview_episode_card_title_text {
  color: var(--me-silver-100) !important;
  background-color: transparent !important;
}
.Streams_preview_episode_card_date,
.Streams_preview_episode_card_subtitle {
  color: var(--me-silver-400) !important;
}

/* Hover on the whole card */
.Streams_preview_episode_card_con:hover .Streams_preview_episode_card_fg,
.Streams_preview_episode_card_con:hover .Streams_preview_episode_card_bg {
  border-color: var(--me-border-strong) !important;
}
.Streams_preview_episode_card_con:hover .Streams_preview_episode_card_fg {
  background-color: var(--me-bg-elev-2) !important;
}

/* Active / currently-playing card — thin left accent stripe.
   Qbix marks the active preview with `.Q_selected` (confirmed on
   list + cards layouts). `.Q_current` also used in some places. */
.Q_selected.Streams_preview_tool,
.Streams_preview_tool.Q_selected,
.Streams_preview_tool.Q_current,
.Streams_preview_episode_card_con.Q_current {
  outline: 1px solid var(--me-accent-400) !important;
  box-shadow: inset 3px 0 0 0 var(--me-accent-400) !important;
  border-radius: 10px;
}
.Q_selected .Streams_preview_episode_card_fg,
.Q_current .Streams_preview_episode_card_fg {
  background-color: var(--me-bg-elev-2) !important;
  border-color: var(--me-border-strong) !important;
}

/* Clip/segment preview titles in list layouts (h3.Streams_preview_title).
   Qbix renders clickable segments as h3s; Prompt font + silver, add
   padding + hover bg for clickable affordance. */
h3.Streams_preview_title,
.Streams_preview_title {
  color: var(--me-silver-200) !important;
  padding: 0.35rem 0.6rem !important;
  border-radius: 4px !important;
  font-size: 1rem !important;
  font-weight: 500 !important;
  margin: 0 !important;
  transition: background-color 0.15s ease, color 0.15s ease;
}
.Streams_preview_tool:hover h3.Streams_preview_title,
.Media_clip_preview_tool:hover h3.Streams_preview_title {
  background-color: var(--me-bg-elev-2) !important;
  color: var(--me-silver-100) !important;
}
.Streams_preview_tool.Q_selected h3.Streams_preview_title,
.Q_selected h3.Streams_preview_title {
  color: var(--me-accent-400) !important;
  background-color: var(--me-bg-elev-2) !important;
}

/* Vertical rhythm in the list */
.Streams_preview_episode_card_con {
  margin-bottom: 0.6rem !important;
}

/* -------------------------------------------------------------
   8. Streams participants summary pill ("1", "0")
------------------------------------------------------------- */
.Streams_participants_summary {
  background-color: var(--me-bg-elev-2) !important;
  color: var(--me-silver-100) !important;
  border: 1px solid var(--me-border-strong) !important;
  border-radius: 999px !important;
  padding: 2px 10px !important;
}

/* -------------------------------------------------------------
   9. Users plugin — status widget (Log In link etc.)
------------------------------------------------------------- */
.Users_status_tool,
.Users_status_login,
.Users_status_login_title {
  color: var(--me-silver-200) !important;
  background-color: transparent !important;
  border-color: transparent !important;
}
.Users_status_login:hover,
.Users_status_login_title:hover {
  color: var(--me-silver-100) !important;
}

/* Tabs title strip (sidebar header "NEW Everyday…") */
.Q_tabs_title {
  color: var(--me-silver-200) !important;
  background-color: transparent !important;
  border-color: var(--me-border) !important;
}

/* -------------------------------------------------------------
   10. Video player wrapper + poster
------------------------------------------------------------- */
.Q_video_tool,
.Media_video,
.Media_player {
  margin: 0 auto 1.25rem !important;
  display: block;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0,0,0,0.5);
}
.video-js .vjs-big-play-button {
  background-color: rgba(13, 13, 13, 0.8) !important;
  border: 2px solid var(--me-silver-200) !important;
  color: var(--me-silver-100) !important;
  border-radius: 50% !important;
}
.video-js .vjs-progress-holder .vjs-play-progress {
  background-color: var(--me-accent-400) !important;
}

/* -------------------------------------------------------------
   11. Notices, dialogs, inputs
------------------------------------------------------------- */
#notices_slot {
  background-color: rgba(13, 13, 13, 0.95) !important;
  color: var(--me-silver-200) !important;
  border-bottom: 1px solid var(--me-border) !important;
  padding: 0.3rem 0.75rem !important;
}
#notices_slot .Q_notice {
  background-color: var(--me-bg-elev-1) !important;
  color: var(--me-silver-200) !important;
  border: 1px solid var(--me-border-strong) !important;
  border-radius: 8px !important;
}

.Q_contextual,
.Q_dialog,
.Q_dialog_content,
.Q_overlay_content {
  background-color: var(--me-bg-elev-1) !important;
  color: var(--me-silver-200) !important;
  border: 1px solid var(--me-border-strong) !important;
  border-radius: 12px !important;
}

input[type="text"],
input[type="search"],
input[type="email"],
input[type="password"],
textarea,
select {
  background-color: var(--me-bg-elev-1) !important;
  color: var(--me-silver-100) !important;
  border: 1px solid var(--me-border-strong) !important;
  border-radius: 8px !important;
  font-family: var(--me-font-body) !important;
}
input:focus, textarea:focus, select:focus {
  outline: none;
  border-color: var(--me-accent-400) !important;
  box-shadow: 0 0 0 2px rgba(208, 201, 168, 0.25) !important;
}

/* -------------------------------------------------------------
   12. Mobile — collapse the sidebar column behind the nav
       Qbix uses `.Q_columns_column.Q_column_0` for the first
       (sidebar) column and `.Q_column_1` for the main content.
       At mobile widths they overlap; we hide the first column
       entirely so the main content uses the full viewport. Users
       reach the sidebar content via the nav's "Shows" tab.
------------------------------------------------------------- */
@media (max-width: 768px) {
  .Q_columns_column.Q_column_0 {

  }
  .Q_columns_column.Q_column_1 {
    width: 100% !important;
    left: 0 !important;
  }
  /* Title on mobile — tighter */
  #title_slot,
  h2.Q_title_slot {
    font-size: 1.5rem !important;
    padding-top: 0.5rem !important;
  }
}

.Media_episode_preview_tool.Media_episode_preview_template_tall .Streams_preview_episode_card_bg {
	height: 100%;
}

/* -------------------------------------------------------------
   12b. Mobile — kill the Invite People overlap with the tabs
   Qbix positions the participants invite button absolutely in the
   widget. On narrow screens it lands on top of the Video/Clips
   tab group. Force static flow.
------------------------------------------------------------- */
@media (max-width: 768px) {
  .Streams_participants_invite_button,
  .Streams_participants .Streams_participants_invite_button {
    position: static !important;
    margin: 0.75rem auto !important;
    transform: none !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 0.5em;
  }
  /* Whole participants widget — don't fix it mid-viewport */
  .Streams_participants_tool,
  .Streams_preview_episode_users_inner {
    position: static !important;
  }
}

/* -------------------------------------------------------------
   12c. Popups, bubbles, tooltips, overflow dropdowns
   Qbix uses several container classes for floating UI. Catch them
   all and theme them dark. Also hide/re-tint the blue caret/arrow
   that points at the trigger.
------------------------------------------------------------- */
.Q_overlay_content,
.Q_dialog,
.Q_dialog_content,
.Q_contextual,
.Q_contextual_inner,
.Q_popup,
.Q_bubble,
.Q_tabs_overflow_popup,
.Q_columns_dialog {
  background-color: var(--me-bg-elev-1) !important;
  color: var(--me-silver-200) !important;
  border: 1px solid var(--me-border-strong) !important;
  border-radius: 0px !important;
  border-bottom-left-radius: 12px !important;
  border-bottom-right-radius: 12px !important;
  box-shadow: 0 10px 40px rgba(0,0,0,0.6) !important;
}
/*.Q_overlay_content a,
.Q_dialog a,
.Q_contextual a,
.Q_popup a,
.Q_bubble a {
  color: black !important;
}*/
.Q_overlay_content a:hover,
.Q_dialog a:hover,
.Q_contextual a:hover,
.Q_popup a:hover,
.Q_bubble a:hover {
  color: var(--me-accent-400) !important;
  background-color: var(--me-bg-elev-2) !important;
}

/* Items inside a tabs overflow popup (Contributions / Log In etc.) */
.Q_tabs_overflow_popup li,
.Q_tabs_overflow_popup .Q_tabs_tab,
.Q_contextual li {
  color: var(--me-silver-200) !important;
  background-color: transparent !important;
  border-color: var(--me-border) !important;
}
.Q_tabs_overflow_popup li:hover,
.Q_contextual li:hover {
  background-color: var(--me-bg-elev-2) !important;
}

/* Kill / re-tint the blue caret pointing at the trigger */
.Q_bubble_tail,
.Q_popup_arrow,
.Q_contextual_arrow,
.Q_tabs_overflow_popup_arrow,
.Q_overlay_arrow {
  border-color: var(--me-border-strong) !important;
  background-color: var(--me-bg-elev-1) !important;
  /* common caret implementation uses border-bottom-color / border-top-color
     to point the triangle — overwrite those too */
  border-bottom-color: var(--me-bg-elev-1) !important;
  border-top-color: var(--me-bg-elev-1) !important;
  filter: none !important;
}
/* Blanket: any inline SVG arrow/caret inside a popup */
.Q_popup svg[class*="arrow"],
.Q_bubble svg[class*="arrow"] {
  fill: var(--me-bg-elev-1) !important;
  stroke: var(--me-border-strong) !important;
}

.Q_contextual .Q_listing li {
	display: flex;
	gap: 10px;
}

/* Specifically: the Qbix contextual top/bottom arrow uses a
   CSS triangle (borders on an empty div). Retint to match. */
.Q_contextual_top_arrow {
  border-bottom-color: var(--me-bg-elev-1) !important;
}
.Q_contextual_bottom_arrow {
  border-top-color: var(--me-bg-elev-1) !important;
}

/* Q_listing (used inside Q_contextual for nav overflow popup) */
.Q_listing,
.Q_listing_wrapper {
  background-color: var(--me-bg-elev-1) !important;
  color: var(--me-silver-200) !important;
  border: none !important;
}
.Q_listing li,
.Q_listing a {
  background-color: transparent !important;
  color: var(--me-silver-200) !important;
  border-bottom: 1px solid var(--me-border) !important;
}
.Q_listing li:hover,
.Q_listing a:hover {
  background-color: var(--me-bg-elev-2) !important;
  color: var(--me-silver-100) !important;
}
.Q_listing li:last-child,
.Q_listing a:last-child { border-bottom: none !important; }

/* Invite icon — higher specificity to beat .Q_pulsateShadow */
img.Streams_invite_icon,
img.Streams_invite_icon.Q_pulsateShadow,
.Q_pulsateShadow.Streams_invite_icon {
  filter: brightness(0.5) saturate(0) !important;
}
.Streams_participants_invite:hover img.Streams_invite_icon,
.Streams_participants_invite_button:hover img.Streams_invite_icon {
  filter: brightness(0) saturate(0) invert(0.95) !important;
}

/* -------------------------------------------------------------
   12d. "Earlier comments" load-more bar
------------------------------------------------------------- */
.Streams_chat_moreButton,
.Streams_chat_more,
.Streams_chat_presenter_earlier,
.Q_comments_load_more,
.Streams_chat_scrollUp {
  background-color: var(--me-bg-elev-1) !important;
  color: var(--me-silver-300) !important;
  border: 1px solid var(--me-border) !important;
  border-radius: 8px !important;
}
.Streams_chat_moreButton:hover,
.Streams_chat_more:hover {
  background-color: var(--me-bg-elev-2) !important;
  color: var(--me-silver-100) !important;
}
/* Fallback: any element whose text is exactly "earlier comments" */
[class*="chat"] [class*="earlier" i],
[class*="comments"] [class*="earlier" i] {
  background-color: var(--me-bg-elev-1) !important;
  color: var(--me-silver-300) !important;
}

/* -------------------------------------------------------------
   12e. Focus-visible ring — WCAG keyboard accessibility
------------------------------------------------------------- */
a:focus-visible,
button:focus-visible,
.Q_button:focus-visible,
.Q_tabs_tab:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[role="button"]:focus-visible {
  outline: 2px solid var(--me-accent-400) !important;
  outline-offset: 2px !important;
  border-radius: 4px;
}

/* -------------------------------------------------------------
   12f. Segment list — add clickable affordance
------------------------------------------------------------- */
.Media_episode_segments li,
.Streams_episode_segments li,
.Media_episode_segment,
[class*="episode_segment"] {
  color: var(--me-silver-200) !important;
  cursor: pointer;
  padding: 0.25rem 0.5rem;
  border-radius: 4px;
  transition: background-color 0.12s ease, color 0.12s ease;
}
.Media_episode_segments li:hover,
.Streams_episode_segments li:hover,
[class*="episode_segment"]:hover {
  background-color: var(--me-bg-elev-2) !important;
  color: var(--me-silver-100) !important;
}

/* -------------------------------------------------------------
   12g. Expandable sections (Resources page "Listening Options",
   "Network Info", "Social", "Support FTL", "Affiliates" etc.)
------------------------------------------------------------- */
h2.Q_expandable_title,
.Q_expandable_title {
  background-color: var(--me-bg-elev-1) !important;
  color: var(--me-silver-100) !important;
  border: 1px solid var(--me-border) !important;
  border-radius: 8px !important;
  padding: 0.6rem 1rem !important;
  margin: 0 0 0.4rem 0 !important;
  font-weight: 600 !important;
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}
h2.Q_expandable_title:hover,
.Q_expandable_title:hover {
  background-color: var(--me-bg-elev-2) !important;
  border-color: var(--me-border-strong) !important;
}
h2.Q_expandable_title.Q_expanded,
.Q_expandable_title.Q_expanded {
  background-color: var(--me-bg-elev-2) !important;
  border-color: var(--me-border-strong) !important;
  border-left: 3px solid var(--me-accent-400) !important;
}
.Q_expandable_container {
  padding: 0.5rem 1rem 1rem !important;
  color: var(--me-silver-200) !important;
}

/* -------------------------------------------------------------
   12h. Data tables (Resources page radio station list, etc.)
------------------------------------------------------------- */
table {
  width: 100%;
  border-collapse: collapse;
  margin: 0.75rem 0;
}
table th {
  background-color: var(--me-bg-elev-2) !important;
  color: var(--me-silver-100) !important;
  font-weight: 600;
  text-align: left;
  padding: 0.5rem 0.75rem !important;
  border-bottom: 1px solid var(--me-border-strong) !important;
}
table td {
  background-color: transparent !important;
  color: var(--me-silver-200) !important;
  padding: 0.5rem 0.75rem !important;
  border-bottom: 1px solid var(--me-border) !important;
}
table tr:hover td {
  background-color: var(--me-bg-elev-1) !important;
}
table a {
  color: var(--me-silver-100) !important;
}
table a:hover {
  color: var(--me-accent-400) !important;
}

/* -------------------------------------------------------------
   13. Legacy FTL yellow killers (catch anything inlined)
------------------------------------------------------------- */
[style*="#ffdc03" i],
[style*="rgb(255, 220, 3)"] {
  color: var(--me-accent-400) !important;
}

.Q_mobile #dashboard .Q_tabs_tab::before, .Q_mobile #dashboard .Q_tabs_tab *,
.Q_mobile #dashboard .Users_status_login::before {
  color: var(--me-silver-100) !important;
}

.Q_tabs_tab[data-name="links"],
.Q_tabs_tab[data-name="contributions"] {
	display: none !important;
}


#dashboard .Q_tab_shows::before,
.Q_listing_wrapper .Q_tab_shows::before {
	content: "\e908";
}

.Q_notMobile .Communities_aspect_me {
	display: none;
}