/* CSS Variables for different themes */

/**** Horizon Theme Variables ****/
:root:has(body.sap_horizon) {
	/* Theme colors */
	--sapBackgroundColor: #f5f6f7;
	--sapTextColor: #1d2d3e;
	--sapSelectedColor: #0064d9;
	--sapField_Background: #fff;
	--sapField_PlaceholderTextColor: #556b82;

	/* Font */
	--sapFontLargeSize: 1rem;
	--sapFontSize: .875rem;

	/* General */
	--sapElement_BorderCornerRadius: .75rem;
	--sapContent_TextShadow: 0 0 0.125rem #fff;
	--sapContent_FocusColor: #0032a5;
	--sapContent_ContrastTextColor: #fff;

	/* List */
	--sapList_Background: #fff;
	--sapList_BorderColor: #e5e5e5;
	--sapList_BorderWidth: .0625rem;
	--sapList_TextColor: #1d2d3e;

	/* Link */
	--sapLinkColor: #0064d9;
	--sapLink_TextDecoration: none;
	--sapLink_Hover_Color: #0064d9;
	--sapLink_Hover_TextDecoration: underline;
	--sapLink_Active_Color: #0064d9;
	--sapLink_Active_TextDecoration: none;
	--sapLink_Visited_Color: #0064d9;
	--sapLink_Visited_TextDecoration: underline;

	/*Table*/
	--sapList_TableGroupHeaderBorderColor: #94a8b9;

	/* Scrollbar */
	--sapScrollBar_TrackColor: #fff;
	--sapScrollBar_FaceColor: #7b91a8;
	--sapScrollBar_Hover_FaceColor: #5b728b;
}

:root:has(body.sap_horizon_dark) {
	/* Theme colors */
	--sapBackgroundColor: #12171c;
	--sapTextColor: #eaecee;
	--sapSelectedColor: #4db1ff;
	--sapField_Background: #161c22;
	--sapField_PlaceholderTextColor: #8396A8;

	/* Font */
	--sapFontLargeSize: 1rem;
	--sapFontSize: .875rem;

	/* General */
	--sapElement_BorderCornerRadius: .75rem;
	--sapContent_TextShadow: 0 0 0.125rem #000;
	--sapContent_FocusColor: #9ad3ff;
	--sapContent_ContrastTextColor: #1d232a;

	/* List */
	--sapList_Background: #1d232a;
	--sapList_BorderColor: #2e3742;
	--sapList_BorderWidth: .0625rem;
	--sapList_TextColor: #eaecee;

	/* Link */
	--sapLinkColor: #4db1ff;
	--sapLink_TextDecoration: none;
	--sapLink_Hover_Color: #4db1ff;
	--sapLink_Hover_TextDecoration: underline;
	--sapLink_Active_Color: #4db1ff;
	--sapLink_Active_TextDecoration: none;
	--sapLink_Visited_Color: #4db1ff;
	--sapLink_Visited_TextDecoration: underline;

	/*Table*/
	--sapList_TableGroupHeaderBorderColor: #758ca4;

	/* Scrollbar */
	--sapScrollBar_TrackColor: #1d232a;
	--sapScrollBar_FaceColor: #647891;
	--sapScrollBar_Hover_FaceColor: #8697ac;
}

:root:has(body.sap_horizon_hcw) {
	/* Theme colors */
	--sapBackgroundColor: #fff;
	--sapTextColor: #000;
	--sapSelectedColor: #5c93ff;
	--sapField_Background: #fff;
	--sapField_PlaceholderTextColor: #585858;

	/* Font */
	--sapFontLargeSize: 1rem;
	--sapFontSize: .875rem;

	/* General */
	--sapElement_BorderCornerRadius: .25rem;
	--sapContent_TextShadow: -0.0625rem 0 #fff, 0 0.0625rem #fff, 0.0625rem 0 #fff, 0 -0.0625rem #fff;
	--sapContent_FocusColor: #000;
	--sapContent_ContrastTextColor: #000;

	/* List */
	--sapList_Background: #fff;
	--sapList_BorderColor: #585858;
	--sapList_BorderWidth: .0625rem;
	--sapList_TextColor: #000;

	/* Link */
	--sapLinkColor: #000;
	--sapLink_TextDecoration: underline;
	--sapLink_Hover_Color: #000;
	--sapLink_Hover_TextDecoration: none;
	--sapLink_Active_Color: #000;
	--sapLink_Active_TextDecoration: underline;
	--sapLink_Visited_Color: #000;
	--sapLink_Visited_TextDecoration: underline;

	/*Table*/
	--sapList_TableGroupHeaderBorderColor: #000;

	/* Scrollbar */
	--sapScrollBar_TrackColor: #fff;
	--sapScrollBar_FaceColor: #585858;
	--sapScrollBar_Hover_FaceColor: #000;
}

