/* Favourite Tags - Left / Revision 0.4 */
.data.tags span { padding: 0; }
.data.tags span a { margin: 1px 0; }

.data.tags span a[href*="\=Fav"] {
	position: absolute;
	left: 245px;
	top: calc(12% - 12px);
	width: 32px;
	height: 30px;
	padding: 0 !important;
	background: var(--bg);
	border-radius: 80%;
	color: #ff65ad !important;
	font-size: 0 !important;
	/* location of symbol*/
	line-height: 28px; 
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(0,0,0,0.2);
} 

.data.tags span a[href*="\=Fav"]:before { 
content: "😍"; 
font-size: 24px; 
}
/****************************/

/*==============================*\
|       Score  Descriptors       |
\* --- - --- - ---- - --- - --- */

.score-na::before { content: "❓"; font-size: 18px;}
.score-1::before { content: "☠️"; font-size: 18px;}
.score-2::before { content: "💩"; font-size: 18px;}
.score-3::before { content: "🚮"; font-size: 18px;}
.score-4::before { content: "💤"; font-size: 18px;}
.score-5::before { content: "💬"; font-size: 18px;}
.score-6::before { content: "⚠️"; font-size: 18px;}
.score-7::before { content: "👍"; font-size: 18px;}
.score-8::before { content: "🎉"; font-size: 18px;}
.score-9::before { content: "🔥"; font-size: 18px;}
.score-10::before { content: "💯"; font-size: 18px;}
/****************************/


/* Tag Descriptions Basis - Horizontal / Revision 2.1 */
.data.tags span a { position: relative; }

.data.tags span a:not([href*="\=Fav"]):after, 
.data.tags span a:not([href*="\=Fav"]):before {
	position: absolute;
	display: block;
	transition: all 0.15s ease;
	pointer-events: none;
	opacity: 0;
	z-index: 5;
}

.data.tags span a:not([href*="\=Fav"]):after {
	top: 27px;
	left: calc(50% - 345px);
	width: auto;
	max-width: 340px;
	height: auto;
	padding: 4px 8px;
	background: var(--btn-bg);
	border: 1px solid var(--text-dim);
	border-radius: 4px;
	box-sizing: border-box;
	color: var(--text);
	font: 11px/15px Arial, Verdana;
	text-align: left;
	white-space: pre-wrap;
	transform: translateX(-50%) translateX(340px);
}

.data.tags span a:not([href*="\=Fav"]):before {
	content: "";
	top: 17px;
	left: 50%;
	border-width: 5px;
	border-style: solid;
	border-color: transparent transparent var(--text-dim) transparent;
	margin-left: -10px;
}

.data.tags span a:hover:after {
	left: calc(50% - 340px);
	opacity: 1;
}
.data.tags span a:not([href*="\=Fav"]):hover:before {
	margin-left: -5px;
	opacity: 1;
}

.data.tags span:not([href*="\=Fav"]) a:after { transform: translateX(-17%) translateX(340px); }
.data.tags span:not([href*="\=Fav"]):nth-child(n+3) a:after { transform: translateX(-33%) translateX(340px); }
.data.tags span:not([href*="\=Fav"]):nth-child(n+5) a:after { transform: translateX(-50%) translateX(340px); }
.data.tags span:not([href*="\=Fav"]):nth-child(n+7) a:after { transform: translateX(-67%) translateX(340px); }
.data.tags span:not([href*="\=Fav"]):nth-child(n+9) a:after { transform: translateX(-83%) translateX(340px); }


/*------------------------------*\
  COLORED tags AND their descriptions
  https://myanimelist.net/forum/?topicid=1499059
\*------------------------------*/

