/* ttz FTP-Downloads – Frontend */
.ttzfd {
	--ttzfd-accent: #1b6ac9;
	--ttzfd-text: #1d232b;
	--ttzfd-muted: #67717d;
	--ttzfd-line: #e2e6eb;
	--ttzfd-soft: #f5f7f9;
	--ttzfd-radius: 10px;
	color: var(--ttzfd-text);
	font-size: 16px;
	line-height: 1.5;
	max-width: 1100px;
	margin: 0 auto;
	scroll-margin-top: 120px;
}
.ttzfd *, .ttzfd *::before, .ttzfd *::after { box-sizing: border-box; }
.ttzfd p { margin: 0 0 .75em; padding: 0; }
.ttzfd a { color: var(--ttzfd-accent); }

/* Hinweise */
.ttzfd-alert, .ttzfd-notice {
	border: 1px solid var(--ttzfd-line);
	border-left: 4px solid var(--ttzfd-accent);
	background: var(--ttzfd-soft);
	border-radius: 6px;
	padding: 14px 18px;
	margin: 0 0 20px;
}
.ttzfd-alert p:last-child, .ttzfd-notice p:last-child { margin-bottom: 0; }
.ttzfd-alert ul { margin: 0; padding-left: 1.1em; }
.ttzfd-alert--error { border-left-color: #c62828; background: #fdf3f3; }
.ttzfd-alert--success { border-left-color: #2e7d32; background: #f2f9f2; }

/* Anmeldung / Registrierung */
.ttzfd-auth { max-width: 640px; margin: 0 auto; }
.ttzfd-intro { margin-bottom: 20px; color: var(--ttzfd-muted); }
.ttzfd-card {
	border: 1px solid var(--ttzfd-line);
	border-radius: var(--ttzfd-radius);
	background: #fff;
	box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 8px 24px rgba(0,0,0,.04);
	overflow: hidden;
}
.ttzfd-tabs { display: flex; border-bottom: 1px solid var(--ttzfd-line); }
.ttzfd .ttzfd-tab {
	flex: 1;
	appearance: none;
	background: var(--ttzfd-soft);
	border: 0;
	border-bottom: 2px solid transparent;
	border-radius: 0;
	margin: 0;
	padding: 14px 16px;
	font: inherit;
	font-weight: 600;
	color: var(--ttzfd-muted);
	cursor: pointer;
	box-shadow: none;
	line-height: 1.3;
}
.ttzfd .ttzfd-tab.is-active { background: #fff; color: var(--ttzfd-text); border-bottom-color: var(--ttzfd-accent); }
.ttzfd .ttzfd-tab:focus-visible { outline: 2px solid var(--ttzfd-accent); outline-offset: -2px; }
.ttzfd-panel { padding: 24px 28px 28px; }
.ttzfd-hint { color: var(--ttzfd-muted); font-size: .94em; }

.ttzfd-form .ttzfd-field { margin: 0 0 14px; }
.ttzfd-grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 16px; }
.ttzfd-grid > .is-full, .ttzfd-grid > input[type=hidden] + .is-full { grid-column: 1 / -1; }
.ttzfd-grid > .ttzfd-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ttzfd-form label { display: block; font-weight: 600; font-size: .9em; margin-bottom: 5px; }
.ttzfd-opt { font-weight: 400; color: var(--ttzfd-muted); }
#ttzfd .ttzfd-form input[type=text],
#ttzfd .ttzfd-form input[type=email],
#ttzfd .ttzfd-form input[type=tel],
#ttzfd .ttzfd-form input[type=password],
#ttzfd .ttzfd-form select {
	width: 100% !important;
	height: 46px !important;
	padding: 0 12px !important;
	margin: 0 !important;
	border: 1px solid #cfd5dc !important;
	border-radius: 6px !important;
	background: #fff !important;
	color: var(--ttzfd-text) !important;
	font: inherit;
	font-size: 16px !important;
	line-height: 44px !important;
	box-shadow: none !important;
}
#ttzfd .ttzfd-form input:focus, #ttzfd .ttzfd-form select:focus {
	border-color: var(--ttzfd-accent) !important;
	outline: 2px solid color-mix(in srgb, var(--ttzfd-accent) 25%, transparent);
	outline-offset: 0;
}
#ttzfd .ttzfd-check label { display: flex; gap: 10px; align-items: flex-start; font-weight: 400 !important; font-size: .94em; text-transform: none; }
.ttzfd-check input { margin-top: 4px; flex: none; width: 16px; height: 16px; }
.ttzfd-actions { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-top: 6px !important; }
.ttzfd-req { color: var(--ttzfd-muted); font-size: .85em; }
.ttzfd-link { font-size: .94em; }

