/* Theme Colors                                                                                                               */
/* -------------------------------------------------------------------------------------------------------------------------- */
.bright-theme {
	--color-cdl-main      : #002b6c;
	--color-cdl-secondary : #f26334;
	--color-cdl-light     : #f0f8ff;

	--color-cdl-clear     : #ffffff;
	--color-cdl-lightgrey : #f8f8f8;
	--color-cdl-midgrey   : #eeeeee;
	--color-cdl-grey      : #808080;
	--color-cdl-darkgrey  : #262626;
	--color-cdl-dark      : #000000;

	--color-app-bg              : var(--color-cdl-clear);
	--color-app-bar-bg          : var(--color-cdl-main);
	--color-app-bar-btn-hvr-txt : var(--color-cdl-secondary);

	--color-gs1-violet      : #af96d4;
	--color-gs1-violet-pale : #f7f2ff;
	--color-gs1-violet-dark : #886daf;
}
.dark-theme {
	--color-cdl-main      : #002b6c;
	--color-cdl-secondary : #f26334;
	--color-cdl-light     : #00183d;

	--color-cdl-clear     : #000000;
	--color-cdl-lightgrey : #141414;
	--color-cdl-midgrey   : #262626;
	--color-cdl-grey      : #808080;
	--color-cdl-darkgrey  : #808080;
	--color-cdl-dark      : #f8f8f8;

	--color-app-bg              : var(--color-cdl-clear);
	--color-app-bar-bg          : var(--color-cdl-main);
	--color-app-bar-btn-hvr-txt : var(--color-cdl-secondary);

	--color-gs1-violet      : #af96d4;
	--color-gs1-violet-pale : #f7f2ff;
	--color-gs1-violet-dark : #886daf;
}
/* Required to hide google translate toolbar.                                                                                 */
/* -------------------------------------------------------------------------------------------------------------------------- */
body {
	position : initial !important;
}
.tooltip-inner {
	background-color: var(--color-gs1-violet);
}
.tooltip.bottom .tooltip-arrow {
	border-bottom-color: var(--color-gs1-violet) !important;
}
.skiptranslate > iframe { 
	height       : 0 !important;
	border-style : none;
	box-shadow   : none;
}
.idx-translate-info {
	font-size : 20px;
    color     : var(--color-gs1-violet);
}
@media (max-width: 719px) {
	.content {
		margin-bottom : calc(100vh - var(--vh, 100vh));
	}
}
/* Element Tweaks                                                                                                             */
/* -------------------------------------------------------------------------------------------------------------------------- */
.cab-appbar {
	height : 74px;
}

