/* Fonts */
@import url("//hello.myfonts.net/count/3fbcd0");

@font-face {
	font-family: "GillSansMTPro-Medium";
	src: url('/assets/fonts/GillSansMTProMedium/font.woff2') format('woff2'), url('/assets/fonts/GillSansMTProMedium/font.woff') format('woff');
}

@font-face {
	font-family: "GillSansMTPro-Light";
	src: url('/assets/fonts/GillSansMTProLight/font.woff2') format('woff2'), url('/assets/fonts/GillSansMTProLight/font.woff') format('woff');
}

@font-face {
	font-family: "GillSansMTPro-Book";
	src: url('/assets/fonts/GillSansMTProBook/font.woff2') format('woff2'), url('/assets/fonts/GillSansMTProBook/font.woff') format('woff');
}

.cart-table {
	width: 100%;
	border-collapse: collapse;
}
.cart-table th,
.cart-table td {
	text-align: left;
	vertical-align: top;
	padding: 10px 0;
}
.cart-table tbody td {
	border-top: 1px solid var(--color-brown-lightest);
}
.cart-table tfoot td {
	border-top: 2px solid var(--color-brown-lightest);
}
.cart-table__remove {
	display: block;
	width: 12px;
	height: 12px;
}
.cart-table__quantity {
	width: 50px;
	outline: none;
}
.cart-actions {
	padding-top: var(--spacer-l);
	display: flex;
	justify-content: flex-end;
}
.cart-table__remove:hover {
	color: #c00;
}
.toastify {
	box-shadow: none;
}

/* Tailwind overrides - not enough time to undo all the Tailwind classes! */
:root {
	--color-lightest: #ede8e5;
	--color-brown-dark: #68351a;
	--color-brown: #7f5b4a;
	--color-brown-light: #89614b;
	--color-brown-lightest: #dcd2cc;
	--color-taupe: #938786;
	--font-normal: "GillSansMTPro-Book", "Gill Sans", Helvetica, sans-serif;
	--font-light: "GillSansMTPro-Light", "Gill Sans", Helvetica, sans-serif;
}
*, ::after, ::before {
	border-color: var(--color-lightest);
}
html {
	font-family: var(--font-normal);
	color: var(--color-brown);
}
input {
    accent-color: var(--color-brown);
}
.placeholder-gray-700::placeholder {
	color: var(--color-brown);
}
.bg-gray-100 {
	background-color: var(--color-lightest);
}
.hover\:bg-gray-900:hover {
	background-color: var(--color-brown-light);
}
.bg-black {
	background-color: var(--color-brown);
}
.border-gray-300 {
	border-color: #eae0da;
}
.text-black {
	color: var(--color-brown-dark);
}
.text-gray-500 {
	color: var(--color-brown);
}
.hover\:bg-gray-100:hover {
	background-color: var(--color-brown-lightest);
}
.border-green-500 {
	border-color: var(--color-brown-light);
}
.text-green-500 {
	color: var(--color-brown-light);
}
@media (min-width: 1024px) {
	.lg\:bg-gray-100 {
		background-color: var(--color-lightest);
	}
}