/* Jahoba Haat Product Page — scoped to .jhpp*. Never styles the app shell. */
.jhpp{
  --jhpp-green:var(--jh-green,#1f7a3d);--jhpp-green-dark:var(--jh-green-d,#17612f);--jhpp-green-light:var(--jh-green-l,#e8f3ea);
  --jhpp-text:var(--jh-text,#1e2a1f);--jhpp-muted:var(--jh-muted,#6b6458);--jhpp-border:var(--jh-line,#e6e1d3);
  --jhpp-surface:var(--jh-cream,#faf6ec);--jhpp-accent:var(--jh-orange,#b85c0a);
}
.jhpp-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
div.product.jhpp,div.product.jhpp *{box-sizing:border-box}
div.product.jhpp{max-width:1200px;margin:0 auto;padding:0 12px 16px;color:var(--jhpp-text);display:block}
div.product.jhpp>*{min-width:0}
div.product.jhpp a{text-decoration:none}

/* Back / breadcrumb */
.jhpp-back{display:inline-flex;align-items:center;gap:2px;min-height:44px;padding:0 12px 0 8px;margin:0 0 0 4px;color:var(--jh-green,#1f7a3d);font-weight:600;font-size:14px}
.jhpp-back:hover{text-decoration:underline}
.jhpp-page .woocommerce-breadcrumb{display:none;max-width:1200px;margin:0 auto;padding:12px 12px 0;font-size:13px;color:var(--jh-muted,#6b6458)}
.jhpp-page .woocommerce-breadcrumb a{color:var(--jh-muted,#6b6458)}
.jhpp-page .woocommerce-breadcrumb a:hover{color:var(--jh-green,#1f7a3d)}

/* Gallery */
.jhpp-gal{margin:0 -12px 12px}
.jhpp-gal__track{display:flex;list-style:none;margin:0;padding:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;background:var(--jhpp-surface)}
.jhpp-gal__track::-webkit-scrollbar{display:none}
.jhpp-gal__track:focus-visible{outline:2px solid var(--jhpp-green);outline-offset:-2px}
.jhpp-gal__slide{flex:0 0 100%;aspect-ratio:1/1;scroll-snap-align:center;scroll-snap-stop:always;margin:0;background:var(--jhpp-surface)}
.jhpp-gal__img{display:block;width:100%;height:100%;object-fit:contain;margin:0;border-radius:0}
.jhpp-thumbs{display:flex;gap:8px;list-style:none;margin:10px 0 0;padding:0 12px;overflow-x:auto;scrollbar-width:none}
.jhpp-thumbs::-webkit-scrollbar{display:none}
.jhpp-thumb{flex:none;width:56px;height:56px;padding:2px;border:2px solid var(--jhpp-border);border-radius:10px;background:#fff;cursor:pointer;overflow:hidden}
.jhpp-thumb[aria-current="true"]{border-color:var(--jhpp-green)}
.jhpp-thumb:hover,.jhpp-thumb:focus{background:#fff;border-color:var(--jhpp-green)}
.jhpp-thumb__img{display:block;width:100%;height:100%;object-fit:contain;margin:0}

/* Info */
.jhpp-title{margin:0 0 4px;font-size:22px;line-height:1.25;font-weight:700;color:var(--jhpp-text);letter-spacing:-.01em}
.jhpp-unit{margin:0 0 6px;font-size:14px;color:var(--jhpp-muted)}
.jhpp-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;min-height:34px;margin:6px 0 4px}
.jhpp-price__now{font-size:26px;line-height:1.2;font-weight:800;color:var(--jhpp-text)}
.jhpp-price__now .amount{font-weight:800}
.jhpp-price__was{font-size:15px;color:var(--jhpp-muted)}
.jhpp-price__off{font-size:12px;font-weight:700;color:var(--jhpp-accent);border:1px solid var(--jhpp-accent);border-radius:6px;padding:3px 7px;line-height:1}
.jhpp-price ins{background:none;text-decoration:none}
.jhpp-price [hidden]{display:none!important}

.jhpp-stock{display:flex;align-items:center;gap:6px;margin:0 0 12px;font-size:14px;font-weight:600;min-height:22px;color:var(--jhpp-green)}
.jhpp-stock__no{display:none}
.jhpp-stock.is-out{color:var(--jhpp-accent)}
.jhpp-stock.is-out .jhpp-stock__ok{display:none}
.jhpp-stock.is-out .jhpp-stock__no{display:inline}
.jhpp-stock.is-backorder{color:var(--jhpp-accent)}
.jhpp-incart{margin-left:auto;font-size:12px;font-weight:700;color:var(--jhpp-green-dark);background:var(--jhpp-green-light);border-radius:999px;padding:3px 9px}
.jhpp-incart[hidden]{display:none}

/* Option pills */
.jhpp-opts{margin:0 0 12px}
.jhpp-opt{border:0;margin:0 0 12px;padding:0;min-width:0}
.jhpp-opt__label{padding:0;margin:0 0 6px;font-size:14px;font-weight:700;color:var(--jhpp-text)}
.jhpp-opt__row{display:flex;flex-wrap:wrap;gap:8px}
.jhpp-pill{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:56px;min-height:44px;padding:0 16px;border:1.5px solid var(--jhpp-border);border-radius:10px;background:#fff;color:var(--jhpp-text);font-size:14px;font-weight:600;cursor:pointer;transition:border-color .15s,background-color .15s}
.jhpp-pill__in{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.jhpp-pill:hover{border-color:var(--jhpp-green)}
.jhpp-pill.is-on{border-color:var(--jhpp-green);background:var(--jhpp-green-light);color:var(--jhpp-green-dark);font-weight:700}
.jhpp-pill.is-on .jhpp-pill__t::before{content:"\2713";margin-right:6px}
.jhpp-pill.is-focus{outline:2px solid var(--jhpp-green);outline-offset:2px}
.jhpp-pill.is-off{opacity:.5;cursor:not-allowed;background:var(--jhpp-surface)}
.jhpp-pill.is-off .jhpp-pill__t{text-decoration:line-through}
.jhpp-pill.is-off .jhpp-pill__in{cursor:not-allowed}
.jhpp-opts__msg{margin:4px 0 0;font-size:13px;font-weight:600;color:var(--jhpp-accent)}
.jhpp-opts__msg[hidden]{display:none}
.jhpp-opt__clear{margin:0 0 12px;padding:6px 0;border:0;background:none;color:var(--jhpp-green);font-size:13px;font-weight:600;text-decoration:underline;cursor:pointer;min-height:32px}
.jhpp-opt__clear:hover,.jhpp-opt__clear:focus{background:none;color:var(--jhpp-green-dark)}

/* Buy bar: fixed above the app-shell bottom nav on mobile, inline on desktop */
.jhpp-buy{position:fixed;left:0;right:0;bottom:var(--jhpp-nav-h,0px);z-index:90;display:flex;align-items:center;gap:10px;padding:8px 12px calc(8px + env(safe-area-inset-bottom,0px));background:#fff;border-top:1px solid var(--jhpp-border);box-shadow:0 -2px 8px rgba(60,50,30,.06)}
html.jhpp-has-nav .jhpp-buy{padding-bottom:8px}
.jhpp-qty{display:flex;align-items:center;flex:none;height:48px;border:1.5px solid var(--jhpp-green);border-radius:10px;background:#fff;overflow:hidden}
.jhpp-qty__b{width:44px;height:100%;padding:0;margin:0;border:0;border-radius:0;background:transparent;color:var(--jhpp-green);font-size:22px;font-weight:700;line-height:1;cursor:pointer}
.jhpp-qty__b:hover,.jhpp-qty__b:focus{background:var(--jhpp-green-light);color:var(--jhpp-green-dark)}
.jhpp-qty__b:active{background:var(--jhpp-green);color:#fff}
.jhpp-qty__b:disabled{opacity:.4;cursor:not-allowed;background:transparent;color:var(--jhpp-green)}
.jhpp-qty__v{min-width:28px;text-align:center;font-size:16px;font-weight:700;color:var(--jhpp-text)}
.jhpp-buy__price{flex:none;min-width:52px;font-size:16px;font-weight:800;color:var(--jhpp-text);white-space:nowrap}
.jhpp-add{flex:1;min-width:120px;height:48px;padding:0 14px;margin:0;border:0;border-radius:10px;background:var(--jhpp-green);color:#fff;font-size:14px;font-weight:800;letter-spacing:.04em;line-height:1;text-transform:none;cursor:pointer;transition:background-color .15s;font-family:inherit}
.jhpp-add:hover,.jhpp-add:focus,.jhpp-add:active{background:var(--jhpp-green-dark);color:#fff}
.jhpp-add[aria-disabled="true"],.jhpp-add:disabled{background:var(--jhpp-border);color:var(--jhpp-muted);cursor:not-allowed}
.jhpp-add[aria-busy="true"]{opacity:.8;cursor:progress}
.jhpp-buy [hidden]{display:none!important}

.jhpp-delivery{display:flex;align-items:flex-start;gap:8px;margin:14px 0 0;padding:10px 12px;border:1px solid var(--jhpp-border);border-radius:12px;background:var(--jhpp-surface);color:var(--jhpp-text);font-size:14px;line-height:1.35}
.jhpp-delivery svg{flex:none;margin-top:1px;color:var(--jhpp-green)}
.jhpp-trust{display:flex;flex-wrap:wrap;gap:6px 14px;list-style:none;margin:12px 0 0;padding:0;font-size:13px;color:var(--jhpp-muted)}
.jhpp-trust li{display:inline-flex;align-items:center;gap:5px;margin:0}
.jhpp-trust svg{color:var(--jhpp-green)}
.jhpp-noscript{font-size:13px;color:var(--jhpp-accent)}

/* Sections */
.jhpp-sec{margin:20px 0 0;grid-column:1/-1}
.jhpp-sec__h{margin:0 0 8px;font-size:18px;line-height:1.25;font-weight:700;color:var(--jhpp-text)}
.jhpp-about__body{font-size:15px;line-height:1.6;color:var(--jhpp-text)}
.jhpp-about__body p{margin:0 0 .8em}
.jhpp-about__body.is-clamped{max-height:190px;overflow:hidden;-webkit-mask-image:linear-gradient(#000 70%,transparent);mask-image:linear-gradient(#000 70%,transparent)}
.jhpp-more{margin-top:6px;min-height:44px;padding:0 4px;border:0;background:none;color:var(--jhpp-green);font-size:14px;font-weight:700;cursor:pointer;font-family:inherit}
.jhpp-more:hover,.jhpp-more:focus{background:none;color:var(--jhpp-green-dark);text-decoration:underline}
.jhpp-more[hidden]{display:none}
.jhpp-details__t{overflow-x:auto}
.jhpp-details__t table{width:100%;border-collapse:collapse;font-size:14px;margin:0;border:0}
.jhpp-details__t th,.jhpp-details__t td{padding:10px 8px;text-align:left;border:0;border-bottom:1px solid var(--jhpp-border);background:none;vertical-align:top}
.jhpp-details__t th{width:40%;font-weight:600;color:var(--jhpp-muted)}
.jhpp-details__t td p{margin:0}
.jhpp-related{margin-inline:-12px;max-width:none}

/* Toast */
.jhpp-toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--jhpp-nav-h,0px) + var(--jhpp-bar-h,72px) + 12px);z-index:95;display:flex;align-items:center;gap:12px;max-width:min(92vw,420px);padding:10px 14px;border-radius:10px;background:var(--jh-green-d,#17612f);color:#fff;font-size:14px;line-height:1.3;opacity:0;pointer-events:none;transition:opacity .2s}
.jhpp-toast.is-on{opacity:1;pointer-events:auto}
.jhpp-toast.is-err{background:var(--jh-orange,#b85c0a)}
.jhpp-toast a{color:#fff;font-weight:700;text-decoration:underline;white-space:nowrap}

/* Scroll room below the footer for the fixed bar (mobile only) */
.jhpp-spacer{height:var(--jhpp-bar-h,72px)}

@media (min-width:600px){.jhpp-title{font-size:24px}}

/* Desktop: two columns, bar becomes inline */
@media (min-width:1024px){
  .jhpp-back{display:none}
  .jhpp-page .woocommerce-breadcrumb{display:block}
  div.product.jhpp{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);column-gap:48px;align-items:start;padding:12px 24px 32px}
  .jhpp-gal{margin:0;grid-column:1;max-width:560px}
  div.product.jhpp .summary{grid-column:2;float:none!important;width:auto!important;margin:0!important}
  .jhpp-gal__slide{border-radius:16px;overflow:hidden}
  .jhpp-gal__track{border-radius:16px}
  .jhpp-thumbs{padding:0}
  .jhpp-title{font-size:30px}
  .jhpp-price__now{font-size:32px}
  .jhpp-buy{position:static;z-index:auto;padding:0;margin:16px 0 0;background:transparent;border:0;box-shadow:none;max-width:440px}
  html.jhpp-has-nav .jhpp-buy{padding-bottom:0}
  .jhpp-buy__price{display:none}
  .jhpp-add{min-width:180px}
  .jhpp-toast{bottom:24px}
  .jhpp-spacer{display:none}
  .jhpp-related{margin-inline:0}
  .jhpp-sec{margin-top:32px}
}
@media (prefers-reduced-motion:reduce){.jhpp-pill,.jhpp-add,.jhpp-toast{transition:none}}

/* WooCommerce price-range helper text must stay screen-reader only */
.jhpp .screen-reader-text{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}