/* Shafaq 1.5.27 — storefront cards, full-width related grid and one-click AJAX buy UI. */

/* Product-card actions used by custom layout modules and native WooCommerce loops. */
.ts-product-card,
.ts-related-card,
.woocommerce ul.products li.product{min-width:0}
.ts-product-card{display:flex;flex-direction:column}
.ts-product-card .ts-product-meta{margin-bottom:10px}
.ts-card-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:auto;padding-top:9px}
.ts-card-action{min-width:0;min-height:36px;display:inline-flex;align-items:center;justify-content:center;padding:7px 8px;border-radius:10px;border:1px solid #dfe7ee;font:inherit;font-size:10.5px;font-weight:800;line-height:1.35;text-decoration:none!important;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,background .16s ease,border-color .16s ease;white-space:nowrap}
.ts-card-view{background:#fff;color:#35516b!important}
.ts-card-view:hover{background:#f5f8fb;border-color:#cbd8e2;transform:translateY(-1px)}
.ts-card-buy{background:var(--ts-accent,#0b95c9)!important;border-color:var(--ts-accent,#0b95c9)!important;color:#fff!important;box-shadow:0 5px 14px color-mix(in srgb,var(--ts-accent,#0b95c9) 18%,transparent)}
.ts-card-buy:hover{transform:translateY(-1px);box-shadow:0 8px 20px color-mix(in srgb,var(--ts-accent,#0b95c9) 26%,transparent)}
.ts-card-buy.is-loading{pointer-events:none;opacity:.72}
.ts-card-buy.is-loading:after{content:'';width:12px;height:12px;margin-inline-start:6px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:tsQuickSpin .65s linear infinite}
.ts-card-buy.is-added{background:#15915b!important;border-color:#15915b!important;animation:tsQuickSuccess .55s ease}
.ts-card-added{animation:tsCardAdded .7s ease}
.woocommerce ul.products li.product{display:flex!important;flex-direction:column!important}
.woocommerce ul.products li.product .ts-card-actions{width:100%;clear:both}
.woocommerce ul.products li.product .ts-card-action{font-size:10.5px!important;padding:8px 6px!important;margin:0!important;float:none!important;width:auto!important}
.ts-ranked-body .ts-card-actions{margin-top:8px}
.ts-ranked-body .ts-card-action{font-size:9.5px;min-height:32px;padding:6px}

/* Related products: own markup so WooCommerce/theme legacy column rules cannot squeeze cards. */
body.single-product .ts-related-products{
  grid-column:1/-1!important;
  display:block!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:18px 0 0!important;
  padding:20px!important;
  background:#fff;
  border:1px solid #e4ebf1;
  border-radius:20px;
  box-shadow:0 10px 30px rgba(23,45,67,.045);
  overflow:hidden;
}
.ts-related-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid #edf1f4}
.ts-related-head h2{position:relative;margin:0!important;padding-right:12px;font-size:19px!important;line-height:1.6;color:#20344c}
.ts-related-head h2:before{content:'';position:absolute;right:0;top:5px;bottom:5px;width:4px;border-radius:999px;background:var(--ts-accent,#0b95c9)}
.ts-related-head span{font-size:10px;color:#7a8794;background:#f4f7f9;border:1px solid #e7edf2;border-radius:999px;padding:5px 9px;white-space:nowrap}
.ts-related-grid{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:13px!important;width:100%!important;max-width:none!important;min-width:0!important;margin:0!important;padding:0!important;align-items:stretch}
.ts-related-card{position:relative;display:flex;flex-direction:column;width:auto!important;max-width:none!important;min-width:0!important;margin:0!important;padding:10px;border:1px solid #e4eaf0;border-radius:15px;background:#fff;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;overflow:hidden}
.ts-related-card:hover{transform:translateY(-3px);border-color:#d3dfe8;box-shadow:0 12px 26px rgba(22,45,67,.075)}
.ts-related-image{display:grid;place-items:center;aspect-ratio:1/1;width:100%;margin-bottom:9px;padding:7px;border-radius:12px;background:#f8fafc;overflow:hidden}
.ts-related-image img{display:block!important;width:100%!important;height:100%!important;max-width:100%!important;max-height:none!important;object-fit:contain!important;margin:0!important;padding:0!important;background:transparent!important}
.ts-related-card h3{margin:0 0 8px;font-size:11.5px;line-height:1.75;min-height:40px;color:#263b51;overflow:hidden}
.ts-related-card h3 a{color:inherit;text-decoration:none}
.ts-related-meta{display:flex;align-items:flex-end;justify-content:space-between;gap:7px;min-height:28px;margin-bottom:2px}
.ts-related-price{font-size:11px;font-weight:900;color:#17804e;min-width:0}
.ts-related-price del{font-size:9px;color:#9ba5af}.ts-related-price ins{text-decoration:none}
.ts-related-rating{font-size:9px;color:#df970e;white-space:nowrap}
.ts-related-sale{position:absolute;z-index:2;top:16px;left:16px;display:grid;place-items:center;min-width:26px;height:23px;padding:0 6px;border-radius:8px;background:#ef4056;color:#fff;font-size:10px;font-weight:900}

/* Make the middle-width single-product purchase panel compact instead of a tall empty slab. */
@media (min-width:821px) and (max-width:1180px){
  body.single-product .woocommerce div.product.type-product{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:18px!important}
  body.single-product .ts-purchase-panel{
    grid-column:1/-1!important;grid-row:auto!important;position:static!important;display:grid!important;
    grid-template-columns:minmax(230px,.85fr) minmax(320px,1.15fr)!important;
    gap:0 24px!important;align-items:start!important;min-height:0!important;padding:16px 18px!important
  }
  body.single-product .ts-purchase-seller,body.single-product .ts-purchase-benefits{grid-column:1!important}
  body.single-product .ts-purchase-price,body.single-product .ts-purchase-cart,body.single-product .ts-purchase-note{grid-column:2!important}
  body.single-product .ts-purchase-price{grid-row:1!important;padding-top:0!important}
  body.single-product .ts-purchase-cart{grid-row:2/4!important}
  body.single-product .ts-purchase-benefits{padding-bottom:0!important;border-bottom:0!important}
}

/* Quick-buy quantity dialog. */
.ts-quick-buy-layer[hidden],.ts-cart-toast[hidden]{display:none!important}
.ts-quick-buy-layer{position:fixed;inset:0;z-index:10090;display:grid;place-items:center;padding:16px}
.ts-quick-buy-backdrop{position:absolute;inset:0;border:0;background:rgba(13,26,39,.42);backdrop-filter:blur(2px);cursor:default}
.ts-quick-buy-dialog{position:relative;z-index:1;width:min(92vw,390px);padding:17px;border:1px solid #e1e8ee;border-radius:18px;background:#fff;box-shadow:0 24px 70px rgba(12,28,44,.24);direction:rtl;animation:tsQuickIn .2s ease both}
.ts-quick-buy-close{position:absolute;top:9px;left:9px;z-index:2;width:34px;height:34px;border:0;border-radius:10px;background:#f1f5f8;color:#5a6877;font-size:24px;line-height:1;cursor:pointer}
.ts-quick-buy-product{display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px;align-items:center;padding-left:34px}
.ts-quick-buy-image{width:72px;height:72px;object-fit:contain;border:1px solid #e7edf2;border-radius:12px;background:#f8fafc;padding:5px}
.ts-quick-buy-product>div{display:grid;gap:5px;min-width:0}.ts-quick-buy-product strong{font-size:12px;line-height:1.7;color:#23384e}.ts-quick-buy-product small{font-size:10px;color:#16814d;font-weight:800}
.ts-quick-buy-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:15px;padding-top:13px;border-top:1px solid #edf1f4;font-size:11px;font-weight:800;color:#536374}
.ts-quick-buy-qty{display:grid;grid-template-columns:34px 58px 34px;align-items:center;border:1px solid #dce5ec;border-radius:11px;overflow:hidden;background:#fff}
.ts-quick-buy-qty button{height:36px;border:0;background:#f6f8fa;color:#35516b;font-size:18px;cursor:pointer}
.ts-quick-buy-input{width:58px!important;height:36px!important;border:0!important;border-right:1px solid #e4e9ee!important;border-left:1px solid #e4e9ee!important;border-radius:0!important;text-align:center!important;padding:0 4px!important;background:#fff!important;box-shadow:none!important;appearance:textfield}
.ts-quick-buy-input::-webkit-inner-spin-button,.ts-quick-buy-input::-webkit-outer-spin-button{appearance:none;margin:0}
.ts-quick-buy-submit,.ts-quick-buy-cart-link{width:100%;min-height:43px;display:flex;align-items:center;justify-content:center;margin-top:13px;padding:9px 12px;border-radius:12px;font:inherit;font-size:11px;font-weight:900;text-decoration:none!important}
.ts-quick-buy-submit{border:0;background:var(--ts-accent,#0b95c9);color:#fff;cursor:pointer;box-shadow:0 7px 18px color-mix(in srgb,var(--ts-accent,#0b95c9) 20%,transparent)}
.ts-quick-buy-submit[disabled]{opacity:.7;cursor:wait}
.ts-quick-buy-cart-link{border:1px solid #cfe5d8;background:#f2fbf6;color:#16814d!important}
.ts-quick-buy-status{min-height:18px;margin:8px 0 0;font-size:10px;text-align:center;color:#657586}
.ts-quick-buy-dialog.is-success{border-color:#bde4cb;box-shadow:0 24px 70px rgba(15,110,65,.18)}
.ts-cart-toast{position:fixed;z-index:10110;right:22px;bottom:22px;max-width:min(88vw,360px);padding:11px 15px;border-radius:12px;background:#17384a;color:#fff;font-size:11px;font-weight:800;box-shadow:0 14px 35px rgba(12,28,44,.2);animation:tsToastIn .22s ease both}

@keyframes tsQuickSpin{to{transform:rotate(360deg)}}
@keyframes tsQuickSuccess{0%{transform:scale(1)}45%{transform:scale(1.05)}100%{transform:scale(1)}}
@keyframes tsCardAdded{0%{box-shadow:0 0 0 0 rgba(21,145,91,.28)}50%{box-shadow:0 0 0 5px rgba(21,145,91,.08)}100%{box-shadow:0 0 0 0 rgba(21,145,91,0)}}
@keyframes tsQuickIn{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
@keyframes tsToastIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

@media(max-width:1250px){.ts-related-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
@media(max-width:920px){.ts-related-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(max-width:820px){
  body.single-product .ts-purchase-panel{display:block!important}
  .ts-related-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:700px){
  body.single-product .ts-related-products{padding:12px!important;border-radius:16px}
  .ts-related-head{margin-bottom:11px;padding-bottom:9px}.ts-related-head h2{font-size:15px!important}.ts-related-head span{font-size:9px}
  .ts-related-grid{gap:8px!important}
  .ts-related-card{padding:7px;border-radius:12px}.ts-related-image{padding:4px;border-radius:9px;margin-bottom:6px}
  .ts-related-card h3{font-size:10px;min-height:34px;margin-bottom:5px}.ts-related-price{font-size:9.5px}.ts-related-rating{font-size:8px}
  .ts-card-actions{gap:5px;padding-top:7px}.ts-card-action{min-height:33px;font-size:9px;padding:6px 4px;border-radius:8px}
  .woocommerce ul.products li.product .ts-card-action{font-size:9px!important;padding:7px 3px!important}
  .ts-quick-buy-dialog{width:min(94vw,390px);padding:14px;border-radius:16px}.ts-quick-buy-product{grid-template-columns:62px minmax(0,1fr);gap:9px}.ts-quick-buy-image{width:62px;height:62px}
  .ts-cart-toast{right:10px;left:10px;bottom:calc(12px + var(--ts-mobile-nav-safe,0px));max-width:none;text-align:center}
}
@media(prefers-reduced-motion:reduce){.ts-card-action,.ts-related-card,.ts-quick-buy-dialog,.ts-cart-toast{animation:none!important;transition:none!important}}

/* ===== Shafaq 1.5.25 fixes ===== */
/* Buy button never navigates. Unsupported/unavailable products stay visibly disabled. */
.ts-card-buy-disabled{opacity:.58!important;cursor:not-allowed!important;box-shadow:none!important;transform:none!important}

/* Variable-product fields inside the compact quick-buy dialog. */
.ts-quick-buy-options{display:grid;gap:9px;margin-top:13px;padding-top:12px;border-top:1px solid #edf1f4}
.ts-quick-buy-options[hidden]{display:none!important}
.ts-quick-buy-option{display:grid;grid-template-columns:92px minmax(0,1fr);gap:10px;align-items:center;font-size:10px;font-weight:800;color:#596a7d}
.ts-quick-buy-option select{width:100%;min-width:0;height:38px;border:1px solid #dce5ec;border-radius:10px;background:#fff;padding:0 9px;font:inherit;color:#263c52}
.ts-quick-buy-status.is-error{color:#c33444;font-weight:800}

/* Single product: purchase box is part of the summary, never sticky/floating over the gallery. */
body.single-product .woocommerce div.product.type-product{
  grid-template-columns:minmax(360px,.98fr) minmax(0,1.02fr)!important;
  gap:24px!important;
  align-items:start!important;
}
body.single-product .woocommerce div.product div.images{
  grid-column:1!important;
  grid-row:1!important;
  position:relative!important;
  z-index:1!important;
  align-self:start!important;
  opacity:1!important;
  visibility:visible!important;
  min-width:0!important;
  min-height:440px;
}
body.single-product .woocommerce div.product div.summary{
  grid-column:2!important;
  grid-row:1!important;
  position:relative!important;
  z-index:1!important;
  min-width:0!important;
}
body.single-product .summary .ts-purchase-panel,
body.single-product .ts-purchase-panel{
  position:static!important;
  inset:auto!important;
  top:auto!important;
  right:auto!important;
  left:auto!important;
  bottom:auto!important;
  grid-column:auto!important;
  grid-row:auto!important;
  width:100%!important;
  max-width:100%!important;
  margin:18px 0 0!important;
  display:block!important;
  transform:none!important;
  z-index:auto!important;
}
body.single-product .woocommerce-tabs{grid-column:1/-1!important;grid-row:2!important}
body.single-product .ts-related-products{grid-column:1/-1!important;grid-row:3!important}
body.single-product .woocommerce-product-gallery{opacity:1!important;visibility:visible!important}
body.single-product .woocommerce-product-gallery .flex-viewport,
body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__wrapper{min-width:0!important}
body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image,
body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image a{box-sizing:border-box}
body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image img{display:block!important;opacity:1!important;visibility:visible!important}

/* Guarantee the homepage hero remains visible on phones, even before/without slider JS. */
@media(max-width:767px){
  .ts-hero-slider,
  body.ts-template-layout-medical-shafagh .ts-medical-hero-main .ts-hero-slider{
    display:block!important;
    position:relative!important;
    width:100%!important;
    max-width:100%!important;
    height:clamp(176px,52vw,250px)!important;
    min-height:176px!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    overflow:hidden!important;
    background:#eef5f8!important;
  }
  .ts-hero-slider .ts-banner{
    display:block!important;
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    visibility:visible!important;
  }
  .ts-hero-slider .ts-banner:first-child{opacity:1;z-index:1}
  .ts-hero-slider .ts-banner.is-active{opacity:1!important;z-index:2!important}
  .ts-hero-slider .ts-banner picture,
  .ts-hero-slider .ts-banner img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
  }
  .ts-hero-slider .ts-banner img{object-fit:contain!important;background:#eef5f8}
  body.ts-template-layout-medical-shafagh .ts-medical-hero-main{display:block!important;min-width:0!important}
  body.ts-template-layout-medical-shafagh .ts-medical-hero-main .ts-banner img{object-fit:contain!important;min-height:0!important}

  /* Mobile product gallery: force WooCommerce's initially transparent gallery visible
     and give its stage a real height so images cannot collapse to zero. */
  body.single-product .woocommerce div.product.type-product{display:block!important;padding:12px!important}
  body.single-product .woocommerce div.product div.images{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-height:0!important;
    margin:0 0 16px!important;
    opacity:1!important;
    visibility:visible!important;
    overflow:visible!important;
  }
  body.single-product .woocommerce-product-gallery{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-height:0!important;
    opacity:1!important;
    visibility:visible!important;
  }
  body.single-product .woocommerce-product-gallery .flex-viewport{
    display:block!important;
    width:100%!important;
    min-height:300px!important;
    border-radius:16px!important;
    overflow:hidden!important;
  }
  body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__wrapper{min-height:300px!important;margin:0!important}
  body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image,
  body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image a{
    min-height:300px!important;
    width:100%!important;
  }
  body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image a{display:grid!important;place-items:center!important;padding:10px!important}
  body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image img{
    display:block!important;
    width:auto!important;
    max-width:100%!important;
    height:auto!important;
    max-height:300px!important;
    margin:auto!important;
    object-fit:contain!important;
    opacity:1!important;
    visibility:visible!important;
  }
  body.single-product .woocommerce-product-gallery .flex-control-thumbs{
    display:flex!important;
    grid-column:auto!important;
    grid-row:auto!important;
    width:100%!important;
    max-width:100%!important;
    margin-top:9px!important;
    padding:0!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    gap:8px!important;
  }
  body.single-product .woocommerce-product-gallery .flex-control-thumbs li{flex:0 0 64px!important;width:64px!important;min-width:64px!important}
  body.single-product .woocommerce div.product div.summary{display:block!important;width:100%!important;max-width:100%!important;margin:0!important}
  body.single-product .summary .ts-purchase-panel{margin-top:14px!important}
  .ts-quick-buy-option{grid-template-columns:1fr;gap:5px}
}

@media(min-width:768px) and (max-width:980px){
  body.single-product .woocommerce div.product.type-product{grid-template-columns:minmax(300px,.9fr) minmax(0,1.1fr)!important;gap:18px!important}
  body.single-product .woocommerce div.product div.images{min-height:360px}
  body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image a{min-height:340px!important}
  body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image img{max-height:330px!important}
}
@media(max-width:767px){
  body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__wrapper>.woocommerce-product-gallery__image:first-child{display:block!important;opacity:1!important;visibility:visible!important}
}

/* 1.5.27 direct-buy feedback. */
.ts-card-buy.is-error{background:#c63b4a!important;border-color:#c63b4a!important;box-shadow:none!important}
.ts-cart-toast.is-error{background:#a72d3a!important}
.ts-direct-buy{cursor:pointer}

/* ===== Shafaq 1.5.27 — mobile hero must never render as an empty white box ===== */
@media(max-width:767px){
  .ts-hero-slider .ts-banner{
    background-color:#eef5f8!important;
    background-image:var(--ts-hero-fallback-image,none)!important;
    background-repeat:no-repeat!important;
    background-position:center!important;
    background-size:contain!important;
  }
  .ts-hero-slider .ts-banner picture{
    display:block!important;
    position:relative!important;
    z-index:1!important;
    width:100%!important;
    height:100%!important;
  }
  .ts-hero-slider .ts-banner img{
    display:block!important;
    opacity:1!important;
    visibility:visible!important;
    position:relative!important;
    z-index:1!important;
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
  }
}

/* ===== Shafaq 1.5.28 — remove the tall empty medical hero band ===== */
body.ts-template-layout-medical-shafagh .ts-medical-hero-main .ts-hero-slider{
  width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;
  aspect-ratio:4.8/1!important;background:#fff!important
}
body.ts-template-layout-medical-shafagh .ts-medical-hero-main .ts-hero-slider .ts-banner,
body.ts-template-layout-medical-shafagh .ts-medical-hero-main .ts-hero-slider .ts-banner picture,
body.ts-template-layout-medical-shafagh .ts-medical-hero-main .ts-hero-slider .ts-banner img{
  width:100%!important;height:100%!important;min-height:0!important;max-height:none!important
}
body.ts-template-layout-medical-shafagh .ts-medical-hero-main .ts-hero-slider .ts-banner img{
  object-fit:contain!important;background:#fff!important
}
@media(max-width:767px){
  body.ts-template-layout-medical-shafagh .ts-medical-hero-main .ts-hero-slider{
    height:auto!important;min-height:0!important;aspect-ratio:4.8/1!important;border-radius:16px!important
  }
}

