/* Smarthome Kit – uses theme.json colors when available */
:root {
	--shk-ink: var(--wp--preset--color--contrast, #111);
	--shk-bg: var(--wp--preset--color--base, #fff);
	--shk-soft: var(--wp--preset--color--accent-5, #f4f4f2);
	--shk-line: var(--wp--preset--color--accent-6, rgba(0,0,0,.1));
	--shk-accent: var(--wp--preset--color--accent-1, #0a6cff);
	--shk-ok: #1f8f55;
	--shk-radius: 14px;
}

/* Trust badges */
.shk-badges { list-style: none; margin: 1.25rem 0 0; padding: 0; display: grid; gap: .6rem 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); font-size: .875rem; color: var(--shk-ink); }
.shk-badges li { display: flex; align-items: center; gap: .5rem; margin: 0; }
.shk-badges .shk-ico { flex: none; opacity: .8; }
.shk-badges--wide { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 1rem 2rem; font-size: 1rem; margin: 0; }
.shk-badges--wide li { gap: .75rem; }
.wp-block-woocommerce-cart + .shk-badges, .wp-block-woocommerce-checkout + .shk-badges { max-width: 640px; margin: 1.5rem auto 3rem; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); justify-items: center; opacity: .85; }

/* Low stock */
.shk-low { display: inline-flex; align-items: center; gap: .5rem; font-size: .875rem; font-weight: 600; color: #b54708; margin: 0 0 .75rem; }
.shk-low::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 4px rgba(181,71,8,.15); }

/* Free-shipping bar */
.shk-ship { max-width: 640px; margin: 0 auto 1.5rem; padding: .9rem 1.1rem; border-radius: var(--shk-radius); background: var(--shk-soft); font-size: .9rem; }
.shk-ship[hidden] { display: none; }
.shk-ship__msg { margin: 0 0 .5rem; font-weight: 500; }
.shk-ship__track { height: 6px; border-radius: 99px; background: var(--shk-line); overflow: hidden; }
.shk-ship__bar { height: 100%; border-radius: 99px; background: var(--shk-accent); transition: width .5s cubic-bezier(.2,.8,.2,1); }
.shk-ship.is-done .shk-ship__bar { background: var(--shk-ok); }
.shk-ship.is-done .shk-ship__msg { color: var(--shk-ok); }
.shk-ship--drawer { margin: 0 16px 12px; }

/* Sticky add-to-cart */
.shk-sticky { position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; transform: translateY(110%); transition: transform .3s cubic-bezier(.2,.8,.2,1); background: color-mix(in srgb, var(--shk-bg) 88%, transparent); backdrop-filter: saturate(180%) blur(16px); -webkit-backdrop-filter: saturate(180%) blur(16px); border-top: 1px solid var(--shk-line); }
.shk-sticky.is-visible { transform: none; }
.shk-sticky__in { max-width: 1200px; margin: 0 auto; padding: .6rem 16px; display: flex; align-items: center; gap: .9rem; }
.shk-sticky__img { width: 44px; height: 44px; object-fit: cover; border-radius: 8px; flex: none; }
.shk-sticky__txt { display: flex; flex-direction: column; min-width: 0; flex: 1; line-height: 1.25; }
.shk-sticky__txt strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: .95rem; }
.shk-sticky__price { font-size: .875rem; opacity: .75; }
.shk-sticky__price del { opacity: .6; }
.shk-sticky__btn { flex: none; border: 0; cursor: pointer; background: var(--shk-ink); color: var(--shk-bg); font: inherit; font-weight: 600; font-size: .95rem; padding: .75rem 1.4rem; border-radius: 99px; transition: transform .15s; }
.shk-sticky__btn:hover { transform: scale(1.03); }
.shk-sticky__btn:focus-visible { outline: 2px solid var(--shk-accent); outline-offset: 2px; }
body.shk-has-sticky { padding-bottom: 68px; }
@media (max-width: 480px) { .shk-sticky__img { display: none; } .shk-sticky__btn { padding: .7rem 1.1rem; } }

/* Swatches */
.shk-sw__native { position: absolute !important; width: 1px !important; height: 1px !important; opacity: 0 !important; pointer-events: none; }
.shk-sw { display: flex; flex-wrap: wrap; gap: .5rem; margin: .25rem 0 .5rem; }
.shk-sw__btn { font: inherit; font-size: .9rem; min-height: 44px; padding: .55rem 1rem; border-radius: 10px; border: 1.5px solid var(--shk-line); background: var(--shk-bg); color: var(--shk-ink); cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.shk-sw__btn:hover { border-color: var(--shk-ink); }
.shk-sw__btn.is-on { border-color: var(--shk-ink); box-shadow: inset 0 0 0 1px var(--shk-ink); font-weight: 600; }
.shk-sw__btn:disabled { opacity: .35; text-decoration: line-through; cursor: not-allowed; }
.variations_form table.variations td, .variations_form table.variations th { display: block; padding: 0; text-align: left; }
.variations_form table.variations th label { font-weight: 600; font-size: .9rem; }

/* Prev / next */
.shk-crumbs { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.shk-crumbs > * { margin: 0 !important; }
.shk-pn { display: flex; gap: 1.25rem; font-size: .85rem; }
.shk-pn a { text-decoration: none; color: inherit; opacity: .7; }
.shk-pn a:hover { opacity: 1; }

/* Instant search */
.shk-s { position: relative; }
.shk-s__list { position: absolute; top: calc(100% + 8px); right: 0; width: min(420px, calc(100vw - 32px)); z-index: 100; background: var(--shk-bg); color: var(--shk-ink); border: 1px solid var(--shk-line); border-radius: var(--shk-radius); box-shadow: 0 20px 50px -12px rgba(0,0,0,.25); padding: .4rem; }
.shk-s__list[hidden] { display: none; }
.shk-s__item { display: flex; align-items: center; gap: .75rem; padding: .5rem; border-radius: 10px; text-decoration: none; color: inherit; }
.shk-s__item img { width: 48px; height: 48px; object-fit: cover; border-radius: 8px; background: var(--shk-soft); flex: none; }
.shk-s__item:hover, .shk-s__item.is-active { background: var(--shk-soft); }
.shk-s__txt { display: flex; flex-direction: column; min-width: 0; font-size: .9rem; line-height: 1.3; }
.shk-s__name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.shk-s__price { opacity: .7; font-size: .85rem; }
.shk-s__empty { margin: 0; padding: .75rem; font-size: .9rem; opacity: .7; }
.shk-s__all { display: block; padding: .65rem .5rem .4rem; font-size: .85rem; font-weight: 600; text-decoration: none; color: var(--shk-accent); border-top: 1px solid var(--shk-line); margin-top: .25rem; }

/* Category tiles */
.shk-cats { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); gap: 1rem; }
.shk-cat { position: relative; display: block; aspect-ratio: 4 / 5; border-radius: 20px; overflow: hidden; background: var(--shk-soft); color: var(--shk-ink); text-decoration: none; isolation: isolate; }
.shk-cat__img, .shk-cat__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.8,.2,1); }
.shk-cat:hover .shk-cat__img img { transform: scale(1.05); }
.shk-cat__name { position: absolute; left: 1rem; bottom: 1rem; z-index: 1; padding: .5rem .9rem; border-radius: 99px; background: color-mix(in srgb, var(--shk-bg) 85%, transparent); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); font-weight: 600; font-size: .95rem; }
.shk-cat--noimg { background: linear-gradient(145deg, var(--shk-soft), color-mix(in srgb, var(--shk-accent) 18%, var(--shk-soft))); }

/* Distraction-free checkout */
body.shk-dfc header .wp-block-navigation,
body.shk-dfc header .wp-block-search,
body.shk-dfc header .wp-block-woocommerce-mini-cart,
body.shk-dfc header .wp-block-woocommerce-customer-account,
body.shk-dfc footer.wp-block-template-part,
body.shk-dfc .shk-topbar { display: none !important; }

@media (prefers-reduced-motion: reduce) {
	.shk-sticky, .shk-ship__bar, .shk-cat__img img { transition: none; }
}