/**
 * Le Club reprend la palette du site : blanc, noir, bleu, rouge.
 */

body.pj-club {
	--fcom-primary-bg: var(--pj-white);
	--fcom-secondary-bg: var(--pj-paper);
	--el-color-white: var(--pj-paper);
	--fcom-secondary-content-bg: var(--pj-paper);
	--fcom-active-bg: #e8ebff;
	--fcom-light-bg: var(--pj-line);
	--fcom-deep-bg: var(--pj-ink);
	--fcom-menu-text: var(--pj-muted);
	--fcom-primary-text: var(--pj-ink);
	--el-color-primary: var(--pj-ink);
	--fcom-secondary-text: var(--pj-muted);
	--fcom-text-off: #8b919c;
	--fcom-text-link: var(--pj-blue);
	--fcom-primary-button: var(--pj-red);
	--fcom-primary-button-text: var(--pj-white);
	--fcom-primary-border: var(--pj-line);
	--fcom-secondary-border: #c5cad3;
	--fcom-highlight-bg: #eef0ff;
}

body.pj-club .fcom_top_menu {
	--fcom-primary-bg: var(--pj-white);
	--fcom-primary-border: var(--pj-line);
	--fcom-menu-text: var(--pj-muted);
	--fcom-menu-text-active: var(--pj-blue);
	--fcom-active-bg: #eef0ff;
	--fcom-menu-bg-hover: var(--pj-paper);
	--fcom-menu-text-hover: var(--pj-ink);
}

body.pj-club .spaces {
	--fcom-primary-bg: var(--pj-white);
	--fcom-primary-border: var(--pj-line);
	--fcom-menu-text: var(--pj-muted);
	--fcom-menu-text-hover: var(--pj-blue);
	--fcom-menu-bg-hover: #eef0ff;
	--fcom-menu-text-active: var(--pj-white);
	--fcom-active-bg: var(--pj-blue);
}

body.pj-club .fcom_no_avatar {
	background: var(--pj-blue);
}

html.wp-admin-bar body.pj-club :is(.spaces, .fcom_space_list) .space_contents {
	top: calc(32px + var(--fcom-header-height, 55px));
	max-height: calc(100dvh - 32px - var(--fcom-header-height, 55px) - var(--pj-nav-height) - var(--pj-safe-bottom));
}

@media screen and (max-width: 782px) and (min-width: 601px) {
	html.wp-admin-bar body.pj-club .fcom_top_menu {
		top: 46px;
	}

	html.wp-admin-bar body.pj-club :is(.spaces, .fcom_space_list) .space_contents {
		top: calc(46px + var(--fcom-header-height, 55px));
		max-height: calc(100dvh - 46px - var(--fcom-header-height, 55px) - var(--pj-nav-height) - var(--pj-safe-bottom));
	}
}

html.dark body.pj-club {
	--fcom-primary-bg: #12121a;
	--fcom-secondary-bg: var(--pj-ink);
	--el-color-white: #12121a;
	--fcom-secondary-content-bg: #1c1c26;
	--fcom-active-bg: #1a1f4a;
	--fcom-light-bg: #1c1c26;
	--fcom-deep-bg: var(--pj-white);
	--fcom-menu-text: #a8aeb8;
	--fcom-primary-text: var(--pj-white);
	--el-color-primary: var(--pj-white);
	--fcom-secondary-text: #a8aeb8;
	--fcom-text-off: #6e7580;
	--fcom-text-link: #6c84ff;
	--fcom-primary-button: var(--pj-red);
	--fcom-primary-button-text: var(--pj-white);
	--fcom-primary-border: #2a2a36;
	--fcom-secondary-border: #3a3a48;
	--fcom-highlight-bg: #1a1f4a;
}

html.dark body.pj-club .fcom_top_menu {
	--fcom-primary-bg: var(--pj-ink);
	--fcom-primary-border: #2a2a36;
	--fcom-menu-text: #a8aeb8;
	--fcom-menu-text-active: #6c84ff;
	--fcom-active-bg: #1a1f4a;
	--fcom-menu-bg-hover: #1a1f4a;
	--fcom-menu-text-hover: var(--pj-white);
}

html.dark body.pj-club .spaces {
	--fcom-primary-bg: #12121a;
	--fcom-primary-border: #2a2a36;
	--fcom-menu-text: #a8aeb8;
	--fcom-menu-text-hover: #6c84ff;
	--fcom-menu-bg-hover: #1a1f4a;
	--fcom-menu-text-active: var(--pj-white);
	--fcom-active-bg: var(--pj-blue);
}