.pasc {
	box-sizing: border-box;
	max-width: var(--pasc-layout-max-width, 100%);
	margin-inline: auto;
	background: var(--pasc-layout-background, #fff);
	box-shadow: var(--pasc-layout-box-shadow, none);
	color: var(--pasc-text-cell-color, #374151);
	font-family: var(--pasc-text-cell-font-family, inherit);
	font-size: var(--pasc-text-cell-font-size, 15px);
	font-weight: var(--pasc-text-cell-font-weight, 400);
}
.pasc *, .pasc *::before, .pasc *::after { box-sizing: border-box; }
/*
 * position: relative an Rahmen und Scrollbereich: overflow schneidet absolut positionierte
 * Kinder nur ab, wenn ihr Bezugsrahmen innen liegt. Sonst ragen z. B. die .screen-reader-text
 * der Symbolzellen (Bezug: Theme-.container) bis zur letzten Spalte hinaus und die Seite scrollt.
 */
.pasc__frame {
	position: relative;
	border: var(--pasc-table-outer-width, 1px) solid var(--pasc-table-outer-color, #d1d5db);
	border-radius: var(--pasc-table-radius, 12px);
	overflow: hidden;
}
.pasc__scroll { position: relative; max-width: 100%; }
.pasc[data-table-behavior="fit"] .pasc__scroll { overflow-x: visible; }
/*
 * Der Rahmen meldet seinem Layout keine Eigenbreite: Sonst zieht die Mindestbreite der Tabelle
 * (und die innere Breite der fixierten Leiste) eine Theme-Grid-Spalte auf volle Tabellenbreite
 * auf, und statt der Tabelle scrollt die ganze Seite. overflow allein reicht dafür nicht.
 * width: 100%, weil margin-inline: auto den Vergleich in Flex/Grid sonst auf Inhaltsbreite
 * schrumpfen lässt – und die ist ohne Eigenbreite des Rahmens fast null.
 */
.pasc[data-table-behavior="scroll"] { width: 100%; }
.pasc[data-table-behavior="scroll"] .pasc__frame { contain: inline-size; }
.pasc[data-table-behavior="scroll"] .pasc__scroll { overflow-x: auto; overflow-y: hidden; }
.pasc[data-table-behavior="scroll"] .pasc__scroll:focus-visible { outline: 3px solid #2271b1; outline-offset: -3px; }
.pasc__table { width: 100%; margin: 0; border: 0; border-collapse: separate; border-spacing: 0; table-layout: fixed; }
.pasc[data-table-behavior="scroll"] .pasc__table { width: max(100%, var(--pasc-scroll-min-width)); min-width: var(--pasc-scroll-min-width); }
.pasc__table th, .pasc__table td {
	min-width: 0;
	padding: var(--pasc-table-cell-padding-y, 12px) var(--pasc-table-cell-padding-x, 16px);
	border: 0;
	border-inline-end: var(--pasc-table-line-width, 1px) solid var(--pasc-table-line-color, #d1d5db);
	border-block-end: var(--pasc-table-line-width, 1px) solid var(--pasc-table-line-color, #d1d5db);
	background: var(--pasc-table-cell-background, #fff);
	vertical-align: top;
	white-space: normal;
	overflow-wrap: anywhere;
	word-break: normal;
}
.pasc__table tr > :last-child { border-inline-end: 0; }
.pasc__table tbody tr:last-child > * { border-block-end: 0; }
.pasc__table tbody tr:nth-child(even) td { background: var(--pasc-table-zebra-background, #f8fafc); }
.pasc__corner, .pasc__label { width: var(--pasc-responsive-label-width, 180px); background: var(--pasc-text-label-background, #f3f4f6) !important; color: var(--pasc-text-label-color, #111827); font-weight: var(--pasc-text-label-weight, 600); text-align: start; }
.pasc__product { background: var(--pasc-header-background, #fff) !important; }
.pasc__header { display: flex; flex-direction: column; align-items: stretch; justify-content: var(--pasc-header-justify, center); gap: var(--pasc-header-gap, 10px); text-align: center; }
.pasc__image-area, .pasc__image-wrap { position: relative; }
.pasc__image-wrap { width: min(100%, var(--pasc-image-width, 180px)); margin-inline: auto; aspect-ratio: var(--pasc-image-ratio, 1/1); border-radius: var(--pasc-image-radius, 8px); overflow: hidden; background: var(--pasc-image-background, #f8fafc); }
.pasc__image-link { display: block; width: 100%; height: 100%; }
.pasc__image { display: block; width: 100% !important; height: 100% !important; margin: 0 !important; object-fit: var(--pasc-image-fit, contain); border-radius: inherit; }
.pasc__title { display: block; min-height: calc(var(--pasc-title-reserved-lines, 0) * 1.25em); color: var(--pasc-title-title-color, #111827); font-family: var(--pasc-title-title-font-family, inherit); font-size: var(--pasc-title-title-font-size, 18px); font-weight: var(--pasc-title-title-font-weight, 600); line-height: 1.25; text-align: var(--pasc-title-text-align, center); text-decoration: none; }
.pasc[data-title-truncate="1"] .pasc__title { display: -webkit-box; max-height: calc(var(--pasc-title-clamp-lines, 1) * 1.25em); overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: var(--pasc-title-clamp-lines, 1); line-clamp: var(--pasc-title-clamp-lines, 1); }
.pasc__title:hover, .pasc__title:focus { color: var(--pasc-title-title-hover-color, #2563eb); }
.pasc__price { color: var(--pasc-price-price-color, #111827); font-family: var(--pasc-price-price-font-family, inherit); font-size: var(--pasc-price-price-font-size, 17px); font-weight: var(--pasc-price-price-font-weight, 600); text-align: var(--pasc-price-text-align, center); }
.pasc__value a { color: var(--pasc-text-link-color, #2563eb); }
.pasc__value--empty { color: var(--pasc-text-empty-color, #9ca3af); }
.pasc__rating { position: relative; display: flex; justify-content: var(--pasc-rating-justify, center); color: var(--pasc-rating-rating-color, #111827); font-family: var(--pasc-rating-rating-font-family, inherit); font-size: var(--pasc-rating-rating-font-size, 15px); font-weight: var(--pasc-rating-rating-font-weight, 600); line-height: 1; }
.pasc__rating--stars { width: calc(5 * var(--pasc-rating-icon-size, 18px) + 4 * var(--pasc-rating-icon-gap, 2px)); margin-inline: auto; }
.pasc__stars-base, .pasc__stars-active { display: flex; gap: var(--pasc-rating-icon-gap, 2px); }
.pasc__stars-base { color: var(--pasc-rating-inactive-color, #e5e7eb); }
.pasc__stars-active { position: absolute; inset: 0 auto auto 0; color: var(--pasc-rating-active-color, #f59e0b); overflow: hidden; }
.pasc__rating svg { flex: 0 0 var(--pasc-rating-icon-size, 18px); width: var(--pasc-rating-icon-size, 18px); height: var(--pasc-rating-icon-size, 18px); fill: currentColor; }
.pasc__actions { display: flex; flex-direction: column; gap: var(--pasc-buttons-gap, 8px); }
.pasc .pasc__button { display: inline-flex; align-items: center; justify-content: center; width: var(--pasc-buttons-width, auto); min-width: max-content; padding: var(--pasc-buttons-padding-y, 9px) var(--pasc-buttons-padding-x, 14px); border: 1px solid var(--pasc-buttons-border-color, #111827); border-radius: var(--pasc-buttons-radius, 6px); background: var(--pasc-buttons-background, #111827); color: var(--pasc-buttons-color, #fff); line-height: 1.25; text-align: center; text-decoration: none; cursor: pointer; }
.pasc .pasc__button:hover, .pasc .pasc__button:focus { border-color: var(--pasc-buttons-hover-border, #2563eb); background: var(--pasc-buttons-hover-background, #2563eb); color: var(--pasc-buttons-hover-color, #fff); }
.pasc__badges { display: flex; flex-direction: column; gap: var(--pasc-badges-gap, 6px); pointer-events: none; }
.pasc__badges--above { margin-block-end: var(--pasc-badges-gap, 6px); }
.pasc__badges--overlay { position: absolute; z-index: 2; inset: var(--pasc-badges-overlay-offset, 8px); }
.pasc__badge { align-self: flex-start; padding: var(--pasc-badges-padding-y, 4px) var(--pasc-badges-padding-x, 9px); border: var(--pasc-badges-border-width, 0) solid var(--pasc-badges-border-color, #dc2626); border-radius: var(--pasc-badges-radius, 999px); background: var(--pasc-badges-background, #dc2626); color: var(--pasc-badges-badge-color, #fff); font-family: var(--pasc-badges-badge-font-family, inherit); font-size: var(--pasc-badges-badge-font-size, 12px); font-weight: var(--pasc-badges-badge-font-weight, 600); line-height: 1.2; }
.pasc__badge--right { align-self: flex-end; }
.pasc__badge--full { align-self: stretch; text-align: center; }
.pasc__rank-badge {
	display: inline-flex;
	align-self: center;
	justify-content: center;
	max-width: 100%;
	padding: 5px 11px;
	border-radius: 999px;
	background: var(--pasc-ranking-other-badge-background, #475569);
	color: var(--pasc-ranking-badge-text-color, #fff);
	font-size: var(--pasc-ranking-badge-font-size, 13px);
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
}
.pasc__rank-badge--1 { background: var(--pasc-ranking-rank-1-badge-background, #b7791f); }
.pasc__rank-badge--2 { background: var(--pasc-ranking-rank-2-badge-background, #64748b); }
.pasc__rank-badge--3 { background: var(--pasc-ranking-rank-3-badge-background, #9a5b34); }
.pasc__rank-badge[hidden] { display: none; }
.pasc[data-ranking-highlight="top1"] .pasc__rank-item--1.pasc__product,
.pasc[data-ranking-highlight="top3"] .pasc__rank-item--1.pasc__product,
.pasc[data-ranking-highlight="top1"] td.pasc__rank-item--1,
.pasc[data-ranking-highlight="top3"] td.pasc__rank-item--1,
.pasc[data-ranking-highlight="top1"] .pasc__card.pasc__rank-item--1,
.pasc[data-ranking-highlight="top3"] .pasc__card.pasc__rank-item--1 { background: var(--pasc-ranking-rank-1-background, #fff8dc) !important; }
.pasc[data-ranking-highlight="top1"] .pasc__card.pasc__rank-item--1 .pasc__card-header,
.pasc[data-ranking-highlight="top3"] .pasc__card.pasc__rank-item--1 .pasc__card-header { background: var(--pasc-ranking-rank-1-background, #fff8dc); }
.pasc[data-ranking-highlight="top3"] .pasc__rank-item--2.pasc__product,
.pasc[data-ranking-highlight="top3"] td.pasc__rank-item--2,
.pasc[data-ranking-highlight="top3"] .pasc__card.pasc__rank-item--2 { background: var(--pasc-ranking-rank-2-background, #f8fafc) !important; }
.pasc[data-ranking-highlight="top3"] .pasc__card.pasc__rank-item--2 .pasc__card-header { background: var(--pasc-ranking-rank-2-background, #f8fafc); }
.pasc[data-ranking-highlight="top3"] .pasc__rank-item--3.pasc__product,
.pasc[data-ranking-highlight="top3"] td.pasc__rank-item--3,
.pasc[data-ranking-highlight="top3"] .pasc__card.pasc__rank-item--3 { background: var(--pasc-ranking-rank-3-background, #fff3e8) !important; }
.pasc[data-ranking-highlight="top3"] .pasc__card.pasc__rank-item--3 .pasc__card-header { background: var(--pasc-ranking-rank-3-background, #fff3e8); }
.pasc--view-ranking .pasc__product.pasc__rank-item--1 .pasc__header,
.pasc--view-podium .pasc__product.pasc__rank-item--1 .pasc__header { transform: scale(var(--pasc-rank-1-scale, 1.08)); }
.pasc--view-ranking .pasc__product.pasc__rank-item--2 .pasc__header,
.pasc--view-podium .pasc__product.pasc__rank-item--2 .pasc__header { transform: scale(var(--pasc-rank-2-scale, 1.03)); }
.pasc--view-ranking .pasc__product.pasc__rank-item--3 .pasc__header,
.pasc--view-podium .pasc__product.pasc__rank-item--3 .pasc__header { transform: scale(var(--pasc-rank-3-scale, 1.03)); }
.pasc__product.pasc__rank-item .pasc__header { transform-origin: center center; transition: transform 0.18s ease; }
.pasc--view-podium .pasc__product.pasc__rank-item--1 { padding-block: calc(var(--pasc-table-cell-padding-y, 12px) + 12px); }
.pasc__value--icon { text-align: var(--pasc-icons-align, center); }
.pasc__cell-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--pasc-icons-background-size, 42px);
	height: var(--pasc-icons-background-size, 42px);
	margin: var(--pasc-icons-margin, 0 auto);
	border-radius: var(--pasc-icons-radius, 999px);
	background: var(--pasc-icons-background, transparent);
}
.pasc__cell-icon--checkmarks { color: var(--pasc-icons-checkmarks-color, #16a34a); }
.pasc__cell-icon--crosses { color: var(--pasc-icons-crosses-color, #dc2626); }
.pasc__cell-icon--arrows { color: var(--pasc-icons-arrows-color, #2563eb); }
.pasc__cell-icon--plus { color: var(--pasc-icons-plus-color, #7c3aed); }
.pasc__cell-icon--minus { color: var(--pasc-icons-minus-color, #64748b); }
.pasc-icon--cell { display: block; width: var(--pasc-icons-size, 28px); height: var(--pasc-icons-size, 28px); }
.pasc__icon-preview-set { display: flex; flex-wrap: wrap; justify-content: var(--pasc-icons-justify, center); gap: 6px; }
.pasc__gallery { display: flex; flex-wrap: wrap; gap: 6px; }
.pasc__gallery img, .pasc__token-image { display: block; width: 64px; height: 64px; object-fit: cover; }
.pasc__stack { display: none; }
.pasc[data-table-behavior="fit"].is-stacked .pasc__scroll { display: none; }
.pasc[data-table-behavior="fit"].is-stacked .pasc__stack { display: grid; gap: max(16px, var(--pasc-table-cell-padding-y, 12px)); }
.pasc__card { overflow: hidden; border: var(--pasc-table-line-width, 1px) solid var(--pasc-table-line-color, #d1d5db); border-radius: max(0px, calc(var(--pasc-table-radius, 12px) - var(--pasc-table-outer-width, 1px))); background: var(--pasc-table-cell-background, #fff); }
.pasc__card-header { padding: var(--pasc-table-cell-padding-y, 12px) var(--pasc-table-cell-padding-x, 16px); background: var(--pasc-header-background, #fff); }
.pasc__card-values { margin: 0; }
.pasc__card-row { display: grid; grid-template-columns: minmax(110px, 38%) minmax(0, 1fr); margin: 0; border-block-start: var(--pasc-table-line-width, 1px) solid var(--pasc-table-line-color, #d1d5db); }
.pasc__card-row:nth-child(even) dd { background: var(--pasc-table-zebra-background, #f8fafc); }
.pasc__card-row dt, .pasc__card-row dd { min-width: 0; margin: 0; padding: var(--pasc-table-cell-padding-y, 12px) var(--pasc-table-cell-padding-x, 16px); overflow-wrap: anywhere; }
.pasc__card-row dt { border-inline-end: var(--pasc-table-line-width, 1px) solid var(--pasc-table-line-color, #d1d5db); background: var(--pasc-text-label-background, #f3f4f6); color: var(--pasc-text-label-color, #111827); font-weight: var(--pasc-text-label-weight, 600); }
/* Tooltip der Bezeichnungsspalte. Der Button wird gegen Theme-Buttonstile zurückgesetzt. */
.pasc__label-inner { display: inline-flex; align-items: flex-start; gap: 6px; max-width: 100%; }
.pasc__label-text { min-width: 0; }
.pasc__tip-zone { cursor: pointer; }
.pasc .pasc__tip-toggle { appearance: none; display: inline-flex; flex: none; align-items: center; justify-content: center; width: 1.1em; min-width: 0; height: 1.1em; min-height: 0; margin: 0.12em 0 0; padding: 0; border: 0; border-radius: 50%; background: none; box-shadow: none; color: var(--pasc-text-tooltip-icon-color, #6b7280); line-height: 0; cursor: pointer; }
.pasc .pasc__tip-toggle:hover, .pasc .pasc__tip-toggle:focus, .pasc .pasc__tip-zone.is-tip-open .pasc__tip-toggle { background: none; color: var(--pasc-text-label-color, #111827); }
.pasc .pasc__tip-toggle:focus-visible { outline: 2px solid #2271b1; outline-offset: 2px; }
.pasc__tip-toggle svg { display: block; width: 100%; height: 100%; }
/* position: fixed entkommt dem overflow von Rahmen und Scroll-Container; die Lage setzt comparison-frontend.js. */
.pasc__tip { position: fixed; z-index: 100000; width: max-content; max-width: min(320px, calc(100vw - 16px)); padding: 8px 11px; border-radius: 6px; background: var(--pasc-text-tooltip-background, #111827); box-shadow: 0 6px 20px rgba(15, 23, 42, 0.18); color: var(--pasc-text-tooltip-color, #fff); font-size: 13px; font-weight: 400; line-height: 1.45; text-align: start; white-space: normal; overflow-wrap: break-word; cursor: auto; }
.pasc__tip[hidden] { display: none; }
/* Sticky-Zellen bilden je einen Stapelkontext – die offene Zelle muss über den Nachbarzeilen liegen. */

/*
 * Fixierte horizontale Scrollleiste (Design › Responsive): ersetzt die Leiste der Tabelle,
 * sitzt im Rahmen darunter und klebt am Bildschirmrand. overflow: clip statt hidden, weil
 * hidden den Rahmen zum Scroll-Container macht und sticky dann nur innerhalb des Rahmens wirkt.
 */
.pasc.has-scrollbar-proxy .pasc__frame { overflow: clip; }
.pasc.has-scrollbar-proxy .pasc__scroll { scrollbar-width: none; }
.pasc.has-scrollbar-proxy .pasc__scroll::-webkit-scrollbar { display: none; }
.pasc__scrollbar { position: sticky; bottom: 0; z-index: 7; overflow-x: auto; overflow-y: hidden; background: var(--pasc-table-cell-background, #fff); border-block-start: var(--pasc-table-line-width, 1px) solid var(--pasc-table-line-color, #d1d5db); scrollbar-width: auto; scrollbar-color: #9ca3af transparent; }
.pasc__scrollbar[hidden] { display: none; }
.pasc__scrollbar-inner { height: 1px; }
/* Ohne eigene Stile blendet WebKit die Leiste auf Mac/Touch aus – dann wäre sie unsichtbar. */
.pasc__scrollbar::-webkit-scrollbar { height: 12px; }
.pasc__scrollbar::-webkit-scrollbar-track { background: transparent; }
.pasc__scrollbar::-webkit-scrollbar-thumb { border: 3px solid transparent; border-radius: 999px; background: #9ca3af padding-box; }
.pasc-diagnostic { padding: 10px 12px; border-inline-start: 4px solid #dba617; background: #fff8e5; }
@media (max-width: 640px) {
	.pasc__table th, .pasc__table td { padding: max(8px, var(--pasc-table-cell-padding-y, 12px)) max(8px, var(--pasc-table-cell-padding-x, 16px)); }
	.pasc[data-table-behavior="fit"] .pasc__scroll { display: none; }
	.pasc[data-table-behavior="fit"] .pasc__stack { display: grid; gap: max(16px, var(--pasc-table-cell-padding-y, 12px)); }
	.pasc__card-row { grid-template-columns: 1fr; }
	.pasc__card-row dt { border-inline-end: 0; border-block-end: var(--pasc-table-line-width, 1px) solid var(--pasc-table-line-color, #d1d5db); }
	.pasc__product.pasc__rank-item .pasc__header { transform: none; }
}
@media (prefers-reduced-motion: reduce) { .pasc * { scroll-behavior: auto !important; transition: none !important; } }

/* Sticky getrennt für Desktop und Mobile/Tablet. */
@media (min-width: 1025px) {
.pasc[data-sticky-labels="1"] .pasc__corner, .pasc[data-sticky-labels="1"] .pasc__label { position: sticky; inset-inline-start: 0; z-index: 2; }
.pasc[data-sticky-labels="1"] .pasc__corner { z-index: 4; }
.pasc[data-sticky-labels="1"] .pasc__label.is-tip-open { z-index: 6; }
}
@media (max-width: 1024px) {
.pasc[data-sticky-labels-mobile="1"] .pasc__corner, .pasc[data-sticky-labels-mobile="1"] .pasc__label { position: sticky; inset-inline-start: 0; z-index: 2; }
.pasc[data-sticky-labels-mobile="1"] .pasc__corner { z-index: 4; }
.pasc[data-sticky-labels-mobile="1"] .pasc__label.is-tip-open { z-index: 6; }
}