.cab-center {
	overflow : visible;
}
#idx_translate_container button.btn.dropdown-toggle.btn-white {
	height  : 38px;
	padding : 0 12px;
}
.content-center {
	height     : calc(var(--vh, 100vh) - 124px);
	overflow-x : hidden;
	position   : relative;
}
@media (max-width: 1279px) {
	.content-center {
		height     : auto;
		/* overflow-x : hidden; */
		/* position   : relative; */
	}
}
/* Digital Link Landing Page CSS                                                                                              */
/* -------------------------------------------------------------------------------------------------------------------------- */
.cdl-wrapper {
	display        : flex;
	flex-direction : row;
	height         : calc(var(--vh, 100vh) - 124px);
	overflow-x     : hidden;
	z-index : 1;
}
.cdl-top {
	background-color : var(--color-cdl-midgrey);
	width            : 100%;
	flex             : 2;
	overflow-x     : hidden;
}
.cdl-top-content {
	display        : flex;
	flex-direction : column;
	row-gap        : 32px;
	column-gap     : 32px;
	padding        : 48px;
}
.cdl-top-left {
	max-width  : 360px;
	max-height : 360px;
}
.cdl-logo-img {
	margin-bottom : 16px;
}
.cdl-mbr-brand {
	/* margin-bottom : 32px; */
}
.cdl-main-img {
	max-width  : inherit;
	max-height : inherit;
	box-shadow : 0 0 10px 0  var(--color-cdl-grey);
}
.cdl-xtr-img {
	margin-top : 16px;
}
.cdl-top-right {
	display        : flex;
	flex-direction : column;
	align-items    : flex-start;
	margin-top     : 32px;
	width          : 100%;
}
.cdl-main-title {
	font-size : 36px;
	color     : var(--color-cdl-main);
}
.cdl-main-descr {
	font-size : 22px;
	color     : var(--color-cdl-darkgrey);
}
.cdl-main-gtin {
	background-color : var(--color-gs1-violet-dark);
	font-size        : 16px;
	color            : var(--color-cdl-clear);
	border-radius    : 12px;
    padding          : 2px 10px 0;
    display          : flex;
    align-items      : center;
	margin           : 10px 0;
}
.cdl-bottom {
	width           : 100%;
	display         : flex;
	flex-direction  : column;
	justify-content : space-between;
	height          : calc(var(--vh, 100vh) - 124px);
	overflow-x      : hidden;
	flex            : 3;
}
.cdl-bottom-content {
	padding : 48px;
}
.cdl-ft-header {
	display        : flex;
	flex-direction : row;
	align-items    : center;
	column-gap     : 20px;
	padding        : 10px;
	cursor         : pointer;
}
.cdl-ft-header:hover {
	background-color : var(--color-gs1-violet-pale);
}
.cdl-ft-header:hover .cdl-ft-hdr-icon {
	background-color : var(--color-gs1-violet-dark);
}
.cdl-ft-header:hover .cdl-ft-hdr-xc {
	color : var(--color-gs1-violet-dark);
}
.cdl-ft-header.active {
	background-color : var(--color-gs1-violet-pale);
	.cdl-ft-hdr-icon {
		background-color : var(--color-gs1-violet-dark);
	}
	.cdl-ft-hdr-xc {
		color : var(--color-gs1-violet-dark);
	}
}
.cdl-ft-hdr-icon {
	background-color : var(--color-cdl-main);
	color            : var(--color-cdl-clear);
	width            : 56px;
	height           : 56px;
	display          : flex;
	align-items      : center;
    justify-content  : center;
	border-radius    : 50%;
	font-size        : 22px;
	flex-shrink      : 0;
}
.cdl-ft-hdr-label {
	flex-grow : 1;
	color     : var(--color-cdl-darkgrey);
	font-size : 18px;
}
.cdl-ft-hdr-xc {
	color     : var(--color-cdl-main);
	font-size : 20px;
}
.cdl-ft-content {
	padding-left : 82px;
}
.cdl-ft-content table {
	border-collapse : collapse;
	width           : 100%;
}
.cdl-ft-content tr:not(:last-child) {
	border-bottom: 1px solid var(--color-cdl-midgrey);
}
.cdl-ft-content tr:hover {
	background-color: var(--color-cdl-lightgrey);
}
.cdl-ft-content td {
	font-size       : 14px;
	color           : var(--color-cdl-dark);
	border-collapse : collapse;
	width           : 50%;
	height          : 48px;
	padding         : 8px 4px;
	white-space     : pre-wrap;
	overflow-wrap   : anywhere;
}
.cdl-footer {
	height           : 48px;
	width            : 100%;
	background-color : var(--color-cdl-main);
	display          : flex;
    align-items      : center;
    justify-content  : flex-end;
	color            : var(--color-cdl-clear);
    padding          : 0 16px;
	text-align       : right;
}
.cdl-footer a {
	color : var(--color-gs1-violet);
}
.cdl-top-head {
	display : flex;
	flex-direction : column;
	column-gap : 20px;
}
.cdl-top-main {
	display : flex;
	flex-direction : column;
}
@media (max-width: 1279px) {
	.cdl-wrapper {
		display : block;
		/* flex-direction : column; */
		/* align-items    : center; */
	}
	.cdl-top {
		flex-grow : 0;
	}
	.cdl-top-content {
		/* flex-direction : row; */
		flex-grow      : 0;
		max-width      : 1000px;
		margin         : 0 auto;
	}
	.cdl-top-head {
		flex-direction : row;
		align-items: center;
		justify-content: space-between;
	}
	.cdl-mbr-brand {
		text-align: right;
	}
	.cdl-bottom {
		height     : auto;
		overflow-x : visible;
		max-width  : 1000px;
		margin     : 0 auto;
	}
}
@media (max-width: 719px) {
	/* .cdl-wrapper {
		height : calc(var(--vh, 100vh)- 174px);
	} */
	.cdl-top-content {
		/* flex-direction : column; */
		align-items    : center;
		padding        : 48px 16px;
	}
	.cdl-top-head {
		flex-direction : column;
	}
	.cdl-mbr-brand {
		text-align: center;
	}
	.cdl-top-main {
		align-items : center;
		width       : 100%;
	}
	/* .cdl-main-title, .cdl-main-descr {
		text-align : center;
	} */
	/* .cdl-main-gtin {
		margin : 10px auto;
	} */
	.cdl-bottom-content {
		padding : 48px 16px;
	}
	.cdl-ft-content {
		padding-left : 0;
	}
}
.cdl-mainerror {
	font-size  : 32px;
	text-align : center;
    padding    : 32px 0;
}