/*

********************************************************************************

Hueber.de CSS 2015

Zusätzliche Stylesheets für Digitale und KI-Tools

Version:   1.0
Datum:     28.01.2022

Erfordert: -

Hinweise:  -

Historie:  1.0 (28.01.2022)  - erstes Release

********************************************************************************

*/

:root
{
	--dark-bg-color: rgb(106, 186, 236);
	--medium-bg-color: rgb(145, 209, 249);
	--light-bg-color: rgb(216, 241, 255);
}

div.cd
{
	margin-top: var(--p-margin-top);
}

div.cd div.header
{
	--a-link-color: white;

	align-items: center;
	background-color: var(--medium-bg-color);
	border: 1px solid var(--medium-bg-color);
	border-radius: var(--small-border-radius);
	color: white !important;
	cursor: pointer;
	display: flex;
	flex-flow: row nowrap;
	/* font-weight: bold; */
	padding: .5em 1em;
}

div.cd div.header div
{
	--a-link-color: white;

	flex: 1 1 auto;
}

div.cd div.header::after
{
	display: inline-block;
	font-family: var(--symbol-font);
	font-size: 1.2em;
	font-style: normal;
	font-weight: normal;
	margin-left: .5em;
}

div.cd.opened div.header::after
{
	content: "\F0011";
}

div.cd:not(.opened) div.header::after
{
	content: "\F0031";
}



.body.grid.highlight.productpresentation .artikel header
{
	margin-top: 0;
}

.body.grid.highlight.productpresentation .artikel .refarea :is(p.link, ul.liste > li.link)
{
	--a-link-color: white;

	background-color: var(--dark-bg-color);
	border: 1px solid var(--dark-bg-color);
	border-radius: var(--small-border-radius);
	color: white !important;
	display: block;
	padding: .5em 1em;
	font-weight: bold;
}

@container (width < 350px)
{
	.artikel.kitoolautorin :is(.image, .imagelink, .video):is(.portrait, .productcover):not(.circle).float
	{
		max-width: 140px;
	}
}

@container (width > 349px)
{
	.artikel.kitoolautorin :is(.image, .imagelink, .video):is(.portrait, .productcover):not(.circle).float
	{
		max-width: 150px;
	}
}