.stock-list-toggle,
.stock-list-toggle + .stock-list-20261005 + label[for$="-toggle"],
.stock-list-20261005 > .toolbar label[for$="-toggle"],
.stock-list-20261005 > .filter label[for$="-toggle"]
{
	display: none;
}
.stock-list-20261005
{    
	display: grid;
	width: var(--content-width);
    padding: var(--content-padding);
    margin: auto;
	grid-template-areas: 
				"titlebar"			
				"list"
				"pagination";	
}

.stock-list-20261005:has(.toolbar)
{
	grid-template-areas: 
				"titlebar titlebar"				
				"toolbar toolbar"
				"filter list"
				"pagination pagination";
    grid-template-columns: 264px 1fr;
    grid-gap: 0px 32px;				
}

.stock-list-20261005 > .titlebar
{	
	grid-area: titlebar;
	display: grid;
	grid-template-areas: "title link" "description link";
    align-items: end;	
    grid-template-columns: 1fr auto;
    justify-items: start;	
	margin-bottom: clamp(24px, 2.6vw, 32px);
}
.stock-list-20261005 > .titlebar > h1,
.stock-list-20261005 > .titlebar > h2
{
	grid-area: title;
    max-width: 15ch;
    margin: 0;
    color: #1a1a1a;
    font-size: clamp(28px, 3.2vw, 40px);
    font-weight: 600;
    line-height: 1.02;
    letter-spacing: -.028em;
    text-wrap: balance;
	margin-bottom: 12px;
}
.stock-list-20261005 > .titlebar > .description
{
	grid-area: description;
	max-width: 44ch;    
    color: #333333;
    font-size: 18px;
    line-height: 1.5;	
}
.stock-list-20261005 > .titlebar > .description *
{
    color: #333333;
    font-size: 18px;
    line-height: 1.5;	
}
.stock-list-20261005 > .titlebar > a
{
	grid-area: link;
	background: #FFF;
    color: #333;    
	display: inline-flex;
    min-width: 92px;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    padding-inline: 20px;
    border: 1px solid #dde4df;
    border-radius: 999px;    
    font-size: 16px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: .02em;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    transition: background 150ms ease, color 150ms ease, border-color 150ms ease, transform 150ms cubic-bezier(.22, 1, .36, 1);	
}
.stock-list-20261005 > .titlebar > a:hover
{
	color: #FFF;
	background: #278536;
	border-color: transparent;
	transform: translateY(-2px);
}

.stock-list-20261005 > .toolbar
{
	grid-area: toolbar;
	display: grid;
	grid-template-areas: "results sort";
    grid-template-columns: 1fr auto;
    align-items: center;
    grid-column: 2;    
    grid-gap: 18px 0px;	
	margin-bottom: 18px;	
}
.stock-list-20261005 > .toolbar:has(.tags)
{
	grid-template-areas: "results sort" "tags tags";
}
.stock-list-20261005 > .toolbar > .results
{
	grid-area: results;    
}
.stock-list-20261005 > .toolbar > .results,
.stock-list-20261005 > .toolbar > .results > span
{
    color: #595959;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.5;	
}
.stock-list-20261005 > .toolbar > fieldset
{
	grid-area: sort;	
}
.stock-list-20261005 > .toolbar > fieldset > select[name="sort-by"],
.stock-list-20261005 > .filter select
{	
    min-height: 44px;    
    border: 1px solid oklch(0.85 0.0101 155.08);
    border-radius: 8px;    
    color: #333;
    cursor: pointer;    
    appearance: none;	
	height: auto;	
}

.stock-list-20261005 > .toolbar fieldset:has(button)
{
	display: flex;
}
.stock-list-20261005 > .toolbar fieldset:has(button) select[name="sort-by"]
{
	border-right: 0px;
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
}
.stock-list-20261005 > .toolbar fieldset:has(button) select[name="sort-by"] + button
{
	border: 1px solid oklch(0.85 0.0101 155.08);
	border-radius: 8px;  
	background: #FFF;
	color: #333;		
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;	
	min-width: auto;
    box-shadow: none;
}

.stock-list-20261005 > .filter fieldset
{
	display: grid;	
	grid-gap: 7px 10px;
	grid-template-columns: 1fr 1fr;
}
.stock-list-20261005 > .filter fieldset > label
{
	grid-row: 1;
	color: #595959;
	font-size: 12px;
	text-transform: capitalize;
}
.stock-list-20261005 > .filter fieldset > select
{
	grid-row: 2;
	width: 100%;
	font-size: 14px;
}

