/**
 * FerventWord
 *
 * @package   ferventword
 * @author    Jerry Simmons <jerry@ferventsolutions.com>
 * @copyright 2025 Jerry Simmons
 * @license   GPL-2.0+
 **/


/**
 * iPhone 12 Mini: 360 x 780
 * iPhone 12: 390 x 844
 * iPad: 810 x 1080
 * MacBook: 1280 x 800
 *
 * 1280px
 * 1079px
 * 779px
 * 389px
 **/
@media( max-width: 1079px ) {}
@media( max-width: 779px ) {}
@media( max-width: 389px ) {}

/*** COLORS ********************************
 *          BOLD     LIGHT    BACKGROUND
 * White:   #F8F8F8  #FFFFFF
 * Red:     #7F1518  #EDDCDD
 * Orange:  #BD4B27  #F1D0C7  #F5E8E4
 * Yellow:  #D77C28  #F7E0C7
 * Green:   #2D5126  #E1E4DE
 * Blue:    #1F2655  #DEDFE7  #EBE8EC
 * Purple:  #522D55  #E5E0E6
 * Black:   #282528  #E0E0DF
 ***/

.trait-fwui-tooltip {
	cursor: help;
}
.fwui-tooltip-icon {
	width: .8em;
	height: .8em;
	margin-left: .5em;
}

.trait-fwui-tooltip::before {
	content:'';
	width: 20px;
	height: 20px;
	transform: rotate(45deg);
	position:absolute;
	background-color: #522D55;
	margin-left: 14px;
	margin-top: 20px;
	box-shadow: 0px 0px 5px 3px rgba(255,255,255,.75);
	z-index: -1;
	opacity: 0;
	visibility: hidden;
}
.trait-fwui-tooltip:hover::before {
	visibility: visible;
	opacity: 1;
	z-index: 1;
}

.trait-fwui-tooltip::after {
	display: block;
	position: absolute;
	z-index: 1;
	content: attr(data-description);
	visibility: hidden;
	opacity: 0;
	background-color: #522D55;
	color: #fff;
	text-align: center;
	border-radius: 6px;
	width: 400px;
	max-width: 95%;
	font-size: 14px;
	line-height: 1.25em;
	padding: 10px;
	height: 0;
}
.trait-fwui-tooltip:hover::after {
	visibility: visible;
	opacity: 1;
	height: unset;
}