/*
 * Citizen
 *
 * SkinStyles for Tippy
 * Shared by Extension:SemanticMediaWiki
 *
 * Date: 2024-07-24
*/

/* libs/tippy/tippy.css */
/* ^ This gets overriden by the styles below anyways */

/* libs/tippy/light-border.css */
.tippy-tooltip.light-border-theme {
	color: var( --color-base );
	background-color: var( --color-surface-1 );
	border-color: var( --border-color-base );
	border-radius: var( --border-radius-base );
	box-shadow: var( --box-shadow-drop-medium );
}

.tippy-tooltip.light-border-theme .tippy-backdrop {
	background-color: var( --color-surface-1 );
}

.tippy-tooltip.light-border-theme .tippy-roundarrow {
	fill: var( --color-surface-1 );
}

.tippy-tooltip.light-border-theme .tippy-roundarrow::after {
	fill: transparent;
}

.tippy-tooltip.light-border-theme[ x-placement^='top' ] .tippy-arrow {
	border-top-color: var( --color-surface-1 );
}

.tippy-tooltip.light-border-theme[ x-placement^='top' ] .tippy-arrow::after {
	border-top-color: var( --color-surface-1 );
}

.tippy-tooltip.light-border-theme[ x-placement^='top' ] .tippy-arrow::before {
	border-top-color: var( --border-color-base );
}

.tippy-tooltip.light-border-theme[ x-placement^='bottom' ] .tippy-arrow {
	border-bottom-color: var( --color-surface-1 );
}

.tippy-tooltip.light-border-theme[ x-placement^='bottom' ] .tippy-arrow::after {
	border-bottom-color: var( --color-surface-1 );
}

.tippy-tooltip.light-border-theme[ x-placement^='bottom' ] .tippy-arrow::before {
	border-bottom-color: var( --border-color-base );
}

.tippy-tooltip.light-border-theme[ x-placement^='left' ] .tippy-arrow {
	border-left-color: var( --color-surface-1 );
}

.tippy-tooltip.light-border-theme[ x-placement^='left' ] .tippy-arrow::after {
	border-left-color: var( --color-surface-1 );
}

.tippy-tooltip.light-border-theme[ x-placement^='left' ] .tippy-arrow::before {
	border-left-color: var( --border-color-base );
}

.tippy-tooltip.light-border-theme[ x-placement^='right' ] .tippy-arrow {
	border-right-color: var( --color-surface-1 );
}

.tippy-tooltip.light-border-theme[ x-placement^='right' ] .tippy-arrow::after {
	border-right-color: var( --color-surface-1 );
}

.tippy-tooltip.light-border-theme[ x-placement^='right' ] .tippy-arrow::before {
	border-right-color: var( --border-color-base );
}

/* libs/tippy/light.css */
.tippy-tooltip.light-theme {
	color: var( --color-base );
	background-color: var( --color-surface-1 );
	box-shadow: var( --box-shadow-drop-xx-large );
}

.tippy-tooltip.light-theme[ x-placement^='top' ] .tippy-arrow {
	border-top-color: var( --color-surface-1 );
}

.tippy-tooltip.light-theme[ x-placement^='bottom' ] .tippy-arrow {
	border-bottom-color: var( --color-surface-1 );
}

.tippy-tooltip.light-theme[ x-placement^='left' ] .tippy-arrow {
	border-left-color: var( --color-surface-1 );
}

.tippy-tooltip.light-theme[ x-placement^='right' ] .tippy-arrow {
	border-right-color: var( --color-surface-1 );
}

.tippy-tooltip.light-theme .tippy-backdrop {
	background-color: var( --color-surface-1 );
}

.tippy-tooltip.light-theme .tippy-roundarrow {
	fill: var( --color-surface-1 );
}