/* Globala delar: topprad, sidhuvud, menyer, sök, mobilmeny, Instagram, sidfot, cookie, varukorg (prompt 3–8, 21) */

/* Topprad */
.sg-topbar { display: block; background: var(--sg-rosa); color: var(--sg-svart); font-size: var(--sg-fs-13); letter-spacing: 0.04em; text-align: center; padding: 9px 16px; text-wrap: pretty; }
.sg-topbar:hover { text-decoration: underline; color: var(--sg-svart); }

/* Sidhuvud */
.sg-header { position: sticky; top: 0; z-index: var(--sg-z-header); background: var(--sg-header-bg); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-bottom: 1px solid var(--sg-linje); }
.admin-bar .sg-header { top: var(--wp-admin--admin-bar--height, 0px); }
.sg-header__inner { max-width: var(--sg-max); margin: 0 auto; padding: 16px 24px; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.sg-header__logo { display: block; flex: none; line-height: 0; }
.sg-header__logo img { height: 30px; width: auto; display: block; }
.sg-header__nav { display: flex; gap: 18px; font-size: var(--sg-fs-14); flex: 1 0 auto; flex-wrap: nowrap; align-items: center; }
.sg-nav__item { display: inline-flex; align-items: center; gap: 6px; padding: 4px 0; min-height: 24px; border: 0; border-bottom: 2px solid transparent; background: none; font: inherit; color: inherit; cursor: pointer; }
.sg-nav__link:hover, .sg-nav__item[aria-expanded="true"], .sg-nav__item:hover { border-bottom-color: var(--sg-svart); }
.sg-nav__caret { font-size: var(--sg-fs-12); }
.sg-header__search { display: flex; align-items: center; gap: 9px; border: 1px solid var(--sg-ram-kontrast); border-radius: var(--sg-r-4); padding: 9px 14px; background: var(--sg-vit); flex: 1 1 44px; max-width: 250px; min-width: 44px; min-height: var(--sg-tap); margin: 0; color: var(--sg-gra-text); }
.sg-header__search svg { flex: none; }
.sg-header__search input { flex: 1; min-width: 0; border: none; background: transparent; font-size: var(--sg-fs-foot); color: var(--sg-svart); outline: none; padding: 0; }
.sg-header__search input::placeholder { color: var(--sg-gra-text); }
.sg-header__search input::-webkit-search-cancel-button { display: none; }
.sg-header__searchbtn { display: none; margin-left: auto; color: var(--sg-svart); }
.sg-header__menubtn { display: none; }
.sg-burger { display: flex; flex-direction: column; gap: 4px; }
.sg-burger span { display: block; width: 18px; height: 2px; border-radius: 2px; background: var(--sg-svart); }
.sg-cartbtn { display: flex; align-items: center; gap: 9px; min-height: var(--sg-tap); background: var(--sg-bla); color: var(--sg-vit); border: none; border-radius: var(--sg-r-2); padding: 10px 18px; font-size: var(--sg-fs-14); font-weight: 400; flex: none; }
.sg-cartbtn:hover { background: var(--sg-bla-hover); }
.sg-cartbtn__icon { display: none; flex: none; }
.sg-cartbtn__count { background: var(--sg-badge-count); border-radius: var(--sg-r-4); min-width: 20px; padding: 1px 6px; font-size: var(--sg-fs-12); text-align: center; }

@media (max-width: 1023.98px) {
	.sg-header__nav { display: none; }
	.sg-header__menubtn { display: inline-flex; }
}
@media (min-width: 768px) and (max-width: 1023.98px) {
	.sg-header__search { order: 0; }
	.sg-cartbtn { margin-left: auto; }
}
@media (max-width: 767.98px) {
	.sg-header__inner { padding: 9px 24px 10px; gap: 8px; }
	.sg-header__search { display: none; }
	.sg-header__searchbtn { display: inline-flex; }
	.sg-cartbtn { padding: 10px 14px; }
	.sg-cartbtn__text { display: none; }
	.sg-cartbtn__icon { display: block; }
}

/* Paneler under sidhuvudet */
.sg-panel { position: relative; z-index: 2; border-top: 1px solid var(--sg-linje); background: var(--sg-vit); }
.sg-search-panel__inner { position: relative; max-width: var(--sg-max); margin: 0 auto; padding: 22px 24px; display: flex; flex-direction: column; gap: 14px; }
.sg-search-panel__field { display: none; align-items: center; gap: 9px; border: 1px solid var(--sg-ram-kontrast); border-radius: var(--sg-r-4); padding: 0 14px; background: var(--sg-vit); min-height: 48px; margin: 0 44px 0 0; color: var(--sg-gra-text); }
.sg-search-panel__field input { flex: 1; min-width: 0; min-height: 44px; border: none; background: transparent; font-size: var(--sg-fs-16); color: var(--sg-svart); outline: none; padding: 0; }
@media (max-width: 767.98px) { .sg-search-panel__field { display: flex; } }
.sg-search-panel__close { position: absolute; top: 12px; right: 12px; width: 44px; height: 44px; border-radius: var(--sg-r-2); border: 0; background: transparent; display: flex; align-items: center; justify-content: center; font-size: var(--sg-fs-20); line-height: 1; color: var(--sg-gra-text); }
.sg-search-panel__close:hover { background: var(--sg-ljusgra); }
.sg-search-panel__suggest { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding-right: 48px; }
.sg-search-panel__none { font-size: var(--sg-fs-15); color: var(--sg-gra-text); padding: 8px 0 4px; }
.sg-search-panel__results { display: flex; flex-direction: column; }
.sg-hit { display: flex; align-items: center; gap: 14px; padding: 12px 0; border-bottom: 1px solid var(--sg-linje-ljus); color: inherit; }
.sg-hit:hover { background: var(--sg-ljusrosa); }
.sg-hit__img { width: 52px; height: 52px; border-radius: var(--sg-r-4); flex: none; background: repeating-linear-gradient(135deg, var(--sg-rand) 0 8px, var(--sg-ljusgra) 8px 16px); overflow: hidden; position: relative; }
.sg-hit__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: var(--sg-vit); padding: 4px; }
.sg-hit__text { flex: 1; min-width: 0; }
.sg-hit__name { font-size: var(--sg-fs-15); font-weight: 600; letter-spacing: -0.01em; }
.sg-hit__meta { font-size: var(--sg-fs-13); color: var(--sg-gra-text); }
.sg-hit__price { font-size: var(--sg-fs-15); font-weight: 600; white-space: nowrap; }

