/* Warehouse sale promo on blog posts (functions/sale-promo.php). Prefix: fsp- */
.fsp { background: #f2fbfe; border: 2px solid #00a9e0; border-radius: 10px; padding: 16px; margin: 0 0 24px; color: #222; }
.fsp-kicker { display: inline-block; margin: 0 0 8px !important; padding: 3px 10px; border-radius: 4px; background: #E83D3D; color: #fff; font-weight: 700; font-size: 14px; line-height: 1.4; }
.fsp .fsp-title { font-size: 24px; line-height: 1.2; font-weight: 800; margin: 0 0 8px; }
.fsp .fsp-lead { font-size: 16px; line-height: 1.45; margin: 0 0 12px; }
.fsp-find label { display: block; font-weight: 700; font-size: 15px; margin: 0 0 6px; }
.fsp-find select { width: 100%; height: 46px; font-size: 16px; padding: 0 10px; border: 2px solid #8fd3ea; border-radius: 8px; background: #fff; margin: 0 0 10px; }
.fsp-find button, .fsp-all { display: block; width: 100%; min-height: 46px; border: 0; border-radius: 8px; background: #00a9e0; color: #fff !important; font-weight: 700; font-size: 16px; padding: 11px 14px; text-align: center; cursor: pointer; text-decoration: none !important; }
.fsp-find button:hover, .fsp-all:hover { background: #008bb8; }
.fsp-find button:focus-visible, .fsp-all:focus-visible, .fsp-list a:focus-visible, .fsp-find select:focus-visible { outline: 3px solid #222; outline-offset: 2px; }
.fsp-list { list-style: none; margin: 16px 0 12px; padding: 0; }
.fsp-list li { border-top: 1px solid #d6f0f9; }
.fsp-list a { display: grid; grid-template-columns: 84px 1fr; grid-template-rows: auto auto; column-gap: 12px; align-items: center; padding: 10px 0; color: #222; text-decoration: none; }
.fsp-list img { grid-row: 1 / 3; width: 84px; height: 84px; object-fit: contain; background: #fff; border-radius: 6px; }
.fsp-name { font-weight: 700; font-size: 15px; line-height: 1.3; align-self: end; }
.fsp-price { font-size: 15px; align-self: start; }
.fsp-price del { color: #666; margin-right: 4px; }
.fsp-price ins { text-decoration: none; font-weight: 800; color: #c62828; }
.fsp-all { background: #fff; color: #006f94 !important; border: 2px solid #00a9e0; }
.fsp-all:hover { background: #e1f4fb; }
/* In the post: phones only; on wider screens the sidebar box does the job. */
.fsp--inline { margin: 20px 0 24px; }
@media (min-width: 768px) { .fsp--inline { display: none; } }
/* Top guides: inline boxes on every screen size, 3 shoes each (friendly_sale_guide_box). */
.fsp.fsg { display: block; margin: 28px 0; padding: 20px; background: #f7fcfe; border: 1px solid #bfe6f3; border-left: 5px solid #00a9e0; }
.fsg-list { list-style: none; margin: 14px 0 6px; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.fsg-list li { display: flex; flex-direction: column; background: #fff; border: 1px solid #e3f1f6; border-radius: 8px; padding: 10px; margin: 0; }
.fsg-list li::before { display: none; }
.fsg-img { display: block; margin: 0 0 8px; }
.fsg-img img { display: block; width: 100%; aspect-ratio: 1 / 1; height: auto; object-fit: contain; background: #fff; margin: 0; }
.fsg-name { font-weight: 700; font-size: 15px; line-height: 1.3; color: #222 !important; text-decoration: none !important; margin: 0 0 4px; }
.fsg-name:hover { text-decoration: underline !important; }
.fsg .fsp-price { display: block; margin: 0 0 10px; }
.fsg-sizes { margin-top: auto; display: block; min-height: 44px; padding: 10px 8px; border-radius: 8px; background: #00a9e0; color: #fff !important; font-weight: 700; font-size: 15px; text-align: center; text-decoration: none !important; }
.fsg-sizes:hover { background: #008bb8; }
.fsg-all { display: inline-block; margin-top: 4px; color: #006f94 !important; font-weight: 700; font-size: 16px; text-decoration: underline !important; }
.fsg a:focus-visible { outline: 3px solid #222; outline-offset: 2px; }
.fsg-wrap .fsp.fsg { max-width: 900px; margin: 32px auto; }
@media (max-width: 600px) {
	.fsp.fsg { padding: 16px; }
	.fsg-list { grid-template-columns: 1fr; gap: 10px; }
	.fsg-list li { display: grid; grid-template-columns: 96px 1fr; grid-template-rows: auto auto auto; column-gap: 12px; align-items: start; }
	.fsg-img { grid-row: 1 / 4; margin: 0; }
	.fsg-sizes { margin-top: 0; min-height: 40px; padding: 8px; }
}
.fsg .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
.fsg .fsp-lead, .fsg .fs-final { font-size: 16px; line-height: 1.45; } .fsg .fs-final { font-size: 15px; } .fsg .fsp-title { font-size: 22px; line-height: 1.25; }
.fsg .fsp-kicker { margin: 0 0 8px; } .fsg .fsp-title, .fsg .fsp-lead { display: block; } .fsg .fsp-lead { margin: 0 0 4px; }