.stock-list-20261005 > .toolbar > .tags
{
	grid-area: tags;
    display: flex;
    min-height: 0px;
    flex-wrap: wrap;    
    gap: 8px;	
	align-items: center;
}
.stock-list-20261005 > .toolbar > .tags > a
{
	text-decoration: underline;
    padding: 0px 12px;
    text-underline-offset: 3px;	
}
.stock-list-20261005 > .toolbar > .tags > a:hover
{
	color: oklch(0.5442 0.1447 145.83);	
}
.stock-list-20261005 > .toolbar > .tags button
{
	border: 1px solid oklch(0.85 0.0101 155.08);
	border-radius: 8px;  
	background: #FFF;
	color: #333;		
	min-width: auto;
    box-shadow: none;
	height: auto;
    padding: 0px 10px;
    font-size: 11px;
    border-radius: 50px;
	display: flex;
    align-items: center;
	gap: 4px;
	transition: transform 240ms cubic-bezier(0.34, 1.56, 0.64, 1), border-color 160ms, background 160ms, color 160ms;
}
.stock-list-20261005 > .toolbar > .tags button:hover
{	
	color: oklch(0.5442 0.1447 145.83);
	border: 1px solid oklch(0.5442 0.1447 145.83);
	transform: translateY(-2px);
}
.stock-list-20261005 > .toolbar > .tags button:after
{
	content: '';
	display: block;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23333333' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
    width: 11px;
    height: 11px;
	margin-top: -1px;
}
.stock-list-20261005 > .toolbar > .tags button:hover:after
{
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23278536' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
}
.stock-list-20261005 > .noresults
{
	grid-area: list;
}

.stock-list-20261005 > .filter
{
	grid-area: filter;	
}
.stock-list-20261005 > .filter > div
{
    border: 1px solid oklch(0.85 0.0101 155.08);
    border-radius: 8px;
    background: oklch(1 0 0);
    display: grid;	
}
.stock-list-20261005 > .filter > div > *
{
    margin: 0px 20px;
	padding: 18px 0px;
    border-bottom: 1px solid oklch(0.85 0.0101 155.08);    
}
.stock-list-20261005 > .filter > div > *:first-child
{
	margin: 0px;
	padding: 18px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;	
}
.stock-list-20261005 > .filter > div > *:first-child h2
{
	font-size: 24px;
	line-height: 1.1;
    font-weight: 600;
    letter-spacing: -0.02em;
    text-wrap: balance;	
}
.stock-list-20261005 > .filter > div > *:first-child > a.button
{
	height: auto;
	padding: 0 9px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: .02em;
    text-decoration: none;
	min-height: 28px;
	min-width: auto;
    display: grid;
	gap: 4px;
    grid-auto-flow: column;
    align-content: center;
    justify-content: center;	
	color: #333;
	background: #FFF;
	border: 1px solid oklch(0.85 0.0101 155.08);
}
.stock-list-20261005 > .filter > div > *:first-child > a.button:hover
{
	color: oklch(0.5442 0.1447 145.83);
	background: #FFF;
	border: 1px solid oklch(0.5442 0.1447 145.83);
}
.stock-list-20261005 > .filter > div > *:first-child > a.button:before
{
	content: '';
	display: block;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23333333' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
    width: 11px;
    height: 11px;	
}
.stock-list-20261005 > .filter > div > *:first-child > a.button:hover:before
{
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23278536' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E");
}

