/*
 * New shop page "Shop B · Nach Bedürfnis" (inc/jm-shop-b.php, woocommerce/archive-product.php).
 * Mobile first (375 px), breakpoints like the theme: 834 px and 1194 px.
 */
.jo-sb{--jo-sb-ink:#191919;--jo-sb-muted:#5f574e;--jo-sb-line:#d3cdc5;--jo-sb-card:#fff;--jo-sb-soft:#f6f4f1;color:var(--jo-sb-ink);font-family:"Open Sans",sans-serif}
.jo-sb,.jo-sb *,.jo-sb *::before,.jo-sb *::after{box-sizing:border-box}
.jo-sb [hidden]{display:none!important}
.jo-sb__inner{max-width:1240px;margin:0 auto;padding:0 16px}
.jo-sb a{color:var(--jo-sb-ink)}
.jo-sb a:focus-visible{outline:3px solid var(--jo-sb-ink);outline-offset:2px}

/* head: breadcrumb, headline, intro, review percentage */
.jo-sb--head .jo-sb__inner{display:flex;flex-direction:column;gap:8px;padding-top:18px;padding-bottom:16px}
.jo-sb-crumbs{font-size:12px;line-height:1.4;color:var(--jo-sb-muted)}
.jo-sb-crumbs a{color:var(--jo-sb-muted);text-decoration:underline}
.jo-sb-title{margin:0;font-family:"Anton",sans-serif;font-weight:400;font-size:38px;line-height:1.02;letter-spacing:0;text-transform:uppercase;color:var(--jo-sb-ink)}
/* search term line of the H1 above the question, small like the labels of the page */
.jo-sb-title__seo{display:block;margin:0 0 6px;font-family:"Open Sans",sans-serif;font-size:12px;font-weight:600;line-height:1.35;letter-spacing:.04em;color:var(--jo-sb-muted)}
.jo-sb-intro{margin:0;font-size:15px;line-height:1.45}
.jo-sb-intro__sign{color:var(--jo-sb-muted);white-space:nowrap}
.jo-sb .jo-sb-reviews{position:static;margin:4px 0 0;text-align:left}
.jo-sb .jo-sb-reviews .review-percentage{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 10px;border:1.5px solid var(--jo-sb-ink);border-radius:999px}
.jo-sb .jo-sb-reviews .review-percentage svg{width:auto;height:26px;flex:0 0 auto}
.jo-sb .jo-sb-reviews .review-percentage .text{font-size:11px;line-height:1.2;font-weight:600;text-transform:uppercase}
.jo-sb .jo-sb-reviews .review-percentage .text br{display:none}
.jo-sb .jo-sb-reviews .review-percentage .text span{margin-left:6px;font-family:"Tomato-Ketchup",sans-serif;font-size:18px;line-height:1;text-transform:none;vertical-align:-2px}

/* entry tiles */
.jo-sb--entries .jo-sb__inner{padding-bottom:24px}
.jo-sb-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0;padding:0;list-style:none}
.jo-sb-tiles>li{margin:0;padding:0;min-width:0}
.jo-sb-tiles>li::before{content:none}
.jo-sb .jo-sb-tile{display:flex;flex-direction:column;height:100%;overflow:hidden;border-radius:12px;background:var(--jo-sb-card);color:var(--jo-sb-ink);text-decoration:none}
.jo-sb-tile__img{display:block;aspect-ratio:16/10;overflow:hidden;background:#e3dfda}
.jo-sb-tile__img img{display:block;width:100%;height:100%;object-fit:cover}
.jo-sb-tile__body{display:flex;flex:1;flex-direction:column;gap:2px;padding:10px 12px 12px}
.jo-sb-tile__title{font-family:"Anton",sans-serif;font-size:16px;line-height:1.15;text-transform:uppercase;overflow-wrap:anywhere;hyphens:auto}
.jo-sb-tile__line{font-size:12px;line-height:1.35;color:var(--jo-sb-muted)}

/* sections per entry */
.jo-sb-section{padding:24px 0;border-top:1px solid var(--jo-sb-line);scroll-margin-top:70px}
.jo-sb-section .jo-sb__inner{display:flex;flex-direction:column;gap:12px}
.jo-sb-section__head{display:flex;align-items:flex-end;justify-content:space-between;gap:10px}
.jo-sb .jo-sb-section__title{margin:0;font-family:"Anton",sans-serif;font-weight:400;font-size:26px;line-height:1.05;letter-spacing:0;text-transform:uppercase;color:var(--jo-sb-ink)}
.jo-sb .jo-sb-section__more{flex:0 0 auto;display:inline-flex;align-items:center;min-height:44px;font-size:13px;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.jo-sb-tip{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:12px;background:var(--jo-sb-card)}
.jo-sb-tip__img{flex:0 0 auto;width:36px;height:36px;border-radius:999px;object-fit:cover}
.jo-sb .jo-sb-tip__text{margin:0;font-size:14px;line-height:1.45}
.jo-sb-rail{display:flex;gap:12px;margin:0 -16px;padding:0 16px 6px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding:0 16px;scrollbar-width:thin}
.jo-sb-rail>.product-grid-item{flex:0 0 58%;scroll-snap-align:start}

/* product cards in this page (template-parts/woocommerce-product.php) */
.jo-sb .product-grid-item{display:flex;flex-direction:column;min-width:0;overflow:hidden;border-radius:10px;background:var(--jo-sb-card)}
.jo-sb .product-grid-item .product-image>a:not(.jm-qa){display:block;text-decoration:none}
/* square photo box via padding, not aspect-ratio: older Safari (17.x) sizes aspect-ratio boxes in the grid rails wrongly */
.jo-sb .product-grid-item .image-container{position:relative;height:0;padding-bottom:100%;overflow:hidden;border-radius:0;background:#e3dfda}
.jo-sb .product-grid-item .image-container img{position:absolute;top:0;left:0;display:block;width:100%;height:100%;object-fit:cover}
.jo-sb .product-grid-item .badges{top:8px;left:8px;width:calc(100% - 16px);grid-row-gap:6px}
.jo-sb .product-grid-item .badges .badge{padding:3px 6px;font-size:9px;letter-spacing:.06em}
.jo-sb .product-grid-item .badges .badge svg{display:none}
.jo-sb .product-grid-item .info{display:flex;flex:1;flex-direction:column;gap:3px;padding:10px 10px 12px}
.jo-sb .product-grid-item .rating{display:flex;align-items:center;gap:4px;margin:0;font-size:11px;color:var(--jo-sb-ink)}
.jo-sb .product-grid-item .star-rating{float:none;margin:0;font-size:11px;letter-spacing:1px;width:5.9em;color:var(--jo-sb-ink)}
.jo-sb .product-grid-item .star-rating::before{color:var(--jo-sb-line)}
.jo-sb .product-grid-item .rating-count{font-size:11px;color:var(--jo-sb-muted)}
.jo-sb .product-grid-item h4{min-height:0;margin:0;font-family:"Anton",sans-serif;font-weight:400;font-size:16px;line-height:1.15;letter-spacing:0;text-transform:uppercase}
.jo-sb .product-grid-item h4 a{min-height:0;font:inherit;color:var(--jo-sb-ink);text-decoration:none}
.jo-sb .product-grid-item .price{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 6px;margin-top:auto;padding-top:4px;font-size:15px;line-height:1.3;font-weight:700}
.jo-sb .product-grid-item .price ins{order:-1;text-decoration:none}
.jo-sb .product-grid-item .price del{display:inline;opacity:1;font-size:12px;font-weight:400;color:var(--jo-sb-muted)}
.jo-sb .product-grid-item .price .woocommerce-price-suffix{display:none}
.jo-sb .product-grid-item .jo-card-unit-price,.jo-sb .product-grid-item .jo-card-unit-price p{margin:0;font-size:11px;line-height:1.35;color:var(--jo-sb-muted)}
.jo-sb .product-grid-item .jo-pp-shipping-note,.jo-sb .product-grid-item .jo-pp-shipping-note p{margin:0;font-size:10px;line-height:1.35;color:var(--jo-sb-muted)}
.jo-sb .product-grid-item .jo-pp-shipping-note a{color:var(--jo-sb-muted)}

/* all products */
.jo-sb-all{padding:24px 0 32px;border-top:1px solid var(--jo-sb-line);background:var(--jo-sb-card);scroll-margin-top:70px}
.jo-sb-all .jo-sb__inner{display:flex;flex-direction:column;gap:12px}
.jo-sb .jo-sb-all__title{margin:0;font-family:"Anton",sans-serif;font-weight:400;font-size:26px;line-height:1.05;letter-spacing:0;text-transform:uppercase;color:var(--jo-sb-ink)}
.jo-sb-chips{display:flex;gap:8px;margin:0 -16px;padding:0 16px 2px;overflow-x:auto;white-space:nowrap;scrollbar-width:none}
.jo-sb-chips::-webkit-scrollbar{display:none}
.jo-sb .jo-sb-chip{display:inline-flex;flex:0 0 auto;align-items:center;min-height:40px;padding:0 14px;border:1px solid var(--jo-sb-line);border-radius:999px;background:var(--jo-sb-card);font-size:14px;font-weight:600;color:var(--jo-sb-ink);text-decoration:none;cursor:pointer}
.jo-sb .jo-sb-chip.is-active{border-color:var(--jo-sb-ink);background:var(--jo-sb-ink);color:#fff;font-weight:700}
.jo-sb .jo-sb-all__more{display:flex;align-items:center;justify-content:center;min-height:52px;padding:0 16px;border-radius:6px;background:var(--jo-sb-ink);color:#fff;font-size:14px;font-weight:700;letter-spacing:.06em;text-align:center;text-transform:uppercase;text-decoration:none}
.jo-sb-all__list{display:none}
.jo-sb-all.is-open .jo-sb-all__list,.jo-sb-all:target .jo-sb-all__list{display:block}
.jo-sb-all.is-open .jo-sb-all__more,.jo-sb-all:target .jo-sb-all__more{display:none}
.jo-sb-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.jo-sb-all .product-grid-item{background:var(--jo-sb-soft)}
.jo-sb .jo-sb-all__empty{margin:12px 0 0;font-size:15px;color:var(--jo-sb-muted)}
.jo-sb-soldout{display:flex;flex-direction:column;gap:4px;margin-top:16px;padding:14px 16px;border-radius:12px;background:var(--jo-sb-soft)}
.jo-sb .jo-sb-soldout__title{margin:0 0 4px;font-family:"Open Sans",sans-serif;font-size:13px;font-weight:700;line-height:1.4;letter-spacing:0;text-transform:none;color:var(--jo-sb-ink)}
.jo-sb-soldout__list{margin:0;padding:0;list-style:none}
.jo-sb-soldout__list>li{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0;padding:6px 0;border-top:1px solid var(--jo-sb-line)}
.jo-sb-soldout__list>li::before{content:none}
.jo-sb .jo-sb-soldout__name{font-size:14px;line-height:1.35;text-decoration:none}
.jo-sb .jo-sb-soldout__notify{display:inline-flex;flex:0 0 auto;align-items:center;min-height:40px;padding:0 12px;border:1px solid var(--jo-sb-ink);border-radius:6px;font-size:12px;font-weight:700;text-decoration:none}

/* price hunters (2026-11-12): shortcuts at the top, count + sort box above "Alle Produkte" */
.jo-sb-quick{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:6px}
.jo-sb .jo-sb-quick__link{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border:1.5px solid var(--jo-sb-ink);border-radius:6px;background:var(--jo-sb-card);font-size:14px;font-weight:700;line-height:1.2;color:var(--jo-sb-ink);text-decoration:none}
.jo-sb .jo-sb-quick__link svg{flex:0 0 auto}
.jo-sb .jo-sb-quick__chip{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid var(--jo-sb-line);border-radius:999px;background:var(--jo-sb-card);font-size:14px;font-weight:600;line-height:1.2;color:var(--jo-sb-ink);text-decoration:none}
.jo-sb .jo-sb-quick__link:hover,.jo-sb .jo-sb-quick__chip:hover{border-color:var(--jo-sb-ink)}
.jo-sb-all__bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;margin:0 0 12px}
.jo-sb .jo-sb-all__count{margin:0;font-size:14px;line-height:1.4;color:var(--jo-sb-muted)}
.jo-sb-sort{display:inline-flex;align-items:center;gap:8px;margin:0;font-size:14px;line-height:1.3}
.jo-sb-sort__label{font-weight:600;color:var(--jo-sb-ink)}
.jo-sb .jo-sb-sort__select{min-height:44px;margin:0;padding:0 34px 0 12px;border:1px solid var(--jo-sb-line);border-radius:6px;background:var(--jo-sb-card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%23191919' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 12px center;font-family:inherit;font-size:14px;font-weight:600;color:var(--jo-sb-ink);-webkit-appearance:none;appearance:none;cursor:pointer}
.jo-sb .jo-sb-sort__select:focus-visible{outline:3px solid var(--jo-sb-ink);outline-offset:2px}

/* gift teaser (inc/jm-geschenke.php) between tiles and sections: keep the page's rhythm */
.jo-shop-b .jm-gift-teaser{margin-bottom:24px}

@media only screen and (min-width:834px){
  .jo-sb__inner{padding:0 20px}
  .jo-sb--head .jo-sb__inner{gap:12px;padding-top:40px;padding-bottom:20px}
  .jo-sb-crumbs{font-size:13px}
  .jo-sb-title{font-size:clamp(44px,5vw,66px)}
  .jo-sb-title__seo{margin-bottom:8px;font-size:13px}
  .jo-sb-intro{max-width:760px;font-size:17px;line-height:1.5}
  .jo-sb-quick{margin-top:4px}
  .jo-sb-all__bar{margin-bottom:16px}
  .jo-sb--entries .jo-sb__inner{padding-bottom:40px}
  .jo-sb-tiles{display:flex;gap:14px;overflow-x:auto;padding-bottom:6px}
  .jo-sb-tiles>li{flex:1 0 180px}
  .jo-sb-tiles>.jo-sb-tiles__all{display:none}
  .jo-sb-tile__img{aspect-ratio:4/3}
  .jo-sb-tile__body{gap:4px;padding:12px 14px 16px}
  .jo-sb-tile__title{font-size:19px;line-height:1.1}
  .jo-sb-tile__line{font-size:13px}
  .jo-sb-section{padding:48px 0;scroll-margin-top:100px}
  .jo-sb-section .jo-sb__inner{gap:20px}
  .jo-sb .jo-sb-section__title,.jo-sb .jo-sb-all__title{font-size:clamp(30px,3.4vw,42px)}
  .jo-sb .jo-sb-section__more{font-size:14px}
  .jo-sb-tip{gap:14px;padding:16px 18px}
  .jo-sb-tip__img{width:44px;height:44px}
  .jo-sb .jo-sb-tip__text{font-size:15px;line-height:1.5}
  .jo-sb-rail{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin:0;padding:0;overflow:visible}
  .jo-sb-rail>.product-grid-item{flex:none}
  .jo-sb .product-grid-item .info{gap:6px;padding:14px 14px 16px}
  .jo-sb .product-grid-item .badges{top:10px;left:10px}
  .jo-sb .product-grid-item .badges .badge{font-size:11px;padding:4px 8px}
  .jo-sb .product-grid-item .rating,.jo-sb .product-grid-item .star-rating,.jo-sb .product-grid-item .rating-count{font-size:13px}
  .jo-sb .product-grid-item h4{font-size:19px;line-height:1.1}
  .jo-sb .product-grid-item .price{font-size:18px}
  .jo-sb .product-grid-item .price del{font-size:14px}
  .jo-sb .product-grid-item .jo-pp-shipping-note,.jo-sb .product-grid-item .jo-pp-shipping-note p{font-size:12px}
  .jo-sb-all{padding:48px 0 64px;scroll-margin-top:100px}
  .jo-sb-all .jo-sb__inner{gap:18px}
  .jo-sb-chips{flex-wrap:wrap;margin:0;padding:0;overflow:visible}
  .jo-sb-all .jo-sb-all__more{display:none}
  .jo-sb-all .jo-sb-all__list{display:block}
  .jo-sb-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
  .jo-sb-soldout{padding:20px}
  .jo-sb .jo-sb-soldout__title{font-size:14px}
  .jo-sb .jo-sb-soldout__name{font-size:15px}
  .jo-sb .jo-sb-soldout__notify{font-size:13px}
}
@media only screen and (min-width:1194px){
  .jo-sb-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (prefers-reduced-motion:no-preference){
  .jo-sb-rail{scroll-behavior:smooth}
}

/* Phone check 2026-11-12 (phones only, desktop unchanged): text at least 12 px, bigger tap areas (padding on inline
   links widens the tap area without moving anything), swipe rows without scrollbars, tile photos keep the title
   printed at the top of the product photos */
@media only screen and (max-width:833.98px){
  .jo-sb-crumbs a{padding:14px 0}
  .jo-sb .jo-sb-reviews .review-percentage .text{font-size:12px}
  .jo-sb-tile__img img{object-position:50% 10%}
  .jo-sb-rail{margin-top:-6px;padding-top:6px;padding-bottom:8px;overflow-y:hidden;scrollbar-width:none}
  .jo-sb-rail::-webkit-scrollbar{display:none}
  .jo-sb .product-grid-item h4 a{padding:13px 0}
  .jo-sb .product-grid-item .badges .badge{padding:4px 7px;font-size:12px;letter-spacing:.03em}
  .jo-sb .product-grid-item .rating,.jo-sb .product-grid-item .star-rating,.jo-sb .product-grid-item .rating-count{font-size:12px}
  .jo-sb .product-grid-item .jo-card-unit-price,.jo-sb .product-grid-item .jo-card-unit-price p{font-size:12px}
  .jo-sb .product-grid-item .jo-pp-shipping-note,.jo-sb .product-grid-item .jo-pp-shipping-note p{font-size:12px}
  .jo-sb .jo-sb-chip{min-height:44px}
  .jo-sb .jo-sb-soldout__name{margin:-10px 0;padding:10px 0}
  .jo-sb .jo-sb-soldout__notify{min-height:44px}
}