.sg-megamenu__inner { max-width: var(--sg-max); margin: 0 auto; padding: 32px 24px 36px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr)); gap: 32px; }
.sg-megamenu__col { display: flex; flex-direction: column; gap: 11px; }
.sg-megamenu__all { font-size: var(--sg-fs-16); font-weight: 600; letter-spacing: -0.01em; }
.sg-megamenu__title { font-family: var(--sg-mono); font-size: var(--sg-fs-12); letter-spacing: 0.04em; text-transform: uppercase; }
.sg-megamenu__link { font-size: var(--sg-fs-15); }
.sg-goalmenu__inner { max-width: var(--sg-max); margin: 0 auto; padding: 28px 24px 32px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 16px; }
.sg-goalcard { display: block; border: 1px solid var(--sg-linje); border-radius: var(--sg-r-4); padding: 20px; color: inherit; }
.sg-goalcard:hover { background: var(--sg-ljusgra); }
.sg-goalcard__title { display: block; font-size: var(--sg-fs-17); font-weight: 600; letter-spacing: -0.01em; }
.sg-goalcard__body { display: block; font-size: var(--sg-fs-14); color: var(--sg-gra-text); margin-top: 6px; line-height: 1.5; }

/* Mobilmeny (prompt 5) */
.sg-mobilenav { position: fixed; inset: 0; z-index: var(--sg-z-mobilenav); background: var(--sg-vit); display: flex; flex-direction: column; overflow-y: auto; }
.sg-mobilenav__top { position: sticky; top: 0; z-index: 1; background: var(--sg-vit); border-bottom: 1px solid var(--sg-linje); padding: 16px 24px; display: flex; align-items: center; gap: 16px; flex: none; }
.sg-mobilenav__top img { height: 30px; width: auto; display: block; }
@media (max-width: 767.98px) { .sg-mobilenav__top { padding: 9px 24px 10px; gap: 8px; } }
.sg-mobilenav__nav { width: 100%; padding: 4px 24px 32px; display: flex; flex-direction: column; }
.sg-mn__top { min-height: 52px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border: 0; border-bottom: 1px solid var(--sg-linje-ljus); background: none; padding: 0; font-size: var(--sg-fs-17); font-weight: 600; letter-spacing: -0.01em; color: var(--sg-svart); text-align: left; width: 100%; }
.sg-mn__top > span:first-child { flex: 1; min-width: 0; }
.sg-mn__sign { font-size: var(--sg-fs-22); font-weight: 400; }
.sg-mn__sub { display: flex; flex-direction: column; padding: 4px 0 10px 16px; border-bottom: 1px solid var(--sg-linje-ljus); }
.sg-mn__sub a { min-height: 44px; display: flex; align-items: center; font-size: var(--sg-fs-16); }
.sg-mn__all, .sg-mn__coltitle { font-weight: 600; }
.sg-mn__collinks { display: flex; flex-direction: column; padding-left: 16px; }
.sg-mn__sub--goal { gap: 4px; padding: 6px 0 12px 16px; }
.sg-mn__sub a.sg-mn__goal { flex-direction: column; align-items: flex-start; justify-content: center; gap: 2px; padding: 6px 0; }
.sg-mn__goaltitle { font-size: var(--sg-fs-16); font-weight: 600; }
.sg-mn__goalbody { font-size: var(--sg-fs-14); color: var(--sg-gra-text); line-height: 1.45; }
body.sg-lock { overflow: hidden; }