/* Salient: Fancy-Select (select2) angleichen */
#ttzfd .fancy-select-wrap { padding-top: 0 !important; }
#ttzfd .fancy-select-wrap label { display: block; position: static !important; font-size: .9em !important; font-weight: 600 !important; line-height: 1.5 !important; color: inherit !important; text-transform: none !important; letter-spacing: 0 !important; margin: 0 0 5px !important; opacity: 1 !important; transform: none !important; }
#ttzfd .select2-container { width: 100% !important; }
#ttzfd .select2-container .select2-selection--single { height: 46px !important; border: 1px solid #cfd5dc !important; border-radius: 6px !important; background: #fff !important; box-shadow: none !important; }
#ttzfd .select2-container .select2-selection__rendered { line-height: 44px !important; padding-left: 12px !important; color: var(--ttzfd-text) !important; font-size: 16px !important; }
#ttzfd .select2-container .select2-selection__arrow { height: 44px !important; }

/* Buttons */
.ttzfd .ttzfd-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	border: 1px solid var(--ttzfd-accent);
	border-radius: 6px;
	padding: 10px 20px;
	font: inherit;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	text-decoration: none;
	text-transform: none !important;
	letter-spacing: 0 !important;
	transition: background-color .15s, color .15s;
}
.ttzfd .ttzfd-btn--primary { background: var(--ttzfd-accent); color: #fff; }
.ttzfd .ttzfd-btn--primary:hover { filter: brightness(.92); }
.ttzfd .ttzfd-btn--dl { background: #fff; color: var(--ttzfd-accent); padding: 7px 14px; font-size: .9em; white-space: nowrap; }
.ttzfd .ttzfd-btn--dl:hover, .ttzfd .ttzfd-btn--dl:focus-visible { background: var(--ttzfd-accent); color: #fff; }

/* Leiste */
.ttzfd-bar { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 8px; }
.ttzfd-search { position: relative; flex: 1 1 320px; max-width: 520px; }
.ttzfd-search svg { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--ttzfd-muted); pointer-events: none; }
#ttzfd .ttzfd-search input {
	width: 100% !important;
	height: 48px !important;
	margin: 0 !important;
	padding: 0 16px 0 44px !important;
	border: 1px solid #cfd5dc !important;
	border-radius: 24px !important;
	background: #fff !important;
	font: inherit;
	font-size: 16px !important;
	line-height: 46px !important;
	color: var(--ttzfd-text) !important;
	box-shadow: none !important;
}
#ttzfd .ttzfd-search input:focus { border-color: var(--ttzfd-accent) !important; outline: 2px solid color-mix(in srgb, var(--ttzfd-accent) 25%, transparent); }
.ttzfd-search svg { z-index: 1; }
.ttzfd-user { font-size: .9em; color: var(--ttzfd-muted); }
.ttzfd-result { min-height: 1.5em; font-size: .9em; color: var(--ttzfd-muted); margin: 0 0 8px !important; }
.ttzfd-noresult { padding: 24px; text-align: center; color: var(--ttzfd-muted); background: var(--ttzfd-soft); border-radius: var(--ttzfd-radius); }

/* Bereiche */
.ttzfd-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 4px; }
#ttzfd .ttzfd-chip {
	appearance: none;
	margin: 0;
	padding: 7px 16px;
	border: 1px solid #cfd5dc;
	border-radius: 20px;
	background: #fff;
	color: var(--ttzfd-text);
	font: inherit;
	font-size: .9em;
	font-weight: 600;
	line-height: 1.3;
	text-transform: none;
	letter-spacing: 0;
	cursor: pointer;
	box-shadow: none;
}
#ttzfd .ttzfd-chip:hover { border-color: var(--ttzfd-accent); }
#ttzfd .ttzfd-chip.is-active { background: var(--ttzfd-accent); border-color: var(--ttzfd-accent); color: #fff; }
#ttzfd .ttzfd-chip:focus-visible { outline: 2px solid var(--ttzfd-accent); outline-offset: 2px; }
.ttzfd-section { margin: 0 0 48px; }
.ttzfd .ttzfd-section__title { font-size: 1.7em; line-height: 1.25; margin: 0 0 20px; }
.ttzfd-section .ttzfd-cat { margin-bottom: 28px; }

