/* Ordner-Downloads – Themes und Darstellungs-Regler. Lädt nach front.css; alle Regeln sind unter .odl--theme-<name> gescoped,
 * sodass mehrere Themes auf einer Seite möglich sind. Keine eigenen Schriften (die Schrift der Website bleibt), keine externen Ressourcen.
 * Ein Theme setzt zuerst Variablen (siehe STYLING.md) und dann einige Strukturregeln. Der Standard („default“) hat hier keine Regeln. */

/* ================================================================== Nordlicht (dicht, sachlich) */
.odl--theme-nordlicht {
	--odl-accent: #0969da;
	--odl-radius: 6px; --odl-radius-md: 6px; --odl-radius-sm: 2px; --odl-radius-pill: 2em;
	--odl-border: color-mix(in srgb, currentColor 16%, transparent);
	--odl-bg: transparent;
	--odl-bg-soft: color-mix(in srgb, currentColor 4%, transparent);
	--odl-muted: color-mix(in srgb, currentColor 66%, transparent);
	--odl-shadow-hover: none;
	--odl-ease: .1s;
	--odl-d: .85;
	--odl-font-size: .875rem; --odl-line: 1.5;
}
/* Liste: ein Kasten, Zeilen durch Trennlinien getrennt */
.odl--theme-nordlicht .odl-files { gap: 0; border: 1px solid var(--odl-border); border-radius: var(--odl-radius); overflow: hidden; }
.odl--theme-nordlicht .odl-file__link { gap: .75rem; padding: calc(.55rem * var(--odl-d)) 1rem; background: transparent; border: 0; border-radius: 0; box-shadow: none; }
.odl--theme-nordlicht .odl-file + .odl-file .odl-file__link { border-top: 1px solid var(--odl-border); }
.odl--theme-nordlicht .odl-file__link:hover, .odl--theme-nordlicht .odl-file__link:focus-visible { background: var(--odl-bg-soft); border-color: var(--odl-border); }
.odl--theme-nordlicht .odl-file__link:focus-visible { outline-offset: -2px; }
.odl--theme-nordlicht .odl-file__title { font-weight: 600; }
.odl--theme-nordlicht .odl-ico, .odl--theme-nordlicht .odl-ico svg { width: 30px; height: 36px; }
.odl--theme-nordlicht .odl-ico b { left: 3px; right: 3px; bottom: 7px; font-size: 8px; }
.odl--theme-nordlicht .odl-ico { --ico: var(--odl-muted); --ico-bg: transparent; --ico-on: color-mix(in srgb, currentColor 82%, transparent); }
.odl--theme-nordlicht .odl-file__dl { gap: .35rem; padding: .2rem .6rem; font-size: .85em; font-weight: 500; color: inherit; background: transparent; border: 1px solid var(--odl-border); border-radius: var(--odl-radius); }
.odl--theme-nordlicht .odl-file__link:hover .odl-file__dl, .odl--theme-nordlicht .odl-file__link:focus-visible .odl-file__dl { color: inherit; background: var(--odl-bg-soft); }
.odl--theme-nordlicht .odl-new { padding: 0 .5em; font-size: .7em; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--odl-accent-text); background: transparent; border: 1px solid color-mix(in srgb, var(--odl-accent) 45%, transparent); }
.odl--theme-nordlicht .odl-count, .odl--theme-nordlicht .odl-t-count { font-weight: 500; background: var(--odl-bg-soft); border-color: transparent; }
/* Kacheln: wieder einzelne Karten */
.odl--theme-nordlicht.odl--cards .odl-files { gap: .75rem; border: 0; border-radius: 0; overflow: visible; }
.odl--theme-nordlicht.odl--cards .odl-file__link, .odl--theme-nordlicht.odl--cards .odl-file + .odl-file .odl-file__link { border: 1px solid var(--odl-border); border-radius: var(--odl-radius); }
/* Schaltflächen */
.odl--theme-nordlicht .odl-btn--primary { background: #1f883d; border-color: rgba(31, 35, 40, .15); color: #fff; }
.odl--theme-nordlicht .odl-zip { color: inherit; font-weight: 500; background: var(--odl-bg-soft); border-color: var(--odl-border); }
.odl--theme-nordlicht .odl-zip:hover, .odl--theme-nordlicht .odl-zip:focus-visible { color: inherit; background: color-mix(in srgb, currentColor 9%, transparent); }
.odl--theme-nordlicht .odl-toggle { font-weight: 500; background: var(--odl-bg-soft); }
.odl--theme-nordlicht .odl-toggle:hover { color: inherit; border-color: var(--odl-border); background: color-mix(in srgb, currentColor 9%, transparent); }
/* Ordner: Kasten mit Kopfzeile */
.odl--theme-nordlicht .odl-folder { background: transparent; }
.odl--theme-nordlicht .odl-folder > summary { padding: calc(.6rem * var(--odl-d)) 1rem; background: var(--odl-bg-soft); border-radius: var(--odl-radius) var(--odl-radius) 0 0; }
.odl--theme-nordlicht .odl-folder:not([open]) > summary { border-radius: var(--odl-radius); }
.odl--theme-nordlicht .odl-folder__body { padding: .75rem; }
/* Baum */
.odl--theme-nordlicht .odl-t-nav { background: transparent; }
.odl--theme-nordlicht .odl-t-link:hover { background: var(--odl-bg-soft); }
.odl--theme-nordlicht .odl-t-link.is-selected { color: inherit; font-weight: 600; background: color-mix(in srgb, var(--odl-accent) 16%, transparent); }
.odl--theme-nordlicht .odl-t-chip { background: transparent; }

/* ================================================================== Fjord (kompakt, Arbeitsfläche) */
.odl--theme-fjord {
	--odl-accent: #0f6cbd;
	--odl-radius: 4px; --odl-radius-md: 4px; --odl-radius-sm: 2px; --odl-radius-pill: 4px;
	--odl-border: color-mix(in srgb, currentColor 14%, transparent);
	--odl-bg: transparent;
	--odl-bg-soft: color-mix(in srgb, currentColor 5%, transparent);
	--odl-muted: color-mix(in srgb, currentColor 66%, transparent);
	--odl-shadow-hover: 0 2px 4px rgba(0, 0, 0, .14), 0 0 2px rgba(0, 0, 0, .12);
	--odl-ease: .1s;
	--odl-d: .9;
	--odl-font-size: .9rem; --odl-line: 1.45;
}
/* Liste: Zeilen mit feiner Linie darunter, Hover-Fläche */
.odl--theme-fjord .odl-files { gap: 0; }
.odl--theme-fjord .odl-file__link { gap: .8rem; padding: calc(.5rem * var(--odl-d)) .75rem; background: transparent; border: 0; border-bottom: 1px solid var(--odl-border); border-radius: 0; box-shadow: none; }
.odl--theme-fjord .odl-file__link:hover, .odl--theme-fjord .odl-file__link:focus-visible { background: var(--odl-bg-soft); border-bottom-color: var(--odl-border); }
.odl--theme-fjord .odl-file__link:focus-visible { outline-offset: -2px; }
.odl--theme-fjord .odl-file__title { font-weight: 600; }
.odl--theme-fjord .odl-ico, .odl--theme-fjord .odl-ico svg { width: 32px; height: 38px; }
.odl--theme-fjord .odl-ico b { left: 3px; right: 3px; bottom: 7px; font-size: 8.5px; }
.odl--theme-fjord .odl-file__dl { padding: .2rem .5rem; font-weight: 600; color: var(--odl-accent-text); background: transparent; border-radius: var(--odl-radius); }
.odl--theme-fjord .odl-file__link:hover .odl-file__dl, .odl--theme-fjord .odl-file__link:focus-visible .odl-file__dl { color: var(--odl-accent-text); background: var(--odl-accent-tint); }
.odl--theme-fjord .odl-new { padding: .05em .45em; font-size: .68em; letter-spacing: .02em; border-radius: var(--odl-radius-sm); }
.odl--theme-fjord .odl-count, .odl--theme-fjord .odl-t-count { color: var(--odl-muted); background: transparent; border-color: transparent; font-weight: 400; }
/* Kacheln: Karten mit sanftem Schatten */
.odl--theme-fjord.odl--cards .odl-files { gap: .75rem; }
.odl--theme-fjord.odl--cards .odl-file__link { background: var(--odl-bg-soft); border: 1px solid var(--odl-border); border-radius: calc(var(--odl-radius) * 2); box-shadow: 0 1px 2px rgba(0, 0, 0, .08); }
.odl--theme-fjord.odl--cards .odl-file__link:hover, .odl--theme-fjord.odl--cards .odl-file__link:focus-visible { border-color: var(--odl-border); box-shadow: var(--odl-shadow-hover); }
/* Befehlsleiste */
.odl--theme-fjord .odl-tools { padding-bottom: .5rem; border-bottom: 1px solid var(--odl-border); }
.odl--theme-fjord .odl-zip, .odl--theme-fjord .odl-toggle { color: inherit; background: transparent; border-color: transparent; font-weight: 600; }
.odl--theme-fjord .odl-zip:hover, .odl--theme-fjord .odl-zip:focus-visible, .odl--theme-fjord .odl-toggle:hover { color: inherit; background: var(--odl-bg-soft); border-color: transparent; }
/* Ordner: Abschnittsüberschriften */
.odl--theme-fjord .odl-folder { margin: 0; background: transparent; border: 0; border-bottom: 1px solid var(--odl-border); border-radius: 0; }
.odl--theme-fjord .odl-folder > summary { padding: calc(.6rem * var(--odl-d)) .5rem; }
.odl--theme-fjord .odl-folder > summary:hover { background: var(--odl-bg-soft); }
.odl--theme-fjord .odl-folder__body, .odl--theme-fjord .odl-folder__body .odl-folder { padding: 0 0 .25rem 1rem; background: transparent; }
/* Baum: Auswahlbalken */
.odl--theme-fjord .odl-t-nav { background: var(--odl-bg-soft); border-color: transparent; }
.odl--theme-fjord .odl-t-link:hover { background: color-mix(in srgb, currentColor 7%, transparent); }
.odl--theme-fjord .odl-t-link.is-selected { color: inherit; font-weight: 600; background: color-mix(in srgb, var(--odl-accent) 16%, transparent); }

/* ================================================================== Nebel (ruhig, ohne Rahmen) */
.odl--theme-nebel {
	--odl-accent: #5e6ad2;
	--odl-radius: 6px; --odl-radius-md: 6px; --odl-radius-sm: 3px;
	--odl-border: color-mix(in srgb, currentColor 9%, transparent);
	--odl-bg: transparent;
	--odl-bg-soft: color-mix(in srgb, currentColor 4%, transparent);
	--odl-muted: color-mix(in srgb, currentColor 66%, transparent);
	--odl-shadow-hover: none;
	--odl-ease: .12s;
	--odl-d: 1.1;
}
/* Liste: keine Rahmen, Hover-Fläche */
.odl--theme-nebel .odl-files { gap: .1rem; }
.odl--theme-nebel .odl-file__link { background: transparent; border-color: transparent; box-shadow: none; }
.odl--theme-nebel .odl-file__link:hover, .odl--theme-nebel .odl-file__link:focus-visible { background: var(--odl-bg-soft); border-color: transparent; }
.odl--theme-nebel .odl-file__title { font-weight: 500; }
.odl--theme-nebel .odl-ico, .odl--theme-nebel .odl-ico svg { width: 28px; height: 34px; }
.odl--theme-nebel .odl-ico b { left: 3px; right: 3px; bottom: 6px; font-size: 7.5px; }
.odl--theme-nebel .odl-ico { --ico: var(--odl-muted); --ico-bg: transparent; --ico-on: color-mix(in srgb, currentColor 82%, transparent); }
/* Download-Schaltfläche erscheint beim Darüberfahren (Touch: immer sichtbar) */
.odl--theme-nebel .odl-file__dl { color: var(--odl-accent-text); background: transparent; padding: .3rem .5rem; }
.odl--theme-nebel .odl-file__link:hover .odl-file__dl, .odl--theme-nebel .odl-file__link:focus-visible .odl-file__dl { color: var(--odl-accent-text); background: var(--odl-accent-soft); }
@media (hover: hover) {
	.odl--theme-nebel:not(.odl--cards) .odl-file__dl { opacity: 0; transition: opacity var(--odl-ease); }
	.odl--theme-nebel:not(.odl--cards) .odl-file__link:hover .odl-file__dl, .odl--theme-nebel:not(.odl--cards) .odl-file__link:focus-visible .odl-file__dl { opacity: 1; }
}
.odl--theme-nebel .odl-new { padding: 0; font-size: .68em; letter-spacing: .06em; color: var(--odl-accent-text); background: transparent; }
.odl--theme-nebel .odl-count, .odl--theme-nebel .odl-t-count { color: var(--odl-muted); background: transparent; border-color: transparent; font-weight: 400; }
/* Kacheln: ruhige Flächen */
.odl--theme-nebel.odl--cards .odl-files { gap: .75rem; }
.odl--theme-nebel.odl--cards .odl-file__link { background: var(--odl-bg-soft); }
.odl--theme-nebel.odl--cards .odl-file__link:hover { background: color-mix(in srgb, currentColor 7%, transparent); }
/* Felder und Schaltflächen */
.odl--theme-nebel .odl-field, .odl--theme-nebel .odl-search, .odl--theme-nebel .odl-q, .odl--theme-nebel .odl-type, .odl--theme-nebel .odl-sort, .odl--theme-nebel .odl-unlock__pw { background: var(--odl-bg-soft); border-color: transparent; }
.odl--theme-nebel .odl-zip, .odl--theme-nebel .odl-toggle { color: inherit; background: var(--odl-bg-soft); border-color: transparent; }
.odl--theme-nebel .odl-zip:hover, .odl--theme-nebel .odl-zip:focus-visible, .odl--theme-nebel .odl-toggle:hover { color: inherit; background: color-mix(in srgb, currentColor 8%, transparent); border-color: transparent; }
/* Ordner: Überschriften ohne Kasten */
.odl--theme-nebel .odl-folder { margin: 0 0 .25rem; background: transparent; border: 0; }
.odl--theme-nebel .odl-folder > summary { padding: .5rem .5rem; border-radius: var(--odl-radius); }
.odl--theme-nebel .odl-folder > summary:hover { background: var(--odl-bg-soft); }
.odl--theme-nebel .odl-folder__body, .odl--theme-nebel .odl-folder__body .odl-folder { padding: 0 0 .25rem 1.1rem; background: transparent; }
/* Baum */
.odl--theme-nebel .odl-t-nav { padding: 0; background: transparent; border: 0; }
.odl--theme-nebel .odl-t-link:hover { background: var(--odl-bg-soft); }
.odl--theme-nebel .odl-t-link.is-selected { color: inherit; font-weight: 500; background: color-mix(in srgb, currentColor 9%, transparent); }
.odl--theme-nebel .odl-t-chip { background: var(--odl-bg-soft); border-color: transparent; }

/* ================================================================== Kristall (helle Galerie, weiche Karten) */
.odl--theme-kristall {
	--odl-accent: #0071e3;
	--odl-accent-text: color-mix(in srgb, #0066cc 72%, currentColor); /* auf hellem Grund ein dunkleres Blau, auf dunklem ein helleres */
	--odl-radius: 28px; --odl-radius-md: 18px; --odl-radius-sm: 8px; --odl-radius-pill: 9999px;
	--odl-border: color-mix(in srgb, currentColor 14%, transparent);
	--odl-bg: transparent;
	--odl-bg-soft: color-mix(in srgb, currentColor 5%, transparent);
	--odl-muted: color-mix(in srgb, currentColor 66%, transparent);
	--odl-shadow-hover: none;
	--odl-ease: .2s;
	--odl-d: 1.15;
	--odl-field-line: color-mix(in srgb, currentColor 52%, transparent);
}
.odl--theme-kristall .odl-title { font-size: 1.5em; font-weight: 600; letter-spacing: -.02em; }
/* Liste und Kacheln: weiche Flächen ohne Rahmen und Schatten */
.odl--theme-kristall .odl-files { gap: .6rem; }
.odl--theme-kristall .odl-file__link { padding: calc(.85rem * var(--odl-d)) 1.3rem; background: var(--odl-bg-soft); border-color: transparent; border-radius: var(--odl-radius-md); box-shadow: none; }
.odl--theme-kristall .odl-file__link:hover, .odl--theme-kristall .odl-file__link:focus-visible { background: color-mix(in srgb, currentColor 8%, transparent); border-color: transparent; box-shadow: none; }
.odl--theme-kristall .odl-file__title { font-weight: 600; letter-spacing: -.01em; }
.odl--theme-kristall.odl--cards .odl-file__link { padding: 1.4rem; border-radius: var(--odl-radius); }
.odl--theme-kristall.odl--cards .odl-file__dl { align-self: flex-start; }
.odl--theme-kristall .odl-file__dl, .odl--theme-kristall .odl-file__link:hover .odl-file__dl, .odl--theme-kristall .odl-file__link:focus-visible .odl-file__dl { padding: .4rem 1.05rem; font-weight: 500; color: var(--odl-accent-contrast); background: var(--odl-accent); border-radius: var(--odl-radius-pill); }
.odl--theme-kristall .odl-file__link:hover .odl-file__dl { filter: brightness(1.08); }
.odl--theme-kristall .odl-file--pw .odl-file__dl { color: inherit; background: color-mix(in srgb, currentColor 10%, transparent); }
/* „Neu“ als schlichter Text ohne Pille */
.odl--theme-kristall .odl-new { padding: 0; font-size: .72em; font-weight: 600; letter-spacing: 0; text-transform: none; color: color-mix(in srgb, #b64400 62%, currentColor); background: transparent; }
.odl--theme-kristall .odl-count, .odl--theme-kristall .odl-t-count { color: var(--odl-muted); background: transparent; border-color: transparent; font-weight: 500; }
/* Felder und Schaltflächen als Pillen */
.odl--theme-kristall .odl-field, .odl--theme-kristall .odl-search, .odl--theme-kristall .odl-q, .odl--theme-kristall .odl-type, .odl--theme-kristall .odl-sort, .odl--theme-kristall .odl-unlock__pw, .odl--theme-kristall .odl-t-filter, .odl--theme-kristall .odl-t-search {
	padding-inline: 1.15rem; background: transparent; border-color: var(--odl-field-line); border-radius: var(--odl-radius-pill);
}
.odl--theme-kristall .odl-btn--primary, .odl--theme-kristall .odl-searchbtn, .odl--theme-kristall .odl-unlock__btn { padding-inline: 1.3rem; font-weight: 500; color: var(--odl-accent-contrast); background: var(--odl-accent); border-color: transparent; border-radius: var(--odl-radius-pill); }
.odl--theme-kristall .odl-zip, .odl--theme-kristall .odl-toggle { padding-inline: 1.2rem; color: inherit; font-weight: 500; background: transparent; border-color: var(--odl-field-line); border-radius: var(--odl-radius-pill); }
.odl--theme-kristall .odl-zip:hover, .odl--theme-kristall .odl-zip:focus-visible, .odl--theme-kristall .odl-toggle:hover { color: inherit; background: var(--odl-bg-soft); border-color: var(--odl-field-line); }
.odl--theme-kristall .odl-views { border-color: var(--odl-field-line); border-radius: var(--odl-radius-pill); }
.odl--theme-kristall .odl-views__btn.is-active { color: var(--odl-accent-text); background: color-mix(in srgb, var(--odl-accent) 14%, transparent); }
/* Ordner: große weiche Karten */
.odl--theme-kristall .odl-folder { margin-bottom: .8rem; background: var(--odl-bg-soft); border-color: transparent; border-radius: var(--odl-radius); }
.odl--theme-kristall .odl-folder > summary { padding: calc(1rem * var(--odl-d)) 1.5rem; }
.odl--theme-kristall .odl-folder__body { padding: 0 1rem .8rem; }
.odl--theme-kristall .odl-folder__body .odl-folder { background: transparent; border-color: var(--odl-border); }
.odl--theme-kristall .odl-folder__body .odl-file__link { background: color-mix(in srgb, currentColor 5%, transparent); }
.odl--theme-kristall .odl-unlock, .odl--theme-kristall .odl-notice, .odl--theme-kristall .odl-empty { border-radius: var(--odl-radius); }
/* Baum */
.odl--theme-kristall .odl-t-nav { padding: .6rem; background: var(--odl-bg-soft); border-color: transparent; }
.odl--theme-kristall .odl-t-link { border-radius: var(--odl-radius-md); }
.odl--theme-kristall .odl-t-link:hover { background: color-mix(in srgb, currentColor 7%, transparent); }
.odl--theme-kristall .odl-t-link.is-selected { color: inherit; font-weight: 600; background: color-mix(in srgb, var(--odl-accent) 16%, transparent); }
.odl--theme-kristall .odl-t-chip { background: var(--odl-bg-soft); border-color: transparent; border-radius: var(--odl-radius-pill); }

/* ================================================================== Prisma (Arbeitsfläche mit Punktraster, Textmarker-Gelb) */
/* Flächen werden aus der Textfarbe abgeleitet: dunkler Text → heller Grund, heller Text → dunkler Grund. Entscheidend ist eine Schwelle (round), keine
   stetige Umkehrung – sonst gäbe mittelgrauer Seitentext (#555/#666) einen grauen statt hellen Grund. Canvas = leicht abgesetzter Grund, Karte = eine Stufe heller.
   Ohne Relative-Color-Syntax (ältere Browser) bleibt der Canvas getönt, die Karten sind transparent und bekommen einen feinen Rand (siehe unten). */
.odl--theme-prisma {
	--odl-accent: #e6e51e;
	--odl-accent-contrast: #000;
	--odl-accent-text: currentColor;
	--odl-accent-soft: color-mix(in srgb, var(--odl-accent) 30%, transparent);
	--odl-accent-tint: color-mix(in srgb, var(--odl-accent) 40%, transparent);
	--odl-radius: 30px; --odl-radius-md: 22px; --odl-radius-sm: 8px; --odl-radius-pill: 3000px;
	--odl-border: color-mix(in srgb, currentColor 14%, transparent);
	--odl-canvas: color-mix(in srgb, currentColor 6%, transparent);
	--odl-card: transparent;
	--odl-dots: radial-gradient(color-mix(in srgb, currentColor 14%, transparent) 1px, transparent 1.3px);
	--odl-focus: currentColor; /* der gelbe Akzent wäre als Fokusring auf hellem Grund unsichtbar */
	--odl-bg: var(--odl-card);
	--odl-bg-soft: var(--odl-canvas);
	--odl-muted: color-mix(in srgb, currentColor 66%, transparent);
	--odl-shadow-hover: none;
	--odl-ease: .15s;
	--odl-d: 1.1;
	--odl-field-line: color-mix(in srgb, currentColor 50%, transparent);
	--odl-red: #d93030;
	padding: 1.25rem; background-color: var(--odl-canvas); border-radius: var(--odl-radius);
	background-image: var(--odl-dots); background-size: 20px 20px;
}
@supports (color: oklch(from red l c h)) {
	/* l der Textfarbe < 0,62 → heller Grund (Canvas 0,96 / Karte 1), sonst dunkler Grund (Canvas 0,2 / Karte 0,26) */
	.odl--theme-prisma {
		--odl-canvas: oklch(from currentColor calc(.96 - .76 * round(nearest, l - .12, 1)) 0 0);
		--odl-card: oklch(from currentColor calc(1 - .74 * round(nearest, l - .12, 1)) 0 0);
	}
}
@supports not (color: oklch(from red l c h)) {
	.odl--theme-prisma .odl-file__link, .odl--theme-prisma .odl-folder, .odl--theme-prisma .odl-t-nav, .odl--theme-prisma .odl-t-chip, .odl--theme-prisma .odl-unlock { border-color: var(--odl-border); }
	.odl--theme-prisma .odl-tools { border: 1px solid var(--odl-border); }
}
/* Mit dem Regler „Immer hell/dunkel“ bekommt der Block eine eigene Fläche; Canvas und Raster bleiben */
.odl--theme-prisma.odl--scheme-light, .odl--theme-prisma.odl--scheme-dark {
	background-color: var(--odl-canvas); padding: 1.25rem;
	background-image: var(--odl-dots); background-size: 20px 20px;
}
@media (max-width: 560px) { .odl--theme-prisma { padding: .75rem; } }
.odl--theme-prisma .odl-title { font-size: 1.6em; font-weight: 700; letter-spacing: -.03em; }
/* Werkzeugleiste: schwebende Karte mit dem einzigen Schatten des Themes */
.odl--theme-prisma .odl-tools { align-items: center; padding: .6rem .75rem; margin-bottom: 1rem; background: var(--odl-card); border-radius: var(--odl-radius); box-shadow: rgba(0, 0, 0, .2) 0 10px 10px -5px; }
/* Liste und Kacheln: weiße Karten, gelber Rahmen beim Darüberfahren */
.odl--theme-prisma .odl-files { gap: .7rem; }
.odl--theme-prisma .odl-file__link { padding: calc(.8rem * var(--odl-d)) 1.2rem; background: var(--odl-card); border-color: transparent; border-radius: var(--odl-radius-md); box-shadow: none; }
.odl--theme-prisma .odl-file__link:hover, .odl--theme-prisma .odl-file__link:focus-visible { border-color: var(--odl-accent); box-shadow: 0 0 0 1px var(--odl-accent); }
.odl--theme-prisma .odl-file__title { font-weight: 600; letter-spacing: -.01em; }
.odl--theme-prisma.odl--cards .odl-file__link { padding: 1.4rem; border-radius: var(--odl-radius); }
.odl--theme-prisma .odl-file__dl, .odl--theme-prisma .odl-file__link:hover .odl-file__dl, .odl--theme-prisma .odl-file__link:focus-visible .odl-file__dl { padding: .4rem 1.1rem; font-weight: 600; color: var(--odl-accent-contrast); background: var(--odl-accent); border-radius: var(--odl-radius-pill); }
.odl--theme-prisma .odl-file--pw .odl-file__dl { color: inherit; background: var(--odl-canvas); }
.odl--theme-prisma .odl-new { padding: .1em .7em; font-size: .7em; font-weight: 600; letter-spacing: .02em; color: #fff; background: var(--odl-red); border-radius: var(--odl-radius-pill); }
.odl--theme-prisma .odl-count, .odl--theme-prisma .odl-t-count { color: inherit; font-weight: 600; background: var(--odl-canvas); border-color: transparent; }
/* Felder und Schaltflächen: Pillen, Primär gelb, Sekundär mit kräftigem Rahmen in Textfarbe */
.odl--theme-prisma .odl-field, .odl--theme-prisma .odl-search, .odl--theme-prisma .odl-q, .odl--theme-prisma .odl-type, .odl--theme-prisma .odl-sort, .odl--theme-prisma .odl-unlock__pw, .odl--theme-prisma .odl-t-filter, .odl--theme-prisma .odl-t-search {
	padding-inline: 1rem; background: var(--odl-canvas); border-color: var(--odl-field-line); border-radius: 16px;
}
.odl--theme-prisma .odl-btn--primary, .odl--theme-prisma .odl-searchbtn, .odl--theme-prisma .odl-unlock__btn { padding-inline: 1.4rem; font-weight: 600; color: var(--odl-accent-contrast); background: var(--odl-accent); border-color: transparent; border-radius: var(--odl-radius-pill); }
.odl--theme-prisma .odl-zip, .odl--theme-prisma .odl-toggle { padding-inline: 1.2rem; color: inherit; font-weight: 600; background: transparent; border: 2px solid currentColor; border-radius: var(--odl-radius-pill); }
.odl--theme-prisma .odl-zip:hover, .odl--theme-prisma .odl-zip:focus-visible, .odl--theme-prisma .odl-toggle:hover { color: var(--odl-accent-contrast); background: var(--odl-accent); border-color: var(--odl-accent); }
.odl--theme-prisma .odl-views { background: var(--odl-canvas); border-color: transparent; border-radius: var(--odl-radius-pill); }
.odl--theme-prisma .odl-views__btn.is-active { color: var(--odl-accent-contrast); background: var(--odl-accent); }
/* Ordner: runde Karten */
.odl--theme-prisma .odl-folder { margin-bottom: .8rem; background: var(--odl-card); border-color: transparent; border-radius: var(--odl-radius); }
.odl--theme-prisma .odl-folder > summary { padding: calc(1rem * var(--odl-d)) 1.5rem; }
.odl--theme-prisma .odl-folder__body { padding: 0 1rem .8rem; }
.odl--theme-prisma .odl-folder__body .odl-folder { background: var(--odl-canvas); }
.odl--theme-prisma .odl-folder__body .odl-file__link { background: var(--odl-canvas); }
.odl--theme-prisma .odl-folder-ico { color: inherit; }
.odl--theme-prisma .odl-unlock, .odl--theme-prisma .odl-notice, .odl--theme-prisma .odl-empty { background: var(--odl-card); border-radius: var(--odl-radius); }
/* Baum: gelbe Auswahl */
.odl--theme-prisma .odl-t-nav { padding: .6rem; background: var(--odl-card); border-color: transparent; }
.odl--theme-prisma .odl-t-ico { background: currentColor; }
.odl--theme-prisma .odl-t-link { border-radius: var(--odl-radius-md); }
.odl--theme-prisma .odl-t-link:hover { background: var(--odl-canvas); }
.odl--theme-prisma .odl-t-link.is-selected { color: var(--odl-accent-contrast); font-weight: 600; background: var(--odl-accent); }
.odl--theme-prisma .odl-t-link.is-selected .odl-t-count { color: inherit; background: color-mix(in srgb, #000 10%, transparent); }
.odl--theme-prisma .odl-t-chip { background: var(--odl-card); border-color: transparent; border-radius: var(--odl-radius-pill); }

/* Schmale Bildschirme: Kristall und Prisma haben großzügige Innenabstände – so bleibt neben Symbol und Aktion genug Platz für den Titel */
@media (max-width: 560px) {
	.odl--theme-kristall .odl-file__link, .odl--theme-prisma .odl-file__link { padding: .65rem .8rem; }
	.odl--theme-kristall .odl-file__dl, .odl--theme-prisma .odl-file__dl { padding: .5rem; }
	.odl--theme-kristall .odl-folder > summary, .odl--theme-prisma .odl-folder > summary { padding: .8rem 1rem; }
	.odl--theme-kristall .odl-folder__body, .odl--theme-prisma .odl-folder__body { padding: 0 .5rem .5rem; }
	.odl--theme-prisma .odl-tools { padding: .5rem; }
	.odl--theme-kristall.odl--cards .odl-file__dl, .odl--theme-prisma.odl--cards .odl-file__dl { padding: .4rem 1.1rem; }
}

/* Squircle: größere Radien je Theme (corner-shape wird in front.css gesetzt) */
@supports (corner-shape: squircle) {
	.odl--theme-nordlicht { --odl-radius: 10px; --odl-radius-md: 9px; --odl-radius-sm: 4px; }
	.odl--theme-fjord { --odl-radius: 8px; --odl-radius-md: 7px; --odl-radius-sm: 3px; }
	.odl--theme-nebel { --odl-radius: 10px; --odl-radius-md: 9px; --odl-radius-sm: 5px; }
	.odl--theme-kristall { --odl-radius: 32px; --odl-radius-md: 21px; --odl-radius-sm: 9px; }
	.odl--theme-prisma { --odl-radius: 34px; --odl-radius-md: 25px; --odl-radius-sm: 10px; }
}

/* ================================================================== Regler (unabhängig vom Theme) */
.odl--density-compact { --odl-d: .8; }
.odl--density-comfy { --odl-d: 1.25; }

.odl--radius-none { --odl-radius: 0; --odl-radius-md: 0; --odl-radius-sm: 0; --odl-radius-pill: 0; }
.odl--radius-sm { --odl-radius: 4px; --odl-radius-md: 3px; --odl-radius-sm: 2px; --odl-radius-pill: 6px; }
.odl--radius-lg { --odl-radius: 16px; --odl-radius-md: 12px; --odl-radius-sm: 4px; }
.odl--radius-round { --odl-radius: 24px; --odl-radius-md: 16px; --odl-radius-sm: 6px; }
@supports (corner-shape: squircle) {
	.odl--radius-sm { --odl-radius: 6px; --odl-radius-md: 5px; --odl-radius-sm: 3px; }
	.odl--radius-lg { --odl-radius: 22px; --odl-radius-md: 17px; --odl-radius-sm: 6px; }
	.odl--radius-round { --odl-radius: 32px; --odl-radius-md: 22px; --odl-radius-sm: 9px; }
}

.odl--icons-none .odl-file__icon { display: none; }
.odl--icons-mono .odl-ico { --ico: var(--odl-muted); --ico-bg: transparent; --ico-on: color-mix(in srgb, currentColor 82%, transparent); }
/* farbig: weiße Beschriftung auf der Typfarbe (hat Vorrang vor dem einfarbigen Theme-Stil) */
.odl--icons-color .odl-ico { --ico-bg: var(--ico); --ico-on: #fff; }
.odl--icons-color .odl-ico--pdf { --ico: var(--odl-c-pdf); }
.odl--icons-color .odl-ico--word { --ico: var(--odl-c-word); }
.odl--icons-color .odl-ico--excel { --ico: var(--odl-c-excel); }
.odl--icons-color .odl-ico--ppt { --ico: var(--odl-c-ppt); }
.odl--icons-color .odl-ico--image { --ico: var(--odl-c-image); }
.odl--icons-color .odl-ico--archive { --ico: var(--odl-c-archive); }
.odl--icons-color .odl-ico--media { --ico: var(--odl-c-media); }

/* Farbschema erzwingen: der Block bekommt eine eigene Fläche */
.odl--scheme-light { color-scheme: light; color: #1f2328; background: #fff; padding: 1rem; border-radius: var(--odl-radius); }
.odl--scheme-dark { --odl-accent-text: color-mix(in srgb, var(--odl-accent) 62%, #fff); color-scheme: dark; color: #e6edf3; background: #15181e; padding: 1rem; border-radius: var(--odl-radius); }

/* Hoher Kontrast / erzwungene Farben: Rahmen und Fokus bleiben erkennbar */
@media (forced-colors: active) {
	.odl-file__link, .odl-folder, .odl-field, .odl-btn, .odl-views { border: 1px solid CanvasText; }
	.odl-file__link:focus-visible, .odl-folder > summary:focus-visible { outline: 2px solid Highlight; }
}