:root:has(body.sap_horizon_hcb) {
	/* Theme colors */
	--sapBackgroundColor: #000;
	--sapTextColor: #fff;
	--sapSelectedColor: #0f5c93;
	--sapField_Background: #000;
	--sapField_PlaceholderTextColor: #999;

	/* Font */
	--sapFontLargeSize: 1rem;
	--sapFontSize: .875rem;

	/* General */
	--sapElement_BorderCornerRadius: .25rem;
	--sapContent_TextShadow: -0.0625rem 0 #000, 0 0.0625rem #000, 0.0625rem 0 #000, 0 -0.0625rem #000;
	--sapContent_FocusColor: #fff;
	--sapContent_ContrastTextColor: #fff;

	/* List */
	--sapList_Background: #000;
	--sapList_BorderColor: #fff;
	--sapList_BorderWidth: .0625rem;
	--sapList_TextColor: #fff;

	/* Link */
	--sapLinkColor: #fff;
	--sapLink_TextDecoration: underline;
	--sapLink_Hover_Color: #fff;
	--sapLink_Hover_TextDecoration: none;
	--sapLink_Active_Color: #fff;
	--sapLink_Active_TextDecoration: underline;
	--sapLink_Visited_Color: #fff;
	--sapLink_Visited_TextDecoration: underline;

	/*Table*/
	--sapList_TableGroupHeaderBorderColor: #fff;

	/* Scrollbar */
	--sapScrollBar_TrackColor: #000;
	--sapScrollBar_FaceColor: #999;
	--sapScrollBar_Hover_FaceColor: #fff;
}

/**** Fiori 3 Theme Variables ****/
:root:has(body.sap_fiori_3) {
	/* Theme colors */
	--sapBackgroundColor: #f7f7f7;
	--sapTextColor: #32363a;
	--sapSelectedColor: #0854a0;
	--sapField_Background: #fff;
	--sapField_PlaceholderTextColor: #75787b;

	/* Font */
	--sapFontLargeSize: 1rem;
	--sapFontSize: .875rem;

	/* General */
	--sapElement_BorderCornerRadius: .25rem;
	--sapContent_TextShadow: 0 0 0.125rem #fff;
	--sapContent_FocusColor: #000;
	--sapContent_ContrastTextColor: #fff;

	/* List */
	--sapList_Background: #fff;
	--sapList_BorderColor: #e5e5e5;
	--sapList_BorderWidth: 0.0625rem;
	--sapList_TextColor: #32363a;

	/* Link */
	--sapLinkColor: #0a6ed1;
	--sapLink_TextDecoration: none;
	--sapLink_Hover_Color: #0854a0;
	--sapLink_Hover_TextDecoration: underline;
	--sapLink_Active_Color: #0a6ed1;
	--sapLink_Active_TextDecoration: underline;
	--sapLink_Visited_Color: #0a6ed1;
	--sapLink_Visited_TextDecoration: underline;

	/*Table*/
	--sapList_TableGroupHeaderBorderColor: #e5e5e5;

	/* Scrollbar */
	--sapScrollBar_TrackColor: #fff;
	--sapScrollBar_FaceColor: #949494;
	--sapScrollBar_Hover_FaceColor: #8c8c8c;
}

:root:has(body.sap_fiori_3_dark) {
	/* Theme colors */
	--sapBackgroundColor: #1c2228;
	--sapTextColor: #fafafa;
	--sapSelectedColor: #91c8f6;
	--sapField_Background: #29313a;
	--sapField_PlaceholderTextColor: #b8bec2;

	/* Font */
	--sapFontLargeSize: 1rem;
	--sapFontSize: .875rem;

	/* General */
	--sapElement_BorderCornerRadius: .25rem;
	--sapContent_TextShadow: 0 0 0.125rem #000;
	--sapContent_FocusColor: #fff;
	--sapContent_ContrastTextColor: #29313a;

	/* List */
	--sapList_Background: #29313a;
	--sapList_BorderColor: #3a4552;
	--sapList_BorderWidth: 0.0625rem;
	--sapList_TextColor: #fafafa;

	/* Link */
	--sapLinkColor: #2994ee;
	--sapLink_TextDecoration: none;
	--sapLink_Hover_Color: #117bd3;
	--sapLink_Hover_TextDecoration: underline;
	--sapLink_Active_Color: #2994ee;
	--sapLink_Active_TextDecoration: underline;
	--sapLink_Visited_Color: #2994ee;
	--sapLink_Visited_TextDecoration: underline;

	/*Table*/
	--sapList_TableGroupHeaderBorderColor: #3a4250;

	/* Scrollbar */
	--sapScrollBar_TrackColor: #090b0d;
	--sapScrollBar_FaceColor: #506273;
	--sapScrollBar_Hover_FaceColor: #4a5a6a;
}

