/* SW Podcast Links — front end */
.swpl {
	--swpl-gap: 12px;
	--swpl-chip-size: 2.25em;
	--swpl-radius: 999px;
	--swpl-cols: 3;
	--swpl-max: none;
	--swpl-head-gap: 1.25em;
	box-sizing: border-box;
	max-width: var(--swpl-max);
	margin-left: var(--swpl-ml, auto);
	margin-right: var(--swpl-mr, auto);
	text-align: var(--swpl-ta, center);
}
.swpl *, .swpl *::before, .swpl *::after { box-sizing: border-box; }

.swpl--align-left   { --swpl-justify: flex-start; --swpl-ta: left;   --swpl-ml: 0;    --swpl-mr: auto; }
.swpl--align-center { --swpl-justify: center;     --swpl-ta: center; --swpl-ml: auto; --swpl-mr: auto; }
.swpl--align-right  { --swpl-justify: flex-end;   --swpl-ta: right;  --swpl-ml: auto; --swpl-mr: 0; }

.swpl .swpl__heading { margin: 0 0 .35em; text-wrap: balance; }
.swpl .swpl__sub { margin: 0; opacity: .8; text-wrap: pretty; }

.swpl .swpl__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: var(--swpl-justify, center);
	gap: var(--swpl-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}
.swpl .swpl__heading + .swpl__list,
.swpl .swpl__sub + .swpl__list { margin-top: var(--swpl-head-gap); }
.swpl .swpl__item { margin: 0; padding: 0; list-style: none; }
.swpl .swpl__item::before, .swpl .swpl__item::marker { content: none; }

/* ---- Link base */
.swpl .swpl__link {
	display: inline-flex;
	align-items: center;
	gap: .65em;
	color: var(--swpl-text);
	background: var(--swpl-surface);
	border: 1px solid var(--swpl-line);
	border-radius: var(--swpl-radius);
	text-decoration: none;
	line-height: 1.2;
	-webkit-tap-highlight-color: transparent;
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, background-color .2s ease;
}
.swpl .swpl__link:hover,
.swpl .swpl__link:focus-visible {
	color: var(--swpl-text);
	background: var(--swpl-surface-hover, var(--swpl-surface));
	border-color: var(--swpl-accent);
	text-decoration: none;
}
.swpl .swpl__link:focus-visible { outline: 2px solid var(--swpl-accent); outline-offset: 3px; }

.swpl .swpl__icon {
	flex: none;
	display: inline-grid;
	place-items: center;
	width: var(--swpl-chip-size);
	height: var(--swpl-chip-size);
	border-radius: 50%;
	background: var(--swpl-chip);
	color: var(--swpl-glyph);
	overflow: hidden;
}
.swpl .swpl__icon svg { width: 56%; height: 56%; display: block; }
.swpl .swpl__icon i { font-size: calc(var(--swpl-chip-size) * .48); line-height: 1; }
.swpl .swpl__link--image .swpl__icon { width: auto; min-width: var(--swpl-chip-size); background: none; border-radius: 0; overflow: visible; }
.swpl .swpl__link--image .swpl__icon img { height: 100%; width: auto; max-width: none; object-fit: contain; display: block; }

.swpl .swpl__text { display: inline-flex; flex-direction: column; }
.swpl .swpl__label { font-weight: 500; }

