@charset "utf-8";

/* ==========================================================================
   Trichis-huisstijl over de flipbook-plugin heen. Alleen kleuraccenten en
   een klein vast logo — de eigenlijke afmetingen/lay-out van de plugin
   (flipbook.style.css) blijven onaangeroerd, want die rekent zelf de
   beschikbare ruimte uit. Geladen ná flipbook.style.css.
   ========================================================================== */

html, body {
	margin: 0;
	height: 100%;
	background: var(--ink-deep, #161817);
}

/* --------------------------------------------------------- logo, ingebed in de onderbalk */
/* De balk zelf is JS-gestuurd door de plugin (hoogte niet vast in CSS af te
   lezen); 48px is de gemeten hoogte bij de standaard btnSize/padding van de
   plugin. .merk-logo staat op dezelfde hoogte, links uitgelijnd, vóór de
   plugin-knoppen (die met menuAlignHorizontal beginnen na deze breedte). */
.merk-logo{
	position: fixed;
	left: 16px; bottom: 0;
	height: 48px;
	display: flex; align-items: center;
	z-index: 2147483000; /* onder de flipbook-overlay (2147483646), boven de balk */
	opacity: .85;
	transition: opacity .2s ease-out;
	text-decoration: none; /* anders erft het <a>-element de standaard onderstreping */
}
.merk-logo:hover{opacity: 1}

.merk-logo__copyright{
	font-family: "SG Grotesk", Arial, sans-serif;
	font-weight: 300;
	font-size: 15px;
	line-height: 1;
	color: var(--rust, #b84626);
	margin-right: -3px; /* gap ondersteunt geen negatieve waarden, dus via marge */
}

/* Woordmerk is een zwart PNG; hier omgekleurd naar roest via een CSS-mask
   i.p.v. een los, apart gekleurd bestand te maken. */
.merk-logo__mark{
	display: block;
	width: 62px;
	height: 27px; /* 674:294 beeldverhouding van het originele PNG */
	background-color: var(--rust, #b84626);
	-webkit-mask-image: url("../../assets/img/trichis-logo.png");
	mask-image: url("../../assets/img/trichis-logo.png");
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: left center;
	mask-position: left center;
}

/* --------------------------------------------------------- balken (boven/onder) beige i.p.v. wit */
/* .flipbook-bg-light is de plugin's standaard "light"-thema-achtergrond,
   gedeeld door de onder- en bovenbalk (en eventuele zijpanelen). */
.flipbook-bg-light{
	background: var(--cream, #f0ece1) !important;
}

/* --------------------------------------------------------- accentkleur op de bediening */
.flipbook-menu-btn,
.flipbook-left-arrow,
.flipbook-right-arrow,
.flipbook-first-arrow,
.flipbook-last-arrow,
.flipbook-currentPageNumber,
.flipbook-totalPages{
	color: var(--rust, #b84626) !important;
}
.flipbook-menu-btn:hover,
.flipbook-left-arrow:hover,
.flipbook-right-arrow:hover,
.flipbook-first-arrow:hover,
.flipbook-last-arrow:hover{
	color: var(--ink-deep, #161817) !important;
}