.stock-list-20261005 > .filter > div > *:last-child
{
	border-bottom: 0px;
	display: grid;
    position: sticky;
    bottom: 0px;
    background: #FFF;
	z-index: 1;	
}
.stock-list-20261005 > .filter > div > *:last-child button
{
    height: auto;
    padding: 0 9px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: .02em;
    text-decoration: none;
    min-height: 40px;
    min-width: auto;
    display: grid;
    gap: 4px;
    grid-auto-flow: column;
    align-content: center;
    justify-content: center;
    color: #333;
    background: #FFF;
    border: 1px solid oklch(0.85 0.0101 155.08);	
}
.stock-list-20261005 > .filter > div > *:last-child button:hover
{
	color: oklch(0.5442 0.1447 145.83);
	background: #FFF;
	border: 1px solid oklch(0.5442 0.1447 145.83);
}
.stock-list-20261005 > .filter summary
{
	list-style: none;
	display: flex;
	cursor: pointer;
    min-height: 24px;
    align-items: center;		
}
.stock-list-20261005 > .filter summary h3
{
    font-size: 15px;
    font-weight: 600;	
}
.stock-list-20261005 > .filter details summary:after
{
	content: '';
    position: absolute;
    background-color: var(--colour-icons);
    mask-size: 16px 16px;
    mask-position: center center;
    mask-repeat: no-repeat;
    display: inline-block;
    width: 24px;
    height: 24px;
    mask-image: url(/index/up.svg);
    transform: rotate(90deg);
    right: 0px;
    transition: transform 160ms ease;	
}
.stock-list-20261005 > .filter details:open summary:after
{
	transform: rotate(180deg);
}
.stock-list-20261005 > .filter summary + *
{
	margin-top: 18px;
}
.stock-list-20261005 > .filter .long-list
{
	display: grid;
	max-height: 254px;
    overflow-y: auto;    
    scrollbar-width: thin;
    scrollbar-color: oklch(0.5442 0.1447 145.83) transparent;	
}
.stock-list-20261005 > .filter .long-list > label
{
    display: grid;
    min-height: 30px;
    grid-template-columns: 18px minmax(0, 1fr) auto;
    align-items: center;
    gap: 9px;
    padding: 0 6px;
    border-radius: 6px;    
    cursor: pointer;
    transition: background 150ms ease, color 150ms ease;	
}
.stock-list-20261005 > .filter .long-list > label span
{
	color: #333;
    font-size: 14px;	
}
.stock-list-20261005 > .filter .long-list > label span:last-child
{
	color: #595959;
	font-size: 12px;	
}
.stock-list-20261005 > .filter .long-list > label:hover
{
	background: oklch(0.98 0.0034 145.55);
}

.stock-list-20261005 > .filter .long-list > label input[type="checkbox"]
{    
	appearance: none;
    width: 18px;
    height: 18px;    
    border: 1.5px solid oklch(0.85 0.0101 155.08);
    border-radius: 5px;
    background: oklch(1 0 0);
    transition: background 180ms ease, border-color 180ms ease, box-shadow 180ms ease;    
}
.stock-list-20261005 > .filter .long-list > label input[type="checkbox"]:checked
{
	background-color: oklch(0.5442 0.1447 145.83);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.5 5 9l4.5-6' stroke='%23FFFFFF' fill='none' style='stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 14;' /%3E%3C/svg%3E");
	background-repeat: no-repeat;
    background-position: center center;
    background-size: 11px 11px;
}
.stock-list-20261005 > .filter .long-list > label input[type="checkbox"]:checked + span
{
	color: oklch(0.5442 0.1447 145.83);
}
.stock-list-20261005 > .list
{
	grid-area: list;
}

