/* Tokarshop storefront media/UI fix v5.38
   Targeted polish only: media containment, clean photo zones, stronger brand block.
   Carbide insert media remains excluded from automatic restyling. */

/* Header brand: restore a stronger visual presence without crowding search/actions. */
.brand{
  width:282px!important;
  height:68px!important;
  flex:0 0 282px!important;
  background-position:left center!important;
  background-size:contain!important;
  background-repeat:no-repeat!important;
}

/* Never expose loading/broken homepage media as empty white cards. */
.ts-product.media-pending,
.ts-category.media-pending{
  visibility:hidden!important;
  pointer-events:none!important;
}

/* Shared product media: preserve the entire object and create a clean studio photo zone. */
.product-image:not(.excluded-media),
.product-gallery:not(.excluded-media-gallery) .product-gallery-main{
  background:#fff!important;
  border-color:#e9ece9!important;
  box-shadow:inset 0 0 0 1px rgba(32,35,38,.025)!important;
  overflow:hidden!important;
}
.product-image:not(.excluded-media)>img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  box-sizing:border-box!important;
  padding:7.5% 7.5% 9%!important;
}
.product-gallery:not(.excluded-media-gallery) .product-gallery-main>img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  box-sizing:border-box!important;
  padding:7.5% 7.5% 9.5%!important;
}
.product-gallery:not(.excluded-media-gallery) .product-gallery-thumbs button{
  background:#fff!important;
  border-color:#e9ece9!important;
}
.product-gallery:not(.excluded-media-gallery) .product-gallery-thumbs img{
  object-fit:contain!important;
  object-position:center center!important;
  padding:7%!important;
}

/* Homepage hero art: white photo stage masks opaque white source canvases cleanly. */
.ts-art{
  height:272px!important;
  padding:10px!important;
  background:#fff!important;
  border:1px solid #e9ece9!important;
  border-radius:14px!important;
  box-shadow:inset 0 0 0 1px rgba(32,35,38,.02)!important;
  overflow:hidden!important;
}
.ts-art picture{width:100%!important;height:100%!important}
.ts-art img{
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  box-sizing:border-box!important;
  padding:15px 18px 20px!important;
}

/* Homepage category and stock rails: more vertical breathing room for drills/taps/tooling. */
.ts-category-photo{
  height:172px!important;
  background:#fff!important;
  border-bottom:1px solid #ecefed!important;
  box-shadow:inset 0 0 0 1px rgba(32,35,38,.02)!important;
  overflow:hidden!important;
}
.ts-category-photo img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  box-sizing:border-box!important;
  padding:15px 16px 19px!important;
}
.ts-product{
  grid-template-rows:196px minmax(66px,auto) auto!important;
}
.ts-product-image{
  height:196px!important;
  background:#fff!important;
  border:1px solid #e9ece9!important;
  box-shadow:inset 0 0 0 1px rgba(32,35,38,.02)!important;
  overflow:hidden!important;
}
.ts-product-image img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  box-sizing:border-box!important;
  padding:15px 16px 20px!important;
}

/* Modal/details keep generous containment, especially for long vertical tools. */
.detail-layout .product-gallery-main{
  min-height:clamp(360px,42vw,500px);
}
.detail-layout .product-image.large:not(.excluded-media){
  min-height:clamp(360px,42vw,500px);
}

/* Search/cart/recent thumbs remain compact but never crop the product. */
.suggest-thumb img,
.cart-line .product-image>img,
.recent-thumb .product-image>img{
  object-fit:contain!important;
  object-position:center center!important;
}

@media(max-width:1240px){
  .brand{width:248px!important;height:60px!important;flex-basis:248px!important}
}
@media(max-width:980px){
  .brand{width:214px!important;height:52px!important;flex-basis:214px!important}
  .ts-art{height:248px!important}
}
@media(max-width:768px){
  .brand{width:164px!important;height:44px!important;flex-basis:164px!important}
  .ts-art{height:170px!important;padding:7px!important}
  .ts-art img{padding:9px 11px 13px!important}
  .ts-category-photo{height:142px!important}
  .ts-category-photo img{padding:11px 12px 15px!important}
  .ts-product{grid-template-rows:158px minmax(64px,auto) auto!important}
  .ts-product-image{height:158px!important}
  .ts-product-image img{padding:11px 12px 15px!important}
  .detail-layout .product-gallery-main,
  .detail-layout .product-image.large:not(.excluded-media){min-height:0}
}
@media(max-width:390px){
  .brand{width:154px!important;height:42px!important;flex-basis:154px!important}
  .ts-category-photo{height:132px!important}
  .ts-product{grid-template-rows:154px minmax(64px,auto) auto!important}
  .ts-product-image{height:154px!important}
}


