/*
	Stylesheet for Studio_Mulduzi, by Paul Smith. Updated 2026-01-23
*/

:root {
	--header-margin-bottom: -0.25em; /* This is the amount of space to allocate below all h1 and h2 elements. Necessary because I can't 'inherit' a shorthand margin value. */
	
	--trifecta-divider: /*5px solid black*/ none;
}

blockquote.block_ad {
	border:       2px solid black;
	margin-left: 50%;
	margin-top: -13rem;
	padding:      0.5rem;
	position:     relative;
	width:       47%;
}

blockquote.block_ad :is(h1, h2) {
	margin:        0 0.5rem; /* top right bottom left */
	margin-bottom: var(--header-margin-bottom);
}

body {
	margin:  2rem;
	padding: 0;
}

body :is(li, p) {
	font-family: Times;
	font-size:  14pt;
}

h1, h2 {
	font-family:   sans-serif;
	margin-bottom: var(--header-margin-bottom);
}

img {
	width: 100%;
}

table.LLL_trifecta {
	margin-top: 3rem;
	width: 100%;
}

table.LLL_trifecta td h1 {
	font-size:   6vw;
	line-height: 1.5em;
}

.LLL_trifecta td {
	border-right: var(--trifecta-divider);
	padding:    0.5rem 1rem 0 1rem; /* top right bottom left, right and left are equal */
	vertical-align: top;
	width:         33.33%;
}

.LLL_trifecta tr td:first-child {
	padding-left:  0;
}

.LLL_trifecta tr td:last-child {
	border-right:   none;
	padding-right:  0;
}

.LLL_trifecta td li {
	font-size: 94%;
}

.LLL_trifecta td h2 {
	/* border: 1px solid blue; */
}

.LLL_trifecta :is(td:nth-child(1), td:nth-child(2)) {
	/* border-right: 1px solid black; */
}

.LLL_trifecta td.LLL_love {
	background-color: rgba(255, 192, 203, 0.5); /* semi-transparent lightpink */
}

.LLL_trifecta td.LLL_laughter {
	background-color: rgba(176, 196, 222, 0.5); /* semi-transparent lightsteelblue */
}

.LLL_trifecta td.LLL_legacy {
	/* background-color: rgb(255,245,225); /* Color rgb((250, 235, 215) is antiquewhite. */
	background-image: url('paper-texture-03-darker.gif');
}

.LLL_trifecta td ul {
	/* list-style-type: none; */
	margin-left:    -1.75rem;
}

ol li:last-child {
	margin-bottom: 0.5rem;
}

.back_burner, .planned {
		background-color: lightgray;
}

:is(.back_burner, .planned) h2 {
	margin-top: 0;
}

.quotate:before {
	content: '\0201C';
}

.quotate:after {
	content: '\0201D';
}

.smaller {
	font-size: 84%;
}


td :is(h1, h2) {
	text-align: center;
}

/* The following three rules are from Google's AI Overview responding to 'css tool tip'. */
/* Container for the element to hover over */
.tooltip {
	cursor:   help; /* Changes the cursor to indicate interactivity */
	display:  inline-block; /* Allows the container to wrap its content */
	position: relative; /* Essential for positioning the inner text relative to this container */
}

/* The actual tooltip text */
.tooltip .tooltip_text {
	background-color: lightyellow;
	border:           1px solid black;
	margin-top:       0.5rem;
	opacity:          0; /* Starts with zero opacity for a fade effect */
	padding:          0 1rem; /* top right bottom left */
	position:         absolute; /* Positions the tooltip text */
	transition:       opacity 0.3s; /* Smooth transition for the fade-in */
	visibility:       hidden; /* Hides the tooltip by default */
	z-index:          1; /* Ensures the tooltip appears on top of other content */
}

/* Show the tooltip when hovering over the parent container */
.tooltip:hover .tooltip_text {
	opacity:    1;
	visibility: visible;
}

/* Additional tooltip style rule. */
.tooltip h1 {
	font-size: 125%;
}

/*ul {
	list-style-type: none;
	margin-left:    -2.5rem;
}*/

:is(blockquote, td) > ul {
	list-style-type: initial;
	margin-left:    -1rem;
}