/* Instagram (prompt 6, 21) */
.sg-ig-wrap { border-top: 1px solid var(--sg-linje); }
.sg-ig { max-width: var(--sg-max); margin: 0 auto; padding: 40px 24px 56px; }
.sg-ig__head { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 14px; }
.sg-ig__title { font-size: var(--sg-h2-instagram); line-height: 1.05; letter-spacing: -0.02em; font-weight: 600; overflow-wrap: anywhere; }
.sg-ig__lead { font-size: var(--sg-fs-17); line-height: 1.55; color: var(--sg-gra-text); max-width: 44ch; }
.sg-ig__followers { font-size: var(--sg-fs-15); color: var(--sg-gra-text); }
.sg-ig__cta { margin-top: 6px; }
.sg-ig__track { overflow-x: auto; overflow-y: hidden; margin-top: 36px; scrollbar-width: none; scroll-snap-type: x proximity; }
.sg-ig__track::-webkit-scrollbar { display: none; }
.sg-ig__row { display: flex; gap: 16px; }
.sg-ig__item { flex: none; width: 240px; aspect-ratio: 4 / 5; scroll-snap-align: start; border-radius: var(--sg-r-4); overflow: hidden; background: var(--sg-ljusgra); display: block; }
.sg-ig__item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sg-ig__foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 20px; }
.sg-ig__handle { font-size: var(--sg-fs-16); }
.sg-ig__arrows { display: flex; gap: 10px; }
.sg-ig__arrow { width: 48px; height: 48px; border-radius: var(--sg-r-2); background: var(--sg-rosa); color: var(--sg-svart); border: 0; display: flex; align-items: center; justify-content: center; font-size: var(--sg-fs-20); }