.stock-list-20261005 > .list > .stack,
.stock-list-20261005 > .list > .carousel
{
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	grid-auto-flow: row;
	gap: 24px;
	padding: 0;		
}
.stock-list-20261005:has(.toolbar) > .list > .stack,
.stock-list-20261005:has(.toolbar) > .list > .carousel
{
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.stock-list-20261005 > .pagination
{
	display: none;
}
.stock-list-20261005:has(.toolbar) > .pagination
{	
	grid-area: pagination;
	grid-column: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(3px, 1.4vw, 6px);
    margin-top: 36px;	
}
.stock-list-20261005:has(.toolbar) > .pagination button[disabled]
{
	cursor: not-allowed;
    opacity: .42;	
}

.stock-list-20261005:has(.toolbar) > .pagination button
{
    width: clamp(28px, 8.4vw, 44px);
    height: clamp(28px, 8.4vw, 44px);
    min-width: auto;
    min-height: auto;
    border-radius: 8px;
    background: #FFF;
    color: #333;
	border: 1px solid oklch(0.85 0.0101 155.08);
    padding: 0px;
    display: inline-flex;
    justify-content: center;
    align-items: center;	
}
.stock-list-20261005:has(.toolbar) > .pagination button.current,
.stock-list-20261005:has(.toolbar) > .pagination button:hover
{
    background: #278536;
	border: 1px solid #278536;
    color: #FFF;	
}

.stock-box-20261005
{
    position: relative;
    display: flex;    
    flex-direction: column;    
    border: 1px solid #dde4df;
    border-radius: 8px;
    background: #FFF;
    box-shadow:  0 1px 4px oklch(0.24 0.02 154 / .035);
    scroll-snap-align: center;
    transform: translateY(0);
    transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms cubic-bezier(.22, 1, .36, 1);		
	user-select: none;
}

.stock-box-20261005:hover
{
	border-color: color-mix(in oklch, #278536 48%, #DDE4DF); 
	box-shadow: 0 2px 8px rgba(23, 30, 24, 0.05);
}

.stock-box-20261005 > *
{
	margin: 0px 18px;
}

.stock-box-20261005 > a:has(picture)
{
	margin: 0px;
	width: 100%;
    aspect-ratio: 1.32 / 1;
    overflow: hidden;    
    grid-area: img;
    position: relative;
    border-radius: 8px;	
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
}
.stock-box-20261005 > .noImage
{
	margin: 0px;
	width: 100%;
    aspect-ratio: 1.32 / 1;
    overflow: hidden;    
    grid-area: img;
    position: relative;    
	display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 16px;
    text-align: center;
    background: oklch(0.98 0.0034 145.55);
    pointer-events: none;
	border-radius: 8px;	
}
.stock-box-20261005 > a > picture,
.stock-box-20261005 > .noImage
{
    display: flex;
	z-index: 2;
    width: 100%;    
    object-fit: cover;	
	anchor-name: --image-area;
	border-radius: 8px;
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
}
.stock-box-20261005 > .noImage > svg
{	
    width: 34px;
    height: 34px;
    margin-bottom: 2px;
    color: #595959;
}
.stock-box-20261005 > .noImage > span:first-of-type
{
    color: #1A1A1A;
    font-size: 17px;
    font-weight: 600;
    letter-spacing: .01em;
}
.stock-box-20261005 > .noImage > span:nth-of-type(2)
{
	color: #595959;
    font-size: 14px;
	anchor-name: --no-image-last-child;
}
.stock-box-20261005 > .noImage + a
{
    position: absolute;
    z-index: 3;	
    font-size: 18px;
    font-weight: 700;
    text-decoration: none;	
	position-anchor: --no-image-last-child;
	top: calc(anchor(bottom) + 6px);
	justify-self: anchor-center;
}	
.stock-box-20261005.somerset > .noImage + a
{
	color: #278536;
}
.stock-box-20261005.devon > .noImage + a
{
	color: oklch(0.61 0.2 28);
}

.stock-box-20261005 > a > picture > img 
{
    object-fit: cover;
    width: 100%;
	aspect-ratio: 1.32 / 1;    
    top: 0px;
    left: 0px;
    transition: 0.5s;
    flex-shrink: 0;	
	border-radius: 8px;
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;	
}
.stock-box-20261005 > .overlays
{
    position: absolute;
	z-index: 4;
    top: 0px;
    left: -18px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding: 14px;
}

.stock-box-20261005 > .overlays > *
{
	display: inline-flex;
    height: 24px;
    align-items: center;
    padding: 0 9px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 10px;
    letter-spacing: .02em;
    line-height: 1;
    box-shadow: none;
    transition: border-color 160ms ease, background 160ms ease;	
    gap: 4px;
    border-color: #dde4df;
    background: #FFF;
    color: #595959;
    font-weight: 500;	
}
@keyframes sale-tag-pulse
{
	0% { transform: scale(1); }
	70% { transform: scale(1.055); }
	100% { transform: scale(1); }
}
.stock-box-20261005 > .overlays > .save
{
	border-color: 
	color-mix(in oklch, oklch(0.61 0.2 28) 78%, #333);
    background: oklch(0.61 0.2 28);
    color: #FFF;    
    font-weight: 700;
    text-align: left;
    animation: sale-tag-pulse 2.2s ease-in-out infinite;	
}
.stock-box-20261005 > .overlays > .save:before
{
	content: 'Save ';
}
.stock-box-20261005 > .overlays > .price-includes
{
	padding: 0px 9px 0px 25px;
	background-size: 12px 12px;
	background-repeat: no-repeat;
	background-position: 9px;	
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23278536' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 8.2 3.1 3.1L13 4.5'/%3E%3C/svg%3E");
}

.stock-box-20261005 > a:hover > picture > img 
{
	transform: translateX(-100%);
}

.stock-box-20261005 > .status
{
	margin: 18px 18px 12px;	
}

.stock-box-20261005 > .status > .instock,
.stock-box-20261005 > .status > .duein,
.stock-box-20261005 > .status > .availabletoorder
{
	padding-left: 12px;
}
.stock-box-20261005 > .status > .instock:before,
.stock-box-20261005 > .status > .duein:before,
.stock-box-20261005 > .status > .availabletoorder:before
{
	content: "";
    position: absolute;
    left: 0px;
    top: 50%;
    width: 8px;
    height: 8px;
    margin-top: -4px;
    border-radius: 50%;    	
}
.stock-box-20261005 > .status > .instock:before
{
	background: #278536;	
}
.stock-box-20261005 > .status > .duein:before
{
	background: oklch(0.72 0.19 55);	
}
.stock-box-20261005 > .status > .duein:availabletoorder
{
	background: oklch(0.55 0.18 255);	
}
.stock-box-20261005 > .status .branch
{
	font-weight: 700;
}
.stock-box-20261005.somerset > .status .branch
{
	color: #278536;
}
.stock-box-20261005.devon > .status .branch
{
	color: oklch(0.61 0.2 28);
}

.stock-box-20261005 > .status .internalReference
{
	color: #333;
	font-weight: 700;
}
.stock-box-20261005 > .status .internalReference:before
{
	content: 'Ref: ';
	font-weight: normal;	
}

.stock-box-20261005 > h3
{
	margin: 0px 18px 15px;	
	min-height: 2.2em;
	font-size: clamp(16px, 1.3vw, 19px);
	color: #1a1a1a;
	transition: color 180ms ease;
    font-weight: 600;
    line-height: 1.1;
    letter-spacing: -.015em;	
}
.stock-box-20261005:hover > h3
{
	color: oklch(0.5442 0.1447 145.83);
}

.stock-box-20261005 h3:after 
{ 
	display: inline-block; 
	margin-left: 7px; content: "\2197"; 
	font-size: .72em; 
	opacity: 0; 
	transform: translate(-4px, 0px); 
	transition: opacity 180ms ease, transform 220ms cubic-bezier(.22, 1, .36, 1); 
}
.stock-box-20261005:hover h3:after 
{
	opacity: 1; 
}

.stock-box-20261005 > .stats
{
	display: flex;
    min-height: 24px;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 14px;
}

.stock-box-20261005 > .stats > span
{
    display: inline-flex;
    min-height: 24px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    padding: 3px 8px;
    border: 1px solid #dde4df;
    border-radius: 5px;
    color: #595959;
    font-size: 10px;
    line-height: 1.15;
    white-space: nowrap;
}

.stock-box-20261005 > .price
{
	min-height: 2.15em;    	
	display: flex;
    align-items: flex-start;    
    gap: 3px;
    margin: auto 18px 20px;
    padding-top: 14px;
    border-top: 1px solid #dde4df;
    color: #595959;
    font-size: 13px;
    letter-spacing: .01em;
    text-align: left;	
}

.stock-box-20261005 > .price > span,
.stock-box-20261005 > .price > abbr
{    
    font-size: clamp(17px, 1.5vw, 19px);
    font-weight: 500;
    line-height: 1.15;
    letter-spacing: -.015em;	
	color: #595959;
	text-decoration: none;
    transition: color 180ms ease;
	border: 0px;
}

.stock-box-20261005 > .price > span
{
	color: #1a1a1a;
}

.stock-box-20261005 > .price > abbr:after
{
	content: ':';
}

.stock-box-20261005 > .price > .was:before
{
	content: ' / ';
	padding-inline: 4px;
    color: oklch(0.85 0.0101 155.08);
    font-size: 17px;
    font-weight: 400;
    line-height: 1;    
}
.stock-box-20261005 > .price > .sale
{
	color: oklch(0.61 0.2 28);
}
.stock-box-20261005 > .price > .was
{
    color: #595959;
    font-size: 17px;
    font-weight: 400;	
}
.stock-box-20261005 > .price > .was:after
{
    content: '';
    display: block;
    position: absolute;
    height: 1px;
    width: calc(100% - 1em);
    background: #595959;
    top: 50%;
    right: 0px;
}

.stock-box-20261005 > a.favourite
{
    position: absolute;	
	z-index: 2;		
	position-anchor: --image-area;
	bottom: calc(anchor(bottom) + 16px);
	right: calc(anchor(right) + 16px);	
	width: 44px;
    height: 44px;	
	margin: 0px;
	overflow: hidden;
	border: 1px solid transparent;
	border-radius: 50%;
	background: #FFF;
	color: #333;
	cursor: pointer;
	transition: background 150ms ease, color 150ms ease, border-color 150ms ease, transform 150ms cubic-bezier(.22, 1, .36, 1);		
	background-size: 24px 24px;
	background-repeat: no-repeat;
	background-position: center;    
	color: transparent;
}
.stock-box-20261005 > a.favourite.add
{
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='1.8'%3E%3Cpath d='M20.8 4.7a5.6 5.6 0 0 0-7.9 0L12 5.6l-.9-.9a5.6 5.6 0 1 0-7.9 7.9l.9.9L12 21l7.9-7.5.9-.9a5.6 5.6 0 0 0 0-7.9Z'/%3E%3C/svg%3E");		
}
.stock-box-20261005 > a.favourite:hover
{
	background-colour: oklch(0.98 0.0034 145.55);
	transform: translateY(-2px);
}
.stock-box-20261005 > a.favourite:hover,
.stock-box-20261005 > a.favourite.remove
{
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23278536' stroke='%23278536' stroke-width='1.8'%3E%3Cpath d='M20.8 4.7a5.6 5.6 0 0 0-7.9 0L12 5.6l-.9-.9a5.6 5.6 0 1 0-7.9 7.9l.9.9L12 21l7.9-7.5.9-.9a5.6 5.6 0 0 0 0-7.9Z'/%3E%3C/svg%3E");		
}
.stock-box-20261005 > a.favourite.remove
{
	border-color: color-mix(in oklch, #278536 34%, #dde4df);
}

.stock-box-20261005 > a.favourite:hover
{
	border: 1px solid #dde4df;
}

.stock-box-20261005 > a:last-child
{
    position: absolute;
    top: 0px;
    bottom: 0px;
    background: transparent;
    width: 100%;
    height: 100%;
    left: -18px;	
	z-index: 1;		
}

.stock-list-20261005 > .controls
{
	display: none;
}

@media screen and (max-width: 400px) 
{
	.stock-list-20261005 > .toolbar label[for$="-toggle"]
	{
		font-size: 14px;
		gap: 6px;
		padding-inline: 10px;
		min-height: 42px;
	}
}
@media screen and (min-width: 401px) 
{
	.stock-list-20261005 > .toolbar label[for$="-toggle"]
	{
		font-size: 16px;
		gap: 9px;			
		padding-inline: 14px;
		min-height: 46px;
	}
}
@media screen and (max-width: 479px) 
{
	.stock-list-20261005:has(.toolbar) > .list > .stack
	{
		grid-template-columns: 1fr;		
	}
}
@media screen and (max-width: 900px) 
{
	.stock-list-20261005 > .titlebar > .description
	{
		margin-bottom: 24px;
	}
	.stock-list-20261005 > .titlebar
	{
		grid-template-areas: "title" "description" "link";		
	}
	
	body:has(.stock-list-toggle:checked)
	{
		overflow: hidden;
	}
	.stock-list-toggle:checked + .stock-list-20261005 + label
	{
		display: block;
		position: fixed;
        inset: 0;
        z-index: 1;
        background: oklch(0.12 0.01 150 / .36);        
        backdrop-filter: blur(3px);			
	}	
	.stock-list-20261005 > .toolbar 
	{
		grid-template-areas: "sort . filter" "results results results";
        grid-column: 1;
        grid-template-columns: auto 1fr auto;
	}
	.stock-list-20261005 > .toolbar:has(.tags)
	{
		grid-template-areas: "sort . filter" "tags tags tags" "results results results";
	}
	.stock-list-20261005:has(.toolbar) > .pagination
	{
		grid-column: 1;
	}
	.stock-list-20261005 > .toolbar label[for$="-toggle"]
	{
        grid-area: filter;                              
        display: inline-flex;
        border: 1px solid oklch(0.85 0.0101 155.08);
        border-radius: 8px;
        background: #FFF;
        color: #333;
        cursor: pointer;
        font-weight: 600;
        align-items: center;		
	}
	.stock-list-20261005 > .toolbar label[for$="-toggle"]:before
	{
		content: '';
		display: block;		
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23595959' stroke-width='2' stroke-linecap='round' aria-hidden='true'%3E%3Cline x1='4' y1='7' x2='12' y2='7'%3E%3C/line%3E%3Cline x1='4' y1='17' x2='6' y2='17'%3E%3C/line%3E%3Cline x1='18' y1='7' x2='20' y2='7'%3E%3C/line%3E%3Cline x1='13' y1='17' x2='20' y2='17'%3E%3C/line%3E%3Ccircle cx='15' cy='7' r='3'%3E%3C/circle%3E%3Ccircle cx='9' cy='17' r='3'%3E%3C/circle%3E%3C/svg%3E");
		background-repeat: no-repeat;
		background-position: center;
		width: 16px;
		height: 16px;		
	}	
	.stock-list-toggle:checked + .stock-list-20261005 > .filter
	{
		transform: translateX(0);
		overscroll-behavior: contain; 
		box-shadow: -24px 0 50px oklch(0.12 0.01 150 / .18);
	}	
	.stock-list-toggle + .stock-list-20261005 > .filter
	{
		grid-area: auto;
		position: fixed;
        top: 0;
		right: 0;
        transform: translateX(100%);
		width: min(92vw, 390px);
		z-index: 2;
		transition: transform 260ms cubic-bezier(.22, 1, .36, 1);                              
	}
	.stock-list-20261005 > .filter > div
	{
		height: 100svh;
		overflow-y: auto;
		border: 0;
		border-radius: 0;
	}
	.stock-list-20261005 > .filter > div > *:first-child
	{
		position: sticky;
		top: 0px;
		background: #FFF;
		z-index: 1;
        display: grid;
        grid-auto-flow: column;
        grid-template-columns: 1fr auto auto;
        grid-gap: 8px;		
	}
	.stock-list-20261005 > .filter label[for$="-toggle"]
	{
		display: block;
        width: 44px;
        height: 44px;
        border: 1px solid oklch(0.85 0.0101 155.08);
        border-radius: 50%;
        background: #FFF;
        cursor: pointer;		
	}
	.stock-list-20261005 > .filter label[for$="-toggle"]:before,
	.stock-list-20261005 > .filter label[for$="-toggle"]:after
	{
		position: absolute;
        top: 50%;
        left: 50%;
        width: 16px;
        border-top: 1.7px solid #333;
        content: "";
	}
	.stock-list-20261005 > .filter label[for$="-toggle"]:hover,
	.stock-list-20261005 > .filter label[for$="-toggle"]:hover:before,
	.stock-list-20261005 > .filter label[for$="-toggle"]:hover:after
	{
		border-color: oklch(0.5442 0.1447 145.83);
	}	
	.stock-list-20261005 > .filter label[for$="-toggle"]:before
	{
	    transform: translate(-50%, -50%) rotate(45deg);
	}
	.stock-list-20261005 > .filter label[for$="-toggle"]:after
	{
	    transform: translate(-50%, -50%) rotate(-45deg)
	}
	.stock-list-20261005 > .filter .long-list > label
	{
		min-height: 44px;
	}
	.stock-list-20261005 > .filter > div > *:last-child button
	{
		border: 0;
		min-height: 46px;
		background: oklch(0.5442 0.1447 145.83);
		color: #FFF;
		font-weight: 600;
		font-size: 16px;
	}
	.stock-list-20261005 > .filter > div > *:last-child button:hover
	{
		border: 0;
		background: color-mix(in oklch, oklch(0.5442 0.1447 145.83) 76%, #333);
		color: #FFF;
	}
	
	.stock-list-20261005:has(.toolbar)
	{		
		grid-template-areas: "titlebar" "toolbar" "list" "pagination";
		grid-template-columns: 1fr;
	}
}
@media screen and (max-width: 1024px) 
{	
	.stock-list-20261005 > .titlebar > .description,
	.stock-list-20261005 > .titlebar > .description *
	{
		font-size: 16px;
	}
}
@media screen and (max-width: 1149px)
{
	.stock-list-20261005 > .list > .carousel
	{
		grid-auto-columns: 375px;		
	}
}
@media screen and (min-width: 1150px)
{
	.stock-list-20261005 > .list > .carousel
	{
		grid-auto-columns: 423px;
	}
}
@media screen and (max-width: 1199px)
{
	.stock-list-20261005:not(:has(.toolbar)) > .list
	{
		display: contents;
	}
	.stock-list-20261005:not(:has(.toolbar)) > .list > .carousel
	{
		grid-template-columns: none;
		grid-auto-flow: column;		
		width: 100%;
		overflow-x: auto;
		overflow-y: hidden;			
	}
	
	.stock-list-20261005:not(:has(.toolbar)) > .controls
	{
		margin-top: 20px;		
		display: flex;
		gap: 8px;	
		justify-content: flex-end;
		--border: #dde4df;
		--accent: #278536;		
		--fg: #333333;
		--surface: #ffffff;
	}

	.stock-list-20261005:not(:has(.toolbar)) > .controls > a
	{
		display: inline-grid;
		width: 44px;
		height: 44px;
		place-items: center;
		padding: 0;
		border: 1px solid var(--border);
		border-radius: 50%;
		background: var(--surface);
		color: var(--fg);
		cursor: pointer;
		transition: background 150ms ease, color 150ms ease, border-color 150ms ease, transform 150ms cubic-bezier(.22, 1, .36, 1);
		position: relative;
	}
	.stock-list-20261005:not(:has(.toolbar)) > .controls > a:hover
	{
		background: oklch(0.5442 0.1447 145.83);		
	}
	.stock-list-20261005:not(:has(.toolbar)) > .controls > a:after
	{
		content: '';
		position: absolute;
		display: block;
		width: 15px;
		height: 15px;			
		background-color: var(--fg);
		mask-image: url(/index/down.svg);
		mask-position: 50% 50%;
		mask-size: 100%; 100%;
		opacity: 0.6;
	}
	.stock-list-:not(:has(.toolbar)) > .controls > a:hover:after
	{
		opacity: 1.0;
		background-color: var(--surface);
	}
	.stock-list-20261005:not(:has(.toolbar)) > .controls > a.left:after
	{   
		mask-repeat: no-repeat;
		transform: rotateZ(90deg);    
	}
	.stock-list-20261005:not(:has(.toolbar)) > .controls > a.right:after
	{    
		mask-repeat: no-repeat;
		transform: rotateZ(-90deg);
	}
	.stock-box-20261005 > .stats
	{	
		min-height: 54px;
	}
		 
	.stock-list-20261005:has(.toolbar) > .list > .carousel
	{
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
@media screen and (min-width: 480px) and (max-width: 1199px)
{
	.stock-list-20261005:has(.toolbar) > .list > .stack
	{
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
@media screen and (min-width: 1200px)
{
	.stock-box-20261005.clone
	{
		display: none;
	}
}

@media print
{
	.stock-box-20261005.clone,
	.stock-list-20261005 > .titlebar > a,
	.stock-list-20261005 > .filter,
	.stock-list-20261005 > .toolbar,	
	.stock-list-20261005:has(.toolbar) > .pagination 
	{
		display: none !important;
	}
	.stock-list-20261005:has(.toolbar)
	{
		display: grid;
		width: var(--content-width);
		padding: var(--content-padding);
		margin: auto;
		grid-template-areas: 
					"titlebar"			
					"list";		
		grid-template-columns: 1fr;
		gap: 0px;
	}
	.stock-box-20261005
	{
		display: grid;
		grid-template-areas: 
			"image status"
			"image title"
			"image stats"
			"image price";
		grid-column: 1 / -1;
		grid-template-columns: auto 1fr;
		align-items: center;
		page-break-inside: avoid;
	}	
	.stock-box-20261005 > a:has(picture), .stock-box-20261005 > .noImage	
	{
		grid-area: image;
		height: 5cm;
		border-radius: 8px;
	}
	.stock-box-20261005 > .status
	{
		grid-area: status;
		display: flex;
        justify-content: flex-end;
        gap: 8px;    
	}
	.stock-box-20261005 > h3
	{
		grid-area: title;
		display: flex;
        justify-content: flex-end;		
	}
	.stock-box-20261005 > .stats
	{
		grid-area: stats;
		justify-content: flex-end;
	}
	.stock-box-20261005 > .price
	{
		grid-area: price;
		justify-content: flex-end;
	}
	.stock-box-20261005 > .price > .was,
	.stock-box-20261005 > .overlays > .save,
	.stock-box-20261005 > a.favourite,
	.stock-box-20261005 > .overlays > .price-includes
	{
		print-color-adjust: exact;  
		-webkit-print-color-adjust: exact;	
	}
	.stock-box-20261005 > .overlays
	{
		justify-content: flex-start;
		gap: 8px;
	}
}