/* =========================
   Light Mode
========================= */

:root {
	--primary: #E0C9A0;
	--secondary: #6E9081;

	--company-text: #262626;
	--company-muted-text: #777777;

	--company-card-bg: rgba(237, 237, 237, 0.18);
	--company-card-hover-bg: rgba(224, 201, 160, 0.15);

	--company-border: rgba(224, 201, 160, 0.45);
	--company-border-hover: rgba(224, 201, 160, 0.75);

	--company-btn-bg: rgba(224, 201, 160, 0.20);
	--company-btn-hover-bg: rgba(110, 144, 129, 0.30);
	--company-btn-active-bg: rgba(110, 144, 129, 0.38);

	--company-shadow: rgba(38, 38, 38, 0.08);
	--company-shadow-hover: rgba(38, 38, 38, 0.12);
}

.text-primary {
	color: #E0C9A0 !important;
}

.text-secondary {
	color: #6E9081 !important;
}

.bg-primary {
	background-color: #E0C9A0 !important;
}

.bg-secondary {
	background-color: #6E9081 !important;
}

.border-primary {
	border-color: #E0C9A0 !important;
}

.border-secondary {
	border-color: #6E9081 !important;
}

.btn-primary {
	color: #262626 !important;
	background-color: #E0C9A0 !important;
	border-color: #E0C9A0 !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
	color: #262626 !important;
	background-color: #d5b980 !important;
	border-color: #d5b980 !important;
}

.btn-secondary {
	color: #fff !important;
	background-color: #6E9081 !important;
	border-color: #6E9081 !important;
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active {
	color: #fff !important;
	background-color: #587568 !important;
	border-color: #587568 !important;
}

.btn-outline-primary {
	color: #b49358 !important;
	border-color: #E0C9A0 !important;
}

.btn-outline-primary:hover {
	color: #262626 !important;
	background-color: #E0C9A0 !important;
	border-color: #E0C9A0 !important;
}

.btn-outline-secondary {
	color: #6E9081 !important;
	border-color: #6E9081 !important;
}

.btn-outline-secondary:hover {
	color: #fff !important;
	background-color: #6E9081 !important;
	border-color: #6E9081 !important;
}

/* =========================
   Dark Mode
========================= */

[data-theme="dark"],
.dark,
body.dark {
	--company-text: #ededed;
	--company-muted-text: #b5b5b5;

	--company-card-bg: rgba(38, 38, 38, 0.72);
	--company-card-hover-bg: rgba(110, 144, 129, 0.16);

	--company-border: rgba(224, 201, 160, 0.30);
	--company-border-hover: rgba(224, 201, 160, 0.55);

	--company-btn-bg: rgba(237, 237, 237, 0.08);
	--company-btn-hover-bg: rgba(110, 144, 129, 0.28);
	--company-btn-active-bg: rgba(110, 144, 129, 0.38);

	--company-shadow: rgba(0, 0, 0, 0.30);
	--company-shadow-hover: rgba(0, 0, 0, 0.45);
}


/* =========================
   PDF / Iframe
========================= */

.hidden {
	height: 0;
	overflow: hidden;
	transition: height 0.5s linear;
}

.i-frame {
	height: 100%;
}


/* =========================
   Cards
========================= */

.transparent-card {
	background: var(--company-card-bg);
	color: var(--company-text);

	backdrop-filter: blur(16px) saturate(150%);
	-webkit-backdrop-filter: blur(16px) saturate(150%);

	border: 1px solid var(--company-border);
	border-radius: 18px;

	box-shadow:
		0 8px 24px var(--company-shadow),
		inset 0 0 1px rgba(255, 255, 255, 0.15),
		0 0 24px rgba(224, 201, 160, 0.12);

	transition:
		background-color 0.25s ease,
		border-color 0.25s ease,
		box-shadow 0.25s ease;
}

.transparent-card:hover {
	background: var(--company-card-hover-bg);
	border-color: var(--company-border-hover);

	box-shadow:
		0 10px 32px var(--company-shadow-hover),
		0 0 22px rgba(110, 144, 129, 0.20);
}


/* Texte innerhalb der Cards */

.transparent-card h1,
.transparent-card h2,
.transparent-card h3,
.transparent-card h4,
.transparent-card h5,
.transparent-card h6,
.transparent-card p,
.transparent-card div,
.transparent-card span,
.transparent-card td,
.transparent-card th {
	color: inherit;
}


/* =========================
   Buttons
========================= */

.transparent-btn {
	background: var(--company-btn-bg);
	border: 1px solid var(--company-border);
	color: var(--company-text);

	backdrop-filter: blur(14px) saturate(150%);
	-webkit-backdrop-filter: blur(14px) saturate(150%);

	border-radius: 12px;

	width: 4vh;
	height: 4vh;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	transition:
		background-color 0.25s ease,
		border-color 0.25s ease,
		box-shadow 0.25s ease;
}

.transparent-btn:hover {
	background: var(--company-btn-hover-bg);
	border-color: #6e9081;
	color: var(--company-text);

	box-shadow:
		0 8px 28px var(--company-shadow-hover),
		0 0 18px rgba(110, 144, 129, 0.18);
}

.transparent-btn:focus {
	color: var(--company-text);
	box-shadow: 0 0 0 0.2rem rgba(110, 144, 129, 0.25);
}

.transparent-btn:active {
	background: var(--company-btn-active-bg);
	color: var(--company-text);
}

.transparent-btn svg {
	color: currentColor;
	stroke: currentColor;
}


/* =========================
   Accordion
========================= */

.company-accordion-card {
	background: var(--company-card-bg);
	color: var(--company-text);

	border: 1px solid var(--company-border);
	border-radius: 14px;

	overflow: hidden;
}

.company-accordion-card .card-header {
	background: rgba(224, 201, 160, 0.08);
	border-bottom: 1px solid var(--company-border);
}

.company-accordion-card .card-body {
	background: transparent;
	color: var(--company-text);
}

.company-accordion-card .btn-link {
	color: var(--company-text);
	text-decoration: none;
}

.company-accordion-card .btn-link:hover,
.company-accordion-card .btn-link:focus {
	color: #6e9081;
	text-decoration: none;
	box-shadow: none;
}


/* =========================
   Tabellen
========================= */

.transparent-card .table,
.company-accordion-card .table {
	color: var(--company-text);
	background: transparent;
}

.transparent-card .table td,
.transparent-card .table th,
.company-accordion-card .table td,
.company-accordion-card .table th {
	color: var(--company-text);
	background: transparent;
	border-color: rgba(127, 127, 127, 0.25);
}

.text-muted {
	color: var(--company-muted-text) !important;
}