/* Studios/Producers */
.data.studio a:link { color: #ff9f80 !important ; }
.data.licensor a:link { color: #c6538c !important }

/* Faves:
 Bones, Studio Pierrot, Madhouse, Studio Deen, Kyoto Animation, A-1 Pictures, Brain's Base, ufotable 
.data.studio span a[href$="/4"], 
.data.studio span a[href$="/1"],
.data.studio span a[href$="/11"],
.data.studio span a[href$="/37"],
.data.studio span a[href$="/2"],
.data.studio span a[href$="/56"],
.data.studio span a[href$="/112"], 
.data.studio span a[href$="/43"]
{ color: #66ff66 !important; } */

/* season */
.data.season span a[href$="winter"] { color: #ffffb2 !important; }
.data.season span a[href$="spring"] { color: #ff78c7 !important; }
.data.season span a[href$="summer"] { color: #4db8ff !important; }
.data.season span a[href$="fall"] { color: #ff3300 !important; }


/* GENRE TAGS */
.data.genre span a[href*="genre=1"], .data.genre span a[href*="genre=2"], .data.genre span a[href*="genre=7"], .data.genre span a[href*="genre=40"], .data.tags a[href*="\=Action"], .data.tags a[href*="\=Adventure"], .data.tags a[href*="\=Mystery"], .data.tags a[href*="\=Psychological"]
{ color: #ff9966 !important; } /* light peach/orangy */

.data.tags a[href*="\=Action"]:after { content: "⚔ Genre # 01 \a Plays out mainly through a clash of physical forces. Frequently these stories have fast cuts, tough characters making quick decisions and usually a beautiful girl nearby. Anything quick and most likely a thin storyline.";}
.data.tags a[href*="\=Adventure"]:after { content: "📌 Genre # 02 \a Exploring new places, environments or situations. This is often associated with people on long journeys to places far away encountering amazing things, usually not in an epic but in a rather gripping and interesting way.";}
.data.tags a[href*="\=Mystery"]:after { content: "❔ Genre # 07 \a Anime where characters reveal secrets that may lead a solution for a great mystery. This is not necessarily solving a crime, but can be a realization after a quest.";}
.data.tags a[href*="\=Psychological"]:after { content: "Genre # 40";}
  
.data.genre span a[href*="genre=3"], .data.genre span a[href*="genre=11"], .data.genre span a[href*="genre=13"], .data.genre span a[href*="genre=18"], .data.genre span a[href*="genre=29"], .data.tags a[href*="\=Cars"], .data.tags a[href*="\=Game"], .data.tags a[href*="\=Historical"], .data.tags a[href*="\=Mecha"], .data.tags a[href*="\=Space"]
{ color: #6CA790 !important;  } /* pale greenish teal */

.data.tags a[href*="\=Cars"]:after { content: "Genre # 03";}
.data.tags a[href*="\=Game"]:after { content: "🧙‍♂ Theme # 11 \a Anime whose central theme is based on a non-violent, non-sports game, like go, chess, trading card games or computer/video games.";}
.data.tags a[href*="\=Historical"]:after { content: "Theme # 13 \a Anime whose setting is in the past. Frequently these follow historical tales, sagas or facts.";}
.data.tags a[href*="\=Mecha"]:after { content: "Theme # 18 \a Anime whose central theme involves mechanical things. This genre is mainly used to point out when there are giant robots. Human size androids are in general not considered \"Mecha\" but \"SciFi\".";}
.data.tags a[href*="\=Space"]:after { content: "Genre # 29";}
  
.data.genre span a[href*="genre=4"], .data.genre span a[href*="genre=20"], .data.genre span a[href*="genre=9"], .data.genre span a[href*="genre=35"], .data.genre span a[href*="genre=47"], .data.tags a[href*="\=Comedy"], .data.tags a[href*="\=Parody"], .data.tags a[href*="\=Ecchi"], .data.tags a[href*="\=Harem"], .data.tags a[href*="\=Gourmet"]
{ color: #ffff66 !important; } /* light yellow */

.data.tags a[href*="\=Comedy"]:after { content: "😆 Genre # 04 \a Multiple characters and/or events causing hilarious results. These stories are built upon funny characters, situations and events.";}
.data.tags a[href*="\=Parody"]:after { content: "Genre # 20";}
.data.tags a[href*="\=Ecchi"]:after { content: "Genre # 09";}
.data.tags a[href*="\=Harem"]:after { content: "Genre # 35";}
.data.tags a[href*="\=Gourmet"]:after { content: "Genre # 47";}

.data.genre span a[href*="genre=5"], .data.genre span a[href*="genre=6"], .data.genre span a[href*="genre=14"], .data.genre span a[href*="genre=37"], .data.tags a[href*="\=Avant%20Garde"], .data.tags a[href*="\=Dementia"], .data.tags a[href*="\=Demons"], .data.tags a[href*="\=Horror"], .data.tags a[href*="\=Supernatural"], 
.data.tags a[href*="\=Suspense"], .data.tags a[href*="\=Thriller"], .data.tags a[href*="\=Vampire"]
{ color: #ff5050 !important;  } /* light red/pinkish */

.data.tags a[href*="\=Avant%20Garde"]:after { content: "🎨 Genre # 05 \a Anime that have mind-twisting plots.";}
.data.tags a[href*="\=Dementia"]:after { content: "Genre # 05";}
.data.tags a[href*="\=Demons"]:after { content: "Genre # 06";}
.data.tags a[href*="\=Horror"]:after { content: "😱 Genre # 14 \a Anime whose focus is to scare the audience.";}
.data.tags a[href*="\=Supernatural"]:after { content: "👻 Genre # 37 \a Anime of the paranormal stature. Demons, vampires, ghosts, undead, etc.";}
.data.tags a[href*="\=Suspense"]:after { content: "Genre # 41";}
.data.tags a[href*="\=Thriller"]:after { content: "Genre # 41";}
.data.tags a[href*="\=Vampire"]:after { content: "Genre # 32";}
  
.data.genre span a[href*="genre=8"], .data.genre span a[href*="genre=10"], .data.genre span a[href*="genre=22"], .data.genre span a[href*="genre=23"], .data.genre span a[href*="genre=36"], .data.genre span a[href*="genre=30"], .data.tags a[href*="\=Drama"], .data.tags a[href*="\=Fantasy"], .data.tags a[href*="\=Romance"], .data.tags a[href*="\=School"], 
.data.tags a[href*="\=Slice%20of%20Life"], .data.tags a[href*="\=Sports"]
{ color: #ff3385 !important; } /* pink/bright crimson */

.data.tags a[href*="\=Drama"]:after { content: "💢 Genre # 08 \a  Anime that often show life or characters through conflict and emotions. In general, the different parts of the story tend to form a whole that is greater than the sum of the parts. In other words, the story has a message that is bigger than just the story line itself.";}
.data.tags a[href*="\=Fantasy"]:after { content: "🌈 Genre # 10 \a Anime that are set in a mythical world quite different from modern-day Earth. Frequently this world has magic and/or mythical creatures such as dragons and unicorns. These stories are sometimes based on real world legends and myths. Frequently fantasies describe tales featuring magic, brave knights, damsels in distress, and/or quests.";}
.data.tags a[href*="\=Romance"]:after { content: "💗 Genre # 22 \a Anime whose story is about two people who each want [sometimes unconciously] to win or keep the love of the other. This kind of anime might also fall in the \"Ecchi\" category, while \"Romance\" and \"Hentai\" generally contradict each other.";}
.data.tags a[href*="\=School"]:after { content: "Theme # 23 \a Anime which are mainly set in a school environment.";}
.data.tags a[href*="\=Slice%20of%20Life"]:after { content: "🍕 Genre # 36 \a Anime with no clear central plot. This type of anime tends to be naturalistic and mainly focuses around the main characters and their everyday lives. Often there will be some philosophical perspectives regarding love, relationships, life etc. tied into the anime. The overall typical moods for this type of anime are cheery and carefree, in other words, it is your \"feel-good\" kind of anime.";}
.data.tags a[href*="\=Sports"]:after { content: "Genre # 30";}
  
.data.demographic a[href*="demographic=15"], .data.demographic a[href*="demographic=43"], .data.demographic a[href*="demographic=42"], .data.demographic a[href*="demographic=25"], .data.demographic a[href*="demographic=27"], .data.genre span a[href*="demographic=15"], .data.genre span a[href*="demographic=43"], .data.genre span a[href*="demographic=41"], .data.genre span a[href*="demographic=25"], .data.genre span a[href*="demographic=27"], .data.tags a[href*="\=Kids"], .data.tags a[href*="\=Josei"], .data.tags a[href*="\=Seinen"], .data.tags a[href*="\=Shoujo"], .data.tags a[href*="\=Shounen"]
{ color: #005ce6 !important;  } /* blue */

.data.tags a[href*="\=Kids"]:after { content: "Demographic # 15";}
.data.tags a[href*="\=Josei"]:after { content: "Demographic # 43 \a Josei manga are Japanese comics catered specifically to women's interests, and marketed towards older teenage girls and adult women demographics who are able to read kanji without the aid of furigana. Subgenres of josei manga include \"ladies' comics\" or \"lady-comi\". Readers can range in age from 18 to 45.";}
body[data-work="anime"] .data.tags a[href*="\=Seinen"]:after { content: "Demographic # 42 \a Seinen manga are Japanese comics marketed toward young adult men. In Japanese, the word seinen literally means \"youth\", but the term \"seinen manga\" is also used to describe the target audience of magazines like Weekly Manga Times and Weekly Manga Goraku which cater specifically to men's interests, and are marketed towards a demographic of adult men between the ages of 18 and 40.";}
body[data-work="manga"] .data.tags a[href*="\=Seinen"]:after { content: "Demographic # 41 \a Seinen manga are Japanese comics marketed toward young adult men. In Japanese, the word seinen literally means \"youth\", but the term \"seinen manga\" is also used to describe the target audience of magazines like Weekly Manga Times and Weekly Manga Goraku which cater specifically to men's interests, and are marketed towards a demographic of adult men between the ages of 18 and 40.";}
.data.tags a[href*="\=Shoujo"]:after { content: "Demographic # 25 \a Shōjo manga, also romanized as shojo or shoujo, are Japanese comics aimed at a teen female target-demographic readership. The name romanizes the word 少女, literally meaning \"young woman\".";}
.data.tags a[href*="\=Shounen"]:after { content: "Demographic # 27 \a Shōnen manga, also romanized as shonen or shounen, are Japanese comics marketed towards young teen boys between the ages of 12 and 18. The age group varies with individual readers and different magazines.";}
  
.data.genre span a[href*="genre=16"], .data.genre span a[href*="genre=24"], .data.genre span a[href*="genre=19"], .data.genre span a[href*="genre=46"], .data.genre span a[href*="genre=48"], .data.tags a[href*="\=Magic"], .data.tags a[href*="\=Sci-Fi"], .data.tags a[href*="\=Music"], .data.tags a[href*="\=Award%20Winning"], .data.tags a[href*="\=Workplace"]
{ color: #009999 !important;  } /* sky blue gray */

.data.tags a[href*="\=Magic"]:after { content: "Genre # 16";}
.data.tags a[href*="\=Sci-Fi"]:after { content: "🚀 Genre # 24 \a Anime where the setting is based on the technology and tools of a scientifically imaginable world. The majority of technologies presented are not available in the present day and therefore the Science is Fiction. This incorporates any possible place (planets, space, underwater, you name it).";}
.data.tags a[href*="\=Music"]:after { content: "Theme # 19";}
.data.tags a[href*="\=Award%20Winning"]:after { content: "Genre # 46";}
.data.tags a[href*="\=Workplace"]:after { content: "Theme # 48";}

.data.genre span a[href*="genre=17"], .data.genre span a[href*="genre=38"], .data.genre span a[href*="genre=39"], .data.genre span a[href*="genre=21"], .data.genre span a[href*="genre=31"], .data.tags a[href*="\=Martial%20Arts"], .data.tags a[href*="\=Military"], .data.tags a[href*="\=Police"], .data.tags a[href*="\=Samurai"], 
.data.tags a[href*="\=Super%20Power"]
{ color: #009933 !important;  } /* green */

.data.tags a[href*="\=Martial%20Arts"]:after { content: "Theme # 17 \a Anime whose central theme revolves around martial arts. This includes all hand-to-hand fighting styles, including Karate, Tae-Kwon-Do and even Boxing. Weapons use, like Nunchaku and Shuriken are also indications of this genre. This is a sub-genre of action.";}
.data.tags a[href*="\=Military"]:after { content: "Genre # 38";}
.data.tags a[href*="\=Police"]:after { content: "Genre # 39";}
.data.tags a[href*="\=Samurai"]:after { content: "Genre # 21";}
.data.tags a[href*="\=Super%20Power"]:after { content: "Genre # 31";}
  
.data.genre span a[href*="genre=49"], .data.genre span a[href*="genre=12"], .data.genre span a[href*="genre=26"], .data.genre span a[href*="genre=28"], .data.genre span a[href*="genre=33"], .data.genre span a[href*="genre=34"], .data.tags a[href*="\=Hentai"], .data.tags a[href*="\=Shoujo%20Ai"], .data.tags a[href*="\=Shounen%20Ai"], 
.data.tags a[href*="\=Boys%20Love"], .data.tags a[href*="\=Girls%20Love"], .data.tags a[href*="\=Yaoi"], .data.tags a[href*="\=Yuri"]
{ color: #ff0000 !important;  } /* red */

.data.tags a[href*="\=Erotica"]:after { content: "Genre # 49";}
.data.tags a[href*="\=Hentai"]:after { content: "💋 Genre # 12 \a Anime whose central theme is explicit sex. Hentai is sex with usually a very small storyline, comparable with normal porn. Hentai can range from normal couple's sexual relationship to a wide variety of fetishes and perversions.";}
.data.tags a[href*="\=Shoujo%20Ai"]:after { content: "🍑 Genre # 26 \a Anime whose central theme is about a relationship (or strong affection, not usually sexual) between two girls or women. Shoujo Ai literally means \"girl love\".";}
.data.tags a[href*="\=Shounen%20Ai"]:after { content: "Genre # 28";}
.data.tags a[href*="\=Girls%20Love"]:after { content: "🍑 Genre # 26 \a Anime whose central theme is about a relationship (or strong affection, not usually sexual) between two girls or women. Shoujo Ai literally means \"girl love\".";}
.data.tags a[href*="\=Boys%20Love"]:after { content: "Genre # 28";}
.data.tags a[href*="\=Yaoi"]:after { content: "Genre # 26";}
.data.tags a[href*="\=Yuri"]:after { content: "Genre # 28";}


/* SPECIAL TAGS  */
.data.tags a[href*="\=Score"] { color: #009933 !important;  } /* color = green */
.data.tags a[href*="\=Score"]:after { content: "Rounded MAL score";}
.data.tags a[href*="\=DRP"]:after { content: "Drop Candidates";}
.data.tags a[href*="\=CMT"]:after { content: "Click More to view comments";}

/* anime sources */ 
.data.tags a[href*="\=Light%20Novel"] { color: #bf50e4 !important;  } /* color = lighter purple */
.data.tags a[href*="\=Light%20Novel"]:after { content: "A light novel is a style of Japanese young adult novel primarily targeting high school and middle school students. The term \"light novel\" is a wasei-eigo, or a Japanese term formed from words in the English language. Light novels are often called ranobe or, in English, LN."}
.data.tags a[href*="\=Manga"] { color: #bf50e4 !important;  } /* color = lighter purple */
.data.tags a[href*="\=Manga"]:after { content: "Manga are comics or graphic novels originating from Japan. Most manga conform to a style developed in Japan in the late 19th century, and the form has a long prehistory in earlier Japanese art. The term manga is used in Japan to refer to both comics and cartooning.";}

.data.tags a[href*="\=Rewatched"], 
.data.tags a[href*="\=Long-ep"], .data.tags a[href*="\=Short-ep"], 
.data.tags a[href*="\=Chinese"], .data.tags a[href*="\=Korean"]
{ color: #ff8000 !important; } /* color = dark orange */

.data.tags a[href*="\=Long-ep"]:after { content: "Anime with a duration per episode of 30 mins or more";}
.data.tags a[href*="\=Short-ep"]:after { content: "Anime with a duration per episode of 15 mins or less";}

/* years */
.data.tags a[href*="\=2022"]:after, .data.tags a[href*="\=2021"]:after, .data.tags a[href*="\=2020"]:after, .data.tags a[href*="\=2007"]:after, .data.tags a[href*="\=1989"]:after, .data.tags a[href*="\=2019"]:after, .data.tags a[href*="\=2015"]:after, .data.tags a[href*="\=2017"]:after, .data.tags a[href*="\=2013"]:after, .data.tags a[href*="\=2011"]:after, .data.tags a[href*="\=2012"]:after, .data.tags a[href*="\=2010"]:after, .data.tags a[href*="\=2006"]:after, .data.tags a[href*="\=2014"]:after, .data.tags a[href*="\=1999"]:after, .data.tags a[href*="\=2005"]:after, .data.tags a[href*="\=2016"]:after 
{ content: "Year Published"; }

/* Theme  */

.data.tags a[href*="\=Isekai"], 
.data.tags a[href*="\=Iyashikei"]
{ color: #33ccff !important; } /* color = sky/bright blue */

/* on the Theme Tags Challenge */

.data.tags a[href*="\=Isekai"]:after { content: "🐉 Theme # 62 \a Anime that revolve around a person or people who are transported to and have to survive in another world, such as a fantasy world, virtual world, planet, future/past time, or parallel universe.";}
.data.tags a[href*="\=Iyashikei"]:after { content: "Theme # 63 \a The Japanese word \"iyashi\" (癒し) means healing, and the term \"iyashikei\" refers to anime and manga that \"heal\" the audience by instilling a calming feeling or evoking emotional carthasis. Almost always, Iyashikei stories have peaceful, somewhat mundane, and nostalgic atmospheres. The settings are idyllic with little or no conflict, and the narratives focus on personal reflection, heartwarming moments, a vague sense of melancholy, and/or an appreciation for the small things in life. Iyashikei is a theme within the Slice of Life genre, and thus the conditions for both defintions must be met for the tag. Pets-themed stories are a subcategory of Iyashikei, so they are not double-tagged.";}

.data.tags a[href*="\=Not%20Available"]:after { content: "Haven't found a complete version online (might be no raw, no subs/dub or me not knowing where to look)";}


.data.genre:empty:before { content: ""; }
.data.demographic:empty:before { content: ""; }
/* ================================ */

/* Emoji Genres */

/* Action */
a[href$="&genre=1"]::before {
/* 	content: "⚔ " */
	content: "⚔️ " !important;
}
/* Adventure */
a[href$="&genre=2"]::before {
	content: "📌 "
}
/* Avant Garde */
a[href$="&genre=5"]::before {
	content: "🎨 "
}
/* Award Winning */
a[href$="&genre=46"]::before {
	content: "🏆 "
}
/* Boys Love */
a[href$="&genre=28"]::before {
	content: "🍆 "
}
/* Comedy */
a[href$="&genre=4"]::before {
	content: "😆 "
}
/* Drama */
a[href$="&genre=8"]::before {
	content: "💢 "
}
/* Ecchi & Erotica */
a[href$="&genre=9"]::before,
a[href$="&genre=49"]::before {
/* 	content: "🌡 " */
	content: "💦 "
}
/* Fantasy */
a[href$="&genre=10"]::before {
	content: "🌈 "
}
/* Girls Love */
a[href$="&genre=26"]::before {
	content: "🍑 "
}
/* Gourmet */
a[href$="&genre=47"]::before {
/* 	content: "🍽 " */
	content: "🍤 "
}
/* Hentai */
a[href$="&genre=12"]::before {
	content: "💋 "
}
/* Horror */
a[href$="&genre=14"]::before {
/* 	content: "👻 " */
	content: "😱 "
}
/* Mystery */
a[href$="&genre=7"]::before {
	content: "❔ "
}
/* Romance */
a[href$="&genre=22"]::before {
	content: "💗 "
}
/* Sci-Fi */
a[href$="&genre=24"]::before {
	content: "🚀 "
}
/* Slice of Life */
a[href$="&genre=36"]::before {
	content: "🍕 "
}
/* Sports */
a[href$="&genre=30"]::before {
	content: "⚽ "
}
/* Supernatural */
a[href$="&genre=37"]::before {
/* 	content: "🧙‍♂️ " */
/* 	content: "✨ " */
	content: "👻 ";
}
/* Suspense */
a[href$="&genre=41"]::before {
	content: "⏸ "
}
/* Workplace */
a[href$="&genre=48"]::before {
/* 	content: "🤵 " */
	content: "💼 "
}