.swpl--no-labels .swpl__text {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* ---- Colour schemes (declared on the link so each app's own colour resolves) */
.swpl--colors-sw .swpl__link,
.swpl--colors-custom .swpl__link {
	--swpl-surface: #FAF6F1;
	--swpl-surface-hover: #FFFFFF;
	--swpl-text: #423244;
	--swpl-chip: #D7E6E6;
	--swpl-glyph: #423244;
	--swpl-line: #EADFD3;
	--swpl-accent: #D9A664;
}
.swpl--colors-brand .swpl__link {
	--swpl-surface: #FFFFFF;
	--swpl-surface-hover: #FFFFFF;
	--swpl-text: #2B2530;
	--swpl-chip: var(--swpl-brand);
	--swpl-glyph: #FFFFFF;
	--swpl-line: #E6E1E8;
	--swpl-line: color-mix(in srgb, var(--swpl-brand) 30%, #FFFFFF);
	--swpl-accent: var(--swpl-brand);
	--swpl-badge-icon: var(--swpl-brand);
}
.swpl--colors-light .swpl__link {
	--swpl-surface: #FFFFFF;
	--swpl-surface-hover: #FAFAFB;
	--swpl-text: #222025;
	--swpl-chip: #F1F0F2;
	--swpl-glyph: #222025;
	--swpl-line: #E3E1E6;
	--swpl-accent: #423244;
}
.swpl--colors-dark .swpl__link {
	--swpl-surface: #26222B;
	--swpl-surface-hover: #2F2A35;
	--swpl-text: #F5F1F6;
	--swpl-chip: rgba(255, 255, 255, .1);
	--swpl-glyph: #FFFFFF;
	--swpl-line: rgba(255, 255, 255, .14);
	--swpl-accent: #D9A664;
}

/* ---- Skin: pill */
.swpl--skin-pill .swpl__link { padding: .4em 1.15em .4em .4em; }
.swpl--skin-pill.swpl--no-labels .swpl__link { padding: .4em; }

/* ---- Skin: circle */
.swpl--skin-circle { --swpl-chip-size: 3.25em; --swpl-gap: 18px; }
.swpl--skin-circle .swpl__item { align-self: flex-start; }
.swpl--skin-circle .swpl__link,
.swpl--skin-circle .swpl__link:hover,
.swpl--skin-circle .swpl__link:focus-visible {
	flex-direction: column;
	gap: .5em;
	padding: 0;
	background: none;
	border: 0;
	border-radius: 8px;
}
.swpl--skin-circle .swpl__icon { border: 1px solid var(--swpl-line); transition: border-color .2s ease, box-shadow .2s ease; }
.swpl--skin-circle .swpl__link:hover .swpl__icon { border-color: var(--swpl-accent); }
.swpl--skin-circle .swpl__label { font-size: .8em; max-width: 7em; text-align: center; }

/* ---- Skin: badge */
.swpl--skin-badge { --swpl-radius: 12px; --swpl-chip-size: 2em; }
.swpl--skin-badge .swpl__link { padding: .55em 1.15em .55em .8em; gap: .7em; }
.swpl--skin-badge .swpl__link--glyph .swpl__icon,
.swpl--skin-badge .swpl__link--font .swpl__icon { background: none; color: var(--swpl-badge-icon, var(--swpl-glyph)); }
.swpl--skin-badge .swpl__link--glyph .swpl__icon svg { width: 80%; height: 80%; }
.swpl--skin-badge .swpl__text { align-items: flex-start; text-align: left; }
.swpl--skin-badge .swpl__caption { font-size: .72em; opacity: .72; }
.swpl--skin-badge .swpl__label { font-size: 1.05em; font-weight: 600; }

/* ---- Skin: card */
.swpl--skin-card { --swpl-radius: 16px; --swpl-chip-size: 3em; --swpl-gap: 14px; }
.swpl--skin-card .swpl__list { display: grid; grid-template-columns: repeat(var(--swpl-cols), minmax(0, 1fr)); }
.swpl--skin-card .swpl__link { display: flex; flex-direction: column; justify-content: center; width: 100%; height: 100%; padding: 1.3em .75em; gap: .75em; text-align: center; }
.swpl--skin-card .swpl__text { align-items: center; }
@media (max-width: 600px) {
	.swpl--shortcode.swpl--skin-card .swpl__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---- Skin: list */
.swpl--skin-list { --swpl-radius: 12px; --swpl-max: 26rem; --swpl-gap: 8px; }
.swpl--skin-list .swpl__list { flex-direction: column; align-items: stretch; flex-wrap: nowrap; }
.swpl--skin-list .swpl__link { display: flex; width: 100%; padding: .5em 1em .5em .5em; text-align: left; }

/* ---- Hover effects */
.swpl--hover-lift .swpl__link:hover { transform: translateY(-2px); }
.swpl--hover-glow .swpl__link:hover { box-shadow: 0 0 0 4px rgba(217, 166, 100, .25); box-shadow: 0 0 0 4px color-mix(in srgb, var(--swpl-accent) 24%, transparent); }
.swpl--skin-circle.swpl--hover-glow .swpl__link:hover { box-shadow: none; }
.swpl--skin-circle.swpl--hover-glow .swpl__link:hover .swpl__icon { box-shadow: 0 0 0 5px color-mix(in srgb, var(--swpl-accent) 24%, transparent); }

@media (prefers-reduced-motion: reduce) {
	.swpl .swpl__link, .swpl .swpl__icon { transition: none; }
	.swpl .swpl__link:hover { transform: none; }
}

/* ---- Editor notice */
.swpl-empty {
	padding: 1em 1.25em;
	border: 1px dashed #D9A664;
	border-radius: 10px;
	background: #FAF6F1;
	color: #423244;
	font-size: 14px;
	text-align: center;
}
