/* NyaXのCSS変数を大体一つにまとめたもの */
:root {
	/* 共通色設定 */
	--primary-color: #1d9bf0;
	--primary-hover-color: #1a8cd8;
	--like-color: #f91880;
	--star-color: #ffad1f;
	/* ライトモード(デフォルト)色設定 */
	--l-border-color: #eff3f4;
	--l-bg-color: #f9f9f9;
	--l-main-bg-color: white;
	--l-ad-bg-color: #f7f9f9;
	--l-pg-bg-color: rgba(255, 255, 255, 0.85); /* ページヘッダーなど */
	--l-emoji-bg-color: none;
	--l-notification-bg-color: #e8f5fd;
	--l-text-color: #0f1419;
	--l-secondary-text-color: #536471;
	--l-logo-color: black; /* ロゴ表示用に使っているが背景色と真逆の色を使う時に指定されることもある */
	--l-loading-color: rgba(255, 255, 255, 0.7);
	--l-widget-bg-color: #e7e8e8; /* プロフィールカードホバー時 */
	--l-emoji-mart: 255, 255, 255;
	--l-bw: #000000;
	--l-spin: rgba(0, 0, 0, 0.1);
	--l-light-primary-color: #cce6ff;
	--l-danger-color: #fef0f4;
	/* ダークモード色設定 */
	--d-border-color: #2F363D;
	--d-bg-color: #18191D;
	--d-main-bg-color: #1C1D21;
	--d-ad-bg-color: #272929;
	--d-pg-bg-color: rgb(33 35 41 / 85%); /* ページヘッダーなど */
	--d-emoji-bg-color: #e8eaed; /* 絵文字の後ろに表示するための白背景　*/
	--d-notification-bg-color: #073450;
	--d-text-color: #ffffff;
	--d-secondary-text-color: #ffffff;
	--d-logo-color: #ffffff; /* ロゴ表示用に使っているが背景色と真逆の色を使う時に指定されることもある */
	--d-loading-color: rgba(0, 0, 0, 0.7);
	--d-widget-bg-color: #4d5156; /* プロフィールカードホバー時 */
	--d-emoji-mart: 40, 40, 40;
	--d-bw: #ffffff;
	--d-spin: rgba(255, 255, 255, 0.1);
	--d-light-primary-color: #004a8f;
	--d-danger-color: #610525;
}

/* 変数指定(クラスはJSにて付与) */
body.light {
    --border-color: var(--l-border-color);
    --bg-color: var(--l-bg-color);
    --main-bg-color: var(--l-main-bg-color);
    --ad-bg-color: var(--l-ad-bg-color);
    --pg-bg-color: var(--l-pg-bg-color);
    --emoji-bg-color: var(--l-emoji-bg-color);
    --notification-bg-color: var(--l-notification-bg-color);
    --text-color: var(--l-text-color);
    --secondary-text-color: var(--l-secondary-text-color);
    --logo-color: var(--l-logo-color);
    --loading-color: var(--l-loading-color);
    --widget-bg-color: var(--l-widget-bg-color);
    --emoji-mart: var(--l-emoji-mart);
    --bw: var(--l-bw);
    --spin: var(--l-spin);
    --light-primary-color: var(--l-light-primary-color);
    --danger-color: var(--l-danger-color);
}
body.dark {
    --border-color: var(--d-border-color);
    --bg-color: var(--d-bg-color);
    --main-bg-color: var(--d-main-bg-color);
    --ad-bg-color: var(--d-ad-bg-color);
    --pg-bg-color: var(--d-pg-bg-color);
    --emoji-bg-color: var(--d-emoji-bg-color);
    --notification-bg-color: var(--d-notification-bg-color);
    --text-color: var(--d-text-color);
    --secondary-text-color: var(--d-secondary-text-color);
    --logo-color: var(--d-logo-color);
    --loading-color: var(--d-loading-color);
    --widget-bg-color: var(--d-widget-bg-color);
    --emoji-mart: var(--d-emoji-mart);
    --bw: var(--d-bw);
    --spin: var(--d-spin);
    --light-primary-color: var(--d-light-primary-color);
    --danger-color: var(--d-danger-color);
}
/* 変数指定終わり */