/* Sidfot (prompt 6) */
.sg-footer { background: var(--sg-rosa); border-top: 1px solid var(--sg-linje); }
.sg-footer__grid { max-width: var(--sg-max); margin: 0 auto; padding: 72px 24px 64px; display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 48px 32px; }
@media (min-width: 768px) and (max-width: 1023.98px) { .sg-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767.98px) { .sg-footer__grid { grid-template-columns: minmax(0, 1fr); padding: 48px 24px 40px; } }
.sg-footer__brand { display: flex; flex-direction: column; gap: 14px; }
.sg-footer__logo { height: 32px; width: auto; max-width: 100%; object-fit: contain; align-self: flex-start; display: block; }
.sg-footer__brand p { font-size: var(--sg-fs-foot); color: var(--sg-gra-text); line-height: 1.6; max-width: 34ch; }
.sg-footer__social { display: flex; flex-direction: column; gap: 10px; margin-top: 6px; }
.sg-footer__socialtitle { font-weight: 600; font-size: var(--sg-fs-14); }
.sg-footer__icons { display: flex; flex-wrap: wrap; gap: 10px; }
.sg-socialbtn { width: 44px; height: 44px; border-radius: var(--sg-r-2); border: 1px solid var(--sg-ram); color: var(--sg-svart); display: flex; align-items: center; justify-content: center; }
.sg-socialbtn:hover { background: var(--sg-svart); border-color: var(--sg-svart); color: var(--sg-vit); }
.sg-ig-icon { width: 19px; height: 19px; border: 1.8px solid currentColor; border-radius: 6px; display: flex; align-items: center; justify-content: center; position: relative; }
.sg-ig-icon__ring { width: 8px; height: 8px; border: 1.8px solid currentColor; border-radius: var(--sg-r-round); display: block; }
.sg-ig-icon__dot { position: absolute; top: 2px; right: 2px; width: 2.4px; height: 2.4px; border-radius: var(--sg-r-round); background: currentColor; }
.sg-fb-icon { font-size: var(--sg-fs-20); font-weight: 600; line-height: 1; }
.sg-footer__col { display: flex; flex-direction: column; gap: 0; font-size: var(--sg-fs-foot); }
.sg-footer__col a { min-height: 44px; display: flex; align-items: center; }
@media (min-width: 1024px) { .sg-footer__col { gap: 11px; } .sg-footer__col a { min-height: 24px; } }
.sg-footer__coltitle { font-weight: 600; }
.sg-footer__bottom { border-top: 1px solid var(--sg-linje); }
.sg-footer__bottominner { max-width: var(--sg-max); margin: 0 auto; padding: 18px 24px; font-size: var(--sg-fs-13); color: var(--sg-gra-text); display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px 24px; }
.sg-footer__legal { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.sg-footer__policies { display: flex; flex-wrap: wrap; gap: 18px; }
.sg-footer__policies a, .sg-footer__cookiebtn { text-decoration: underline; min-height: var(--sg-tap); display: flex; align-items: center; color: var(--sg-gra-text); background: none; border: 0; padding: 0; font-size: inherit; }

/* Cookiebanner (prompt 7) */
.sg-cookie { position: fixed; left: 0; right: 0; bottom: 0; z-index: var(--sg-z-cookie); padding: 16px; display: flex; justify-content: center; pointer-events: none; }
.sg-cookie__panel { pointer-events: auto; width: 100%; max-width: 720px; max-height: calc(100vh - 32px); overflow-y: auto; background: var(--sg-vit); border: 1px solid var(--sg-linje); border-radius: var(--sg-r-4); box-shadow: var(--sg-shadow-cookie); padding: clamp(20px, 3vw, 28px); display: flex; flex-direction: column; gap: 16px; outline: none; }
.sg-cookie__title { font-size: var(--sg-fs-20); font-weight: 600; letter-spacing: -0.01em; }
.sg-cookie__text { font-size: var(--sg-fs-body); line-height: 1.6; text-wrap: pretty; }
.sg-cookie__text a { text-decoration: underline; }
.sg-cookie__list { display: flex; flex-direction: column; border-top: 1px solid var(--sg-linje-ljus); }
.sg-cookie__row { display: flex; align-items: center; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--sg-linje-ljus); }
.sg-cookie__rowtext { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.sg-cookie__rowtitle { font-size: var(--sg-fs-16); font-weight: 600; }
.sg-cookie__rowbody, .sg-cookie__always { font-size: var(--sg-fs-14); color: var(--sg-gra-text); }
.sg-cookie__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.sg-cookie__btn { flex: 1 1 180px; min-height: 48px; padding: 15px 28px; }
.sg-toggle { position: relative; width: 46px; height: 26px; flex: none; border: none; border-radius: var(--sg-r-round); background: var(--sg-ram-kontrast); padding: 0; }
.sg-toggle[aria-checked="true"] { background: var(--sg-svart); }
.sg-toggle__knob { position: absolute; top: 2px; left: 2px; width: 22px; height: 22px; border-radius: var(--sg-r-round); background: var(--sg-vit); transition: left 0.15s; }
.sg-toggle[aria-checked="true"] .sg-toggle__knob { left: 22px; }

/* Varukorgspanel (prompt 8) */
.sg-cart { position: fixed; inset: 0; z-index: var(--sg-z-cart); display: flex; justify-content: flex-end; }
.sg-cart__backdrop { position: absolute; inset: 0; background: var(--sg-overlay); }
.sg-cart__panel { position: relative; width: 440px; max-width: 92vw; background: var(--sg-vit); height: 100%; display: flex; flex-direction: column; animation: sg-fade 0.18s ease-out; }
.sg-cart__top { padding: 22px 26px; border-bottom: 1px solid var(--sg-linje); display: flex; align-items: center; justify-content: space-between; }
.sg-cart__title { font-size: var(--sg-fs-19); font-weight: 600; letter-spacing: -0.01em; }
.sg-cart__close { font-size: 24px; line-height: 1; color: var(--sg-gra-text); width: 44px; height: 44px; margin-right: -12px; display: flex; align-items: center; justify-content: center; border-radius: var(--sg-r-2); border: 0; background: none; }
.sg-cart__close:hover { background: var(--sg-ljusgra); }
.sg-cart__ship { padding: 18px 26px; border-bottom: 1px solid var(--sg-linje); background: var(--sg-ljusgra-2); display: flex; flex-direction: column; gap: 10px; }
.sg-cart__shiptext { font-size: var(--sg-fs-15); line-height: 1.5; }
.sg-cart__shiptext strong { font-weight: 600; }
.sg-cart__reached { display: flex; align-items: center; gap: 8px; font-size: var(--sg-fs-14); color: var(--sg-ok); font-weight: 600; }
.sg-cart__tick { width: 18px; height: 18px; flex: none; border-radius: var(--sg-r-round); background: var(--sg-ok); color: var(--sg-vit); font-size: var(--sg-fs-12); display: flex; align-items: center; justify-content: center; }
.sg-cart__bar { height: 6px; border-radius: var(--sg-r-4); background: var(--sg-linje); overflow: hidden; }
.sg-cart__fill { height: 100%; border-radius: var(--sg-r-4); background: var(--sg-svart); width: 0; }
.sg-cart__fill.is-reached { background: var(--sg-ok); }
.sg-cart__list { flex: 1; overflow: auto; padding: 8px 26px; }
.sg-cart__empty { padding: 48px 0; text-align: center; color: var(--sg-gra-text); font-size: var(--sg-fs-15); }
.sg-line { display: flex; gap: 14px; padding: 16px 0; border-bottom: 1px solid var(--sg-linje-ljus); }
.sg-line__img { width: 72px; height: 72px; flex: none; border-radius: var(--sg-r-4); overflow: hidden; position: relative; background: var(--sg-stripe); }
.sg-line__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 6px; background: var(--sg-vit); }
.sg-line__body { flex: 1; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.sg-line__name { font-size: var(--sg-fs-15); font-weight: 600; letter-spacing: -0.01em; }
.sg-line__variant { font-size: var(--sg-fs-13); color: var(--sg-gra-text); }
.sg-line__ctrl { display: flex; align-items: center; gap: 12px; margin-top: 2px; }
.sg-line__remove { font-size: var(--sg-fs-13); color: var(--sg-gra-text); min-height: var(--sg-tap); display: inline-flex; align-items: center; background: none; border: 0; padding: 0; }
.sg-line__sum { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.sg-line__total { font-size: var(--sg-fs-15); font-weight: 600; white-space: nowrap; }
.sg-line__old { font-size: var(--sg-fs-13); color: var(--sg-gra-text); text-decoration: line-through; white-space: nowrap; }
.sg-qty { display: flex; align-items: center; border: 1px solid var(--sg-ram); border-radius: var(--sg-r-4); }
.sg-qty button { padding: 5px 11px; font-size: var(--sg-fs-14); min-width: var(--sg-tap); min-height: var(--sg-tap); display: inline-flex; align-items: center; justify-content: center; border: 0; background: none; }
.sg-qty span { font-size: var(--sg-fs-14); min-width: 18px; text-align: center; }
.sg-cart__tip { margin-top: 16px; padding: 14px 16px; border-radius: var(--sg-r-4); background: var(--sg-ljusrosa); display: flex; flex-direction: column; gap: 6px; font-size: var(--sg-fs-14); line-height: 1.45; }
.sg-cart__tip a { align-self: flex-start; font-weight: 600; text-decoration: underline; }
.sg-cart__bottom { padding: 22px 26px; border-top: 1px solid var(--sg-linje); display: flex; flex-direction: column; gap: 12px; }
.sg-cart__sum { display: flex; justify-content: space-between; font-size: var(--sg-fs-15); }
.sg-cart__sum--total { font-size: var(--sg-fs-19); font-weight: 600; }
.sg-cart__shipcost { display: flex; align-items: center; gap: 8px; }
.sg-cart__shipcost s { color: var(--sg-gra-text); }
.sg-cart__shipcost strong { font-weight: 600; }
.sg-cart__freeline { display: flex; align-items: center; justify-content: center; gap: 9px; font-size: var(--sg-fs-14); padding-top: 4px; }
.sg-cart__checkout { width: 100%; padding: 16px; font-size: var(--sg-fs-16); }
.sg-cart__pay { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.sg-cart__paytitle { font-size: var(--sg-fs-14); font-weight: 600; }
.sg-cart__paysub { font-size: var(--sg-fs-14); color: var(--sg-gra-text); }
.sg-cart__continue { text-align: center; font-size: var(--sg-fs-14); color: var(--sg-gra-text); background: none; border: 0; min-height: var(--sg-tap); }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto !important; }
	*, *::before, *::after { animation: none !important; transition: none !important; }
}