:root:has(body.sap_fiori_3_hcw) {
	/* Theme colors */
	--sapBackgroundColor: #fff;
	--sapTextColor: #000;
	--sapSelectedColor: #8fb5ff;
	--sapField_Background: #fff;
	--sapField_PlaceholderTextColor: #585858;

	/* Font */
	--sapFontLargeSize: 1rem;
	--sapFontSize: .875rem;

	/* General */
	--sapElement_BorderCornerRadius: .25rem;
	--sapContent_TextShadow: -1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff;
	--sapContent_FocusColor: #000;
	--sapContent_ContrastTextColor: #000;

	/* List */
	--sapList_Background: #fff;
	--sapList_BorderColor: #585858;
	--sapList_BorderWidth: 0.0625rem;
	--sapList_TextColor: ##000;

	/* Link */
	--sapLinkColor: #000;
	--sapLink_TextDecoration: underline;
	--sapLink_Hover_Color: #000;
	--sapLink_Hover_TextDecoration: none;
	--sapLink_Active_Color: #000;
	--sapLink_Active_TextDecoration: underline;
	--sapLink_Visited_Color: #000;
	--sapLink_Visited_TextDecoration: underline;

	/*Table*/
	--sapList_TableGroupHeaderBorderColor: #000;

	/* Scrollbar */
	--sapScrollBar_TrackColor: #fff;
	--sapScrollBar_FaceColor: #585858;
	--sapScrollBar_Hover_FaceColor: #000;
}

:root:has(body.sap_fiori_3_hcb) {
	/* Theme colors */
	--sapBackgroundColor: #000;
	--sapTextColor: #fff;
	--sapSelectedColor: #0f5d94;
	--sapField_Background: #000;
	--sapField_PlaceholderTextColor: #999;

	/* Font */
	--sapFontLargeSize: 1rem;
	--sapFontSize: .875rem;

	/* General */
	--sapElement_BorderCornerRadius: .25rem;
	--sapContent_TextShadow: -1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000;
	--sapContent_FocusColor: #fff;
	--sapContent_ContrastTextColor: #fff;

	/* List */
	--sapList_Background: #000;
	--sapList_BorderColor: #fff;
	--sapList_BorderWidth: 0.0625rem;
	--sapList_TextColor: #fff;

	/* Link */
	--sapLinkColor: #fff;
	--sapLink_TextDecoration: underline;
	--sapLink_Hover_Color: #fff;
	--sapLink_Hover_TextDecoration: none;
	--sapLink_Active_Color: #fff;
	--sapLink_Active_TextDecoration: underline;
	--sapLink_Visited_Color: #fff;
	--sapLink_Visited_TextDecoration: underline;

	/*Table*/
	--sapList_TableGroupHeaderBorderColor: #fff;

	/* Scrollbar */
	--sapScrollBar_TrackColor: #000;
	--sapScrollBar_FaceColor: #999;
	--sapScrollBar_Hover_FaceColor: #fff;
}

/*********************** Scrollbar ***********************/

::-webkit-scrollbar-track {
	background-color: var(--sapScrollBar_TrackColor);
}

::-webkit-scrollbar-thumb {
	background-color: var(--sapScrollBar_FaceColor);
}

/******************************************************/

html {
	scrollbar-width: auto;
	scrollbar-color: var(--sapScrollBar_FaceColor) var(--sapScrollBar_TrackColor);
}

.mce-content-body {
	background-color: var(--sapField_Background);
	color: var(--sapTextColor);
}

/* Placeholder styling */
.mce-content-body[data-mce-placeholder]:not(:empty)::before{
	font-style: italic; 
	color: var(--sapField_PlaceholderTextColor);
}

.mce-content-body::selection,
.mce-content-body [data-mce-selected=inline-boundary] {
	background-color: var(--sapSelectedColor);
	color: var(--sapContent_ContrastTextColor);
}

.mce-content-body li {
	font-weight: normal;
	color: var(--sapList_TextColor);
}

.mce-content-body a {
	color: var(--sapLinkColor);
	text-decoration: var(--sapLink_TextDecoration);
	cursor: pointer;
}

.mce-content-body a:hover() {
	text-decoration: var(--sapLink_Hover_TextDecoration);
}

.mce-content-body a:active {
	color: var(--sapLink_Active_Color);
	text-decoration: var(--sapLink_Active_TextDecoration);
}

.mce-content-body a:visited {
	color: var(--sapLink_Visited_Color);
	text-decoration: var(--sapLink_Visited_TextDecoration);
}

.mce-content-body a:focus {
	border-color: var(--sapContent_FocusColor);
	border-radius: 0.125rem;
}

.mce-content-body a:visited:focus {
	color: var(--sapContent_ContrastTextColor);
}

.mce-content-body table[border]:not([border="0"]):not([style*=border-color]) th {
	border-color: var(--sapList_TableGroupHeaderBorderColor);
}

.mce-content-body table[border]:not([border="0"]):not([style*=border-color]) td {
	border-color: var(--sapList_BorderColor);
}