/* Kategorien und Produkte */
.ttzfd-cat { margin: 0 0 36px; }
.ttzfd .ttzfd-cat__title {
	font-size: 1.35em;
	line-height: 1.3;
	margin: 0 0 12px;
	padding: 0 0 10px;
	border-bottom: 2px solid var(--ttzfd-text);
}
.ttzfd-products { border: 1px solid var(--ttzfd-line); border-radius: var(--ttzfd-radius); background: #fff; overflow: hidden; }
.ttzfd-prod + .ttzfd-prod { border-top: 1px solid var(--ttzfd-line); }
.ttzfd-prod > summary {
	display: flex;
	align-items: center;
	gap: 12px 20px;
	padding: 16px 20px;
	cursor: pointer;
	list-style: none;
	flex-wrap: wrap;
}
.ttzfd-prod > summary::-webkit-details-marker, .ttzfd-archive > summary::-webkit-details-marker { display: none; }
.ttzfd-prod > summary:hover { background: var(--ttzfd-soft); }
.ttzfd-prod > summary:focus-visible { outline: 2px solid var(--ttzfd-accent); outline-offset: -2px; }
.ttzfd-prod__name { font-weight: 600; flex: 1 1 240px; }
.ttzfd-prod__meta { font-size: .85em; color: var(--ttzfd-muted); }
.ttzfd-chev { flex: none; color: var(--ttzfd-muted); transition: transform .2s; }
.ttzfd-prod[open] > summary { background: var(--ttzfd-soft); }
.ttzfd-prod[open] > summary .ttzfd-chev { transform: rotate(180deg); }
.ttzfd-prod__body { padding: 4px 20px 16px; background: var(--ttzfd-soft); }
.ttzfd-empty { color: var(--ttzfd-muted); font-size: .9em; padding: 8px 0; }

/* Dateiliste */
.ttzfd .ttzfd-files { list-style: none; margin: 0; padding: 0; }
.ttzfd .ttzfd-file {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 0 0 6px;
	padding: 10px 12px;
	background: #fff;
	border: 1px solid var(--ttzfd-line);
	border-radius: 8px;
	list-style: none;
}
.ttzfd-file__main { flex: 1; min-width: 0; }
.ttzfd-file__name { font-weight: 500; overflow-wrap: anywhere; }
.ttzfd-file__meta { display: block; font-size: .82em; color: var(--ttzfd-muted); }
.ttzfd-type {
	flex: none;
	width: 44px;
	height: 44px;
	display: grid;
	place-items: center;
	border-radius: 6px;
	font-size: .68em;
	font-weight: 700;
	letter-spacing: .03em;
	color: #fff;
	background: #78838f;
}
.ttzfd-type--pdf { background: #c62828; }
.ttzfd-type--zip { background: #6d4c41; }
.ttzfd-type--img { background: #2e7d32; }
.ttzfd-type--video { background: #6a1b9a; }
.ttzfd-type--doc { background: #1565c0; }
.ttzfd-type--sheet { background: #1b7f4b; }
.ttzfd-type--slide { background: #d84315; }
.ttzfd-type--cad { background: #37474f; }

/* Archiv */
.ttzfd-archive { margin-top: 10px; }
.ttzfd-archive > summary {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	cursor: pointer;
	list-style: none;
	font-size: .9em;
	font-weight: 600;
	color: var(--ttzfd-muted);
	padding: 6px 0;
}
.ttzfd-archive > summary::before { content: ''; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(-45deg); transition: transform .2s; }
.ttzfd-archive[open] > summary::before { transform: rotate(45deg); }
.ttzfd-count { font-weight: 400; background: var(--ttzfd-line); border-radius: 10px; padding: 0 8px; font-size: .9em; }
.ttzfd .ttzfd-files.is-archive { margin-top: 6px; opacity: .85; }

.is-hidden { display: none !important; }

@media (max-width: 640px) {
	.ttzfd-grid { grid-template-columns: 1fr; }
	.ttzfd-panel { padding: 20px 18px; }
	.ttzfd-prod > summary { padding: 14px 16px; }
	.ttzfd-prod__body { padding: 4px 12px 12px; }
	.ttzfd .ttzfd-file { flex-wrap: wrap; gap: 10px 12px; }
	.ttzfd-type { width: 38px; height: 38px; }
	.ttzfd .ttzfd-btn--dl { margin-left: 50px; }
	.ttzfd-user { width: 100%; }
}
.ttzfd-section .ttzfd-cat__title { font-size: 1.15em !important; border-bottom-width: 1px !important; }
#ttzfd .ttzfd-section__title, #ttzfd .ttzfd-cat__title { text-transform: none !important; letter-spacing: 0 !important; font-weight: 700 !important; color: var(--ttzfd-text); }
#ttzfd .ttzfd-section__title { font-size: 28px !important; line-height: 1.25 !important; margin: 24px 0 18px !important; }
#ttzfd .ttzfd-cat__title { font-size: 20px !important; line-height: 1.3 !important; }