/* v5.39 containment hardening:
   size the rendered bitmap itself, not only its box, so long tools always have visible air on all four sides. */
.ts-art picture,
.ts-category-photo,
.ts-product-image,
.product-image:not(.excluded-media),
.product-gallery:not(.excluded-media-gallery) .product-gallery-main{
  display:grid!important;
  place-items:center!important;
}

.ts-art{
  height:290px!important;
}
.ts-art img{
  width:auto!important;
  height:auto!important;
  max-width:82%!important;
  max-height:82%!important;
  padding:0!important;
  margin:auto!important;
  object-fit:contain!important;
  object-position:center center!important;
  transform:none!important;
}

.ts-category-photo{
  height:190px!important;
}
.ts-category-photo img{
  width:auto!important;
  height:auto!important;
  max-width:76%!important;
  max-height:76%!important;
  padding:0!important;
  margin:auto!important;
  object-fit:contain!important;
  object-position:center center!important;
  transform:none!important;
}

.ts-product{
  grid-template-rows:210px minmax(66px,auto) auto!important;
}
.ts-product-image{
  height:210px!important;
}
.ts-product-image img{
  width:auto!important;
  height:auto!important;
  max-width:78%!important;
  max-height:78%!important;
  padding:0!important;
  margin:auto!important;
  object-fit:contain!important;
  object-position:center center!important;
  transform:none!important;
}

/* Catalog cards use the same real-size constraint rather than a padded 100% bitmap. */
.product-image:not(.excluded-media)>img{
  width:auto!important;
  height:auto!important;
  max-width:82%!important;
  max-height:82%!important;
  padding:0!important;
  margin:auto!important;
  object-fit:contain!important;
  object-position:center center!important;
  transform:none!important;
}

/* Product detail/modal: preserve the whole photographed object with extra room for long tools. */
.product-gallery:not(.excluded-media-gallery) .product-gallery-main>img{
  width:auto!important;
  height:auto!important;
  max-width:84%!important;
  max-height:84%!important;
  padding:0!important;
  margin:auto!important;
  object-fit:contain!important;
  object-position:center center!important;
  transform:none!important;
}
.product-gallery:not(.excluded-media-gallery) .product-gallery-thumbs img{
  width:auto!important;
  height:auto!important;
  max-width:86%!important;
  max-height:86%!important;
  margin:auto!important;
  padding:0!important;
  object-fit:contain!important;
  object-position:center center!important;
}

/* Keep the studio zone visible around pale/white products. */
.ts-art,
.ts-category-photo,
.ts-product-image,
.product-image:not(.excluded-media),
.product-gallery:not(.excluded-media-gallery) .product-gallery-main{
  background:#fbfcfb!important;
  border-color:#e3e7e4!important;
  box-shadow:inset 0 0 0 1px rgba(32,35,38,.035)!important;
}

@media(max-width:980px){
  .ts-art{height:260px!important}
  .ts-category-photo{height:166px!important}
  .ts-product{grid-template-rows:184px minmax(66px,auto) auto!important}
  .ts-product-image{height:184px!important}
}
@media(max-width:768px){
  .ts-art{height:185px!important}
  .ts-art img{max-width:84%!important;max-height:84%!important}
  .ts-category-photo{height:150px!important}
  .ts-category-photo img{max-width:78%!important;max-height:78%!important}
  .ts-product{grid-template-rows:166px minmax(64px,auto) auto!important}
  .ts-product-image{height:166px!important}
  .ts-product-image img{max-width:80%!important;max-height:80%!important}
  .product-image:not(.excluded-media)>img{max-width:84%!important;max-height:84%!important}
  .product-gallery:not(.excluded-media-gallery) .product-gallery-main>img{max-width:86%!important;max-height:86%!important}
}